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

init dev-push code ui base design

Browse Source
This commit is contained in:
leonard
2025-07-22 09:58:38 +07:00
parent ffdf5ccb66
commit eedbf94d56
214 changed files with 42170 additions and 28040 deletions
Download Patch File Download Diff File Expand all files Collapse all files

238
components/common/modal/EqpmCalcPop.vue
View File

@ -1,96 +1,76 @@
<template>
<v-row class="search-box" align="center" no-gutters>
<v-col :cols="option.labelCols">
<v-col :cols="option.labelCols" class="py-0">
<label for="" class="search-box-label">
<v-icon
x-small
:color="item.required ? '#fb8200' : 'primary'"
class="mr-1"
>mdi-record-circle</v-icon
v-if="iconShow"
small
:class="['mr-1', required ? 'icon-orange' : 'icon-blue']"
>$icoBulletPoint</v-icon
>
{{ option.labelContent }}
</label>
</v-col>
<v-col :cols="option.textCols">
<v-text-field
:readonly="item.readonly || false"
v-model="selectValue"
append-icon="mdi-magnify"
class="v-input__custom"
@click="dialogOpenCloseEvent(dialog)"
outlined
:hide-details="true"
:required="item.required || false"
:disabled="item.disabled || false"
></v-text-field>
</v-col>
<v-text-field :readonly="item.readonly || false" v-model="selectValue" append-icon=""
class="v-input__custom" @click="dialogOpenCloseEvent(dialog)" outlined :hide-details="true"
:required="item.required || false" :disabled="item.disabled || false"><template v-slot:append>
<!-- Custom SVG icon -->
<v-icon>$icoSearch</v-icon>
<v-dialog v-model="dialog" scrollable width="540px">
</template></v-text-field>
</v-col>
<v-dialog v-model="dialog" scrollable width="800px">
<v-card style="height: 100%">
<v-card-title class="pa-5 d-flex align-center justify-space-between">
<v-card-title class="px-6 py-4 d-flex align-center justify-space-between">
<span class="custom-title-4">{{ option.modalTitle }}</span>
<v-btn
icon
tile
:ripple="false"
@click="dialogOpenCloseEvent(dialog)"
>
<v-icon>mdi-close</v-icon>
</v-btn>
<a-button icon="close" type="text" @click="dialogOpenCloseEvent(dialog)"></a-button>
</v-card-title>
<div class="pa-5">
<v-row align="center" no-gutters>
<v-col :cols="2">
<div class="pa-6 pt-0">
<v-row align="center">
<v-col :cols="12" class="py-0">
<label for="" class="search-box-label">
<v-icon x-small color="primary" class="mr-1"
>mdi-record-circle</v-icon
>
계산설명
<v-icon small :class="['mr-1 icon-blue']">$icoBulletPoint</v-icon>
계산설명
</label>
</v-col>
<v-col :cols="6">
<v-text-field
append-icon="mdi-magnify"
class="v-input__custom"
outlined
:hide-details="true"
v-model="searchWord"
@keyup.enter="search"
></v-text-field>
<v-col :cols="10" class="mr-4 py-0" >
<v-text-field append-icon="" class="v-input__custom" outlined
:hide-details="true" v-model="searchWord" @keyup.enter="search"><template v-slot:append>
<!-- Custom SVG icon -->
<v-icon>$icoSearch</v-icon>
</template></v-text-field>
</v-col>
<v-spacer></v-spacer>
<v-col cols="4" class="text-right">
<v-btn :ripple="false" @click="search()">
조회
</v-btn>
<v-col cols="1" class="py-0">
<a-button icon="search" type="primary" @click="search()" class="search-button">조회</a-button>
<!-- <v-btn :ripple="false" @click="initSearch()">
초기화
</v-btn> -->
</v-col>
</v-row>
</div>
<v-divider></v-divider>
<!-- <v-divider></v-divider> -->
<div :style="'height: calc(50vh)'">
<!-- <div :style="{ height: 'calc(100% - 213px)' }"> -->
<div ref="modalGridParent" class="h100 py-3">
<component
:is="loadGrid && dialog ? 'Grid' : null"
:gridName="grid_01"
:dataPath="searchParam.modalData2.eqpmCalcPop"
:parentPrgmId="parentPrgmId"
@getRowsData="getRowData"
@dblClick="setUpdate($event)"
/>
<div ref="modalGridParent" class="h100 px-6 py-4">
<component :is="loadGrid && dialog ? 'Grid' : null" :gridName="grid_01"
:dataPath="searchParam.modalData2.eqpmCalcPop" :parentPrgmId="parentPrgmId"
@getRowsData="getRowData" @dblClick="setUpdate($event)" />
</div>
</div>
<v-card-actions class="pa-5 d-flex align-center justify-center">
<v-btn :ripple="false" @click="setUpdate($event)">확인</v-btn>
<v-btn :ripple="false" @click="dialogOpenCloseEvent(dialog)"
>닫기</v-btn
>
<v-card-actions class="pa-5 d-flex align-center justify-end">
<!-- <v-btn :ripple="false" @click="setUpdate($event)">확인</v-btn>
<v-btn :ripple="false" @click="dialogOpenCloseEvent(dialog)">닫기</v-btn> -->
<a-button :ripple="false" @click="setUpdate($event)" class="mr-2">확인</a-button>
<a-button :ripple="false" type="primary" @click="dialogOpenCloseEvent(dialog)">닫기</a-button>
</v-card-actions>
</v-card>
</v-dialog>
</v-row>
</template>
@ -138,10 +118,20 @@ export default {
type: String,
require: false,
},
openMode:{
type:String,
openMode: {
type: String,
require: false,
},
required: {
type: Boolean,
require: false,
default: false,
},
iconShow:{
type:Boolean,
require:false,
}
default:true
},
// bindingFlag:{
// type:Boolean,
// require: false,
@ -156,7 +146,23 @@ export default {
return {
dialog: false,
loadGrid: false,
loadGrid: true,
dataPathPopExample: {
"rowGrid": {
data: [
{
'calcProc': 'AVG_CNT2',
'argCnt': '2',
'calcDesc': '두개 변수에 대한 평균'
}
],
column: [
{ header: '계산코드', name: 'calcProc', width: 150 },
{ header: '아규먼트갯수', name: 'argCnt', align: 'center', width: 100 },
]
}
},
grid_01: 'grid_01',
myModalKey: 'eqpmCalcPop',
modalDataKey: 'modalData2',
@ -247,7 +253,7 @@ export default {
async created() {
this.init();
},
mounted() {},
mounted() { },
methods: {
...mapMutations({
setPageData: 'setPageData',
@ -282,7 +288,7 @@ export default {
modalDataKey: this.modalDataKey,
value: Object.assign(
// Utility.defaultGridOption(this.$refs.modalGridParent.offsetHeight - 60, myOptions),
Utility.defaultGridOption(400, myOptions),
// Utility.defaultGridOption(400, myOptions),
myOptions,
),
});
@ -292,39 +298,46 @@ export default {
gridKey: this.grid_01,
modalDataKey: this.modalDataKey,
value: [
{ header: '계산코드', name: 'calcProc', width: 150},
{ header: '아규먼트갯수', name: 'argCnt', align:'center', width: 100},
// { header: '계산설명', name : 'calcDesc', width: 286},
{ header: '계산설명', name : 'calcDesc', align:'left'},
{ header: '계산코드', name: 'calcProc', width: 150 },
{ header: '아규먼트갯수', name: 'argCnt', align: 'center', width: 100 },
{ header: '계산설명', name: 'calcDesc', align: 'left' },
],
});
},
async getGridData() {
this.loadGrid = false;
let res = await this.postApiReturn({
apiKey: 'selectEqpmCalcPop',
resKey: 'eqpmCalcPopData',
sendParam: {
calcDescLike: this.searchWord,
openMode:this.item.openMode != undefined ? this.item.openMode : this.openMode
},
});
if(this.myBindingData['calcProc']!= '' || this.myBindingData['calcProc']!= null || this.myBindingData['calcProc']!=undefined){
let newRes = [];
newRes = res.filter(item => {
return item.calcProc != this.myBindingData['calcProc']
});
res = newRes;
}
// const res = [
// {
// 'calcProc' : 'AVG_CNT2',
// 'argCnt' : '2',
// 'calcDesc' : '두개 변수에 대한 평균'
// let res = await this.postApiReturn({
// apiKey: 'selectEqpmCalcPop',
// resKey: 'eqpmCalcPopData',
// sendParam: {
// calcDescLike: this.searchWord,
// openMode: this.item.openMode != undefined ? this.item.openMode : this.openMode
// },
// });
// if (this.myBindingData['calcProc'] != '' || this.myBindingData['calcProc'] != null || this.myBindingData['calcProc'] != undefined) {
// let newRes = [];
// newRes = res.filter(item => {
// return item.calcProc != this.myBindingData['calcProc']
// });
// res = newRes;
// }
// }
// ]
const res = [
{
'calcProc': 'AVG_CNT2',
'argCnt': '2',
'calcDesc': '두개 변수에 대한 평균'
},
{ 'calcProc': 'PROC001', argCnt: 2, 'calcDesc': '덧셈 연산' },
{ 'calcProc': 'PROC002', argCnt: 1, 'calcDesc': '제곱 연산' },
{ 'calcProc': 'PROC003', argCnt: 2, 'calcDesc': '곱셈 연산' },
{ 'calcProc': 'PROC004', argCnt: 1, 'calcDesc': '루트 연산' },
{ 'calcProc': 'PROC005', argCnt: 3, 'calcDesc': '최대값 계산' },
{ 'calcProc': 'PROC006', argCnt: 3, 'calcDesc': '최소값 계산' },
]
this.setModalGridData({
modalKey: this.myModalKey,
gridKey: this.grid_01,
@ -352,14 +365,14 @@ export default {
value: this.selectedData.calcProc,
};
this.$emit('gridEditingFinish', dt);
this.setPageData({ [this.item.valueNm] : this.selectedData.calcProc});
this.setPageData({ [this.item.valueNm]: this.selectedData.calcProc });
if (this.item.valueNm2 !== undefined) {
const dt = {
columnName: this.item.valueNm2,
value: this.selectedData[this.item.valueNm2],
};
this.$emit('gridEditingFinish', dt);
this.setPageData({[this.item.valueNm2] : this.selectedData.argCnt});
this.setPageData({ [this.item.valueNm2]: this.selectedData.argCnt });
}
if (this.item.bindNm !== undefined) {
const dt = {
@ -367,7 +380,7 @@ export default {
value: this.selectedData.argCnt,
};
this.$emit('gridEditingFinish', dt);
this.setPageData({ [this.item.bindNm] : this.selectedData.argCnt});
this.setPageData({ [this.item.bindNm]: this.selectedData.argCnt });
}
}
},
@ -403,33 +416,10 @@ var eqpmCalcPop = {
}
}
.tui-grid-cell.tui-grid-cell-has-tree
.tui-grid-tree-extra-content
+ .tui-grid-cell-content:before {
.tui-grid-cell.tui-grid-cell-has-tree .tui-grid-tree-extra-content+.tui-grid-cell-content:before {
content: none !important;
}
}
@each $theme in dark, light {
.v-application.#{$theme}-mode {
.v-dialog {
.v-card {
&__title {
color: map-deep-get($color, 'white', '0');
@if $theme == dark {
background-color: #2d3355;
.v-btn {
background-color: #2d3355;
}
} @else {
background-color: #3f4d7d;
.v-btn {
background-color: #3f4d7d;
}
}
}
}
}
}
}
</style>