Merge branch 'dev' of http://218.237.212.51:30003/gitadmin/sk_fems_ui into dev-trungvq7-0729
This commit is contained in:
dev
@ -3,7 +3,7 @@
|
||||
<v-row ref="searchFilter">
|
||||
<v-col :cols="12">
|
||||
<v-card class="searchFilter">
|
||||
<v-row align="end" no-gutters>
|
||||
<v-row align="center" no-gutters>
|
||||
<v-col :cols="2.5">
|
||||
<component
|
||||
:is="'selectCodeList'"
|
||||
@ -12,8 +12,6 @@
|
||||
dataKey="searchLocKind"
|
||||
:sendParam="{ commGrpCd: 'EM_LOC_KIND', useFg: '1' }"
|
||||
:addAll="true"
|
||||
:iconShow="true"
|
||||
customClass="select-large"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col :cols="2.5">
|
||||
@ -24,12 +22,10 @@
|
||||
dataKey="searchEccKind"
|
||||
:sendParam="{ commGrpCd: 'EM_ECC_KIND', useFg: '1' }"
|
||||
:addAll="true"
|
||||
:iconShow="true"
|
||||
customClass="select-large"
|
||||
/>
|
||||
</v-col>
|
||||
<!-- 사업장 -->
|
||||
<!-- <v-col :cols="3">
|
||||
사업장
|
||||
<div style="visibility:hidden">
|
||||
<component
|
||||
:is="'SelectBlocMstr'"
|
||||
@ -46,8 +42,6 @@
|
||||
dataKey="useFg"
|
||||
:sendParam="{ commGrpCd: 'CO_USEFG', useFg: '1' }"
|
||||
:addAll="true"
|
||||
:iconShow="true"
|
||||
customClass="select-large"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col :cols="2.5">
|
||||
@ -55,14 +49,17 @@
|
||||
:parentPrgmId="myPrgmId"
|
||||
label="공정명"
|
||||
valueNm="eccNm"
|
||||
:labelCols="12"
|
||||
:textCols="12"
|
||||
:labelCols="2"
|
||||
:textCols="9"
|
||||
:searchOption="true"
|
||||
:iconShow="true"
|
||||
customClass="input-large"
|
||||
/>
|
||||
</v-col>
|
||||
<BtnSearch @click="search" size="large" />
|
||||
<v-col class="text-right">
|
||||
<BtnSearch @click="search" />
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row align="center" no-gutters>
|
||||
|
||||
</v-row>
|
||||
</v-card>
|
||||
</v-col>
|
||||
@ -79,17 +76,16 @@
|
||||
:btnActionsFnc="btnActions"
|
||||
/>
|
||||
</div>
|
||||
<div class="px-5" style="min-height:calc(100% - 76px)">
|
||||
<div ref="gridParent" class="w100 h100 pb-2">
|
||||
<div class="px-5" style="height:calc(100% - 76px)">
|
||||
<div ref="gridParent" class="w100 h100">
|
||||
<component
|
||||
:ref="gridName"
|
||||
:is="loadGrid ? 'Grid' : null"
|
||||
:is="loadGrid ? 'Grid' : null"
|
||||
:gridName="gridName"
|
||||
:parentPrgmId="myPrgmId"
|
||||
@getRowsData="getRowData"
|
||||
@sendSelectedRowStatInfo="getSelectedRowStatInfo"
|
||||
:selectedRowDataWatchFlag="true"
|
||||
:dataPath="dataPathMock"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -196,15 +192,13 @@ export default {
|
||||
gridName: 'rowGrid',
|
||||
loadGrid: false,
|
||||
tab: null,
|
||||
selectedRowKey: null,
|
||||
// rowSelectionStatus: {},
|
||||
dataPathMock : { },
|
||||
items: [
|
||||
{ name: '공정 정보', id: 'eccBaseInfoTab', disabledFlag: false },
|
||||
{ name: '공정 추가 정보', id: 'eccAddInfoTab', disabledFlag: false },
|
||||
{ name: '공정 연결 정보', id: 'eccIaoTab', disabledFlag: false },
|
||||
],
|
||||
detailList: myDetail,
|
||||
loadGrid: false,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@ -320,23 +314,11 @@ export default {
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
this.$nextTick(() => {
|
||||
// const checkbox = document.getElementById('headerCheckbox');
|
||||
// if (checkbox) {
|
||||
// checkbox.addEventListener('change', this.handleHeaderCheckboxChange);
|
||||
// }
|
||||
});
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.chkOpenTabList({ key: 'destroy', prgmId: myPrgmId });
|
||||
},
|
||||
methods: {
|
||||
handleHeaderCheckboxChange(event) {
|
||||
const checked = event.target.checked;
|
||||
this.dataPathMock.rowGrid.data.forEach(row => {
|
||||
row.selected = checked;
|
||||
});},
|
||||
|
||||
...mapMutations({
|
||||
setPageData: 'setPageData',
|
||||
}),
|
||||
@ -351,41 +333,7 @@ export default {
|
||||
blocId: this.userInfo.blocId,
|
||||
});
|
||||
},
|
||||
gridInitTest() {
|
||||
const rowGrid = {
|
||||
column: [
|
||||
{
|
||||
header: '',
|
||||
name: '',
|
||||
align: 'center',
|
||||
width: 50,
|
||||
formatter: (props) => {
|
||||
return `<label class="custom-radio">
|
||||
<span class="radio-mark"></span>
|
||||
</label>`;
|
||||
}
|
||||
},
|
||||
{ header: '공정 정보', name: 'eccNm', align: 'left' },
|
||||
{ header: '현재 상태', name: 'status', align: 'center' },
|
||||
{ header: '공정 유형', name: 'eccKind', align: 'left' },
|
||||
{ header: '사용 여부', name: 'useFg', align: 'center' },
|
||||
],
|
||||
data: dataMockExample,
|
||||
defaultRow: dataMockExample,
|
||||
option: {
|
||||
...gridOptions,
|
||||
},
|
||||
}
|
||||
this.dataPathMock = {rowGrid};
|
||||
this.$nextTick(() => {
|
||||
this.loadGrid = true;
|
||||
});
|
||||
},
|
||||
gridInit() {
|
||||
// Test
|
||||
this.gridInitTest(); return;
|
||||
// End test
|
||||
|
||||
const gridHeight = this.$refs.gridParent.offsetHeight - 30;
|
||||
const gridWidth = this.$refs.gridParent.offsetWidth;
|
||||
|
||||
@ -404,6 +352,17 @@ export default {
|
||||
|
||||
const _this = this;
|
||||
const myColumns = [
|
||||
{
|
||||
header: '',
|
||||
name: '',
|
||||
align: 'center',
|
||||
width: 50,
|
||||
formatter: (props) => {
|
||||
return `<label class="custom-radio">
|
||||
<span class="radio-mark"></span>
|
||||
</label>`;
|
||||
}
|
||||
},
|
||||
{ header: '회사 ID', name: 'comId', hidden: true },
|
||||
{
|
||||
header: '공정 명',
|
||||
@ -598,16 +557,6 @@ export default {
|
||||
});
|
||||
},
|
||||
async getRowData(data) {
|
||||
|
||||
//Progess and fake radio
|
||||
// const rowKey = data.rowKey;
|
||||
// this.selectedRowKey = rowKey;
|
||||
// Object.keys(this.rowSelectionStatus).forEach(key => {
|
||||
// this.$set(this.rowSelectionStatus, key, false);
|
||||
// });
|
||||
// this.$set(this.rowSelectionStatus, rowKey, true);
|
||||
|
||||
|
||||
this.setEccAddInfo(data);
|
||||
this.setEccIao(data);
|
||||
this.setGridSelectData({
|
||||
@ -623,9 +572,6 @@ export default {
|
||||
rowGridSelectKey: data.rowKey,
|
||||
rowGridSelectData: Object.assign({}, data),
|
||||
});
|
||||
//fake radio need recheck
|
||||
// this.$refs[this.gridName]?.repaint?.();
|
||||
|
||||
},
|
||||
async setEccAddInfo(data) {
|
||||
this.setPageData({
|
||||
@ -1070,142 +1016,4 @@ const myDetail = [
|
||||
value: { '1': true, '0': false },
|
||||
},
|
||||
];
|
||||
|
||||
const dataMockExample = [
|
||||
{
|
||||
eccId: 'ECC000001',
|
||||
eccNm: 'EGP_HVAC_LT_CH001',
|
||||
status: '운영중',
|
||||
eccKind: '공정',
|
||||
useFg: '1',
|
||||
_children: [
|
||||
{
|
||||
eccId: 'ECC000002',
|
||||
eccNm: 'B01',
|
||||
status: '대기',
|
||||
eccKind: '공정',
|
||||
useFg: '1',
|
||||
_children: [
|
||||
{
|
||||
eccId: 'ECC000005',
|
||||
eccNm: 'B01-1',
|
||||
status: '운영중',
|
||||
eccKind: '공정',
|
||||
useFg: '1',
|
||||
_children: [
|
||||
{
|
||||
eccId: 'ECC000009',
|
||||
eccNm: 'B01-1-1',
|
||||
status: '운영중',
|
||||
eccKind: '공정',
|
||||
useFg: '1'
|
||||
},
|
||||
{
|
||||
eccId: 'ECC0000010',
|
||||
eccNm: 'B01-1-2',
|
||||
status: '운영중',
|
||||
eccKind: '공정',
|
||||
useFg: '1'
|
||||
},
|
||||
{
|
||||
eccId: 'ECC0000011',
|
||||
eccNm: 'B01-1-3',
|
||||
status: '운영중',
|
||||
eccKind: '공정',
|
||||
useFg: '1'
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
eccId: 'ECC000006',
|
||||
eccNm: 'B01-2',
|
||||
status: '점검중',
|
||||
eccKind: '공정',
|
||||
useFg: '0',
|
||||
_children: [
|
||||
{
|
||||
eccId: 'ECC0000013',
|
||||
eccNm: 'B01-2-1',
|
||||
status: '운영중',
|
||||
eccKind: '공정',
|
||||
useFg: '1'
|
||||
},
|
||||
{
|
||||
eccId: 'ECC0000014',
|
||||
eccNm: 'B01-1-2',
|
||||
status: '운영중',
|
||||
eccKind: '공정',
|
||||
useFg: '1'
|
||||
},
|
||||
{
|
||||
eccId: 'ECC0000015',
|
||||
eccNm: 'B01-1-3',
|
||||
status: '운영중',
|
||||
eccKind: '공정',
|
||||
useFg: '1'
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
eccId: 'ECC000007',
|
||||
eccNm: 'B01-3',
|
||||
status: '운영중',
|
||||
eccKind: '공정',
|
||||
useFg: '1',
|
||||
_children: [
|
||||
{
|
||||
eccId: 'ECC000009',
|
||||
eccNm: 'B01-3-1',
|
||||
status: '운영중',
|
||||
eccKind: '공정',
|
||||
useFg: '1'
|
||||
},
|
||||
{
|
||||
eccId: 'ECC0000010',
|
||||
eccNm: 'B01-3-2',
|
||||
status: '운영중',
|
||||
eccKind: '공정',
|
||||
useFg: '1'
|
||||
},
|
||||
{
|
||||
eccId: 'ECC0000011',
|
||||
eccNm: 'B01-3-3',
|
||||
status: '운영중',
|
||||
eccKind: '공정',
|
||||
useFg: '1'
|
||||
},
|
||||
]
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
eccId: 'ECC000003',
|
||||
eccNm: 'B02',
|
||||
status: '운영중',
|
||||
eccKind: '공정',
|
||||
useFg: '1',
|
||||
},
|
||||
{
|
||||
eccId: 'ECC000004',
|
||||
eccNm: 'B03',
|
||||
status: '점검중',
|
||||
eccKind: '공정',
|
||||
useFg: '0',
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
const gridOptions = {
|
||||
treeColumnOptions: {
|
||||
name: 'eccNm', // Showing tree table
|
||||
useIcon: false, // Not using icon
|
||||
indentWidth: 10,// spacing when showing children
|
||||
},
|
||||
header: {
|
||||
height: 40,
|
||||
},
|
||||
rowHeight: 35,
|
||||
showCheckbox: false,
|
||||
};
|
||||
</script>
|
||||
</script>
|
||||
@ -359,7 +359,7 @@ const myDetail = [
|
||||
label: '설비종류 ID',
|
||||
valueNm: 'eqpmKindId',
|
||||
cols: 6,
|
||||
class: 'py-2 pr-4',
|
||||
class: 'py-2 pr-4 pt-1',
|
||||
iconShow: true,
|
||||
required: false,
|
||||
readonly: true,
|
||||
@ -373,7 +373,7 @@ const myDetail = [
|
||||
valueNm: 'eqpmKindNm',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2 pl-4',
|
||||
class: 'py-2 pl-4 pt-1',
|
||||
iconShow: true,
|
||||
required: true,
|
||||
labelCols: 12,
|
||||
|
||||
@ -461,7 +461,7 @@ const myDetail = [
|
||||
valueNm: 'eqpmGrpId',
|
||||
disabled: true,
|
||||
cols: 6,
|
||||
class: 'py-2 pr-4',
|
||||
class: 'py-2 pr-4 pt-1',
|
||||
required: false,
|
||||
iconShow: true,
|
||||
labelCols: 12,
|
||||
@ -474,7 +474,7 @@ const myDetail = [
|
||||
valueNm: 'eqpmGrpNm',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2 pl-4',
|
||||
class: 'py-2 pl-4 pt-1',
|
||||
required: true,
|
||||
iconShow: true,
|
||||
labelCols: 12,
|
||||
|
||||
@ -53,7 +53,7 @@
|
||||
</v-col>
|
||||
<v-col :cols="7" >
|
||||
<v-card class="pb-5">
|
||||
<v-card-title class="custom-title-4" style="min-height:76px;">설비 상세</v-card-title>
|
||||
<v-card-title class="custom-title-4 pb-1" >설비 상세</v-card-title>
|
||||
<div class="px-5" style="min-height:calc(100% - 76px)">
|
||||
<v-tabs v-model="tab">
|
||||
<v-tab v-for="item in items" :key="item.id" :disabled="item.disabledFlag">
|
||||
@ -969,7 +969,7 @@ const myDetail = [
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
iconShow: true,
|
||||
class: 'py-3 pr-4',
|
||||
class: 'py-3 pr-4 pb-2',
|
||||
},
|
||||
{
|
||||
type: 'CheckBox',
|
||||
|
||||
@ -16,7 +16,8 @@
|
||||
</v-col>
|
||||
<v-col :cols="3">
|
||||
<!-- 대상일 -->
|
||||
<component :is="'Datepicker'" :parentPrgmId="myPrgmId" :label="'조회기간'" :textCols="12" />
|
||||
<component :is="'Datepicker'" :parentPrgmId="myPrgmId" :label="'조회기간'" :textCols="12"
|
||||
customClass="datepicker-large" />
|
||||
</v-col>
|
||||
<v-col :cols="3" class="d-flex align-end justify-end text-right">
|
||||
<BtnExcelDownload class="mr-1" :parentPrgmId="myPrgmId" :gridName="gridName" type="primary"
|
||||
@ -391,6 +392,7 @@ export default {
|
||||
resKey: 'pastRslPageTotal',
|
||||
sendParam: sendParams
|
||||
});
|
||||
|
||||
this.totalCount = res2[0].totalcount;
|
||||
|
||||
this.setGridData({
|
||||
|
||||
@ -43,6 +43,7 @@
|
||||
:is="'Datepicker'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:label="'조회기간'"
|
||||
customClass="datepicker-large"
|
||||
/>
|
||||
</v-col>
|
||||
<div class="d-flex">
|
||||
@ -282,7 +283,6 @@ export default {
|
||||
mgnf: item.mgnf || 0,
|
||||
})),
|
||||
});
|
||||
// console.log('--------------DEBUG-----res-------', res);
|
||||
}
|
||||
this.setPageData({ isFind: false });
|
||||
this.$nextTick(() => {
|
||||
|
||||
@ -1,61 +1,43 @@
|
||||
<template>
|
||||
<div class="l-layout">
|
||||
<CommonPageTitle/>
|
||||
<v-row ref="searchFilter">
|
||||
<v-col :cols="12">
|
||||
<v-card class="searchFilter">
|
||||
<v-row align="center" no-gutters>
|
||||
<v-col :cols="3">
|
||||
<!-- 사업장 -->
|
||||
<component
|
||||
:is="'SelectBlocMstr'"
|
||||
ref="SelectBlocMstr"
|
||||
:parentPrgmId="myPrgmId"
|
||||
/>
|
||||
<component :is="'SelectBlocMstr'" ref="SelectBlocMstr" :parentPrgmId="myPrgmId"
|
||||
:textCols="12" customClass="select-large" />
|
||||
</v-col>
|
||||
<v-col :cols="3">
|
||||
<component
|
||||
:is="'selectCodeList'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:label="'측정 Data 유형'"
|
||||
dataKey="searchReadDataType"
|
||||
:sendParam="{ commGrpCd: 'EM_READ_DATA_TYPE', useFg: '1' }"
|
||||
:addAll="true"
|
||||
/>
|
||||
<component :is="'selectCodeList'" :parentPrgmId="myPrgmId" :label="'측정 Data 유형'"
|
||||
dataKey="searchReadDataType" :sendParam="{ commGrpCd: 'EM_READ_DATA_TYPE', useFg: '1' }"
|
||||
:addAll="true" :textCols="12" customClass="select-large" />
|
||||
</v-col>
|
||||
<v-col :cols="3">
|
||||
<component
|
||||
:is="'SelectReadObj'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:label="'측정대상'"
|
||||
dataKey="searchReadObj"
|
||||
:sendParam="{ useFg: '1' }"
|
||||
:addAll="true"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col :cols="3" class="text-right">
|
||||
<BtnSearch @click="search" />
|
||||
<component :is="'SelectReadObj'" :parentPrgmId="myPrgmId" :label="'측정대상'"
|
||||
dataKey="searchReadObj" :sendParam="{ useFg: '1' }" :labelCols="12" :textCols="12"
|
||||
:addAll="true" customClass="select-large" />
|
||||
</v-col>
|
||||
|
||||
</v-row>
|
||||
<v-row align="center" no-gutters>
|
||||
<v-row align="end" no-gutters>
|
||||
<v-col :cols="3">
|
||||
<component
|
||||
:is="'selectCodeList'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:label="'사용여부'"
|
||||
dataKey="useFg"
|
||||
:sendParam="{ commGrpCd: 'CO_USEFG', useFg: '1' }"
|
||||
:addAll="true"
|
||||
/>
|
||||
<component :is="'selectCodeList'" :parentPrgmId="myPrgmId" :label="'사용여부'" dataKey="useFg"
|
||||
:sendParam="{ commGrpCd: 'CO_USEFG', useFg: '1' }" :addAll="true" :textCols="12"
|
||||
customClass="select-large" />
|
||||
</v-col>
|
||||
<v-col :cols="6">
|
||||
<InputText
|
||||
:parentPrgmId="myPrgmId"
|
||||
label="TAG명"
|
||||
valueNm="tagNm"
|
||||
:labelCols="2"
|
||||
:textCols="9"
|
||||
:searchOption="true"
|
||||
/>
|
||||
<v-col :cols="3">
|
||||
<InputText :parentPrgmId="myPrgmId" label="TAG ID" valueNm="tagId" :labelCols="12"
|
||||
:textCols="12" :searchOption="true" customClass="input-large" />
|
||||
</v-col>
|
||||
<v-col :cols="3">
|
||||
<InputText :parentPrgmId="myPrgmId" label="TAG명" valueNm="tagNm" :labelCols="12"
|
||||
:textCols="12" :searchOption="true" customClass="input-large" />
|
||||
</v-col>
|
||||
<v-col :cols="3" class="d-flex align-end justify-end text-right">
|
||||
<BtnSearch @click="search" size="large" />
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card>
|
||||
@ -66,63 +48,33 @@
|
||||
<v-card class="pb-5">
|
||||
<v-card-title class="d-flex justify-space-between align-end">
|
||||
<span class="tit ft-size_20 ft-weight_600">TAG 정보</span>
|
||||
<Buttons
|
||||
:parentPrgmId="myPrgmId"
|
||||
:bindingData="gridName"
|
||||
:detailList="detailList"
|
||||
:btnActionsFnc="btnActions"
|
||||
/>
|
||||
<Buttons :parentPrgmId="myPrgmId" :bindingData="gridName" :detailList="detailList"
|
||||
:btnActionsFnc="btnActions" />
|
||||
</v-card-title>
|
||||
<v-card-actions>
|
||||
<div
|
||||
ref="gridParent"
|
||||
class="w100"
|
||||
style="height: calc(100vh - 360px)"
|
||||
>
|
||||
<component
|
||||
:ref="gridName"
|
||||
:is="loadGrid ? 'Grid' : null"
|
||||
:gridName="gridName"
|
||||
:parentPrgmId="myPrgmId"
|
||||
@getRowsData="getRowData"
|
||||
@sendSelectedRowStatInfo="getSelectedRowStatInfo"
|
||||
:selectedRowDataWatchFlag="true"
|
||||
/>
|
||||
<div ref="gridParent" class="w100" style="height: calc(100vh - 400px)">
|
||||
<component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName"
|
||||
:parentPrgmId="myPrgmId" @getRowsData="getRowData"
|
||||
@sendSelectedRowStatInfo="getSelectedRowStatInfo" :selectedRowDataWatchFlag="true" />
|
||||
</div>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
<v-col :cols="7" class="h100">
|
||||
<v-col :cols="7" class="">
|
||||
<v-card class="pb-5">
|
||||
<v-card-title>TAG 상세</v-card-title>
|
||||
<div class="px-5" style="height:calc(100% - 70px)">
|
||||
<v-tabs v-model="tab">
|
||||
<v-tab
|
||||
v-for="item in items"
|
||||
:key="item.id"
|
||||
:disabled="item.disabledFlag"
|
||||
>
|
||||
<v-tab v-for="item in items" :key="item.id" :disabled="item.disabledFlag">
|
||||
{{ item.name }}
|
||||
</v-tab>
|
||||
</v-tabs>
|
||||
<v-tabs-items
|
||||
v-model="tab"
|
||||
style="height: calc(100% - 65px);"
|
||||
class="py-6"
|
||||
>
|
||||
<v-tabs-items v-model="tab" style="height: calc(100% - 65px);" class="py-6">
|
||||
<v-tab-item v-for="(item, idx) in items" :key="item.id">
|
||||
<component
|
||||
v-if="item.id == 'tagBaseInfoTab'"
|
||||
:is="'Form'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:detailList="detailList"
|
||||
@gridEditingFinish="gridEditingFinish"
|
||||
/>
|
||||
<TagAddInfoTab
|
||||
v-if="item.id == 'tagAddInfoTab'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:innerTabGridInfo="{ tab, idx }"
|
||||
/>
|
||||
<component v-if="item.id == 'tagBaseInfoTab'" :is="'Form'" :parentPrgmId="myPrgmId"
|
||||
:detailList="detailList" @gridEditingFinish="gridEditingFinish" />
|
||||
<TagAddInfoTab v-if="item.id == 'tagAddInfoTab'" :parentPrgmId="myPrgmId"
|
||||
:innerTabGridInfo="{ tab, idx }" />
|
||||
</v-tab-item>
|
||||
</v-tabs-items>
|
||||
</div>
|
||||
@ -134,6 +86,7 @@
|
||||
<script>
|
||||
import { mapState, mapMutations, mapActions } from 'vuex';
|
||||
import mixinGlobal from '@/mixin/global.js';
|
||||
import { resize } from '@/mixin/resize.js';
|
||||
import BtnSearch from '~/components/common/button/BtnSearch';
|
||||
import Buttons from '~/components/common/button/Buttons';
|
||||
import SelectBlocMstr from '@/components/common/select/SelectBlocMstr';
|
||||
@ -149,7 +102,7 @@ let myTitle;
|
||||
// const myPrgmId = "PRG0051";
|
||||
let myPrgmId;
|
||||
export default {
|
||||
mixins: [mixinGlobal],
|
||||
mixins: [mixinGlobal, resize],
|
||||
async asyncData(context) {
|
||||
const myState = context.store.state;
|
||||
// context.store.commit("setActiveMenuInfo", myState.menuData[myPrgmId]);
|
||||
@ -219,15 +172,19 @@ export default {
|
||||
},
|
||||
chkBlocId() {
|
||||
this.setPageData({ isFind: true });
|
||||
// this.search();
|
||||
},
|
||||
chkReadDataType() {
|
||||
this.setPageData({ isFind: true });
|
||||
// this.search();
|
||||
},
|
||||
chkReadObj() {
|
||||
this.setPageData({ isFind: true });
|
||||
// this.search();
|
||||
},
|
||||
chkUseFg() {
|
||||
this.setPageData({ isFind: true });
|
||||
// this.search();
|
||||
},
|
||||
},
|
||||
async beforeCreate() {
|
||||
@ -297,12 +254,16 @@ export default {
|
||||
this.gridInit();
|
||||
},
|
||||
gridInit() {
|
||||
const gridHeight = this.$refs.gridParent.offsetHeight - 30;
|
||||
const gridHeight = this.$refs.gridParent.offsetHeight - 16;
|
||||
|
||||
const myOptions = {
|
||||
columnOptions: {
|
||||
resizable: true,
|
||||
},
|
||||
scrollX: true,
|
||||
header: {
|
||||
height: 38,
|
||||
},
|
||||
};
|
||||
this.setGridOption({
|
||||
gridKey: this.gridName,
|
||||
@ -316,21 +277,21 @@ export default {
|
||||
header: 'TAG ID',
|
||||
name: 'tagId',
|
||||
width: 'auto',
|
||||
minWidth: 280,
|
||||
minWidth: 340,
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
header: 'TAG 명',
|
||||
name: 'tagNm',
|
||||
width: 'auto',
|
||||
minWidth: 140,
|
||||
minWidth: 220,
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
header: '측정 값 유형',
|
||||
name: 'readDataTypeCd',
|
||||
width: 100,
|
||||
align: 'center',
|
||||
width: 90,
|
||||
align: 'left',
|
||||
formatter({ value }) {
|
||||
let retVal = '';
|
||||
const newValue = _this.pageData.readDataTypeCdList.filter(
|
||||
@ -346,7 +307,7 @@ export default {
|
||||
header: '측정대상',
|
||||
name: 'readObjId',
|
||||
width: 100,
|
||||
align: 'center',
|
||||
align: 'left',
|
||||
formatter({ value }) {
|
||||
let retVal = '';
|
||||
const newValue = _this.pageData.readObjList.filter(
|
||||
@ -363,7 +324,7 @@ export default {
|
||||
header: '단위',
|
||||
name: 'unitCd',
|
||||
width: 80,
|
||||
align: 'center',
|
||||
align: 'left',
|
||||
formatter({ value }) {
|
||||
let retVal = '';
|
||||
const newValue = _this.pageData.unitCdList.filter(
|
||||
@ -493,6 +454,7 @@ export default {
|
||||
readObjId: this.pageData.searchReadObj,
|
||||
useFg: this.pageData.useFg,
|
||||
tagNmLike: this.pageData.tagNm,
|
||||
tagIdLike: this.pageData.tagId,
|
||||
},
|
||||
});
|
||||
} else {
|
||||
@ -751,7 +713,8 @@ export default {
|
||||
});
|
||||
|
||||
this.$nextTick(() => {
|
||||
this.setPageData({ isFind: true });
|
||||
// this.setPageData({ isFind: true });
|
||||
this.search();
|
||||
});
|
||||
}
|
||||
} else {
|
||||
@ -818,6 +781,7 @@ function isValidAlrmVal(obj) {
|
||||
|
||||
const defaultData = {
|
||||
/* 검색옵션 */
|
||||
tagId: '',
|
||||
tagNm: '',
|
||||
blocId: '',
|
||||
blocMstrList: [],
|
||||
@ -907,30 +871,39 @@ const myDetail = [
|
||||
label: 'TAG ID',
|
||||
valueNm: 'tagId',
|
||||
disabled: false,
|
||||
iconShow: true,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-2 pr-4',
|
||||
required: false,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'InputText',
|
||||
label: 'TAG 명',
|
||||
valueNm: 'tagNm',
|
||||
disabled: false,
|
||||
iconShow: true,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-2 pl-4',
|
||||
required: false,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'SelectBox',
|
||||
label: '측정 값 유형',
|
||||
valueNm: 'readDataTypeCd',
|
||||
disabled: false,
|
||||
iconShow: true,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-2 pr-4 pt-5',
|
||||
list: 'readDataTypeCdList',
|
||||
itemText: 'commCdNm',
|
||||
itemValue: 'commCd',
|
||||
required: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'SelectBox',
|
||||
@ -938,11 +911,14 @@ const myDetail = [
|
||||
valueNm: 'readObjId',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-2 pl-4 pt-5',
|
||||
list: 'readObjList',
|
||||
itemText: 'readObjNm',
|
||||
itemValue: 'readObjId',
|
||||
required: true,
|
||||
iconShow: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'InputText',
|
||||
@ -950,8 +926,11 @@ const myDetail = [
|
||||
valueNm: 'mgnf',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-2 pr-4 pt-5',
|
||||
required: true,
|
||||
iconShow: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'SelectBox',
|
||||
@ -959,10 +938,13 @@ const myDetail = [
|
||||
valueNm: 'unitCd',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-2 pl-4 pt-5',
|
||||
list: 'unitCdList',
|
||||
itemText: 'commCdNm',
|
||||
itemValue: 'commCd',
|
||||
iconShow: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'InputText',
|
||||
@ -970,7 +952,10 @@ const myDetail = [
|
||||
valueNm: 'rangMin',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-2 pr-4 pt-5',
|
||||
iconShow: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'InputText',
|
||||
@ -978,7 +963,10 @@ const myDetail = [
|
||||
valueNm: 'rangMax',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-2 pl-4 pt-5',
|
||||
iconShow: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'InputText',
|
||||
@ -986,7 +974,10 @@ const myDetail = [
|
||||
valueNm: 'alrmHihi',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-2 pr-4 pt-5',
|
||||
iconShow: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'InputText',
|
||||
@ -994,7 +985,10 @@ const myDetail = [
|
||||
valueNm: 'alrmHi',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-2 pl-4 pt-5',
|
||||
iconShow: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'InputText',
|
||||
@ -1002,7 +996,10 @@ const myDetail = [
|
||||
valueNm: 'alrmLo',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-2 pr-4 pt-5',
|
||||
iconShow: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'InputText',
|
||||
@ -1010,7 +1007,10 @@ const myDetail = [
|
||||
valueNm: 'alrmLolo',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-2 pl-4 pt-5',
|
||||
iconShow: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'CheckBox',
|
||||
@ -1018,8 +1018,11 @@ const myDetail = [
|
||||
valueNm: 'totFg',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-2 pr-4 pt-5',
|
||||
value: { '1': true, '0': false },
|
||||
iconShow: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'CheckBox',
|
||||
@ -1027,9 +1030,12 @@ const myDetail = [
|
||||
valueNm: 'useFg',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-2 pl-4 pt-5',
|
||||
value: { '1': true, '0': false },
|
||||
required: false,
|
||||
iconShow: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'SelectBox',
|
||||
@ -1056,4 +1062,4 @@ const myDetail = [
|
||||
class: 'py-2',
|
||||
},
|
||||
];
|
||||
</script>
|
||||
</script>
|
||||
@ -69,7 +69,7 @@
|
||||
</div>
|
||||
</v-card>
|
||||
</v-col>
|
||||
<v-col :cols="7" class="h100">
|
||||
<v-col :cols="7" class="">
|
||||
<v-card class="pb-5">
|
||||
<v-card-title>TAG 상세</v-card-title>
|
||||
<div class="px-5" style="height:calc(100% - 70px)">
|
||||
|
||||
@ -49,7 +49,7 @@
|
||||
<v-col :cols="3">
|
||||
<!-- 대상일 -->
|
||||
<component :is="'Datepicker'" :parentPrgmId="myPrgmId" :label="'대상일'" :labelCols="12"
|
||||
:textCols="12" :customClass="'input-large'" />
|
||||
:textCols="12" :customClass="'datepicker-large'" />
|
||||
</v-col>
|
||||
<v-col :cols="3" class="text-right">
|
||||
<!-- 조회버튼 -->
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<div class="l-layout">
|
||||
<CommonPageTitle />
|
||||
<v-row ref="searchFilter">
|
||||
<v-col :cols="12">
|
||||
<v-card class="searchFilter">
|
||||
@ -25,7 +26,7 @@
|
||||
<component
|
||||
:is="'Datepicker'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:customClass="'select-large'"
|
||||
:customClass="'datepicker-large'"
|
||||
:label="'대상일'"
|
||||
:labelCols="3"
|
||||
/>
|
||||
@ -99,7 +100,6 @@ export default {
|
||||
async asyncData(context) {
|
||||
const myState = context.store.state;
|
||||
myPrgmId = context.route.query.prgmId;
|
||||
console.log("active menu:", myState.menuData);
|
||||
await context.store.commit("setActiveMenuInfo", myState.menuData[myPrgmId]);
|
||||
myTitle = await myState.activeMenuInfo.menuNm;
|
||||
},
|
||||
@ -319,8 +319,7 @@ export default {
|
||||
},
|
||||
};
|
||||
|
||||
console.log("data : ", data);
|
||||
data.map((item) => {
|
||||
data.map((item) => {
|
||||
xAxisData.push(item.fabNm);
|
||||
});
|
||||
|
||||
@ -374,8 +373,6 @@ export default {
|
||||
];
|
||||
}
|
||||
|
||||
// console.log("xAxisData : ", xAxisData);
|
||||
console.log("seriesData : ", seriesData);
|
||||
var chartOption = {
|
||||
legend: {
|
||||
top: xAxisData.length > 7 ? "top" : "bottom",
|
||||
|
||||
@ -5,14 +5,14 @@
|
||||
<v-col :cols="12">
|
||||
<v-card class="searchFilter">
|
||||
<v-row align="end" no-gutters>
|
||||
<v-col :cols="4">
|
||||
<v-col :cols="3">
|
||||
<!-- 차트목록 -->
|
||||
<component :is="'SelectBox'" ref="SelectBox" :propsValue="selectValue01" :itemList="selectValueList01"
|
||||
:label="'차트'" @update:propsValue="selectValue01 = $event" :textCols="12" customClass="select-large" />
|
||||
</v-col>
|
||||
<v-col :cols="4">
|
||||
<v-col :cols="3">
|
||||
<!-- 대상일 -->
|
||||
<component :is="'Datepicker'" :parentPrgmId="myPrgmId" :label="'대상일'" :labelCols="3" />
|
||||
<component :is="'Datepicker'" :parentPrgmId="myPrgmId" :label="'대상일'" :labelCols="3" customClass="datepicker-large" />
|
||||
</v-col>
|
||||
<v-col :cols="4" class="text-right">
|
||||
<BtnSearch @click="search" size="large" />
|
||||
@ -245,7 +245,6 @@ export default {
|
||||
|
||||
|
||||
this.setChartOption({ chartKey: this.chartName, value: chartOption });
|
||||
// console.log("----DEBUG chart-options-------", { chartOption });
|
||||
this.$nextTick(() => {
|
||||
this.loadChart = true;
|
||||
});
|
||||
|
||||
@ -32,7 +32,7 @@
|
||||
</v-col>
|
||||
<v-col :cols="3">
|
||||
<!-- 대상일 -->
|
||||
<component :is="'Datepicker'" :parentPrgmId="myPrgmId" :label="'대상일'" :labelCols="3" />
|
||||
<component :is="'Datepicker'" :parentPrgmId="myPrgmId" :label="'대상일'" :labelCols="3" customClass="datepicker-large" />
|
||||
</v-col>
|
||||
<v-col :cols="6" class="text-right d-flex align-end justify-end align-self-end">
|
||||
<!-- 조회버튼 -->
|
||||
@ -99,6 +99,8 @@ import EqpmSelectPop from '~/components/common/modal/EqpmSelectPop';
|
||||
import DateUtility from '~/plugins/dateUtility';
|
||||
import XLSX from 'xlsx';
|
||||
|
||||
import getLineChartOption from "~/components/common/chartoptions/LineChart";
|
||||
|
||||
let myTitle;
|
||||
let myPrgmId;
|
||||
|
||||
@ -264,9 +266,6 @@ export default {
|
||||
},
|
||||
created() { },
|
||||
async mounted() {
|
||||
// console.log('----DEBUG---');
|
||||
// await this.initTest();
|
||||
// End Debug Test---
|
||||
await this.init();
|
||||
this.initedFlag = true;
|
||||
},
|
||||
@ -287,7 +286,7 @@ export default {
|
||||
}),
|
||||
async initTest() {
|
||||
// debug test
|
||||
console.log('----DEBUG init pages----');
|
||||
// console.log('----DEBUG init pages----');
|
||||
const seriesName1 = ['B01. 냉동기전력량', ' B01.COP'];
|
||||
const seriesName2 = [
|
||||
'UT_HT_CH101:냉동기전혁당', 'UT_HT_CH102:냉동기전력량', 'UT_HT_CH201:냉동기전력당',
|
||||
@ -767,22 +766,14 @@ export default {
|
||||
];
|
||||
}
|
||||
|
||||
var chartOption = {
|
||||
legend: {
|
||||
top: 'top',
|
||||
},
|
||||
grid: {
|
||||
top: '10%',
|
||||
bottom: '20%',
|
||||
},
|
||||
yAxis: {},
|
||||
xAxis: {
|
||||
data: xAxisData,
|
||||
},
|
||||
series: seriesData,
|
||||
tooltip: {},
|
||||
const chartOption = getLineChartOption({
|
||||
xAxisData: xAxisData,
|
||||
seriesData: seriesData,
|
||||
dataZoom: dataZoom,
|
||||
};
|
||||
// legendData: legendData,
|
||||
// isDarkMode: this.isDarkMode,
|
||||
});
|
||||
|
||||
this.setChartOption({ chartKey: this.chartName01, value: chartOption });
|
||||
// this.setChartYAxisData({ chartKey: this.chartName01, value: yAxisData });
|
||||
// this.setChartXAxisData({ chartKey: this.chartName01, value: xAxisData });
|
||||
@ -867,22 +858,13 @@ export default {
|
||||
];
|
||||
}
|
||||
|
||||
var chartOption = {
|
||||
legend: {
|
||||
top: 'top',
|
||||
},
|
||||
grid: {
|
||||
top: '10%',
|
||||
bottom: '20%',
|
||||
},
|
||||
yAxis: {},
|
||||
xAxis: {
|
||||
data: xAxisData,
|
||||
},
|
||||
series: seriesData,
|
||||
tooltip: {},
|
||||
const chartOption = getLineChartOption({
|
||||
xAxisData: xAxisData,
|
||||
seriesData: seriesData,
|
||||
dataZoom: dataZoom,
|
||||
};
|
||||
// legendData: legendData,
|
||||
// isDarkMode: this.isDarkMode,
|
||||
});
|
||||
|
||||
this.setChartOption({ chartKey: this.chartName02, value: chartOption });
|
||||
// this.setChartDataZoom({chartKey : this.chartName02,value: dataZoom});
|
||||
|
||||
@ -97,7 +97,7 @@
|
||||
</v-row>
|
||||
<v-row ref="contents" style="height: calc(100vh - 230px)">
|
||||
<v-col :cols="12" style="height: 100%">
|
||||
<v-row class="pa-1" style="height: 37%; width: 100%">
|
||||
<v-row class="pa-1" style="height: 50%; width: 100%">
|
||||
<div style="width: 100%; height: 100%; overflow: hidden">
|
||||
<div style="height: 15%">
|
||||
<v-card-title
|
||||
@ -117,7 +117,7 @@
|
||||
v-for="(value, key, index) in contentData01"
|
||||
:key="'key1' + index"
|
||||
>
|
||||
<v-card>
|
||||
<v-card style="position: relative; overflow: hidden;" >
|
||||
<!-- Card header -->
|
||||
<div
|
||||
style="
|
||||
@ -133,23 +133,9 @@
|
||||
<v-card-title style="padding-left: 10px">{{
|
||||
value["gdIdxNm"]
|
||||
}}</v-card-title>
|
||||
<div class="v-box" style="height: 80%; padding: 3px; margin: 2px">
|
||||
<v-col :cols="12" style="height: 100%">
|
||||
<!-- <div style="height: 20%">
|
||||
<div
|
||||
style="
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 10px;
|
||||
width: 4px;
|
||||
height: 50px;
|
||||
background-color: #91caff;
|
||||
border-radius: 2px;
|
||||
"
|
||||
></div>
|
||||
<v-card-title>{{ value["gdIdxNm"] }}</v-card-title>
|
||||
</div> -->
|
||||
<div style="height: 95%">
|
||||
<div class="v-box" style="height: 80%; padding: 3px; margin: 10px;">
|
||||
<v-col :cols="12" style="height: 100%;">
|
||||
<div style="height: 85%;">
|
||||
<component
|
||||
class="w100 h100"
|
||||
:is="loadChart ? 'Chart' : null"
|
||||
@ -166,7 +152,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</v-row>
|
||||
<v-row class="pa-1" style="height: 33%; width: 100%">
|
||||
<v-row class="pa-1" style="height: 40%; width: 100%">
|
||||
<v-card class="pa-1" style="height: 100%; width: 100%; overflow: hidden">
|
||||
<div style="height: 25%">
|
||||
<v-card-title class="d-flex align-center justify-space-between pa-5">
|
||||
@ -746,10 +732,12 @@ export default {
|
||||
{
|
||||
type: "line",
|
||||
data: seriesData,
|
||||
symbol: "none",
|
||||
itemStyle: {
|
||||
color: "#D32029",
|
||||
},
|
||||
// symbol: "circle",
|
||||
showSymbol: true,
|
||||
connectNulls: true,
|
||||
},
|
||||
// {
|
||||
// type: "line",
|
||||
|
||||
@ -6,34 +6,34 @@
|
||||
<v-card class="searchFilter">
|
||||
<v-row align="end" no-gutters>
|
||||
<v-col :cols="2.5">
|
||||
<DatePicker :parentPrgmId="myPrgmId" :label="'조회연도'" />
|
||||
<DatePicker :parentPrgmId="myPrgmId" :label="'조회연도'" customClass="datepicker-large"/>
|
||||
</v-col>
|
||||
<v-col :cols="2.5">
|
||||
<component :is="'SelectBox'" ref="SelectBox1" :propsValue="selectValue01" :itemList="selectValueList01"
|
||||
:label="'FAB'" @update:propsValue="selectValue01 = $event" :iconShow="false" customClass="select-large" />
|
||||
:label="'FAB'" @update:propsValue="selectValue01 = $event" :iconShow="true" customClass="select-large" />
|
||||
</v-col>
|
||||
<v-col :cols="2.5">
|
||||
<component :is="'SelectBox'" ref="SelectBox2" :propsValue="selectValue02" :itemList="selectValueList02"
|
||||
:label="'설비종류'" @update:propsValue="selectValue02 = $event" :iconShow="false" customClass="select-large"/>
|
||||
:label="'설비종류'" @update:propsValue="selectValue02 = $event" :iconShow="true" customClass="select-large"/>
|
||||
</v-col>
|
||||
<v-col :cols="2.5">
|
||||
<component :is="'SelectBox'" ref="SelectBox3" :propsValue="selectValue03" :itemList="selectValueList03"
|
||||
:label="'설비그룹'" @update:propsValue="selectValue03 = $event" :iconShow="false" customClass="select-large" />
|
||||
:label="'설비그룹'" @update:propsValue="selectValue03 = $event" :iconShow="true" customClass="select-large" />
|
||||
</v-col>
|
||||
|
||||
<BtnSearch size="large" @click="search" />
|
||||
<!-- <v-col>
|
||||
</v-col> -->
|
||||
<component ref="EnrgUsePlanModiPop" :is="'EnrgUsePlanModiPop'" :label="'test'" :parentPrgmId="myPrgmId"
|
||||
@gridEditingFinish="gridEditingFinish" />
|
||||
</v-row>
|
||||
<component ref="EnrgUsePlanModiPop" :is="'EnrgUsePlanModiPop'" :label="'test'" :parentPrgmId="myPrgmId"
|
||||
@gridEditingFinish="gridEditingFinish" />
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row ref="contents">
|
||||
<v-col :cols="12" >
|
||||
<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 py-4 px-4">
|
||||
<v-card-title class="pa-0 custom-title-4">설비별 에너지 계획 리스트</v-card-title>
|
||||
<Buttons :parentPrgmId="myPrgmId" :bindingData="gridName" :btnActionsFnc="btnActions" />
|
||||
</div>
|
||||
@ -44,8 +44,6 @@
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@ -106,9 +104,6 @@ export default {
|
||||
fromDt: new Date().getFullYear(),
|
||||
rowKey: null,
|
||||
edtingFinishFlag: 'Y',
|
||||
dataPathMock: {
|
||||
// "grid01": {}
|
||||
},
|
||||
// gridName: 'rowGrid',
|
||||
};
|
||||
},
|
||||
@ -166,12 +161,8 @@ export default {
|
||||
defaultData: defaultData,
|
||||
});
|
||||
},
|
||||
created() { },
|
||||
created() {},
|
||||
async mounted() {
|
||||
// -------
|
||||
// this.initTest();
|
||||
// return;
|
||||
// ========End test===========
|
||||
await this.init();
|
||||
this.initedFlag = true;
|
||||
},
|
||||
@ -184,122 +175,6 @@ export default {
|
||||
getBlocMstrList: 'modules/search/getBlocMstrList',
|
||||
getAddInfoList: 'modules/search/getAddInfoList',
|
||||
}),
|
||||
...mapMutations({
|
||||
setPageData: 'setPageData',
|
||||
}),
|
||||
initTest() {
|
||||
let _this = this;
|
||||
// _this.setPageData({ popupDialogFg: true });
|
||||
|
||||
class MockCustumButton {
|
||||
constructor(props) {
|
||||
const { grid, rowKey, columnInfo } = props;
|
||||
const value = columnInfo.renderer.options.value;
|
||||
|
||||
const elDiv = document.createElement('div');
|
||||
elDiv.innerHTML = `<span>${value}</span>`;
|
||||
$(elDiv).addClass('tui-grid-cell-content d-flex justify-space-between');
|
||||
const el = document.createElement('button');
|
||||
$(el).addClass('edit-btn blue--text');
|
||||
el.innerText = 'Edit';
|
||||
|
||||
el.addEventListener('click', function (event) {
|
||||
// console.log("------DEBUG----_this:", _this);
|
||||
// _this.setPageData({ eqpmNm: selectedGridData[0]?.eqpmNm });
|
||||
_this.setPageData({ popupDialogFg: true });
|
||||
});
|
||||
|
||||
elDiv.appendChild(el);
|
||||
this.elDiv = elDiv;
|
||||
}
|
||||
|
||||
getElement() {
|
||||
return this.elDiv;
|
||||
}
|
||||
}
|
||||
const mockData = {
|
||||
column: [
|
||||
{ header: 'No', name: 'rowNum', align: 'center', width: 40 },
|
||||
{ header: 'FAB', name: 'fab', align: 'left', width: 80 },
|
||||
{ header: '설비 그룹', name: 'eqpmGrpNm', align: 'left', minWidth: 150 },
|
||||
// {
|
||||
// header: '설비명', name: 'eqpmNm', align: 'left', minWidth: 150,
|
||||
// formatter: ({ value, row }) => {
|
||||
// return `
|
||||
// <div class="d-flex justify-space-between">
|
||||
// <span>${value}</span>
|
||||
// <button class="edit-btn blue--text" data-row='${JSON.stringify(row)}'>Edit</button
|
||||
// </div>
|
||||
// `;
|
||||
// }
|
||||
// },
|
||||
{
|
||||
header: '설비명',
|
||||
name: 'eqpmNm',
|
||||
width: 70,
|
||||
align: 'left',
|
||||
minWidth: 150,
|
||||
renderer: {
|
||||
type: MockCustumButton,
|
||||
options: {
|
||||
value: '계획수정',
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
header: '구분', name: 'gubun', align: 'left', width: 80,
|
||||
formatter({ value }) {
|
||||
let retVal = '';
|
||||
if (value == '1RSLT') {
|
||||
retVal = '전년실적';
|
||||
} else if (value == '2PLAN') {
|
||||
retVal = '계획';
|
||||
} else {
|
||||
retVal = value;
|
||||
}
|
||||
return retVal;
|
||||
},
|
||||
},
|
||||
|
||||
{ header: '1월', name: 'jan', align: 'right', width: 80 },
|
||||
{ header: '2월', name: 'feb', align: 'right', width: 80 },
|
||||
{ header: '3월', name: 'mar', align: 'right', width: 80 },
|
||||
{ header: '4월', name: 'apr', align: 'right', width: 80 },
|
||||
{ header: '5월', name: 'may', align: 'right', width: 80 },
|
||||
{ header: '6월', name: 'jun', align: 'right', width: 80 },
|
||||
{ header: '7월', name: 'jul', align: 'right', width: 80 },
|
||||
{ header: '8월', name: 'aug', align: 'right', width: 80 },
|
||||
{ header: '9월', name: 'sep', align: 'right', width: 80 },
|
||||
{ header: '10월', name: 'oct', align: 'right', width: 80 },
|
||||
{ header: '11월', name: 'nov', align: 'right', width: 80 },
|
||||
{ header: '12월', name: 'dec', align: 'right', width: 80 }
|
||||
],
|
||||
data: dataPathDataExample,
|
||||
defaultRow: dataPathDataExample,
|
||||
option: {
|
||||
columnOptions: {
|
||||
resizable: true,
|
||||
},
|
||||
header: {
|
||||
height: 65,
|
||||
complexColumns: [
|
||||
{
|
||||
header: '2025 년',
|
||||
name: 'yyyyCol',
|
||||
childNames: [
|
||||
'jan', 'feb', 'mar', 'apr', 'may', 'jun',
|
||||
'jul', 'aug', 'sep', 'oct', 'nov', 'dec'
|
||||
],
|
||||
},
|
||||
],
|
||||
}
|
||||
}
|
||||
};
|
||||
this.dataPathMock[this.gridName] = mockData;
|
||||
this.$nextTick(() => {
|
||||
this.loadGrid = true;
|
||||
});
|
||||
},
|
||||
async init() {
|
||||
await this.getFab();
|
||||
await this.getEqpmKind();
|
||||
@ -416,7 +291,7 @@ export default {
|
||||
},
|
||||
};
|
||||
|
||||
class CustumButton {
|
||||
class CustomButton {
|
||||
constructor(props) {
|
||||
const { grid, rowKey, columnInfo } = props;
|
||||
|
||||
@ -429,14 +304,14 @@ export default {
|
||||
$(elDiv).addClass('tui-grid-cell-content d-flex justify-space-between');
|
||||
const el2 = document.createElement('button');
|
||||
$(el2).addClass('edit-btn blue--text');
|
||||
el2.innerText = 'Edit';
|
||||
el2.innerText = '편집하다';
|
||||
elDiv.appendChild(el2);
|
||||
|
||||
this.el = elDiv;
|
||||
|
||||
if (!this.disabled) {
|
||||
// click 이벤트
|
||||
el2.addEventListener('click', function (event) {
|
||||
this.el.addEventListener('click', function(event) {
|
||||
let gridData = grid.store.data.rawData;
|
||||
let rowNum = gridData[rowKey].rowNum;
|
||||
let selectedGridData = gridData.filter(item => {
|
||||
@ -477,7 +352,7 @@ export default {
|
||||
header: 'NO',
|
||||
name: 'rowNum',
|
||||
width: 40,
|
||||
align: 'center',
|
||||
align: 'right',
|
||||
// hidden: true,
|
||||
},
|
||||
{
|
||||
@ -514,7 +389,7 @@ export default {
|
||||
// `;
|
||||
// }
|
||||
renderer: {
|
||||
type: CustumButton,
|
||||
type: CustomButton,
|
||||
options: {
|
||||
value: '계획수정',
|
||||
},
|
||||
@ -527,7 +402,7 @@ export default {
|
||||
align: 'center',
|
||||
hidden: true,
|
||||
renderer: {
|
||||
type: CustumButton,
|
||||
type: CustomButton,
|
||||
options: {
|
||||
value: '계획수정',
|
||||
},
|
||||
@ -600,7 +475,7 @@ export default {
|
||||
let selectedGridData = gridData.filter(item => {
|
||||
return item.rowNum == data.rowNum;
|
||||
});
|
||||
await this.$nextTick(() => { });
|
||||
await this.$nextTick(() => {});
|
||||
this.setPageData({
|
||||
rowGrid2SelectData: selectedGridData,
|
||||
});
|
||||
@ -799,8 +674,8 @@ export default {
|
||||
dataArr[i][qty] == ''
|
||||
? null
|
||||
: parseInt(dataArr[i][qty]) == 0
|
||||
? 0
|
||||
: dataArr[i][qty];
|
||||
? 0
|
||||
: dataArr[i][qty];
|
||||
dataList.push(temp);
|
||||
}
|
||||
}
|
||||
@ -942,110 +817,18 @@ const defaultData = {
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const dataPathDataExample = [
|
||||
{
|
||||
rowNum: 1,
|
||||
fab: 'B01',
|
||||
eqpmGrpNm: '방송기술운',
|
||||
eqpmNm: 'U/T_LT_CH101',
|
||||
gubun: '전력량',
|
||||
jan: 110000,
|
||||
feb: 112000,
|
||||
mar: 115000,
|
||||
apr: 117000,
|
||||
may: 120000,
|
||||
jun: 118000,
|
||||
jul: 119000,
|
||||
aug: 121000,
|
||||
sep: 122000,
|
||||
oct: 123000,
|
||||
nov: 124000,
|
||||
dec: 125000
|
||||
},
|
||||
{
|
||||
rowNum: 2,
|
||||
fab: 'B02',
|
||||
eqpmGrpNm: '방송기술운',
|
||||
eqpmNm: 'U/T_LT_CH102',
|
||||
gubun: '전력량',
|
||||
jan: 81000,
|
||||
feb: 82000,
|
||||
mar: 83000,
|
||||
apr: 84000,
|
||||
may: 85000,
|
||||
jun: 86000,
|
||||
jul: 87000,
|
||||
aug: 88000,
|
||||
sep: 89000,
|
||||
oct: 90000,
|
||||
nov: 91000,
|
||||
dec: 92000
|
||||
},
|
||||
{
|
||||
rowNum: 3, fab: 'C01', eqpmGrpNm: '방송기술운', eqpmNm: 'U/T_LT_CH124', gubun: '수도량',
|
||||
jan: 106178, feb: 104740, mar: 92283, apr: 116081, may: 98945, jun: 126579,
|
||||
jul: 90690, aug: 124243, sep: 97524, oct: 84072, nov: 88160, dec: 118183
|
||||
},
|
||||
{
|
||||
rowNum: 4, fab: 'B01', eqpmGrpNm: '방송기술운', eqpmNm: 'U/T_LT_CH103', gubun: '가스량',
|
||||
jan: 80442, feb: 102867, mar: 114939, apr: 106335, may: 81743, jun: 83711,
|
||||
jul: 86114, aug: 97432, sep: 84146, oct: 84775, nov: 117921, dec: 119417
|
||||
},
|
||||
{
|
||||
rowNum: 5, fab: 'B01', eqpmGrpNm: '설비운영팀', eqpmNm: 'U/T_LT_CH156', gubun: '전력량',
|
||||
jan: 90341, feb: 94072, mar: 122754, apr: 85471, may: 90813, jun: 116831,
|
||||
jul: 90856, aug: 109437, sep: 94029, oct: 96075, nov: 127067, dec: 102503
|
||||
},
|
||||
{
|
||||
rowNum: 6, fab: 'B03', eqpmGrpNm: '방송기술운', eqpmNm: 'U/T_LT_CH183', gubun: '가스량',
|
||||
jan: 104163, feb: 107012, mar: 104631, apr: 83055, may: 106311, jun: 117306,
|
||||
jul: 86434, aug: 117087, sep: 118414, oct: 91499, nov: 93829, dec: 94192
|
||||
},
|
||||
{
|
||||
rowNum: 7, fab: 'C01', eqpmGrpNm: '전력관리부', eqpmNm: 'U/T_LT_CH158', gubun: '가스량',
|
||||
jan: 84821, feb: 128234, mar: 116883, apr: 116718, may: 114738, jun: 88297,
|
||||
jul: 93840, aug: 84700, sep: 98360, oct: 87021, nov: 113098, dec: 94734
|
||||
},
|
||||
{
|
||||
rowNum: 8, fab: 'B02', eqpmGrpNm: '방송기술운', eqpmNm: 'U/T_LT_CH179', gubun: '가스량',
|
||||
jan: 128714, feb: 88797, mar: 124808, apr: 109283, may: 113141, jun: 82873,
|
||||
jul: 114993, aug: 129108, sep: 100885, oct: 125730, nov: 92127, dec: 122286
|
||||
},
|
||||
{
|
||||
rowNum: 9, fab: 'C01', eqpmGrpNm: '전력관리부', eqpmNm: 'U/T_LT_CH191', gubun: '전력량',
|
||||
jan: 107258, feb: 108424, mar: 113604, apr: 116648, may: 124149, jun: 129978,
|
||||
jul: 112215, aug: 129602, sep: 93551, oct: 111272, nov: 89736, dec: 128423
|
||||
},
|
||||
{
|
||||
rowNum: 10, fab: 'B02', eqpmGrpNm: '방송기술운', eqpmNm: 'U/T_LT_CH104', gubun: '전력량',
|
||||
jan: 82089, feb: 102793, mar: 96784, apr: 85238, may: 86153, jun: 123849,
|
||||
jul: 115095, aug: 129484, sep: 102109, oct: 80976, nov: 119841, dec: 106309
|
||||
},
|
||||
{
|
||||
rowNum: 11, fab: 'C02', eqpmGrpNm: '전력관리부', eqpmNm: 'U/T_LT_CH139', gubun: '전력량',
|
||||
jan: 128592, feb: 95647, mar: 85982, apr: 126824, may: 87928, jun: 128967,
|
||||
jul: 94637, aug: 107530, sep: 122533, oct: 97546, nov: 112110, dec: 126250
|
||||
},
|
||||
{
|
||||
rowNum: 12, fab: 'C01', eqpmGrpNm: '설비운영팀', eqpmNm: 'U/T_LT_CH109', gubun: '전력량',
|
||||
jan: 106530, feb: 91716, mar: 111104, apr: 102663, may: 108912, jun: 91464,
|
||||
jul: 121245, aug: 90785, sep: 120586, oct: 105718, nov: 96191, dec: 111513
|
||||
}
|
||||
];
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
// @import '@/assets/scss/common.scss';
|
||||
@import '@/assets/scss/var.scss';
|
||||
|
||||
@each $theme in dark, light {
|
||||
.v-application.#{$theme}-mode {
|
||||
.tui-grid {
|
||||
|
||||
&-row-odd,
|
||||
&-row-even {
|
||||
&:hover>.colrowspan {
|
||||
background-color: map-deep-get($config,
|
||||
&:hover > .colrowspan {
|
||||
background-color: map-deep-get(
|
||||
$config,
|
||||
#{$theme},
|
||||
'tui-grid-cell-backgroundColor'
|
||||
) !important;
|
||||
@ -1055,10 +838,10 @@ const dataPathDataExample = [
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-cell {
|
||||
&.row-selected.colrowspan {
|
||||
background-color: map-deep-get($config,
|
||||
background-color: map-deep-get(
|
||||
$config,
|
||||
#{$theme},
|
||||
'tui-grid-cell-backgroundColor'
|
||||
) !important;
|
||||
|
||||
@ -24,6 +24,7 @@
|
||||
:is="'DatePicker'"
|
||||
:label="'대상연월'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:customClass="'datepicker-large'"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col :cols="3"> </v-col>
|
||||
@ -429,9 +430,6 @@ export default {
|
||||
var chartKey = null;
|
||||
var chartOption = null;
|
||||
|
||||
console.log("data key:", dataKeyList);
|
||||
console.log("data test:", data);
|
||||
|
||||
for (var i = 0; i < dataKeyList.length; i++) {
|
||||
for (var j = 0; j < data[dataKeyList[i]].chartData.length; j++) {
|
||||
currentChartData = data[dataKeyList[i]].chartData[j];
|
||||
|
||||
@ -71,6 +71,7 @@
|
||||
:label="'대상년월'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:isRangeOption="false"
|
||||
:customClass="'datepicker-large'"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col :cols="6"> </v-col>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user