<template>
	<div ref="mainDiv" class="l-layout">
		<v-row ref="searchFilter">
			<v-col :cols="12">
				<v-card class="searchFilter">
					<v-row align="center" no-gutters>
						<v-col :cols="3">
							<component
								:is="'SelectBox'"
								ref="SelectBox1"
								:propsValue="selectValue01"
								:itemList="selectValueList01"
								:label="'설비종류'"
								@update:propsValue="selectValue01 = $event"
							/>
						</v-col>
						<v-col :cols="3">
							<component
								:is="'SelectBox'"
								ref="SelectBox2"
								:propsValue="selectValue02"
								:itemList="selectValueList02"
								:label="'설비그룹'"
								@update:propsValue="selectValue02 = $event"
							/>
						</v-col>
						<v-col :cols="3">
							<InputText
								:parentPrgmId="myPrgmId"
								label="가이드명"
								:textCols="8"
								valueNm="gdIdxNm"
								:searchOption="true"
							/>
						</v-col>
						<v-col :cols="3" class="text-right">
							<BtnSearch @click="search" />
						</v-col>
					</v-row>
				</v-card>
			</v-col>
		</v-row>
		<v-row ref="contents">
			<v-col :cols="12" style="height: 100%">
				<!-- <v-card class="py-5"> -->
				<v-col :cols="12" style="height: 40%">
					<v-card class="pb-5">
						<div class="d-flex align-center justify-space-between pa-4">
							<v-card-title class="pa-0 custom-title-4"
								>가이드 리스트</v-card-title
							>
							<Buttons
								:parentPrgmId="myPrgmId"
								:bindingData="gridName"
								:detailList="detailList"
								:btnActionsFnc="btnActions"
							/>
						</div>
						<div class="h100 px-5" style="height:calc(100% - 70px)">
							<div ref="gridParent" class="w100 h100">
								<component
									:ref="gridName"
									:is="loadGrid ? 'Grid' : null"
									:gridName="gridName"
									:parentPrgmId="myPrgmId"
									@getRowsData="getRowData"
								/>
							</div>
						</div>
					</v-card>
				</v-col>
				<v-col :cols="12" style="height: 60%">
					<v-card class="pb-5">
						<v-row
							:cols="12"
							class="d-flex align-center justify-space-between pa-3"
						>
							<component
								:is="'Form'"
								:parentPrgmId="myPrgmId"
								:detailList="detailList"
								@gridEditingFinish="gridEditingFinish"
							/>
						</v-row>
					</v-card>
				</v-col>
				<!-- </v-card> -->
			</v-col>
		</v-row>
	</div>
</template>
<script>
import { 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 SelectBox from '@/components/common/select/SelectBox';

import SelectBlocMstr from '@/components/common/select/SelectBlocMstr';
import selectCodeList from '@/components/common/select/selectCodeList';

import InputText from '@/components/common/input/InputText';
import Form from '~/components/common/form/Form';
import Grid from '~/components/common/Grid';
import Utility from '~/plugins/utility';

let myTitle;
// const myPrgmId = "PRG0009";
let myPrgmId;
export default {
	mixins: [mixinGlobal, resize],
	async asyncData(context) {
		const myState = context.store.state;
		// context.store.commit("setActiveMenuInfo", myState.menuData[myPrgmId]);
		// myTitle = myState.activeMenuInfo.menuNm;
		myPrgmId = context.route.query.prgmId;
		await context.store.commit('setActiveMenuInfo', myState.menuData[myPrgmId]);
		myTitle = await myState.activeMenuInfo.menuNm;
	},
	meta: {
		title: () => {
			return myTitle;
		},
		prgmId: myPrgmId,
		closable: true,
	},
	components: {
		BtnSearch,
		Buttons,
		SelectBlocMstr,
		selectCodeList,
		InputText,
		Form,
		Grid,
		SelectBox,
	},
	data() {
		return {
			myPrgmId: myPrgmId,
			initedFlag: false,
			gridName: 'rowGrid',
			loadGrid: false,
			detailList: myDetail,
			selectValue01: null,
			selectValueList01: [],
			selectValue02: null,
			selectValueList02: [],
			// pyscPopupValueChkList: 'pyscPopupValueChkList',
			// pyscListChk: {
			// 	pysclQtyId1 : null,
			// 	pysclQtyId2 : null,
			// 	pysclQtyId3 : null,
			// 	pysclQtyId4 : null
			// }
		};
	},
	computed: {
		// ...mapState({
		//   pageData: state => state.pageData[myPrgmId]
		// }),
		chkIsFind() {
			// 조회 플래그
			return this.pageData.isFind;
		},
		chkCalcProc() {
			return this.pageData.calcProc;
		},
	},
	watch: {
		chkCalcProc(val) {
			let rowData = this.pageData.rowGridSelectData;
			rowData['pysclQtyId1'] = null;
			rowData['pysclQtyId2'] = null;
			rowData['pysclQtyId3'] = null;
			rowData['pysclQtyId4'] = null;
			rowData['pysclQtyNm1'] = null;
			rowData['pysclQtyNm2'] = null;
			rowData['pysclQtyNm3'] = null;
			rowData['pysclQtyNm4'] = null;
			rowData['argCnt'] = this.pageData.argCnt;
			this.setPageData({
				rowGridSelectData: rowData,
				pyscPopValChg: '',
			});
			// this.getRowData(rowData);
			// this.$nextTick();
			for (var i = 1; i <= 4; i++) {
				// 초기화된 pyscPop 값 grid에 binding
				let colName1 = 'pysclQtyId' + i;
				let colName2 = 'pysclQtyNm' + i;
				const dt = {
					columnName: colName1,
					value: null,
				};
				const dt2 = {
					columnName: colName2,
					value: null,
				};
				this.gridEditingFinish(dt);
				this.gridEditingFinish(dt2);
				// this.$refs[this.gridName].editingFinish(dt);
				// this.$refs[this.gridName].editingFinish(dt2);
			}
		},
		chkIsFind(val) {
			if (val) this.search();
		},
		async selectValue01(val) {
			this.setPageData({ eqpmKindId: val });
			if (this.initedFlag) {
				await this.getEqpmGrp();
			}
			// if(this.initedFlag) this.setPageData({ isFind: true });
			myDetail[10]['eqpmKindId'] = val;
			myDetail[11]['eqpmKindId'] = val;
			myDetail[12]['eqpmKindId'] = val;
			myDetail[13]['eqpmKindId'] = val;
		},
		async selectValue02(val) {
			this.setPageData({ eqpmGrpId: val });
			if (this.initedFlag) {
				this.setPageData({ isFind: true });
			}
			myDetail[10]['eqpmGrpId'] = val;
			myDetail[11]['eqpmGrpId'] = val;
			myDetail[12]['eqpmGrpId'] = val;
			myDetail[13]['eqpmGrpId'] = val;
		},
	},
	async beforeCreate() {
		myPrgmId = this.$route.query.prgmId;
		await this.$store.dispatch('chkOpenTabList', {
			key: 'create',
			prgmId: myPrgmId,
			defaultData: defaultData,
		});
	},
	created() {
		// this.searchCommCodeLists();
		// 상위 계산방법 목록 조회
		// this.getCodeList({
		// 	dataKey: 'upTotMeth',
		// 	params: {
		// 		commGrpCd: 'EM_UP_TOT_METH',
		// 		useFg : '1'
		// 	},
		// 	addAll: false,
		// });
		// // 단위 목록 조회
		// this.getCodeList({
		// 	dataKey: 'unit',
		// 	params: {
		// 		commGrpCd: 'CM_UNIT',
		// 		useFg : '1'
		// 	},
		// 	addAll: false,
		// });
	},
	async mounted() {
		await this.init();
		this.initedFlag = true;
	},
	beforeDestroy() {
		this.chkOpenTabList({ key: 'destroy', prgmId: myPrgmId });
	},
	methods: {
		...mapActions({
			getCodeList: 'modules/search/getCodeList',
			getBlocMstrList: 'modules/search/getBlocMstrList',
			getAddInfoList: 'modules/search/getAddInfoList',
		}),
		async init() {
			await this.getEqpmKind();
			await this.getEqpmGrp();
			this.gridInit();
		},
		search() {
			this.searchCommCodeLists();
			this.cleanBindingData();
			this.getRowGridData();
			this.setPageData({
				isFind: false,
			});
		},
		async getEqpmKind() {
			let res = await this.postApiReturn({
				apiKey: 'selectEqpmKindCodeList',
				resKey: 'eqpmKindCodeLists',
				sendParam: {},
			});
			if (res.length > 0) {
				this.selectValueList01 = await res.map(item => {
					return {
						text: item.eqpmKindNm,
						value: item.eqpmKindId,
					};
				});
				this.selectValue01 = this.selectValueList01[0].value;
			} else {
				this.selectValueList01 = [];
				this.selectValue01 = null;
			}
			this.setPageData({
				eqpmKindList: this.selectValueList01,
				eqpmKindId: this.selectValue01,
			});
		},
		async getEqpmGrp() {
			let res = await this.postApiReturn({
				apiKey: 'selectEqpmGrpCodeList',
				resKey: 'eqpmGrpCodeLists',
				sendParam: { eqpmKindId: this.selectValue01 },
			});
			if (res.length > 0) {
				this.selectValueList02 = await res.map(item => {
					return {
						text: item.eqpmGrpNm,
						value: item.eqpmGrpId,
					};
				});
				this.selectValue02 = this.selectValueList02[0].value;
			} else {
				this.selectValueList02 = [];
				this.selectValue02 = null;
			}
			this.setPageData({
				eqpmGrpList: this.selectValueList02,
				eqpmGrpId: this.selectValue02,
			});
		},
		gridInit() {
			const gridHeight = this.$refs.gridParent.offsetHeight - 30;

			const myOptions = {
				columnOptions: {
					resizable: true,
				},
			};
			this.setGridOption({
				gridKey: this.gridName,
				value: Object.assign(Utility.defaultGridOption(gridHeight), myOptions),
			});

			const _this = this;
			const myColumns = [
				// {
				// 	header: 'rowStat',
				// 	name: 'rowStat',
				// 	width: 100,
				// 	aling: 'center',
				// 	hidden: true,
				// },
				{
					header: 'COM ID',
					name: 'comId',
					width: 100,
					aling: 'center',
					hidden: true,
				},
				{
					header: '가이드',
					name: 'gdIdxId',
					width: 100,
					align: 'center',
				},
				{
					header: '가이드명',
					name: 'gdIdxNm',
					width: 210,
					align: 'left',
				},
				{
					header: '설비그룹ID',
					name: 'eqpmGrpId',
					width: 100,
					align: 'center',
					// hidden: true,
					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',
					// hidden: true,
					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: 'sortSeq',
					width: 100,
					align: 'center',
					hidden: true,
				},
				{
					header: '물리량1',
					name: 'pysclQtyId1',
					width: 100,
					align: 'center',
					hidden: true,
				},
				{
					header: '물리량2',
					name: 'pysclQtyId2',
					width: 100,
					align: 'center',
					hidden: true,
				},
				{
					header: '물리량3',
					name: 'pysclQtyId3',
					width: 100,
					align: 'center',
					hidden: true,
				},
				{
					header: '물리량4',
					name: 'pysclQtyId4',
					width: 100,
					align: 'center',
					hidden: true,
				},
				{
					header: '카테고리1',
					name: 'ctgr1',
					width: 100,
					align: 'center',
					hidden: true,
				},
				{
					header: '카테고리2',
					name: 'ctgr2',
					width: 100,
					align: 'center',
					hidden: true,
				},
				{
					header: '주의기준',
					name: 'careStndVal',
					width: 100,
					align: 'right',
				},
				{
					header: '경고기준',
					name: 'warnStndVal',
					width: 100,
					align: 'right',
				},
				{
					header: '가이드방법',
					name: 'gdMeth',
					width: 100,
					align: 'center',
					hidden: true,
				},
				{
					header: '설비기준적용',
					name: 'useFg',
					width: 100,
					align: 'center',
					formatter({ value }) {
						if (value == '1') {
							value = 'Y';
						} else {
							value = null;
						}
						return value;
					},
					hidden: true,
				},
				{
					header: '알람메세지',
					name: 'alrmMsg',
					minWidth: 860,
					align: 'left',
					// hidden: true,
				},
				{
					header: '계산코드',
					name: 'calcProc',
					width: 100,
					align: 'center',
					hidden: true,
				},
				{
					header: '계산설명',
					name: 'calcDesc',
					width: 100,
					align: 'center',
					hidden: true,
				},
				{
					header: '계산식',
					name: 'calcMeth',
					width: 100,
					align: 'center',
					hidden: true,
				},
				{
					header: '단위',
					name: 'unit',
					width: 100,
					align: 'center',
					hidden: true,
					formatter({ value }) {
						let retVal = '';
						const newValue = _this.pageData.unitList.filter(
							item => item.commCd == value,
						);
						if (newValue.length > 0) {
							retVal = newValue[0].commCdNm;
						}
						return retVal;
					},
				},
				{
					header: '아규먼트개수',
					name: 'argCnt',
					width: 100,
					align: 'center',
					hidden: true,
				},
			];

			this.setGridColumn({
				gridKey: this.gridName,
				value: myColumns,
			});

			this.loadGrid = true;

			this.search();
		},
		async getRowGridData() {
			this.loadGrid = false;
			let res = [];

			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({
				gridKey: this.gridName,
				value: newRes,
			});
			//this.loadGrid = true;
			this.$nextTick(() => {
				if (newRes.length > 0) {
					try {
						this.$refs[this.gridName].focus({
							//rowKey: 0,
							rowKey:
								this.pageData.rowGridSelectKey == '' ||
								this.pageData.rowGridSelectKey == null
									? 0
									: this.pageData.rowGridSelectKey ==
									  this.$refs[this.gridName].getData().length - 1
									? this.pageData.rowGridSelectKey
									: 0,
							columnName: 'gdIdxId',
							setScroll: true,
						});
					} catch (error) {}
				} else {
					this.detailDataInit();
				}
			});
			this.loadGrid = true;
		},
		async getRowData(data) {
			this.setPageData({
				rowGridSelectKey: data.rowKey,
				rowGridSelectData: data,
			});
			// this.setReadObjAddInfo(data);
			/// 물리량 popup 설정
			this.pyscPopChk(data);
			/// 카테고리 설정
			this.ctgrChk(data);
			/// 카테고리 설정
			this.argCntChange(
				['pysclQtyId1', 'pysclQtyId2', 'pysclQtyId3', 'pysclQtyId4'],
				data.argCnt,
				false,
			);
			this.setPyscPopValChg(
				['pysclQtyId1', 'pysclQtyId2', 'pysclQtyId3', 'pysclQtyId4'],
				data,
			);
		},
		gridEditingFinish(data) {
			let pyscNameList = [
				'pysclQtyId1',
				'pysclQtyId2',
				'pysclQtyId3',
				'pysclQtyId4',
			];
			let ctgrNameList = ['ctgr1', 'ctgr2'];
			// popup 변경 시 사용되는 로직
			if (pyscNameList.includes(data.columnName)) {
				this.pyscPopupSequentialInputProcess(pyscNameList, data);
				this.argCntChange(
					pyscNameList,
					this.pageData.rowGridSelectData.argCnt,
					false,
				);
			}
			// 카테고리 변경 시 사용되는 로직
			if (ctgrNameList.includes(data.columnName)) {
				this.categorySequentialInputProcess(ctgrNameList, data);
			}
			// 아규먼트 개수에 맞춰 pyscPopup disabled 및 값 null처리
			if (data.columnName == 'argCnt') {
				this.argCntChange(pyscNameList, data.value, true);
			}
			// searchBar에 있는 설비 그룹이 아닌 아래 설비그룹을 바꿨을 경우 popup창 초기화 로직
			// 지금 안씀
			if (data.columnName == 'eqpmGrpId') {
				this.pyscPopupSequentialInputProcess(pyscNameList, {
					columnName: 'pysclQtyId1',
					value: null,
				});
				myDetail[10]['eqpmGrpId'] = data.value;
				myDetail[11]['eqpmGrpId'] = data.value;
				myDetail[12]['eqpmGrpId'] = data.value;
				myDetail[13]['eqpmGrpId'] = data.value;
			}
			// 물리량 popup에서 값을 변경(수정 or 삭제)시 뒤에있는 물리량 popup값을 grid에도 null값으로 변경하는 로직
			// if (pyscNameList.includes(data.columnName)) {
			// 	let idx = pyscNameList.indexOf(data.columnName);
			// 	for(var i=0; i<pyscNameList.length; i++){
			// 		if(i==idx){
			// 			this.$refs[this.gridName].editingFinish(data);
			// 		}else if(i>idx){
			// 			this.$refs[this.gridName].editingFinish(
			// 				{
			// 					columnName: pyscNameList[i],
			// 					value: null
			// 				}
			// 			);
			// 		}
			// 	}
			// // 물리량 popup 제외 다른 값들 로직
			// }else{
			// 	this.$refs[this.gridName].editingFinish(data);
			// }
			this.$refs[this.gridName].editingFinish(data);
		},
		detailDataInit() {
			this.setPageData({
				rowGridSelectKey: null,
				rowGridSelectData: [],
			});
			this.setGridData({
				gridKey: 'rowDetailGrid',
				value: [],
			});
		},
		async btnActions(action) {
			let dataArr = [];
			switch (action) {
				case 'add':
					const defaultRow = {
						comId: '',
						gdIdxId: '',
						gdIdxNm: '',
						eqpmGrpId: this.pageData.eqpmGrpId,
						upTotMeth: '',
						sortSeq: '',
						pysclQtyId1: '',
						pysclQtyId2: '',
						pysclQtyId3: '',
						pysclQtyId4: '',
						ctgr1: '',
						ctgr2: '',
						careStndVal: '',
						warnStndVal: '',
						gdMeth: '',
						useFg: '1',
						alrmMsg: '',
						calcProc: '',
						calcDesc: '',
						calcMeth: '',
						unit: '',
						argCnt: null,
						rowStat: 'I',
					};
					this.$refs[this.gridName].addRow(defaultRow);
					break;

				case 'remove':
					this.$refs[this.gridName].removeRow();
					break;

				case 'save':
					dataArr = this.$refs[this.gridName].save();
					var validCheck = true;
					if (dataArr.length > 0) {
						dataArr.filter(item => {
							if (!this.valiedCheckFunc(item)) {
								validCheck = false;
							}
						});
						if (validCheck) {
							const sendParam = {
								datas: {
									dsGdIdxMngInfo: dataArr.map(item => ({
										...item,
									})),
								},
								params: {},
							};
							await this.postUpdateApi({
								apiKey: 'saveGdIdxMngInfo',
								sendParam: sendParam,
							});

							this.$nextTick(() => {
								this.setPageData({ isFind: true });
							});
						}
					} else {
						alert('저장할 내용이 없습니다.');
					}
					break;

				default:
					break;
			}
		},
		cleanBindingData() {
			this.setPageData({
				rowGridSelectKey: null,
				rowGridSelectData: [],
				pyscPopValChg: '',
			});
			// 물리량1 popup 관리
			myDetail[10]['disabled'] = false;
			// 물리량2 popup 관리
			myDetail[11]['disabled'] = false;
			// 물리량3 popup 관리
			myDetail[12]['disabled'] = false;
			// 물리량4 popup 관리
			myDetail[13]['disabled'] = false;
		},
		ctgrChk(data) {
			if (data.ctgr1 == '' || data.ctgr1 == null) {
				myDetail[15]['disabled'] = true;
			} else {
				myDetail[14]['disabled'] = false;
				myDetail[15]['disabled'] = false;
			}
		},
		pyscPopChk(data) {
			let pyscPopChk2 =
				data.pysclQtyId1 == '' || data.pysclQtyId1 == null ? true : false;
			let pyscPopChk3 =
				data.pysclQtyId2 == '' || data.pysclQtyId2 == null ? true : false;
			let pyscPopChk4 =
				data.pysclQtyId3 == '' || data.pysclQtyId3 == null ? true : false;
			// 물리량1 popup 관리
			myDetail[10]['disabled'] = false;
			// 물리량2 popup 관리
			myDetail[11]['disabled'] = pyscPopChk2;
			// 물리량3 popup 관리
			myDetail[12]['disabled'] = pyscPopChk3;
			// 물리량4 popup 관리
			myDetail[13]['disabled'] = pyscPopChk4;
		},
		pyscPopupSequentialInputProcess(pyscNameList, data) {
			let rowGridSelectedDataDict = { ...this.pageData.rowGridSelectData };
			let idx = pyscNameList.indexOf(data.columnName);
			// popup disabled 삭제 버튼 사용시 처리 조건
			if (data.value == null) {
				idx -= 1;
			}
			// popup disabled 일반 선택시 처리
			for (var i = 0; i < pyscNameList.length; i++) {
				if (i <= idx + 1) {
					myDetail[10 + i]['disabled'] = false;
				} else {
					myDetail[10 + i]['disabled'] = true;
				}
			}

			for (var i = 0; i < pyscNameList.length; i++) {
				if (i == idx) {
					this.$refs[this.gridName].editingFinish(data);
				} else if (i > idx) {
					this.$refs[this.gridName].editingFinish({
						columnName: pyscNameList[i],
						value: null,
					});
				}
			}
			// popup 선택내용 초기화 처리
			for (var i = idx + 1; i < pyscNameList.length; i++) {
				rowGridSelectedDataDict[pyscNameList[i]] = null;
				this.$refs[this.gridName].editingFinish({
					columnName: pyscNameList[i],
					value: null,
				});
			}
			this.setPageData({
				rowGridSelectData: rowGridSelectedDataDict,
			});
			this.setPyscPopValChg(pyscNameList, rowGridSelectedDataDict);
		},
		categorySequentialInputProcess(ctgrList, data) {
			let rowGridSelectedDataDict = { ...this.pageData.rowGridSelectData };
			let idx = ctgrList.indexOf(data.columnName);
			// disabled 처리
			if (idx == 0 && (data.value == '' || data.value == null)) {
				myDetail[15]['disabled'] = true;
			} else {
				myDetail[14]['disabled'] = false;
				myDetail[15]['disabled'] = false;
			}
			// 카테고리1 값 수정 시 카테고리2 값 삭제
			if (idx == 0) {
				rowGridSelectedDataDict[ctgrList[1]] = null;
				this.$refs[this.gridName].editingFinish({
					columnName: ctgrList[1],
					value: null,
				});
			}
			this.setPageData({
				rowGridSelectData: rowGridSelectedDataDict,
			});
			this.setPyscPopValChg(
				['pysclQtyId1', 'pysclQtyId2', 'pysclQtyId3', 'pysclQtyId4'],
				rowGridSelectedDataDict,
			);
		},
		argCntChange(pyscNameList, argCnt, type) {
			let rowGridSelectedDataDict = { ...this.pageData.rowGridSelectData };
			//데이터에 맞춰 pyscPopup disabled처리
			this.pyscPopChk(rowGridSelectedDataDict);
			//argCnt에 맞춰 pyscPopup disabled 및 textField 채우기, require 변경
			if (argCnt != null) {
				for (var i = 0; i < pyscNameList.length; i++) {
					myDetail[10 + i]['required'] = true;
				}
				for (var i = pyscNameList.length - 1; i >= argCnt; i--) {
					myDetail[10 + i]['disabled'] = true;
					myDetail[10 + i]['required'] = false;
					// argCnt를 바꿨을 때
					if (type) {
						rowGridSelectedDataDict[pyscNameList[i]] = null;
						this.$refs[this.gridName].editingFinish({
							columnName: pyscNameList[i],
							value: null,
						});
					}
				}
				this.setPageData({
					rowGridSelectData: rowGridSelectedDataDict,
				});
				this.setPyscPopValChg(pyscNameList, rowGridSelectedDataDict);
			}
		},
		// 여러 개의 물리량 popup 사용시 중복되는 물리량ID를 선택 하지 못하게 하기위한 세팅
		setPyscPopValChg(pyscNameList, rowGridSelectedDataDict) {
			let tempWord = '';
			for (var i = 0; i < pyscNameList.length; i++) {
				tempWord += rowGridSelectedDataDict[pyscNameList[i]] + '/*wq2a/';
			}
			// pyscPopValChg는 defaultData에 선언해야한다.
			// pyscPopValChg의 형태 => 'PYSCL00003/*wq2a/PYSCL00006/*wq2a/null/*wq2a/null/*wq2a/'
			this.setPageData({
				pyscPopValChg: tempWord,
			});
		},
		searchCommCodeLists() {
			// 상위 계산방법 목록 조회
			this.getCodeList({
				dataKey: 'upTotMeth',
				params: {
					commGrpCd: 'EM_UP_TOT_METH',
					useFg: '1',
				},
				addAll: false,
			});
			// 단위 목록 조회
			this.getCodeList({
				dataKey: 'unit',
				params: {
					commGrpCd: 'CM_UNIT',
					useFg: '1',
				},
				addAll: false,
			});
		},
		valiedCheckFunc(item) {
			let validCheck = true;
			if (item.rowStat === 'I' || item.rowStat === 'U') {
				let argCntCheck = 4; // pyscPop 개수(4)
				for (var i = 0; i < 6; i++) {
					// pyscPop 선택한 개수
					if (
						myDetail[10 + i]['type'] == 'EgrpPysclQtyPop' &&
						(item[myDetail[10 + i]['valueNm']] == '' ||
							item[myDetail[10 + i]['valueNm']] == null)
					) {
						argCntCheck -= 1;
					}
					// ctgr 선택한 개수
					// if (
					// 	(myDetail[10 + i]['valueNm'] == 'ctgr1' ||
					// 		myDetail[10 + i]['valueNm'] == 'ctgr2') &&
					// 	(item[myDetail[10 + i]['valueNm']] == '' ||
					// 		item[myDetail[10 + i]['valueNm']] == null)
					// ) {
					// 	argCntCheck -= 1;
					// }
				}
				if (argCntCheck != item.argCnt) {
					alert('아규먼트 갯수와 총 선택한 물리량 갯수가 다릅니다.');
					validCheck = false;
				} else if (
					(item.warnStndVal == '' && item.careStndVal == '') ||
					(item.warnStndVal == null && item.careStndVal == null)
				) {
					alert(
						"'주의기준값' 또는 '경고기준값' 중 하나는 필수로 입력해 주세요.",
					);
					validCheck = false;
				} else {
					if (item.rowStat === 'I') {
						if (
							item.gdIdxNm == '' ||
							item.gdIdxNm == null ||
							item.eqpmGrpId == '' ||
							item.eqpmGrpId == null ||
							item.upTotMeth == '' ||
							item.upTotMeth == null ||
							item.pysclQtyId1 == '' ||
							item.pysclQtyId1 == null ||
							item.gdMeth == '' ||
							item.gdMeth == null ||
							item.alrmMsg == '' ||
							item.alrmMsg == null ||
							item.calcProc == '' ||
							item.calcProc == null
						) {
							alert('필수 입력값을 입력해주세요.');
							validCheck = false;
						}
					} else if (item.rowStat === 'U') {
						if (
							item.gdIdxId == '' ||
							item.gdIdxId == null ||
							item.gdIdxNm == '' ||
							item.gdIdxNm == null ||
							item.eqpmGrpId == '' ||
							item.eqpmGrpId == null ||
							item.upTotMeth == '' ||
							item.upTotMeth == null ||
							item.pysclQtyId1 == '' ||
							item.pysclQtyId1 == null ||
							item.gdMeth == '' ||
							item.gdMeth == null ||
							item.alrmMsg == '' ||
							item.alrmMsg == null ||
							item.calcProc == '' ||
							item.calcProc == null
						) {
							alert('필수 입력값을 입력해주세요.');
							validCheck = false;
						}
					}
				}
			}
			return validCheck;
		},
	},
};

const defaultData = {
	/* 검색옵션 */
	eqpmKindList: [],
	eqpmKindId: '',
	eqpmGrpList: [],
	eqpmGrpId: '',
	gdIdxNm: '',
	upTotMeth: '',
	upTotMethList: [],
	unit: '',
	unitList: [],
	//popup grid와 바인딩
	pyscPopValChg: '',
	calcProc: '',
	argCnt: null,
	// calcDesc: '',
	// pysclQtyId1: '',
	// pysclQtyId2: '',
	// pysclQtyId3: '',
	// pysclQtyId4: '',

	// 선택된 그룹코드 상세 데이터
	rowGridSelectKey: 0,
	rowGridSelectData: null,

	isFind: false, // true 경우 조회, 조회버튼도 이 값으로 연동 예정
	/* data 세팅 */
	// 로컬 gridName 값과 동일한 이름으로 세팅
	rowGrid: {
		data: [],
		column: [], // myColumns,
		option: {}, // myOptions
		defaultRow: {
			comId: '',
			gdIdxId: '',
			gdIdxNm: '',
			eqpmGrpId: '',
			upTotMeth: '',
			sortSeq: '',
			pysclQtyId1: '',
			pysclQtyId2: '',
			pysclQtyId3: '',
			pysclQtyId4: '',
			ctgr1: '',
			ctgr2: '',
			careStndVal: '',
			warnStndVal: '',
			gdMeth: '',
			useFg: '1',
			alrmMsg: '',
			calcProc: '',
			calcDesc: '',
			calcMeth: '',
			unit: '',
			argCnt: null,
			rowStat: null,
		},
		buttonAuth: {
			add: true,
			remove: true,
			save: true,
			excel: false,
		},
	},
};

const myDetail = [
	{
		type: 'InputText',
		label: '가이드',
		valueNm: 'gdIdxId',
		cols: 3,
		class: 'py-2',
		required: false,
		readonly: true,
		placeholder: '시스템 자동입력',
	},
	{
		type: 'InputText',
		label: '가이드 명',
		valueNm: 'gdIdxNm',
		disabled: false,
		cols: 6,
		labelCols: 2,
		textCols: 9,
		class: 'py-2',
		required: true,
	},
	{
		// 공백 처리
		type: 'Label',
		cols: 3,
		class: 'py-2',
		// label: "* '주의기준값' 또는 '경고기준값' 중 하나는 필수로 입력해 주세요.",
		disabled: false,
	},
	// {
	// 	type: 'CheckBox',
	// 	label: '설비기준적용',
	// 	valueNm: 'useFg',
	// 	disabled: false,
	// 	cols: 3,
	// 	class: 'py-2',
	// 	value: { '1': true, '0': false },
	// 	// required: true,
	// },
	{
		type: 'SelectBox',
		label: '설비그룹',
		valueNm: 'eqpmGrpId',
		disabled: false,
		cols: 3,
		class: 'py-2',
		list: 'eqpmGrpList',
		itemText: 'text',
		itemValue: 'value',
		required: true,
		readonly: true,
	},
	{
		type: 'SelectBox',
		label: '상위집계방법',
		valueNm: 'upTotMeth',
		disabled: false,
		cols: 3,
		class: 'py-2',
		list: 'upTotMethList',
		itemText: 'commCdNm',
		itemValue: 'commCd',
		required: true,
	},
	{
		type: 'SelectBox',
		label: '단위',
		valueNm: 'unit',
		disabled: false,
		cols: 3,
		class: 'py-2',
		list: 'unitList',
		itemText: 'commCdNm',
		itemValue: 'commCd',
		// required: true,
	},
	{
		type: 'InputText',
		label: '정렬순번',
		valueNm: 'sortSeq',
		cols: 3,
		class: 'py-2',
		// required: true,
	},
	// {
	// 	// 공백 처리
	// 	type: 'Label',
	// 	cols: 3,
	// 	class: 'py-2',
	// 	// label: "* '주의기준값' 또는 '경고기준값' 중 하나는 필수로 입력해 주세요.",
	// 	disabled: false,
	// },

	// {
	// 	type: 'InputText',
	// 	label: "가이드 명",
	// 	// valueNm: 'label',
	// 	disabled: false,
	// 	hideText: true,
	// 	cols: 1,
	// 	class: 'py-2',
	// 	required: true,
	// },
	// {
	// 	type: 'InputText',
	// 	valueNm: 'gdIdxNm',
	// 	disabled: false,
	// 	cols: 8,
	// 	textCols: 12,
	// 	class: 'py-2',
	// 	required: true,
	// },
	{
		type: 'EqpmCalcPop',
		labelContent: '계산코드',
		valueNm: 'calcProc', // textField 바인딩을 위해 필요
		valueNm2: 'argCnt',
		cols: 3,
		class: 'py-2',
		required: true,
		openMode: 'G',
		disabled: false,
		modalTitle: '계산코드',
	},
	{
		// 공백 처리
		type: 'Label',
		cols: 9,
		class: 'py-2',
		// label: "* '주의기준값' 또는 '경고기준값' 중 하나는 필수로 입력해 주세요.",
		disabled: false,
	},
	{
		type: 'InputText',
		label: '계산설명',
		valueNm: 'calcDesc',
		cols: 12,
		labelCols: 1,
		textCols: 11,
		class: 'py-2',
		// required: true,
	},
	{
		type: 'EgrpPysclQtyPop',
		labelContent: '물리량1',
		valueNm: 'pysclQtyId1', // textField 바인딩을 위해 필요
		popupSeq: 0,
		bindingItemList: {
			pysclQtyId1: 'pysclQtyId',
			pysclQtyNm1: 'pysclQtyNm',
		},
		// gridBindingList: ['pysclQtyId1','pysclQtyNm1'], // page의 grid 컬럼
		// popupBindingList: ['pysclQtyId','pysclQtyNm'], // popup의 grid 컬럼
		cols: 3,
		class: 'py-2',
		required: true,
		openMode: 'ALL',
		disabled: false,
		eqpmKindId: '',
		eqpmGrpId: '',
		closeBtnFg: true,
		selectBoxReadonly: true,
	},
	{
		type: 'EgrpPysclQtyPop',
		labelContent: '물리량2',
		valueNm: 'pysclQtyId2', // textField 바인딩을 위해 필요
		popupSeq: 1,
		bindingItemList: {
			pysclQtyId2: 'pysclQtyId',
			pysclQtyNm2: 'pysclQtyNm',
		},
		// gridBindingList: ['pysclQtyId2','pysclQtyNm2'],
		// popupBindingList: ['pysclQtyId','pysclQtyNm'],
		cols: 3,
		class: 'py-2',
		// required: true,
		openMode: 'ALL',
		disabled: false,
		eqpmKindId: '',
		eqpmGrpId: '',
		closeBtnFg: true,
		selectBoxReadonly: true,
	},
	{
		type: 'EgrpPysclQtyPop',
		labelContent: '물리량3',
		valueNm: 'pysclQtyId3', // textField 바인딩을 위해 필요
		popupSeq: 2,
		bindingItemList: {
			pysclQtyId3: 'pysclQtyId',
			pysclQtyNm3: 'pysclQtyNm',
		},
		// gridBindingList: ['pysclQtyId3','pysclQtyNm3'],
		// popupBindingList: ['pysclQtyId','pysclQtyNm'],
		cols: 3,
		class: 'py-2',
		// required: true,
		openMode: 'ALL',
		disabled: false,
		eqpmKindId: '',
		eqpmGrpId: '',
		closeBtnFg: true,
		selectBoxReadonly: true,
	},
	{
		type: 'EgrpPysclQtyPop',
		labelContent: '물리량4',
		valueNm: 'pysclQtyId4', // textField 바인딩을 위해 필요
		popupSeq: 3,
		bindingItemList: {
			pysclQtyId4: 'pysclQtyId',
			pysclQtyNm4: 'pysclQtyNm',
		},
		// gridBindingList: ['pysclQtyId4','pysclQtyNm4'],
		// popupBindingList: ['pysclQtyId','pysclQtyNm'],
		cols: 3,
		class: 'py-2',
		// required: true,
		openMode: 'ALL',
		disabled: false,
		eqpmKindId: '',
		eqpmGrpId: '',
		closeBtnFg: true,
		selectBoxReadonly: true,
	},

	{
		type: 'InputText',
		label: '카테고리1',
		valueNm: 'ctgr1',
		cols: 3,
		class: 'py-2',
		disabled: false,
	},
	{
		type: 'InputText',
		label: '카테고리2',
		valueNm: 'ctgr2',
		cols: 3,
		class: 'py-2',
		disabled: false,
	},
	{
		type: 'InputText',
		label: '주의기준값',
		valueNm: 'careStndVal',
		cols: 3,
		class: 'py-2',
		required: true,
		inputType: 'number',
	},
	{
		type: 'InputText',
		label: '경고기준값',
		valueNm: 'warnStndVal',
		cols: 3,
		class: 'py-2',
		required: true,
		inputType: 'number',
	},
	// {
	// 	// 공백 처리
	// 	type: 'Label',
	// 	cols: 6,
	// 	class: 'py-2',
	// 	// label: "* '주의기준값' 또는 '경고기준값' 중 하나는 필수로 입력해 주세요.",
	// 	disabled: false,
	// },
	// {
	// 	// 공백 처리
	// 	type: 'Label',
	// 	cols: 6,
	// 	class: 'py-2',
	// 	label: "* '주의기준값' 또는 '경고기준값' 중 하나는 필수로 입력해 주세요.",
	// 	disabled: false,
	// },
	{
		type: 'InputText',
		label: '가이드방법',
		valueNm: 'gdMeth',
		cols: 12,
		labelCols: 1,
		textCols: 11,
		class: 'py-2',
		required: true,
	},
	{
		type: 'InputText',
		label: '알람메세지',
		valueNm: 'alrmMsg',
		cols: 12,
		labelCols: 1,
		textCols: 11,
		class: 'py-2',
		required: true,
	},
];
</script>
<style lang="scss">
@import '@/assets/scss/common.scss';
</style>
