Compare commits

...

27 Commits

Author SHA1 Message Date
dc43264503 fix bugs change theme model 2025-08-19 14:26:27 +07:00
5abba695b2 optimize-css 2025-08-19 13:43:44 +07:00
dev
a074e0e6e9 Merge pull request 'update code' (#75) from dev-luannv24-fixbug-17 into dev
Reviewed-on: #75
2025-08-19 12:45:53 +09:00
a5c35809fa refactor code 2025-08-19 12:45:19 +09:00
7e9bd540ed update code 2025-08-19 12:32:34 +09:00
dev
08637f6321 Merge pull request 'Update screen 7, 33, 16' (#74) from dev-trungvq7-0729 into dev
Reviewed-on: #74
2025-08-18 17:57:22 +09:00
dev
ce2c3c6c0e Merge pull request 'Fix selection grid s14 + Remove border legend dashboard' (#73) from dev-nghiantt-fix-bugs into dev
Reviewed-on: #73
2025-08-18 17:56:13 +09:00
dev
9d35712f58 Merge branch 'dev' of http://218.237.212.51:30003/gitadmin/sk_fems_ui into dev-trungvq7-0729 2025-08-18 17:50:07 +09:00
dev
41370aa4df Update 1808 2025-08-18 17:50:04 +09:00
d3022582b6 Fix selection grid s14 + Remove border legend dashboard 2025-08-18 17:41:42 +09:00
dev
3c49bd36e9 Merge pull request 'fix bug grid no scroll y margin right' (#72) from dev-manhph1-figbug into dev
Reviewed-on: #72
2025-08-18 16:45:07 +09:00
c6eb2b57b2 fix bug grid no scroll y margin right 2025-08-18 16:31:29 +09:00
dev
5088769914 Merge pull request 'hotfix bug screen 10' (#71) from dev-dungtv-0818 into dev
Reviewed-on: #71
2025-08-18 11:27:28 +09:00
50698ac661 hotfix bug screen 10 2025-08-18 09:25:41 +07:00
dev
c815eae2ca Merge pull request 'Fix bug Screen 13' (#70) from dev-trungvq7-0729 into dev
Reviewed-on: #70
2025-08-18 10:50:01 +09:00
dev
8a9dfd9949 Merge pull request 'fix desgin screen 38' (#69) from dev-manhph1-figbug into dev
Reviewed-on: #69
2025-08-18 10:47:00 +09:00
dev
3155258656 Update 1508 2025-08-18 10:44:55 +09:00
dev
68916550e5 Update 1508 2025-08-18 10:40:46 +09:00
1250b3d3af fix desgin screen 38 2025-08-15 15:52:52 +09:00
dev
be1e0426e0 Merge pull request 'Add paging and button view detail for S1 dashboard + Fix bugs 156 163' (#68) from dev-nghiantt-fix-bugs into dev
Reviewed-on: #68
2025-08-15 10:10:47 +09:00
81a20d2851 Add paging and button view detail for S1 dashboard + Fix bugs 156 163 2025-08-14 17:09:19 +09:00
dev
6353ffba57 Merge pull request 'dev-manhph1-figbug' (#67) from dev-manhph1-figbug into dev
Reviewed-on: #67
2025-08-14 16:00:15 +09:00
dev
ed9150aae8 Merge pull request 'fix bug grid + buttons' (#66) from dev-dungtv-0814 into dev
Reviewed-on: #66
lgtm
2025-08-14 15:54:22 +09:00
270279b0c2 add paging for page 38 2025-08-14 15:51:06 +09:00
9a42291cf4 add paging for page 38 2025-08-14 15:50:01 +09:00
c810139554 fix bug grid + buttons 2025-08-14 12:30:55 +07:00
dev
1a5ec4c6a3 Merge pull request 'fixbug' (#65) from dev-luannv24-fixbug-common-screen17 into dev
Reviewed-on: #65
2025-08-14 12:03:40 +09:00
40 changed files with 724 additions and 591 deletions

View File

@ -1,17 +1,5 @@
// router-tab (header)
@import "./var.scss";
@import "./mixin.scss";
@import "./common/fonts.scss";
@import "./common/text.scss";
@import "./common/input.scss";
@import "./common/button.scss";
@import "./common/grid.scss";
@import "./common/card.scss";
@import "./common/tabs.scss";
@import "./common/numericInput.scss";
@import "./common/pagination.scss";
@import "./common/editor.scss";
html,
body {
@ -231,12 +219,17 @@ a {
.v-application.#{$theme}-mode {
min-width: 1000px;
.ant-checkbox-wrapper.ant-checkbox-wrapper-disabled,
.ant-checkbox-wrapper.ant-checkbox-wraBapper-disabled,
.ant-checkbox-disabled .ant-checkbox-input
{
cursor: default !important;
}
.ant-checkbox-disabled .ant-checkbox-inner
{
background-color: #f5f5f5 !important;
}
.v-list-item__title {
font-family: var(--desktop-normal-font-family, "Inter-Regular", sans-serif) !important;
}
@ -329,74 +322,6 @@ a {
}
}
.router-tab {
.router-tab__header {
background-color: map-deep-get($config, #{$theme}, "router-header");
border-color: map-deep-get($config, #{$theme}, "router-header");
height: 46px;
z-index: 7;
max-width: calc(100vw - 290px);
}
.router-tab__container {
background-color: map-deep-get($config, #{$theme}, "router-container");
}
.router-tab__item {
background-color: map-deep-get($config, #{$theme}, "router-tab-item");
border-color: map-deep-get($config, #{$theme}, "router-tab-item");
color: map-deep-get($config, #{$theme}, "router-tab-item-color");
&:not(.is-active) {
&:hover {
&>span {
color: map-deep-get($config,
#{$theme},
"router-tab-item-hover-color"
);
}
}
}
.v-icon {
color: map-deep-get($config, #{$theme}, "router-tab-item-icon-color");
}
&.is-active {
background-color: map-deep-get($config,
#{$theme},
"router-tab-item-active"
);
border-color: map-deep-get($config,
#{$theme},
"router-tab-item-active-color"
) !important;
color: map-deep-get($config,
#{$theme},
"router-tab-item-active-color"
);
.v-icon {
color: map-deep-get($config,
#{$theme},
"router-tab-item-icon-active-color"
);
}
}
}
.router-tab__slot-end {
.v-btn {
background-color: map-deep-get($config,
#{$theme},
"router-tab-slot-end-button-backgroundColor"
);
box-shadow: none;
}
}
}
.border-bottom-1 {
border-bottom: 1px solid map-deep-get($config, #{$theme}, "border-color");
}

View File

@ -144,11 +144,10 @@
}
&.ant-btn-danger {
&.ant-btn-background-ghost {
color: map-deep-get($config, #{$theme}, "ant-btn-danger-color");
border-color: map-deep-get($config, #{$theme}, "ant-btn-danger-color");
// background: map-deep-get($config, #{$theme}, "ant-btn-danger-color") !important;
color:map-deep-get($config, #{$theme}, "ant-btn-danger-color");
border-color:map-deep-get($config, #{$theme}, "ant-btn-danger-border");
background: map-deep-get($config, #{$theme}, "ant-btn-danger-bg") !important;
}
}

View File

@ -21,11 +21,20 @@
display: none;
}
&-no-scroll-y {
.tui-grid-rside-area {
.tui-grid-header-area,
.tui-grid-summary-area {
margin-right: 0 !important;
}
}
}
&-rside-area {
.tui-grid-header-area,
.tui-grid-summary-area {
margin-right: $scrollbar-width;
margin-right: $scrollbar-width !important;
}
}
@ -80,9 +89,57 @@
}
.tui-grid-cell {
&:last-child {
input[type=checkbox] {
margin-top: 8px;
input[type=checkbox] {
margin-top: 8px;
appearance: none;
-webkit-appearance: none;
width: 16px;
height: 16px;
border: 1px solid;
border-radius: 2px;
cursor: pointer;
position: relative;
&:checked {
&::after {
content: "";
position: absolute;
left: 5px;
top: 1px;
width: 5px;
height: 9px;
border: solid;
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
}
}
}
}
.tui-grid-layer-editing {
input[type=checkbox] {
margin-top: 8px;
appearance: none;
-webkit-appearance: none;
width: 16px;
height: 16px;
border: 1px solid;
border-radius: 2px;
cursor: pointer;
position: relative;
&:checked {
&::after {
content: "";
position: absolute;
left: 5px;
top: 1px;
width: 5px;
height: 9px;
border: solid;
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
}
}
@ -109,6 +166,44 @@
@include theme($theme);
.v-application.#{$theme}-mode {
.enrg-effc {
.tui-grid-rside-area {
.tui-grid-table {
tr {
td:nth-child(4),
td:nth-child(10) {
.tui-grid-cell-content {
color: map-deep-get($config,
#{$theme},
"router-tab-item-active-color"
);
}
}
}
.tui-grid {
&-row-odd,
&-row-even {
&:hover {
>td:nth-child(4),
td:nth-child(10) {
.tui-grid-cell-content {
color: map-deep-get($config,
#{$theme},
"router-tab-item-active-color"
);
}
}
}
}
}
}
}
}
.tui-grid-content-area {
.tui-grid-header-area {
height: auto !important;
@ -152,6 +247,35 @@
#{$theme},
"tui-grid-cell-borderStyle-darkmode"
);
input[type=checkbox] {
border-color: map-deep-get($config,
#{$theme},
"ant-checkbox-border"
);
background: map-deep-get($config,
#{$theme},
"ant-checkbox-bg"
);
&:checked {
background-color: map-deep-get($config,
#{$theme},
"ant-btn-primary-bg"
);
border-color: map-deep-get($config,
#{$theme},
"ant-btn-primary-bg"
);
&::after {
border-color: map-deep-get($config,
#{$theme},
"ant-checkbox-bg"
);
}
}
}
}
}
@ -352,10 +476,20 @@
}
&.tui-grid-layer-editing {
background:map-deep-get($config,
#{$theme},
"tui-grid-cell-insert-color"
);
background: transparent;
// background:map-deep-get($config,
// #{$theme},
// "tui-grid-cell-insert-color"
// );
}
span {
&.custom-link {
color: map-deep-get($config,
#{$theme},
"router-tab-item-active-color"
);
}
}
}
}
@ -405,7 +539,7 @@
&-header-area {
// background-color: none;
border: none;
margin-right: 0 !important;
// margin-right: 0 !important;
background-color: map-deep-get($config,
#{$theme},
"tui-grid-cell-backgroundColor"
@ -592,6 +726,37 @@
&-frozen-border {
background-color: transparent;
}
&-layer-editing {
input[type=checkbox] {
border-color: map-deep-get($config,
#{$theme},
"ant-checkbox-border"
);
background: map-deep-get($config,
#{$theme},
"ant-checkbox-bg"
);
&:checked {
background-color: map-deep-get($config,
#{$theme},
"ant-btn-primary-bg"
);
border-color: map-deep-get($config,
#{$theme},
"ant-btn-primary-bg"
);
&::after {
border-color: map-deep-get($config,
#{$theme},
"ant-checkbox-bg"
);
}
}
}
}
}
[class*="tui-grid-tree-wrapper"] {

View File

@ -2,6 +2,13 @@
// @include theme($theme);
.v-application.#{$theme}-mode {
.pagination-wrapper {
display: flex;
justify-content: center;
align-items: center;
padding: 12px 0;
margin-top: 10px;
}
.ant-pagination-item,
.ant-pagination-prev,

View File

@ -182,6 +182,7 @@
height: calc(100vh - 110px);
max-height: calc(100vh - 115px);
padding: 20px;
background-color: transparent !important;
}
.router-tab__slot-end {
@ -436,6 +437,70 @@
}
}
.router-tab {
.router-tab__header {
background-color: map-deep-get($config, #{$theme}, "router-header");
border-color: map-deep-get($config, #{$theme}, "router-header");
height: 46px;
z-index: 7;
max-width: calc(100vw - 290px);
}
.router-tab__item {
background-color: map-deep-get($config, #{$theme}, "router-tab-item");
border-color: map-deep-get($config, #{$theme}, "router-tab-item");
color: map-deep-get($config, #{$theme}, "router-tab-item-color");
&:not(.is-active) {
&:hover {
&>span {
color: map-deep-get($config,
#{$theme},
"router-tab-item-hover-color"
);
}
}
}
.v-icon {
color: map-deep-get($config, #{$theme}, "router-tab-item-icon-color");
}
&.is-active {
background-color: map-deep-get($config,
#{$theme},
"router-tab-item-active"
);
border-color: map-deep-get($config,
#{$theme},
"router-tab-item-active-color"
) !important;
color: map-deep-get($config,
#{$theme},
"router-tab-item-active-color"
);
.v-icon {
color: map-deep-get($config,
#{$theme},
"router-tab-item-icon-active-color"
);
}
}
}
.router-tab__slot-end {
.v-btn {
background-color: map-deep-get($config,
#{$theme},
"router-tab-slot-end-button-backgroundColor"
);
box-shadow: none;
}
}
}
}
}
}

View File

@ -1,10 +1,3 @@
// @import './var.scss';
// @import './functions.scss';
// @import './mixin.scss';
// @each $theme in dark, light{
// @include theme($theme);
// .v-application.#{$theme}-mode{

View File

@ -166,7 +166,7 @@ $config: (
ant-btn-primary-color: #212224,
ant-btn-danger-bg:#D32029,
ant-btn-danger-border:#D32029,
ant-btn-danger-color:#D32029,
ant-btn-danger-color:#212224,
ant-btn-default-border:#FFFFFF2E,
ant-btn-default-bg:#FFFFFF2E,
ant-btn-default-color:#FFFFFFD9,

View File

@ -112,7 +112,6 @@ export default {
};
</script>
<style lang="scss" scoped>
@import '@/assets/scss/var.scss';
@each $theme in dark, light {
.v-application.#{$theme}-mode {
.mdi-account {

View File

@ -180,8 +180,6 @@ const myDetail = [];
</script>
<style lang="scss" scoped>
@import '@/assets/scss/var.scss';
@import '@/assets/scss/mixin.scss';
::-webkit-scrollbar {
width: 0px;

View File

@ -431,8 +431,6 @@ export default {
};
</script>
<style lang="scss" scoped>
// @import "@/assets/scss/datepicker.scss";
::v-deep {
.tui-timepicker-row {
display: flex;

View File

@ -539,7 +539,6 @@ export default {
};
</script>
<style lang="scss" scoped>
@import "@/assets/scss/datepicker.scss";
::v-deep {
.tui-timepicker-row {

View File

@ -405,8 +405,6 @@ export default {
};
</script>
<style lang="scss" scoped>
@import "@/assets/scss/datepicker.scss";
::v-deep {
.tui-timepicker-row {
display: flex;

View File

@ -355,8 +355,6 @@ export default {
};
</script>
<style lang="scss" scoped>
@import "@/assets/scss/datepicker.scss";
::v-deep {
.tui-timepicker-row {
display: flex;

View File

@ -160,7 +160,6 @@ export default {
},
created() { },
async mounted() {
// console.log(this.dataPath);
if (this.gridName) {
this.gridInstance = this.$refs['tuigrid' + this.gridName];
@ -174,6 +173,10 @@ export default {
this.gridScrollTop = e.target.scrollTop;
this.gridScrollLeft = e.target.scrollLeft;
});
if (!(this.scrollBody.scrollHeight > this.scrollBody.clientHeight)) {
this.gridInstance.$el.getElementsByClassName('tui-grid-content-area')[0].classList.add('tui-grid-no-scroll-y');
}
}
},
methods: {
@ -268,12 +271,9 @@ export default {
});
},
focusChangeEvt(e) {
// console.log('focusChangeEvt1...')
if (this.preventFocusChangeEvent(e)) {
// console.log('prevent focusChangeEvt')
return;
}
// console.log('focusChangeEvt2...')
// cell 선택시 row 선택 method
if (e.rowKey > -1) {
this.$emit(
@ -288,7 +288,6 @@ export default {
this.sendSelectedRowData(e.rowKey);
},
startEditing(e) {
// console.log('startEditing1...')
if (this.preventFocusChangeEvent(e)) {
return;
}
@ -298,7 +297,6 @@ export default {
return;
}
// console.log('startEditing2...')
if (this.editorGrid && e.rowKey >= 0) {
this.editorStartKey = e.rowKey;
this.gridInstance.invoke('startEditing', e.rowKey, e.columnName, 'row-modify');
@ -312,7 +310,6 @@ export default {
}
},
async editingFinish(e) {
// console.log("Editing END E::", e);
// editor 간 이동시 수정되는 문제 수정
// e.rowEditingFg: grid의 한 row를 한번에 수정할 시 각각의 cell 마다 click 이벤트가 발생하지 않아 this.editorStartKey값이 제대로 입력 되지 않는 경우를 대비하여 만든 Fg
if (this.editorGrid) {
@ -335,7 +332,6 @@ export default {
rowKey: rowIdxKey,
};
const isBaseRow = this.isBaseDataRow(rowIdxKey);
// console.log("END E::", rowIdxKey, e);
const rowStat = this.gridInstance.invoke('getRow', rowIdxKey).rowStat;
if (rowStat == 'D') {
this.gridInstance.invoke(
@ -516,10 +512,7 @@ export default {
return item.rowKey == data.rowKey;
});
let count = 0;
// console.log("dataKeyArr", dataKeyArr);
// console.log("selectedRowData", selectedRowData);
for (let i = 0; i < dataKeyArr.length; i++) {
// console.log(dataKeyArr[i], selectedRowData[dataKeyArr[i]], rowData[dataKeyArr[i]]);
if (selectedRowData[dataKeyArr[i]] == rowData[dataKeyArr[i]]) {
count++;
}
@ -589,7 +582,6 @@ export default {
delete item.rowKey;
return item;
});
// console.log("dataArr::", dataArr, saveTargetRows);
return dataArr;
},
getData() {
@ -602,7 +594,6 @@ export default {
return this.gridInstance.invoke('getCheckedRowKeys');
},
setCheck(list) {
// console.log("setCheck:: ", list);
list.map(item => this.gridInstance.invoke('check', item));
},
refreshLayout() {
@ -612,14 +603,11 @@ export default {
// this.gridInstance.invoke('refreshLayout');
},
refreshGrid() {
// console.log("refreshLayout",this.$refs['tuigrid' + this.gridName])
var store = this.$refs['tuigrid' + this.gridName].gridInstance.store;
var containerEl = this.$refs['tuigrid' + this.gridName].$el;
// var containerEl = document.querySelector('.tui-grid-container')
var parentEl = containerEl.parentElement;
// console.log("---------DEBUG---containerEl: ",containerEl);
// console.log('---------DEBUG---parentEl: ', parentEl)
// function refreshLayout(store, containerEl, parentEl) {
var dimension = store.dimension;
var autoWidth = dimension.autoWidth, fitToParentHeight = dimension.fitToParentHeight;
@ -632,11 +620,6 @@ export default {
this.setWidth(store, clientWidth, autoWidth);
// store.dimension.autoWidth = autoWidth;
// store.dimension.width = clientWidth;
// console.log("###",getComputedStyle(parentEl));
// console.log("fitToParentHeight : ",fitToParentHeight);
// console.log("parentEl : ",parentEl)
// console.log("parentEl.clientHeight" , parentEl.clientHeight)
// console.log("clientHeight : ",clientHeight);
if (parentEl && parentEl.clientHeight !== clientHeight) {
var _b = getComputedStyle(parentEl), paddingTop = _b.paddingTop, paddingBottom = _b.paddingBottom;
this.setHeight(store, parentEl.clientHeight - (parseFloat(paddingTop) + parseFloat(paddingBottom)));
@ -644,25 +627,20 @@ export default {
// }
},
setOffsetTop(store, offsetTop) {
// console.log("---------DEBUG---setOffsetTop: ");
store.dimension.offsetTop = offsetTop;
},
setWidth(_a, width, autoWidth) {
// console.log("---------DEBUG---setWidth: ");
var dimension = _a.dimension;
dimension.autoWidth = autoWidth;
dimension.width = width;
},
setHeaderHeight(store, height) {
// console.log("---------DEBUG---setHeaderHeight: ");
store.dimension.headerHeight = height;
},
setOffsetLeft(store, offsetLeft) {
// console.log("---------DEBUG---setOffsetLeft: ");
store.dimension.offsetLeft = offsetLeft;
},
setHeight(_a, height) {
// console.log("---------DEBUG---setHeight: ");
var dimension = _a.dimension;
var headerHeight = dimension.headerHeight, summaryHeight = dimension.summaryHeight, tableBorderWidth = dimension.tableBorderWidth;
dimension.bodyHeight = height - headerHeight - summaryHeight - tableBorderWidth;
@ -691,7 +669,6 @@ export default {
});
},
// resetData() {
// // console.log("resetData = ", this.tuigridProps.data);
// this.$refs.tuigrid.invoke("resetData", this.tuigridProps.data);
// },
},

View File

@ -317,8 +317,6 @@ export default {
};
</script>
<style lang="scss" scoped>
@import "@/assets/scss/datepicker.scss";
::v-deep {
.tui-timepicker-row {
display: flex;

View File

@ -13,6 +13,7 @@ export default {
data() {
return {
mode: null,
// isLoading: false
};
},
computed: {
@ -28,11 +29,10 @@ export default {
setThemeChange: 'setThemeChange',
}),
themeChange() {
// this.isLoading = true;
this.mode = !this.mode;
this.$vuetify.theme.isDark = this.mode;
this.setThemeChange(this.mode);
// console.log(this.mode)
// console.log(this.$vuetify.theme.isDark)
},
},
};

View File

@ -683,7 +683,6 @@ const myColumns = [
</script>
<style lang="scss" scoped>
@import '@/assets/scss/var.scss';
@each $theme in dark, light {
.v-application.#{$theme}-mode {
.tui-grid {

View File

@ -408,7 +408,6 @@ var eqpmDetlPop = {
// 전력량 요금(원/kWh)
</script>
<style lang="scss" scoped>
// @import '@/assets/scss/common/grid.scss';
.tui-grid-scrollbar-left-bottom {
display: none !important;
}

View File

@ -329,7 +329,6 @@ var gdIdxDetPop = {
// 전력량 요금(원/kWh)
</script>
<style lang="scss" scoped>
// @import '@/assets/scss/common/grid.scss';
.tui-grid-scrollbar-left-bottom {
display: none !important;
}

View File

@ -94,7 +94,7 @@
</div>
<v-card-actions class="px-6 py-4 d-flex align-center justify-end">
<a-button :ripple="false" @click="dialogOpenCloseEvent(dialog)" class="mr-2">닫기</a-button>
<a-button :ripple="false" @click="dialogOpenCloseEvent(dialog)" class="ant-btn-popup-default mr-2">닫기</a-button>
<a-button :ripple="false" type="primary" @click="setUpdate($event)">확인</a-button>
</v-card-actions>
</v-card>

View File

@ -8,12 +8,22 @@
</label>
</v-col>
<v-col :cols="option.textCols" class="py-0">
<v-text-field readonly append-icon="" :class="['v-select__custom', customClass]" outlined :hide-details="true"
v-model="selectValue" @keyup.enter="typeEnterKey" @click="dialogOpenCloseEvent(dialog)" style="padding: 0;"
:required="item.required || false"><template v-slot:append>
<!-- Custom SVG icon -->
<v-icon>$icoSearch</v-icon>
</template></v-text-field>
<v-text-field
readonly
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"
>
<template v-slot:append>
<!-- Custom SVG icon -->
<v-icon>$icoSearch</v-icon>
</template>
</v-text-field>
</v-col>
<v-dialog v-model="dialog" scrollable width="1000px">

View File

@ -39,8 +39,6 @@
import { mapState, mapMutations, mapActions } from 'vuex';
import Buttons from '~/components/common/button/Buttons';
import Grid from '~/components/common/Grid';
import { CustomCheckbox } from '~/plugins/gridUtility';
import { CustomNumberEditor } from '~/plugins/gridUtility';
import Form from '~/components/common/form/Form';
import mixinGlobal from '@/mixin/global.js';
import Utility from '~/plugins/utility';
@ -70,18 +68,6 @@ export default {
loadGrid: false,
gridName: 'rowDataSetTagRelGrid',
detailDataSetTagList: myDataSetTagDetail,
dataPathMock: {
"rowDataSetTagRelGrid": {
column: [
{ header: 'TAG ID', name: 'id', headerAlign: 'left' },
{ header: 'TAG 명', name: 'name', headerAlign: 'left' },
{ header: '모델 Data 구분', name: 'type', headerAlign: 'left' }
],
data: dataPathDataExample,
defaultRow: dataPathDataExample,
option: {}
}
},
};
},
computed: {
@ -175,7 +161,7 @@ export default {
header: '사용여부',
name: 'useFg',
align: 'left',
width: 100,
minWidth: 80,
formatter({ value }) {
value = value === true ? '1' : '0';
const newValue = _this.pageData.useFgList.filter(
@ -190,7 +176,7 @@ export default {
// }
// }
},
{ header: '비고', name: 'rmrk', align: 'left' },
{ header: '비고', name: 'rmrk', align: 'left', minWidth: 50, },
];
this.setGridColumn({
@ -324,7 +310,7 @@ const myDataSetTagDetail = [
valueNm: 'tagNm',
disabled: false,
cols: 6,
class: 'py-2 mt-2',
class: 'py-2 mt-1',
required: true,
labelCols: 12,
textCols: 12,
@ -350,12 +336,11 @@ const myDataSetTagDetail = [
valueNm: 'useFg',
disabled: false,
cols: 5,
class: 'py-2 mt-2',
class: 'py-2 mt-1',
value: { '1': true, '0': false },
required: true,
textCols: 12,
iconShow: true,
// class: "d-flex align-end"
},
{
type: 'TextArea',
@ -369,23 +354,4 @@ const myDataSetTagDetail = [
required: false,
},
];
const dataPathDataExample = [
{
id: 'INCHEON.HVAC.EQP_HT_CH001.UT_CH101.CHI_AMP_1A_PV',
name: 'INCHEON 고온 냉동기 101호기 - 호로1',
type: '합계'
},
{
id: 'INCHEON.HVAC.EQP_HT_CH001.UT_CH101.CHI_AMP_1A_PV',
name: 'INCHEON 고온 냉동기 101호기 - 호로1',
type: '합계'
},
{
id: 'INCHEON.HVAC.EQP_HT_CH001.UT_CH101.CHI_AMP_1A_PV',
name: 'INCHEON 고온 냉동기 101호기 - 호로1',
type: '합계'
},
];
</script>

View File

@ -270,12 +270,14 @@ export default {
async getRowData(data, gridName) {
if (data.rowStat === 'I') {
this.detailList[0].disabled = false;
this.detailList[1].disabled = false;
this.detailList[2].disabled = false;
this.detailList[3].disabled = false;
this.detailList[4].disabled = false;
this.detailList[5].disabled = false;
} else {
this.detailList[0].disabled = true;
this.detailList[1].disabled = true;
this.detailList[2].disabled = true;
this.detailList[3].disabled = true;
this.detailList[4].disabled = true;
@ -294,6 +296,7 @@ export default {
case 'add':
this.$refs[this.gridName].addRow();
this.detailList[0].disabled = false;
this.detailList[1].disabled = false;
this.detailList[2].disabled = false;
this.detailList[3].disabled = false;
this.detailList[4].disabled = false;
@ -376,7 +379,6 @@ const myDetail = [
{
type: 'SelectBox',
label: '대상 유형',
disabled: false,
cols: 6,
class: 'pr-4 py-2 mt-1',
list: 'emMapDivList',
@ -392,6 +394,7 @@ const myDetail = [
{
type: 'ReadPlcPop',
label: '대상 항목',
modalTitle:'대상 항목',
valueNm: 'objId',
disabled: true,
cols: 6,
@ -400,8 +403,7 @@ const myDetail = [
bindNm: 'objNm',
labelCols: 12,
textCols: 12,
iconShow: true,
noText: true,
disableContent: true,
iconShow: true,
},
{
@ -480,6 +482,7 @@ const myDetail = [
disabledFg: 'objKind',
labelCols: 12,
textCols: 12,
iconShow: true,
},
{
type: 'InputText',

View File

@ -6,7 +6,7 @@
<v-row>
<v-col :cols="8" style="padding:0px">
<!-- 조회기간 -->
<DatePicker :parentPrgmId="parentPrgmId" label="조회기간" />
<DatePicker :parentPrgmId="parentPrgmId" label="조회기간" customClass="tab-datepicker" />
</v-col>
<v-col cols="4" class="d-flex justify-end align-center">
<Buttons
@ -205,8 +205,8 @@ export default {
header: {
height: 38,
},
rowHeight: 29,
minRowHeight: 29,
rowHeight: 37,
minRowHeight: 37,
selectionUnit: 'row',
editingEvent: 'click',
};
@ -378,3 +378,20 @@ function numberFormatter({ value }) {
return value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
}
</script>
<style lang="scss" scoped>
::v-deep {
.tab-datepicker {
width: 64% !important;
}
.tui-grid-layer-state {
top: 40px !important;
}
.tui-grid-layer-selection,
.tui-grid-cell-content-editor{
height: 36px !important;
// border: none;
}
}
</style>

View File

@ -149,151 +149,6 @@
<v-icon size="20" class="ml-2" v-if="closable" @click.stop="onCloseTab(to)">mdi-close</v-icon>
</template>
<template #end v-if="false">
<v-menu offset-y>
<template v-slot:activator="{ on, attrs }">
<!-- <v-btn :ripple="false" tile class="btn-close" v-bind="attrs" v-on="on">
<span class="body-2">닫기</span>
<v-icon size="20">mdi-chevron-down</v-icon>
</v-btn> -->
<a-button style="width: 80px; height: 36px" class="btn-close">
<span class="body-2">닫기</span>
<v-icon size="20">mdi-chevron-down</v-icon></a-button>
</template>
<v-list class="py-2 btn-close-menu-list" >
<v-list-item class="px-2">
<v-list-item-title @click="delAllTabsData()" class="body-2">전체 닫기</v-list-item-title>
</v-list-item>
<v-list-item class="px-2">
<v-list-item-title @click="deleteSblingsTab()" class="body-2">나머지 닫기</v-list-item-title>
</v-list-item>
</v-list>
</v-menu>
<v-menu offset-y>
<template v-slot:activator="{ on, attrs }">
<!-- <v-btn
:ripple="false"
tile
class="btn-close"
v-bind="attrs"
v-on="on"
style="width: 100px"
>
<span class="body-2">즐겨찾기</span>
<v-icon size="20">mdi-chevron-down</v-icon>
</v-btn> -->
<a-button style="width: 100px; height: 36px" class="btn-close">
<span class="body-2">즐겨찾기</span>
<v-icon size="20">mdi-chevron-down</v-icon></a-button>
</template>
<v-list v-if="myMenuList.length > 0" class="py-2 btn-close-menu-list" >
<v-list-item v-for="item in myMenuList" :key="item.menuId" class="px-2" style="cursor: pointer">
<v-list-item-title @click="moveToMyMenu(item.url, item.menuId, item.prgmId)" class="body-2">{{
item.menuNm
}}</v-list-item-title>
</v-list-item>
</v-list>
</v-menu>
<a-button id="refresh" :style="{
padding: '0',
width: '36px',
height: '36px',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
borderRadius: '4px', // square corners
}" type="text" @click="removeBookMark" v-if="bookmarkBtn == 1">
<span class="material-icons" style="font-size: 17px; vertical-align: middle">star</span>
</a-button>
<a-button id="refresh" :style="{
padding: '0',
width: '36px',
height: '36px',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
borderRadius: '4px', // square corners
}" type="text" @click="addBookMark" v-if="bookmarkBtn == 0">
<span class="material-icons" style="font-size: 17px; vertical-align: middle">star_border</span>
</a-button>
<v-btn style="
background-color: white;
color: #fff;
border: 0.2px solid rgb(217, 217, 217);
" id="refresh" icon tile :ripple="false" @click="refreshTab()">
<v-icon style="color: rgba(0, 0, 0, 0.54)">mdi-refresh</v-icon>
</v-btn>
<v-btn style="
background-color: white;
color: #fff;
border: 0.2px solid rgb(217, 217, 217);
" icon tile :ripple="false" @click="toggle()">
<v-icon style="color: rgba(0, 0, 0, 0.54)" v-if="!fullscreen">mdi-arrow-expand-all</v-icon>
<v-icon style="color: rgba(0, 0, 0, 0.54)" v-else>mdi-arrow-collapse-all</v-icon>
</v-btn>
<!-- <v-btn
icon
tile
:ripple="false"
@click="removeBookMark()"
v-if="bookmarkBtn == 1"
>
<span
class="material-icons"
style="font-size: 17px; vertical-align: middle"
>star</span
>
</v-btn> -->
<!-- <v-btn
icon
tile
:ripple="false"
@click="addBookMark()"
v-if="bookmarkBtn == 0"
>
<span
class="material-icons"
style="font-size: 17px; vertical-align: middle"
>star_border</span
>
</v-btn> -->
<!-- <a-button
id="refresh"
:style="{
padding: '0',
width: '36px',
height: '36px',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
borderRadius: '4px', // square corners
}"
type="text"
@click="refreshTab"
>
<v-icon >mdi-refresh</v-icon>
</a-button> -->
<!-- <a-button id="refresh" type="text" @click="setDrawer" class="icon-button">
    <i class="mdi mdi-crop-free" style="font-size: 20px"></i>  
</a-button>
<a-button type="text" @click="setDrawer" class="icon-button">
    <i class="mdi mdi-crop-free" style="font-size: 20px"></i>  
</a-button> -->
<!-- <a-button
:style="{
padding: '0',
width: '36px',
height: '36px',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
borderRadius: '4px', // square corners
}"
type="text"
@click="toggle"
>
<v-icon v-if="!fullscreen">mdi-arrow-expand-all</v-icon>  
<v-icon v-else>mdi-arrow-collapse-all</v-icon>
</a-button> -->
</template>
</router-tab>
</v-col>
@ -846,5 +701,4 @@ export default {
<style lang="scss" scoped>
@import '@/assets/scss/layout.scss';
</style>

View File

@ -58,9 +58,9 @@ module.exports = {
// Modules: https://go.nuxtjs.dev/config-modules
modules: ['@nuxtjs/axios', '@nuxtjs/dayjs', '@nuxtjs/style-resources' ],
styleResources: {
scss: ['./assets/scss/*.scss'],
},
// styleResources: {
// scss: ['./assets/scss/*.scss'],
// },
proxy: {
"/api/": {
target: "http://0.0.0.0:9999/",

View File

@ -7,41 +7,21 @@
<v-card class="searchFilter">
<v-row align="end" no-gutters>
<v-col :cols="2.5">
<InputText
:parentPrgmId="myPrgmId"
label="배치ID"
valueNm="batchId"
:searchOption="true"
customClass="input-large"
/>
<InputText :parentPrgmId="myPrgmId" label="배치ID" valueNm="batchId" :searchOption="true"
customClass="input-large" />
</v-col>
<v-col :cols="2.5">
<InputText
:parentPrgmId="myPrgmId"
label="배치명"
valueNm="batchNm"
:searchOption="true"
customClass="input-large"
/>
<InputText :parentPrgmId="myPrgmId" label="배치명" valueNm="batchNm" :searchOption="true"
customClass="input-large" />
</v-col>
<v-col :cols="2.5">
<component
:is="'selectCodeList'"
:parentPrgmId="myPrgmId"
:label="'실행 결과'"
:dataKey="'execRsltCd'"
:sendParam="{ commGrpCd: 'CO_BATCH_EXEC_RSLT', useFg: '1' }"
:addAll="true"
customClass="select-large"
/>
<component :is="'selectCodeList'" :parentPrgmId="myPrgmId" :label="'실행 결과'"
:dataKey="'execRsltCd'" :sendParam="{ commGrpCd: 'CO_BATCH_EXEC_RSLT', useFg: '1' }"
:addAll="true" customClass="select-large" />
</v-col>
<v-col :cols="2.5">
<component
:is="'Datepicker'"
:parentPrgmId="myPrgmId"
:label="'조회기간'"
customClass="datepicker-large"
/>
<component :is="'Datepicker'" :parentPrgmId="myPrgmId" :label="'조회기간'"
customClass="datepicker-large" />
</v-col>
<div class="text-right d-flex align-end justify-end pl-9" style="gap: 8px">
<BtnSearch />
@ -54,37 +34,30 @@
<v-row ref="contents">
<!-- 배치 리스트 -->
<v-col :cols="12" style="height:50%">
<v-card class="pb-5 h100">
<v-col :cols="12" style="height:70%">
<v-card class="h100">
<v-card-title>배치 리스트</v-card-title>
<div class="h100" style="height:calc(100% - 70px)">
<div class="h100" style="height:calc(100% - 150px)">
<div ref="gridParent" class="px-5 h100">
<component
:ref="gridName"
:is="loadGrid ? 'Grid' : null"
:parentPrgmId="myPrgmId"
:gridName="gridName"
@getRowsData="getRowData"
/>
<component :ref="gridName" :is="loadGrid ? 'Grid' : null" :parentPrgmId="myPrgmId"
:gridName="gridName" @getRowsData="getRowData" />
</div>
<div class="d-flex align-center justify-center pt-7" v-if="loadGrid && totalCount > 0">
<pagination id="pagination" :total-count="totalCount" :page-num="page" :limit="limit"
@loadData="changeGrid" />
</div>
</div>
</v-card>
</v-col>
<!-- 배치 상세 -->
<v-col :cols="12" style="height:50%">
<v-card class="pb-5 h100">
<v-col :cols="12" style="height:30%">
<v-card class="h100">
<div class="d-flex align-center justify-space-between pa-5">
<v-card-title class="pa-0">배치 상세</v-card-title>
</div>
<div style="height:calc(100% - 50px)">
<div ref="gridParent" class="px-5 h100">
<component
:is="'Form'"
:parentPrgmId="myPrgmId"
:detailList="detailList"
@gridEditingFinish="gridEditingFinish"
/>
</div>
<div style="height:calc(100% - 50px)" class="px-5">
<component :is="'Form'" :parentPrgmId="myPrgmId" :detailList="detailList"
@gridEditingFinish="gridEditingFinish" />
</div>
</v-card>
</v-col>
@ -105,6 +78,7 @@ import Buttons from '~/components/common/button/Buttons';
import Grid from '~/components/common/Grid';
import Form from '~/components/common/form/Form';
import Utility from '~/plugins/utility';
import pagination from '~/components/common/Pagination';
let myTitle;
let myPrgmId;
@ -133,6 +107,7 @@ export default {
BtnSearch,
BtnExcelDownload,
Buttons,
pagination,
},
data() {
return {
@ -141,6 +116,11 @@ export default {
gridName: 'rowGrid',
// rowGridOrigin: [],
detailList: myDetail,
itemsPerPage: 20,
itemsPerPageArray: [10, 20, 30],
limit: 20,
page: 1,
totalCount: 0,
};
},
computed: {
@ -161,7 +141,10 @@ export default {
},
watch: {
chkIsFind(val) {
if (val) this.search();
if (val) {
this.page = 1;
this.search();
}
},
chkExecRsltCd() {
this.setPageData({ isFind: true });
@ -197,17 +180,16 @@ export default {
// chkOpenTabList: "chkOpenTabList"
// }),
init() {
// this.layoutInit();
this.layoutInit();
this.gridInit();
},
// layoutInit() {
// const searchFilterHeight = this.$refs.searchFilter.offsetHeight;
// this.$refs.contents.style.height = `calc(100% - ${searchFilterHeight}px)`;
// },
layoutInit() {
const searchFilterHeight = this.$refs.searchFilter.offsetHeight;
this.$refs.contents.style.height = `calc(100% - 30px - ${searchFilterHeight}px)`;
},
gridInit() {
this.loadGrid = false;
const gridHeight = this.$refs.gridParent.offsetHeight - 30;
const myOptions = {
scrollX: false,
};
@ -219,10 +201,10 @@ export default {
const _this = this;
const myColumns = [
{ header: 'No.', name: 'batchLogSeq', align: 'right', width: 100 },
{ header: '배치ID', name: 'batchId', align: 'right', width: 100 },
{ header: 'No.', name: 'batchLogSeq', align: 'right', width: 90 },
{ header: '배치ID', name: 'batchId', align: 'right', width: 90 },
{ header: '배치명', name: 'batchNm', align: 'left', width: 150 },
{ header: '실행 일자', name: 'execDt', align: 'right', width: 80 },
{ header: '실행 일자', name: 'execDt', align: 'right', width: 70 },
{
header: '실행 결과',
name: 'execRsltCd',
@ -252,9 +234,9 @@ export default {
align: 'center',
width: 160,
},
{ header: '등록자NO', name: 'regUserNo', width: 120 },
{ header: '등록자NO', name: 'regUserNo', width: 100 },
{ header: '등록일시', name: 'regDttm', align: 'center', width: 160 },
{ header: '수정자NO', name: 'procUserNo', width: 120 },
{ header: '수정자NO', name: 'procUserNo', width: 100 },
{ header: '수정일시', name: 'procDttm', align: 'center', width: 160 },
];
@ -274,6 +256,11 @@ export default {
});
},
async getRowGridData() {
this.loadGrid = false;
// this.setGridData({
// gridKey: this.gridName,
// value: [],
// });
const res = await this.postApiReturn({
apiKey: 'selectBatchLog',
resKey: 'batchLogData',
@ -282,8 +269,24 @@ export default {
batchNm: this.pageData.batchNm, // 검색키워드: 배치명
execRsltCd: this.pageData.execRsltCd, //배치 실행 결과
fromDt: this.pageData.fromDt,
limit: this.limit,
page: this.page,
offset: (this.page - 1) * this.limit, // MariaDB Query에서 직접 계산이 안됨
},
});
const res2 = await this.postApiReturn({
apiKey: 'selectBatchLogPageTotal',
resKey: 'batchLogPageTotal',
sendParam: {
batchId: this.pageData.batchId, // 검색키워드: 배치ID
batchNm: this.pageData.batchNm, // 검색키워드: 배치명
execRsltCd: this.pageData.execRsltCd, //배치 실행 결과
fromDt: this.pageData.fromDt,
},
});
this.totalCount = res2[0].totalcount;
const newRes = res.map(item => {
const newObj = {
...item,
@ -302,6 +305,7 @@ export default {
});
this.$nextTick(() => {
this.loadGrid = true;
if (newRes.length > 0) {
this.$refs[this.gridName].focus({
rowKey: this.chkRowGridSelectKey || 0,
@ -361,6 +365,12 @@ export default {
}
return retVal;
},
changeGrid: async function (pageNum, limit) {
this.page = pageNum;
this.limit = limit;
this.search();
},
},
};
@ -428,6 +438,7 @@ const myDetail = [
readonly: true,
cols: 12,
class: 'py-2',
rows: 3
},
];
</script>

View File

@ -41,7 +41,7 @@
<v-card-title>
<span class="custom-title-4">캘린더 미리보기</span>
</v-card-title>
<v-card-actions class="px-5 d-block" >
<v-card-actions class="px-5 d-block">
<Calendar :parentPrgmId="myPrgmId" :gridName="gridName" :headerVisible="false"
:showTitle="false" />
</v-card-actions>
@ -470,71 +470,76 @@ const defaultData = {
};
</script>
<style lang="scss" scoped>
.selectbox:focus {
outline: none;
}
.calendarOption {
box-sizing: border-box;
position: relative;
width: 100%;
height: 100%;
padding: 0;
margin: 0;
}
select.selectbox {
box-sizing: border-box;
position: relative;
width: 100%;
height: 100%;
/* 높이 초기화 */
padding: 0;
margin: 0;
line-height: normal;
/* line-height 초기화 */
font-family: inherit;
/* 폰트 상속 */
border: 0;
// opacity: 0; /* 숨기기 */
// filter:alpha(opacity=0); /* IE8 숨기기 */
// -webkit-appearance: none; /* 네이티브 외형 감추기 */
// -moz-appearance: none;
// appearance: none;
opacity: 1;
/* 숨기기 */
filter: alpha(opacity=1);
/* IE8 숨기기 */
-webkit-appearance: auto;
/* 네이티브 외형 감추기 */
-moz-appearance: auto;
appearance: auto;
}
.tui-grid-layer-editing {
position: absolute;
background: #fff;
// background-image: initial;
// background-position-x: initial;
// background-position-y: initial;
// background-size: initial;
// background-repeat-x: initial;
// background-repeat-y: initial;
// background-attachment: initial;
// background-origin: initial;
// background-clip: initial;
// background-color: rgb(255, 255, 255);
// z-index: 15;
padding: 0;
margin: 0;
/* border-style: solid; */
/* border-width: 1px; */
white-space: nowrap;
border-width: 0px;
// box-sizing: border-box;
}
::v-deep {
.selectbox:focus {
outline: none;
}
.calendarOption {
box-sizing: border-box;
position: relative;
width: 100%;
height: 100%;
padding: 0;
margin: 0;
}
select.selectbox {
box-sizing: border-box;
position: relative;
width: 100%;
height: 100%;
/* 높이 초기화 */
padding: 0;
margin: 0;
line-height: normal;
/* line-height 초기화 */
font-family: inherit;
/* 폰트 상속 */
border: 0;
// opacity: 0; /* 숨기기 */
// filter:alpha(opacity=0); /* IE8 숨기기 */
// -webkit-appearance: none; /* 네이티브 외형 감추기 */
// -moz-appearance: none;
// appearance: none;
opacity: 1;
/* 숨기기 */
filter: alpha(opacity=1);
/* IE8 숨기기 */
-webkit-appearance: auto;
/* 네이티브 외형 감추기 */
-moz-appearance: auto;
appearance: auto;
background: #fff;
border: 1px solid #d9d9d9;
border-radius: 6px;
color: rgba(0,0,0,0.87843);
}
.tui-grid-layer-editing {
position: absolute;
background: #fff;
// background-image: initial;
// background-position-x: initial;
// background-position-y: initial;
// background-size: initial;
// background-repeat-x: initial;
// background-repeat-y: initial;
// background-attachment: initial;
// background-origin: initial;
// background-clip: initial;
// background-color: rgb(255, 255, 255);
// z-index: 15;
padding: 0;
margin: 0;
/* border-style: solid; */
/* border-width: 1px; */
white-space: nowrap;
border-width: 0px;
// box-sizing: border-box;
}
.custom-vc-calender {
.vc-header {
display: none;

View File

@ -60,9 +60,13 @@
<v-card-title class="custom-title-7 pa-0">
파일목록
</v-card-title>
<div v-for="fileData in viewActionData.fileData" :key="fileData.apndFileId" class="file-item" style="background-color: unset;">
<a @click.prevent="downloadFile(fileData)">
<div class="d-flex justify-start search-box-label">
<div v-for="fileData in viewActionData.fileData"
:key="fileData.apndFileId"
:class="['file-item', isDarkMode?'dark':'light']"
style="background-color: unset;"
>
<a @click.prevent="downloadFile(fileData)" class="pa-0">
<div class="d-flex justify-start search-box-label mb-0">
<v-icon>mdi-paperclip</v-icon>
<span class="file-item-name ml-2">{{ fileData.apndFileNm + '.' +
fileData.apndFileExt }}</span>
@ -96,7 +100,8 @@
<v-card-title class="custom-title-7 pa-0">파일첨부</v-card-title>
<div class="" v-if="writeActionData.fileData">
<div v-for="(fileData, index) in writeActionData.fileData" :key="fileData.apndFileId"
class="file-item d-flex justify-space-between">
:class="['file-item d-flex justify-space-between', isDarkMode?'dark':'light']"
>
<div class="file-item-detail">
<v-icon>mdi-paperclip</v-icon>
<span href="#" class="file-item-name">{{ fileData.name }}</span>
@ -144,7 +149,8 @@
<v-card-title class="custom-title-7 pa-0">파일첨부</v-card-title>
<div class="" v-if="replyActionData.fileData">
<div v-for="(fileData, index) in replyActionData.fileData" :key="fileData.apndFileId"
class="file-item d-flex justify-space-between">
:class="['file-item d-flex justify-space-between', isDarkMode?'dark':'light']"
>
<div class="file-item-detail">
<v-icon>mdi-paperclip</v-icon>
<span href="#" class="file-item-name">{{ fileData.name }}</span>
@ -173,7 +179,7 @@
</div>
<!-- 답글 작성 페이지 -->
<!-- 수정 페이지 시작 -->
<div v-if="pageActionFlag == 'update'">
<div v-if="pageActionFlag == 'update'" class="update">
<v-card>
<div class="pa-5">
<v-row align="center" no-gutters>
@ -195,7 +201,8 @@
<v-card-title class="custom-title-7 pa-0">파일첨부</v-card-title>
<div class="" v-if="updateActionData.fileData">
<div v-for="(fileData, index) in updateActionData.fileData" :key="fileData.apndFileId"
class="file-item d-flex justify-space-between">
:class="['file-item d-flex justify-space-between', isDarkMode?'dark':'light']"
>
<div class="file-item-detail">
<v-icon style="font-size: 18px;">mdi-paperclip</v-icon>
<span href="#" class="file-item-name">{{ fileData.name }}</span>
@ -204,9 +211,11 @@
@click="updateActionData.fileData.splice(index, 1)" />
</div>
</div>
<div class="" v-if="updateActionData.currentFileList">
<div class="current-files" v-if="updateActionData.currentFileList">
<div v-for="(fileData, index) in updateActionData.currentFileList"
:key="fileData.apndFileId" class="file-item d-flex justify-space-between">
:key="fileData.apndFileId"
:class="['file-item d-flex justify-space-between', isDarkMode?'dark':'light']"
>
<div class="file-item-detail">
<v-icon style="font-size: 18px;">mdi-paperclip</v-icon>
<span @click.prevent="downloadFile(fileData)" href="#"
@ -1050,17 +1059,6 @@ const defaultData = {
cursor: pointer;
}
.file-item {
width: auto;
margin: 2px 0;
padding: 4px;
background-color: #0000000A;
.file-item-name {
color: #1677FF;
}
}
::v-deep {
.v-input__slot {
padding-left: 8px;
@ -1084,17 +1082,46 @@ const defaultData = {
font-size: 1.0rem !important;
}
.toastui-editor-mode-switch .tab-item.active {
color: #1677FF
}
.toastui-editor-light .toastui-editor-mode-switch .tab-item {
color: #000000E0
}
.v-icon.anticon-delete svg {
width: 14px;
height: 14px;
}
}
@each $theme in dark, light {
@include theme($theme);
::v-deep {
.toastui-editor-#{$theme} {
.toastui-editor-mode-switch {
>.tab-item {
border: none;
background-color: transparent;
color: map-deep-get($config, #{$theme}, "card-title-color") !important;
&.active {
color: map-deep-get($config, #{$theme}, "card-text-info-color") !important;
border-top: 1px solid map-deep-get($config, #{$theme}, "card-text-info-color");
}
}
}
}
}
.file-item {
&.#{$theme} {
width: auto;
margin: 2px 0;
padding: 4px;
background-color: map-deep-get($config, #{$theme}, "v-calendar-day-in-not-month-color");
.file-item-name {
color: map-deep-get($config, #{$theme}, "card-text-info-color");
}
}
}
}
</style>

View File

@ -626,6 +626,3 @@ const myDetail = [
},
];
</script>
<style lang="scss">
@import '@/assets/scss/common.scss';
</style>

View File

@ -512,7 +512,7 @@
<v-col cols="12" sm="12" xl="12" style="height: 300px">
<v-card style="border-radius: 4px" class="pb-5">
<div style="height: 20px"></div>
<div class="h100 px-5" style="height: calc(100% - 30px)">
<div class="h100 px-5" style="height: calc(100% - 70px)">
<div ref="gridParent" class="h100 w100">
<component
:is="loadGrid ? 'Grid' : null"
@ -521,6 +521,16 @@
:ref="gridName"
@dblClick="gridClickEvent"
/>
<div v-if="loadGrid && totalCount > 0" class="pagination-wrapper">
<pagination
id="pagination"
:total-count="totalCount"
:page-num="page"
:limit="limit"
:itemsPerPageArray="itemsPerPageArray"
@loadData="changeGrid"
/>
</div>
</div>
</div>
</v-card>
@ -539,6 +549,7 @@ import DateUtility from "~/plugins/dateUtility";
import Utility from "~/plugins/utility";
import Grid from "~/components/common/Grid";
import Chart from "~/components/common/Chart";
import pagination from "~/components/common/Pagination";
import AntCard from "~/components/common/card/AntCard";
@ -579,7 +590,8 @@ export default {
Chart,
UnusedStatPopPage,
EtcStatPopPage,
PageTitle
PageTitle,
pagination
},
computed: {
...mapState({
@ -697,6 +709,10 @@ export default {
gridName: "dashBoard_grid_01",
loadGrid: false,
itemsPerPageArray: [10, 20, 50],
limit: 10,
page: 1,
totalCount: 0,
isGridLoading: true,
};
},
@ -735,6 +751,11 @@ export default {
}
this.timer = setInterval(this.search, 90000); //15분 주기마다 갱신
},
changeGrid: async function (pageNum, limit) {
this.page = pageNum;
this.limit = limit;
await this.getGridData();
},
async search() {
await new Promise((resolve) => setTimeout(resolve, 1500));
if (this.$router.currentRoute.fullPath == this.myHome.root) {
@ -756,6 +777,41 @@ export default {
// gridHeight = gridHeight*0.9
gridHeight = this.$refs.gridParent.offsetHeight - 35;
}
// 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();
}
}
const myOptions = {
// scrollX: false,
setScroll: true,
@ -840,7 +896,42 @@ export default {
{ header: "주의", name: "careStndVal", align: "right", width: 40 },
{ header: "경고", name: "warnStndVal", align: "right", width: 40 },
{ header: "가이드", name: "totVal", align: "right", width: 40 },
{ header: "알람 내용", name: "alrmMsg", align: "left", resizable: false },
{ header: "알람 내용", name: "alrmMsg", align: "left", resizable: false,
// Render custom button to switch page instead of double click on row
renderer: {
type: CustomButton,
options: {
value: "보기",
onClick: (rowKey) => {
var gridInstance = this.$refs[this.gridName].gridInstance;
var eventRowData = gridInstance.invoke("getRow", rowKey);
var data = {
cmCycle: "CYC_DAY",
fromDt:
eventRowData.totDttm != undefined
? eventRowData.totDttm
: Utility.setFormatDate(new Date(), "YYYY-MM-DD HH:mm"),
fabId: eventRowData.fabId,
eqpmKindId: eventRowData.eqpmKindId,
eqpmGrpId: eventRowData.eqpmGrpId,
eqpmId: eventRowData.eqpmId,
};
var key = "tick_" + Math.random();
this.$router.push({
name: "ems-effc-EnrgUseEqpmDetlMntrPage",
query: {
prgmId: "PRG0082",
// tick:key
},
params: {
...data,
key: key,
},
});
},
},
},
},
{ header: "설비종류", name: "eqpmKindId", align: "left", hidden: true },
{ header: "설비종류", name: "eqpmKindNm", align: "left", hidden: true },
];
@ -855,11 +946,21 @@ export default {
},
async getGridData() {
this.loadGrid = false;
// console
// Get total records of grid
const totalRes = await this.postApiReturn({
apiKey: "selectIssueGdIdxDataPageTotal",
resKey: "issueGdIdxDataPageTotal",
});
this.totalCount = totalRes[0].totalcount;
const res = await this.postApiReturn({
apiKey: "selectIssueGdIdxData",
resKey: "issueGdIdxData",
sendParam: {},
sendParam: {
limit: this.limit,
page: this.page,
offset: (this.page - 1) * this.limit,
},
});
// let fakeData = [
// {
@ -1280,6 +1381,9 @@ export default {
textStyle: {
color: this.isDarkMode ? "#fff" : "#333333",
},
itemStyle: {
borderWidth: 0
}
},
series: seriesData,
};

View File

@ -84,67 +84,64 @@
</v-card>
</v-col>
</v-row>
<v-row >
<v-col :cols="5" class="h100">
<v-card class="pb-5">
<v-card-title class="d-flex justify-space-between align-end">
<span class="tit ft-size_20 ft-weight_600">에너지원 정보</span>
<Buttons
:parentPrgmId="myPrgmId"
:bindingData="gridName"
:detailList="detailList"
:btnActionsFnc="btnActions"
/>
</v-card-title>
<div class="px-5" style="height:calc(100% - 106px)">
<div ref="gridParent" class="w100 h100">
<component
:ref="gridName"
:is="loadGrid ? 'Grid' : null"
:gridName="gridName"
:parentPrgmId="myPrgmId"
@getRowsData="getRowData"
@sendSelectedRowStatInfo="getSelectedRowStatInfo"
:selectedRowDataWatchFlag="true"
/>
</div>
<v-row align="stretch">
<v-col :cols="5">
<v-card class="d-flex flex-column h100">
<v-card-title class="d-flex justify-space-between align-end">
<span class="tit ft-size_20 ft-weight_600">에너지원 정보</span>
<Buttons
:parentPrgmId="myPrgmId"
:bindingData="gridName"
:detailList="detailList"
:btnActionsFnc="btnActions"
/>
</v-card-title>
<div class="px-5" style="height: auto;">
<div ref="gridParent" class="w100">
<component
:ref="gridName"
:is="loadGrid ? 'Grid' : null"
:gridName="gridName"
:parentPrgmId="myPrgmId"
@getRowsData="getRowData"
@sendSelectedRowStatInfo="getSelectedRowStatInfo"
:selectedRowDataWatchFlag="true"
/>
</div>
</div>
</v-card>
</v-col>
<v-col :cols="7" class="h100">
<v-card class="pb-5">
<v-card-title>에너지원 상세</v-card-title>
<div class="px-5" style="min-height: auto;">
<v-tabs v-model="tab">
<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"
class="py-6"
style="min-height: auto;"
>
<v-tab-item v-for="(item, idx) in items" :key="item.id">
<component
v-if="item.id == 'ercInfoTab'"
:is="'Form'"
:parentPrgmId="myPrgmId"
:detailList="detailList"
@gridEditingFinish="gridEditingFinish"
/>
<ErcChrgInfoTab
v-if="item.id == 'ercChrgInfoTab'"
:parentPrgmId="myPrgmId"
:innerTabGridInfo="{ tab, idx }"
/>
</v-tab-item>
</v-tabs-items>
</div>
<v-col :cols="7">
<v-card class="d-flex flex-column h100">
<v-card-title>에너지원 상세</v-card-title>
<div class="px-5" style="height: auto;">
<v-tabs v-model="tab">
<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" class="py-6">
<v-tab-item v-for="(item, idx) in items" :key="item.id">
<component
v-if="item.id == 'ercInfoTab'"
:is="'Form'"
:parentPrgmId="myPrgmId"
:detailList="detailList"
@gridEditingFinish="gridEditingFinish"
/>
<ErcChrgInfoTab
v-if="item.id == 'ercChrgInfoTab'"
:parentPrgmId="myPrgmId"
:innerTabGridInfo="{ tab, idx }"
/>
</v-tab-item>
</v-tabs-items>
</div>
</v-card>
</v-col>
</v-row>

View File

@ -855,7 +855,6 @@ const myDetail = [
];
</script>
<style lang="scss" scoped>
@import '@/assets/scss/common.scss';
::v-deep {
.tui-grid-layer-state {
top: 40px !important;

View File

@ -60,17 +60,23 @@
</v-col>
</v-row>
<v-row ref="contents" class="pt-3">
<v-col :cols="12" style="height: 100%">
<v-col :cols="12" >
<v-card class="pb-5">
<div class="d-flex align-center justify-space-between pa-4">
<v-card-title class="pa-0">설비별 현황 리스트</v-card-title>
</div>
<div class="px-4" style="height:calc(100% - 76px)">
<div ref="gridParent" class="w100 h100">
<div class="px-4" >
<div ref="gridParent" class="w100 h100 enrg-effc">
<component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName"
:parentPrgmId="myPrgmId" :columnClickEventFlag="true" @columnClick="columnClick" />
<div class="d-flex align-center justify-center pa-5 pb-0" v-if="loadGrid && totalCount > 0">
<pagination id="pagination" :total-count="totalCount" :page-num="page" :limit="limit"
@loadData="changeGrid" />
</div>
</div>
</div>
</v-card>
</v-col>
</v-row>
@ -92,6 +98,7 @@ import Datepicker from '~/components/common/Datepicker';
import EqpmSelectPop from '~/components/common/modal/EqpmSelectPop';
import EnrgEffcEqpmDetailPop from '~/components/common/modal/EnrgEffcEqpmDetailPop';
import EnrgEffcGdIdxDetPop from '~/components/common/modal/EnrgEffcGdIdxDetPop';
import pagination from '~/components/common/Pagination';
let myTitle;
let myPrgmId;
@ -124,6 +131,7 @@ export default {
EnrgEffcEqpmDetailPop,
EqpmSelectPop,
EnrgEffcGdIdxDetPop,
pagination
},
data() {
return {
@ -149,7 +157,12 @@ export default {
eqpmGrpFlag: false,
eqpmGdIdxFlag: false,
fabFlag: false,
itemsPerPage: 10,
itemsPerPageArray: [10, 20, 30],
limit: 20,
page: 1,
routeData: {},
totalCount: 0,
};
},
computed: {
@ -377,6 +390,7 @@ export default {
resKey: 'eqpmKindCodeLists',
sendParam: {},
});
if (res.length > 0) {
this.selectValueList01 = await res.map(item => {
return {
@ -680,9 +694,29 @@ export default {
fabId: this.selectValue02,
eqpmKindId: this.selectValue01,
okFg: this.selectValue06,
limit: this.limit,
page: this.page,
offset: (this.page - 1) * this.limit, // MariaDB Query에서 직접 계산이 안됨
},
});
const res2 = await this.postApiReturn({
apiKey: 'selectEnrgEffcEqpmDetlMntrPageTotal',
resKey: 'eqpmDetlDataPageTotal',
sendParam: {
eqpmId: this.selectValue04.eqpmId,
eqpmGrpId: this.selectValue03,
fromDt: this.pageData.fromDt,
toDt: this.pageData.toDt,
gdIdxId: this.selectValue05,
fabId: this.selectValue02,
eqpmKindId: this.selectValue01,
okFg: this.selectValue06,
},
});
this.totalCount = res2[0]?.totalcount;
this.setGridData({
gridKey: this.gridName,
value: res,
@ -722,6 +756,12 @@ export default {
});
}
},
changeGrid: async function (pageNum, limit) {
this.page = pageNum;
this.limit = limit;
this.search();
},
},
};

View File

@ -411,15 +411,3 @@ const defaultData = {
fromDt: Utility.setFormatDate(new Date(), "YYYYMMDD"), // 조회 시작일
};
</script>
<style lang="scss" scoped>
// @import "@/assets/scss/common.scss";
// .echarts::v-deep > div > canvas:hover {
// cursor: pointer;
// }
// ::v-deep{
// .echarts:hover > div:nth-child(1){
// cursor:pointer !important;
// }
// }
</style>

View File

@ -152,16 +152,16 @@
</div>
</div>
</v-row>
<v-row class="pa-1" style="height: 52%; width: 100%">
<v-row class="pa-1" style="height: 45%; width: 100%">
<v-card class="pa-1" style="height: 100%; width: 100%; overflow: hidden">
<div style="height: 15%">
<v-card-title class="d-flex align-center justify-space-between pl-3">
<v-card-title class="d-flex align-center justify-space-between pl-3 pt-2">
<span class="tit ft-size_20 ft-weight_600">가이드 알람정보</span>
</v-card-title>
</div>
<div
ref="gridParent01"
class="pl-3 mt-5"
class="pl-3 mt-3"
style="height: 75%; overflow: hidden;"
>
<component

View File

@ -819,8 +819,6 @@ const defaultData = {
};
</script>
<style lang="scss" scoped>
// @import '@/assets/scss/common.scss';
@import '@/assets/scss/var.scss';
@each $theme in dark, light {
.v-application.#{$theme}-mode {
.tui-grid {

View File

@ -1214,7 +1214,6 @@ const defaultData = {
};
</script>
<style lang="scss" scoped>
@import "@/assets/scss/var.scss";
::v-deep {
.datepicker-container {

View File

@ -200,8 +200,6 @@ export default {
};
</script>
<style lang="scss" scoped>
@import '@/assets/scss/var.scss';
@import '@/assets/scss/mixin.scss';
::v-deep {
.v-avatar {

View File

@ -281,6 +281,7 @@ const INIT_URL_STATE = {
// prgmId: "PRG0020" 배치로그
selectBatchLog: 'comm/base/BatchLogCtr/selectBatchLog', // 배치 로그
selectBatchLogPageTotal: 'comm/base/BatchLogCtr/selectBatchLogPageTotal', // 배치 로그
// prgmId: "PRG0017" 검침개소 기간별 비교
selectSameReadPlcTime: 'ems/base/sameReadPlcCtr/selectSameReadPlcTime',
@ -942,6 +943,8 @@ const INIT_URL_STATE = {
//prgmId : PRG0084 설비별 운전가이드
selectEqpmCodeList: 'ems/effc/EnrgEffcEqpmDetlMntrCtr/selectEqpmCodeList',
selectEnrgEffcEqpmDetlMntr:'ems/effc/EnrgEffcEqpmDetlMntrCtr/selectEnrgEffcEqpmDetlMntr',
selectEnrgEffcEqpmDetlMntrPageTotal:
'ems/effc/EnrgEffcEqpmDetlMntrCtr/selectEnrgEffcEqpmDetlMntrPageTotal', // 일일검침정보
selectEqpmDetailPop: 'ems/effc/EnrgEffcEqpmDetlMntrCtr/selectEqpmDetailPop',
selectEnrgEffcGdIdxDetPop : 'ems/effc/EnrgEffcEqpmDetlMntrCtr/selectEnrgEffcGdIdxDetPop',
@ -969,4 +972,5 @@ const INIT_URL_STATE = {
selectTodayNgTopTen: 'ems/base/DashboardCtr/selectTodayNgTopTen',
selectCompareEqpmTGdChart: 'ems/base/DashboardCtr/selectCompareEqpmTGdChart',
selectIssueGdIdxData: 'ems/base/DashboardCtr/selectIssueGdIdxData',
selectIssueGdIdxDataPageTotal: 'ems/base/DashboardCtr/selectIssueGdIdxDataPageTotal',
};