sk_fems_ui commit

This commit is contained in:
unknown
2025-07-12 15:13:46 +09:00
commit ffdf5ccb66
380 changed files with 137913 additions and 0 deletions

View File

@ -0,0 +1,330 @@
<template>
<div>
<div
class="d-flex justify-space-between align-center"
style="height: 80px;"
>
<span class="txt">검침개소 추가 정보</span>
<Buttons
:parentPrgmId="parentPrgmId"
:bindingData="gridName"
:btnActionsFnc="btnActions"
/>
</div>
<div ref="gridParent" style="height: calc(100vh - 520px);">
<Grid
:ref="gridName"
:is="loadGrid ? 'Grid' : null"
:gridName="gridName"
:parentPrgmId="parentPrgmId"
:editorGrid="true"
:innerTabGridInfo="innerTabGridInfo"
@getRowsData="getRowData"
/>
</div>
</div>
</template>
<script>
import { mapState, mapMutations, mapActions } from 'vuex';
import Buttons from '~/components/common/button/Buttons';
import Grid from '~/components/common/Grid';
import InputText from '~/components/common/input/InputText';
import Form from '~/components/common/form/Form';
import mixinGlobal from '@/mixin/global.js';
import { NewCustomRenderer } from '~/plugins/gridUtility';
import { NewCustomEditor } from '~/plugins/gridUtility';
export default {
mixins: [mixinGlobal],
components: {
Buttons,
Grid,
InputText,
Form,
},
props: {
parentPrgmId: {
type: String,
require: true,
},
innerTabGridInfo: {
type: Object,
default: null,
},
},
data() {
return {
loadGrid: false,
gridName: 'rowDetailGrid',
rowKey: null,
edtingFinishFlag: 'Y',
};
},
computed: {
...mapState({
pageData(state) {
return state.pageData[this.parentPrgmId];
},
}),
selectedCommCd() {
return this.pageData[this.gridName].data;
},
myUseFgList() {
return this.pageData.useFgList;
},
selectedComId() {
return this.pageData.rowGridSelectData.comId;
},
selectedBlocId() {
return this.pageData.rowGridSelectData.blocId;
},
selectedReadPlcId() {
return this.pageData.rowGridSelectData.readPlcId;
},
},
mounted() {
this.init();
},
methods: {
...mapMutations({
setPageData: 'setPageData',
setGridData: 'setGridData',
setGridColumn: 'setGridColumn',
setGridOption: 'setGridOption',
}),
...mapActions({
postApi: 'modules/list/postApi',
postUpdateApi: 'modules/list/postUpdateApi',
postApiReturn: 'modules/list/postApiReturn',
setTree: 'modules/list/setTree',
chkOpenTabList: 'chkOpenTabList',
}),
init() {
this.gridInit();
},
gridInit() {
const gridHeight = this.$refs.gridParent.offsetHeight - 30;
const myOptions = {
columnOptions: {
resizable: true,
},
bodyHeight: gridHeight,
minBodyHeight: gridHeight,
header: {
height: 28,
},
rowHeight: 29,
minRowHeight: 29,
selectionUnit: 'row',
editingEvent: 'click',
};
this.setGridOption({
gridKey: this.gridName,
value: myOptions,
});
const _this = this;
let useFgSelectList = [];
this.pageData.useFgList.forEach(item => {
const it = { text: item.commCdNm, value: item.commCd };
useFgSelectList.push(it);
});
let addInfoList = [];
this.pageData.addInfoList.forEach(item => {
const it = { text: item.addInfoNm, value: item.addInfoId };
addInfoList.push(it);
});
let addInfoDataKindList = [];
this.pageData.addInfoDataKindList.forEach(item => {
const it = { text: item.commCdNm, value: item.commCd };
addInfoDataKindList.push(it);
});
const myColumns = [
{ header: '회사 ID', name: 'comId', hidden: true },
{ header: '검침개소 번호', name: 'readPlcId', hidden: true },
{
header: '추가 정보',
name: 'addInfoId',
align: 'left',
formatter({ value }) {
let retVal = '';
const newValue = addInfoList.filter(item => item.value == value);
if (newValue.length > 0) {
retVal = newValue[0].text;
}
return retVal;
},
},
{
header: 'Data 구분',
name: 'addInfoDataKind',
align: 'center',
formatter({ value }) {
let retVal = '';
const newValue = addInfoDataKindList.filter(
item => item.value == value,
);
if (newValue.length > 0) {
retVal = newValue[0].text;
}
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: {
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 state : ", column);
// if(row.addInfoDataKind === "NUM"){
// column.align = "right";
// }else{
// column.align = "left";
// }
// return value;
// }
//},
/*{
header: "사용여부",
name: "useFg",
align: "center",
formatter({ value }) {
return value == "1" ? "사용" : "사용안함";
},
editor: {
type: "select",
options: {
// listItems: useFgSelectList
listItems: [
{text:"사용", value:"1"},
{text:"사용안함", value:"0"},
]
}
}
},*/
{ header: '등록 사용자', name: 'regUserNo', hidden: true },
{ header: '등록 일자', name: 'regDttm', hidden: true },
{ header: '수정 사용자', name: 'procUserNo', hidden: true },
{ header: '수정 일자', name: 'procDttm', hidden: true },
];
this.setGridColumn({
gridKey: this.gridName,
value: myColumns,
});
this.loadGrid = true;
},
async getRowData2(data, gridName) {
this.setGridSelectData({
gridKey: gridName,
gridSelect: true,
rowGridSelectKey: data.rowKey,
rowGridSelectData: Object.assign({}, data),
});
},
async btnActions(action) {
let dataArr = [];
switch (action) {
case 'add':
this.$refs[this.gridName].addRow();
this.edtingFinishFlag = 'Y';
break;
case 'remove':
this.$refs[this.gridName].removeRow();
this.edtingFinishFlag = 'N';
break;
case 'save':
if (this.edtingFinishFlag == 'Y') {
await this.$refs[this.gridName].editingFinish({
rowKey: this.rowKey,
});
}
this.loadGrid = false;
dataArr = this.$refs[this.gridName].save();
// this.setPageData({ isFind: true });
for (var i = 0; i < dataArr.length; i++) {
if (
dataArr[i].addInfoDataKind == 'NUM' &&
dataArr[i].addInfoVal == ''
) {
dataArr[i].addInfoVal = null;
}
}
if (dataArr.length > 0) {
const sendParam = {
datas: {
dsReadPlcAddInfo: dataArr.map(item => ({
...item,
comId: this.selectedComId,
blocId: this.selectedBlocId,
readPlcId: this.selectedReadPlcId,
})),
},
params: {},
};
await this.postUpdateApi({
apiKey: 'saveReadPlcAddInfoList',
sendParam: sendParam,
});
this.loadGrid = true;
this.setPageData({ isFind: true });
this.edtingFinishFlag = 'Y';
} else {
this.loadGrid = true;
alert('저장할 내용이 없습니다.');
}
break;
default:
break;
}
},
async getRowData(data) {
this.rowKey = data.rowKey;
this.edtingFinishFlag = 'Y';
},
gridEditingFinish2(data, bindingData) {
this.$refs[bindingData].editingFinish(data);
},
search() {},
},
};
</script>

View File

@ -0,0 +1,273 @@
<template>
<div>
<div
class="d-flex justify-space-between align-center"
style="height: 80px;"
>
<span class="txt">가상 검침 정보</span>
<Buttons
:parentPrgmId="parentPrgmId"
:bindingData="gridName"
:detailList="detailReadPlcImgList"
:btnActionsFnc="btnActions"
/>
</div>
<div ref="gridParent" style="height: calc((100vh - 520px) /2);">
<Grid
:ref="gridName"
:is="loadGrid ? 'Grid' : null"
:gridName="gridName"
:parentPrgmId="parentPrgmId"
@getRowsData="getRowData"
:innerTabGridInfo="innerTabGridInfo"
/>
</div>
<div ref="formParent" style="height: calc((100vh - 520px) /2);">
<component
:is="'Form'"
:parentPrgmId="parentPrgmId"
:bindingData="gridName"
:detailList="detailReadPlcImgList"
@gridEditingFinish="gridEditingFinish"
/>
</div>
</div>
</template>
<script>
import { mapState, mapMutations, mapActions } from 'vuex';
import Buttons from '~/components/common/button/Buttons';
import Grid from '~/components/common/Grid';
import InputText from '~/components/common/input/InputText';
import Form from '~/components/common/form/Form';
import mixinGlobal from '@/mixin/global.js';
import Utility from '~/plugins/utility';
export default {
mixins: [mixinGlobal],
components: {
Buttons,
Grid,
InputText,
Form,
},
props: {
parentPrgmId: {
type: String,
require: true,
},
innerTabGridInfo: {
type: Object,
default: null,
},
},
data() {
return {
loadGrid: false,
gridName: 'rowReadPlcImgGrid',
detailReadPlcImgList: myReadPlcImgDetail,
};
},
computed: {
...mapState({
pageData(state) {
return state.pageData[this.parentPrgmId];
},
}),
selectedCommCd() {
return this.pageData[this.gridName].data;
},
myUseFgList() {
return this.pageData.useFgList;
},
selectedComId() {
return this.pageData.rowGridSelectData.comId;
},
selectedBlocId() {
return this.pageData.rowGridSelectData.blocId;
},
selectedReadPlcId() {
return this.pageData.rowGridSelectData.readPlcId;
},
},
mounted() {
this.init();
},
methods: {
...mapMutations({
setPageData: 'setPageData',
setGridData: 'setGridData',
setGridColumn: 'setGridColumn',
setGridOption: 'setGridOption',
}),
...mapActions({
postApi: 'modules/list/postApi',
postUpdateApi: 'modules/list/postUpdateApi',
postApiReturn: 'modules/list/postApiReturn',
setTree: 'modules/list/setTree',
chkOpenTabList: 'chkOpenTabList',
}),
init() {
this.gridInit();
},
gridInit() {
const gridHeight = this.$refs['gridParent'].offsetHeight - 36;
const myOptions = {
columnOptions: {
resizable: true,
},
// bodyHeight: gridHeight,
// minBodyHeight: gridHeight,
header: {
height: 28,
},
rowHeight: 29,
minRowHeight: 29,
selectionUnit: 'row',
editingEvent: 'click',
};
this.setGridOption({
gridKey: this.gridName,
// value: myOptions
value: Object.assign(Utility.defaultGridOption(gridHeight), myOptions),
});
const _this = this;
let ddctKindList = [];
this.pageData.ddctKindList.forEach(item => {
const it = { text: item.commCdNm, value: item.commCd };
ddctKindList.push(it);
});
const myColumns = [
{ header: '회사 ID', name: 'comId', hidden: true },
{ header: '검침개소 번호', name: 'readPlcId', hidden: true },
{ header: '대상 검침개소 번호', name: 'objReadPlcId', align: 'center' },
{ header: '대상 검침개소명', name: 'objReadPlcNm', align: 'left' },
{ header: '분배율(1~100)', name: 'distRt', align: 'right' },
{
header: '가감유형',
name: 'ddctKind',
align: 'center',
formatter({ value }) {
let retVal = '';
const newValue = ddctKindList.filter(item => item.value == value);
if (newValue.length > 0) {
retVal = newValue[0].text;
}
return retVal;
},
},
{ header: '등록 사용자', name: 'regUserNo', hidden: true },
{ header: '등록 일자', name: 'regDttm', hidden: true },
{ header: '수정 사용자', name: 'procUserNo', hidden: true },
{ header: '수정 일자', name: 'procDttm', hidden: true },
];
this.setGridColumn({
gridKey: this.gridName,
value: myColumns,
});
this.loadGrid = true;
},
async getRowData(data, gridName) {
this.setGridSelectData({
gridKey: gridName,
gridSelect: true,
rowGridSelectKey: data.rowKey,
rowGridSelectData: Object.assign({}, data),
});
},
async btnActions(action) {
let dataArr = [];
switch (action) {
case 'add':
this.$refs[this.gridName].addRow();
break;
case 'remove':
this.$refs[this.gridName].removeRow();
break;
case 'save':
this.loadGrid = false;
dataArr = this.$refs[this.gridName].save();
this.setPageData({ isFind: true });
if (dataArr.length > 0) {
const sendParam = {
datas: {
dsReadPlcImgInfo: dataArr.map(item => ({
...item,
comId: this.selectedComId,
readPlcId: this.selectedReadPlcId,
})),
},
params: {},
};
await this.postUpdateApi({
apiKey: 'saveReadPlcImgInfo',
sendParam: sendParam,
});
this.loadGrid = true;
this.setPageData({ isFind: true });
} else {
this.loadGrid = true;
alert('저장할 내용이 없습니다.');
}
break;
default:
break;
}
},
gridEditingFinish(data, bindingData) {
this.$refs[this.gridName].editingFinish(data);
},
search() {},
},
};
const myReadPlcImgDetail = [
{
type: 'ReadPlcPop',
label: '대상 검침개소',
title: '검침개소명',
valueNm: 'objReadPlcId',
disabled: false,
cols: 6,
class: 'py-2',
required: true,
},
{
type: 'InputText',
valueNm: 'objReadPlcNm',
readonly: true,
cols: 5,
class: 'py-2',
},
{
type: 'InputNumber',
label: '분배율(1~100)',
valueNm: 'distRt',
disabled: false,
cols: 6,
class: 'py-2',
inputType: 'number',
min: 1,
max: 100,
required: true,
},
{
type: 'SelectBox',
label: '가감유형',
valueNm: 'ddctKind',
disabled: false,
cols: 6,
class: 'py-2',
list: 'ddctKindList',
itemText: 'commCdNm',
itemValue: 'commCd',
required: true,
},
];
</script>

View File

@ -0,0 +1,409 @@
<template>
<div>
<div
class="d-flex justify-space-between align-center"
style="height: 80px;"
>
<span class="txt">검침개소 TAG 연결 정보</span>
<Buttons
:parentPrgmId="parentPrgmId"
:bindingData="gridName"
:detailList="detailReadPlcTagList"
:btnActionsFnc="btnActions"
/>
</div>
<div ref="gridParent" style="height: calc((100vh - 520px) /2);">
<Grid
:ref="gridName"
:is="loadGrid ? 'Grid' : null"
:gridName="gridName"
:parentPrgmId="parentPrgmId"
@getRowsData="getRowData"
:innerTabGridInfo="innerTabGridInfo"
/>
</div>
<div ref="formParent" style="height: calc((100vh - 520px) /2);">
<component
:is="'Form'"
:parentPrgmId="parentPrgmId"
:bindingData="gridName"
:detailList="detailReadPlcTagList"
@gridEditingFinish="gridEditingFinish"
/>
</div>
</div>
</template>
<script>
import { mapState, mapMutations, mapActions } from 'vuex';
import Buttons from '~/components/common/button/Buttons';
import Grid from '~/components/common/Grid';
import { CustumChecbox } from '~/plugins/gridUtility';
import { CustomNumberEditor } from '~/plugins/gridUtility';
import Form from '~/components/common/form/Form';
import mixinGlobal from '@/mixin/global.js';
import Utility from '~/plugins/utility';
export default {
mixins: [mixinGlobal],
components: {
Buttons,
Grid,
Form,
},
props: {
parentPrgmId: {
type: String,
require: true,
},
innerTabGridInfo: {
type: Object,
default: null,
},
},
data() {
return {
loadGrid: false,
gridName: 'rowReadPlcTagRelGrid',
detailReadPlcTagList: myReadPlcTagDetail,
};
},
computed: {
...mapState({
pageData(state) {
return state.pageData[this.parentPrgmId];
},
}),
selectedCommCd() {
return this.pageData[this.gridName].data;
},
myUseFgList() {
return this.pageData.useFgList;
},
selectedComId() {
return this.pageData.rowGridSelectData.comId;
},
selectedBlocId() {
return this.pageData.rowGridSelectData.blocId;
},
selectedReadPlcId() {
return this.pageData.rowGridSelectData.readPlcId;
},
},
mounted() {
this.init();
},
methods: {
...mapMutations({
setPageData: 'setPageData',
setGridData: 'setGridData',
setGridColumn: 'setGridColumn',
setGridOption: 'setGridOption',
}),
...mapActions({
postApi: 'modules/list/postApi',
postUpdateApi: 'modules/list/postUpdateApi',
postApiReturn: 'modules/list/postApiReturn',
setTree: 'modules/list/setTree',
chkOpenTabList: 'chkOpenTabList',
}),
init() {
this.gridInit();
},
gridInit() {
const gridHeight = this.$refs['gridParent'].offsetHeight - 36;
const myOptions = {
// bodyHeight: gridHeight,
// minBodyHeight: gridHeight,
header: {
height: 28,
},
rowHeight: 29,
minRowHeight: 29,
selectionUnit: 'row',
editingEvent: 'click',
// columnOptions: {
// resizable: true,
// minWidth: 100
// }
};
this.setGridOption({
gridKey: this.gridName,
// value: myOptions
value: Object.assign(Utility.defaultGridOption(gridHeight), myOptions),
});
const _this = this;
let useFgSelectList = [];
this.pageData.useFgList.forEach(item => {
const it = { text: item.commCdNm, value: item.commCd };
useFgSelectList.push(it);
});
let addInfoList = [];
this.pageData.addInfoList.forEach(item => {
const it = { text: item.addInfoNm, value: item.addInfoId };
addInfoList.push(it);
});
let addInfoDataKindList = [];
this.pageData.addInfoDataKindList.forEach(item => {
const it = { text: item.commCdNm, value: item.commCd };
addInfoDataKindList.push(it);
});
const myColumns = [
{ header: '회사 ID', name: 'comId', hidden: true },
{ header: '검침개소 번호', name: 'readPlcId', hidden: true },
{ header: 'ERC NM', name: 'ercNm', align: 'center', hidden: true },
{ header: 'TAG 명', name: 'tagNm', align: 'left' },
{ header: 'TAG ID', name: 'tagId', align: 'center', hidden: true },
{
header: '에너지원',
name: 'ercId',
align: 'center',
width: 100,
formatter({ value }) {
let retVal = '';
const newValue = _this.pageData.ercNmList.filter(
item => item.value == value,
);
if (newValue.length > 0) {
retVal = newValue[0].text;
}
return retVal;
},
},
{
header: '분배율(1~100)',
name: 'distRt',
align: 'right',
width: 100,
// editor: {
// type: CustomNumberEditor,
// options: {
// min: 0,
// max: 100,
// }
// }
},
{
header: '대표 TAG 여부',
name: 'reprTagFg',
align: 'center',
width: 100,
// renderer: {
// type: CustumChecbox,
// options: {
// onlyone: true,
// // disabled: true
// }
// }
formatter({ value }) {
return value == '1' ? '예' : '아니오';
},
},
{
header: '사용여부',
name: 'useFg',
align: 'center',
width: 100,
formatter({ value }) {
value = value === true ? '1' : '0';
const newValue = _this.pageData.useFgList.filter(
item => item.commCd == value,
);
return newValue[0].commCdNm;
},
// editor: {
// type: "select",
// options: {
// listItems: useFgSelectList
// }
// }
},
{ header: '비고', name: 'rmrk', align: 'left', width: 100 },
{ header: '등록 사용자', name: 'regUserNo', hidden: true },
{ header: '등록 일자', name: 'regDttm', hidden: true },
{ header: '수정 사용자', name: 'procUserNo', hidden: true },
{ header: '수정 일자', name: 'procDttm', hidden: true },
];
this.setGridColumn({
gridKey: this.gridName,
value: myColumns,
});
this.loadGrid = true;
},
async getRowData(data, gridName) {
if (data.rowStat === 'I') {
this.detailReadPlcTagList[0].disabled = false;
this.detailReadPlcTagList[1].disabled = false;
} else {
this.detailReadPlcTagList[0].disabled = true;
this.detailReadPlcTagList[1].disabled = true;
}
this.setGridSelectData({
gridKey: gridName,
gridSelect: true,
rowGridSelectKey: data.rowKey,
rowGridSelectData: Object.assign({}, data),
});
},
async btnActions(action) {
let dataArr = [];
switch (action) {
case 'add':
const defaultRow = {
tagId: '',
tagNm: '',
ercId: this.pageData.ercNmList[0].value,
rmrk: null,
distRt: '',
reprTagFg: '1',
useFg: true,
};
this.$refs[this.gridName].addRow(defaultRow);
this.detailReadPlcTagList[0].disabled = false;
this.detailReadPlcTagList[1].disabled = false;
break;
case 'remove':
this.$refs[this.gridName].removeRow();
this.detailReadPlcTagList[0].disabled = true;
this.detailReadPlcTagList[1].disabled = true;
break;
case 'save':
dataArr = this.$refs[this.gridName].save();
// this.loadGrid = false;
const newDataArr = dataArr.map(item => {
const newData = {
...item,
comId: this.selectedComId,
readPlcId: this.selectedReadPlcId,
};
newData.reprTagFg = newData.reprTagFg == true ? '1' : '0';
newData.useFg = newData.useFg == true ? '1' : '0';
return newData;
});
if (dataArr.length > 0) {
var validCheck = true;
dataArr.filter(item => {
if (item.rowStat === 'I') {
if (item.tagId == '' || item.distRt == '' || item.ercId == '') {
alert('필수 입력값을 입력해주세요.');
validCheck = false;
}
} else if (item.rowStat === 'U') {
if (item.distRt == '' || item.ercId == '') {
alert('필수 입력값을 입력해주세요.');
validCheck = false;
}
}
});
if (validCheck) {
const sendParam = {
datas: {
dsReadPlcTagRel: newDataArr,
},
params: {},
};
await this.postUpdateApi({
apiKey: 'saveReadPlcTagRel',
sendParam: sendParam,
});
// this.loadGrid = true;
this.setPageData({ isFind: true });
}
} else {
alert('저장할 내용이 없습니다.');
}
break;
default:
break;
}
},
gridEditingFinish(data, bindingData) {
this.$refs[this.gridName].editingFinish(data);
},
search() {},
},
};
const myReadPlcTagDetail = [
{
type: 'EvtObjPop',
labelContent: 'TAG',
modalTitle: 'TAG 리스트',
valueNm: 'tagId',
valueNm2: 'tagNm',
disabled: true,
cols: 6,
class: 'py-2',
required: true,
},
{
type: 'InputText',
valueNm: 'tagNm',
readonly: true,
cols: 5,
class: 'py-2',
required: true,
},
{
type: 'SelectBox',
label: '에너지원',
valueNm: 'ercId',
disabled: false,
cols: 6,
class: 'py-2',
list: 'ercNmList',
itemText: 'text',
itemValue: 'value',
required: true,
},
{
type: 'CheckBox',
label: '대표 TAG 여부',
valueNm: 'reprTagFg',
disabled: false,
cols: 6,
class: 'py-2',
value: { '1': true, '0': false },
required: true,
},
{
type: 'InputNumber',
label: '분배율(1~100)',
valueNm: 'distRt',
disabled: false,
cols: 6,
class: 'py-2',
inputType: 'number',
min: 1,
max: 100,
required: true,
},
{
type: 'CheckBox',
label: '사용여부',
valueNm: 'useFg',
disabled: false,
cols: 6,
class: 'py-2',
value: { '1': true, '0': false },
required: true,
},
{
type: 'InputText',
label: '비고',
valueNm: 'rmrk',
disabled: false,
cols: 6,
class: 'py-2',
inputType: 'string',
},
];
</script>