gitadmin/sk_fems_ui
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Update screen 30, 13, 22

Browse Source
This commit is contained in:
dev
2025-07-31 11:31:53 +09:00
parent 1faf49056d
commit 58bb7f915c
16 changed files with 436 additions and 747 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
pages/comm/auth/MenuMngPage.vue
View File

@ -1,6 +1,7 @@
<template>
<div class="l-layout">
<v-row ref="searchFilter">
<common-page-title />
<v-row ref="searchFilter" class="mt-2">
<v-col :cols="12">
<v-card class="searchFilter">
<v-row align="end" no-gutters>
@ -34,7 +35,7 @@
<div class="h100 px-4" style="height:calc(100% - 70px)">
<div ref="treeGridParent" class="w100 h100">
<component :ref="gridName + myPrgmId" :is="loadTree ? 'Grid' : null" :gridName="gridName"
:parentPrgmId="myPrgmId" @getRowsData="getRowData" :dataPath="dataPathExample" />
:parentPrgmId="myPrgmId" @getRowsData="getRowData" />
</div>
</div>
</v-card>
@ -91,21 +92,9 @@ export default {
return {
myPrgmId: myPrgmId,
gridName: 'treeGrid',
loadTree: true,
loadTree: false,
detailList: myDetail,
addRowFg: false,
dataPathExample: {
"treeGrid": {
data: sampleData,
column: [
{ header: '메뉴명', name: 'menuNm' },
{ header: 'prgmId ', name: 'prgmId', hidden: true },
{ header: 'sysDivCd ', name: 'sysDivCd', hidden: true },
],
option: myOptions,
}
}
};
},
computed: {
@ -166,6 +155,10 @@ export default {
name: 'menuNm',
},
scrollX: false,
header: {
height: 37,
},
rowHeight: 37,
};
this.setGridOption({
gridKey: this.gridName,

292
pages/comm/base/BatchMngPage.vue
View File

@ -1,7 +1,8 @@
<template>
<div class="l-layout">
<!-- 조회조견 -->
<v-row ref="searchFilter">
<common-page-title />
<v-row ref="searchFilter" class="mt-2">
<v-col :cols="12">
<v-card class="searchFilter">
<v-row align="end" no-gutters>
@ -24,7 +25,7 @@
:customClass="'select-large'"
/>
</v-col>
<v-col :cols="2.5">
<v-col :cols="2.5" class="pr-4">
<component
:is="'selectCodeList'"
:parentPrgmId="myPrgmId"
@ -34,7 +35,7 @@
:customClass="'select-large'"
/>
</v-col>
<BtnSearch size="large" />
<BtnSearch size="large" class="mr-2" />
</v-row>
</v-card>
@ -57,7 +58,7 @@
<div class="px-4">
<div ref="gridParent" class="h100 w100">
<component :ref="gridName" :is="loadGrid ? 'Grid' : null" :parentPrgmId="myPrgmId"
:gridName="gridName" @getRowsData="getRowData" :dataPath="dataPathExample" />
:gridName="gridName" @getRowsData="getRowData" />
</div>
<!-- </v-card-actions> -->
</div>
@ -77,7 +78,7 @@
</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-dialog ref="popModal" v-model="dialog" width="800" 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>
@ -91,7 +92,6 @@
<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);">
@ -101,7 +101,6 @@
</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>
@ -155,76 +154,16 @@ export default {
data() {
return {
myPrgmId: myPrgmId,
loadGrid: true,
loadGrid: false,
gridName: 'rowGrid',
dataPathExample: {
"rowGrid": {
data: [
{
"batchId": "BATCH001",
"batchNm": "일일 데이터 백업",
"batchExecTp": "자동 실행",
"batchDupExecFg": "N",
"useFg": "사용"
},
{
"batchId": "BATCH002",
"batchNm": "월간 리포트 생성",
"batchExecTp": "수동 실행",
"batchDupExecFg": "Y",
"useFg": "사용"
},
{
"batchId": "BATCH003",
"batchNm": "로그 정리 작업",
"batchExecTp": "자동 실행",
"batchDupExecFg": "N",
"useFg": "미사용"
},
{
"batchId": "BATCH004",
"batchNm": "사용자 통계 수집",
"batchExecTp": "예약 실행",
"batchDupExecFg": "Y",
"useFg": "사용"
},
{
"batchId": "BATCH005",
"batchNm": "서버 상태 점검",
"batchExecTp": "수동 실행",
"batchDupExecFg": "N",
"useFg": "미사용"
}
]
,
column: [
{ header: '배치ID', name: 'batchId', align: 'center', width: 100 },
{ header: '배치명', name: 'batchNm', minWidth: 200 },
{
header: '배치 실행 구분',
name: 'batchExecTp',
align: 'left',
minWidth: 190,
},
{ header: '배치 중복 여부', name: 'batchDupExecFg', hidden: true },
{
header: '사용여부',
name: 'useFg',
align: 'center',
width: 145,
},
],
}
},
// rowGridOrigin: [],
detailList: myDetail,
// 파라메터 셋팅용 변수
dialog: false,
gridNameParam: 'paramGrid',
paramLoadGrid: true,
paramLoadGrid: false,
selectedGridNameParamRow: null,
};
},
@ -292,7 +231,7 @@ export default {
}),
init() {
// this.layoutInit();
// this.gridInit();
this.gridInit();
this.gridParamInit();
},
// layoutInit() {
@ -309,6 +248,10 @@ export default {
columnOptions: {
resizable: true,
},
header: {
height: 37,
},
rowHeight: 37,
};
this.setGridOption({
gridKey: this.gridName,
@ -384,7 +327,7 @@ export default {
},
async search() {
// console.log("search");
// await this.getRowGridData();
await this.getRowGridData();
await this.setPageData({
isFind: false,
});
@ -629,20 +572,20 @@ export default {
gridKey: this.gridNameParam,
value: myOptions,
});
// setTimeout(() => { });
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);
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' },
@ -664,27 +607,27 @@ export default {
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,
// },
// },
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 },
@ -703,86 +646,49 @@ export default {
// /* 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]);
// }
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;
// });
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;
});
const newRes = [
{
"id": "VAR001",
"mode": "OUT",
"type": "int",
"val": "100",
"rowStat": "C"
},
{
"id": "VAR002",
"mode": "IN",
"type": "str",
"val": "Hello World",
"rowStat": "U"
},
{
"id": "FUNC001",
"mode": "out",
"type": "function",
"val": "calculateSum()",
"rowStat": "C"
},
{
"id": "VAR003",
"mode": "IN",
"type": "int",
"val": "42",
"rowStat": "D"
},
{
"id": "VAR004",
"mode": "OUT",
"type": "str",
"val": "Sample Text",
"rowStat": "C"
}
];
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.$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) {
@ -812,21 +718,21 @@ export default {
inputClick(event, item, valueNm) {
if (valueNm == 'refVal1') {
this.dialog = true;
// const rowIdxKey = this.$refs[this.gridName].gridInstance.invoke(
// 'getFocusedCell',
// ).rowKey;
// const selectRowData = this.$refs[this.gridName].gridInstance.invoke(
// 'getRow',
// rowIdxKey,
// );
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;
// }
if (selectRowData.batchExecTp == 'DP') {
// 여기에 팝업 레이어 띠우기 기능 추가
this.pageData.paramStrData = event.target.value;
this.pageData.paramChangeDataTarget = event.target;
this.getRowParamData();
this.dialog = true;
}
}
},
setParamChangeData() {

268
pages/comm/base/CalendarMngPage.vue
View File

@ -1,6 +1,7 @@
<template>
<div class="l-layout">
<v-row ref="searchFilter">
<common-page-title />
<v-row ref="searchFilter" class="mt-2">
<v-col :cols="12">
<v-card class="searchFilter">
<v-row align="end" no-gutters>
@ -20,28 +21,29 @@
</v-col>
</v-row>
<v-row ref="contents" id="CalendarMngContent" class="mt-4">
<v-col cols="12" lg="4" class="h100 pr-2">
<v-col cols="12" lg="4" class=" pr-2">
<v-card class="w100">
<v-card-title class="d-flex justify-space-between align-center">
<span class="custom-title-4">캘린더 리스트</span>
<Buttons :parentPrgmId="myPrgmId" :bindingData="gridName" :btnActionsFnc="btnActions" />
</v-card-title>
<v-card-actions class="pt-0 px-5 pb-5" :style="{ height: 'calc(100% - 72.56px)' }">
<v-card-actions class="pt-0 px-5 pb-5" :style="{ height: 'calc(100% - 10px)' }">
<div ref="gridParent" class="w100 h100">
<component class="w100" :ref="gridName + myPrgmId" :is="loadGrid ? 'Grid' : null"
:gridName="gridName" :parentPrgmId="myPrgmId" :editorGrid="true"
@getRowsData="getRowData" :dataPath="dataPathExample" />
@getRowsData="getRowData" />
</div>
</v-card-actions>
</v-card>
</v-col>
<v-col cols="12" lg="8" class="h100 pl-3">
<v-col cols="12" lg="8" class=" pl-3">
<v-card>
<v-card-title>
<span class="custom-title-4">캘린더 미리보기</span>
</v-card-title>
<v-card-actions class="px-5 d-block" :style="{ height: 'calc(100% - 62px)' }">
<Calendar :parentPrgmId="myPrgmId" :gridName="gridName" :headerVisible="false" />
<v-card-actions class="px-5 d-block" >
<Calendar :parentPrgmId="myPrgmId" :gridName="gridName" :headerVisible="false"
:showTitle="false" />
</v-card-actions>
</v-card>
</v-col>
@ -94,81 +96,7 @@ export default {
return {
myPrgmId: myPrgmId,
gridName: 'rowGrid',
loadGrid: true,
dataPathExample: {
"rowGrid": {
data: [
{
"hldyFg": "평일",
"hldyNm": ""
},
{
"dt": "2025-07-23",
"dtNm": "수요일",
"dt": "2025-07-21",
"dtNm": "월요일",
"hldyFg": "평일",
"hldyNm": ""
},
{
"dt": "2025-07-22",
"dtNm": "화요일",
"hldyFg": "평일",
"hldyNm": ""
},
{
"dt": "2025-07-24",
"dtNm": "목요일",
"hldyFg": "평일",
"hldyNm": ""
},
{
"dt": "2025-07-25",
"dtNm": "금요일",
"hldyFg": "평일",
"hldyNm": ""
},
{
"dt": "2025-07-26",
"dtNm": "토요일",
"hldyFg": "주말",
"hldyNm": ""
},
{
"dt": "2025-07-27",
"dtNm": "일요일",
"hldyFg": "휴일",
"hldyNm": "정기휴일"
}
],
column: [
{
header: '일자',
name: 'dt',
align: 'center',
// formatter({ value }) {
// return value.split(' ')[0];
// },
},
{
header: '요일',
name: 'dtNm',
align: 'center',
// formatter({ value }) {
// return value + '요일';
// },
},
{
header: '구분',
name: 'hldyFg',
align: 'center',
essential: true,
},
{ header: '휴일명', name: 'hldyNm', editor: 'text' },
],
}
},
loadGrid: false,
rowKey: null,
edtingFinishFlag: 'Y',
};
@ -241,16 +169,19 @@ export default {
await this.gridInit();
},
async search() {
// await this.getRowGridData();
await this.getRowGridData();
},
async gridInit() {
// const gridHeight = this.$refs.gridParent.offsetHeight - 30;
// this.setGridOption({
// gridKey: this.gridName,
// value: Object.assign(Utility.defaultGridOption(gridHeight), {
// scrollX: false,
// }),
// });
const gridHeight = this.$refs.gridParent.offsetHeight - 30;
this.setGridOption({
gridKey: this.gridName,
value: Object.assign(Utility.defaultGridOption(gridHeight), {
scrollX: false, header: {
height: 37,
},
rowHeight: 37,
}),
});
// this.getRowGridData();
},
@ -350,86 +281,86 @@ export default {
this.loadGrid = false;
// let res = await this.postApiReturn({
// apiKey: 'selectWorkCald',
// resKey: 'workcaldData',
// sendParam: {
// blocId: this.pageData.blocMstrList[this.chkBlocCd].blocId,
// yymm: this.chkFromDt,
// comId: this.comId,
// },
// });
let res = await this.postApiReturn({
apiKey: 'selectWorkCald',
resKey: 'workcaldData',
sendParam: {
blocId: this.pageData.blocMstrList[this.chkBlocCd].blocId,
yymm: this.chkFromDt,
comId: this.comId,
},
});
// let res2 = await this.postApiReturn({
// apiKey: 'selectWorkCaldDetl',
// resKey: 'workcaldDetlData',
// sendParam: {
// blocId: this.pageData.blocMstrList[this.chkBlocCd].blocId,
// yymm: this.chkFromDt,
// comId: this.comId,
// },
// });
let res2 = await this.postApiReturn({
apiKey: 'selectWorkCaldDetl',
resKey: 'workcaldDetlData',
sendParam: {
blocId: this.pageData.blocMstrList[this.chkBlocCd].blocId,
yymm: this.chkFromDt,
comId: this.comId,
},
});
// for (var i = 0; i < res2.length; i++) {
// if (
// !(
// res2[i].hldyNm == null ||
// res2[i].hldyNm == '토요일' ||
// res2[i].hldyNm == '일요일'
// )
// ) {
// for (var j = i + 1; j < res2.length; j++) {
// if (res2[i].hldyNm == res2[j].hldyNm) {
// res2[i].hldyNm = '';
// }
// }
// }
// }
for (var i = 0; i < res2.length; i++) {
if (
!(
res2[i].hldyNm == null ||
res2[i].hldyNm == '토요일' ||
res2[i].hldyNm == '일요일'
)
) {
for (var j = i + 1; j < res2.length; j++) {
if (res2[i].hldyNm == res2[j].hldyNm) {
res2[i].hldyNm = '';
}
}
}
}
// res = res.map(item => {
// const dt = this.$dayjs(item.dt.split(' ')[0]); // YYYY-MM-DD
// const dtNm = dt.format('ddd'); // 요일
// const newItem = {
// ...item,
// dtNm: dtNm,
// hldyNm: item.hldyNm ? item.hldyNm : '',
// rowStat: null,
// };
// return newItem;
// });
res = res.map(item => {
const dt = this.$dayjs(item.dt.split(' ')[0]); // YYYY-MM-DD
const dtNm = dt.format('ddd'); // 요일
const newItem = {
...item,
dtNm: dtNm,
hldyNm: item.hldyNm ? item.hldyNm : '',
rowStat: null,
};
return newItem;
});
// this.loadGrid = true;
// this.setPageData({ isFind: false });
this.loadGrid = true;
this.setPageData({ isFind: false });
// this.setGridColumn({
// gridKey: this.gridName,
// value: myColumns,
// });
this.setGridColumn({
gridKey: this.gridName,
value: myColumns,
});
// this.setGridData({
// gridKey: this.gridName,
// value: res,
// });
this.setGridData({
gridKey: this.gridName,
value: res,
});
// this.setPageData({ planData: res2 });
this.setPageData({ planData: res2 });
// // 첫번째 row 선택상태
// this.$nextTick(() => {
// this.$refs[this.gridName + this.myPrgmId].focus({
// //rowKey: 0,
// rowKey:
// this.pageData.rowGridSelectKey == '' ||
// this.pageData.rowGridSelectKey == null
// ? 0
// : this.pageData.rowGridSelectKey ==
// this.$refs[this.gridName + this.myPrgmId].getData().length - 1
// ? this.pageData.rowGridSelectKey
// : 0,
// columnName: 'dt',
// setScroll: true,
// });
// this.setPageData({ isFind: false });
// });
// 첫번째 row 선택상태
this.$nextTick(() => {
this.$refs[this.gridName + this.myPrgmId].focus({
//rowKey: 0,
rowKey:
this.pageData.rowGridSelectKey == '' ||
this.pageData.rowGridSelectKey == null
? 0
: this.pageData.rowGridSelectKey ==
this.$refs[this.gridName + this.myPrgmId].getData().length - 1
? this.pageData.rowGridSelectKey
: 0,
columnName: 'dt',
setScroll: true,
});
this.setPageData({ isFind: false });
});
},
async getRowData(data, gridName) {
this.setGridSelectData({
@ -604,4 +535,17 @@ select.selectbox {
border-width: 0px;
// box-sizing: border-box;
}
::v-deep {
.custom-vc-calender {
.vc-header {
display: none;
}
.vc-weeks {
padding: 0;
}
}
}
</style>