gitadmin/sk_fems_ui
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

init dev-push code ui base design

Browse Source
This commit is contained in:
leonard
2025-07-22 09:58:38 +07:00
parent ffdf5ccb66
commit eedbf94d56
214 changed files with 42170 additions and 28040 deletions
Download Patch File Download Diff File Expand all files Collapse all files

347
pages/ems/base/EnrgCostCenterMngPage.vue
View File

@ -3,8 +3,8 @@
<v-row ref="searchFilter">
<v-col :cols="12">
<v-card class="searchFilter">
<v-row align="center" no-gutters>
<v-col :cols="3">
<v-row align="end" no-gutters>
<v-col :cols="2.5">
<component
:is="'selectCodeList'"
:parentPrgmId="myPrgmId"
@ -12,9 +12,11 @@
dataKey="searchLocKind"
:sendParam="{ commGrpCd: 'EM_LOC_KIND', useFg: '1' }"
:addAll="true"
:iconShow="true"
customClass="select-large"
/>
</v-col>
<v-col :cols="3">
<v-col :cols="2.5">
<component
:is="'selectCodeList'"
:parentPrgmId="myPrgmId"
@ -22,10 +24,12 @@
dataKey="searchEccKind"
:sendParam="{ commGrpCd: 'EM_ECC_KIND', useFg: '1' }"
:addAll="true"
:iconShow="true"
customClass="select-large"
/>
</v-col>
<v-col :cols="3">
<!-- 사업장 -->
<!-- <v-col :cols="3">
사업장
<div style="visibility:hidden">
<component
:is="'SelectBlocMstr'"
@ -33,13 +37,8 @@
:parentPrgmId="myPrgmId"
/>
</div>
</v-col>
<v-col :cols="3" class="text-right">
<BtnSearch @click="search" />
</v-col>
</v-row>
<v-row align="center" no-gutters>
<v-col :cols="3">
</v-col> -->
<v-col :cols="2.5">
<component
:is="'selectCodeList'"
:parentPrgmId="myPrgmId"
@ -47,18 +46,23 @@
dataKey="useFg"
:sendParam="{ commGrpCd: 'CO_USEFG', useFg: '1' }"
:addAll="true"
:iconShow="true"
customClass="select-large"
/>
</v-col>
<v-col :cols="6">
<v-col :cols="2.5">
<InputText
:parentPrgmId="myPrgmId"
label="공정명"
valueNm="eccNm"
:labelCols="2"
:textCols="9"
:labelCols="12"
:textCols="12"
:searchOption="true"
:iconShow="true"
customClass="input-large"
/>
</v-col>
<BtnSearch @click="search" size="large" />
</v-row>
</v-card>
</v-col>
@ -75,16 +79,17 @@
:btnActionsFnc="btnActions"
/>
</div>
<div class="px-5" style="height:calc(100% - 76px)">
<div ref="gridParent" class="w100 h100">
<div class="px-5" style="min-height:calc(100% - 76px)">
<div ref="gridParent" class="w100 h100 pb-2">
<component
:ref="gridName"
:is="loadGrid ? 'Grid' : null"
:is="loadGrid ? 'Grid' : null"
:gridName="gridName"
:parentPrgmId="myPrgmId"
@getRowsData="getRowData"
@sendSelectedRowStatInfo="getSelectedRowStatInfo"
:selectedRowDataWatchFlag="true"
:dataPath="dataPathMock"
/>
</div>
</div>
@ -191,13 +196,15 @@ export default {
gridName: 'rowGrid',
loadGrid: false,
tab: null,
selectedRowKey: null,
// rowSelectionStatus: {},
dataPathMock : { },
items: [
{ name: '공정 정보', id: 'eccBaseInfoTab', disabledFlag: false },
{ name: '공정 추가 정보', id: 'eccAddInfoTab', disabledFlag: false },
{ name: '공정 연결 정보', id: 'eccIaoTab', disabledFlag: false },
],
detailList: myDetail,
loadGrid: false,
};
},
computed: {
@ -313,11 +320,23 @@ export default {
},
mounted() {
this.init();
this.$nextTick(() => {
// const checkbox = document.getElementById('headerCheckbox');
// if (checkbox) {
// checkbox.addEventListener('change', this.handleHeaderCheckboxChange);
// }
});
},
beforeDestroy() {
this.chkOpenTabList({ key: 'destroy', prgmId: myPrgmId });
},
methods: {
handleHeaderCheckboxChange(event) {
const checked = event.target.checked;
this.dataPathMock.rowGrid.data.forEach(row => {
row.selected = checked;
});},
...mapMutations({
setPageData: 'setPageData',
}),
@ -332,7 +351,41 @@ export default {
blocId: this.userInfo.blocId,
});
},
gridInitTest() {
const rowGrid = {
column: [
{
header: '',
name: '',
align: 'center',
width: 50,
formatter: (props) => {
return `<label class="custom-radio">
<span class="radio-mark"></span>
</label>`;
}
},
{ header: '공정 정보', name: 'eccNm', align: 'left' },
{ header: '현재 상태', name: 'status', align: 'center' },
{ header: '공정 유형', name: 'eccKind', align: 'left' },
{ header: '사용 여부', name: 'useFg', align: 'center' },
],
data: dataMockExample,
defaultRow: dataMockExample,
option: {
...gridOptions,
},
}
this.dataPathMock = {rowGrid};
this.$nextTick(() => {
this.loadGrid = true;
});
},
gridInit() {
// Test
this.gridInitTest(); return;
// End test
const gridHeight = this.$refs.gridParent.offsetHeight - 30;
const gridWidth = this.$refs.gridParent.offsetWidth;
@ -545,6 +598,16 @@ export default {
});
},
async getRowData(data) {
//Progess and fake radio
// const rowKey = data.rowKey;
// this.selectedRowKey = rowKey;
// Object.keys(this.rowSelectionStatus).forEach(key => {
// this.$set(this.rowSelectionStatus, key, false);
// });
// this.$set(this.rowSelectionStatus, rowKey, true);
this.setEccAddInfo(data);
this.setEccIao(data);
this.setGridSelectData({
@ -560,6 +623,9 @@ export default {
rowGridSelectKey: data.rowKey,
rowGridSelectData: Object.assign({}, data),
});
//fake radio need recheck
// this.$refs[this.gridName]?.repaint?.();
},
async setEccAddInfo(data) {
this.setPageData({
@ -862,9 +928,12 @@ const myDetail = [
valueNm: 'eccId',
readonly: true,
cols: 6,
class: 'py-2',
labelCols: 12,
textCols: 12,
class: 'py-2 pr-4',
required: false,
placeholder: '시스템 자동입력',
iconShow: true
},
{
type: 'InputText',
@ -872,34 +941,23 @@ const myDetail = [
valueNm: 'eccNm',
disabled: false,
cols: 6,
class: 'py-2',
labelCols: 12,
textCols: 12,
class: 'py-2 pl-4',
required: true,
iconShow: true
},
//CustomeInput fakedata and not using in real code
// {
// type: "ReadPlcPop",
// label: "상위 검침개소",
// valueNm: "upEccId",
// disabled: false,
// cols: 6,
// class: "py-2",
// required: true
// },
// {
// type: "InputText",
// valueNm: "upEccNm",
// label: "상위 검침개소명",
// readonly: true,
// cols: 6,
// class: "py-2"
// },
// {
// type: "InputText",
// label: "상위 공정 코드",
// valueNm: "upEccId",
// disabled: false,
// cols: 6,
// class: "py-2",
// required: true
// type: 'CustomInput',
// labelContent: '상위 공정',
// cols: 6,
// valueNm: 'eccNm',
// labelCols: 12,
// textCols: 12,
// class: 'py-2',
// required: true,
// iconShow: true
// },
{
type: 'FtnPlcFormPop',
@ -909,29 +967,42 @@ const myDetail = [
disabled: false,
required: true,
cols: 6,
class: 'py-2',
labelCols: 4,
textCols: 7,
labelCols: 12,
textCols: 12,
class: 'pb-0 mb-0 pr-4',
disableContent: true,
},
{
type: 'InputText',
valueNm: 'upEccNm',
readonly: true,
cols: 5,
class: 'py-2',
},
{
type: 'SelectBox',
label: '위치 유형',
valueNm: 'locKind',
disabled: false,
cols: 6,
class: 'py-2',
labelCols: 12,
textCols: 12,
class: 'py-2 mb-0 pb-0 pl-4',
list: 'locKindList',
itemText: 'commCdNm',
itemValue: 'commCd',
required: true,
iconShow: true,
},
{
type: 'InputText',
valueNm: 'upEccNm',
readonly: true,
cols: 6,
class: 'py-2 pr-4',
},
{
// 공백 처리
type: 'Label',
cols: 6,
class: 'py-2 pl-4',
disabled: false,
labelCols: 12,
textCols: 12,
iconShow: true,
},
{
type: 'SelectBox',
@ -939,11 +1010,14 @@ const myDetail = [
valueNm: 'eccKind',
disabled: false,
cols: 6,
class: 'py-2',
labelCols: 12,
textCols: 12,
class: 'py-2 pr-4',
list: 'eccKindList',
itemText: 'commCdNm',
itemValue: 'commCd',
addNull: true,
iconShow: true
},
{
type: 'InputText',
@ -951,8 +1025,11 @@ const myDetail = [
valueNm: 'sortSeq',
disabled: false,
cols: 6,
class: 'py-2',
labelCols: 12,
textCols: 12,
class: 'py-2 pl-4',
inputType: 'number',
iconShow: true
// onkeydown : "if(this.value > 100) this.value = 100;if(this.value < 0) this.value = 0;if(this.value == '') this.value = 0;"
},
{
@ -961,10 +1038,13 @@ const myDetail = [
valueNm: 'blocId',
disabled: false,
cols: 6,
class: 'py-2',
labelCols: 12,
textCols: 12,
class: 'py-2 pr-4',
list: 'blocIdList',
itemText: 'blocNm',
itemValue: 'blocId',
iconShow: true
},
{
type: 'CheckBox',
@ -972,8 +1052,11 @@ const myDetail = [
valueNm: 'useFg',
disabled: false,
cols: 6,
class: 'py-2',
labelCols: 12,
textCols: 12,
class: 'py-2 pl-4',
value: { '1': true, '0': false },
iconShow: true,
required: true,
},
{
@ -982,11 +1065,147 @@ const myDetail = [
valueNm: 'eccFg',
disabled: false,
cols: 6,
class: 'py-2',
class: 'py-2 pr-4',
iconShow: true,
value: { '1': true, '0': false },
},
];
const dataMockExample = [
{
eccId: 'ECC000001',
eccNm: 'EGP_HVAC_LT_CH001',
status: '운영중',
eccKind: '공정',
useFg: '1',
_children: [
{
eccId: 'ECC000002',
eccNm: 'B01',
status: '대기',
eccKind: '공정',
useFg: '1',
_children: [
{
eccId: 'ECC000005',
eccNm: 'B01-1',
status: '운영중',
eccKind: '공정',
useFg: '1',
_children: [
{
eccId: 'ECC000009',
eccNm: 'B01-1-1',
status: '운영중',
eccKind: '공정',
useFg: '1'
},
{
eccId: 'ECC0000010',
eccNm: 'B01-1-2',
status: '운영중',
eccKind: '공정',
useFg: '1'
},
{
eccId: 'ECC0000011',
eccNm: 'B01-1-3',
status: '운영중',
eccKind: '공정',
useFg: '1'
},
]
},
{
eccId: 'ECC000006',
eccNm: 'B01-2',
status: '점검중',
eccKind: '공정',
useFg: '0',
_children: [
{
eccId: 'ECC0000013',
eccNm: 'B01-2-1',
status: '운영중',
eccKind: '공정',
useFg: '1'
},
{
eccId: 'ECC0000014',
eccNm: 'B01-1-2',
status: '운영중',
eccKind: '공정',
useFg: '1'
},
{
eccId: 'ECC0000015',
eccNm: 'B01-1-3',
status: '운영중',
eccKind: '공정',
useFg: '1'
},
]
},
{
eccId: 'ECC000007',
eccNm: 'B01-3',
status: '운영중',
eccKind: '공정',
useFg: '1',
_children: [
{
eccId: 'ECC000009',
eccNm: 'B01-3-1',
status: '운영중',
eccKind: '공정',
useFg: '1'
},
{
eccId: 'ECC0000010',
eccNm: 'B01-3-2',
status: '운영중',
eccKind: '공정',
useFg: '1'
},
{
eccId: 'ECC0000011',
eccNm: 'B01-3-3',
status: '운영중',
eccKind: '공정',
useFg: '1'
},
]
},
],
},
{
eccId: 'ECC000003',
eccNm: 'B02',
status: '운영중',
eccKind: '공정',
useFg: '1',
},
{
eccId: 'ECC000004',
eccNm: 'B03',
status: '점검중',
eccKind: '공정',
useFg: '0',
},
],
},
];
const gridOptions = {
treeColumnOptions: {
name: 'eccNm', // Showing tree table
useIcon: false, // Not using icon
indentWidth: 10,// spacing when showing children
},
header: {
height: 40,
},
rowHeight: 35,
showCheckbox: false,
};
</script>
<style lang="scss">
@import '@/assets/scss/common.scss';
</style>