init dev-push code ui base design
This commit is contained in:
@ -3,7 +3,7 @@
|
||||
<v-row ref="searchFilter">
|
||||
<v-col :cols="12">
|
||||
<v-card class="searchFilter">
|
||||
<v-row align="center" no-gutters>
|
||||
<v-row no-gutters>
|
||||
<v-col :cols="3">
|
||||
<component
|
||||
:is="'selectCodeList'"
|
||||
@ -12,6 +12,8 @@
|
||||
dataKey="readObjKind"
|
||||
:addAll="true"
|
||||
:sendParam="{ commGrpCd: 'CM_MTTTP', useFg: '1' }"
|
||||
:iconShow="true"
|
||||
customClass="select-large"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col :cols="3">
|
||||
@ -22,18 +24,22 @@
|
||||
dataKey="useFg"
|
||||
:sendParam="{ commGrpCd: 'CO_USEFG', useFg: '1' }"
|
||||
:addAll="true"
|
||||
:iconShow="true"
|
||||
customClass="select-large"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col :cols="3">
|
||||
<v-col :cols="3">
|
||||
<InputText
|
||||
:parentPrgmId="myPrgmId"
|
||||
label="검침대상명"
|
||||
valueNm="readObjNm"
|
||||
:searchOption="true"
|
||||
:iconShow="true"
|
||||
customClass="input-large"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col :cols="3" class="text-right">
|
||||
<BtnSearch @click="search" />
|
||||
<v-col :cols="3" class="d-flex align-end justify-end text-right">
|
||||
<BtnSearch @click="search" size="large" />
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card>
|
||||
@ -43,7 +49,7 @@
|
||||
<v-col :cols="5" class="h100">
|
||||
<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 class="pa-0 custom-title-4-new"
|
||||
>검침 대상 정보</v-card-title
|
||||
>
|
||||
<Buttons
|
||||
@ -63,6 +69,7 @@
|
||||
@getRowsData="getRowData"
|
||||
@sendSelectedRowStatInfo="getSelectedRowStatInfo"
|
||||
:selectedRowDataWatchFlag="true"
|
||||
:dataPath="dataPathMock"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -70,11 +77,11 @@
|
||||
</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 class="custom-title-4-new" style="min-height:76px;"
|
||||
>검침대상 상세
|
||||
</v-card-title>
|
||||
<div class="px-5" style="height:calc(100% - 76px)">
|
||||
<v-tabs v-model="tab">
|
||||
<v-tabs v-model="tab" >
|
||||
<v-tab
|
||||
v-for="item in items"
|
||||
:key="item.id"
|
||||
@ -181,8 +188,26 @@ export default {
|
||||
return {
|
||||
myPrgmId: myPrgmId,
|
||||
gridName: 'rowGrid',
|
||||
loadGrid: false,
|
||||
loadGrid: true,
|
||||
tab: null,
|
||||
dataPathMock: {
|
||||
"rowGrid": {
|
||||
column: [
|
||||
{ header: '검침 대상 ID', name: 'readObjId', align: 'left' },
|
||||
{ header: '검침 대상 명', name: 'readObjNm', align: 'left' },
|
||||
{ header: '검침 대상 유형', name: 'readObjKind', align: 'left' },
|
||||
{ header: '그룹', name: 'grpCd', align: 'left' },
|
||||
{ header: 'TJ 환산계수', name: 'tjCvrtCoef', align: 'right' },
|
||||
{ header: 'TOE 환산계수', name: 'toeCvrtCoef', align: 'right' },
|
||||
{ header: 'CO2 환산계수', name: 'co2CvrtCoef', align: 'right' },
|
||||
{ header: '단위', name: 'unitCd', align: 'left' },
|
||||
{ header: '사용 여부', name: 'useFg', align: 'center' },
|
||||
],
|
||||
data: dataPathDataExample,
|
||||
defaultRow: dataPathDataExample,
|
||||
option: {}
|
||||
}
|
||||
},
|
||||
items: [
|
||||
{
|
||||
name: '검침 대상 정보',
|
||||
@ -641,10 +666,22 @@ const defaultData = {
|
||||
readObjKind: '',
|
||||
readObjKindList: [],
|
||||
readObjKindDetail: '',
|
||||
readObjKindDetailList: [],
|
||||
readObjKindDetailList: [
|
||||
{ commCd: 'K01', commCdNm: '건물' },
|
||||
{ commCd: 'K02', commCdNm: '공장' },
|
||||
{ commCd: 'K03', commCdNm: '학교' },
|
||||
],
|
||||
readObjGrp: '',
|
||||
readObjGrpList: [],
|
||||
unitCdList: [],
|
||||
readObjGrpList: [
|
||||
{ commCd: 'G01', commCdNm: '그룹 A' },
|
||||
{ commCd: 'G02', commCdNm: '그룹 B' },
|
||||
{ commCd: 'G03', commCdNm: '그룹 C' },
|
||||
],
|
||||
unitCdList: [
|
||||
{ commCd: 'U01', commCdNm: 'kWh' },
|
||||
{ commCd: 'U02', commCdNm: 'MJ' },
|
||||
{ commCd: 'U03', commCdNm: 'TOE' },
|
||||
],
|
||||
useFg: '1',
|
||||
useFgList: [],
|
||||
commGrpCd: '',
|
||||
@ -687,8 +724,8 @@ const defaultData = {
|
||||
},
|
||||
buttonAuth: {
|
||||
add: true,
|
||||
remove: true,
|
||||
save: true,
|
||||
remove: true,
|
||||
excel: false,
|
||||
},
|
||||
},
|
||||
@ -722,7 +759,10 @@ const myDetail = [
|
||||
valueNm: 'readObjId',
|
||||
readonly: true,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
iconShow: true,
|
||||
class: 'py-2 pr-2',
|
||||
required: false,
|
||||
placeholder: '시스템 자동입력',
|
||||
},
|
||||
@ -732,8 +772,11 @@ const myDetail = [
|
||||
valueNm: 'readObjNm',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
class: 'py-2',
|
||||
required: true,
|
||||
iconShow: true,
|
||||
},
|
||||
{
|
||||
type: 'SelectBox',
|
||||
@ -741,10 +784,13 @@ const myDetail = [
|
||||
valueNm: 'readObjKind',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
class: 'py-2 pr-2',
|
||||
list: 'readObjKindDetailList',
|
||||
itemText: 'commCdNm',
|
||||
itemValue: 'commCd',
|
||||
iconShow: true,
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
@ -753,10 +799,13 @@ const myDetail = [
|
||||
valueNm: 'grpCd',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
class: 'py-2',
|
||||
list: 'readObjGrpList',
|
||||
itemText: 'commCdNm',
|
||||
itemValue: 'commCd',
|
||||
iconShow: true,
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
@ -765,7 +814,10 @@ const myDetail = [
|
||||
valueNm: 'tjCvrtCoef',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
class: 'py-2 pr-2',
|
||||
iconShow: true,
|
||||
inputType: 'number',
|
||||
},
|
||||
{
|
||||
@ -774,7 +826,10 @@ const myDetail = [
|
||||
valueNm: 'toeCvrtCoef',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
class: 'py-2',
|
||||
iconShow: true,
|
||||
inputType: 'number',
|
||||
},
|
||||
{
|
||||
@ -783,7 +838,10 @@ const myDetail = [
|
||||
valueNm: 'co2CvrtCoef',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
class: 'py-2 pr-2',
|
||||
iconShow: true,
|
||||
inputType: 'number',
|
||||
},
|
||||
{
|
||||
@ -792,10 +850,13 @@ const myDetail = [
|
||||
valueNm: 'unitCd',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
class: 'py-2',
|
||||
list: 'unitCdList',
|
||||
itemText: 'commCdNm',
|
||||
itemValue: 'commCd',
|
||||
iconShow: true,
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
@ -804,12 +865,48 @@ const myDetail = [
|
||||
valueNm: 'useFg',
|
||||
disabled: false,
|
||||
cols: 6,
|
||||
class: 'py-2',
|
||||
labelCols: 12,
|
||||
textCols: 12,
|
||||
class: 'py-2 pr-2',
|
||||
value: { '1': true, '0': false },
|
||||
iconShow: true,
|
||||
required: true,
|
||||
},
|
||||
];
|
||||
const dataPathDataExample = [
|
||||
{
|
||||
readObjId: 'OBJ001',
|
||||
readObjNm: '서울 본사',
|
||||
readObjKind: 'TYPE01',
|
||||
grpCd: 'GRP01',
|
||||
tjCvrtCoef: 1.25,
|
||||
toeCvrtCoef: 0.85,
|
||||
co2CvrtCoef: 2.1,
|
||||
unitCd: 'kWh',
|
||||
useFg: '1',
|
||||
},
|
||||
{
|
||||
readObjId: 'OBJ002',
|
||||
readObjNm: '부산 지사',
|
||||
readObjKind: 'TYPE02',
|
||||
grpCd: 'GRP02',
|
||||
tjCvrtCoef: 1.10,
|
||||
toeCvrtCoef: 0.90,
|
||||
co2CvrtCoef: 1.8,
|
||||
unitCd: 'MJ',
|
||||
useFg: '0',
|
||||
},
|
||||
{
|
||||
readObjId: 'OBJ003',
|
||||
readObjNm: '대전 공장',
|
||||
readObjKind: 'TYPE03',
|
||||
grpCd: 'GRP01',
|
||||
tjCvrtCoef: 1.30,
|
||||
toeCvrtCoef: 0.95,
|
||||
co2CvrtCoef: 2.3,
|
||||
unitCd: 'GJ',
|
||||
useFg: '1',
|
||||
}
|
||||
];
|
||||
|
||||
</script>
|
||||
<style lang="scss">
|
||||
@import '@/assets/scss/common.scss';
|
||||
</style>
|
||||
|
Reference in New Issue
Block a user