Merge pull request 'Commit 3107' (#27) from dev-trungvq7-0729 into dev

Reviewed-on: #27
This commit is contained in:
dev
2025-07-31 15:39:36 +09:00
6 changed files with 105 additions and 68 deletions

View File

@ -278,8 +278,8 @@
top: 50%; top: 50%;
left: 50%; left: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
height: 11px; height: 8px;
width: 11px; width: 8px;
border-radius: 50%; border-radius: 50%;
background-color: map-deep-get($config, background-color: map-deep-get($config,
#{$theme}, #{$theme},

View File

@ -171,8 +171,8 @@
align-items: center; align-items: center;
cursor: pointer; cursor: pointer;
position: relative; position: relative;
padding-left: 28px; padding-left: 0;
margin: 10px; margin: 5px;
font-size: 16px; font-size: 16px;
} }
.custom-radio input[type="radio"] { .custom-radio input[type="radio"] {
@ -183,13 +183,13 @@
/* Custom radio appearance */ /* Custom radio appearance */
.radio-mark { .radio-mark {
position: absolute; position: absolute;
left: 0; left: -8px;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
height: 18px; height: 14px;
width: 18px; width: 14px;
// background-color: white; // background-color: white;
border: 2px solid #ccc; border: 1px solid #ccc;
border-radius: 50%; border-radius: 50%;
transition: all 0.2s ease; transition: all 0.2s ease;
} }

View File

@ -268,7 +268,7 @@ export default {
header: '', header: '',
name: '', name: '',
align: 'center', align: 'center',
width: 50, width: 20,
formatter: (props) => { formatter: (props) => {
return `<label class="custom-radio"> return `<label class="custom-radio">
<span class="radio-mark"></span> <span class="radio-mark"></span>
@ -278,10 +278,10 @@ export default {
{ {
header: '검침개소명', header: '검침개소명',
name: 'readPlcNm', name: 'readPlcNm',
width: 300, width: 500,
align: 'left', align: 'left',
}, },
{ header: '검침개소', name: 'name', align: 'center' }, { header: '검침개소', name: 'name', align: 'left', width: 200 },
], ],
}); });
}, },
@ -307,6 +307,9 @@ export default {
// console.log("treeData", res) // console.log("treeData", res)
let myOptionsTree = { let myOptionsTree = {
columnOptions: {
resizable: true,
},
treeColumnOptions: { treeColumnOptions: {
name: 'readPlcNm', name: 'readPlcNm',
}, },

View File

@ -6,12 +6,23 @@
:btnActionsFnc="btnActions" /> :btnActionsFnc="btnActions" />
</div> </div>
<div ref="gridParent" style="height: calc((100vh - 520px) /2);"> <div ref="gridParent" style="height: calc((100vh - 520px) /2);">
<Grid :ref="gridName" :gridName="gridName" :parentPrgmId="parentPrgmId" @getRowsData="getRowData" <Grid
:innerTabGridInfo="innerTabGridInfo" /> :ref="gridName"
:is="loadGrid ? 'Grid' : null"
:gridName="gridName"
:parentPrgmId="parentPrgmId"
@getRowsData="getRowData"
:innerTabGridInfo="innerTabGridInfo"
/>
</div> </div>
<div class="mt-3" ref="formParent" style="height: calc((100vh - 400px) /2);"> <div ref="formParent" style="height: calc((100vh - 400px) /2);">
<component :is="'Form'" :parentPrgmId="parentPrgmId" :bindingData="gridName" <component
:detailList="detailReadPlcTagList" @gridEditingFinish="gridEditingFinish" /> :is="'Form'"
:parentPrgmId="parentPrgmId"
:bindingData="gridName"
:detailList="detailReadPlcTagList"
@gridEditingFinish="gridEditingFinish"
/>
</div> </div>
</div> </div>
</template> </template>
@ -99,9 +110,9 @@ export default {
// bodyHeight: gridHeight, // bodyHeight: gridHeight,
// minBodyHeight: gridHeight, // minBodyHeight: gridHeight,
header: { header: {
height: 28, height: 37,
}, },
rowHeight: 29, rowHeight: 37,
minRowHeight: 29, minRowHeight: 29,
selectionUnit: 'row', selectionUnit: 'row',
editingEvent: 'click', editingEvent: 'click',

View File

@ -35,7 +35,7 @@
<div class="h100 px-4" style="height:calc(100% - 70px)"> <div class="h100 px-4" style="height:calc(100% - 70px)">
<div ref="treeGridParent" class="w100 h100"> <div ref="treeGridParent" class="w100 h100">
<component :ref="gridName + myPrgmId" :is="loadTree ? 'Grid' : null" :gridName="gridName" <component :ref="gridName + myPrgmId" :is="loadTree ? 'Grid' : null" :gridName="gridName"
:parentPrgmId="myPrgmId" @getRowsData="getRowData" /> :parentPrgmId="myPrgmId" @getRowsData="getRowData" />
</div> </div>
</div> </div>
</v-card> </v-card>
@ -151,6 +151,9 @@ export default {
gridInit() { gridInit() {
const treeGridHeight = this.$refs.treeGridParent.offsetHeight - 30; const treeGridHeight = this.$refs.treeGridParent.offsetHeight - 30;
const myOptionsTree = { const myOptionsTree = {
columnOptions: {
resizable: true,
},
treeColumnOptions: { treeColumnOptions: {
name: 'menuNm', name: 'menuNm',
}, },
@ -171,6 +174,17 @@ export default {
this.setGridColumn({ this.setGridColumn({
gridKey: this.gridName, gridKey: this.gridName,
value: [ value: [
{
header: '',
name: '',
align: 'center',
width: 20,
formatter: (props) => {
return `<label class="custom-radio">
<span class="radio-mark"></span>
</label>`;
}
},
{ header: '메뉴명', name: 'menuNm' }, { header: '메뉴명', name: 'menuNm' },
{ header: 'prgmId ', name: 'prgmId', hidden: true }, { header: 'prgmId ', name: 'prgmId', hidden: true },
{ header: 'sysDivCd ', name: 'sysDivCd', hidden: true }, { header: 'sysDivCd ', name: 'sysDivCd', hidden: true },

View File

@ -43,8 +43,7 @@
<div ref="gridParent" class="w100 h100"> <div ref="gridParent" class="w100 h100">
<component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName" <component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName"
:parentPrgmId="myPrgmId" @getRowsData="getRowData" :parentPrgmId="myPrgmId" @getRowsData="getRowData"
@sendSelectedRowStatInfo="getSelectedRowStatInfo" :selectedRowDataWatchFlag="true" @sendSelectedRowStatInfo="getSelectedRowStatInfo" :selectedRowDataWatchFlag="true" />
/>
</div> </div>
</div> </div>
</v-card> </v-card>
@ -308,12 +307,22 @@ export default {
const _this = this; const _this = this;
const myColumns = [ const myColumns = [
{
header: '',
name: '',
align: 'center',
formatter: (props) => {
return `<span class="custom-radio">
<span class="radio-mark"></span>
</span>`;
}
},
{ header: '회사 ID', name: 'comId', hidden: true }, { header: '회사 ID', name: 'comId', hidden: true },
{ {
header: '검침개소명', header: '검침개소명',
name: 'readPlcNm', name: 'readPlcNm',
align: 'left', align: 'left',
minWidth: 400, minWidth: 350,
}, },
{ {
header: '검침개소 ID', header: '검침개소 ID',
@ -470,12 +479,12 @@ export default {
this.$refs[this.gridName].focus({ this.$refs[this.gridName].focus({
rowKey: rowKey:
this.pageData.rowGridSelectKey == '' || this.pageData.rowGridSelectKey == '' ||
this.pageData.rowGridSelectKey == null this.pageData.rowGridSelectKey == null
? 0 ? 0
: this.pageData.rowGridSelectKey == : this.pageData.rowGridSelectKey ==
this.$refs[this.gridName].getData().length - 1 this.$refs[this.gridName].getData().length - 1
? this.pageData.rowGridSelectKey ? this.pageData.rowGridSelectKey
: 0, : 0,
columnName: 'readPlcNm', columnName: 'readPlcNm',
setScroll: true, setScroll: true,
}); });
@ -493,7 +502,7 @@ export default {
if (this.tab == 2) { if (this.tab == 2) {
this.tab = 0; this.tab = 0;
} }
this.isImgTabDisabled = false; this.isImgTabDisabled = true;
} else { } else {
this.isImgTabDisabled = false; this.isImgTabDisabled = false;
} }
@ -917,47 +926,47 @@ const defaultData = {
}; };
const sampleData = [ const sampleData = [
{ {
readPlcNm: '서울 본사', readPlcNm: '서울 본사',
plcKind: '본사', plcKind: '본사',
useFg: '사용', useFg: '사용',
_children: [ _children: [
{ {
readPlcNm: '서울 본사 - 1층', readPlcNm: '서울 본사 - 1층',
plcKind: '층', plcKind: '층',
useFg: '사용', useFg: '사용',
}, },
{ {
readPlcNm: '서울 본사 - 2층', readPlcNm: '서울 본사 - 2층',
plcKind: '층', plcKind: '층',
useFg: '미사용', useFg: '미사용',
}, },
], ],
}, },
{ {
readPlcNm: '부산 지사', readPlcNm: '부산 지사',
plcKind: '지사', plcKind: '지사',
useFg: '사용', useFg: '사용',
_children: [ _children: [
{ {
readPlcNm: '부산 지사 - A동', readPlcNm: '부산 지사 - A동',
plcKind: '건물', plcKind: '건물',
useFg: '사용', useFg: '사용',
_children: [ _children: [
{ {
readPlcNm: '부산 지사 - A동 1층', readPlcNm: '부산 지사 - A동 1층',
plcKind: '층', plcKind: '층',
useFg: '사용', useFg: '사용',
}, },
], ],
}, },
], ],
}, },
{ {
readPlcNm: '대전 창고', readPlcNm: '대전 창고',
plcKind: '창고', plcKind: '창고',
useFg: '미사용', useFg: '미사용',
}, },
]; ];