<template>
	<div class="l-layout">
		<!-- 조회조견 -->
		<v-row ref="searchFilter">
			<v-col :cols="12">
				<v-card class="searchFilter">
					<v-row align="center" no-gutters>
						<v-col :cols="2">
							<InputText
								:parentPrgmId="myPrgmId"
								label="배치ID"
								valueNm="batchId"
								:searchOption="true"
							/>
						</v-col>
						<v-col :cols="2">
							<InputText
								:parentPrgmId="myPrgmId"
								label="배치명"
								valueNm="batchNm"
								:searchOption="true"
							/>
						</v-col>
						<v-col :cols="3">
							<component
								:is="'selectCodeList'"
								:parentPrgmId="myPrgmId"
								:label="'배치 실행 구분'"
								:dataKey="'searchBatchExecTp'"
								:sendParam="{ commGrpCd: 'CO_BATCH_EXEC_TP', useFg: '1' }"
								:addAll="true"
							/>
						</v-col>
						<v-col :cols="3">
							<component
								:is="'selectCodeList'"
								:parentPrgmId="myPrgmId"
								:label="'사용여부'"
								:dataKey="'searchUseFg'"
								:sendParam="{ commGrpCd: 'CO_USEFG', useFg: '1' }"
							/>
						</v-col>
						<v-col :cols="2" class="text-right">
							<BtnSearch />
						</v-col>
					</v-row>
				</v-card>
			</v-col>
		</v-row>

		<v-row ref="contents">
			<!-- 배치 리스트 -->
			<v-col :cols="5" class="h100" style="height: calc(100vh - 180px);">
				<v-card class="pb-5">
					<div class="d-flex align-center justify-space-between pa-5">
						<!-- <v-card-title>
					     	<span class="tit ft-size_20 ft-weight_600">배치 리스트</span>
					    </v-card-title> -->
						<v-card-title class="pa-0"> 배치 리스트 </v-card-title>
						<!-- <v-card-actions> -->
						<Buttons
							:parentPrgmId="myPrgmId"
							:bindingData="gridName"
							:detailList="detailList"
							:btnActionsFnc="btnActions"
						/>
					</div>
					<div class="px-5" style="height:calc(100% - 70px);">
						<div ref="gridParent" class="h100 w100">
							<component
								:ref="gridName"
								:is="loadGrid ? 'Grid' : null"
								:parentPrgmId="myPrgmId"
								:gridName="gridName"
								@getRowsData="getRowData"
							/>
						</div>
						<!-- </v-card-actions> -->
					</div>
				</v-card>
			</v-col>
			<!-- 배치 상세 -->
			<v-col :cols="7" class="h100" style="height: calc(100vh - 180px);">
				<v-card class="pd-y-20 h100">
					<v-card-title class="d-flex justify-space-between align-end">
						<span class="tit ft-size_20 ft-weight_600">배치 상세</span>
					</v-card-title>
					<v-card-actions>
						<div
							ref="gridParent"
							class="w100"
							style="height: calc(100vh - 380px); padding-left:15px"
						>
							<component
								:is="'Form'"
								:parentPrgmId="myPrgmId"
								:detailList="detailList"
								@gridEditingFinish="gridEditingFinish"
								@inputClick="inputClick"
							/>
						</div>
					</v-card-actions>
				</v-card>
			</v-col>
			<v-dialog
				ref="popModal"
				v-model="dialog"
				width="700"
				overlay-color="#000"
				overlay-opacity="0.8"
				scrollable
			>
				<v-card style="height: 100%">
					<v-card-title
						class="v-card__title d-flex align-center justify-space-between"
					>
						<span class="custom-title-4">DB 프로시져 파라메터 설정</span>
						<div>
							<Buttons
								:parentPrgmId="myPrgmId"
								:bindingData="gridNameParam"
								:btnActionsFnc="btnActionsParam"
							/>
						</div>
					</v-card-title>
					<div class="pa-5">
						<v-row align="center" no-gutters>
							<v-col cols="12" class="text-right"> </v-col>
						</v-row>
					</div>
					<v-divider></v-divider>
					<v-card-text style="height: 300px;">
						<div id="gridParent" class="mt-6" style="height:calc(100% - 36px);">
							<div style="height:calc(100% - 36px);">
								<Grid
									:ref="gridNameParam"
									:is="paramLoadGrid && dialog ? 'Grid' : null"
									:gridName="gridNameParam"
									:parentPrgmId="myPrgmId"
									:editorGrid="true"
									@getRowsData="getGridNameParamRowData"
								/>
							</div>
						</div>
					</v-card-text>
					<v-divider></v-divider>
					<v-card-actions>
						<v-spacer></v-spacer>
						<v-btn color="primary" dark @click="setParamChangeData()"
							>확인</v-btn
						>
						<v-btn color="primary" dark @click="dialog = false">닫기</v-btn>
					</v-card-actions>
				</v-card>
			</v-dialog>
		</v-row>
	</div>
</template>
<script>
import mixinGlobal from '@/mixin/global.js';
import { resize } from '@/mixin/resize.js';
// import { mapState, mapMutations, mapActions } from "vuex";
import selectCodeList from '@/components/common/select/selectCodeList';
import InputText from '@/components/common/input/InputText';
import BtnSearch from '~/components/common/button/BtnSearch';
import Buttons from '~/components/common/button/Buttons';
import Grid from '~/components/common/Grid';
import Form from '~/components/common/form/Form';
import Utility from '~/plugins/utility';
import { mapActions } from 'vuex';

let myTitle;
//const myPrgmId = 'PRG0019';
let myPrgmId;
export default {
	mixins: [mixinGlobal, resize],
	asyncData(context) {
		const myState = context.store.state;
		myPrgmId = context.route.query.prgmId;
		context.store.commit('setActiveMenuInfo', myState.menuData[myPrgmId]);
		myTitle = myState.activeMenuInfo.menuNm;
		// console.log(myPrgmId, "asyncData = ", myState);
	},
	meta: {
		title: () => {
			return myTitle;
		},
		prgmId: myPrgmId,
		closable: true,
	},
	components: {
		selectCodeList,
		InputText,
		Form,
		Grid,
		BtnSearch,
		Buttons,
	},
	data() {
		return {
			myPrgmId: myPrgmId,
			loadGrid: false,
			gridName: 'rowGrid',
			// rowGridOrigin: [],
			detailList: myDetail,

			// 파라메터 셋팅용 변수
			dialog: false,
			gridNameParam: 'paramGrid',
			paramLoadGrid: false,
			selectedGridNameParamRow: null,
		};
	},
	computed: {
		// ...mapState({
		//   pageData: state => state.pageData[myPrgmId]
		// }),
		chkIsFind() {
			// 조회 플래그
			// console.log("조회 플래그 ", this.pageData.isFind);
			return this.pageData.isFind;
		},
		chkUseFg() {
			// 사용여부 선택 감지
			return this.pageData.searchUseFg;
		},
		chkBatchExecTp() {
			// 배치 실행 구분 선택 감지
			return this.pageData.searchBatchExecTp;
		},
		chkRowGridSelectKey() {
			return this.pageData.rowGridSelectKey;
		},
	},
	watch: {
		chkIsFind(val) {
			if (val) this.search();
		},
		chkUseFg() {
			this.setPageData({ isFind: true });
		},
		chkBatchExecTp() {
			this.setPageData({ isFind: true });
		},
	},
	async beforeCreate() {
		await this.$store.dispatch('chkOpenTabList', {
			key: 'create',
			prgmId: myPrgmId,
			defaultData: defaultData,
		});
		// console.log("3.vue::beforeCreate");
	},
	created() {
		this.getCodeList({
			dataKey: 'batchExecTp',
			params: { commGrpCd: 'CO_BATCH_EXEC_TP', useFg: '1' },
			addAll: false,
		}),
			this.getCodeList({
				dataKey: 'batchDupExecFg',
				params: { commGrpCd: 'CO_BATCH_DUP_EXEC_FG', useFg: '1' },
				addAll: false,
			});
	},
	mounted() {
		this.init();
	},
	beforeDestroy() {
		this.chkOpenTabList({ key: 'destroy', prgmId: myPrgmId });
	},
	methods: {
		...mapActions({
			getCodeList: 'modules/search/getCodeList',
		}),
		init() {
			// this.layoutInit();
			this.gridInit();
			this.gridParamInit();
		},
		// layoutInit() {
		//   console.log(">>>> 레이아웃 그리기");
		//   const searchFilterHeight = this.$refs.searchFilter.offsetHeight;
		//   this.$refs.contents.style.height = `calc(100% - ${searchFilterHeight}px)`;
		//   console.log(">>>> 레이아웃 그리기 끝");
		// },
		gridInit() {
			this.loadGrid = false;
			const gridHeight = this.$refs.gridParent.offsetHeight - 30;

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

			const _this = this;
			const myColumns = [
				{ header: '배치ID', name: 'batchId', align: 'center', width: 100 },
				{ header: '배치명', name: 'batchNm', minWidth: 200 },
				{
					header: '배치 실행 구분',
					name: 'batchExecTp',
					align: 'left',
					minWidth: 190,
					formatter({ value }) {
						let retVal = '';
						const newValue = _this.pageData.batchExecTpList.filter(
							item => item.commCd == value,
						);
						if (newValue.length > 0) {
							retVal = newValue[0].commCdNm;
						}
						return retVal;
					},
				},
				{ header: '배치 중복 여부', name: 'batchDupExecFg', hidden: true },
				{
					header: '사용여부',
					name: 'useFg',
					align: 'center',
					width: 145,
					formatter({ value }) {
						let retVal = '';
						const newValue = _this.pageData.searchUseFgList.filter(
							item => item.commCd == value,
						);
						if (newValue.length > 0) {
							retVal = newValue[0].commCdNm;
						}
						return retVal;
					},
				},
				{ header: '초', name: 'execCyclSecVal', hidden: true },
				{ header: '분', name: 'execCyclMinVal', hidden: true },
				{ header: '시', name: 'execCyclHhVal', hidden: true },
				{ header: '일', name: 'execCyclDdVal', hidden: true },
				{ header: '월', name: 'execCyclMmVal', hidden: true },
				{ header: '요일', name: 'execCyclWdayVal', hidden: true },
				{ header: '년', name: 'execCyclYyyyVal', hidden: true },
				{ header: '실행명령', name: 'execCmnd', hidden: true },
				{ header: '실행 명령 경로', name: 'execCmndPath', hidden: true },
				{ header: '후속배치', name: 'fllwBatchId', hidden: true },
				{ header: '참조값1', name: 'refVal1', hidden: true },
				{ header: '참조값2', name: 'refVal2', hidden: true },
				{ header: '참조값3', name: 'refVal3', hidden: true },
				{ header: '등록자NO', name: 'regUserNo', hidden: true },
				{ header: '등록일시', name: 'regDttm', hidden: true },
				{ header: '수정자NO', name: 'procUserNo', hidden: true },
				{ header: '수정일시', name: 'procDttm', hidden: true },
				{ header: 'rowStat', name: 'rowStat', hidden: true },
			];

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

			// this.getRowGridData();

			this.loadGrid = true;
		},
		async search() {
			// console.log("search");
			await this.getRowGridData();
			await this.setPageData({
				isFind: false,
			});
		},
		async getRowGridData() {
			const res = await this.postApiReturn({
				apiKey: 'selectBatchMng',
				resKey: 'batchMngData',
				sendParam: {
					useFg: this.pageData.searchUseFg,
					batchId: this.pageData.batchId, // 검색키워드: 배치ID
					batchNm: this.pageData.batchNm, // 검색키워드: 배치명
					batchExecTp: this.pageData.searchBatchExecTp, //배치 실행 구분
				},
			});
			const newRes = res.map(item => {
				const newObj = {
					...item,
					rowStat: null,
					fllwBatchId:
						item.fllwBatchId == undefined ? '없음' : item.fllwBatchId,
					useFg: item.useFg === '1' ? true : false, // 화면 개발 편의를 위해 boolean 타입으로 교체, 저장시 "1", "0" 으로 바꿔 보내야 함
				};
				return newObj;
			});

			// 엑셀 다운로드용 데이터 재정렬
			this.xlsDataBind(res);
			// this.rowGridOrigin = Utility.copyObj(newRes);
			// console.log("this.rowGridOrigin = ", this.rowGridOrigin);
			this.setGridData({
				gridKey: this.gridName,
				value: newRes,
			});

			this.$nextTick(() => {
				if (newRes.length > 0) {
					this.$refs[this.gridName].focus({
						//rowKey: 0,
						//rowKey: this.chkRowGridSelectKey || 0,
						rowKey:
							this.pageData.rowGridSelectKey == '' ||
							this.pageData.rowGridSelectKey == null
								? 0
								: this.pageData.rowGridSelectKey ==
								  this.$refs[this.gridName].getData().length - 1
								? this.pageData.rowGridSelectKey
								: 0,
						setScroll: true,
					});
				}
			});
		},
		async getRowData(data) {
			this.setPageData({
				rowGridSelectKey: data.rowKey,
				rowGridSelectData: data,
			});
			this.getFllwBatchList(data);
		},
		getGridNameParamRowData(data) {
			this.selectedGridNameParamRow = data.rowKey;
		},
		async getFllwBatchList(data) {
			this.pageData.fllwBatchIdList = await this.postApiReturn({
				apiKey: 'selectFllwBatchList',
				resKey: 'fllwBatchListData',
				sendParam: {
					//useFg: this.pageData.searchUseFg,
					batchId: data['batchId'], // 선택된 row의 batchId
				},
			});
		},
		compareData(type, newDt) {
			if (this.selectedCommCdData[type] == newDt) {
				return true;
			} else {
				return false;
			}
		},
		gridEditingFinish(data) {
			this.$refs[this.gridName].editingFinish(data);
		},
		async btnActions(action) {
			switch (action) {
				case 'add':
					let defaultRow = {
						batchId: null,
						batchNm: null,
						batchExecTp: 'BM',
						batchDupExecFg: 'Y',
						execCyclSecVal: null,
						execCyclMinVal: null,
						execCyclHhVal: null,
						execCyclDdVal: null,
						execCyclMmVal: null,
						execCyclWdayVal: null,
						execCyclYyyyVal: null,
						execCmnd: null,
						execCmndPath: null,
						fllwBatchId: '',
						refVal1: null,
						refVal2: null,
						refVal3: null,
						useFg: true,
						regUserNo: null,
						regDttm: null,
						procUserNo: null,
						procDttm: null,
						rowStat: null,
					};
					this.$refs[this.gridName].addRow(defaultRow);
					break;

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

				case 'save':
					var dataArr = this.$refs[this.gridName].save();
					var validCheck = true;
					if (dataArr.length > 0) {
						dataArr.filter(item => {
							if (item.rowStat === 'I') {
								if (
									item.batchNm == null ||
									item.execCyclSecVal == null ||
									item.execCyclMinVal == null ||
									item.execCyclHhVal == null ||
									item.execCyclDdVal == null ||
									item.execCyclMmVal == null ||
									item.execCyclWdayVal == null ||
									item.execCyclYyyyVal == null ||
									item.execCmnd == null ||
									item.execCmndPath == null ||
									item.refVal1 == null ||
									item.fllwBatchId == null ||
									item.fllwBatchId == ''
								) {
									alert('필수 입력값을 입력해주세요.');
									validCheck = false;
								}
							} else if (item.rowStat === 'U') {
								if (
									item.batchNm == '' ||
									item.execCyclSecVal == '' ||
									item.execCyclMinVal == '' ||
									item.execCyclHhVal == '' ||
									item.execCyclDdVal == '' ||
									item.execCyclMmVal == '' ||
									item.execCyclWdayVal == '' ||
									item.execCyclYyyyVal == '' ||
									item.execCmnd == '' ||
									item.execCmndPath == '' ||
									item.refVal1 == '' ||
									item.fllwBatchId == ''
								) {
									alert('필수 입력값을 입력해주세요.');
									validCheck = false;
								}
							}
							if (item.fllwBatchId == '없음') {
								item.fllwBatchId = null;
							}
						});
						// console.log(dataArr);
						if (validCheck) {
							const sendParam = {
								datas: {
									dsBatchMng: dataArr.map(item => ({
										...item,
										useFg: item.useFg ? '1' : '0',
									})),
								},
								params: {},
							};
							await this.postUpdateApi({
								apiKey: 'saveBatchMng',
								sendParam: sendParam,
							});
							this.setPageData({ isFind: true });
						}
					} else {
						alert('저장할 내용이 없습니다.');
					}
					break;

				default:
					break;
			}
		},
		async btnActionsParam(action) {
			let dataArr = [];
			switch (action) {
				case 'add':
					let defaultRow = {
						id: '',
						mode: 'in',
						type: 'str',
						val: '',
						rowStat: 'I',
					};
					this.$refs[this.gridNameParam].addRow(defaultRow);
					break;

				case 'remove':
					this.$refs[this.gridNameParam].removeRow(
						'immediately',
						this.selectedGridNameParamRow,
					);
					let gridData = this.$refs[this.gridNameParam].getData();
					if (gridData.length > 0) {
						try {
							this.$refs[this.gridNameParam].focus({
								rowKey: gridData[0].rowKey,
								setScroll: true,
							});
						} catch (error) {
							console.log('error[nextTick grid] : ', error);
						}
					}
					break;

				default:
					break;
			}
		},
		gridParamInit() {
			const gridHeight = this.$refs.gridParent.offsetHeight - 36;
			const myOptions = {
				columnOptions: {
					resizable: true,
				},
				bodyHeight: gridHeight,
				minBodyHeight: gridHeight,
				selectionUnit: 'row',
				editingEvent: 'click',
				scrollX: false,
			};
			this.setGridOption({
				gridKey: this.gridNameParam,
				value: myOptions,
			});
			setTimeout(() => {});

			let modeList = [];
			const modeIn = { text: 'IN', value: 'IN' };
			const modeOut = { text: 'OUT', value: 'OUT' };
			modeList.push(modeIn);
			modeList.push(modeOut);
			let typeList = [];
			const typeInt = { text: 'INT', value: 'int' };
			const typeStr = { text: 'STRING', value: 'str' };
			const typeFunc = { text: 'FUNCTION', value: 'function' };
			typeList.push(typeInt);
			typeList.push(typeStr);
			typeList.push(typeFunc);

			const myColumns = [
				{ header: 'ID', name: 'id', editor: 'text' },
				{
					header: 'MODE',
					name: 'mode',
					align: 'center',
					formatter({ value }) {
						return value == ('OUT' || 'out') ? 'OUT' : 'IN';
					},
					editor: {
						type: 'select',
						options: {
							listItems: modeList,
						},
					},
				},
				{
					header: 'Type',
					name: 'type',
					align: 'center',
					formatter({ value }) {
						let retVal = '';
						switch (value) {
							case 'int':
								retVal = 'INT';
								break;
							case 'str':
								retVal = 'STRING';
								break;
							case 'function':
								retVal = 'FUNCTION';
								break;
						}
						return retVal;
					},
					editor: {
						type: 'select',
						options: {
							listItems: typeList,
						},
					},
				},
				{ header: '값', name: 'val', editor: 'text' },
				{ header: 'rowStat', name: 'rowStat', hidden: true },
			];

			this.setGridColumn({
				gridKey: this.gridNameParam,
				value: myColumns,
			});
			this.getRowParamData();
		},
		getRowParamData() {
			this.paramLoadGrid = false;
			let res = [];

			/* this.pageData.paramStrData 처리 */
			// console.log("this.pageData.paramStrData : ", JSON.parse(this.pageData.paramStrData));
			let rowData = {};
			if (
				this.pageData.paramStrData.startsWith('{') &&
				this.pageData.paramStrData.endsWith('}')
			) {
				rowData = JSON.parse(this.pageData.paramStrData);
			}
			var keys = Object.keys(rowData); //키를 가져옵니다. 이때, keys 는 반복가능한 객체가 됩니다.
			for (var i = 0; i < keys.length; i++) {
				var key = keys[i];
				res.push(rowData[key]);
			}

			const newRes = res.map(item => {
				const newObj = {
					...item,
					rowStat: null,
					id: item.id || '',
					mode: item.mode || 'in',
					type: item.type || 'str',
					val: item.val || '',
				};
				return newObj;
			});

			this.setGridData({
				gridKey: this.gridNameParam,
				value: newRes,
			});
			this.$nextTick(() => {
				if (newRes.length > 0) {
					try {
						this.$refs[this.gridNameParam].focus({
							//rowKey: 0,
							rowKey: 0,
							setScroll: true,
						});
					} catch (error) {
						console.log('error[nextTick grid] : ', error);
					}
				}
			});
			this.paramLoadGrid = true;
		},
		xlsDataBind(res) {
			const xlsRowData = res.map(item => {
				var retVal;
				const newValue = this.pageData.batchExecTpList.filter(
					batchItem => batchItem.commCd == item.batchExecTp,
				);
				if (newValue.length > 0) {
					retVal = newValue[0].commCdNm;
				}
				const obj = {
					...item,
					useFg: item.useFg == '1' ? '사용' : '사용안함',
					batchExecTp: retVal,
				};
				return obj;
			});
			this.setPageData({
				xlsFileInfo: {
					[this.gridName]: {
						rowData: xlsRowData,
					},
				},
			});
		},
		inputClick(event, item, valueNm) {
			if (valueNm == 'refVal1') {
				const rowIdxKey = this.$refs[this.gridName].gridInstance.invoke(
					'getFocusedCell',
				).rowKey;
				const selectRowData = this.$refs[this.gridName].gridInstance.invoke(
					'getRow',
					rowIdxKey,
				);

				if (selectRowData.batchExecTp == 'DP') {
					// 여기에 팝업 레이어 띠우기 기능 추가
					this.pageData.paramStrData = event.target.value;
					this.pageData.paramChangeDataTarget = event.target;
					this.getRowParamData();
					this.dialog = true;
				}
			}
		},
		setParamChangeData() {
			let dataArr = [];
			let retVal = {};
			// editing 중 확인 버튼 클릭 시 editingFinish 주기
			if (this.selectedGridNameParamRow != null) {
				this.$refs[this.gridNameParam].editingFinish({
					rowKey: this.selectedGridNameParamRow,
				});
			}

			dataArr = this.$refs[this.gridNameParam].getData();
			for (var i = 1; i <= dataArr.length; i++) {
				const tmpRow = dataArr[i - 1];
				let retRow = {};
				retRow['id'] = tmpRow['id'];
				retRow['mode'] = tmpRow['mode'];
				retRow['type'] = tmpRow['type'];
				retRow['val'] = tmpRow['val'];

				retVal[i] = retRow;
			}

			// console.log("setParamChangeData retVal : ", retVal);
			// console.log("setParamChangeData retVal str : ", JSON.stringify(retVal));
			// this.pageData.paramChangeDataTarget.value = JSON.stringify(retVal);
			this.dialog = false;
			// console.log(this.pageData.rowGrid.data[this.pageData.rowGridSelectKey]);
			// this.pageData.rowGrid.data[this.pageData.rowGridSelectKey]["refVal1"] = JSON.stringify(retVal);
			// console.log('this.pageData.paramStrDat', this.pageData.paramStrDat);
			// console.log('JSON.stringify(retVal)',JSON.stringify(retVal));
			if (this.pageData.paramStrData != JSON.stringify(retVal)) {
				// 변경 내용이 있을경우만 수정 처리
				const dt1 = {
					columnName: 'refVal1',
					value: JSON.stringify(retVal),
					// rowKey: this.pageData.rowGrid.data[this.pageData.rowGridSelectKey].rowKey,
					rowKey: this.pageData.rowGridSelectKey,
				};
				this.gridParamEditingFinish(dt1);
				this.$refs[this.gridName].focusChangeEvt(dt1);
			}
		},
		gridParamEditingFinish(data) {
			this.$refs[this.gridName].editingFinish(data);
		},
	},
};

const defaultData = {
	/* 검색옵션 */
	searchUseFg: '1',
	searchBatchExecTp: false,
	searchUseFgList: [],
	searchBatchExecTpList: [],
	batchId: '',
	batchNm: '',

	batchExecTpList: [],
	batchDupExecFgList: [],
	fllwBatchIdList: [],
	isFind: false, // true 경우 조회, 조회버튼도 이 값으로 연동 예정

	/* 파라메터 설정요 변수 */
	/* { "1": {"id": "comId", "type": "str", "val": "COM01"},  
       "2": {"id": "toStrDt", "type": "function", "val": "DATE_FORMAT(NOW(), '%Y%h%d')"},  
       "3": {"id": "userId", "type": "str", "val": "3"},  
       "4": {"id": "retCd", "mode":"OUT","type": "int", "val": "-1"},  
       "5": {"id": "retMsg", "mode":"OUT","type": "str", "val": "전달"}} */
	paramStrData: '',
	paramChangeDataStr: '',
	paramChangeDataTarget: null,
	paramGrid: {
		data: [],
		column: [], // myColumns,
		option: {}, // myOptions
		defaultRow: {
			id: '',
			mode: 'in',
			type: 'str',
			val: '',
			rowStat: null,
		},
		buttonAuth: {
			add: true,
			remove: true,
			save: false,
			excel: false,
		},
	},

	/* data 세팅 */
	rowGrid: {
		data: [],
		column: [], // myColumns,
		option: {}, // myOptions
		defaultRow: {
			batchId: null,
			batchNm: null,
			batchExecTp: 'BM',
			batchDupExecFg: 'Y',
			execCyclSecVal: null,
			execCyclMinVal: null,
			execCyclHhVal: null,
			execCyclDdVal: null,
			execCyclMmVal: null,
			execCyclWdayVal: null,
			execCyclYyyyVal: null,
			execCmnd: null,
			execCmndPath: null,
			fllwBatchId: '',
			refVal1: null,
			refVal2: null,
			refVal3: null,
			useFg: true,
			regUserNo: null,
			regDttm: null,
			procUserNo: null,
			procDttm: null,
			rowStat: null,
		},
		buttonAuth: {
			add: true,
			remove: true,
			save: true,
			excel: true,
		},
	},
	rowGridSelectKey: 0,
	rowGridSelectData: null,
	rowGridModify: false,

	xlsFileInfo: {
		// 출력하려는 grid 와 같은 이름으로 세팅
		rowGrid: {
			rowData: [],
			// 엑셀변환시 데이타 가공이 추가로 필요하게 된다면 여기에 가공된 rowData 를 넣어야 할듯
			fileName: null, // 갑이 없으면 해당 페이지 메뉴명
			sheetName: null, //  갑이 없으면 'Sheet1'
		},
	},
};

const myDetail = [
	{
		type: 'InputText',
		label: '배치ID',
		valueNm: 'batchId',
		readonly: true,
		cols: 6,
		class: 'py-2',
		required: false,
		placeholder: '시스템 자동입력',
	},
	{
		type: 'InputText',
		label: '배치명',
		valueNm: 'batchNm',
		cols: 6,
		class: 'py-2',
		required: true,
	},
	{
		type: 'SelectBox',
		label: '배치 실행 구분',
		valueNm: 'batchExecTp',
		cols: 6,
		class: 'py-2',
		list: 'batchExecTpList',
		itemText: 'commCdNm',
		itemValue: 'commCd',
		required: true,
	},
	{
		type: 'SelectBox',
		label: '배치 중복 여부',
		valueNm: 'batchDupExecFg',
		cols: 6,
		class: 'py-2',
		list: 'batchDupExecFgList',
		itemText: 'commCdNm',
		itemValue: 'commCd',
		required: true,
	},
	{
		type: 'InputText',
		label: '실행주기(초)',
		valueNm: 'execCyclSecVal',
		cols: 6,
		class: 'py-2',
		required: true,
	},
	{
		type: 'InputText',
		label: '실행주기(분)',
		valueNm: 'execCyclMinVal',
		cols: 6,
		class: 'py-2',
		required: true,
	},
	{
		type: 'InputText',
		label: '실행주기(시)',
		valueNm: 'execCyclHhVal',
		cols: 6,
		class: 'py-2',
		required: true,
	},
	{
		type: 'InputText',
		label: '실행주기(일)',
		valueNm: 'execCyclDdVal',
		cols: 6,
		class: 'py-2',
		required: true,
	},
	{
		type: 'InputText',
		label: '실행주기(월)',
		valueNm: 'execCyclMmVal',
		cols: 6,
		class: 'py-2',
		required: true,
	},
	{
		type: 'InputText',
		label: '실행주기(요일)',
		valueNm: 'execCyclWdayVal',
		cols: 6,
		class: 'py-2',
		required: true,
	},
	{
		type: 'InputText',
		label: '실행주기(년)',
		valueNm: 'execCyclYyyyVal',
		cols: 6,
		class: 'py-2',
		required: true,
	},
	{
		type: 'SelectBox',
		label: '후속배치',
		valueNm: 'fllwBatchId',
		cols: 6,
		class: 'py-2',
		list: 'fllwBatchIdList',
		itemText: 'batchIdNm',
		itemValue: 'batchId',
		required: true,
	},
	{
		type: 'InputText',
		label: '실행명령',
		valueNm: 'execCmnd',
		cols: 6,
		class: 'py-2',
		required: true,
	},
	{
		type: 'InputText',
		label: '실행 명령 경로',
		valueNm: 'execCmndPath',
		cols: 6,
		class: 'py-2',
		required: true,
	},
	{
		type: 'InputText',
		label: '참조값1',
		valueNm: 'refVal1',
		cols: 6,
		class: 'py-2',
		required: true,
	},
	{
		type: 'InputText',
		label: '참조값2',
		valueNm: 'refVal2',
		cols: 6,
		class: 'py-2',
	},
	{
		type: 'InputText',
		label: '참조값3',
		valueNm: 'refVal3',
		cols: 6,
		class: 'py-2',
	},
	{
		type: 'CheckBox',
		label: '사용여부',
		valueNm: 'useFg',
		cols: 6,
		class: 'py-2',
		value: { '1': true, '0': false },
		required: true,
	},
	{
		type: 'InputText',
		label: '등록자NO',
		valueNm: 'regUserNo',
		disabled: true,
		cols: 6,
		class: 'py-2',
		placeholder: '시스템 자동입력',
	},
	{
		type: 'InputText',
		label: '등록일시',
		valueNm: 'regDttm',
		disabled: true,
		cols: 6,
		class: 'py-2',
		placeholder: '시스템 자동입력',
	},
	{
		type: 'InputText',
		label: '수정자NO',
		valueNm: 'procUserNo',
		disabled: true,
		cols: 6,
		class: 'py-2',
		placeholder: '시스템 자동입력',
	},
	{
		type: 'InputText',
		label: '수정일시',
		valueNm: 'procDttm',
		disabled: true,
		cols: 6,
		class: 'py-2',
		placeholder: '시스템 자동입력',
	},
];
</script>
<style lang="scss">
@import '@/assets/scss/common.scss';
</style>
