resolve conflict

This commit is contained in:
leonard
2025-07-29 09:36:40 +07:00
28 changed files with 2179 additions and 2892 deletions

View File

@ -92,9 +92,12 @@
background: map-deep-get($config, #{$theme}, "basic-button-background"); background: map-deep-get($config, #{$theme}, "basic-button-background");
} }
.searchFilter{
.search-button { .search-button {
height: 40px;
color: map-deep-get($config, #{$theme}, "search-btn-color"); color: map-deep-get($config, #{$theme}, "search-btn-color");
} }
}
.v-dialog { .v-dialog {
.ant-btn-icon-only { .ant-btn-icon-only {
@ -135,6 +138,15 @@
background: map-deep-get($config, #{$theme}, "ant-btn-danger-bg") !important; background: map-deep-get($config, #{$theme}, "ant-btn-danger-bg") !important;
} }
} }
&.expand-btn {
.v-icon {
color: map-deep-get($config, #{$theme}, "basic-button-color");
svg {
fill: map-deep-get($config, #{$theme}, "basic-button-color");
}
}
}
} }
} }
} }
@ -162,3 +174,12 @@
background:none; background:none;
} }
} }
.ant-btn {
&.expand-btn {
.v-icon {
span {
margin-right: 8px;
}
}
}
}

View File

@ -98,6 +98,17 @@
@include theme($theme); @include theme($theme);
.v-application.#{$theme}-mode { .v-application.#{$theme}-mode {
.grid-title {
font-weight: 600;
font-size: 16px;
line-height: 24px;
letter-spacing: 0;
color: map-deep-get($config,
#{$theme},
"tui-grid-title-color"
);
}
.tui-grid { .tui-grid {
&-table { &-table {
border: 1px solid; border: 1px solid;

View File

@ -102,6 +102,7 @@ $config: (
v-calendar-day-color: #fff, v-calendar-day-color: #fff,
v-calendar-day-in-not-month-color: rgba(255, 255, 255, 0.05), v-calendar-day-in-not-month-color: rgba(255, 255, 255, 0.05),
v-calendar-is-today-background-color: #2d4571, v-calendar-is-today-background-color: #2d4571,
tui-grid-title-color: #FFFFFFD9,
tui-grid-header-backgroundColor: #2a2b2d, tui-grid-header-backgroundColor: #2a2b2d,
tui-grid-header-color: #FFFFFFD9, tui-grid-header-color: #FFFFFFD9,
tui-grid-border-horziontal-color: #212224, tui-grid-border-horziontal-color: #212224,
@ -238,6 +239,7 @@ $config: (
v-calendar-day-color: #111, v-calendar-day-color: #111,
v-calendar-day-in-not-month-color: #f8f8f8, v-calendar-day-in-not-month-color: #f8f8f8,
v-calendar-is-today-background-color: #e3eaf3, v-calendar-is-today-background-color: #e3eaf3,
tui-grid-title-color: #000000E0,
tui-grid-header-backgroundColor: #fafafa, //#e0e0e0, tui-grid-header-backgroundColor: #fafafa, //#e0e0e0,
tui-grid-header-color: rgba(0, 0, 0, 0.88), tui-grid-header-color: rgba(0, 0, 0, 0.88),
tui-grid-border-horziontal-color: #e0e0e0, tui-grid-border-horziontal-color: #e0e0e0,

View File

@ -1,5 +1,5 @@
// Gauge chart options // Gauge chart options
export default function getGaugeChartOption({ title, value, min = 0, max = 160, unit = '%', isDarkMode = false, backgroundRadius = 97 }) { export default function getGaugeChartOption({ title, min = 0, max = 160, unit = '%', isDarkMode = false, backgroundRadius = 97 }) {
const colorRanges = isDarkMode const colorRanges = isDarkMode
? [ ? [
[0.375, '#49AA19'], // Dark Green [0.375, '#49AA19'], // Dark Green

View File

@ -2,7 +2,7 @@
export default function getLineChartOption({ export default function getLineChartOption({
xAxisData = [], xAxisData = [],
seriesData = [], seriesData = [],
legendData = [], // legendData = [],
isDarkMode = false, isDarkMode = false,
}) { }) {
@ -31,7 +31,7 @@ export default function getLineChartOption({
}, },
legend: { legend: {
data: legendData, // data: legendData,
icon: 'circle', icon: 'circle',
top: '0%', top: '0%',
right: '5%', right: '5%',

View File

@ -71,14 +71,12 @@
</div> </div>
</div> </div>
<v-card-actions class="px-6 py-4 d-flex align-center justify-end"> <v-card-actions class="px-6 py-4 d-flex align-center justify-end">
<!-- <v-btn :ripple="false" @click="setUpdate($event)">확인</v-btn>
<v-btn :ripple="false" @click="dialogOpenCloseEvent(dialog)">닫기</v-btn> --> <a-button :ripple="false" @click="dialogOpenCloseEvent(dialog)"
<!-- <v-btn v-if="item.closeBtnFg || false" :ripple="false" @click="deleteBtnAction($event)">삭제</v-btn> -->
<a-button :ripple="false" @click="setUpdate($event)" class="mr-2">확인</a-button>
<a-button :ripple="false" type="primary" @click="dialogOpenCloseEvent(dialog)"
class="mr-2">닫기</a-button> class="mr-2">닫기</a-button>
<a-button v-if="item.closeBtnFg || false" :ripple="false" icon="delete" type="danger" ghost danger <a-button v-if="item.closeBtnFg || false" :ripple="false" type="danger" ghost danger
@click="deleteBtnAction($event)">삭제</a-button> @click="deleteBtnAction($event)" class="mr-2">삭제</a-button>
<a-button :ripple="false" type="primary" @click="setUpdate($event)" >확인</a-button>
</v-card-actions> </v-card-actions>
</v-card> </v-card>
</v-dialog> </v-dialog>
@ -298,46 +296,46 @@ export default {
}, },
async setSelectValueList01() { async setSelectValueList01() {
// form으로 popup 사용할 때 인자로 eqpmKindId, eqpmGrpId 보내줘야한다. // form으로 popup 사용할 때 인자로 eqpmKindId, eqpmGrpId 보내줘야한다.
// let res = await this.postApiReturn({ let res = await this.postApiReturn({
// apiKey: 'selectEqpmGrpCodeList', apiKey: 'selectEqpmGrpCodeList',
// resKey: 'eqpmGrpCodeLists', resKey: 'eqpmGrpCodeLists',
// sendParam: { sendParam: {
// eqpmKindId: eqpmKindId:
// this.item.eqpmKindId != undefined this.item.eqpmKindId != undefined
// ? this.item.eqpmKindId ? this.item.eqpmKindId
// : this.searchParam.eqpmKindId, : this.searchParam.eqpmKindId,
// }, },
// // form을 통해 popup을 사용할 경우 -> this.item.eqpmKindId 사용 // form을 통해 popup을 사용할 경우 -> this.item.eqpmKindId 사용
// // 부모 페이지에서 설비종류인 eqpmKindId 값을 꼭 가져와야한다. // 부모 페이지에서 설비종류인 eqpmKindId 값을 꼭 가져와야한다.
// }); });
// if (res.length > 0) { if (res.length > 0) {
// this.selectValueList01 = await res.map(obj => { this.selectValueList01 = await res.map(obj => {
// return { return {
// text: obj.eqpmGrpNm, text: obj.eqpmGrpNm,
// value: obj.eqpmGrpId, value: obj.eqpmGrpId,
// }; };
// }); });
// // form을 통해 popup을 사용할 경우 -> this.item.eqpmGrpId 사용 // form을 통해 popup을 사용할 경우 -> this.item.eqpmGrpId 사용
// // 부모 페이지에서 설비그룹을 선택한 값이 있다면(eqpmGrpId) 그 값으로 바인딩 아닐 경우 조회한 데이터의 첫번째 값으로 선택 // 부모 페이지에서 설비그룹을 선택한 값이 있다면(eqpmGrpId) 그 값으로 바인딩 아닐 경우 조회한 데이터의 첫번째 값으로 선택
// // console.log('this.item.eqpmGrpId : ', this.item.eqpmGrpId); // console.log('this.item.eqpmGrpId : ', this.item.eqpmGrpId);
// // console.log('this.searchParam.eqpmGrpId : ', this.searchParam.eqpmGrpId); // console.log('this.searchParam.eqpmGrpId : ', this.searchParam.eqpmGrpId);
// this.selectValue01 = this.selectValue01 =
// this.item.eqpmGrpId != undefined this.item.eqpmGrpId != undefined
// ? this.item.eqpmGrpId ? this.item.eqpmGrpId
// : this.searchParam.eqpmGrpId != undefined : this.searchParam.eqpmGrpId != undefined
// ? this.searchParam.eqpmGrpId ? this.searchParam.eqpmGrpId
// : this.selectValueList01[0].value; : this.selectValueList01[0].value;
// } else { } else {
// this.selectValueList01 = []; this.selectValueList01 = [];
// this.selectValue01 = null; this.selectValue01 = null;
// } }
this.selectValueList01 = [ // this.selectValueList01 = [
{ label: '냉동기고온', value: '냉동기고온' }, // { label: '냉동기고온', value: '냉동기고온' },
{ label: '냉동기저온', value: '냉동기저온' }, // { label: '냉동기저온', value: '냉동기저온' },
{ label: '공조기', value: '공조기' }, // { label: '공조기', value: '공조기' },
{ label: '보일러', value: '보일러' } // { label: '보일러', value: '보일러' }
]; // ];
}, },
search() { search() {
this.getGridData(); this.getGridData();
@ -388,44 +386,35 @@ export default {
this.loadGrid = false; this.loadGrid = false;
let res = []; let res = [];
// res = await this.postApiReturn({ res = await this.postApiReturn({
// apiKey: 'selectEgrpPysclQtyPop', apiKey: 'selectEgrpPysclQtyPop',
// resKey: 'egrpPysclQtyData', resKey: 'egrpPysclQtyData',
// sendParam: { sendParam: {
// searchWord: this.searchWord, searchWord: this.searchWord,
// eqpmGrpId: this.selectValue01, eqpmGrpId: this.selectValue01,
// openMode: this.item.openMode, openMode: this.item.openMode,
// }, },
// }); });
// let newRes = []; let newRes = [];
// let tempTagList = this.pyscPopVal.split('/*wq2a/'); let tempTagList = this.pyscPopVal.split('/*wq2a/');
// let tagList = tempTagList.filter(item => item != ''); let tagList = tempTagList.filter(item => item != '');
// if (tagList.length > 0) { if (tagList.length > 0) {
// newRes = res.filter(item => { newRes = res.filter(item => {
// return !tagList.includes(item.pysclQtyId); return !tagList.includes(item.pysclQtyId);
// }); });
// res = newRes; res = newRes;
// }
// //이미 선택된 값들 제거(배열)
// if (this.item.dataList) {
// if (this.item.dataList.length > 0) {
// newRes = res.filter(item => {
// return !this.item.dataList.includes(item.pysclQtyId);
// });
// res = newRes;
// }
// }
res = [
{
'pysclQtyId': 'PYSCL00001',
'pysclQtyCd': 'AMP_1A',
'pysclQtyNm': '회로1 전류A',
'pysclQtyTpNm': 'TAG'
} }
]
//이미 선택된 값들 제거(배열)
if (this.item.dataList) {
if (this.item.dataList.length > 0) {
newRes = res.filter(item => {
return !this.item.dataList.includes(item.pysclQtyId);
});
res = newRes;
}
}
this.setModalGridData({ this.setModalGridData({
modalKey: this.myModalKey, modalKey: this.myModalKey,
gridKey: this.grid_01, gridKey: this.grid_01,

View File

@ -2,12 +2,8 @@
<v-row class="search-box" align="center"> <v-row class="search-box" align="center">
<v-col :cols="option.labelCols" class="py-0"> <v-col :cols="option.labelCols" class="py-0">
<label for="" class="search-box-label"> <label for="" class="search-box-label">
<v-icon <v-icon v-if="item.iconShow" small
v-if="item.iconShow" :class="['mr-1', item.required ? 'icon-orange' : 'icon-blue']">$icoBulletPoint</v-icon>
small
:class="['mr-1', item.required ? 'icon-orange' : 'icon-blue']"
>$icoBulletPoint</v-icon
>
{{ option.labelContent }} {{ option.labelContent }}
</label> </label>
</v-col> </v-col>
@ -30,9 +26,9 @@
<div class="pa-6 pt-0"> <div class="pa-6 pt-0">
<v-row align="center"> <v-row align="center">
<v-col :cols="5"> <v-col :cols="5">
<component :is="'SelectBox'" ref="SelectBox1" :labelCols="12" :textCols="12" :iconShow="true" <component :is="'SelectBox'" ref="SelectBox1" :labelCols="12" :textCols="12"
:propsValue="selectValue01" :itemList="selectValueList01" :label="'설비그룹'" :iconShow="true" :propsValue="selectValue01" :itemList="selectValueList01"
@update:propsValue="selectValue01 = $event" :readonly="item.openMode == undefined :label="'설비그룹'" @update:propsValue="selectValue01 = $event" :readonly="item.openMode == undefined
? openMode ? openMode
: item.openMode == 'ALL' : item.openMode == 'ALL'
? false ? false
@ -47,9 +43,9 @@
물리량명 물리량명
</label> </label>
</v-col> </v-col>
<v-col :cols="9"> <v-text-field append-icon="" class="v-input__custom" <v-col :cols="9"> <v-text-field append-icon="" class="v-input__custom" outlined
outlined :hide-details="true" v-model="searchWord" :hide-details="true" v-model="searchWord" @keyup.enter="search"><template
@keyup.enter="search"><template v-slot:append> v-slot:append>
<!-- Custom SVG icon --> <!-- Custom SVG icon -->
<v-icon>$icoSearch</v-icon> <v-icon>$icoSearch</v-icon>
@ -76,9 +72,9 @@
</div> </div>
</div> </div>
<v-card-actions class="px-6 py-4 d-flex align-center justify-end"> <v-card-actions class="px-6 py-4 d-flex align-center justify-end">
<a-button :ripple="false" @click="setUpdate($event)" class="mr-2">확인</a-button> <a-button :ripple="false" @click="dialogOpenCloseEvent(dialog)" class="mr-2">닫기</a-button>
<a-button :ripple="false" type="primary" @click="dialogOpenCloseEvent(dialog)" <a-button :ripple="false" type="primary" @click="setUpdate($event)">확인</a-button>
class="mr-2">닫기</a-button>
</v-card-actions> </v-card-actions>
</v-card> </v-card>
</v-dialog> </v-dialog>
@ -274,36 +270,30 @@ export default {
this.gridInit(); this.gridInit();
}, },
async setSelectValueList01() { async setSelectValueList01() {
// let res = await this.postApiReturn({ let res = await this.postApiReturn({
// apiKey: 'selectEqpmGrpCodeList', apiKey: 'selectEqpmGrpCodeList',
// resKey: 'eqpmGrpCodeLists', resKey: 'eqpmGrpCodeLists',
// sendParam: { eqpmKindId: this.searchParam.eqpmKindId }, sendParam: { eqpmKindId: this.searchParam.eqpmKindId },
// // 부모 페이지에서 설비종류인 eqpmKindId 값을 꼭 가져와야한다. // 부모 페이지에서 설비종류인 eqpmKindId 값을 꼭 가져와야한다.
// }); });
// if (res.length > 0) { if (res.length > 0) {
// this.selectValueList01 = await res.map(obj => { this.selectValueList01 = await res.map(obj => {
// return { return {
// text: obj.eqpmGrpNm, text: obj.eqpmGrpNm,
// value: obj.eqpmGrpId, value: obj.eqpmGrpId,
// }; };
// }); });
// // 부모 페이지에서 설비그룹을 선택한 값이 있다면(eqpmGrpId) 그 값으로 바인딩 아닐 경우 조회한 데이터의 첫번째 값으로 선택 // 부모 페이지에서 설비그룹을 선택한 값이 있다면(eqpmGrpId) 그 값으로 바인딩 아닐 경우 조회한 데이터의 첫번째 값으로 선택
// this.selectValue01 = this.selectValue01 =
// this.searchParam.eqpmGrpId != undefined this.searchParam.eqpmGrpId != undefined
// ? this.searchParam.eqpmGrpId ? this.searchParam.eqpmGrpId
// : this.selectValueList01[0].value; : this.selectValueList01[0].value;
// // this.selectValue01 = this.selectValueList01[0].value; // this.selectValue01 = this.selectValueList01[0].value;
// } else { } else {
// this.selectValueList01 = []; this.selectValueList01 = [];
// this.selectValue01 = null; this.selectValue01 = null;
// } }
this.selectValueList01 = [
{ label: '냉동기고온', value: '냉동기고온' },
{ label: '냉동기저온', value: '냉동기저온' },
{ label: '공조기', value: '공조기' },
{ label: '보일러', value: '보일러' }
];
}, },
search() { search() {
this.getGridData(); this.getGridData();
@ -341,33 +331,25 @@ export default {
}, },
async getGridData() { async getGridData() {
this.loadGrid = false; this.loadGrid = false;
// let res = [];
// let res = await this.postApiReturn({
// apiKey: 'selectEqpmBaseInfoPop',
// resKey: 'epqmBaseInfoData',
// sendParam: {
// eqpmGrpId: this.selectValue01,
// searchWord: this.searchWord,
// // openMode : this.item.openMode == undefined ? this.openMode : this.item.openMode
// },
// });
// // grid와 popup eqpmId 값 중복되는 것 제거하는 로직 - 시작
// let newRes = [];
// if (this.bindingGridEqpmIdList.length > 0) {
// newRes = res.filter(item => {
// return !this.bindingGridEqpmIdList.includes(item.eqpmId);
// });
// res = newRes;
// }
// grid와 popup eqpmId 값 중복되는 것 제거하는 로직 - 끝
const res = [
{
'eqpmId': 'PYSCL00001',
'eqpmNm': 'AMP_1A',
let res = await this.postApiReturn({
apiKey: 'selectEqpmBaseInfoPop',
resKey: 'epqmBaseInfoData',
sendParam: {
eqpmGrpId: this.selectValue01,
searchWord: this.searchWord,
// openMode : this.item.openMode == undefined ? this.openMode : this.item.openMode
},
});
// grid와 popup eqpmId 값 중복되는 것 제거하는 로직 - 시작
let newRes = [];
if (this.bindingGridEqpmIdList.length > 0) {
newRes = res.filter(item => {
return !this.bindingGridEqpmIdList.includes(item.eqpmId);
});
res = newRes;
} }
] // grid와 popup eqpmId 값 중복되는 것 제거하는 로직 - 끝
this.setModalGridData({ this.setModalGridData({
modalKey: this.myModalKey, modalKey: this.myModalKey,
@ -441,9 +423,9 @@ export default {
// this.dialog = false; // this.dialog = false;
// return; // return;
// } // }
// if (this.myBindingData.length <= 0) { if (this.myBindingData.length <= 0) {
// return alert('설비상세 리스트를 먼저 선택해주세요.'); return alert('설비상세 리스트를 먼저 선택해주세요.');
// } }
this.dialog = !val; this.dialog = !val;
}, },
}, },

View File

@ -36,7 +36,7 @@
계산설명 계산설명
</label> </label>
</v-col> </v-col>
<v-col :cols="10" class="mr-4 py-0" > <v-col :cols="11" class="pr-8 py-0" >
<v-text-field append-icon="" class="v-input__custom" outlined <v-text-field append-icon="" class="v-input__custom" outlined
:hide-details="true" v-model="searchWord" @keyup.enter="search"><template v-slot:append> :hide-details="true" v-model="searchWord" @keyup.enter="search"><template v-slot:append>
<!-- Custom SVG icon --> <!-- Custom SVG icon -->
@ -45,7 +45,7 @@
</template></v-text-field> </template></v-text-field>
</v-col> </v-col>
<v-col cols="1" class="py-0"> <v-col cols="1" class="py-0" style="display: flex; justify-content: flex-end;">
<a-button icon="search" type="primary" @click="search()" class="search-button">조회</a-button> <a-button icon="search" type="primary" @click="search()" class="search-button">조회</a-button>
<!-- <v-btn :ripple="false" @click="initSearch()"> <!-- <v-btn :ripple="false" @click="initSearch()">
초기화 초기화
@ -63,10 +63,8 @@
</div> </div>
</div> </div>
<v-card-actions class="pa-5 d-flex align-center justify-end"> <v-card-actions class="pa-5 d-flex align-center justify-end">
<!-- <v-btn :ripple="false" @click="setUpdate($event)">확인</v-btn> <a-button :ripple="false" @click="dialogOpenCloseEvent(dialog)" class="mr-2">닫기</a-button>
<v-btn :ripple="false" @click="dialogOpenCloseEvent(dialog)">닫기</v-btn> --> <a-button :ripple="false" type="primary" @click="setUpdate($event)" >확인</a-button>
<a-button :ripple="false" @click="setUpdate($event)" class="mr-2">확인</a-button>
<a-button :ripple="false" type="primary" @click="dialogOpenCloseEvent(dialog)">닫기</a-button>
</v-card-actions> </v-card-actions>
</v-card> </v-card>
</v-dialog> </v-dialog>
@ -306,38 +304,22 @@ export default {
}, },
async getGridData() { async getGridData() {
this.loadGrid = false; this.loadGrid = false;
// let res = await this.postApiReturn({ let res = await this.postApiReturn({
// apiKey: 'selectEqpmCalcPop', apiKey: 'selectEqpmCalcPop',
// resKey: 'eqpmCalcPopData', resKey: 'eqpmCalcPopData',
// sendParam: { sendParam: {
// calcDescLike: this.searchWord, calcDescLike: this.searchWord,
// openMode: this.item.openMode != undefined ? this.item.openMode : this.openMode openMode: this.item.openMode != undefined ? this.item.openMode : this.openMode
// },
// });
// if (this.myBindingData['calcProc'] != '' || this.myBindingData['calcProc'] != null || this.myBindingData['calcProc'] != undefined) {
// let newRes = [];
// newRes = res.filter(item => {
// return item.calcProc != this.myBindingData['calcProc']
// });
// res = newRes;
// }
const res = [
{
'calcProc': 'AVG_CNT2',
'argCnt': '2',
'calcDesc': '두개 변수에 대한 평균'
}, },
});
if (this.myBindingData['calcProc'] != '' || this.myBindingData['calcProc'] != null || this.myBindingData['calcProc'] != undefined) {
let newRes = [];
newRes = res.filter(item => {
return item.calcProc != this.myBindingData['calcProc']
});
res = newRes;
}
{ 'calcProc': 'PROC001', argCnt: 2, 'calcDesc': '덧셈 연산' },
{ 'calcProc': 'PROC002', argCnt: 1, 'calcDesc': '제곱 연산' },
{ 'calcProc': 'PROC003', argCnt: 2, 'calcDesc': '곱셈 연산' },
{ 'calcProc': 'PROC004', argCnt: 1, 'calcDesc': '루트 연산' },
{ 'calcProc': 'PROC005', argCnt: 3, 'calcDesc': '최대값 계산' },
{ 'calcProc': 'PROC006', argCnt: 3, 'calcDesc': '최소값 계산' },
]
this.setModalGridData({ this.setModalGridData({
modalKey: this.myModalKey, modalKey: this.myModalKey,
gridKey: this.grid_01, gridKey: this.grid_01,

View File

@ -7,12 +7,15 @@
{{ option.labelContent }} {{ option.labelContent }}
</label> </label>
</v-col> </v-col>
<v-col :cols="option.textCols"> <v-col :cols="option.textCols" class="py-0">
<v-text-field readonly v-model="selectValue" append-icon="mdi-magnify" <v-text-field readonly append-icon="" class="v-input__custom" outlined :hide-details="true"
:class="['v-select__custom', customClass]" v-model="searchWord" @keyup.enter="typeEnterKey" @click="dialogOpenCloseEvent(dialog)"
@click="dialogOpenCloseEvent(dialog)" outlined :hide-details="true" :required="item.required || false"><template v-slot:append>
:required="item.required || false"></v-text-field> <!-- Custom SVG icon -->
<!-- :disabled="item.disabled || false" --> <v-icon>$icoSearch</v-icon>
</template></v-text-field>
</v-col> </v-col>
<v-dialog v-model="dialog" scrollable width="1000px"> <v-dialog v-model="dialog" scrollable width="1000px">
@ -21,10 +24,10 @@
<span class="custom-title-4">{{ option.modalTitle }}</span> <span class="custom-title-4">{{ option.modalTitle }}</span>
<v-icon @click="dialogOpenCloseEvent(dialog)">mdi-close</v-icon> <v-icon @click="dialogOpenCloseEvent(dialog)">mdi-close</v-icon>
</v-card-title> </v-card-title>
<v-row align="end" class="pa-5" no-gutters> <v-row align="end" class="px-5 pb-3" no-gutters>
<v-col :cols="2.5" class="mr-2"> <v-col :cols="2.5" class="mr-2">
<v-row> <v-row>
<v-col :cols="2"> <v-col :cols="12" class="py-0">
<label for="" class="search-box-label"> <label for="" class="search-box-label">
<!-- <v-icon small <!-- <v-icon small
:class="['mr-1', item.required ? 'icon-orange' : 'icon-blue']" :class="['mr-1', item.required ? 'icon-orange' : 'icon-blue']"
@ -32,28 +35,30 @@
검색 검색
</label> </label>
</v-col> </v-col>
<v-col :cols="12"> <v-col :cols="11" class="py-0 pr-3">
<v-text-field append-icon="mdi-magnify" class="v-input__custom" outlined :hide-details="true" <v-text-field append-icon="mdi-magnify" class="v-input__custom" outlined
v-model="searchWord" @keyup.enter="search"></v-text-field> :hide-details="true" v-model="searchWord" @keyup.enter="search"></v-text-field>
</v-col> </v-col>
<a-button icon="search" :ripple="false" type="primary" @click="search()"
class="search-button">조회</a-button>
</v-row> </v-row>
</v-col> </v-col>
<a-button type="primary" :ripple="false" @click="search()">
조회
</a-button>
</v-row> </v-row>
<!-- <div :style="'height: calc(65vh)'"> --> <!-- <div :style="'height: calc(65vh)'"> -->
<div :style="'height: 600px'"> <div :style="'height: 600px'" class="px-5">
<!-- <div :style="{ height: 'calc(100% - 213px)' }"> --> <!-- <div :style="{ height: 'calc(100% - 213px)' }"> -->
<div ref="modalGridParent" class="h100 py-3"> <div ref="modalGridParent" class="h100 py-3">
<!-- :is="loadGrid && dialog ? 'Grid' : null" --> <!-- :is="loadGrid && dialog ? 'Grid' : null" -->
<component :is="loadGrid && dialog ? 'Grid' : null" :gridName="grid_01" <component :is="loadGrid && dialog ? 'Grid' : null" :gridName="grid_01"
:dataPath="searchParam.modalData2.evtObjPop" :parentPrgmId="parentPrgmId" @getRowsData="getRowData" :dataPath="searchParam.modalData2.evtObjPop" :parentPrgmId="parentPrgmId"
@dblClick="setUpdate($event)" /> @getRowsData="getRowData" @dblClick="setUpdate($event)" />
</div> </div>
</div> </div>
<v-card-actions class="pa-5 d-flex align-center justify-end"> <v-card-actions class="pa-5 d-flex align-center justify-end">
<a-button type="default" class="mr-2" :ripple="false" @click="dialogOpenCloseEvent(dialog)">닫기</a-button> <a-button type="default" class="mr-2" :ripple="false"
@click="dialogOpenCloseEvent(dialog)">닫기</a-button>
<a-button type="primary" class="mr-2" :ripple="false" @click="setUpdate('init')">초기화</a-button> <a-button type="primary" class="mr-2" :ripple="false" @click="setUpdate('init')">초기화</a-button>
<a-button type="primary" :ripple="false" @click="setUpdate($event)">확인</a-button> <a-button type="primary" :ripple="false" @click="setUpdate($event)">확인</a-button>
</v-card-actions> </v-card-actions>

View File

@ -1,5 +1,5 @@
<template> <template>
<v-row class="search-box" align="center" > <v-row class="search-box" align="center">
<!-- <v-col v-if="label" cols="2"> --> <!-- <v-col v-if="label" cols="2"> -->
<v-col v-if="item.label" :cols="item.labelCols" class="py-0"> <v-col v-if="item.label" :cols="item.labelCols" class="py-0">
<label for="" class="search-box-label"> <label for="" class="search-box-label">
@ -37,12 +37,11 @@
<v-row align="center"> <v-row align="center">
<v-col v-if="label" cols="12" class="py-0"> <v-col v-if="label" cols="12" class="py-0">
<label for="" class="search-box-label"> <label for="" class="search-box-label">
<v-icon small <v-icon small :class="['mr-1', 'icon-blue']">$icoBulletPoint</v-icon>
:class="['mr-1', 'icon-blue']">$icoBulletPoint</v-icon>
{{ item.label }} {{ item.label }}
</label> </label>
</v-col> </v-col>
<v-col :cols="label ? 6 : ''" class="py-0"> <v-col :cols="label ? 8 : ''" class="py-0">
<!-- :value="textfield" --> <!-- :value="textfield" -->
<v-text-field append-icon="" class="v-input__custom" outlined :hide-details="true" <v-text-field append-icon="" class="v-input__custom" outlined :hide-details="true"
v-model="searchWord" @keyup.enter="typeEnterKey"><template v-slot:append> v-model="searchWord" @keyup.enter="typeEnterKey"><template v-slot:append>
@ -52,13 +51,10 @@
</template></v-text-field> </template></v-text-field>
</v-col> </v-col>
<v-spacer></v-spacer> <!-- <v-spacer></v-spacer> -->
<v-col cols="3" class="text-right"> <v-col cols="2" class="text-right">
<v-btn :ripple="false" icon tile @click="btnTreeExpand()"> <a-button icon="search" type="primary" @click="search()" class="search-button">조회</a-button>
<!-- {{ treeExpand }} -->
<v-icon size="30"
v-text="treeExpandAll ? 'mdi-chevron-up' : 'mdi-chevron-down'"></v-icon>
</v-btn>
<!-- <v-btn color="primary" dark>펼치기</v-btn> --> <!-- <v-btn color="primary" dark>펼치기</v-btn> -->
<!-- <v-btn color="primary" dark>접기</v-btn> --> <!-- <v-btn color="primary" dark>접기</v-btn> -->
<!-- <v-btn :ripple="false">초기화</v-btn> --> <!-- <v-btn :ripple="false">초기화</v-btn> -->
@ -66,6 +62,10 @@
<v-btn v-if="!searchParam.isMulti" :ripple="false" @click="search()">검색</v-btn> --> <v-btn v-if="!searchParam.isMulti" :ripple="false" @click="search()">검색</v-btn> -->
<!-- as-is 봐도 초기화가 하는 기능을 모르겠음.. --> <!-- as-is 봐도 초기화가 하는 기능을 모르겠음.. -->
</v-col> </v-col>
<v-col cols="2" class="text-right"><a-button class="expand-btn" :ripple="false" @click="btnTreeExpand()">
<v-icon small>$icoExpandAlt</v-icon>
Expand All
</a-button></v-col>
</v-row> </v-row>
<!-- <v-btn color="primary" dark @click="btnTreeExpand()">{{ <!-- <v-btn color="primary" dark @click="btnTreeExpand()">{{
@ -78,7 +78,7 @@
</div> </div>
<v-card-text> <v-card-text>
<div ref="treeGridParent" style="height: 500px"> <div ref="treeGridParent" style="height: 450px">
<component :ref="'treeGrid' + parentPrgmId" :is="loadGrid && dialog ? 'Grid' : null" <component :ref="'treeGrid' + parentPrgmId" :is="loadGrid && dialog ? 'Grid' : null"
:gridName="gridNameTree" :dataPath="searchParam.modalData.selectReadObjListTree" :gridName="gridNameTree" :dataPath="searchParam.modalData.selectReadObjListTree"
:parentPrgmId="parentPrgmId" :bindingData="bindingData" @getRowsData="getRowData" :parentPrgmId="parentPrgmId" :bindingData="bindingData" @getRowsData="getRowData"
@ -89,10 +89,10 @@
:tree-data="ftnPlcListTreeData" :tree-data="ftnPlcListTreeData"
/> --> /> -->
</v-card-text> </v-card-text>
<v-divider></v-divider>
<v-card-actions class="px-6 py-4 d-flex align-center justify-end"> <v-card-actions class="px-6 py-4 d-flex align-center justify-end">
<a-button :ripple="false" @click="setUpdate()" class="mr-2">확인</a-button> <a-button :ripple="false" @click="dialog = false" class="mr-2">닫기</a-button>
<a-button :ripple="false" type="primary" @click="dialog = false" class="mr-2">닫기</a-button> <a-button :ripple="false" type="primary" @click="setUpdate($event)">확인</a-button>
</v-card-actions> </v-card-actions>
</v-card> </v-card>
</v-dialog> </v-dialog>
@ -155,7 +155,7 @@ export default {
myModalKey: 'selectReadObjListTree', myModalKey: 'selectReadObjListTree',
gridNameTree: 'treeGrid', gridNameTree: 'treeGrid',
loadGrid: true, loadGrid: false,
dialog: false, dialog: false,
treeData: [], // 리턴받은 원본 트리 데이터 treeData: [], // 리턴받은 원본 트리 데이터
@ -278,7 +278,7 @@ export default {
{ {
header: '검침개소명', header: '검침개소명',
name: 'readPlcNm', name: 'readPlcNm',
width: 370, width: 300,
align: 'left', align: 'left',
}, },
{ header: '검침개소', name: 'name', align: 'center' }, { header: '검침개소', name: 'name', align: 'center' },
@ -289,73 +289,31 @@ export default {
async getTreeData() { async getTreeData() {
this.loadGrid = false; this.loadGrid = false;
// const res = await this.postApiReturn({ const res = await this.postApiReturn({
// apiKey: 'selectReadPlcBaseInfo', apiKey: 'selectReadPlcBaseInfo',
// resKey: 'readPlcBaseInfoData', resKey: 'readPlcBaseInfoData',
// sendParam: { sendParam: {
// blocId: blocId:
// this.searchParam.blocMstrList.length > 0 this.searchParam.blocMstrList.length > 0
// ? this.searchParam.blocMstrList[this.searchParam.blocId].blocId ? this.searchParam.blocMstrList[this.searchParam.blocId].blocId
// : this.searchParam.blocId, //"BL0001", : this.searchParam.blocId, //"BL0001",
// // readObjId: this.searchParam.readObj, // "MTT00001" // 전력 코드 고정 // readObjId: this.searchParam.readObj, // "MTT00001" // 전력 코드 고정
// readObjId: this.searchParam.searchReadObj, // "MTT00001" // 전력 코드 고정 readObjId: this.searchParam.searchReadObj, // "MTT00001" // 전력 코드 고정
// useFg: '1', useFg: '1',
// readPlcNmLike: this.searchWord, readPlcNmLike: this.searchWord,
// }, },
// }); });
const treeData = [ // console.log("treeData", res)
{
readPlcNm: '서울 본사',
name: '본사',
_children: [
{
readPlcNm: '서울 본사 - 1층',
name: '1층',
},
{
readPlcNm: '서울 본사 - 2층',
name: '2층',
},
],
},
{
readPlcNm: '부산 지사',
name: '지사',
_children: [
{
readPlcNm: '부산 지사 - A동',
name: 'A동',
_children: [
{
readPlcNm: '부산 지사 - A동 1층',
name: '1층',
},
{
readPlcNm: '부산 지사 - A동 2층',
name: '2층',
},
],
},
{
readPlcNm: '부산 지사 - B동',
name: 'B동',
},
],
},
{
readPlcNm: '대전 창고',
name: '창고',
},
];
// // console.log("treeData", res)
let myOptionsTree = { let myOptionsTree = {
treeColumnOptions: { treeColumnOptions: {
name: 'readPlcNm', name: 'readPlcNm',
}, },
header: {
height: 37,
},
rowHeight: 'auto',
}; };
if (this.searchParam.isMulti) { if (this.searchParam.isMulti) {
myOptionsTree['rowHeaders'] = [{ type: 'checkbox' }]; myOptionsTree['rowHeaders'] = [{ type: 'checkbox' }];
@ -373,26 +331,26 @@ export default {
// this.treeData = res; // this.treeData = res;
// const ROOT = res[0].plcCd; // const ROOT = res[0].plcCd;
// const setTreeData = await this.setTree({ const setTreeData = await this.setTree({
// gridKey: this.gridNameTree, gridKey: this.gridNameTree,
// treeKey: 'READ_PLC_ID', treeKey: 'READ_PLC_ID',
// value: res.map(item => ({ value: res.map(item => ({
// ...item, ...item,
// rowStat: null, rowStat: null,
// readPlcId: item.readPlcId, readPlcId: item.readPlcId,
// readPlcIdNm: item.readPlcId, readPlcIdNm: item.readPlcId,
// upReadPlcId: upReadPlcId:
// item.upReadPlcId == null || item.upReadPlcId == '' item.upReadPlcId == null || item.upReadPlcId == ''
// ? '' ? ''
// : item.upReadPlcId, : item.upReadPlcId,
// upReadPlcNm: upReadPlcNm:
// item.upReadPlcNm == null || item.upReadPlcNm == '' item.upReadPlcNm == null || item.upReadPlcNm == ''
// ? '' ? ''
// : item.upReadPlcNm, : item.upReadPlcNm,
// blocId: item.blocId, blocId: item.blocId,
// useFg: item.useFg === '1' ? true : false, useFg: item.useFg === '1' ? true : false,
// })), })),
// }); });
// this.treeData = setTreeData; // this.treeData = setTreeData;
@ -400,7 +358,7 @@ export default {
modalKey: this.myModalKey, modalKey: this.myModalKey,
gridKey: this.gridNameTree, gridKey: this.gridNameTree,
modalDataKey: this.modalDataKey, modalDataKey: this.modalDataKey,
value: treeData, value: setTreeData.ROOT || [],
}); });
this.loadGrid = true; this.loadGrid = true;
@ -540,22 +498,4 @@ const selectReadObjListTree = {
} }
} }
@each $theme in dark, light {
.v-application.#{$theme}-mode {
.v-dialog {
.v-card {
&__title {
@if $theme ==dark {
background-color: #2d3355;
.v-btn {
background-color: #2d3355;
}
}
}
}
}
}
}
</style> </style>

View File

@ -8,11 +8,9 @@
</v-col> </v-col>
<v-col :cols="label ? textCols : ''"> <v-col :cols="label ? textCols : ''">
<v-select v-model="selectValue" :items="searchParam[parentPrgmId].blocMstrList" <v-select v-model="selectValue" :items="searchParam[parentPrgmId].blocMstrList"
item-text="blocNm" item-value="idx" append-icon="" class="v-select__custom" outlined :hide-details="true" item-text="blocNm" item-value="idx" append-icon="" outlined
:class="['v-select__custom', customClass]"> :hide-details="true" :class="['v-select__custom', customClass]">
<template v-slot:append> <template v-slot:append><v-icon>$icoChevronDown</v-icon></template>
<v-icon>$icoChevronDown</v-icon>
</template>
</v-select> </v-select>
</v-col> </v-col>
</v-row> </v-row>

View File

@ -0,0 +1,6 @@
<template>
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" class="v-icon" xmlns="http://www.w3.org/2000/svg">
<path
d="M14.1248 1.71225L10.7462 2.13189C10.6283 2.14617 10.5801 2.28903 10.6623 2.37296L11.6391 3.34975L8.89799 6.09082C8.8714 6.11767 8.85649 6.15392 8.85649 6.19171C8.85649 6.2295 8.8714 6.26575 8.89799 6.2926L9.70335 7.09796C9.7587 7.15332 9.84977 7.15332 9.90513 7.09796L12.648 4.3551L13.6248 5.33189C13.6436 5.35072 13.6674 5.36387 13.6934 5.36981C13.7193 5.37576 13.7465 5.37427 13.7716 5.36551C13.7968 5.35675 13.819 5.34107 13.8356 5.32028C13.8523 5.29949 13.8628 5.27443 13.8658 5.24796L14.2837 1.87117C14.2867 1.84961 14.2846 1.82765 14.2776 1.80702C14.2707 1.78639 14.2591 1.76765 14.2437 1.75226C14.2283 1.73687 14.2096 1.72524 14.1889 1.7183C14.1683 1.71136 14.1463 1.70929 14.1248 1.71225ZM6.2962 8.89439C6.26935 8.8678 6.23309 8.85289 6.19531 8.85289C6.15752 8.85289 6.12127 8.8678 6.09442 8.89439L3.35334 11.6372L2.37656 10.6605C2.35771 10.6416 2.33394 10.6285 2.30797 10.6225C2.282 10.6166 2.25487 10.6181 2.22971 10.6268C2.20455 10.6356 2.18236 10.6513 2.16569 10.6721C2.14903 10.6929 2.13856 10.7179 2.13549 10.7444L1.71584 14.1212C1.70513 14.214 1.78192 14.2908 1.87477 14.2801L5.25335 13.8605C5.3712 13.8462 5.41942 13.7033 5.33727 13.6194L4.36049 12.6426L7.10334 9.89974C7.1587 9.84439 7.1587 9.75332 7.10334 9.69796L6.2962 8.89439Z" />
</svg>
</template>

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="pb-5 h100"> <div class="pb-5 h100">
<div class="d-flex align-center justify-space-between"> <div class="d-flex align-center justify-space-between">
<span class="text-h6">공통그룹코드</span> <span class="grid-title">공통그룹코드</span>
<div> <div>
<Buttons <Buttons
:parentPrgmId="parentPrgmId" :parentPrgmId="parentPrgmId"
@ -126,7 +126,7 @@ export default {
{ {
header: '사용여부', header: '사용여부',
name: 'useFg', name: 'useFg',
align: 'center', align: 'left',
formatter({ value }) { formatter({ value }) {
const newValue = _this.pageData.useFgList.filter( const newValue = _this.pageData.useFgList.filter(
item => item.commCd == value, item => item.commCd == value,

View File

@ -271,63 +271,6 @@ export default {
value: myColumns, value: myColumns,
}); });
const res = [
{
"comId": "COM001",
"ercId": "ERC001",
"objMm": "202507",
"objYm": "2025-07",
"unitPrce": 120.5,
"peakPow": 450,
"baseChrg": 30000,
"notiChrg": 32500,
"rmrk": "Standard summer rate",
"blocId": "BLOC001",
"regUserNo": "USER001",
"regDttm": "2025-07-01T09:00:00",
"procUserNo": "USER002",
"procDttm": "2025-07-15T14:30:00"
},
{
"comId": "COM002",
"ercId": "ERC002",
"objMm": "202507",
"objYm": "2025-07",
"unitPrce": 98.75,
"peakPow": 300,
"baseChrg": 25000,
"notiChrg": 27000,
"rmrk": "Reduced rate for solar",
"blocId": "BLOC002",
"regUserNo": "USER003",
"regDttm": "2025-07-02T10:15:00",
"procUserNo": "USER004",
"procDttm": "2025-07-16T11:45:00"
},
{
"comId": "COM003",
"ercId": "ERC003",
"objMm": "202507",
"objYm": "2025-07",
"unitPrce": 110.0,
"peakPow": 400,
"baseChrg": 28000,
"notiChrg": 29500,
"rmrk": "Geothermal adjustment",
"blocId": "BLOC003",
"regUserNo": "USER005",
"regDttm": "2025-07-03T08:45:00",
"procUserNo": "USER006",
"procDttm": "2025-07-17T13:20:00"
}
]
this.setGridData({
gridKey: this.gridName,
value: res,
});
this.loadGrid = true; this.loadGrid = true;
}, },
async btnActions(action) { async btnActions(action) {

View File

@ -1,26 +1,12 @@
<template> <template>
<div> <div>
<div <div class="d-flex justify-space-between">
class="d-flex justify-space-between"
>
<v-card-title class="px-0 pt-0 custom-title-4">검침개소 추가 정보</v-card-title> <v-card-title class="px-0 pt-0 custom-title-4">검침개소 추가 정보</v-card-title>
<Buttons <Buttons :parentPrgmId="parentPrgmId" :bindingData="gridName" :btnActionsFnc="btnActions" />
:parentPrgmId="parentPrgmId"
:bindingData="gridName"
:btnActionsFnc="btnActions"
/>
</div> </div>
<div ref="gridParent"> <div ref="gridParent" style="height: calc(100vh - 520px);">
<Grid <Grid :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName" :parentPrgmId="parentPrgmId"
:ref="gridName" :editorGrid="true" :innerTabGridInfo="innerTabGridInfo" @getRowsData="getRowData" />
:gridName="gridName"
:parentPrgmId="parentPrgmId"
:editorGrid="true"
:innerTabGridInfo="innerTabGridInfo"
@getRowsData="getRowData"
:dataPath="addInfoTabData"
/>
</div> </div>
</div> </div>
</template> </template>
@ -53,65 +39,65 @@ export default {
}, },
data() { data() {
return { return {
loadGrid: true, loadGrid: false,
gridName: 'rowDetailGrid', gridName: 'rowDetailGrid',
rowKey: null, rowKey: null,
edtingFinishFlag: 'Y', edtingFinishFlag: 'Y',
addInfoTabData: { // addInfoTabData: {
"rowDetailGrid": { // "rowDetailGrid": {
data: [ // data: [
{ // {
readPlcNm: '서울 본사', // readPlcNm: '서울 본사',
plcKind: '전기', // plcKind: '전기',
useFg: '1', // useFg: '1',
}, // },
], // ],
column: [ // column: [
// { header: '회사 ID', name: 'comId', hidden: true }, // // { header: '회사 ID', name: 'comId', hidden: true },
{ // {
header: '검침개소명', // header: '검침개소명',
name: 'readPlcNm', // name: 'readPlcNm',
align: 'left', // align: 'left',
minWidth: 400, // minWidth: 400,
}, // },
{ // {
header: '개소 종류', // header: '개소 종류',
name: 'plcKind', // name: 'plcKind',
minWidth: 100, // minWidth: 100,
align: 'center', // align: 'center',
// formatter({ value }) { // // formatter({ value }) {
// let retVal = ''; // // let retVal = '';
// const newValue = _this.pageData.plcKindList.filter( // // const newValue = _this.pageData.plcKindList.filter(
// item => item.commCd == value, // // item => item.commCd == value,
// ); // // );
// if (newValue.length > 0) { // // if (newValue.length > 0) {
// retVal = newValue[0].commCdNm; // // retVal = newValue[0].commCdNm;
// // }
// // return retVal;
// // },
// },
// {
// header: '사용 여부',
// name: 'useFg',
// minWidth: 100,
// align: 'center',
// // formatter({ value }) {
// // value = value === true ? '1' : '0';
// // const newValue = _this.pageData.useFgList.filter(
// // item => item.commCd == value,
// // );
// // return newValue[0].commCdNm;
// // },
// },
// ]
// }
// } // }
// return retVal;
// },
},
{
header: '사용 여부',
name: 'useFg',
minWidth: 100,
align: 'center',
// formatter({ value }) {
// value = value === true ? '1' : '0';
// const newValue = _this.pageData.useFgList.filter(
// item => item.commCd == value,
// );
// return newValue[0].commCdNm;
// },
},
]
}
}
}; };
}, },
computed: { computed: {
@ -166,9 +152,9 @@ export default {
bodyHeight: gridHeight, bodyHeight: gridHeight,
minBodyHeight: gridHeight, minBodyHeight: gridHeight,
header: { header: {
height: 28, height: 37,
}, },
rowHeight: 29, rowHeight: 37,
minRowHeight: 29, minRowHeight: 29,
selectionUnit: 'row', selectionUnit: 'row',
editingEvent: 'click', editingEvent: 'click',
@ -178,100 +164,101 @@ export default {
value: myOptions, value: myOptions,
}); });
// const _this = this; const _this = this;
// let useFgSelectList = []; let useFgSelectList = [];
// this.pageData.useFgList.forEach(item => { this.pageData.useFgList.forEach(item => {
// const it = { text: item.commCdNm, value: item.commCd }; const it = { text: item.commCdNm, value: item.commCd };
// useFgSelectList.push(it); useFgSelectList.push(it);
// }); });
// let addInfoList = []; let addInfoList = [];
// this.pageData.addInfoList.forEach(item => { this.pageData.addInfoList.forEach(item => {
// const it = { text: item.addInfoNm, value: item.addInfoId }; const it = { text: item.addInfoNm, value: item.addInfoId };
// addInfoList.push(it); addInfoList.push(it);
// }); });
// let addInfoDataKindList = []; let addInfoDataKindList = [];
// this.pageData.addInfoDataKindList.forEach(item => { this.pageData.addInfoDataKindList.forEach(item => {
// const it = { text: item.commCdNm, value: item.commCd }; const it = { text: item.commCdNm, value: item.commCd };
// addInfoDataKindList.push(it); addInfoDataKindList.push(it);
// }); });
// const myColumns = [ const myColumns = [
// { header: '회사 ID', name: 'comId', hidden: true }, { header: '회사 ID', name: 'comId', hidden: true },
// { header: '검침개소 번호', name: 'readPlcId', hidden: true }, { header: '검침개소 번호', name: 'readPlcId', hidden: true },
// { {
// header: '추가 정보', header: '추가 정보',
// name: 'addInfoId', name: 'addInfoId',
// align: 'left', align: 'left',
// formatter({ value }) { formatter({ value }) {
// let retVal = ''; let retVal = '';
// const newValue = addInfoList.filter(item => item.value == value); const newValue = addInfoList.filter(item => item.value == value);
// if (newValue.length > 0) { if (newValue.length > 0) {
// retVal = newValue[0].text; retVal = newValue[0].text;
// } }
// return retVal; return retVal;
// }, },
// }, },
// { {
// header: 'Data 구분', header: 'Data 구분',
// name: 'addInfoDataKind', name: 'addInfoDataKind',
// align: 'center', align: 'center',
// formatter({ value }) { formatter({ value }) {
// let retVal = ''; let retVal = '';
// const newValue = addInfoDataKindList.filter( const newValue = addInfoDataKindList.filter(
// item => item.value == value, item => item.value == value,
// ); );
// if (newValue.length > 0) { if (newValue.length > 0) {
// retVal = newValue[0].text; retVal = newValue[0].text;
// } }
// return retVal; return retVal;
// }, },
// // editor: {
// // type: "select",
// // options: {
// // listItems: addInfoDataKindList
// // }
// // }
// },
// {
// header: '숫자 값',
// name: 'addInfoNumVal',
// align: 'right',
// editor: 'text',
// hidden: true,
// },
// {
// header: '문자 값',
// name: 'addInfoTxtVal',
// align: 'left',
// editor: 'text',
// hidden: true,
// },
// {
// header: '추가 정보 값',
// name: 'addInfoVal',
// align: 'center',
// renderer: {
// type: NewCustomRenderer,
// },
// editor: { // editor: {
// type: NewCustomEditor, // type: "select",
// }, // options: {
// formatter(data) { // listItems: addInfoDataKindList
// return data.row.addInfoDataKind; // }
// }, // }
// }, },
//{ header: "추가 정보 값", name: "addInfoVal", align: "center" , editor: "text", {
// formatter({ value, row , column}) { header: '숫자 값',
name: 'addInfoNumVal',
align: 'right',
editor: 'text',
hidden: true,
},
{
header: '문자 값',
name: 'addInfoTxtVal',
align: 'left',
editor: 'text',
hidden: true,
},
{
header: '추가 정보 값',
name: 'addInfoVal',
align: 'center',
renderer: {
type: NewCustomRenderer,
},
editor: {
type: NewCustomEditor,
},
formatter(data) {
return data.row.addInfoDataKind;
},
},
// {
// header: "추가 정보 값", name: "addInfoVal", align: "center", editor: "text",
// formatter({ value, row, column }) {
// console.log("addInfoVal row : ", row); // console.log("addInfoVal row : ", row);
// console.log("addInfoVal state : ", column); // console.log("addInfoVal state : ", column);
// if(row.addInfoDataKind === "NUM"){ // if (row.addInfoDataKind === "NUM") {
// column.align = "right"; // column.align = "right";
// }else{ // } else {
// column.align = "left"; // column.align = "left";
// } // }
// return value; // return value;
// } // }
//}, // },
/*{ /*{
header: "사용여부", header: "사용여부",
name: "useFg", name: "useFg",
@ -290,16 +277,16 @@ export default {
} }
} }
},*/ },*/
// { header: '등록 사용자', name: 'regUserNo', hidden: true }, { header: '등록 사용자', name: 'regUserNo', hidden: true },
// { header: '등록 일자', name: 'regDttm', hidden: true }, { header: '등록 일자', name: 'regDttm', hidden: true },
// { header: '수정 사용자', name: 'procUserNo', hidden: true }, { header: '수정 사용자', name: 'procUserNo', hidden: true },
// { header: '수정 일자', name: 'procDttm', hidden: true }, { header: '수정 일자', name: 'procDttm', hidden: true },
// ]; ];
// this.setGridColumn({ this.setGridColumn({
// gridKey: this.gridName, gridKey: this.gridName,
// value: myColumns, value: myColumns,
// }); });
this.loadGrid = true; this.loadGrid = true;
}, },
@ -379,7 +366,7 @@ export default {
gridEditingFinish2(data, bindingData) { gridEditingFinish2(data, bindingData) {
this.$refs[bindingData].editingFinish(data); this.$refs[bindingData].editingFinish(data);
}, },
search() {}, search() { },
}, },
}; };
</script> </script>

View File

@ -8,9 +8,9 @@
<div ref="gridParent" style="height: calc((100vh - 520px) /2);"> <div ref="gridParent" style="height: calc((100vh - 520px) /2);">
<Grid :ref="gridName" :gridName="gridName" :parentPrgmId="parentPrgmId" @getRowsData="getRowData" <Grid :ref="gridName" :gridName="gridName" :parentPrgmId="parentPrgmId" @getRowsData="getRowData"
:innerTabGridInfo="innerTabGridInfo" :dataPath="imgInfoTabData" /> :innerTabGridInfo="innerTabGridInfo" />
</div> </div>
<div ref="formParent"> <div ref="formParent" style="height: calc((100vh - 400px) /2);">
<component :is="'Form'" :parentPrgmId="parentPrgmId" :bindingData="gridName" <component :is="'Form'" :parentPrgmId="parentPrgmId" :bindingData="gridName"
:detailList="detailReadPlcImgList" @gridEditingFinish="gridEditingFinish" /> :detailList="detailReadPlcImgList" @gridEditingFinish="gridEditingFinish" />
</div> </div>
@ -44,26 +44,9 @@ export default {
}, },
data() { data() {
return { return {
loadGrid: true, loadGrid: false,
gridName: 'rowReadPlcImgGrid', gridName: 'rowReadPlcImgGrid',
detailReadPlcImgList: myReadPlcImgDetail, detailReadPlcImgList: myReadPlcImgDetail,
imgInfoTabData: {
"rowReadPlcImgGrid": {
data:
[
{ "objReadPlcId": "1001", "objReadPlcNm": "서울역", "distRt": 12 },
{ "objReadPlcId": "1002", "objReadPlcNm": "강남역", "distRt": 8 },
{ "objReadPlcId": "1003", "objReadPlcNm": "잠실역", "distRt": 15 },
]
,
column: [
{ header: '대상 검침개소 번호', name: 'objReadPlcId', align: 'center' },
{ header: '대상 검침개소명', name: 'objReadPlcNm', align: 'left' },
{ header: '분배율(1~100)', name: 'distRt', align: 'right' },
]
}
}
}; };
}, },
computed: { computed: {
@ -120,10 +103,11 @@ export default {
header: { header: {
height: 28, height: 28,
}, },
rowHeight: 29, // rowHeight: 29,
minRowHeight: 29, // minRowHeight: 29,
selectionUnit: 'row', selectionUnit: 'row',
editingEvent: 'click', editingEvent: 'click',
rowHeight: 'auto',
}; };
this.setGridOption({ this.setGridOption({
gridKey: this.gridName, gridKey: this.gridName,

View File

@ -7,9 +7,9 @@
</div> </div>
<div ref="gridParent" style="height: calc((100vh - 520px) /2);"> <div ref="gridParent" style="height: calc((100vh - 520px) /2);">
<Grid :ref="gridName" :gridName="gridName" :parentPrgmId="parentPrgmId" @getRowsData="getRowData" <Grid :ref="gridName" :gridName="gridName" :parentPrgmId="parentPrgmId" @getRowsData="getRowData"
:innerTabGridInfo="innerTabGridInfo" :dataPath="tagRelTabData" /> :innerTabGridInfo="innerTabGridInfo" />
</div> </div>
<div ref="formParent" > <div class="mt-3" ref="formParent" style="height: calc((100vh - 400px) /2);">
<component :is="'Form'" :parentPrgmId="parentPrgmId" :bindingData="gridName" <component :is="'Form'" :parentPrgmId="parentPrgmId" :bindingData="gridName"
:detailList="detailReadPlcTagList" @gridEditingFinish="gridEditingFinish" /> :detailList="detailReadPlcTagList" @gridEditingFinish="gridEditingFinish" />
</div> </div>
@ -46,78 +46,7 @@ export default {
loadGrid: false, loadGrid: false,
gridName: 'rowReadPlcTagRelGrid', gridName: 'rowReadPlcTagRelGrid',
detailReadPlcTagList: myReadPlcTagDetail, detailReadPlcTagList: myReadPlcTagDetail,
tagRelTabData: {
"rowReadPlcTagRelGrid": {
data:
[
{
"tagNm": "TAG_001",
"ercId": "전기",
"distRt": 10,
"reprTagFg": "1",
"useFg": "Y",
"rmrk": "기본 설정",
"tagId": "TAG_001"
},
{
"tagNm": "TAG_002",
"ercId": "가스",
"distRt": 15,
"reprTagFg": "0",
"useFg": "Y",
"rmrk": "",
"tagId": "TAG_002"
},
{
"tagNm": "TAG_003",
"ercId": "수도",
"distRt": 8,
"reprTagFg": "0",
"useFg": "N",
"rmrk": "테스트용",
"tagId": "TAG_003"
},
]
,
column: [
{ header: 'TAG 명', name: 'tagNm', align: 'left' },
{
header: '에너지원',
name: 'ercId',
align: 'center',
width: 100,
},
{
header: '분배율(1~100)',
name: 'distRt',
align: 'right',
width: 100,
},
{
header: '대표 TAG 여부',
name: 'reprTagFg',
align: 'center',
width: 100,
formatter({ value }) {
return value == '1' ? '예' : '아니오';
},
},
{
header: '사용여부',
name: 'useFg',
align: 'center',
width: 100,
},
{ header: '비고', name: 'rmrk', align: 'left', width: 100 },
{ header: 'TAG ID', name: 'tagId', align: 'center', hidden: true },
]
}
}
}; };
}, },
computed: { computed: {

View File

@ -1,33 +1,65 @@
<template> <template>
<div class="l-layout"> <div class="l-layout">
<PageTitle text="공통코드" />
<v-row ref="searchFilter"> <v-row ref="searchFilter">
<v-col :cols="12"> <v-col :cols="12">
<v-card class="searchFilter"> <v-card class="searchFilter">
<v-row align="center" no-gutters> <v-row align="center" no-gutters>
<v-col :cols="4"> <v-col :cols="3">
<component <component
:is="'selectCodeList'" :is="'selectCodeList'"
:parentPrgmId="myPrgmId" :parentPrgmId="myPrgmId"
:label="'시스템구분'" :label="'시스템구분'"
dataKey="sysDivCd" dataKey="sysDivCd"
:labelCols="12"
:textCols="12"
:sendParam="{ commGrpCd: 'CO_SYSDIV', useFg: '1' }" :sendParam="{ commGrpCd: 'CO_SYSDIV', useFg: '1' }"
:addAll="true" :addAll="true"
customClass="select-large"
/> />
</v-col> </v-col>
<v-col :cols="4"> <v-col :cols="3">
<component <component
:is="'selectCodeList'" :is="'selectCodeList'"
:parentPrgmId="myPrgmId" :parentPrgmId="myPrgmId"
:label="'사용여부'" :label="'사용여부'"
:labelCols="12"
:textCols="12"
:dataKey="'useFg'" :dataKey="'useFg'"
customClass="select-large"
:sendParam="{ commGrpCd: 'CO_USEFG', useFg: '1' }" :sendParam="{ commGrpCd: 'CO_USEFG', useFg: '1' }"
/> />
</v-col> </v-col>
<v-col :cols="4" class="text-right"> <v-col :cols="3">
<BtnSearch @click="search" /> <InputText
:parentPrgmId="myPrgmId"
label="그룹코드"
valueNm="commGrpCd"
:searchOption="true"
:labelCols="12"
:textCols="12"
customClass="input-large"
/>
</v-col>
<v-col :cols="3">
<InputText
:parentPrgmId="myPrgmId"
label="그룹코드명"
valueNm="commGrpCdNm"
:searchOption="true"
:labelCols="12"
:textCols="12"
customClass="input-large"
/>
</v-col>
<v-col :cols="12" class="text-right">
<BtnSearch style="margin-top:20px" @click="search" />
</v-col> </v-col>
</v-row> </v-row>
<v-row align="center" no-gutters> <!-- <v-row align="center" no-gutters>
<v-col :cols="4"> <v-col :cols="4">
<InputText <InputText
:parentPrgmId="myPrgmId" :parentPrgmId="myPrgmId"
@ -48,7 +80,7 @@
:textCols="8" :textCols="8"
/> />
</v-col> </v-col>
</v-row> </v-row> -->
</v-card> </v-card>
</v-col> </v-col>
</v-row> </v-row>
@ -85,7 +117,7 @@
<v-card class="pb-5"> <v-card class="pb-5">
<v-card-title>공통그룹코드 상세</v-card-title> <v-card-title>공통그룹코드 상세</v-card-title>
<div class="px-5" style="height:calc(100% - 70px)"> <div class="px-5" style="height:calc(100% - 70px)">
<v-tabs v-model="tab" :hide-slider="true"> <v-tabs v-model="tab" >
<v-tab <v-tab
v-for="item in items" v-for="item in items"
:key="item.id" :key="item.id"
@ -132,6 +164,7 @@ import Form from '~/components/common/form/Form';
import CommCdTab from '@/components/pages/comm/CommCdTab'; import CommCdTab from '@/components/pages/comm/CommCdTab';
import Grid from '~/components/common/Grid'; import Grid from '~/components/common/Grid';
import Utility from '~/plugins/utility'; import Utility from '~/plugins/utility';
import PageTitle from "~/components/common/PageTitle";
let myTitle; let myTitle;
let myPrgmId; let myPrgmId;
@ -158,6 +191,7 @@ export default {
Form, Form,
CommCdTab, CommCdTab,
Grid, Grid,
PageTitle
}, },
data() { data() {
return { return {
@ -229,6 +263,9 @@ export default {
const myOptions = { const myOptions = {
scrollX: false, scrollX: false,
header: {
height: 38,
},
}; };
this.setGridOption({ this.setGridOption({
gridKey: this.gridName, gridKey: this.gridName,
@ -241,7 +278,7 @@ export default {
{ {
header: '시스템구분', header: '시스템구분',
name: 'sysDivCd', name: 'sysDivCd',
align: 'center', align: 'left',
formatter({ value }) { formatter({ value }) {
let commCdNm = ''; let commCdNm = '';
if (sysCdList.length > 0) { if (sysCdList.length > 0) {
@ -278,7 +315,7 @@ export default {
{ {
header: '사용여부', header: '사용여부',
name: 'useFg', name: 'useFg',
align: 'center', align: 'left',
formatter({ value }) { formatter({ value }) {
const newValue = _this.pageData.useFgList.filter( const newValue = _this.pageData.useFgList.filter(
item => item.commCd == value, item => item.commCd == value,
@ -554,7 +591,10 @@ const myDetail = [
valueNm: 'commGrpCd', valueNm: 'commGrpCd',
disabled: true, disabled: true,
cols: 6, cols: 6,
class: 'py-2', labelCols: 12,
textCols: 12,
iconShow: true,
class: 'py-2 pr-2',
required: true, required: true,
}, },
{ {
@ -563,7 +603,10 @@ const myDetail = [
valueNm: 'commGrpNm', valueNm: 'commGrpNm',
disabled: false, disabled: false,
cols: 6, cols: 6,
class: 'py-2', labelCols: 12,
textCols: 12,
iconShow: true,
class: 'py-2 pl-2',
required: true, required: true,
}, },
{ {
@ -572,7 +615,10 @@ const myDetail = [
valueNm: 'sysDivCd', valueNm: 'sysDivCd',
disabled: false, disabled: false,
cols: 6, cols: 6,
class: 'py-2', labelCols: 12,
textCols: 12,
iconShow: true,
class: 'py-2 pr-2 mt-3',
list: 'sysDivCdList', list: 'sysDivCdList',
itemText: 'commCdNm', itemText: 'commCdNm',
itemValue: 'commCd', itemValue: 'commCd',
@ -584,7 +630,10 @@ const myDetail = [
valueNm: 'useFg', valueNm: 'useFg',
disabled: false, disabled: false,
cols: 6, cols: 6,
class: 'py-2', labelCols: 12,
textCols: 12,
iconShow: true,
class: 'py-2 pl-2 mt-10',
value: { '1': true, '0': false }, value: { '1': true, '0': false },
required: true, required: true,
}, },
@ -594,7 +643,10 @@ const myDetail = [
valueNm: 'rmrk', valueNm: 'rmrk',
disabled: false, disabled: false,
cols: 6, cols: 6,
class: 'py-2', labelCols: 12,
textCols: 12,
iconShow: true,
class: 'py-2 pr-2 mt-3',
}, },
]; ];
</script> </script>

View File

@ -344,7 +344,7 @@
<v-row> <v-row>
<v-col cols="auto" style="text-align: left"> <v-col cols="auto" style="text-align: left">
<!-- <p class="textInfo">{{ ngDtlCnt }}</p> --> <!-- <p class="textInfo">{{ ngDtlCnt }}</p> -->
<p class="card-text-info">200</p> <p class="card-text-info">{{ ngDtlCnt }}</p>
</v-col> </v-col>
<v-col :cols="3" style="text-align: left"> </v-col> <v-col :cols="3" style="text-align: left"> </v-col>
</v-row> </v-row>
@ -369,7 +369,7 @@
<v-row> <v-row>
<v-col cols="auto" style="text-align: left"> <v-col cols="auto" style="text-align: left">
<!-- <p class="textInfo">{{ ngDtlSolvCnt }}</p> --> <!-- <p class="textInfo">{{ ngDtlSolvCnt }}</p> -->
<p class="card-text-info">100</p> <p class="card-text-info">{{ ngDtlSolvCnt }}</p>
</v-col> </v-col>
<v-col :cols="3" style="text-align: left"> </v-col> <v-col :cols="3" style="text-align: left"> </v-col>
</v-row> </v-row>
@ -580,11 +580,7 @@ export default {
Chart, Chart,
UnusedStatPopPage, UnusedStatPopPage,
EtcStatPopPage, EtcStatPopPage,
BtnSearch, PageTitle
AntCard,
CheckBox,
RadioStandard,
PageTitle,
}, },
computed: { computed: {
...mapState({ ...mapState({
@ -607,7 +603,6 @@ export default {
// let chartOption = this.getGuageChartOption2(this.chart_01); // let chartOption = this.getGuageChartOption2(this.chart_01);
let chartOption = getGaugeChartOption({ let chartOption = getGaugeChartOption({
title: this.chart_01, title: this.chart_01,
value: 75,
isDarkMode: this.isDarkMode, isDarkMode: this.isDarkMode,
}); });
chartOption["series"][0]["data"][0].value = this.$store.state.pageData[myPrgmId][ chartOption["series"][0]["data"][0].value = this.$store.state.pageData[myPrgmId][
@ -618,7 +613,6 @@ export default {
// let chartOption3 = this.getGuageChartOption2(this.chart_03); // let chartOption3 = this.getGuageChartOption2(this.chart_03);
let chartOption3 = getGaugeChartOption({ let chartOption3 = getGaugeChartOption({
title: this.chart_03, title: this.chart_03,
value: 75,
isDarkMode: this.isDarkMode, isDarkMode: this.isDarkMode,
}); });
chartOption3["series"][0]["data"][0].value = this.$store.state.pageData[myPrgmId][ chartOption3["series"][0]["data"][0].value = this.$store.state.pageData[myPrgmId][
@ -719,13 +713,9 @@ export default {
// this.search(); // this.search();
await this.gridInit(); await this.gridInit();
await new Promise((resolve) => setTimeout(resolve, 1500)); await new Promise((resolve) => setTimeout(resolve, 1500));
await this.getTodayEfficiencyStatus();
await this.getEnrgAndCO2Data();
await this.getGridData();
if (this.$router.currentRoute.fullPath == this.myHome.root) { if (this.$router.currentRoute.fullPath == this.myHome.root) {
this.dtToday = Utility.setFormatDate(new Date(), "YYYY-MM-DD HH:mm"); this.dtToday = Utility.setFormatDate(new Date(), "YYYY-MM-DD HH:mm");
await this.getEnrgAndCO2Data(); await this.getEnrgAndCO2Data();
await this.getCompareEqpmTotData(); await this.getCompareEqpmTotData();
await this.getTodayEfficiencyStatus(); await this.getTodayEfficiencyStatus();
@ -755,9 +745,7 @@ export default {
if (this.$refs.gridParent != undefined) { if (this.$refs.gridParent != undefined) {
// gridHeight = gridHeight*0.9 // gridHeight = gridHeight*0.9
gridHeight = this.$refs.gridParent.offsetHeight - 35; gridHeight = this.$refs.gridParent.offsetHeight - 35;
// console.log("gridHeight : ", gridHeight);
} }
const myOptions = { const myOptions = {
// scrollX: false, // scrollX: false,
setScroll: true, setScroll: true,
@ -770,12 +758,10 @@ export default {
height: 38, height: 38,
}, },
}; };
this.setGridOption({ this.setGridOption({
gridKey: this.gridName, gridKey: this.gridName,
value: Object.assign(Utility.defaultGridOption(gridHeight), myOptions), value: Object.assign(Utility.defaultGridOption(gridHeight), myOptions),
}); });
let hhMapper = { let hhMapper = {
"00": "00~01", "00": "00~01",
"01": "01~02", "01": "01~02",
@ -807,7 +793,7 @@ export default {
header: "NO", header: "NO",
name: "rowNum", name: "rowNum",
width: 70, width: 70,
align: "right", align: "center",
// hidden: true, // hidden: true,
}, },
{ {
@ -855,98 +841,99 @@ export default {
}); });
this.loadGrid = true; this.loadGrid = true;
this.isGridLoading = false;
// this.getGridData(); // this.getGridData();
}, },
async getGridData() { async getGridData() {
this.loadGrid = false; this.loadGrid = false;
// console // console
// const res = await this.postApiReturn({ const res = await this.postApiReturn({
// apiKey: 'selectIssueGdIdxData', apiKey: "selectIssueGdIdxData",
// resKey: 'issueGdIdxData', resKey: "issueGdIdxData",
// sendParam: {}, sendParam: {},
// });
let fakeData = [
{
alrmKind: "WARN",
alrmMsg: "냉동기 전류부하율이 @V1%로 높음 (평균 @V2% 대비 @V3% 낮음) -@EQPM",
careStndVal: 50,
warnStndVal: 60,
eccId: "ECC000004",
eqpmGrpNm: "냉동기저온1",
eqpmGrpId: "EQG000001",
eqpmKindId: "EKIND0001",
eqpmId: "CHI-201",
eqpmNm: "CHI-201",
fabId: "ECC000003",
fabNm: "삼천1공장",
gdIdxId: "GD00001",
gdIdxNm: "전류부하율 평균 편차",
rowKey: 0,
rowNum: 1,
rowSpanMap: {},
sortKey: 0,
sortSeq: 1,
totDttm: Utility.setFormatDate(new Date(), "YYYY-MM-DD"),
totTime: "2022-12-20 02:43:24",
totVal: 70,
},
{
alrmKind: "WARN",
alrmMsg: "냉동기 냉각수 유량 부하율이 @V1%로 높음 -@EQPM",
careStndVal: 70,
warnStndVal: 100,
eccId: "ECC000004",
eqpmGrpNm: "냉동기고온1",
eqpmGrpId: "EQG000001",
eqpmKindId: "EKIND0001",
eqpmId: "CHI-302",
eqpmNm: "CHI-302",
fabId: "ECC000004",
fabNm: "삼천1공장",
gdIdxId: "GD00011",
gdIdxNm: "냉각수 유량 부하율",
rowKey: 0,
rowNum: 2,
rowSpanMap: {},
sortKey: 0,
sortSeq: 1,
totDttm: Utility.setFormatDate(new Date(), "YYYY-MM-DD"),
totTime: "2022-12-20 07:23:38",
totVal: 120,
},
];
this.setGridData({
gridKey: this.gridName,
value: fakeData,
}); });
// let fakeData = [
// {
// 'alrmKind' : "WARN",
// 'alrmMsg' : "냉동기 전류부하율이 @V1%로 높음 (평균 @V2% 대비 @V3% 낮음) -@EQPM",
// 'careStndVal' : 50,
// 'warnStndVal' : 60,
// 'eccId' : "ECC000004",
// 'eqpmGrpNm' : "냉동기저온1",
// 'eqpmGrpId' : "EQG000001",
// 'eqpmKindId' : "EKIND0001",
// 'eqpmId' : "CHI-201",
// 'eqpmNm' : "CHI-201",
// 'fabId' : "ECC000003",
// 'fabNm' : "삼천1공장",
// 'gdIdxId' : "GD00001",
// 'gdIdxNm' : "전류부하율 평균 편차",
// 'rowKey' : 0,
// 'rowNum' : 1,
// 'rowSpanMap' : {},
// 'sortKey' : 0,
// 'sortSeq' : 1,
// 'totDttm' : Utility.setFormatDate(new Date(), 'YYYY-MM-DD'),
// 'totTime' : '2022-12-20 02:43:24',
// 'totVal' : 70
// },
// {
// 'alrmKind' : "WARN",
// 'alrmMsg' : "냉동기 냉각수 유량 부하율이 @V1%로 높음 -@EQPM",
// 'careStndVal' : 70,
// 'warnStndVal' : 100,
// 'eccId' : "ECC000004",
// 'eqpmGrpNm' : "냉동기고온1",
// 'eqpmGrpId' : "EQG000001",
// 'eqpmKindId' : "EKIND0001",
// 'eqpmId' : "CHI-302",
// 'eqpmNm' : "CHI-302",
// 'fabId' : "ECC000004",
// 'fabNm' : "삼천1공장",
// 'gdIdxId' : "GD00011",
// 'gdIdxNm' : "냉각수 유량 부하율",
// 'rowKey' : 0,
// 'rowNum' : 2,
// 'rowSpanMap' : {},
// 'sortKey' : 0,
// 'sortSeq' : 1,
// 'totDttm' : Utility.setFormatDate(new Date(), 'YYYY-MM-DD'),
// 'totTime' : '2022-12-20 07:23:38',
// 'totVal' : 120
// }
// ]
// this.setGridData({ // this.setGridData({
// gridKey: this.gridName, // gridKey: this.gridName,
// value: res, // value: fakeData,
// }); // });
this.setGridData({
gridKey: this.gridName,
value: res,
});
this.loadGrid = true; this.loadGrid = true;
}, },
async getEnrgAndCO2Data() { async getEnrgAndCO2Data() {
this.loadChart_01 = false; this.loadChart_01 = false;
const res = []; const res = await this.postApiReturn({
apiKey: "selectEnrgAndCO2Data",
resKey: "enrgAndCO2Data",
sendParam: {},
});
// ////////////////////////////////////////// // //////////////////////////////////////////
// // 시연용 data 세팅 // // 시연용 data 세팅
res[0] = {}; // res[0]['dayVal'] = 18.0;
res[0]["dayVal"] = 18.0; // res[0]['mnthVal'] = 507.0;
res[0]["mnthVal"] = 507.0; // res[0]['planVal'] = 653.0;
res[0]["planVal"] = 653.0; // res[0]['co2DayVal'] = 9.0;
res[0]["co2DayVal"] = 9.0; // res[0]['co2MnthVal'] = 238.0;
res[0]["co2MnthVal"] = 238.0; // res[0]['co2PlanVal'] = 307.0;
res[0]["co2PlanVal"] = 307.0; // res[0]['co2YearVal'] = 1224.0;
res[0]["co2YearVal"] = 1224.0; // res[0]['effcRt'] = 77.59;
res[0]["effcRt"] = 77.59;
// ////////////////////////////////////////// // //////////////////////////////////////////
// 대시보드 표기 // 대시보드 표기
this.enrgUsageDayVal = this.numberFormatter( this.enrgUsageDayVal = this.numberFormatter(
parseFloat(res[0]["dayVal"]).toFixed(0) parseFloat(res[0]["dayVal"]).toFixed(0)
); );
@ -964,20 +951,16 @@ export default {
parseFloat(res[0]["co2BefMnthVal"]).toFixed(0) parseFloat(res[0]["co2BefMnthVal"]).toFixed(0)
); );
this.CO2YearVal = this.numberFormatter(parseFloat(res[0]["co2YearVal"]).toFixed(0)); this.CO2YearVal = this.numberFormatter(parseFloat(res[0]["co2YearVal"]).toFixed(0));
this.$nextTick(() => { this.$nextTick(() => {
let chartOption = null; let chartOption = null;
// chartOption = this.getGuageChartOption2(this.chart_01); // chartOption = this.getGuageChartOption2(this.chart_01);
chartOption = getGaugeChartOption({ chartOption = getGaugeChartOption({
title: "Energy Usage", title: "Energy Usage",
value: 75,
isDarkMode: this.isDarkMode, isDarkMode: this.isDarkMode,
}); });
console.log("charto:", chartOption);
chartOption["series"][0]["data"][0].value = chartOption["series"][0]["data"][0].value =
res[0]["effcRt"] != null ? res[0]["effcRt"] : 0; res[0]["effcRt"] != null ? res[0]["effcRt"] : 0;
this.$store.state.pageData[myPrgmId][this.chart_01] = chartOption; this.$store.state.pageData[myPrgmId][this.chart_01] = chartOption;
console.log("gauge chart ops:", chartOption);
// if(res[0]['effcRt'] == undefined || res[0]['effcRt'] == null){ // if(res[0]['effcRt'] == undefined || res[0]['effcRt'] == null){
// res[0]['effcRt'] = null; // res[0]['effcRt'] = null;
// } // }
@ -993,12 +976,11 @@ export default {
}, },
async getCompareEqpmTotData() { async getCompareEqpmTotData() {
this.loadChart_02 = false; this.loadChart_02 = false;
// const res = await this.postApiReturn({ const res = await this.postApiReturn({
// apiKey: "selectCompareEqpmTotData", apiKey: "selectCompareEqpmTotData",
// resKey: "compareEqpmTotData", resKey: "compareEqpmTotData",
// sendParam: {}, sendParam: {},
// }); });
const res = "abc";
this.$nextTick(() => { this.$nextTick(() => {
this.setChart02Data(res); this.setChart02Data(res);
}); });
@ -1007,25 +989,24 @@ export default {
}, },
async getTodayEfficiencyStatus() { async getTodayEfficiencyStatus() {
this.loadChart_03 = false; this.loadChart_03 = false;
// const res = await this.postApiReturn({ const res = await this.postApiReturn({
// apiKey: 'selectTodayEfficiencyStatus', apiKey: "selectTodayEfficiencyStatus",
// resKey: 'todayEfficiencyStatus', resKey: "todayEfficiencyStatus",
// sendParam: {}, sendParam: {},
// }); });
// 대시보드 표기 // 대시보드 표기
// this.ngDtlCnt = this.numberFormatter(res[0]['ngDtlCnt']); this.ngDtlCnt = this.numberFormatter(res[0]["ngDtlCnt"]);
// this.ngDtlSolvCnt = this.numberFormatter(res[0]['ngDtlSolvCnt']); this.ngDtlSolvCnt = this.numberFormatter(res[0]["ngDtlSolvCnt"]);
// let effcRt = this.numberFormatter( let effcRt = this.numberFormatter(
// (res[0]['ngDtlSolvCnt'] / res[0]['ngDtlCnt']) * 100, (res[0]["ngDtlSolvCnt"] / res[0]["ngDtlCnt"]) * 100
// ); );
let effcRt = this.numberFormatter(78.21); // let effcRt = this.numberFormatter(78.21)
this.$nextTick(() => { this.$nextTick(() => {
let chartOption = null; let chartOption = null;
// chartOption = this.getGuageChartOption2(this.chart_03); // chartOption = this.getGuageChartOption2(this.chart_03);
chartOption = getGaugeChartOption({ chartOption = getGaugeChartOption({
title: "Today Efficiency", title: "Today Efficiency",
value: 75,
isDarkMode: this.isDarkMode, isDarkMode: this.isDarkMode,
}); });
chartOption["series"][0]["data"][0].value = isNaN(effcRt) ? 0 : effcRt; chartOption["series"][0]["data"][0].value = isNaN(effcRt) ? 0 : effcRt;
@ -1037,15 +1018,14 @@ export default {
}, },
async getTodayNgTopTen() { async getTodayNgTopTen() {
this.loadChart_04 = false; this.loadChart_04 = false;
// const res = await this.postApiReturn({ const res = await this.postApiReturn({
// apiKey: "selectTodayNgTopTen", apiKey: "selectTodayNgTopTen",
// resKey: "todayNgTopTen", resKey: "todayNgTopTen",
// sendParam: {}, sendParam: {},
// }); });
const res = "abc"; this.setPageData({
// this.setPageData({ chart04Data: res,
// chart04Data: res, });
// });
this.$nextTick(() => { this.$nextTick(() => {
this.setChart04Data(res); this.setChart04Data(res);
}); });
@ -1054,12 +1034,11 @@ export default {
}, },
async getCompareEqpmTGdChart() { async getCompareEqpmTGdChart() {
this.loadChart_05 = false; this.loadChart_05 = false;
// const res = await this.postApiReturn({ const res = await this.postApiReturn({
// apiKey: "selectCompareEqpmTGdChart", apiKey: "selectCompareEqpmTGdChart",
// resKey: "compareEqpmTGdChart", resKey: "compareEqpmTGdChart",
// sendParam: {}, sendParam: {},
// }); });
const res = "aaa";
this.$nextTick(() => { this.$nextTick(() => {
this.setChart05Data(res); this.setChart05Data(res);
}); });
@ -1067,12 +1046,12 @@ export default {
this.isLine2Loading = false; this.isLine2Loading = false;
}, },
async setChart05Data(data) { async setChart05Data(data) {
// if (this.$store.state.pageData[this.myPrgmId].compareEqpmTGdChart != undefined) { if (this.$store.state.pageData[this.myPrgmId].compareEqpmTGdChart != undefined) {
// this.$store.state.pageData[this.myPrgmId].compareEqpmTGdChart.series = []; this.$store.state.pageData[this.myPrgmId].compareEqpmTGdChart.series = [];
// } }
// if (!data.length) { if (!data.length) {
// return; return;
// } }
let xAxisData = []; let xAxisData = [];
let seriesData = []; let seriesData = [];
// let legendData = { // let legendData = {
@ -1081,7 +1060,7 @@ export default {
// dayVal: "금일", // dayVal: "금일",
// }; // };
let legendData = ["전전일", "전일", "금일"]; // let legendData = ["전전일", "전일", "금일"];
let befBefValDataList = { let befBefValDataList = {
name: "전전일", name: "전전일",
@ -1109,37 +1088,36 @@ export default {
}; };
// for (var i = 0; i < data.length; i++) { // for (var i = 0; i < data.length; i++) {
//////없애야함////// //////없애야함//////
let total = 0; // let total = 0;
let hour = Utility.setFormatDate( let hour = Utility.setFormatDate(
new Date().setTime(new Date().getTime() - 1 * 60 * 60 * 1000), new Date().setTime(new Date().getTime() - 1 * 60 * 60 * 1000),
"HH" "HH"
); );
//////없애야함////// //////없애야함//////
for (var i = 0; i < 24; i++) { for (var i = 0; i < 24; i++) {
// if (data[i].tm != undefined) { if (data[i].tm != undefined) {
// xAxisData.push(parseInt(data[i].tm)); xAxisData.push(parseInt(data[i].tm));
// } else { } else {
// xAxisData.push(i);
// }
xAxisData.push(i); xAxisData.push(i);
}
// //////없애야함////// // //////없애야함//////
let num = parseInt(Math.random() * (13 - 7) + 7); // let num = parseInt(Math.random() * (13 - 7) + 7);
let num2 = parseInt(Math.random() * (11 - 6) + 6); // let num2 = parseInt(Math.random() * (11 - 6) + 6);
let num3 = parseInt(Math.random() * (10 - 5) + 5); // let num3 = parseInt(Math.random() * (10 - 5) + 5);
let tempTotal = num + num2 + num3; // let tempTotal = num + num2 + num3;
total += tempTotal; // total += tempTotal;
let befBefVal = num; // let befBefVal = num;
let befVal = num2; // let befVal = num2;
let dayVal = num3; // let dayVal = num3;
// ////////////////// // //////////////////
// let befBefVal = data[i].befBefVal != undefined ? data[i].befBefVal : 0; let befBefVal = data[i].befBefVal != undefined ? data[i].befBefVal : 0;
// let befVal = data[i].befVal != undefined ? data[i].befVal : 0; let befVal = data[i].befVal != undefined ? data[i].befVal : 0;
befBefValDataList["data"].push(befBefVal); befBefValDataList["data"].push(befBefVal);
befValDataList["data"].push(befVal); befValDataList["data"].push(befVal);
if (i <= parseInt(hour)) { if (i <= parseInt(hour)) {
// let dayVal = data[i].dayVal != undefined ? data[i].dayVal : 0; let dayVal = data[i].dayVal != undefined ? data[i].dayVal : 0;
dayValDataList["data"].push(dayVal); dayValDataList["data"].push(dayVal);
} }
} }
@ -1151,7 +1129,7 @@ export default {
var chartOption = getLineChartOption({ var chartOption = getLineChartOption({
xAxisData: xAxisData, xAxisData: xAxisData,
legendData: legendData, // legendData: legendData,
seriesData: seriesData, seriesData: seriesData,
isDarkMode: this.isDarkMode, isDarkMode: this.isDarkMode,
}); });
@ -1186,22 +1164,19 @@ export default {
// series: seriesData, // series: seriesData,
// }; // };
console.log("chart 5 data:", seriesData);
await this.$nextTick(() => {}); await this.$nextTick(() => {});
// this.setChartOption({ this.setChartOption({
// chartKey: "compareEqpmTGdChart", chartKey: "compareEqpmTGdChart",
// value: chartOption, value: chartOption,
// }); });
this.$store.state.pageData[myPrgmId]["compareEqpmTGdChart"] = chartOption;
}, },
async setChart04Data(data) { async setChart04Data(data) {
// if (this.$store.state.pageData[this.myPrgmId].todayNgTopTen != undefined) { if (this.$store.state.pageData[this.myPrgmId].todayNgTopTen != undefined) {
// this.$store.state.pageData[this.myPrgmId].todayNgTopTen.series = []; this.$store.state.pageData[this.myPrgmId].todayNgTopTen.series = [];
// } }
// if (!data.length) { if (!data.length) {
// return; return;
// } }
let seriesData = [ let seriesData = [
{ {
type: "pie", type: "pie",
@ -1219,51 +1194,52 @@ export default {
}, },
]; ];
let pidChartdata = []; let pidChartdata = [];
// for (var i = 0; i < data.length; i++) { for (var i = 0; i < data.length; i++) {
// if (data[i].eqpmId != undefined) { if (data[i].eqpmId != undefined) {
// pidChartdata.push({
// value: data[i]["ngDtlCnt"],
// name: data[i]["eqpmId"],
// groupId: data[i]["eqpmNm"],
// });
// }
// }
let eqpmNmList = [
"CHI-202",
"CHI-201",
"UT_LT_CH101",
"UT_LT_CH102",
"UT_LT_CH103",
"UT_LT_CH104",
"UT_LT_CH105",
"U-CH-013",
"U-CH-014",
"U-CH-015",
"U-CH-016",
"U-CH-017",
"U-CH-018",
"U-CH-019",
"U-CH-015B",
"U-CH-015C",
"U-CH-015D",
"U-CH-015E",
"UT_HT_CT101",
"UT_HT_CT102",
"UT_HT_CT103",
"UT_HT_CP101",
"VCB_A",
"U-CH-012",
"U-CH-015F",
"U-CH-016A",
];
for (var i = 1; i < 21; i++) {
pidChartdata.push({ pidChartdata.push({
// value: data[i]['ngDtlCnt'], value: data[i]["ngDtlCnt"],
value: i + parseInt(Math.random() * (9 - 5) + 5), name: data[i]["eqpmId"],
name: eqpmNmList[i], groupId: data[i]["eqpmNm"],
groupId: eqpmNmList[i],
}); });
} }
}
// let eqpmNmList = [
// 'CHI-202',
// 'CHI-201',
// 'UT_LT_CH101',
// 'UT_LT_CH102',
// 'UT_LT_CH103',
// 'UT_LT_CH104',
// 'UT_LT_CH105',
// 'U-CH-013',
// 'U-CH-014',
// 'U-CH-015',
// 'U-CH-016',
// 'U-CH-017',
// 'U-CH-018',
// 'U-CH-019',
// 'U-CH-015B',
// 'U-CH-015C',
// 'U-CH-015D',
// 'U-CH-015E',
// 'UT_HT_CT101',
// 'UT_HT_CT102',
// 'UT_HT_CT103',
// 'UT_HT_CP101',
// 'VCB_A',
// 'U-CH-012',
// 'U-CH-015F',
// 'U-CH-016A',
// ]
// for(var i=1; i<21; i++){
// pidChartdata.push({
// // value: data[i]['ngDtlCnt'],
// value: i+parseInt(Math.random()*(9-5)+5),
// name: eqpmNmList[i],
// groupId: eqpmNmList[i]
// });
// }
seriesData[0]["data"] = [...pidChartdata]; seriesData[0]["data"] = [...pidChartdata];
var chartOption = { var chartOption = {
grid: { grid: {
@ -1293,17 +1269,15 @@ export default {
series: seriesData, series: seriesData,
}; };
await this.$nextTick(() => {}); await this.$nextTick(() => {});
// this.setChartOption({ chartKey: "todayNgTopTen", value: chartOption }); this.setChartOption({ chartKey: "todayNgTopTen", value: chartOption });
this.$store.state.pageData[myPrgmId]["todayNgTopTen"] = chartOption;
this.$store.state.pageData[myPrgmId]["chart04Data"] = chartOption;
}, },
async setChart02Data(data) { async setChart02Data(data) {
// if (this.$store.state.pageData[this.myPrgmId].compareEqpmTotChart != undefined) { if (this.$store.state.pageData[this.myPrgmId].compareEqpmTotChart != undefined) {
// this.$store.state.pageData[this.myPrgmId].compareEqpmTotChart.series = []; this.$store.state.pageData[this.myPrgmId].compareEqpmTotChart.series = [];
// } }
// if (!data.length) { if (!data.length) {
// return; return;
// } }
let xAxisData = []; let xAxisData = [];
let seriesData = []; let seriesData = [];
// let legendMapper = { // let legendMapper = {
@ -1311,7 +1285,6 @@ export default {
// 'befVal' : '전일', // 'befVal' : '전일',
// 'dayVal' : '금일' // 'dayVal' : '금일'
// } // }
let legendData = ["전전일", "전일", "금일"];
let befBefValDataList = { let befBefValDataList = {
name: "전전일", name: "전전일",
type: "line", type: "line",
@ -1336,82 +1309,38 @@ export default {
lineStyle: { width: 2 }, lineStyle: { width: 2 },
data: [], data: [],
}; };
// // for (var i = 0; i < data.length; i++) { // for (var i = 0; i < data.length; i++) {
let hour = Utility.setFormatDate( let hour = Utility.setFormatDate(
new Date().setTime(new Date().getTime() - 1 * 60 * 60 * 1000), new Date().setTime(new Date().getTime() - 1 * 60 * 60 * 1000),
"HH" "HH"
); );
// for (var i = 0; i < 24; i++) {
// if (data[i].tm != undefined) {
// xAxisData.push(parseInt(data[i].tm));
// } else {
// xAxisData.push(i);
// }
// //////없애야함//////
for (var i = 0; i < 24; i++) { for (var i = 0; i < 24; i++) {
if (data[i].tm != undefined) {
xAxisData.push(parseInt(data[i].tm));
} else {
xAxisData.push(i); xAxisData.push(i);
}
//////없애야함//////
let num = parseInt(Math.random() * (13 - 10) + 10) // let num = parseInt(Math.random() * (13 - 10) + 10).toString().padStart(2, '0');
.toString() // let num2 = parseInt(Math.random() * (9 - 1) + 1).toString().padStart(2, '0');
.padStart(2, "0"); // let num3 = parseInt(Math.random() * (13 - 10) + 10).toString().padStart(2, '0');
let num2 = parseInt(Math.random() * (9 - 1) + 1) // let num4 = parseInt(Math.random() * (9 - 1) + 1).toString().padStart(2, '0');
.toString() // let num5 = parseInt(Math.random() * (13 - 10) + 10).toString().padStart(2, '0');
.padStart(2, "0"); // let num6 = parseInt(Math.random() * (9 - 1) + 1).toString().padStart(2, '0');
let num3 = parseInt(Math.random() * (13 - 10) + 10) // let befBefVal = num+num2;
.toString() // let befVal = num3+num4;
.padStart(2, "0"); // let dayVal = num5+num6;
let num4 = parseInt(Math.random() * (9 - 1) + 1) // //////없애야함//////
.toString() let befBefVal = data[i].befBefVal != undefined ? data[i].befBefVal : 0;
.padStart(2, "0"); let befVal = data[i].befVal != undefined ? data[i].befVal : 0;
let num5 = parseInt(Math.random() * (13 - 10) + 10)
.toString()
.padStart(2, "0");
let num6 = parseInt(Math.random() * (9 - 1) + 1)
.toString()
.padStart(2, "0");
let befBefVal = num + num2;
let befVal = num3 + num4;
let dayVal = num5 + num6;
befBefValDataList["data"].push(befBefVal); befBefValDataList["data"].push(befBefVal);
befValDataList["data"].push(befVal); befValDataList["data"].push(befVal);
if (i <= parseInt(hour)) { if (i <= parseInt(hour)) {
// let dayVal = data[i].dayVal != undefined ? data[i].dayVal : 0; let dayVal = data[i].dayVal != undefined ? data[i].dayVal : 0;
dayValDataList["data"].push(dayVal); dayValDataList["data"].push(dayVal);
} }
} }
// let num = parseInt(Math.random() * (13 - 10) + 10)
// .toString()
// .padStart(2, "0");
// let num2 = parseInt(Math.random() * (9 - 1) + 1)
// .toString()
// .padStart(2, "0");
// let num3 = parseInt(Math.random() * (13 - 10) + 10)
// .toString()
// .padStart(2, "0");
// let num4 = parseInt(Math.random() * (9 - 1) + 1)
// .toString()
// .padStart(2, "0");
// let num5 = parseInt(Math.random() * (13 - 10) + 10)
// .toString()
// .padStart(2, "0");
// let num6 = parseInt(Math.random() * (9 - 1) + 1)
// .toString()
// .padStart(2, "0");
// let befBefVal = num + num2;
// let befVal = num3 + num4;
// let dayVal = num5 + num6;
// //////없애야함//////
// let befBefVal = data[i].befBefVal != undefined ? data[i].befBefVal : 0;
// let befVal = data[i].befVal != undefined ? data[i].befVal : 0;
// befBefValDataList["data"].push(befBefVal);
// befValDataList["data"].push(befVal);
// if (i <= parseInt(hour)) {
// let dayVal = data[i].dayVal != undefined ? data[i].dayVal : 0;
// dayValDataList["data"].push(dayVal);
// }
// }
seriesData = [befBefValDataList, befValDataList, dayValDataList]; seriesData = [befBefValDataList, befValDataList, dayValDataList];
// seriesData = [ // seriesData = [
@ -1433,7 +1362,7 @@ export default {
// ]; // ];
var chartOption = getLineChartOption({ var chartOption = getLineChartOption({
xAxisData: xAxisData, xAxisData: xAxisData,
legendData: legendData, // legendData: legendData,
seriesData: seriesData, seriesData: seriesData,
isDarkMode: this.isDarkMode, isDarkMode: this.isDarkMode,
}); });
@ -1468,12 +1397,10 @@ export default {
// series: seriesData, // series: seriesData,
// }; // };
await this.$nextTick(() => {}); await this.$nextTick(() => {});
this.$store.state.pageData[myPrgmId][this.chart_02] = chartOption; this.setChartOption({
chartKey: "compareEqpmTotChart",
// this.setChartOption({ value: chartOption,
// chartKey: "compareEqpmTotChart", });
// value: chartOption,
// });
}, },
getGuageChartOption(chartName) { getGuageChartOption(chartName) {
const gaugeColors = [ const gaugeColors = [
@ -1506,8 +1433,8 @@ export default {
splitNumber: 10, splitNumber: 10,
itemStyle: { itemStyle: {
// color: '#FFAB91' // color: '#FFAB91'
// color: 'auto', color: "auto",
color: gaugeColors, // color:gaugeColors
}, },
progress: { progress: {
// show: true, // show: true,
@ -1518,8 +1445,8 @@ export default {
// show: false // show: false
show: true, show: true,
itemStyle: { itemStyle: {
color: "#FFAB91", // color: '#FFAB91',
// color: 'auto', color: "auto",
}, },
}, },
axisLine: { axisLine: {
@ -1565,140 +1492,12 @@ export default {
fontSize: 15, fontSize: 15,
// fontSize: 20, // fontSize: 20,
fontWeight: "bolder", fontWeight: "bolder",
formatter: "30%", formatter: "{value} %",
color: "auto", color: "auto",
}, },
data: [ data: [
{ {
name: "new", value: NaN,
value: 344,
},
],
},
],
};
return guageChartOption;
},
getGuageChartOption2(chartName) {
const gaugeColors = [
[0, "#ed1c24"],
[0.6, "#ed1c24"],
[0.8, "#f7931e"],
[1.0, "#009245"],
];
const gaugeColors2 = [
[0, "#009245"],
[0.6, "#009245"],
[0.8, "#f7931e"],
[1.0, "#ed1c24"],
];
var guageChartOption = {
grid: {
// top: '-10%',
bottom: 0,
},
title: {},
graphic: [
{
type: "circle",
left: "center",
top: "center",
shape: {
r: 97, // radius of the background circle
},
style: {
fill: this.isDarkMode ? "#141415" : "#F5F5F5", // Light grey color
opacity: 0.3, // Semi-transparent
},
z: 0, // make sure it's behind the gauge
},
],
series: [
{
type: "gauge",
radius: "90%",
startAngle: 225,
endAngle: -45,
min: 0,
max: 160,
// progress: {
// show: true,
// width: 15,
// },
axisLine: {
lineStyle: {
width: 12,
color: [
[0.375, "#3CB371"], // Green (060)
[0.5, "#FFD700"], // Yellow (6080)
[0.625, "#FFA500"], // Orange (80100)
[1, "#FF4500"], // Red (100160)
],
},
},
axisTick: {
distance: -5,
length: 5,
lineStyle: {
color: "#000000",
width: 1,
},
},
splitLine: {
distance: -12,
length: 8,
lineStyle: {
color: "#000000",
width: 2,
},
},
axisLabel: {
color: this.isDarkMode ? "#fff" : "#333333",
distance: 23,
fontSize: 9,
},
pointer: {
show: true,
length: "70%",
width: 6,
itemStyle: {
color: "#FA8C16", // Set your desired pointer color here
},
},
title: {
show: false,
offsetCenter: [0, "40%"],
fontSize: 18,
},
detail: {
valueAnimation: true,
fontWeight: 500, // or "normal", "lighter", "bolder", or a number like 600
fontFamily: "Oxanium, sans-serif", // or any custom font
fontSize: 30,
lineHeight: 25,
offsetCenter: [0, "60%"],
color: this.isDarkMode ? "#fff" : "#333333",
formatter: function (value) {
return `{valueStyle|${value}}\n{percentStyle|%}`;
},
rich: {
// valueStyle: {
// fontSize: 25,
// fontWeight: "bold",
// },
percentStyle: {
fontSize: 10,
color: this.isDarkMode ? "#fff" : "#333333",
// fontWeight: "normal",
},
},
},
data: [
{
value: 16,
name: "에너지사용효율", // "Energy Usage Efficiency"
}, },
], ],
}, },
@ -1847,7 +1646,6 @@ export default {
}[state]; }[state];
}, },
chartClickEvent(argData, $event) { chartClickEvent(argData, $event) {
// console.log('chartClickEvent', argData);
let pageMapper = { let pageMapper = {
dashBoard_enrgUsageGauge: { dashBoard_enrgUsageGauge: {
pageName: "ems-effc-EnrgUseTotSummPage", pageName: "ems-effc-EnrgUseTotSummPage",
@ -1909,32 +1707,18 @@ export default {
}); });
}, },
topTenChartClickEvent(event) { topTenChartClickEvent(event) {
// let chartData = this.pageData.chart04Data; let chartData = this.pageData.chart04Data;
// console.log("chart data first", this.pageData); // let chartData = this.$store.state.pageData[myPrgmId][this.chart_04]['series'][0]['data']
let chartData = this.$store.state.pageData[myPrgmId][this.chart_04]["series"][0][
"data"
];
console.log("select equipment", event["data"]["groupId"]);
let selectedChartData = chartData.filter((item) => { let selectedChartData = chartData.filter((item) => {
return item.eqpmId == event["data"]["groupId"]; return item.eqpmId == event["data"]["groupId"];
}); });
console.log("chart data", selectedChartData); var data = {
// var data = {
// cmCycle: "CYC_DAY",
// fromDt: Utility.setFormatDate(new Date(), "YYYY-MM-DD HH:mm"),
// fabId: selectedChartData[0].fabId,
// eqpmKindId: selectedChartData[0].eqpmKindId,
// eqpmGrpId: selectedChartData[0].eqpmGrpId,
// eqpmId: selectedChartData[0].eqpmId,
// };
var fake_data = {
cmCycle: "CYC_DAY", cmCycle: "CYC_DAY",
fromDt: Utility.setFormatDate(new Date(), "YYYY-MM-DD HH:mm"), fromDt: Utility.setFormatDate(new Date(), "YYYY-MM-DD HH:mm"),
fabId: 4555, fabId: selectedChartData[0].fabId,
eqpmKindId: 99988, eqpmKindId: selectedChartData[0].eqpmKindId,
eqpmGrpId: 88888, eqpmGrpId: selectedChartData[0].eqpmGrpId,
eqpmId: 99900, eqpmId: selectedChartData[0].eqpmId,
}; };
var key = "tick_" + Math.random(); var key = "tick_" + Math.random();
this.$router.push({ this.$router.push({
@ -1944,8 +1728,7 @@ export default {
// tick:key // tick:key
}, },
params: { params: {
// ...data, ...data,
...fake_data,
key: key, key: key,
}, },
}); });

View File

@ -1,6 +1,7 @@
<template> <template>
<div class="l-layout"> <div class="l-layout">
<v-row ref="searchFilter"> <common-page-title />
<v-row ref="searchFilter" class="mt-2">
<v-col :cols="12"> <v-col :cols="12">
<v-card class="searchFilter"> <v-card class="searchFilter">
<v-row align="end" no-gutters> <v-row align="end" no-gutters>
@ -16,8 +17,8 @@
</v-card> </v-card>
</v-col> </v-col>
</v-row> </v-row>
<v-row ref="contents"> <v-row ref="contents" class="pt-2">
<v-col :cols="5" style="height:100%"> <v-col :cols="5" style="height:100%" class="pr-2">
<v-card class="pb-5"> <v-card class="pb-5">
<div class="d-flex align-center justify-space-between pa-4"> <div class="d-flex align-center justify-space-between pa-4">
<v-card-title class="pa-0 custom-title-4">효율지표 리스트</v-card-title> <v-card-title class="pa-0 custom-title-4">효율지표 리스트</v-card-title>
@ -32,7 +33,7 @@
</div> </div>
</v-card> </v-card>
</v-col> </v-col>
<v-col :cols="7" style="height:100%"> <v-col :cols="7" style="height:100%" class="pl-2">
<v-card class="pb-5"> <v-card class="pb-5">
<v-card-title class="custom-title-4 pa-4 pb-2">효율지표 상세 <v-card-title class="custom-title-4 pa-4 pb-2">효율지표 상세
</v-card-title> </v-card-title>

View File

@ -1,6 +1,7 @@
<template> <template>
<div class="l-layout"> <div class="l-layout">
<v-row ref="searchFilter"> <common-page-title />
<v-row ref="searchFilter" class="mt-2">
<v-col :cols="12"> <v-col :cols="12">
<v-card class="searchFilter"> <v-card class="searchFilter">
<v-row align="end" no-gutters> <v-row align="end" no-gutters>
@ -19,7 +20,7 @@
:sendParam="{ commGrpCd: 'CO_USEFG', useFg: '1' }" :addAll="true" :labelCols="12" :sendParam="{ commGrpCd: 'CO_USEFG', useFg: '1' }" :addAll="true" :labelCols="12"
:textCols="12" :customClass="'select-large'" :iconShow="true" /> :textCols="12" :customClass="'select-large'" :iconShow="true" />
</v-col> </v-col>
<v-col :cols="2.5"> <v-col :cols="2.5" class="pr-4">
<InputText :parentPrgmId="myPrgmId" label="검침개소명" valueNm="readPlcNm" :labelCols="12" <InputText :parentPrgmId="myPrgmId" label="검침개소명" valueNm="readPlcNm" :labelCols="12"
:textCols="12" :searchOption="true" :customClass="'input-large'" :iconShow="true" /> :textCols="12" :searchOption="true" :customClass="'input-large'" :iconShow="true" />
</v-col> </v-col>
@ -30,25 +31,25 @@
</v-card> </v-card>
</v-col> </v-col>
</v-row> </v-row>
<v-row ref="contents" class="mt-4"> <v-row ref="contents" class="mt-3">
<v-col :cols="5" class="h100"> <v-col :cols="5" class="h100 pr-2">
<v-card class="pb-5"> <v-card class="pb-5">
<div class="d-flex align-center justify-space-between pa-4 pb-6"> <div class="d-flex align-center justify-space-between pa-4 pb-6">
<v-card-title class="pa-0 custom-title-4">검침개소 정보</v-card-title> <v-card-title class="pa-0 custom-title-4">검침개소 정보</v-card-title>
<Buttons :parentPrgmId="myPrgmId" :bindingData="gridName" :detailList="detailList" <Buttons :parentPrgmId="myPrgmId" :bindingData="gridName" :detailList="detailList"
:btnActionsFnc="btnActions" /> :btnActionsFnc="btnActions" />
</div> </div>
<div class="px-4"> <div class="px-4" style="height:calc(100% - 76px)">
<div ref="gridParent" class="w100 h100"> <div ref="gridParent" class="w100 h100">
<component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName" <component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName"
:parentPrgmId="myPrgmId" @getRowsData="getRowData" :parentPrgmId="myPrgmId" @getRowsData="getRowData"
@sendSelectedRowStatInfo="getSelectedRowStatInfo" :selectedRowDataWatchFlag="true" @sendSelectedRowStatInfo="getSelectedRowStatInfo" :selectedRowDataWatchFlag="true"
:dataPath="dataPathExample" /> />
</div> </div>
</div> </div>
</v-card> </v-card>
</v-col> </v-col>
<v-col :cols="7" class="h100"> <v-col :cols="7" class="h100 pl-2">
<v-card class="pb-5"> <v-card class="pb-5">
<v-card-title class="custom-title-4 pb-1 pa-4">검침개소 상세 <v-card-title class="custom-title-4 pb-1 pa-4">검침개소 상세
</v-card-title> </v-card-title>
@ -134,7 +135,7 @@ export default {
return { return {
myPrgmId: myPrgmId, myPrgmId: myPrgmId,
gridName: 'rowGrid', gridName: 'rowGrid',
loadGrid: true, loadGrid: false,
tab: null, tab: null,
isImgTabDisabled: false, isImgTabDisabled: false,
items: [ items: [
@ -157,47 +158,6 @@ export default {
], ],
detailList: myDetail, detailList: myDetail,
defaultUseFg: 1, defaultUseFg: 1,
dataPathExample: {
"rowGrid": {
data: sampleData,
column: [
{
header: '',
name: '',
align: 'center',
width: 50,
formatter: (props) => {
return `<label class="custom-radio">
<span class="radio-mark"></span>
</label>`;
}
},
{
header: '검침개소명',
name: 'readPlcNm',
align: 'left',
minWidth: 400,
},
{
header: '개소 종류',
name: 'plcKind',
minWidth: 100,
align: 'center',
},
{
header: '사용 여부',
name: 'useFg',
minWidth: 100,
align: 'center',
},
],
option: myOptions,
}
}
// loadTree: false // loadTree: false
}; };
}, },
@ -312,18 +272,18 @@ export default {
}, },
async initData() { async initData() {
let ercList = []; let ercList = [];
// const res = await this.postApiReturn({ const res = await this.postApiReturn({
// apiKey: 'selectErcInfo', apiKey: 'selectErcInfo',
// resKey: 'ercInfoData', resKey: 'ercInfoData',
// sendParam: { sendParam: {
// blocId: this.userInfo.blocId, blocId: this.userInfo.blocId,
// }, },
// }); });
// res.forEach(item => { res.forEach(item => {
// const it = { text: item.ercNm, value: item.ercId }; const it = { text: item.ercNm, value: item.ercId };
// ercList.push(it); ercList.push(it);
// }); });
// this.setPageData({ ercNmList: ercList }); this.setPageData({ ercNmList: ercList });
}, },
gridInit() { gridInit() {
const gridHeight = this.$refs.gridParent.offsetHeight - 30; const gridHeight = this.$refs.gridParent.offsetHeight - 30;
@ -334,10 +294,12 @@ export default {
resizable: true, resizable: true,
}, },
treeColumnOptions: { treeColumnOptions: {
name: 'eccNm',       // Showing tree table name: 'readPlcNm',
useIcon: false,      // Not using icon
indentWidth: 10,
}, },
header: {
height: 37,
},
rowHeight: 37,
}; };
this.setGridOption({ this.setGridOption({
gridKey: this.gridName, gridKey: this.gridName,
@ -531,7 +493,7 @@ export default {
if (this.tab == 2) { if (this.tab == 2) {
this.tab = 0; this.tab = 0;
} }
this.isImgTabDisabled = true; this.isImgTabDisabled = false;
} else { } else {
this.isImgTabDisabled = false; this.isImgTabDisabled = false;
} }
@ -999,18 +961,6 @@ const sampleData = [
]; ];
const myOptions = {
columnOptions: {
resizable: true,
},
treeColumnOptions: {
name: 'readPlcNm',       // Showing tree table
useIcon: false,      // Not using icon
indentWidth: 10,
},
}
const myDetail = [ const myDetail = [
{ {
type: 'InputText', type: 'InputText',

View File

@ -12,6 +12,7 @@
:textCols="12" :textCols="12"
:labelCols="12" :labelCols="12"
:parentPrgmId="myPrgmId" :parentPrgmId="myPrgmId"
:customClass="'select-large'"
/> />
</v-col> </v-col>
<v-col :cols="3"> <v-col :cols="3">
@ -22,6 +23,7 @@
dataKey="searchErcKind" dataKey="searchErcKind"
:sendParam="{ commGrpCd: 'EM_ERCKIND', useFg: '1' }" :sendParam="{ commGrpCd: 'EM_ERCKIND', useFg: '1' }"
:addAll="true" :addAll="true"
:customClass="'select-large'"
/> />
</v-col> </v-col>
<v-col :cols="3"> <v-col :cols="3">
@ -34,13 +36,9 @@
:addAll="true" :addAll="true"
:textCols="12" :textCols="12"
:labelCols="12" :labelCols="12"
:customClass="'select-large'"
/> />
</v-col> </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 :cols="3">
<component <component
:is="'selectCodeList'" :is="'selectCodeList'"
@ -49,8 +47,11 @@
dataKey="searchChrgKind" dataKey="searchChrgKind"
:sendParam="{ commGrpCd: 'EM_ENGCHAGKIND', useFg: '1' }" :sendParam="{ commGrpCd: 'EM_ENGCHAGKIND', useFg: '1' }"
:addAll="true" :addAll="true"
:customClass="'select-large'"
/> />
</v-col> </v-col>
</v-row>
<v-row align="center" no-gutters>
<v-col :cols="3"> <v-col :cols="3">
<component <component
:is="'selectCodeList'" :is="'selectCodeList'"
@ -59,6 +60,7 @@
dataKey="useFg" dataKey="useFg"
:sendParam="{ commGrpCd: 'CO_USEFG', useFg: '1' }" :sendParam="{ commGrpCd: 'CO_USEFG', useFg: '1' }"
:addAll="true" :addAll="true"
:customClass="'select-large'"
/> />
</v-col> </v-col>
<v-col :cols="3"> <v-col :cols="3">
@ -69,8 +71,14 @@
:textCols="12" :textCols="12"
:labelCols="12" :labelCols="12"
:searchOption="true" :searchOption="true"
:customClass="'input-large'"
/> />
</v-col> </v-col>
<v-col :cols="3">
</v-col>
<v-col :cols="3" class="text-right">
<BtnSearch :size="'default'" @click="search" />
</v-col>
</v-row> </v-row>
</v-card> </v-card>
</v-col> </v-col>
@ -323,6 +331,9 @@ export default {
columnOptions: { columnOptions: {
resizable: true, resizable: true,
}, },
header: {
height: 38,
},
}; };
this.setGridOption({ this.setGridOption({
gridKey: this.gridName, gridKey: this.gridName,
@ -332,12 +343,12 @@ export default {
const _this = this; const _this = this;
const myColumns = [ const myColumns = [
{ header: '회사 ID', name: 'comId', hidden: true }, { header: '회사 ID', name: 'comId', hidden: true },
{ header: '에너지원ID', name: 'ercId', width: 120, align: 'center' }, { header: '에너지원ID', name: 'ercId', width: 120, align: 'left' },
{ header: '에너지원명', name: 'ercNm', align: 'left' }, { header: '에너지원명', name: 'ercNm', align: 'left' },
{ {
header: '에너지원 유형', header: '에너지원 유형',
name: 'ercKind', name: 'ercKind',
align: 'center', align: 'left',
formatter({ value }) { formatter({ value }) {
let retVal = ''; let retVal = '';
const newValue = _this.pageData.ercKindList.filter( const newValue = _this.pageData.ercKindList.filter(
@ -450,7 +461,7 @@ export default {
header: '사용 여부', header: '사용 여부',
name: 'useFg', name: 'useFg',
width: 95, width: 95,
align: 'center', align: 'left',
formatter({ value }) { formatter({ value }) {
value = value === true ? '1' : '0'; value = value === true ? '1' : '0';
const newValue = _this.pageData.useFgList.filter( const newValue = _this.pageData.useFgList.filter(
@ -479,74 +490,24 @@ export default {
this.loadGrid = true; this.loadGrid = true;
}, },
async getRowGridData() { async getRowGridData() {
let res = [ let res = [];
{
"comId": "COM001",
"ercId": "ERC001",
"ercNm": "LNG 가스",
"ercKind": "GAS",
"readObjId": "READ001",
"readPlcId": "PLC001",
"chrgKind": "FIXED",
"unitPrce": 120.5,
"prceFg": "1",
"peakPow": 500,
"elecContId": "EC001",
"elecContNm": "계약A",
"blocId": "BLOC001",
"useFg": true
},
{
"comId": "COM002",
"ercId": "ERC002",
"ercNm": "태양광",
"ercKind": "ELEC",
"readObjId": "READ002",
"readPlcId": "PLC002",
"chrgKind": "VARIABLE",
"unitPrce": 95.0,
"prceFg": "0",
"peakPow": 300,
"elecContId": "EC002",
"elecContNm": "계약B",
"blocId": "BLOC002",
"useFg": false
},
{
"comId": "COM003",
"ercId": "ERC003",
"ercNm": "지열",
"ercKind": "HEAT",
"readObjId": "READ003",
"readPlcId": "PLC003",
"chrgKind": "FIXED",
"unitPrce": 110.0,
"prceFg": "1",
"peakPow": 450,
"elecContId": "EC003",
"elecContNm": "계약C",
"blocId": "BLOC003",
"useFg": true
}
]
;
// if (this.pageData.blocMstrList.length > 0) { if (this.pageData.blocMstrList.length > 0) {
// res = await this.postApiReturn({ res = await this.postApiReturn({
// apiKey: 'selectErcInfo', apiKey: 'selectErcInfo',
// resKey: 'ercInfoData', resKey: 'ercInfoData',
// sendParam: { sendParam: {
// blocId: this.pageData.blocMstrList[this.pageData.blocId].blocId, blocId: this.pageData.blocMstrList[this.pageData.blocId].blocId,
// ercKind: this.pageData.searchErcKind, ercKind: this.pageData.searchErcKind,
// readObjId: this.pageData.searchReadObj, readObjId: this.pageData.searchReadObj,
// chrgKind: this.pageData.searchChrgKind, chrgKind: this.pageData.searchChrgKind,
// useFg: this.pageData.useFg, useFg: this.pageData.useFg,
// ercNmLike: this.pageData.ercNm, ercNmLike: this.pageData.ercNm,
// }, },
// }); });
// } else { } else {
// this.setPageData({ isFind: false }); this.setPageData({ isFind: false });
// } }
const newRes = res.map(item => { const newRes = res.map(item => {
const newObj = { const newObj = {
...item, ...item,
@ -798,133 +759,8 @@ const defaultData = {
/* data 세팅 */ /* data 세팅 */
// 로컬 gridName 값과 동일한 이름으로 세팅 // 로컬 gridName 값과 동일한 이름으로 세팅
rowGrid: { rowGrid: {
data: [ data: [],
{ column: [], // myColumns,
"comId": "COM001",
"ercId": "ERC001",
"ercNm": "LNG 가스",
"ercKind": "GAS",
"readObjId": "READ001",
"readPlcId": "PLC001",
"chrgKind": "FIXED",
"unitPrce": 120.5,
"prceFg": "1",
"peakPow": 500,
"elecContId": "EC001",
"elecContNm": "계약A",
"blocId": "BLOC001",
"useFg": true
},
{
"comId": "COM002",
"ercId": "ERC002",
"ercNm": "태양광",
"ercKind": "ELEC",
"readObjId": "READ002",
"readPlcId": "PLC002",
"chrgKind": "VARIABLE",
"unitPrce": 95.0,
"prceFg": "0",
"peakPow": 300,
"elecContId": "EC002",
"elecContNm": "계약B",
"blocId": "BLOC002",
"useFg": false
},
{
"comId": "COM003",
"ercId": "ERC003",
"ercNm": "지열",
"ercKind": "HEAT",
"readObjId": "READ003",
"readPlcId": "PLC003",
"chrgKind": "FIXED",
"unitPrce": 110.0,
"prceFg": "1",
"peakPow": 450,
"elecContId": "EC003",
"elecContNm": "계약C",
"blocId": "BLOC003",
"useFg": true
}
],
column: [
{ header: '회사 ID', name: 'comId', hidden: true },
{ header: '에너지원ID', name: 'ercId', width: 120, align: 'center' },
{ header: '에너지원명', name: 'ercNm', align: 'left' },
{
header: '에너지원 유형',
name: 'ercKind',
align: 'center',
},
{
header: '검침대상',
name: 'readObjId',
align: 'left',
},
{
header: '검침 개소 ID',
name: 'readPlcId',
width: 80,
align: 'center',
hidden: true,
},
{
header: '고지 유형',
name: 'chrgKind',
width: 80,
align: 'center',
hidden: true,
},
{
header: '기본단가',
name: 'unitPrce',
width: 100,
align: 'right',
hidden: true,
},
{
header: '단가 사용여부',
name: 'prceFg',
width: 100,
align: 'center',
hidden: true,
},
{
header: '피크 전력',
name: 'peakPow',
width: 100,
align: 'right',
hidden: true,
},
{
header: '전력 계약',
name: 'elecContId',
width: 100,
align: 'center',
hidden: true,
},
{
header: '전력 계약',
name: 'elecContNm',
width: 100,
align: 'center',
hidden: true,
},
{
header: '사업장',
name: 'blocId',
width: 100,
align: 'center',
hidden: true,
},
{
header: '사용 여부',
name: 'useFg',
width: 95,
align: 'center',
}
], // myColumns,
option: {}, // myOptions option: {}, // myOptions
defaultRow: { defaultRow: {
comId: '', comId: '',

View File

@ -1,6 +1,7 @@
<template> <template>
<div ref="mainDiv" class="l-layout"> <div ref="mainDiv" class="l-layout">
<v-row ref="searchFilter"> <common-page-title />
<v-row ref="searchFilter" class="mt-2">
<v-col :cols="12"> <v-col :cols="12">
<v-card class="searchFilter"> <v-card class="searchFilter">
<v-row align="end" no-gutters> <v-row align="end" no-gutters>
@ -29,10 +30,10 @@
</v-card> </v-card>
</v-col> </v-col>
</v-row> </v-row>
<v-row ref="contents"> <v-row ref="contents" class="mt-3">
<v-col :cols="5" class="h100"> <v-col :cols="5" class="h100 pr-2">
<v-card class="pb-5"> <v-card class="pb-5">
<v-card-title class="d-flex align-center justify-space-between pa-4"> <v-card-title class="d-flex align-center justify-space-between pa-5">
물리량 리스트 물리량 리스트
<Buttons :parentPrgmId="myPrgmId" :bindingData="gridName" :detailList="detailList" <Buttons :parentPrgmId="myPrgmId" :bindingData="gridName" :detailList="detailList"
@ -44,12 +45,12 @@
:parentPrgmId="myPrgmId" @getRowsData="getRowData" :parentPrgmId="myPrgmId" @getRowsData="getRowData"
@sendSelectedRowStatInfo="getSelectedRowStatInfo" :selectedRowDataWatchFlag="true" @sendSelectedRowStatInfo="getSelectedRowStatInfo" :selectedRowDataWatchFlag="true"
:preventFocusChangeEventFlag="true" :preventFocusChangeEventFlag="true"
:preventFocusChangeEventTargetGridList="editingGridList" :dataPath="dataPathExample" /> :preventFocusChangeEventTargetGridList="editingGridList" />
</div> </div>
</div> </div>
</v-card> </v-card>
</v-col> </v-col>
<v-col :cols="7" class="h100"> <v-col :cols="7" class="h100 pl-2">
<v-card class="pb-5 px-4"> <v-card class="pb-5 px-4">
<v-card-title class="px-0">물리량 상세</v-card-title> <v-card-title class="px-0">물리량 상세</v-card-title>
<v-row no-gutters> <v-row no-gutters>
@ -136,7 +137,7 @@
<v-col :cols="12" style="height:100%"> <v-col :cols="12" style="height:100%">
<div ref="gridParent2" style="height:100%"> <div ref="gridParent2" style="height:100%">
<component :ref="gridName2" :is="loadGrid2 ? 'Grid' : null" :gridName="gridName2" <component :ref="gridName2" :is="loadGrid2 ? 'Grid' : null" :gridName="gridName2"
:parentPrgmId="myPrgmId" @getRowsData="getRowData2" :dataPath="dataPathExample2" /> :parentPrgmId="myPrgmId" @getRowsData="getRowData2" />
</div> </div>
</v-col> </v-col>
</v-row> </v-row>
@ -223,7 +224,7 @@ export default {
formatterSelectList01: [], formatterSelectList01: [],
formatterSelectList02: [], formatterSelectList02: [],
loadGrid: true, loadGrid: false,
dataPathExample: { dataPathExample: {
"rowGrid": { "rowGrid": {
data: [ data: [
@ -279,59 +280,7 @@ export default {
} }
}, },
dataPathExample2: { loadGrid2: false,
"rowGrid2": {
data:
[
{
"argSeq": "1",
"argPysclQtyId": "001",
"eqpmGrpId": "EQPM-GRP-A",
"pysclQtyCd": "TEMP001"
},
{
"argSeq": "2",
"argPysclQtyId": "002",
"eqpmGrpId": "EQPM-GRP-B",
"pysclQtyCd": "PRESS001"
},
{
"argSeq": "3",
"argPysclQtyId": "003",
"eqpmGrpId": "EQPM-GRP-C",
"pysclQtyCd": "FLOW001"
},
{
"argSeq": "4",
"argPysclQtyId": "004",
"eqpmGrpId": "EQPM-GRP-D",
"pysclQtyCd": "HUMID001"
},
{
"argSeq": "5",
"argPysclQtyId": "005",
"eqpmGrpId": "EQPM-GRP-E",
"pysclQtyCd": "VOLT001"
}
]
,
column: [
{ header: '순번', name: 'argSeq', editor: 'text' },
{ header: '물리량 ID', name: 'argPysclQtyId' },
{
header: '설비그룹',
name: 'eqpmGrpId',
},
{ header: '물리량 코드', name: 'pysclQtyCd' },
],
}
},
loadGrid2: true,
detailList: myDetail, detailList: myDetail,
readOnlyValueList: [ readOnlyValueList: [
@ -1001,6 +950,10 @@ export default {
columnOptions: { columnOptions: {
resizable: true, resizable: true,
}, },
header: {
height: 37,
},
rowHeight: 'auto',
}; };
this.setGridOption({ this.setGridOption({
@ -1066,6 +1019,10 @@ export default {
columnOptions: { columnOptions: {
resizable: true, resizable: true,
}, },
header: {
height: 37,
},
rowHeight: 'auto',
}; };
this.setGridOption({ this.setGridOption({

View File

@ -1,6 +1,7 @@
<template> <template>
<div ref="mainDiv" class="l-layout"> <div ref="mainDiv" class="l-layout">
<v-row ref="searchFilter"> <common-page-title />
<v-row ref="searchFilter" class="mt-2">
<v-col :cols="12"> <v-col :cols="12">
<v-card class="searchFilter"> <v-card class="searchFilter">
<v-row align="end" no-gutters> <v-row align="end" no-gutters>
@ -37,11 +38,11 @@
:btnActionsFnc="btnActions" /> :btnActionsFnc="btnActions" />
</div> </div>
<div class="h100 px-4" style="height:calc(100% - 70px)"> <div class="h100 px-4" style="height:calc(100% - 70px)">
<div ref="gridParent" > <div ref="gridParent" style="height: 30%">
<component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName" <component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName"
:parentPrgmId="myPrgmId" @getRowsData="getRowData" :dataPath="dataPathExample" /> :parentPrgmId="myPrgmId" @getRowsData="getRowData" :dataPath="dataPathExample" />
</div> </div>
<div class="d-flex py-4"> <div class="d-flex py-4 mt-4" >
<component :is="'Form'" :parentPrgmId="myPrgmId" :detailList="detailList" <component :is="'Form'" :parentPrgmId="myPrgmId" :detailList="detailList"
@gridEditingFinish="gridEditingFinish" /> @gridEditingFinish="gridEditingFinish" />
</div> </div>
@ -112,7 +113,7 @@ export default {
myPrgmId: myPrgmId, myPrgmId: myPrgmId,
initedFlag: false, initedFlag: false,
gridName: 'rowGrid', gridName: 'rowGrid',
loadGrid: true, loadGrid: false,
detailList: myDetail, detailList: myDetail,
selectValue01: null, selectValue01: null,
selectValueList01: [], selectValueList01: [],
@ -125,102 +126,102 @@ export default {
// pysclQtyId3 : null, // pysclQtyId3 : null,
// pysclQtyId4 : null // pysclQtyId4 : null
// } // }
dataPathExample: { // dataPathExample: {
"rowGrid": { // "rowGrid": {
data: [ // data: [
{ // {
gdIdxId: 'GD001', // gdIdxId: 'GD001',
gdIdxNm: '온도 가이드', // gdIdxNm: '온도 가이드',
eqpmGrpId: 'EQ001', // eqpmGrpId: 'EQ001',
upTotMeth: 'AVG', // upTotMeth: 'AVG',
careStndVal: 50, // careStndVal: 50,
warnStndVal: 70, // warnStndVal: 70,
alrmMsg: '온도가 기준치를 초과했습니다.', // alrmMsg: '온도가 기준치를 초과했습니다.',
},
{
gdIdxId: 'GD002',
gdIdxNm: '습도 가이드',
eqpmGrpId: 'EQ002',
upTotMeth: 'MAX',
careStndVal: 30,
warnStndVal: 60,
alrmMsg: '습도가 기준치를 초과했습니다.',
},
{
gdIdxId: 'GD003',
gdIdxNm: '압력 가이드',
eqpmGrpId: 'EQ003',
upTotMeth: 'SUM',
careStndVal: 100,
warnStndVal: 150,
alrmMsg: '압력이 기준치를 초과했습니다.',
}
],
column: [
{
header: '가이드',
name: 'gdIdxId',
width: 100,
align: 'center',
},
{
header: '가이드명',
name: 'gdIdxNm',
width: 210,
align: 'left',
},
{
header: '설비그룹ID',
name: 'eqpmGrpId',
width: 100,
align: 'center',
// formatter({ value }) {
// let retVal = '';
// const newValue = _this.pageData.eqpmGrpList.filter(item => item.value == value);
// if (newValue.length > 0) {
// retVal = newValue[0].text;
// }
// return retVal;
// }, // },
}, // {
{ // gdIdxId: 'GD002',
header: '상위집계방법', // gdIdxNm: '습도 가이드',
name: 'upTotMeth', // eqpmGrpId: 'EQ002',
width: 100, // upTotMeth: 'MAX',
align: 'center', // careStndVal: 30,
// formatter({ value }) { // warnStndVal: 60,
// let retVal = ''; // alrmMsg: '습도가 기준치를 초과했습니다.',
// const newValue = _this.pageData.upTotMethList.filter(item => item.commCd == value);
// if (newValue.length > 0) {
// retVal = newValue[0].commCdNm;
// }
// return retVal;
// }, // },
}, // {
{ // gdIdxId: 'GD003',
header: '주의기준', // gdIdxNm: '압력 가이드',
name: 'careStndVal', // eqpmGrpId: 'EQ003',
width: 100, // upTotMeth: 'SUM',
align: 'right', // careStndVal: 100,
}, // warnStndVal: 150,
{ // alrmMsg: '압력이 기준치를 초과했습니다.',
header: '경고기준', // }
name: 'warnStndVal',
width: 100,
align: 'right',
},
{
header: '알람메세지',
name: 'alrmMsg',
minWidth: 860,
align: 'left',
}
]
} // ],
} // column: [
// {
// header: '가이드',
// name: 'gdIdxId',
// width: 100,
// align: 'center',
// },
// {
// header: '가이드명',
// name: 'gdIdxNm',
// width: 210,
// align: 'left',
// },
// {
// header: '설비그룹ID',
// name: 'eqpmGrpId',
// width: 100,
// align: 'center',
// // formatter({ value }) {
// // let retVal = '';
// // const newValue = _this.pageData.eqpmGrpList.filter(item => item.value == value);
// // if (newValue.length > 0) {
// // retVal = newValue[0].text;
// // }
// // return retVal;
// // },
// },
// {
// header: '상위집계방법',
// name: 'upTotMeth',
// width: 100,
// align: 'center',
// // formatter({ value }) {
// // let retVal = '';
// // const newValue = _this.pageData.upTotMethList.filter(item => item.commCd == value);
// // if (newValue.length > 0) {
// // retVal = newValue[0].commCdNm;
// // }
// // return retVal;
// // },
// },
// {
// header: '주의기준',
// name: 'careStndVal',
// width: 100,
// align: 'right',
// },
// {
// header: '경고기준',
// name: 'warnStndVal',
// width: 100,
// align: 'right',
// },
// {
// header: '알람메세지',
// name: 'alrmMsg',
// minWidth: 860,
// align: 'left',
// }
// ]
// }
// }
}; };
}, },
computed: { computed: {
@ -352,60 +353,46 @@ export default {
}); });
}, },
async getEqpmKind() { async getEqpmKind() {
// let res = await this.postApiReturn({ let res = await this.postApiReturn({
// apiKey: 'selectEqpmKindCodeList', apiKey: 'selectEqpmKindCodeList',
// resKey: 'eqpmKindCodeLists', resKey: 'eqpmKindCodeLists',
// sendParam: {}, sendParam: {},
// }); });
// if (res.length > 0) { if (res.length > 0) {
// this.selectValueList01 = await res.map(item => { this.selectValueList01 = await res.map(item => {
// return { return {
// text: item.eqpmKindNm, text: item.eqpmKindNm,
// value: item.eqpmKindId, value: item.eqpmKindId,
// }; };
// }); });
// this.selectValue01 = this.selectValueList01[0].value; this.selectValue01 = this.selectValueList01[0].value;
// } else { } else {
// this.selectValueList01 = []; this.selectValueList01 = [];
// this.selectValue01 = null; this.selectValue01 = null;
// } }
this.selectValueList01 = [
{ label: 'Etcher', value: 'EQK001' },
{ label: 'Deposition', value: 'EQK002' },
{ label: 'Inspection', value: 'EQK003' },
];
this.selectValue01 = 'EQK001';
this.setPageData({ this.setPageData({
eqpmKindList: this.selectValueList01, eqpmKindList: this.selectValueList01,
eqpmKindId: this.selectValue01, eqpmKindId: this.selectValue01,
}); });
}, },
async getEqpmGrp() { async getEqpmGrp() {
// let res = await this.postApiReturn({ let res = await this.postApiReturn({
// apiKey: 'selectEqpmGrpCodeList', apiKey: 'selectEqpmGrpCodeList',
// resKey: 'eqpmGrpCodeLists', resKey: 'eqpmGrpCodeLists',
// sendParam: { eqpmKindId: this.selectValue01 }, sendParam: { eqpmKindId: this.selectValue01 },
// }); });
// if (res.length > 0) { if (res.length > 0) {
// this.selectValueList02 = await res.map(item => { this.selectValueList02 = await res.map(item => {
// return { return {
// text: item.eqpmGrpNm, text: item.eqpmGrpNm,
// value: item.eqpmGrpId, value: item.eqpmGrpId,
// }; };
// }); });
// this.selectValue02 = this.selectValueList02[0].value; this.selectValue02 = this.selectValueList02[0].value;
// } else { } else {
// this.selectValueList02 = []; this.selectValueList02 = [];
// this.selectValue02 = null; this.selectValue02 = null;
// } }
this.selectValueList02 = [
{ label: '냉동기고온', value: '냉동기고온' },
{ label: '냉동기저온', value: '냉동기저온' },
{ label: '공조기', value: '공조기' },
{ label: '보일러', value: '보일러' }
];
this.setPageData({ this.setPageData({
eqpmGrpList: this.selectValueList02, eqpmGrpList: this.selectValueList02,
@ -419,6 +406,10 @@ export default {
columnOptions: { columnOptions: {
resizable: true, resizable: true,
}, },
header: {
height: 37,
},
rowHeight: 'auto',
}; };
this.setGridOption({ this.setGridOption({
gridKey: this.gridName, gridKey: this.gridName,
@ -636,100 +627,100 @@ export default {
async getRowGridData() { async getRowGridData() {
this.loadGrid = false; this.loadGrid = false;
let res = []; let res = [];
const newRes = [ // const newRes = [
{ // {
comId: 'COM001', // comId: 'COM001',
gdIdxId: 'GD001', // gdIdxId: 'GD001',
gdIdxNm: '온도 가이드', // gdIdxNm: '온도 가이드',
eqpmGrpId: 'EQ001', // eqpmGrpId: 'EQ001',
upTotMeth: 'AVG', // upTotMeth: 'AVG',
sortSeq: 1, // sortSeq: 1,
pysclQtyId1: 'TEMP', // pysclQtyId1: 'TEMP',
pysclQtyId2: null, // pysclQtyId2: null,
pysclQtyId3: null, // pysclQtyId3: null,
pysclQtyId4: null, // pysclQtyId4: null,
ctgr1: '환경', // ctgr1: '환경',
ctgr2: '내부', // ctgr2: '내부',
careStndVal: 50, // careStndVal: 50,
warnStndVal: 70, // warnStndVal: 70,
gdMeth: '자동', // gdMeth: '자동',
useFg: '1', // useFg: '1',
alrmMsg: '온도가 기준치를 초과했습니다.', // alrmMsg: '온도가 기준치를 초과했습니다.',
calcProc: 'PROC001', // calcProc: 'PROC001',
calcDesc: '평균 계산', // calcDesc: '평균 계산',
calcMeth: '(A+B)/2', // calcMeth: '(A+B)/2',
unit: 'C', // unit: 'C',
argCnt: 2, // argCnt: 2,
rowStat: null,
},
{
comId: 'COM002',
gdIdxId: 'GD002',
gdIdxNm: '습도 가이드',
eqpmGrpId: 'EQ002',
upTotMeth: 'MAX',
sortSeq: 2,
pysclQtyId1: 'HUMID',
pysclQtyId2: null,
pysclQtyId3: null,
pysclQtyId4: null,
ctgr1: '환경',
ctgr2: '외부',
careStndVal: 30,
warnStndVal: 60,
gdMeth: '수동',
useFg: '0',
alrmMsg: '습도가 기준치를 초과했습니다.',
calcProc: 'PROC002',
calcDesc: '최대값 계산',
calcMeth: 'MAX(A,B)',
unit: '%',
argCnt: 2,
rowStat: null,
},
];
// res = await this.postApiReturn({
// apiKey: 'selectEqpmGdIdxDataList',
// resKey: 'eqpmGdIdxDataList',
// sendParam: {
// eqpmGrpId: this.selectValue02,
// gdIdxNmLike: this.pageData.gdIdxNm,
// },
// });
// const newRes = res.map(item => {
// const newObj = {
// ...item,
// rowStat: null, // rowStat: null,
// }; // },
// return newObj; // {
// }); // comId: 'COM002',
// gdIdxId: 'GD002',
// gdIdxNm: '습도 가이드',
// eqpmGrpId: 'EQ002',
// upTotMeth: 'MAX',
// sortSeq: 2,
// pysclQtyId1: 'HUMID',
// pysclQtyId2: null,
// pysclQtyId3: null,
// pysclQtyId4: null,
// ctgr1: '환경',
// ctgr2: '외부',
// careStndVal: 30,
// warnStndVal: 60,
// gdMeth: '수동',
// useFg: '0',
// alrmMsg: '습도가 기준치를 초과했습니다.',
// calcProc: 'PROC002',
// calcDesc: '최대값 계산',
// calcMeth: 'MAX(A,B)',
// unit: '%',
// argCnt: 2,
// rowStat: null,
// },
// ];
res = await this.postApiReturn({
apiKey: 'selectEqpmGdIdxDataList',
resKey: 'eqpmGdIdxDataList',
sendParam: {
eqpmGrpId: this.selectValue02,
gdIdxNmLike: this.pageData.gdIdxNm,
},
});
const newRes = res.map(item => {
const newObj = {
...item,
rowStat: null,
};
return newObj;
});
this.setGridData({ this.setGridData({
gridKey: this.gridName, gridKey: this.gridName,
value: newRes, value: newRes,
}); });
//this.loadGrid = true; //this.loadGrid = true;
// this.$nextTick(() => { this.$nextTick(() => {
// if (newRes.length > 0) { if (newRes.length > 0) {
// try { try {
// this.$refs[this.gridName].focus({ this.$refs[this.gridName].focus({
// //rowKey: 0, //rowKey: 0,
// rowKey: rowKey:
// this.pageData.rowGridSelectKey == '' || this.pageData.rowGridSelectKey == '' ||
// this.pageData.rowGridSelectKey == null this.pageData.rowGridSelectKey == null
// ? 0 ? 0
// : this.pageData.rowGridSelectKey == : this.pageData.rowGridSelectKey ==
// this.$refs[this.gridName].getData().length - 1 this.$refs[this.gridName].getData().length - 1
// ? this.pageData.rowGridSelectKey ? this.pageData.rowGridSelectKey
// : 0, : 0,
// columnName: 'gdIdxId', columnName: 'gdIdxId',
// setScroll: true, setScroll: true,
// }); });
// } catch (error) { } } catch (error) { }
// } else { } else {
// this.detailDataInit(); this.detailDataInit();
// } }
// }); });
this.loadGrid = true; this.loadGrid = true;
}, },
async getRowData(data) { async getRowData(data) {

View File

@ -1,6 +1,7 @@
<template> <template>
<div ref="mainDiv" class="l-layout"> <div ref="mainDiv" class="l-layout">
<v-row ref="searchFilter"> <common-page-title />
<v-row ref="searchFilter" class="mt-2">
<v-col :cols="12"> <v-col :cols="12">
<v-card class="searchFilter"> <v-card class="searchFilter">
<v-row align="end" no-gutters> <v-row align="end" no-gutters>
@ -29,7 +30,7 @@
</v-card> </v-card>
</v-col> </v-col>
</v-row> </v-row>
<v-row ref="contents" class="mt-4"> <v-row ref="contents" class="mt-3">
<v-col :cols="12" style="height: 100%"> <v-col :cols="12" style="height: 100%">
<!-- <v-card class="py-5"> --> <!-- <v-card class="py-5"> -->
<v-card style="height: 60%"> <v-card style="height: 60%">
@ -115,8 +116,8 @@
</v-card> </v-card>
<v-row style="height: 40%" class="mt-4"> <v-row style="height: 40%" class="mt-3">
<v-col :cols="6" style="height: 100%"> <v-col :cols="6" style="height: 100%" class="pr-2">
<v-card class="pb-5"> <v-card class="pb-5">
<div class="d-flex align-center justify-space-between pa-4"> <div class="d-flex align-center justify-space-between pa-4">
<v-card-title class="pa-0 custom-title-4 ">설비상세 리스트</v-card-title> <v-card-title class="pa-0 custom-title-4 ">설비상세 리스트</v-card-title>
@ -126,12 +127,12 @@
<div ref="gridParent" class="w100 h100"> <div ref="gridParent" class="w100 h100">
<component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName" <component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName"
:parentPrgmId="myPrgmId" @getRowsData="getRowData" :parentPrgmId="myPrgmId" @getRowsData="getRowData"
:dataPath="dataPathExample" /> />
</div> </div>
</div> </div>
</v-card> </v-card>
</v-col> </v-col>
<v-col :cols="6" style="height: 100%"> <v-col :cols="6" style="height: 100%" class="pl-2">
<v-card class="pb-5"> <v-card class="pb-5">
<div class="d-flex align-center justify-space-between pa-4"> <div class="d-flex align-center justify-space-between pa-4">
<v-card-title class="pa-0 custom-title-4">설비가이드 기준 정보</v-card-title> <v-card-title class="pa-0 custom-title-4">설비가이드 기준 정보</v-card-title>
@ -201,7 +202,7 @@ export default {
readonlyFg: true, readonlyFg: true,
initedFlag: false, initedFlag: false,
gridName: 'rowGrid', gridName: 'rowGrid',
loadGrid: true, loadGrid: false,
detailList: myDetail, detailList: myDetail,
selectValue01: null, selectValue01: null,
selectValueList01: [], selectValueList01: [],
@ -209,62 +210,62 @@ export default {
selectValueList02: [], selectValueList02: [],
selectValue03: null, selectValue03: null,
selectValueList03: [], selectValueList03: [],
dataPathExample: { // dataPathExample: {
"rowGrid": { // "rowGrid": {
data: [ // data: [
{ // {
eqpmId: 'EQ001', // eqpmId: 'EQ001',
originEqpmId: 'ORIG001', // originEqpmId: 'ORIG001',
eqpmNm: '냉각기 A', // eqpmNm: '냉각기 A',
careStndVal: 75, // careStndVal: 75,
warnStndVal: 90, // warnStndVal: 90,
}, // },
{ // {
eqpmId: 'EQ002', // eqpmId: 'EQ002',
originEqpmId: 'ORIG002', // originEqpmId: 'ORIG002',
eqpmNm: '펌프 B', // eqpmNm: '펌프 B',
careStndVal: 60, // careStndVal: 60,
warnStndVal: 80, // warnStndVal: 80,
}, // },
{ // {
eqpmId: 'EQ003', // eqpmId: 'EQ003',
originEqpmId: 'ORIG003', // originEqpmId: 'ORIG003',
eqpmNm: '모터 C', // eqpmNm: '모터 C',
careStndVal: 50, // careStndVal: 50,
warnStndVal: 70, // warnStndVal: 70,
}, // },
{ // {
eqpmId: 'EQ004', // eqpmId: 'EQ004',
originEqpmId: 'ORIG004', // originEqpmId: 'ORIG004',
eqpmNm: '밸브 D', // eqpmNm: '밸브 D',
careStndVal: 65, // careStndVal: 65,
warnStndVal: 85, // warnStndVal: 85,
}, // },
{ // {
eqpmId: 'EQ005', // eqpmId: 'EQ005',
originEqpmId: 'ORIG005', // originEqpmId: 'ORIG005',
eqpmNm: '컨트롤러 E', // eqpmNm: '컨트롤러 E',
careStndVal: 55, // careStndVal: 55,
warnStndVal: 75, // warnStndVal: 75,
}, // },
], // ],
column: [ // column: [
{ header: '설비', name: 'eqpmId', align: 'left' }, // { header: '설비', name: 'eqpmId', align: 'left' },
{ // {
header: 'origin설비', // header: 'origin설비',
name: 'originEqpmId', // name: 'originEqpmId',
align: 'center', // align: 'center',
hidden: true, // hidden: true,
}, // },
{ header: '설비명', name: 'eqpmNm', align: 'left' }, // { header: '설비명', name: 'eqpmNm', align: 'left' },
{ header: '주의기준', name: 'careStndVal', align: 'right' }, // { header: '주의기준', name: 'careStndVal', align: 'right' },
{ header: '심각기준', name: 'warnStndVal', align: 'right' }, // { header: '심각기준', name: 'warnStndVal', align: 'right' },
] // ]
} // }
} // }
}; };
}, },
computed: { computed: {
@ -408,6 +409,10 @@ export default {
columnOptions: { columnOptions: {
resizable: true, resizable: true,
}, },
header: {
height: 37,
},
rowHeight: 'auto',
}; };
this.setGridOption({ this.setGridOption({
gridKey: this.gridName, gridKey: this.gridName,
@ -511,69 +516,69 @@ export default {
this.loadGrid = false; this.loadGrid = false;
let res = []; let res = [];
// if (this.selectValue01 && this.selectValue02 && this.selectValue03) { if (this.selectValue01 && this.selectValue02 && this.selectValue03) {
// res = await this.postApiReturn({ res = await this.postApiReturn({
// apiKey: 'selectEqpmGdDetl', apiKey: 'selectEqpmGdDetl',
// resKey: 'eqpmGdDetlData', resKey: 'eqpmGdDetlData',
// sendParam: { sendParam: {
// gdIdxId: this.selectValue03, gdIdxId: this.selectValue03,
},
});
}
// grid에서 eqpmId를 기억해서 popup에서 중복되는 값을 제거하는데 사용하기위해 저장 - 시작
let eqpmIdList = res.map(item => {
return item.eqpmId;
});
this.setPageData({ nowGridEqpmIdList: eqpmIdList });
// grid에서 eqpmId를 기억해서 popup에서 중복되는 값을 제거하는데 사용하기위해 저장 - 끝
const newRes = res.map(item => {
const newObj = {
...item,
rowStat: null,
};
return newObj;
});
// const newRes = [
// {
// eqpmId: 'EQ001',
// originEqpmId: 'ORIG001',
// eqpmNm: '냉각기 A',
// careStndVal: 75,
// warnStndVal: 90,
// },
// {
// eqpmId: 'EQ002',
// originEqpmId: 'ORIG002',
// eqpmNm: '펌프 B',
// careStndVal: 60,
// warnStndVal: 80,
// },
// {
// eqpmId: 'EQ003',
// originEqpmId: 'ORIG003',
// eqpmNm: '모터 C',
// careStndVal: 50,
// warnStndVal: 70,
// },
// {
// eqpmId: 'EQ004',
// originEqpmId: 'ORIG004',
// eqpmNm: '밸브 D',
// careStndVal: 65,
// warnStndVal: 85,
// },
// {
// eqpmId: 'EQ005',
// originEqpmId: 'ORIG005',
// eqpmNm: '컨트롤러 E',
// careStndVal: 55,
// warnStndVal: 75,
// }, // },
// });
// }
// // grid에서 eqpmId를 기억해서 popup에서 중복되는 값을 제거하는데 사용하기위해 저장 - 시작 // ]
// let eqpmIdList = res.map(item => {
// return item.eqpmId;
// });
// this.setPageData({ nowGridEqpmIdList: eqpmIdList });
// // grid에서 eqpmId를 기억해서 popup에서 중복되는 값을 제거하는데 사용하기위해 저장 - 끝
// const newRes = res.map(item => {
// const newObj = {
// ...item,
// rowStat: null,
// };
// return newObj;
// });
const newRes = [
{
eqpmId: 'EQ001',
originEqpmId: 'ORIG001',
eqpmNm: '냉각기 A',
careStndVal: 75,
warnStndVal: 90,
},
{
eqpmId: 'EQ002',
originEqpmId: 'ORIG002',
eqpmNm: '펌프 B',
careStndVal: 60,
warnStndVal: 80,
},
{
eqpmId: 'EQ003',
originEqpmId: 'ORIG003',
eqpmNm: '모터 C',
careStndVal: 50,
warnStndVal: 70,
},
{
eqpmId: 'EQ004',
originEqpmId: 'ORIG004',
eqpmNm: '밸브 D',
careStndVal: 65,
warnStndVal: 85,
},
{
eqpmId: 'EQ005',
originEqpmId: 'ORIG005',
eqpmNm: '컨트롤러 E',
careStndVal: 55,
warnStndVal: 75,
},
]
this.setGridData({ this.setGridData({
gridKey: this.gridName, gridKey: this.gridName,
value: newRes, value: newRes,

View File

@ -195,28 +195,16 @@ export default {
}); });
}, },
async getEqpmKind() { async getEqpmKind() {
// let res = await this.postApiReturn({ let res = await this.postApiReturn({
// apiKey: "selectEqpmKindCodeList", apiKey: 'selectEqpmKindCodeList',
// resKey: "eqpmKindCodeLists", resKey: 'eqpmKindCodeLists',
// sendParam: {}, sendParam: {},
// }); });
let res = [
{
eqpmKindId: "냉동기저온",
eqpmKindNm: "냉동기저온",
},
{
eqpmKindId: "냉동기고온",
eqpmKindNm: "냉동기고온",
},
];
if (res.length > 0) { if (res.length > 0) {
this.selectValueList01 = await res.map((item) => { this.selectValueList01 = await res.map(item => {
return { return {
// text: item.eqpmKindNm, text: item.eqpmKindNm,
label: item.eqpmKindNm,
value: item.eqpmKindId, value: item.eqpmKindId,
}; };
}); });
@ -233,29 +221,24 @@ export default {
gridInit() {}, gridInit() {},
getRowGridData() {}, getRowGridData() {},
async getData() { async getData() {
// let res = await this.postApiReturn({ let res = await this.postApiReturn({
// apiKey: "selectEnrgEffcTotSumm", apiKey: 'selectEnrgEffcTotSumm',
// resKey: "totSummData", resKey: 'totSummData',
// sendParam: { sendParam: {
// fromDt: this.pageData.fromDt, fromDt: this.pageData.fromDt,
// eqpmKindId: this.selectValue01, eqpmKindId: this.selectValue01,
// }, },
// }); });
let res = ["aaa", "bbb"];
await this.getChartData(res); await this.getChartData(res);
// this.selectData = res.filter((item, i) => { this.selectData = res.filter((item, i) => {
// return ( return (
// res.findIndex((item2, j) => { res.findIndex((item2, j) => {
// return item.eqpmGrpId === item2.eqpmGrpId; return item.eqpmGrpId === item2.eqpmGrpId;
// }) === i }) === i
// ); );
// }); });
this.selectData = [
{ eqpmGrpId: "G001", eqpmGrpNm: "Group A", otherProp: "..." },
{ eqpmGrpId: "G002", eqpmGrpNm: "Group B", otherProp: "..." },
];
}, },
barClick(event, chartName) { barClick(event, chartName) {
var data = {}; var data = {};
@ -302,37 +285,25 @@ export default {
// } // }
// }); // });
// data.map((item) => { data.map(item => {
// if (chartDataObj[item.eqpmGrpId] != null) { if (chartDataObj[item.eqpmGrpId] != null) {
// chartDataObj[item.eqpmGrpId].push(item); chartDataObj[item.eqpmGrpId].push(item);
// } else { } else {
// chartDataObj[item.eqpmGrpId] = [item]; chartDataObj[item.eqpmGrpId] = [item];
// } }
// }); });
chartDataObj = {
group1: [
{ fabNm: "Fab A", okCnt: 120, ngCnt: 30 },
{ fabNm: "Fab B", okCnt: 150, ngCnt: 20 },
{ fabNm: "Fab C", okCnt: 100, ngCnt: 50 },
],
group2: [
{ fabNm: "Fab D", okCnt: 180, ngCnt: 10 },
{ fabNm: "Fab E", okCnt: 160, ngCnt: 25 },
{ fabNm: "Fab F", okCnt: 140, ngCnt: 35 },
],
};
// chartDataObj.keys()[0] // chartDataObj.keys()[0]
var i = 0; var i = 0;
for (var x of Object.keys(chartDataObj)) { for (var x of Object.keys(chartDataObj)) {
this.loadChartList.push(false); this.loadChartList.push(false);
i++; i++;
this.objList["chart_0" + i] = chartDataObj[x]; this.objList['chart_0' + i] = chartDataObj[x];
this.chartNameList.push("chart_0" + i); this.chartNameList.push('chart_0' + i);
this.setPageData({ this.setPageData({
[this.chartNameList[i - 1]]: Utility.defaultChartOption(true), [this.chartNameList[i - 1]]: Utility.defaultChartOption(true),
}); });
this.setChartData(chartDataObj[x], i); this.setChartData(chartDataObj[x], i);
} }
// this.setChartData(chartDataObj[Object.keys(chartDataObj)[0]]); // this.setChartData(chartDataObj[Object.keys(chartDataObj)[0]]);

View File

@ -103,7 +103,6 @@
<component <component
:ref="gridName" :ref="gridName"
class="tagTrndGrid" class="tagTrndGrid"
v-if="loadGrid"
:is="loadGrid ? 'Grid' : null" :is="loadGrid ? 'Grid' : null"
:gridName="gridName" :gridName="gridName"
:parentPrgmId="myPrgmId" :parentPrgmId="myPrgmId"
@ -199,7 +198,6 @@ export default {
async asyncData(context) { async asyncData(context) {
const myState = context.store.state; const myState = context.store.state;
myPrgmId = context.route.query.prgmId; myPrgmId = context.route.query.prgmId;
console.log("menudata:", myState.menuData[myPrgmId]);
await context.store.commit("setActiveMenuInfo", myState.menuData[myPrgmId]); await context.store.commit("setActiveMenuInfo", myState.menuData[myPrgmId]);
myTitle = await myState.activeMenuInfo.menuNm; myTitle = await myState.activeMenuInfo.menuNm;
}, },
@ -330,7 +328,6 @@ export default {
} else { } else {
this.dumyChartFg = false; this.dumyChartFg = false;
} }
this.dumyChartFg = true;
if (this.initedFlag && this.tagList.length > 0) { if (this.initedFlag && this.tagList.length > 0) {
this.search(); this.search();
} }
@ -409,12 +406,12 @@ export default {
getAddInfoList: "modules/search/getAddInfoList", getAddInfoList: "modules/search/getAddInfoList",
}), }),
async init() { async init() {
await this.setPageData({ this.setPageData({
rowGridSelectKey: 0, rowGridSelectKey: 0,
rowGridSelectData: null, rowGridSelectData: null,
}); });
await this.gridInit(); this.gridInit();
this.setChartNull2(); this.setChartNull();
}, },
async search() { async search() {
// search가 2번 타는 경우: // search가 2번 타는 경우:
@ -513,12 +510,6 @@ export default {
gridKey: this.gridName, gridKey: this.gridName,
value: myColumns, value: myColumns,
}); });
this.setGridData({
gridKey: this.gridName,
value: newRes,
});
this.loadGrid = true; this.loadGrid = true;
}, },
getRowData(data) { getRowData(data) {
@ -809,7 +800,6 @@ export default {
// data SeriesData 추가 // data SeriesData 추가
chartDataDict[dataTagTitle]["seriesData"] = seriesData; chartDataDict[dataTagTitle]["seriesData"] = seriesData;
// data legend 추가 // data legend 추가
console.log("le dat:", legendData);
chartDataDict[dataTagTitle]["legendList"] = legendData; chartDataDict[dataTagTitle]["legendList"] = legendData;
// //
//rawData chart data 구성하기 //rawData chart data 구성하기
@ -1216,40 +1206,8 @@ const defaultData = {
rowGridSelectData: null, rowGridSelectData: null,
/* Griddata 세팅 */ /* Griddata 세팅 */
rowGrid: { rowGrid: {
data: [ data: [],
{ column: [],
eqpmGrpNm: "냉동기고온",
eqpmGrpId: "UT_HT_CH201",
eqpmId: "UT_HT_CH201",
eqpmNm: "UT_HT_CH201",
tagId: "ICHEON.HVAC.EQP_HT_CH004.UT_HT_CH201.CHI_AMP_1A_PV",
tagNm: "ICHEON 고온 냉동기 201호기 - 회로1 전류A",
// rowStat: "I",
},
{
eqpmGrpNm: "냉동기고온",
eqpmGrpId: "UT_HT_CH201",
eqpmId: "UT_HT_CH201",
eqpmNm: "UT_HT_CH201",
tagId: "ICHEON.HVAC.EQP_HT_CH004.UT_HT_CH201.CHI_AMP_1A_PV",
tagNm: "ICHEON 고온 냉동기 201호기 - 회로1 전류A",
// rowStat: "I",
},
],
column: [
{ header: "설비그룹", name: "eqpmGrpNm", align: "left", width: 150 },
{
header: "설비그룹 ID",
name: "eqpmGrpId",
align: "center",
hidden: true,
},
{ header: "설비ID", name: "eqpmId", align: "left", width: 200 },
{ header: "설비명", name: "eqpmNm", align: "left", width: 200 },
{ header: "TAG ID", name: "tagId", align: "left", width: 500 },
{ header: "TAG 명", name: "tagNm", align: "left" },
// { header: "rowStat", name: "rowStat", align: "center", hidden: true },
],
option: {}, option: {},
defaultRow: { defaultRow: {
eqpmGrpNm: null, eqpmGrpNm: null,

View File

@ -10,6 +10,7 @@ import icoBulletPoint from '~/components/icons/icoBulletPoint';
import icoChevronDown from '~/components/icons/icoChevronDown'; import icoChevronDown from '~/components/icons/icoChevronDown';
import icoSearch from '~/components/icons/icoSearch'; import icoSearch from '~/components/icons/icoSearch';
import icoSend from '~/components/icons/icoSend'; import icoSend from '~/components/icons/icoSend';
import icoExpandAlt from '~/components/icons/icoExpandAlt';
import '@mdi/font/css/materialdesignicons.css'; // Ensure you are using css-loader import '@mdi/font/css/materialdesignicons.css'; // Ensure you are using css-loader
import 'material-design-icons-iconfont/dist/material-design-icons.css'; import 'material-design-icons-iconfont/dist/material-design-icons.css';
import Vue from 'vue'; import Vue from 'vue';
@ -73,6 +74,9 @@ export default new Vuetify({
icoSend: { icoSend: {
component: icoSend, component: icoSend,
}, },
icoExpandAlt: {
component: icoExpandAlt,
},
}, },
}, },
}); });