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

resolve confict

Browse Source
This commit is contained in:
Tran Van Dung/(Tran Van Dung)/현장대리인/SK
2025-08-06 09:26:53 +07:00
parent 8cadade514 ca27167d3d
commit 4a7077336d
27 changed files with 358 additions and 323 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
assets/scss/common/button.scss
View File

@ -92,24 +92,23 @@
background: map-deep-get($config, #{$theme}, "basic-button-background"); background: map-deep-get($config, #{$theme}, "basic-button-background");
} }
.searchFilter{ .searchFilter {
.search-button { .search-button {
height: 40px; height: 40px;
color: map-deep-get($config, #{$theme}, "search-btn-color"); color: map-deep-get($config, #{$theme}, "search-btn-color");
} }
} }
.v-dialog { .v-dialog {
.ant-btn-icon-only { .ant-btn-icon-only {
color: map-deep-get( color: map-deep-get($config,
$config,
#{$theme}, #{$theme},
"icon-color" "icon-color"
); );
} }
} }
.ant-btn { .ant-btn {
&.ant-btn-outlined { &.ant-btn-outlined {
color:map-deep-get($config, #{$theme}, "ant-btn-default-color"); color:map-deep-get($config, #{$theme}, "ant-btn-default-color");
@ -121,7 +120,8 @@
background: map-deep-get($config, #{$theme}, "ant-btn-primary-bg"); background: map-deep-get($config, #{$theme}, "ant-btn-primary-bg");
border-color:map-deep-get($config, #{$theme}, "ant-btn-primary-bg"); border-color:map-deep-get($config, #{$theme}, "ant-btn-primary-bg");
color:map-deep-get($config, #{$theme}, "ant-btn-primary-color"); color:map-deep-get($config, #{$theme}, "ant-btn-primary-color");
&.ant-btn-background-ghost{
&.ant-btn-background-ghost {
color:map-deep-get($config, #{$theme}, "ant-btn-primary-bg"); color:map-deep-get($config, #{$theme}, "ant-btn-primary-bg");
} }
} }
@ -142,6 +142,7 @@
&.expand-btn { &.expand-btn {
.v-icon { .v-icon {
color: map-deep-get($config, #{$theme}, "basic-button-color"); color: map-deep-get($config, #{$theme}, "basic-button-color");
svg { svg {
fill: map-deep-get($config, #{$theme}, "basic-button-color"); fill: map-deep-get($config, #{$theme}, "basic-button-color");
} }
@ -152,15 +153,17 @@
} }
.v-application { .v-application {
.ant-btn { .ant-btn {
border-radius: 6px; border-radius: 6px;
&.ant-btn-lg { &.ant-btn-lg {
border-radius: 8px; border-radius: 8px;
} }
&.ant-btn-default { &.ant-btn-default {
border:none !important border: none !important
} }
} }
} }
@ -171,15 +174,16 @@
border: none; border: none;
width: 16px; width: 16px;
height: 16px; height: 16px;
background:none; background: none;
} }
} }
.ant-btn {
.ant-btn {
&.expand-btn { &.expand-btn {
.v-icon { span {
span { &.v-icon {
margin-right: 8px; margin-right: 8px;
} }
} }
} }
} }

22
assets/scss/common/grid.scss
View File

@ -98,6 +98,12 @@
@include theme($theme); @include theme($theme);
.v-application.#{$theme}-mode { .v-application.#{$theme}-mode {
.tui-grid-content-area{
.tui-grid-header-area{
height: auto !important;
}
}
.grid-title { .grid-title {
font-weight: 600; font-weight: 600;
font-size: 16px; font-size: 16px;
@ -308,13 +314,13 @@
#{$theme}, #{$theme},
"tui-grid-cell-borderColor" "tui-grid-cell-borderColor"
); );
.tui-grid-cell-content { // .tui-grid-cell-content {
border-right: 1px solid ; // border-right: 1px solid ;
border-right-color: map-deep-get($config, // border-right-color: map-deep-get($config,
#{$theme}, // #{$theme},
"tui-grid-cell-borderColor" // "tui-grid-cell-borderColor"
); // );
} // }
} }
} }
@ -479,6 +485,7 @@
} }
&-tree-button-expand { &-tree-button-expand {
z-index: 9999;
.tui-grid-btn-tree { .tui-grid-btn-tree {
i { i {
width: 16px; width: 16px;
@ -497,6 +504,7 @@
} }
&-tree-button-collapse { &-tree-button-collapse {
z-index: 9999;
.tui-grid-btn-tree { .tui-grid-btn-tree {
i { i {
width: 16px; width: 16px;

44
assets/scss/common/input.scss
View File

@ -1,6 +1,6 @@
.v-select__custom { .v-select__custom {
padding: 0.125rem; padding: 0.125rem;
&.v-text-field.v-text-field--solo:not(.v-text-field--solo-flat)>.v-input__control>.v-input__slot { &.v-text-field.v-text-field--solo:not(.v-text-field--solo-flat)>.v-input__control>.v-input__slot {
box-shadow: none; box-shadow: none;
} }
@ -175,11 +175,13 @@
margin: 5px; margin: 5px;
font-size: 16px; font-size: 16px;
} }
.custom-radio input[type="radio"] { .custom-radio input[type="radio"] {
position: absolute; position: absolute;
opacity: 0; opacity: 0;
cursor: pointer; cursor: pointer;
} }
/* Custom radio appearance */ /* Custom radio appearance */
.radio-mark { .radio-mark {
position: absolute; position: absolute;
@ -222,11 +224,31 @@
color: #424242 !important; color: #424242 !important;
} }
.ant-checkbox {
.ant-checkbox-inner {
border-radius: 4px
}
}
@each $theme in dark, light { @each $theme in dark, light {
@include theme($theme); @include theme($theme);
.v-application.#{$theme}-mode { .v-application.#{$theme}-mode {
.ant-checkbox-wrapper {
.ant-checkbox-checked {
.ant-checkbox-inner {
background: map-deep-get($config, #{$theme}, "ant-btn-primary-bg");
border-color:map-deep-get($config, #{$theme}, "ant-btn-primary-bg");
color:map-deep-get($config, #{$theme}, "ant-btn-primary-color");
&.ant-checkbox-inner::after {
border-color: map-deep-get($config, #{$theme}, "ant-btn-primary-color");
}
}
}
}
.v-input-popup__custom { .v-input-popup__custom {
.v-input__slot { .v-input__slot {
padding-left: 12px; padding-left: 12px;
@ -239,17 +261,18 @@
} }
.v-textarea { .v-textarea {
.v-input__slot{ .v-input__slot {
border: map-deep-get($config, border: map-deep-get($config,
#{$theme}, #{$theme},
"v-input-textarea-border" "v-input-textarea-border"
); );
fieldset { fieldset {
background-color: map-deep-get($config, background-color: map-deep-get($config,
#{$theme}, #{$theme},
"v-input-textarea-bg" "v-input-textarea-bg"
); );
} }
} }
} }
@ -404,6 +427,12 @@
.v-input--checkbox { .v-input--checkbox {
.v-icon { .v-icon {
transform: none;
&.mdi:before {
font-size: 16px;
}
@if $theme ==dark { @if $theme ==dark {
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -414,6 +443,9 @@
} }
} }
.v-textarea { .v-textarea {
textarea { textarea {
padding: 10px; padding: 10px;

32
components/common/CheckBox.vue
View File

@ -2,26 +2,17 @@
<v-row class="search-box" align="center" no-gutters> <v-row class="search-box" align="center" no-gutters>
<v-col v-if="label" :cols="labelCols"> <v-col v-if="label" :cols="labelCols">
<label for="" class="search-box-label"> <label for="" class="search-box-label">
<v-icon <v-icon v-if="iconShow" small :class="['mr-1', required ? 'icon-orange' : 'icon-blue']">$icoBulletPoint</v-icon>
v-if="iconShow"
small
:class="['mr-1', required ? 'icon-orange' : 'icon-blue']"
>$icoBulletPoint</v-icon
>
{{ label }} {{ label }}
</label> </label>
</v-col> </v-col>
<v-col :cols="label ? textCols : ''"> <v-col :cols="label ? textCols : ''">
<v-checkbox
v-model="chkValue" <a-checkbox v-model="chkValue" :disabled="disabledFlag" :readonly="readonly || false"
:disabled="disabledFlag" :required="required || false" @change="modifyValue">
:readonly="readonly || false" </a-checkbox>
:required="required || false"
:false-value="false"
:color="isDarkMode ? '#fff' : '#1890ff'"
@change="modifyValue"
></v-checkbox>
</v-col> </v-col>
</v-row> </v-row>
</template> </template>
@ -68,10 +59,10 @@ export default {
default: 7, default: 7,
}, },
iconShow: { iconShow: {
type: Boolean, type: Boolean,
require: false, require: false,
default: true default: true
}, },
}, },
data() { data() {
return { return {
@ -103,7 +94,8 @@ export default {
methods: { methods: {
...mapMutations({ setPageData: "setPageData" }), ...mapMutations({ setPageData: "setPageData" }),
modifyValue(e) { modifyValue(e) {
return this.setPageData({ [this.valueNm]: e }); const isChecked = e.target.checked;
return this.setPageData({ [this.valueNm]: isChecked });
}, },
}, },
}; };

2
components/common/DatepickerTimeSelectBox.vue
View File

@ -52,6 +52,7 @@
selectBoxTimeItemList.minInterval ? selectBoxTimeItemList.minInterval : 1 selectBoxTimeItemList.minInterval ? selectBoxTimeItemList.minInterval : 1
" "
@update:propsValue="selectTimeValue1 = $event" @update:propsValue="selectTimeValue1 = $event"
customClass="select-large"
/> />
<!-- <div v-show="isRange" class="mx-3" :style="{ lineHeight: 0 }">~</div> --> <!-- <div v-show="isRange" class="mx-3" :style="{ lineHeight: 0 }">~</div> -->
@ -99,6 +100,7 @@
selectBoxTimeItemList.minInterval ? selectBoxTimeItemList.minInterval : 1 selectBoxTimeItemList.minInterval ? selectBoxTimeItemList.minInterval : 1
" "
@update:propsValue="selectTimeValue2 = $event" @update:propsValue="selectTimeValue2 = $event"
customClass="select-large"
/> />
</div> </div>
</v-col> </v-col>

28
components/common/button/ActionButtons.vue
View File

@ -1,18 +1,10 @@
<template> <template>
<div class="d-flex flex-column justify-center align-center" style="gap: 12px"> <div class="d-flex justify-center align-center"
:class="directionBtn === 'vertically'?'flex-row':'flex-column'"
style="gap: 12px">
<a-button @click="btnActionsFnc('removeRightToLeft')" type="primary" ghost :icon="icons.remove" > <a-button @click="btnActionsFnc('removeRightToLeft')" type="primary" ghost :icon="icons.remove" >
</a-button> </a-button>
<a-button @click="btnActionsFnc('addLeftToRight')" type="primary" ghost :icon="icons.add">
<!--<v-btn
icon
tile
:ripple="false"
class="mt-2"
@click="btnActionsFnc('removeRightToLeft')"
>
<v-icon>mdi-chevron-left</v-icon>
</v-btn> -->
<a-button @click="btnActionsFnc('addLeftToRight')" type="primary" ghost icon="down">
</a-button> </a-button>
</div> </div>
</template> </template>
@ -35,8 +27,18 @@ export default {
type: Function, type: Function,
required: true, required: true,
}, },
directionBtn: {
type: String,
default: "horizontally" //horizontally, vertically.
}
},
computed: {
icons() {
return this.directionBtn === "vertically"
? { remove: "up", add: "down" }
: { remove: "left", add: "right" };
},
}, },
computed: {},
data() { data() {
return {}; return {};
}, },

2
components/common/button/BtnExcelDownload.vue
View File

@ -45,7 +45,7 @@ export default {
size: { size: {
type: String, type: String,
require: false, require: false,
default: "default", // small, middle, large default: "default", // small, default, large
} }
}, },
data() { data() {

8
components/common/modal/ChangeUserPswdPopPage.vue
View File

@ -44,8 +44,7 @@
<v-card-title> <v-card-title>
<span class="custom-title-4">비밀번호 {{ isPassword }}</span> <span class="custom-title-4">비밀번호 {{ isPassword }}</span>
</v-card-title> </v-card-title>
<v-divider></v-divider> <v-card-text class="pb-4">
<v-card-text>
<v-col> <v-col>
<label for="" class="search-box-label"> <label for="" class="search-box-label">
{{ isPassword }}할 비밀번호를 입력하세요 {{ isPassword }}할 비밀번호를 입력하세요
@ -73,11 +72,10 @@
></v-text-field> ></v-text-field>
</v-col> </v-col>
</v-card-text> </v-card-text>
<v-divider></v-divider> <v-card-actions class="pb-4">
<v-card-actions>
<v-spacer></v-spacer> <v-spacer></v-spacer>
<!-- <v-btn color="primary" dark @click="setUpdate()">확인</v-btn> --> <!-- <v-btn color="primary" dark @click="setUpdate()">확인</v-btn> -->
<div> <div class="pr-3">
<a-button @click="close()" class="btn-default">삭제</a-button> <a-button @click="close()" class="btn-default">삭제</a-button>
<a-button type="primary" @click="setUpdate()" class="v-btn-add-text"> <a-button type="primary" @click="setUpdate()" class="v-btn-add-text">
확인 확인

6
components/common/select/SelectBoxTime.vue
View File

@ -22,7 +22,7 @@
outlined outlined
:menu-props="{ auto: true, offsetY: true }" :menu-props="{ auto: true, offsetY: true }"
:hide-details="true" :hide-details="true"
:class="'v-select__custom'" :class="['v-select__custom', customClass]"
:disabled="disabled" :disabled="disabled"
:readonly="readonly" :readonly="readonly"
@click="setDatepickerHide" @click="setDatepickerHide"
@ -106,6 +106,10 @@ export default {
require: false, require: false,
default: 1, default: 1,
}, },
customClass: {
type: String,
require: false,
},
}, },
emits: ["update:propsValue"], emits: ["update:propsValue"],
data() { data() {

2
components/pages/ems/DataSetInfo/DataSetTagRelTab.vue
View File

@ -38,7 +38,7 @@
import { mapState, mapMutations, mapActions } from 'vuex'; import { mapState, mapMutations, mapActions } from 'vuex';
import Buttons from '~/components/common/button/Buttons'; import Buttons from '~/components/common/button/Buttons';
import Grid from '~/components/common/Grid'; import Grid from '~/components/common/Grid';
import { CustumChecbox } from '~/plugins/gridUtility'; import { CustomCheckbox } from '~/plugins/gridUtility';
import { CustomNumberEditor } from '~/plugins/gridUtility'; import { CustomNumberEditor } from '~/plugins/gridUtility';
import Form from '~/components/common/form/Form'; import Form from '~/components/common/form/Form';
import mixinGlobal from '@/mixin/global.js'; import mixinGlobal from '@/mixin/global.js';

60
components/pages/ems/EffcIdxInfo/EffcIdxAddInfoTab.vue
View File

@ -69,55 +69,6 @@ export default {
return { return {
loadGrid: false, loadGrid: false,
gridName: 'effcInfoGrid', gridName: 'effcInfoGrid',
// "effcInfoGrid": {
// data:
// [
// {
// "eqpmKindId": "펌프",
// "eqpmGrpId": "냉각수 시스템",
// "totMethNm": "평균값"
// },
// {
// "eqpmKindId": "모터",
// "eqpmGrpId": "공기압 시스템",
// "totMethNm": "최대값"
// },
// {
// "eqpmKindId": "밸브",
// "eqpmGrpId": "스팀 공급",
// "totMethNm": "합계"
// },
// {
// "eqpmKindId": "센서",
// "eqpmGrpId": "온도 제어",
// "totMethNm": "최소값"
// },
// {
// "eqpmKindId": "컴프레서",
// "eqpmGrpId": "에어 시스템",
// "totMethNm": "중앙값"
// }
// ]
// ,
// column: [
// {
// header: '대상설비종류',
// name: 'eqpmKindId',
// },
// {
// header: '대상설비그룹',
// name: 'eqpmGrpId',
// },
// { header: '집계방법', name: 'totMethNm', align: 'center' },
// ]
// }
// },
itemList: [], itemList: [],
tagTpList: [], tagTpList: [],
// detailList: myDetail, // detailList: myDetail,
@ -388,10 +339,10 @@ 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',
@ -436,7 +387,6 @@ export default {
header: '물리량ID', header: '물리량ID',
name: 'pysclQtyId', name: 'pysclQtyId',
width: 200, width: 200,
align: 'center',
hidden: true, hidden: true,
}, },
{ header: '물리량', name: 'pysclQtyCd', hidden: true, minWidth: 200 }, { header: '물리량', name: 'pysclQtyCd', hidden: true, minWidth: 200 },
@ -445,7 +395,7 @@ export default {
{ header: '가이드지표', name: 'gdIdxId', hidden: true }, { header: '가이드지표', name: 'gdIdxId', hidden: true },
{ header: '가이드지표명', name: 'gdIdxNm', hidden: true }, { header: '가이드지표명', name: 'gdIdxNm', hidden: true },
{ header: '집계방법', name: 'totMeth', hidden: true }, { header: '집계방법', name: 'totMeth', hidden: true },
{ header: '집계방법', name: 'totMethNm', align: 'center' }, { header: '집계방법', name: 'totMethNm',},
]; ];
if (this.selectValue01 == 'PYSCL') { if (this.selectValue01 == 'PYSCL') {

6
components/pages/ems/ErcChrgInfo/ErcChrgInfoTab.vue
View File

@ -20,6 +20,12 @@
</v-card> </v-card>
</v-col> </v-col>
</v-row> </v-row>
<!-- Create the line between date picker and form -->
<v-row class="my-5" no-gutters>
<v-col>
<div style="height: 1px; background-color: #ccc;"></div>
</v-col>
</v-row>
<v-row class="search-box" align="center" no-gutters style="height: 44px;"> <v-row class="search-box" align="center" no-gutters style="height: 44px;">
<v-col :cols="4"> <v-col :cols="4">
<label for="" class="search-box-label"> <label for="" class="search-box-label">

1
components/pages/ems/ReadPlcInfo/ReadPlcAddInfoTab.vue
View File

@ -200,7 +200,6 @@ export default {
{ {
header: 'Data 구분', header: 'Data 구분',
name: 'addInfoDataKind', name: 'addInfoDataKind',
align: 'center',
formatter({ value }) { formatter({ value }) {
let retVal = ''; let retVal = '';
const newValue = addInfoDataKindList.filter( const newValue = addInfoDataKindList.filter(

9
components/pages/ems/ReadPlcInfo/ReadPlcImgInfoTab.vue
View File

@ -7,7 +7,7 @@
</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 :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName" :parentPrgmId="parentPrgmId" @getRowsData="getRowData"
:innerTabGridInfo="innerTabGridInfo" /> :innerTabGridInfo="innerTabGridInfo" />
</div> </div>
<div ref="formParent" style="height: calc((100vh - 400px) /2);"> <div ref="formParent" style="height: calc((100vh - 400px) /2);">
@ -101,9 +101,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',
@ -124,13 +124,12 @@ export default {
const myColumns = [ const myColumns = [
{ header: '회사 ID', name: 'comId', hidden: true }, { header: '회사 ID', name: 'comId', hidden: true },
{ header: '검침개소 번호', name: 'readPlcId', hidden: true }, { header: '검침개소 번호', name: 'readPlcId', hidden: true },
{ header: '대상 검침개소 번호', name: 'objReadPlcId', align: 'center' }, { header: '대상 검침개소 번호', name: 'objReadPlcId'},
{ header: '대상 검침개소명', name: 'objReadPlcNm', align: 'left' }, { header: '대상 검침개소명', name: 'objReadPlcNm', align: 'left' },
{ header: '분배율(1~100)', name: 'distRt', align: 'right' }, { header: '분배율(1~100)', name: 'distRt', align: 'right' },
{ {
header: '가감유형', header: '가감유형',
name: 'ddctKind', name: 'ddctKind',
align: 'center',
formatter({ value }) { formatter({ value }) {
let retVal = ''; let retVal = '';
const newValue = ddctKindList.filter(item => item.value == value); const newValue = ddctKindList.filter(item => item.value == value);

9
components/pages/ems/ReadPlcInfo/ReadPlcTagRelTab.vue
View File

@ -30,7 +30,7 @@
import { mapState, mapMutations, mapActions } from 'vuex'; import { mapState, mapMutations, mapActions } from 'vuex';
import Buttons from '~/components/common/button/Buttons'; import Buttons from '~/components/common/button/Buttons';
import Grid from '~/components/common/Grid'; import Grid from '~/components/common/Grid';
import { CustumChecbox } from '~/plugins/gridUtility'; import { CustomCheckbox } from '~/plugins/gridUtility';
import { CustomNumberEditor } from '~/plugins/gridUtility'; import { CustomNumberEditor } from '~/plugins/gridUtility';
import Form from '~/components/common/form/Form'; import Form from '~/components/common/form/Form';
import mixinGlobal from '@/mixin/global.js'; import mixinGlobal from '@/mixin/global.js';
@ -153,7 +153,6 @@ export default {
{ {
header: '에너지원', header: '에너지원',
name: 'ercId', name: 'ercId',
align: 'center',
width: 100, width: 100,
formatter({ value }) { formatter({ value }) {
let retVal = ''; let retVal = '';
@ -182,10 +181,9 @@ export default {
{ {
header: '대표 TAG 여부', header: '대표 TAG 여부',
name: 'reprTagFg', name: 'reprTagFg',
align: 'center',
width: 100, width: 100,
// renderer: { // renderer: {
// type: CustumChecbox, // type: CustomCheckbox,
// options: { // options: {
// onlyone: true, // onlyone: true,
// // disabled: true // // disabled: true
@ -198,7 +196,6 @@ export default {
{ {
header: '사용여부', header: '사용여부',
name: 'useFg', name: 'useFg',
align: 'center',
width: 100, width: 100,
formatter({ value }) { formatter({ value }) {
value = value === true ? '1' : '0'; value = value === true ? '1' : '0';
@ -214,7 +211,7 @@ export default {
// } // }
// } // }
}, },
{ header: '비고', name: 'rmrk', align: 'left', width: 100 }, { header: '비고', name: 'rmrk', width: 100 },
{ header: '등록 사용자', name: 'regUserNo', hidden: true }, { header: '등록 사용자', name: 'regUserNo', hidden: true },
{ header: '등록 일자', name: 'regDttm', hidden: true }, { header: '등록 일자', name: 'regDttm', hidden: true },
{ header: '수정 사용자', name: 'procUserNo', hidden: true }, { header: '수정 사용자', name: 'procUserNo', hidden: true },

16
pages/comm/auth/MenuRoleMngPage.vue
View File

@ -303,7 +303,7 @@ export default {
//---------------------gridOption 설정 끝---------------------------- //---------------------gridOption 설정 끝----------------------------
//---------------------gridName3의 체크박스 설정 시작---------------------------- //---------------------gridName3의 체크박스 설정 시작----------------------------
class CustumChecbox { class CustomCheckbox {
constructor(props) { constructor(props) {
const el = document.createElement('input'); const el = document.createElement('input');
const { grid, rowKey, columnInfo } = props; const { grid, rowKey, columnInfo } = props;
@ -398,7 +398,7 @@ export default {
name: 'useFg', name: 'useFg',
align: 'center', align: 'center',
renderer: { renderer: {
type: CustumChecbox, type: CustomCheckbox,
}, },
}, },
{ {
@ -406,7 +406,7 @@ export default {
name: 'authCd1', name: 'authCd1',
align: 'center', align: 'center',
renderer: { renderer: {
type: CustumChecbox, type: CustomCheckbox,
}, },
}, },
{ {
@ -414,7 +414,7 @@ export default {
name: 'authCd2', name: 'authCd2',
align: 'center', align: 'center',
renderer: { renderer: {
type: CustumChecbox, type: CustomCheckbox,
}, },
}, },
{ {
@ -422,7 +422,7 @@ export default {
name: 'authCd3', name: 'authCd3',
align: 'center', align: 'center',
renderer: { renderer: {
type: CustumChecbox, type: CustomCheckbox,
}, },
}, },
{ {
@ -430,7 +430,7 @@ export default {
name: 'authCd4', name: 'authCd4',
align: 'center', align: 'center',
renderer: { renderer: {
type: CustumChecbox, type: CustomCheckbox,
}, },
}, },
{ {
@ -438,7 +438,7 @@ export default {
name: 'authCd5', name: 'authCd5',
align: 'center', align: 'center',
renderer: { renderer: {
type: CustumChecbox, type: CustomCheckbox,
}, },
}, },
{ {
@ -446,7 +446,7 @@ export default {
name: 'authCd6', name: 'authCd6',
align: 'center', align: 'center',
renderer: { renderer: {
type: CustumChecbox, type: CustomCheckbox,
}, },
}, },
]; ];

11
pages/comm/auth/UserRoleMngPage.vue
View File

@ -151,6 +151,7 @@
:leftGridName="gridName2" :leftGridName="gridName2"
:rightGridName="gridName3" :rightGridName="gridName3"
:btnActionsFnc="dualGridBtnActions" :btnActionsFnc="dualGridBtnActions"
directionBtn="vertically"
/> />
</v-col> </v-col>
<v-col :cols="12" class="h100"> <v-col :cols="12" class="h100">
@ -981,7 +982,7 @@ const myDetail = blocCdList => {
cols: 6, cols: 6,
labelCols: 12, labelCols: 12,
textCols: 12, textCols: 12,
class: 'py-2 pr-4', class: 'py-2 pl-4',
iconShow: true, iconShow: true,
required: true, required: true,
}, },
@ -1005,7 +1006,7 @@ const myDetail = blocCdList => {
cols: 6, cols: 6,
labelCols: 12, labelCols: 12,
textCols: 12, textCols: 12,
class: 'py-2 pr-4', class: 'py-2 pl-4',
iconShow: true, iconShow: true,
required: true, required: true,
}, },
@ -1031,7 +1032,7 @@ const myDetail = blocCdList => {
cols: 6, cols: 6,
labelCols: 12, labelCols: 12,
textCols: 12, textCols: 12,
class: 'py-2 pr-4', class: 'py-2 pl-4',
iconShow: true, iconShow: true,
}, },
{ {
@ -1054,7 +1055,7 @@ const myDetail = blocCdList => {
cols: 6, cols: 6,
labelCols: 12, labelCols: 12,
textCols: 12, textCols: 12,
class: 'py-2 pr-4', class: 'py-2 pl-4',
iconShow: true, iconShow: true,
placeholder: '시스템 자동입력', placeholder: '시스템 자동입력',
}, },
@ -1078,7 +1079,7 @@ const myDetail = blocCdList => {
cols: 6, cols: 6,
labelCols: 12, labelCols: 12,
textCols: 12, textCols: 12,
class: 'py-2 pr-4', class: 'py-2 pl-4',
iconShow: true, iconShow: true,
placeholder: '시스템 자동입력', placeholder: '시스템 자동입력',
}, },

2
pages/ems/base/DashboardPage.vue
View File

@ -803,7 +803,7 @@ export default {
header: "NO", header: "NO",
name: "rowNum", name: "rowNum",
width: 70, width: 70,
align: "center", align: "right",
// hidden: true, // hidden: true,
}, },
{ {

67
pages/ems/base/EffcIdxMngPage.vue
View File

@ -18,7 +18,7 @@
</v-col> </v-col>
</v-row> </v-row>
<v-row ref="contents" class="pt-2"> <v-row ref="contents" class="pt-2">
<v-col :cols="5" style="height:100%" class="pr-2"> <v-col :cols="5" class="pr-2">
<v-card class="pb-5"> <v-card class="pb-5">
<div class="d-flex align-center justify-space-between pa-4"> <div class="d-flex align-center justify-space-between pa-4">
<v-card-title class="pa-0 custom-title-4">효율지표 리스트</v-card-title> <v-card-title class="pa-0 custom-title-4">효율지표 리스트</v-card-title>
@ -33,11 +33,11 @@
</div> </div>
</v-card> </v-card>
</v-col> </v-col>
<v-col :cols="7" style="height:100%" class="pl-2"> <v-col :cols="7" class="pl-2">
<v-card class="pb-5"> <v-card class="pb-5">
<v-card-title class="custom-title-4 pa-4 pb-2">효율지표 상세 <v-card-title class="custom-title-4 pa-4 pb-2">효율지표 상세
</v-card-title> </v-card-title>
<div class="px-4" style="height:calc(100% - 76px)"> <div class="px-4" >
<v-tabs v-model="tab"> <v-tabs v-model="tab">
<v-tab v-for="item in items" :key="item.id" :disabled="(item.id == 'EffcIdxAddInfoTab' <v-tab v-for="item in items" :key="item.id" :disabled="(item.id == 'EffcIdxAddInfoTab'
? isInfoTabDisabled ? isInfoTabDisabled
@ -162,7 +162,7 @@ import EffcIdxAddInfoTab from '@/components/pages/ems/EffcIdxInfo/EffcIdxAddInfo
import Grid from '~/components/common/Grid'; import Grid from '~/components/common/Grid';
import Utility from '~/plugins/utility'; import Utility from '~/plugins/utility';
import SelectBox from '@/components/common/select/SelectBox'; import SelectBox from '@/components/common/select/SelectBox';
import CheckBox from '~/components/common/checkbox/CheckBox'; import CheckBox from '~/components/common/CheckBox';
import EqpmCalcPop from '~/components/common/modal/EqpmCalcPop'; import EqpmCalcPop from '~/components/common/modal/EqpmCalcPop';
import TextArea from '@/components/common/form/TextArea'; import TextArea from '@/components/common/form/TextArea';
@ -214,64 +214,6 @@ export default {
}, },
], ],
loadGrid: false, loadGrid: false,
// "effcIdxGrid": {
// data: [
// {
// "effcIdxId": "E001",
// "effcIdxNm": "에너지 소비 효율",
// "effcKind": "환경"
// },
// {
// "effcIdxId": "E002",
// "effcIdxNm": "작업 시간 대비 생산량",
// "effcKind": "생산성"
// },
// {
// "effcIdxId": "E003",
// "effcIdxNm": "장비 가동률",
// "effcKind": "운영"
// },
// {
// "effcIdxId": "E004",
// "effcIdxNm": "불량률",
// "effcKind": "품질"
// },
// {
// "effcIdxId": "E005",
// "effcIdxNm": "재고 회전율",
// "effcKind": "물류"
// }
// ]
// ,
// column: [
// {
// header: '효율지표 ID',
// name: 'effcIdxId',
// align: 'center',
// // hidden:true
// },
// {
// header: '효율지표명',
// name: 'effcIdxNm',
// align: 'left',
// minWidth: 150,
// // hidden:true
// },
// {
// header: '효율지표종류',
// name: 'effcKind',
// align: 'left',
// // hidden: true,
// },
// // { header: '등록 사용자', name: 'regUserNo', hidden: true },
// // { header: '등록 일자', name: 'regDttm', hidden: true },
// // { header: '수정 사용자', name: 'procUserNo', hidden: true },
// // { header: '수정 일자', name: 'procDttm', hidden: true },
// ],
// }
// },
initFlag: false, initFlag: false,
selectValueList01: [], selectValueList01: [],
selectValueList02: [], selectValueList02: [],
@ -919,7 +861,6 @@ export default {
{ {
header: '효율지표 ID', header: '효율지표 ID',
name: 'effcIdxId', name: 'effcIdxId',
align: 'center',
// hidden:true // hidden:true
}, },
{ {

25
pages/ems/base/EnrgCostCenterMngPage.vue
View File

@ -4,7 +4,7 @@
<v-col :cols="12"> <v-col :cols="12">
<v-card class="searchFilter"> <v-card class="searchFilter">
<v-row align="center" no-gutters> <v-row align="center" no-gutters>
<v-col :cols="3"> <v-col :cols="2.5">
<component <component
:is="'selectCodeList'" :is="'selectCodeList'"
:parentPrgmId="myPrgmId" :parentPrgmId="myPrgmId"
@ -14,7 +14,7 @@
:addAll="true" :addAll="true"
/> />
</v-col> </v-col>
<v-col :cols="3"> <v-col :cols="2.5">
<component <component
:is="'selectCodeList'" :is="'selectCodeList'"
:parentPrgmId="myPrgmId" :parentPrgmId="myPrgmId"
@ -24,8 +24,8 @@
:addAll="true" :addAll="true"
/> />
</v-col> </v-col>
<v-col :cols="3"> <!-- 사업장 -->
<!-- 사업장 --> <!-- <v-col :cols="3">
<div style="visibility:hidden"> <div style="visibility:hidden">
<component <component
:is="'SelectBlocMstr'" :is="'SelectBlocMstr'"
@ -33,13 +33,8 @@
:parentPrgmId="myPrgmId" :parentPrgmId="myPrgmId"
/> />
</div> </div>
</v-col> </v-col> -->
<v-col :cols="3" class="text-right"> <v-col :cols="2.5">
<BtnSearch @click="search" />
</v-col>
</v-row>
<v-row align="center" no-gutters>
<v-col :cols="3">
<component <component
:is="'selectCodeList'" :is="'selectCodeList'"
:parentPrgmId="myPrgmId" :parentPrgmId="myPrgmId"
@ -49,7 +44,7 @@
:addAll="true" :addAll="true"
/> />
</v-col> </v-col>
<v-col :cols="6"> <v-col :cols="2.5">
<InputText <InputText
:parentPrgmId="myPrgmId" :parentPrgmId="myPrgmId"
label="공정명" label="공정명"
@ -59,6 +54,12 @@
:searchOption="true" :searchOption="true"
/> />
</v-col> </v-col>
<v-col class="text-right">
<BtnSearch @click="search" />
</v-col>
</v-row>
<v-row align="center" no-gutters>
</v-row> </v-row>
</v-card> </v-card>
</v-col> </v-col>

2
pages/ems/base/EnrgReadPlaceMngPage.vue
View File

@ -342,7 +342,6 @@ export default {
header: '개소 종류', header: '개소 종류',
name: 'plcKind', name: 'plcKind',
minWidth: 100, minWidth: 100,
align: 'center',
formatter({ value }) { formatter({ value }) {
let retVal = ''; let retVal = '';
const newValue = _this.pageData.plcKindList.filter( const newValue = _this.pageData.plcKindList.filter(
@ -392,7 +391,6 @@ export default {
header: '사용 여부', header: '사용 여부',
name: 'useFg', name: 'useFg',
minWidth: 100, minWidth: 100,
align: 'center',
formatter({ value }) { formatter({ value }) {
value = value === true ? '1' : '0'; value = value === true ? '1' : '0';
const newValue = _this.pageData.useFgList.filter( const newValue = _this.pageData.useFgList.filter(

2
pages/ems/base/EqpmGrpPysclQtyMngPage.vue
View File

@ -980,7 +980,7 @@ export default {
var columnList = [ var columnList = [
{ header: '회사 ID', name: 'comId', hidden: true }, { header: '회사 ID', name: 'comId', hidden: true },
{ header: '물리량 ID', name: 'pysclQtyId', hidden: true }, { header: '물리량 ID', name: 'pysclQtyId', hidden: true },
{ header: '순번', name: 'argSeq', editor: 'text' }, { header: '순번', name: 'argSeq', editor: 'text', align: 'right' },
{ header: '물리량 ID', name: 'argPysclQtyId' }, { header: '물리량 ID', name: 'argPysclQtyId' },
{ {
header: '설비그룹', header: '설비그룹',

47
pages/ems/base/GdIdxMngPage.vue
View File

@ -9,7 +9,7 @@
<component :is="'SelectBox'" ref="SelectBox1" :propsValue="selectValue01" <component :is="'SelectBox'" ref="SelectBox1" :propsValue="selectValue01"
:itemList="selectValueList01" :label="'설비종류'" :iconShow="true" :itemList="selectValueList01" :label="'설비종류'" :iconShow="true"
@update:propsValue="selectValue01 = $event" :labelCols="12" :textCols="12" @update:propsValue="selectValue01 = $event" :labelCols="12" :textCols="12"
:customClass="'select-large'" /> :customClass="'select-large'" />
</v-col> </v-col>
<v-col :cols="3"> <v-col :cols="3">
<component :is="'SelectBox'" ref="SelectBox2" :propsValue="selectValue02" <component :is="'SelectBox'" ref="SelectBox2" :propsValue="selectValue02"
@ -19,10 +19,11 @@
</v-col> </v-col>
<v-col :cols="3"> <v-col :cols="3">
<InputText :parentPrgmId="myPrgmId" label="가이드명" :textCols="12" valueNm="gdIdxNm" <InputText :parentPrgmId="myPrgmId" label="가이드명" :textCols="12" valueNm="gdIdxNm"
:searchOption="true" :iconShow="true" :labelCols="12" :customClass="'input-large'"/> :searchOption="true" :iconShow="true" :labelCols="12" :customClass="'input-large'" />
</v-col> </v-col>
<v-col :cols="3" class="text-right"> <v-col :cols="3" class="text-right">
<a-button icon="search" type="primary" @click="search()" class="search-button" size="large">조회</a-button> <a-button icon="search" type="primary" @click="search()" class="search-button"
size="large">조회</a-button>
</v-col> </v-col>
</v-row> </v-row>
</v-card> </v-card>
@ -38,13 +39,13 @@
:btnActionsFnc="btnActions" /> :btnActionsFnc="btnActions" />
</div> </div>
<div class="h100 px-4" style="height:calc(100% - 70px)"> <div class="h100 px-4" style="height:calc(100% - 70px)">
<div ref="gridParent" style="height: 30%"> <div ref="gridParent" style="height: 26%">
<component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName" <component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName"
:parentPrgmId="myPrgmId" @getRowsData="getRowData" :dataPath="dataPathExample" /> :parentPrgmId="myPrgmId" @getRowsData="getRowData" :dataPath="dataPathExample" />
</div> </div>
<div class="d-flex py-4 mt-4" > <div class="d-flex py-4 mt-4">
<component :is="'Form'" :parentPrgmId="myPrgmId" :detailList="detailList" <component :is="'Form'" :parentPrgmId="myPrgmId" :detailList="detailList"
@gridEditingFinish="gridEditingFinish" /> @gridEditingFinish="gridEditingFinish" />
</div> </div>
</div> </div>
@ -326,14 +327,12 @@ export default {
header: 'COM ID', header: 'COM ID',
name: 'comId', name: 'comId',
width: 100, width: 100,
aling: 'center',
hidden: true, hidden: true,
}, },
{ {
header: '가이드', header: '가이드',
name: 'gdIdxId', name: 'gdIdxId',
width: 100, width: 100,
align: 'center',
}, },
{ {
header: '가이드명', header: '가이드명',
@ -345,7 +344,6 @@ export default {
header: '설비그룹ID', header: '설비그룹ID',
name: 'eqpmGrpId', name: 'eqpmGrpId',
width: 100, width: 100,
align: 'center',
// hidden: true, // hidden: true,
formatter({ value }) { formatter({ value }) {
let retVal = ''; let retVal = '';
@ -362,7 +360,6 @@ export default {
header: '상위집계방법', header: '상위집계방법',
name: 'upTotMeth', name: 'upTotMeth',
width: 100, width: 100,
align: 'center',
// hidden: true, // hidden: true,
formatter({ value }) { formatter({ value }) {
let retVal = ''; let retVal = '';
@ -524,7 +521,7 @@ export default {
async getRowGridData() { async getRowGridData() {
this.loadGrid = false; this.loadGrid = false;
let res = []; let res = [];
res = await this.postApiReturn({ res = await this.postApiReturn({
apiKey: 'selectEqpmGdIdxDataList', apiKey: 'selectEqpmGdIdxDataList',
resKey: 'eqpmGdIdxDataList', resKey: 'eqpmGdIdxDataList',
@ -1122,14 +1119,7 @@ const myDetail = [
required: true, required: true,
iconShow: true iconShow: true
}, },
// {
// // 공백 처리
// type: 'Label',
// cols: 3,
// class: 'py-2',
// // label: "* '주의기준값' 또는 '경고기준값' 중 하나는 필수로 입력해 주세요.",
// disabled: false,
// },
// { // {
// type: 'CheckBox', // type: 'CheckBox',
// label: '설비기준적용', // label: '설비기준적용',
@ -1195,7 +1185,8 @@ const myDetail = [
// required: true, // required: true,
labelCols: 12, labelCols: 12,
textCols: 12, textCols: 12,
iconShow: true iconShow: true,
inputType: 'number',
}, },
// { // {
// // 공백 처리 // // 공백 처리
@ -1243,7 +1234,15 @@ const myDetail = [
{ {
// 공백 처리 // 공백 처리
type: 'Label', type: 'Label',
cols: 9, cols: 3,
class: 'py-2',
// label: "* '주의기준값' 또는 '경고기준값' 중 하나는 필수로 입력해 주세요.",
disabled: false,
},
{
// 공백 처리
type: 'Label',
cols: 6,
class: 'py-3', class: 'py-3',
// label: "* '주의기준값' 또는 '경고기준값' 중 하나는 필수로 입력해 주세요.", // label: "* '주의기준값' 또는 '경고기준값' 중 하나는 필수로 입력해 주세요.",
disabled: false, disabled: false,
@ -1442,9 +1441,3 @@ const myDetail = [
}, },
]; ];
</script> </script>
<style lang="scss" scoped>
.searchFilter {
border-radius: 6px;
box-shadow: none;
}
</style>

14
pages/ems/base/GdStndMngPage.vue
View File

@ -33,11 +33,11 @@
<v-row ref="contents" class="mt-3"> <v-row ref="contents" class="mt-3">
<v-col :cols="12" style="height: 100%"> <v-col :cols="12" style="height: 100%">
<!-- <v-card class="py-5"> --> <!-- <v-card class="py-5"> -->
<v-card style="height: 60%"> <v-card style="height: auto;">
<div class="d-flex align-center justify-space-between pa-4"> <div class="d-flex align-center justify-space-between pa-4">
<v-card-title class="pa-0 custom-title-4">가이드 정보</v-card-title> <v-card-title class="pa-0 custom-title-4">가이드 정보</v-card-title>
</div> </div>
<div class="d-flex align-end justify-space-between px-4 py-2"> <div class="d-flex align-end justify-space-between px-4 py-2 pb-4">
<v-row :cols="12" class="align-end"> <v-row :cols="12" class="align-end">
<!-- 가이드 및 설비그룹 라인 시작 --> <!-- 가이드 및 설비그룹 라인 시작 -->
<v-col :cols="3" class="pa-2"> <v-col :cols="3" class="pa-2">
@ -116,9 +116,9 @@
</v-card> </v-card>
<v-row style="height: 40%" class="mt-3"> <v-row class="mt-3" >
<v-col :cols="6" style="height: 100%" class="pr-2"> <v-col :cols="6" class="pr-2">
<v-card class="pb-5"> <v-card >
<div class="d-flex align-center justify-space-between pa-4"> <div class="d-flex align-center justify-space-between pa-4">
<v-card-title class="pa-0 custom-title-4 ">설비상세 리스트</v-card-title> <v-card-title class="pa-0 custom-title-4 ">설비상세 리스트</v-card-title>
<Buttons :parentPrgmId="myPrgmId" :bindingData="gridName" :btnActionsFnc="btnActions" /> <Buttons :parentPrgmId="myPrgmId" :bindingData="gridName" :btnActionsFnc="btnActions" />
@ -132,8 +132,8 @@
</div> </div>
</v-card> </v-card>
</v-col> </v-col>
<v-col :cols="6" style="height: 100%" class="pl-2"> <v-col :cols="6" class="pl-2">
<v-card class="pb-5"> <v-card >
<div class="d-flex align-center justify-space-between pa-4"> <div class="d-flex align-center justify-space-between pa-4">
<v-card-title class="pa-0 custom-title-4">설비가이드 기준 정보</v-card-title> <v-card-title class="pa-0 custom-title-4">설비가이드 기준 정보</v-card-title>
</div> </div>

18
pages/ems/effc/EnrgUsePlanPage.vue
View File

@ -10,15 +10,15 @@
</v-col> </v-col>
<v-col :cols="2.5"> <v-col :cols="2.5">
<component :is="'SelectBox'" ref="SelectBox1" :propsValue="selectValue01" :itemList="selectValueList01" <component :is="'SelectBox'" ref="SelectBox1" :propsValue="selectValue01" :itemList="selectValueList01"
:label="'FAB'" @update:propsValue="selectValue01 = $event" :iconShow="false" customClass="select-large" /> :label="'FAB'" @update:propsValue="selectValue01 = $event" :iconShow="true" customClass="select-large" />
</v-col> </v-col>
<v-col :cols="2.5"> <v-col :cols="2.5">
<component :is="'SelectBox'" ref="SelectBox2" :propsValue="selectValue02" :itemList="selectValueList02" <component :is="'SelectBox'" ref="SelectBox2" :propsValue="selectValue02" :itemList="selectValueList02"
:label="'설비종류'" @update:propsValue="selectValue02 = $event" :iconShow="false" customClass="select-large"/> :label="'설비종류'" @update:propsValue="selectValue02 = $event" :iconShow="true" customClass="select-large"/>
</v-col> </v-col>
<v-col :cols="2.5"> <v-col :cols="2.5">
<component :is="'SelectBox'" ref="SelectBox3" :propsValue="selectValue03" :itemList="selectValueList03" <component :is="'SelectBox'" ref="SelectBox3" :propsValue="selectValue03" :itemList="selectValueList03"
:label="'설비그룹'" @update:propsValue="selectValue03 = $event" :iconShow="false" customClass="select-large" /> :label="'설비그룹'" @update:propsValue="selectValue03 = $event" :iconShow="true" customClass="select-large" />
</v-col> </v-col>
<BtnSearch size="large" @click="search" /> <BtnSearch size="large" @click="search" />
@ -33,7 +33,7 @@
<v-row ref="contents"> <v-row ref="contents">
<v-col :cols="12" > <v-col :cols="12" >
<v-card class="pb-5"> <v-card class="pb-5">
<div class="d-flex align-center justify-space-between pa-4"> <div class="d-flex align-center justify-space-between py-4 px-4">
<v-card-title class="pa-0 custom-title-4">설비별 에너지 계획 리스트</v-card-title> <v-card-title class="pa-0 custom-title-4">설비별 에너지 계획 리스트</v-card-title>
<Buttons :parentPrgmId="myPrgmId" :bindingData="gridName" :btnActionsFnc="btnActions" /> <Buttons :parentPrgmId="myPrgmId" :bindingData="gridName" :btnActionsFnc="btnActions" />
</div> </div>
@ -291,7 +291,7 @@ export default {
}, },
}; };
class CustumButton { class CustomButton {
constructor(props) { constructor(props) {
const { grid, rowKey, columnInfo } = props; const { grid, rowKey, columnInfo } = props;
@ -304,7 +304,7 @@ export default {
$(elDiv).addClass('tui-grid-cell-content d-flex justify-space-between'); $(elDiv).addClass('tui-grid-cell-content d-flex justify-space-between');
const el2 = document.createElement('button'); const el2 = document.createElement('button');
$(el2).addClass('edit-btn blue--text'); $(el2).addClass('edit-btn blue--text');
el2.innerText = 'Edit'; el2.innerText = '편집하다';
elDiv.appendChild(el2); elDiv.appendChild(el2);
this.el = elDiv; this.el = elDiv;
@ -352,7 +352,7 @@ export default {
header: 'NO', header: 'NO',
name: 'rowNum', name: 'rowNum',
width: 40, width: 40,
align: 'center', align: 'right',
// hidden: true, // hidden: true,
}, },
{ {
@ -389,7 +389,7 @@ export default {
// `; // `;
// } // }
renderer: { renderer: {
type: CustumButton, type: CustomButton,
options: { options: {
value: '계획수정', value: '계획수정',
}, },
@ -402,7 +402,7 @@ export default {
align: 'center', align: 'center',
hidden: true, hidden: true,
renderer: { renderer: {
type: CustumButton, type: CustomButton,
options: { options: {
value: '계획수정', value: '계획수정',
}, },

210
pages/ems/effc/EqpmIndMntrPage.vue
View File

@ -104,7 +104,6 @@
:is="loadGrid ? 'Grid' : null" :is="loadGrid ? 'Grid' : null"
:gridName="gridName" :gridName="gridName"
:parentPrgmId="myPrgmId" :parentPrgmId="myPrgmId"
@dblClick="gridDoubleClickEvent"
/> />
<!-- <!--
<component <component
@ -143,7 +142,6 @@ import SelectBox from "@/components/common/select/SelectBox";
import SelectCmCycle from "@/components/common/select/SelectCmCycle"; import SelectCmCycle from "@/components/common/select/SelectCmCycle";
import DatePicker from "@/components/common/Datepicker"; import DatePicker from "@/components/common/Datepicker";
import Grid from "~/components/common/Grid"; import Grid from "~/components/common/Grid";
import PageTitle from "@/components/common/PageTitle";
let myTitle; let myTitle;
let myPrgmId; let myPrgmId;
@ -170,7 +168,6 @@ export default {
SelectCmCycle, SelectCmCycle,
DatePicker, DatePicker,
Grid, Grid,
PageTitle,
}, },
data() { data() {
return { return {
@ -204,6 +201,7 @@ export default {
computed: { computed: {
...mapState({ ...mapState({
pageData: (state) => state.pageData[myPrgmId], pageData: (state) => state.pageData[myPrgmId],
isDarkMode: "isDarkMode",
}), }),
fromDt() { fromDt() {
return this.pageData.fromDt; return this.pageData.fromDt;
@ -237,6 +235,16 @@ export default {
await this.search(); await this.search();
} }
}, },
isDarkMode(newVal) {
// Switch mode for 10 tooltips
for (let i = 0; i < 10; i++) {
const tooltipEl = document.getElementById(`tooltipElement_${i}`);
if (tooltipEl) {
tooltipEl.classList.remove("light-mode", "dark-mode");
tooltipEl.classList.add(newVal ? "dark-mode" : "light-mode");
}
}
},
}, },
async beforeCreate() { async beforeCreate() {
myPrgmId = this.$route.query.prgmId; myPrgmId = this.$route.query.prgmId;
@ -357,13 +365,79 @@ export default {
gridInit() { gridInit() {
const gridHeight = this.$refs.gridParent.offsetHeight - 30; const gridHeight = this.$refs.gridParent.offsetHeight - 30;
const _this = this; const _this = this;
// Define custom button
class CustomButton {
constructor(props,pageData) {
const { grid, rowKey, columnInfo } = props;
const gridData = grid.store.data.rawData;
const value = gridData[rowKey][columnInfo.name];
const onClickCallback = columnInfo.renderer.options.onClick;
this.disabled = columnInfo.renderer.options.disabled || false;
const elDiv = document.createElement('div');
elDiv.innerHTML = `<span>${value}</span>`;
$(elDiv).addClass('tui-grid-cell-content d-flex justify-space-between');
const el2 = document.createElement('button');
$(el2).addClass('edit-btn blue--text');
el2.innerText = '보기';
elDiv.appendChild(el2);
this.el = elDiv;
if (!this.disabled && typeof onClickCallback === 'function') {
// click 이벤트
this.el.addEventListener('click', function(event) {
onClickCallback(rowKey);
});
}
}
getElement() {
return this.el;
}
getValue() {
// return this.el.value;
}
mounted() {
// this.el.focus();
}
}
var columnList = [ var columnList = [
{ header: "NO", name: "no", align: "right", width: 80 }, { header: "NO", name: "no", align: "right", width: 80 },
{ header: "fabId", name: "fabId", hidden: true }, { header: "fabId", name: "fabId", hidden: true },
{ header: "FAB", name: "fabNm", align: "left" }, { header: "FAB", name: "fabNm", align: "left" },
{ header: "eqpmGrpId", name: "eqpmGrpId", hidden: true }, { header: "eqpmGrpId", name: "eqpmGrpId", hidden: true },
{ header: "설비그룹", name: "eqpmGrpNm", align: "left", width: 200 }, { header: "설비그룹", name: "eqpmGrpNm", align: "left", width: 200,
// Render custom button to switch page instead of double click on row
renderer: {
type: CustomButton,
options: {
value: '보기',
onClick: (rowKey) => {
const gridInstance = this.$refs[this.gridName].gridInstance;
const eventRowData = gridInstance.invoke("getRow", rowKey);
const data = {
cmCycle: this.pageData.cmCycle,
fromDt: this.pageData.fromDt,
fabId: this.selectValue01,
eqpmKindId: this.selectValue02,
eqpmGrpId: this.selectValue03,
eqpmId: eventRowData.eqpmId,
};
const key = "tick_" + Math.random();
this.$router.push({
name: "ems-effc-EnrgUseEqpmDetlMntrPage",
query: {
prgmId: "PRG0082",
},
params: {
...data,
key: key,
},
});
}
}
}
},
{ header: "eqpmId", name: "eqpmId", hidden: true }, { header: "eqpmId", name: "eqpmId", hidden: true },
{ header: "설비명", name: "eqpmNm", align: "left", width: 200 }, { header: "설비명", name: "eqpmNm", align: "left", width: 200 },
{ {
@ -472,6 +546,10 @@ export default {
}, },
], ],
}, },
pageOptions: {
useClient: true,
perPage: 3,
}
}; };
this.setGridOption({ this.setGridOption({
@ -693,53 +771,83 @@ function numberFormatter({ value }) {
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@for $i from 0 through 9 { ::v-deep {
#gridParent > * { @for $i from 0 through 9 {
// .tui-grid-content-area{ #gridParent > * {
background-color: red; // .tui-grid-content-area{
color: red; background-color: red;
overflow: visible; color: red;
position: relative; overflow: visible;
} position: relative;
#tooltipTargetElement_#{$i} { }
overflow: visible; #tooltipTargetElement_#{$i} {
position: relative; // 테스트3번쨰 overflow: visible;
white-space: nowrap; // 테스트3번쨰 position: relative; // 테스트3번쨰
} white-space: nowrap; // 테스트3번쨰
#tooltipElement_#{$i} { }
display: none; #tooltipElement_#{$i} {
overflow: visible; display: none;
position: relative; overflow: visible;
} position: relative;
#tooltipTargetElement_#{$i}:hover #tooltipElement_#{$i} { }
display: block; #tooltipTargetElement_#{$i}:hover #tooltipElement_#{$i} {
position: absolute; display: block;
min-width: 100%; position: absolute;
bottom: 30px; min-width: 100%;
z-index: 1000000000; bottom: 40px;
align: "center"; z-index: 1000000000;
color: #f2f2f2; align: "center";
background-color: #7f7f7f; color: #f2f2f2;
// width : 77px; background-color: #000000d9;
width: 200%; // width : 77px;
left: -50%; width: 200%;
border-radius: 3px; left: -50%;
word-break: keep-all; border-radius: 4px;
white-space: pre-wrap; padding: 6px 0px;
} word-break: keep-all;
.tui-grid-rside-area { white-space: pre-wrap;
display: none; // Light mode
overflow: visible; &.light-mode {
overflow-x: visible; background-color: #000000d9;
overflow-y: visible; }
} // Dark mode
.tui-grid-header-area { &.dark-mode {
border-style: solid; background-color: #424242;
border-width: 0 0 1px; }
position: relative;
overflow: visible; &::after {
overflow-x: visible; content: "";
overflow-y: visible; position: absolute;
top: 100%;
left: 50%;
margin-left: -6px;
border-width: 6px;
border-style: solid;
}
&.light-mode::after {
border-color: #000000d9 transparent transparent transparent;
}
&.dark-mode::after {
border-color: #424242 transparent transparent transparent;
}
}
.tui-grid-rside-area {
display: none;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
}
.tui-grid-header-area {
border-style: solid;
border-width: 0 0 1px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
}
} }
} }
</style> </style>

4
plugins/gridUtility.js
View File

@ -115,7 +115,7 @@ export class CustomCalcNumberEditor {
} }
} }
export class CustumChecbox { export class CustomCheckbox {
constructor(props) { constructor(props) {
const el = document.createElement('input'); const el = document.createElement('input');
const { grid, rowKey, columnInfo } = props; const { grid, rowKey, columnInfo } = props;
@ -169,7 +169,7 @@ export class CustumChecbox {
} }
} }
export class CustumButton { export class CustomButton {
constructor(props) { constructor(props) {
const el = document.createElement('button'); const el = document.createElement('button');
const { grid, rowKey, columnInfo } = props; const { grid, rowKey, columnInfo } = props;