init dev-push code ui base design
This commit is contained in:
leonard
@ -3,50 +3,32 @@
|
||||
<v-row ref="searchFilter">
|
||||
<v-col :cols="12">
|
||||
<v-card class="searchFilter">
|
||||
<v-row align="center" no-gutters>
|
||||
<v-col :cols="3">
|
||||
<v-row align="end" no-gutters>
|
||||
<v-col :cols="2.5">
|
||||
<!-- 사업장 -->
|
||||
<component
|
||||
:is="'SelectBlocMstr'"
|
||||
ref="SelectBlocMstr"
|
||||
:parentPrgmId="myPrgmId"
|
||||
/>
|
||||
<component :is="'SelectBlocMstr'" ref="SelectBlocMstr" :parentPrgmId="myPrgmId"
|
||||
:labelCols="12"
|
||||
:textCols="12"
|
||||
customClass="select-large"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col :cols="3">
|
||||
<component
|
||||
:is="'selectCodeList'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:label="'설비 유형'"
|
||||
dataKey="searchEqpmKind"
|
||||
:sendParam="{ commGrpCd: 'CM_EQKIND', useFg: '1' }"
|
||||
:addAll="true"
|
||||
/>
|
||||
<v-col :cols="2.5">
|
||||
<component :is="'selectCodeList'" :parentPrgmId="myPrgmId" :label="'설비 유형'" dataKey="searchEqpmKind"
|
||||
:sendParam="{ commGrpCd: 'CM_EQKIND', useFg: '1' }" :addAll="true"
|
||||
customClass="select-large" />
|
||||
</v-col>
|
||||
<v-col :cols="3">
|
||||
<component
|
||||
:is="'SelectEqpmGrp'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:label="'설비 그룹'"
|
||||
dataKey="searchEqpmGrp"
|
||||
:sendParam="{ useFg: '1', test: 'dfadfadf' }"
|
||||
:addAll="true"
|
||||
/>
|
||||
<v-col :cols="2.5">
|
||||
<component :is="'SelectEqpmGrp'" :parentPrgmId="myPrgmId" :label="'설비 그룹'" dataKey="searchEqpmGrp"
|
||||
:sendParam="{ useFg: '1', test: 'dfadfadf' }" :addAll="true" :labelCols="12" :textCols="12"
|
||||
customClass="select-large"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col :cols="3" class="text-right">
|
||||
<BtnSearch @click="search" />
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row align="center" no-gutters>
|
||||
<v-col :cols="6">
|
||||
<InputText
|
||||
:parentPrgmId="myPrgmId"
|
||||
label="설비명"
|
||||
valueNm="eqpmNm"
|
||||
:labelCols="2"
|
||||
:textCols="10"
|
||||
:searchOption="true"
|
||||
/>
|
||||
<v-col :cols="2.5">
|
||||
<InputText :parentPrgmId="myPrgmId" label="설비명" valueNm="eqpmNm" :searchOption="true" :labelCols="12"
|
||||
:textCols="12"
|
||||
customClass="input-large" />
|
||||
</v-col>
|
||||
<BtnSearch @click="search" size="large" />
|
||||
</v-row>
|
||||
</v-card>
|
||||
</v-col>
|
||||
@ -56,72 +38,36 @@
|
||||
<v-card class="pb-5">
|
||||
<div class="d-flex align-center justify-space-between pa-5">
|
||||
<v-card-title class="pa-0 custom-title-4">설비 정보</v-card-title>
|
||||
<Buttons
|
||||
:parentPrgmId="myPrgmId"
|
||||
:bindingData="gridName"
|
||||
:detailList="detailList"
|
||||
:btnActionsFnc="btnActions"
|
||||
/>
|
||||
<Buttons :parentPrgmId="myPrgmId" :bindingData="gridName" :detailList="detailList"
|
||||
:btnActionsFnc="btnActions" />
|
||||
</div>
|
||||
<div class="px-5" style="height:calc(100% - 76px)">
|
||||
<div class="px-5" style="min-height:calc(100% - 76px)">
|
||||
<div ref="gridParent" class="w100 h100">
|
||||
<component
|
||||
:ref="gridName"
|
||||
:is="loadGrid ? 'Grid' : null"
|
||||
:gridName="gridName"
|
||||
:parentPrgmId="myPrgmId"
|
||||
@getRowsData="getRowData"
|
||||
@sendSelectedRowStatInfo="getSelectedRowStatInfo"
|
||||
:selectedRowDataWatchFlag="true"
|
||||
:preventFocusChangeEventFlag="false"
|
||||
/>
|
||||
<component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName" :parentPrgmId="myPrgmId"
|
||||
@getRowsData="getRowData" @sendSelectedRowStatInfo="getSelectedRowStatInfo"
|
||||
:selectedRowDataWatchFlag="true" :preventFocusChangeEventFlag="false" :dataPath="dataPathMock" />
|
||||
</div>
|
||||
</div>
|
||||
</v-card>
|
||||
</v-col>
|
||||
<v-col :cols="7" class="h100">
|
||||
<v-card class="pb-5">
|
||||
<v-card-title class="custom-title-4" style="min-height:76px;"
|
||||
>설비 상세</v-card-title
|
||||
>
|
||||
<div class="px-5" style="height:calc(100% - 76px)">
|
||||
<v-card-title class="custom-title-4" style="min-height:76px;">설비 상세</v-card-title>
|
||||
<div class="px-5" style="min-height:calc(100% - 76px)">
|
||||
<v-tabs v-model="tab">
|
||||
<v-tab
|
||||
v-for="item in items"
|
||||
:key="item.id"
|
||||
:disabled="item.disabledFlag"
|
||||
>
|
||||
<v-tab v-for="item in items" :key="item.id" :disabled="item.disabledFlag">
|
||||
{{ item.name }}
|
||||
</v-tab>
|
||||
</v-tabs>
|
||||
<v-tabs-items
|
||||
v-model="tab"
|
||||
style="height: calc(100% - 65px);"
|
||||
class="py-6"
|
||||
>
|
||||
<v-tabs-items v-model="tab" style="min-height: calc(100% - 65px);" class="py-6">
|
||||
<v-tab-item v-for="(item, idx) in items" :key="item.id">
|
||||
<component
|
||||
v-if="item.id == 'eqpmBaseInfoTab'"
|
||||
:is="'Form'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:detailList="detailList"
|
||||
@gridEditingFinish="gridEditingFinish"
|
||||
/>
|
||||
<EqpmAddInfoTab
|
||||
v-if="item.id == 'eqpmAddInfoTab'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:innerTabGridInfo="{ tab, idx }"
|
||||
/>
|
||||
<EqpmIaoTab
|
||||
v-if="item.id == 'eqpmIaoTab'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:innerTabGridInfo="{ tab, idx }"
|
||||
/>
|
||||
<EqpmConstTab
|
||||
v-if="item.id == 'eqpmConstTab'"
|
||||
:parentPrgmId="myPrgmId"
|
||||
:innerTabGridInfo="{ tab, idx }"
|
||||
/>
|
||||
<component v-if="item.id == 'eqpmBaseInfoTab'" :is="'Form'" :parentPrgmId="myPrgmId"
|
||||
:detailList="detailList" @gridEditingFinish="gridEditingFinish" />
|
||||
<EqpmAddInfoTab v-if="item.id == 'eqpmAddInfoTab'" :parentPrgmId="myPrgmId"
|
||||
:innerTabGridInfo="{ tab, idx }" />
|
||||
<EqpmIaoTab v-if="item.id == 'eqpmIaoTab'" :parentPrgmId="myPrgmId" :innerTabGridInfo="{ tab, idx }" />
|
||||
<EqpmConstTab v-if="item.id == 'eqpmConstTab'" :parentPrgmId="myPrgmId"
|
||||
:innerTabGridInfo="{ tab, idx }" />
|
||||
</v-tab-item>
|
||||
</v-tabs-items>
|
||||
</div>
|
||||
@ -194,6 +140,24 @@ export default {
|
||||
],
|
||||
detailList: myDetail,
|
||||
lastInsertEqpmId: null,
|
||||
dataPathMock: {
|
||||
'rowGrid': {
|
||||
column: [
|
||||
{ header: '설비 ID', name: 'id', headerAlign: 'left' },
|
||||
{ header: '설비 명', name: 'lable', headerAlign: 'left' },
|
||||
{ header: '설비 유형', name: 'type', headerAlign: 'left' },
|
||||
{ header: '설비 그룹ㅅ', name: 'note', headerAlign: 'left' },
|
||||
{ header: '사용 여부', name: 'field1', headerAlign: 'left' },
|
||||
// { header: '분배율', name: 'field2', headerAlign: 'left' }
|
||||
],
|
||||
data: dataPathDataExample,
|
||||
defaultRow: dataPathDataExample,
|
||||
option: {
|
||||
// rowHeaders: ['checkbox']
|
||||
},
|
||||
|
||||
}
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@ -495,14 +459,14 @@ export default {
|
||||
this.$refs[this.gridName].focus({
|
||||
rowKey:
|
||||
this.pageData.rowGridSelectKey != '' ||
|
||||
this.pageData.rowGridSelectKey != null
|
||||
this.pageData.rowGridSelectKey != null
|
||||
? this.pageData.rowGridSelectKey
|
||||
: this.$refs[this.gridName]
|
||||
.getData()
|
||||
.findIndex(item => item.eqpmId == this.lastInsertEqpmId) ==
|
||||
-1
|
||||
? 0
|
||||
: this.$refs[this.gridName]
|
||||
.getData()
|
||||
.findIndex(item => item.eqpmId == this.lastInsertEqpmId) ==
|
||||
-1
|
||||
? 0
|
||||
: this.$refs[this.gridName]
|
||||
.getData()
|
||||
.findIndex(item => item.eqpmId == this.lastInsertEqpmId),
|
||||
columnName: 'eqpmId',
|
||||
@ -943,11 +907,11 @@ const myDetail = [
|
||||
// readonly: true,
|
||||
disabled: true,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-3 pr-4',
|
||||
required: true,
|
||||
iconShow: true,
|
||||
labelCols: 4,
|
||||
textCols: 7,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
},
|
||||
{
|
||||
type: 'InputText',
|
||||
@ -955,8 +919,11 @@ const myDetail = [
|
||||
valueNm: 'eqpmNm',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-3 pl-4',
|
||||
required: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
iconShow: true,
|
||||
},
|
||||
{
|
||||
type: 'SelectBox',
|
||||
@ -964,11 +931,14 @@ const myDetail = [
|
||||
valueNm: 'eqpmKind',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-3 pr-4',
|
||||
list: 'eqpmKindList',
|
||||
itemText: 'commCdNm',
|
||||
itemValue: 'commCd',
|
||||
required: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
iconShow: true,
|
||||
},
|
||||
{
|
||||
type: 'SelectBox',
|
||||
@ -976,11 +946,14 @@ const myDetail = [
|
||||
valueNm: 'eqpmGrpId',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-3 pl-4',
|
||||
list: 'eqpmGrpList',
|
||||
itemText: 'eqpmGrpNm',
|
||||
itemValue: 'eqpmGrpId',
|
||||
required: true,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
iconShow: true,
|
||||
},
|
||||
{
|
||||
type: 'FtnPlcFormPop',
|
||||
@ -990,18 +963,12 @@ const myDetail = [
|
||||
disabled: false,
|
||||
required: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
labelCols: 4,
|
||||
textCols: 7,
|
||||
disableContent: true,
|
||||
eccFgYn: 'Y',
|
||||
},
|
||||
{
|
||||
type: 'InputText',
|
||||
valueNm: 'eccNm',
|
||||
readonly: true,
|
||||
cols: 5,
|
||||
class: 'py-2',
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
iconShow: true,
|
||||
class: 'py-3 pr-4',
|
||||
},
|
||||
{
|
||||
type: 'CheckBox',
|
||||
@ -1009,12 +976,31 @@ const myDetail = [
|
||||
valueNm: 'useFg',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
class: 'py-3 pl-4',
|
||||
value: { '1': true, '0': false },
|
||||
required: true,
|
||||
iconShow: true,
|
||||
// class: 'd-flex align-end pb-3'
|
||||
},
|
||||
{
|
||||
type: 'InputText',
|
||||
valueNm: 'eccNm',
|
||||
readonly: true,
|
||||
cols: 6,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
iconShow: true,
|
||||
class: 'pt-0 py-3 pr-4'
|
||||
},
|
||||
|
||||
];
|
||||
|
||||
import { getPathDataExample } from '@/const/const'
|
||||
const dataPathDataExample = getPathDataExample({
|
||||
id: 'INCHEON.HVAC.EQP_HT_CH001.UT_CH101.CHI_AMP_1A_PV',
|
||||
lable: 'INCHEON 고온 냉동기 101호기 - 호로1',
|
||||
type: '사용', note: '-',
|
||||
field1: '1111',
|
||||
field2: '2222',
|
||||
});
|
||||
</script>
|
||||
<style lang="scss">
|
||||
@import '@/assets/scss/common.scss';
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user