updatecode

fixbug
Merge pull request 'Update screen 13, grid color' (#64 ) from dev-trungvq7-0729 into dev
2025-08-14 12:01:07 +09:00 · 2025-08-14 11:34:02 +09:00 · 2025-08-13 19:02:06 +09:00 · 2025-08-13 18:20:59 +09:00 · 2025-08-13 17:14:44 +09:00 · 2025-08-13 17:14:39 +09:00
33 changed files with 348 additions and 263 deletions
--- a/assets/images/SwapRight.svg
+++ b/assets/images/SwapRight.svg
@ -0,0 +1,3 @@
+<svg width="15" height="14" viewBox="0 0 15 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.4369 8.15117L10.1947 5.30742C10.1538 5.25551 10.1017 5.21353 10.0423 5.18464C9.98285 5.15575 9.91764 5.14071 9.85156 5.14062H8.96562C8.87402 5.14062 8.82344 5.2459 8.87949 5.31836L10.8523 7.82031H2.57812C2.51797 7.82031 2.46875 7.86953 2.46875 7.92969V8.75C2.46875 8.81016 2.51797 8.85938 2.57812 8.85938H12.0924C12.4588 8.85938 12.6625 8.43828 12.4369 8.15117Z" fill="black" fill-opacity="0.45"/>
+</svg>
--- a/assets/images/SwapRight_Dark.svg
+++ b/assets/images/SwapRight_Dark.svg
@ -0,0 +1,3 @@
+<svg width="15" height="14" viewBox="0 0 15 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.4369 8.15117L10.1947 5.30742C10.1538 5.25551 10.1017 5.21353 10.0423 5.18464C9.98285 5.15575 9.91764 5.14071 9.85156 5.14062H8.96562C8.87402 5.14062 8.82344 5.2459 8.87949 5.31836L10.8523 7.82031H2.57812C2.51797 7.82031 2.46875 7.86953 2.46875 7.92969V8.75C2.46875 8.81016 2.51797 8.85938 2.57812 8.85938H12.0924C12.4588 8.85938 12.6625 8.43828 12.4369 8.15117Z" fill="white" fill-opacity="0.45"/>
+</svg>
--- a/assets/scss/common.scss
+++ b/assets/scss/common.scss
@ -231,6 +231,35 @@ a {
  .v-application.#{$theme}-mode {
    min-width: 1000px;

+    .ant-checkbox-wrapper.ant-checkbox-wrapper-disabled,
+    .ant-checkbox-disabled .ant-checkbox-input
+    {
+      cursor: default !important;
+    }
+
+    .v-list-item__title {
+      font-family: var(--desktop-normal-font-family, "Inter-Regular", sans-serif) !important;
+    }
+
+    .btn-close-menu-list {
+      min-width: 100px;
+      border-color: transparent;
+      background-color: map-deep-get($config, #{$theme}, "btn-header-select-bg") !important;
+  
+      .v-list-item {
+        min-height: 30px;
+      }
+  
+      .v-list-item__title {
+        color: map-deep-get($config, #{$theme}, "btn-header-select-color") !important;
+  
+        &:hover {
+          color: #46c0ff !important;
+          cursor: pointer;
+        }
+      }
+    }
+
    .icon-datepicker-color {
      color: map-deep-get($config, #{$theme}, "icon-datepicker-color");
    }
@ -253,16 +282,12 @@ a {
      color: map-deep-get($config, #{$theme}, "v-select-label-color");
    }

-    // .header {
-    //   background-color: map-deep-get($config, #{$theme}, "header-backgroud");
-    //   border-bottom: 1px solid map-deep-get($config, #{$theme}, "v-header-border");
-    // }
-
    .custom-chart{
      border: 1px solid map-deep-get($config, #{$theme}, "v-chart-border");
    }

    .v-icon {
+      color: currentColor;
      &.icon-orange {
        svg {
          fill:map-deep-get($config,
@ -574,6 +599,7 @@ a {
        & th,
        & td {
          height: 48px;
+          color: map-deep-get($config, #{$theme}, "tui-datepicker-calendar-color");
        }
      }

@ -811,6 +837,7 @@ a {
      font-size: 2rem;
      font-weight: bold;
      padding-left: 8px;
+      margin-top: 2px;

      img {
        width: 139px;
@ -827,20 +854,11 @@ a {
  .btn-close-menu-list {
    min-width: 100px;
    border-color: transparent;
-    background-color: map-deep-get($config, #{$theme}, "btn-header-select-bg") !important;

    .v-list-item {
      min-height: 30px;
    }

-    .v-list-item__title {
-      color: map-deep-get($config, #{$theme}, "btn-header-select-color");
-
-      &:hover {
-        color: #46c0ff;
-      }
-    }
-
    .v-btn {
      background-color: transparent !important;
      color: map-deep-get($config, #{$theme}, "btn-header-select-color") !important;
--- a/assets/scss/common/button.scss
+++ b/assets/scss/common/button.scss
@ -144,10 +144,11 @@
      }

      &.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-border");
-          background: map-deep-get($config, #{$theme}, "ant-btn-danger-bg") !important;
+          border-color: map-deep-get($config, #{$theme}, "ant-btn-danger-color");
+          // background: map-deep-get($config, #{$theme}, "ant-btn-danger-color") !important;
        }
      }

--- a/assets/scss/common/grid.scss
+++ b/assets/scss/common/grid.scss
@ -62,9 +62,11 @@
  }


+
 }

 .tui-grid-table {
+
  .tui-grid-cell-header,
  .tui-grid-cell-has-input .tui-grid-cell-content {
    padding: 8px;
@ -76,6 +78,14 @@
    }

  }
+
+  .tui-grid-cell {
+    &:last-child {
+      input[type=checkbox] {
+        margin-top: 8px;
+      }
+    }
+  }
 }

 .treeGrid {
@ -155,6 +165,7 @@
        width: auto !important;

        .tui-grid-table-container {
+
          // width: 100% !important;
          .tui-grid-table {
            // width: 100% !important;
@ -166,6 +177,13 @@
            // }
          }
        }
+
+        .tui-grid-layer-editing {
+          border-color: map-deep-get($config,
+            #{$theme},
+            "tui-grid-border-vertical-color"
+          );
+        }
      }

      &-summary-area,
@ -285,6 +303,7 @@
              #{$theme},
              "ant-btn-primary-color"
            );
+
            .radio-mark {
              border-color: map-deep-get($config,
                #{$theme},
@ -294,6 +313,7 @@
                #{$theme},
                "arow-line-btn-bg-color"
              );
+
              &::after {
                content: "";
                position: absolute;
@ -311,6 +331,33 @@
            }
          }
        }
+
+        .tui-grid-cell-content {
+
+          input[type='text'],
+          input[type='password'] {
+            border-color: map-deep-get($config,
+              #{$theme},
+              "v-input-fieldset-color"
+            );
+            background: map-deep-get($config,
+              #{$theme},
+              "v-input-backgroundColor"
+            );
+            border-radius: 4px;
+            color: map-deep-get($config,
+              #{$theme},
+              "tui-grid-cell-color"
+            );
+          }
+
+          &.tui-grid-layer-editing {
+            background:map-deep-get($config,
+              #{$theme},
+              "tui-grid-cell-insert-color"
+            );
+          }
+        }
      }

      &-cell {
@ -395,14 +442,14 @@
          background-color: map-deep-get($config,
            #{$theme},
            "tui-grid-cell-insert-color"
-          );
+          ) !important;
        }

        &.row-modify {
          background-color: map-deep-get($config,
            #{$theme},
            "tui-grid-cell-modify-color"
-          );
+          ) !important;
        }

        &.row-removed {
@ -497,6 +544,7 @@

      &-tree-button-expand {
        z-index: 9999;
+
        .tui-grid-btn-tree {
          i {
            width: 16px;
@ -516,6 +564,7 @@

      &-tree-button-collapse {
        z-index: 9999;
+
        .tui-grid-btn-tree {
          i {
            width: 16px;
--- a/assets/scss/common/pagination.scss
+++ b/assets/scss/common/pagination.scss
@ -10,7 +10,7 @@
      // box-shadow: none !important;
      background-color: map-deep-get($config, #{$theme}, "paging-background") !important;
      color: map-deep-get($config, #{$theme}, "paging-text") !important;
-      border: 0.5px solid #424242;
+      border: none;

      .ant-pagination-item-link {
        border: none;
@ -19,13 +19,13 @@
    }

    .ant-pagination-item-active {
-      border-color: #1890ff !important;
+      border: 1px solid #1890ff !important;
      color: #1890ff !important
    }

    .ant-pagination-options-size-changer {
      .ant-select-selection {
-        border: 0.5px solid #424242;
+        border: 0.5px solid map-deep-get($config, #{$theme}, "v-input-fieldset-color") !important;
        background: map-deep-get($config, #{$theme}, "paging-background") !important;
        color: map-deep-get($config, #{$theme}, "paging-text") !important;
      }
--- a/assets/scss/layout.scss
+++ b/assets/scss/layout.scss
@ -79,6 +79,8 @@
            &>.v-treeview-node__root:before {
              border-radius: 6px;
              z-index: -1;
+              background-color: rgba(0, 0, 0, 0);
+              transition-duration: 0s;
            }
    
            &>.v-treeview-node__root:hover:before {
@ -379,11 +381,6 @@
              .v-treeview-node__children {
                .v-treeview-node {
                  >.v-treeview-node__root {
-                    .v-treeview-node__content {
-                      .v-treeview-node__label {
-                        color: map-deep-get($config, #{$theme}, "card-default-color");
-                      }
-                    }
                    
                    *:hover,
                    :hover {
@ -391,9 +388,14 @@
                    }
  
                    &:hover {
+                      background-color: rgba(0, 0, 0, 0);
+                      
+                      &:before {
+                        opacity: 1 !important;
                        border: 1px solid  map-deep-get($config, #{$theme}, "v-input-textarea-border");
                        border-radius: 8px;
-                      background-color: rgba(0, 0, 0, 0);
+                      }
+
                      .v-treeview-node__content {
                        .v-treeview-node__label {
                          color: map-deep-get($config, #{$theme}, "tui-grid-title-color");
@ -418,6 +420,12 @@
                      }
                    }
  
+                    .v-treeview-node__content {
+                      .v-treeview-node__label {
+                        color: map-deep-get($config, #{$theme}, "card-default-color");
+                      }
+                    }
+
                  }
                }
  
--- a/assets/scss/var.scss
+++ b/assets/scss/var.scss
@ -113,7 +113,7 @@ $config: (
    tui-grid-cell-color: #FFFFFFD9,
    tui-grid-cell-insert-color: #2B2111,
    tui-grid-cell-selected-color: #0A224F,
-    tui-grid-cell-modify-color: #13636c,
+    tui-grid-cell-modify-color: #2B2111,
    tui-grid-cell-removed-color: #2A1215,
    tui-grid-cell-disabled-color: rgb(170, 170, 170),
    tui-grid-cell-hover-backgroundColor: #2d4571,
@ -166,7 +166,7 @@ $config: (
    ant-btn-primary-color: #212224,
    ant-btn-danger-bg:#D32029,
    ant-btn-danger-border:#D32029,
-    ant-btn-danger-color:#212224,
+    ant-btn-danger-color:#D32029,
    ant-btn-default-border:#FFFFFF2E,
    ant-btn-default-bg:#FFFFFF2E,
    ant-btn-default-color:#FFFFFFD9,
@ -263,7 +263,7 @@ $config: (
    tui-grid-cell-color: #000000E0,
    tui-grid-cell-insert-color: #FFFBE6,
    tui-grid-cell-selected-color: #E6F4FF,
-    tui-grid-cell-modify-color: #e6f5f7,
+    tui-grid-cell-modify-color: #FFFBE6,
    tui-grid-cell-removed-color: #FFF1F0,
    tui-grid-cell-hover-backgroundColor: #f5f5f5,
    v-tabs-items-border-color: #0000000F,
--- a/components/common/Datepicker.vue
+++ b/components/common/Datepicker.vue
@ -23,14 +23,14 @@
 						<v-icon size="20" v-show="!isRange">$icoCalendar</v-icon>
 					</template> -->
 					<template v-slot:append>
-						<a-icon class="v-icon" type="calendar" style="width: 14px; height: 14px;" />
+						<a-icon v-show="!isRange" class="v-icon" type="calendar" style="width: 14px; height: 14px;" />
 					</template>
 					<template #append-outer>
 						<div ref="startpicker-container" id="startpicker-container"></div>
 					</template>
 				</v-text-field>
 				<div v-if="isRange" class="mx-3" :style="{ lineHeight: 0 }">
-					<img :src="arrowIcon" alt="">
+					<img :src="arrowIcon">
 				</div>
 				<v-text-field
 					v-show="isRange"
@ -43,7 +43,9 @@
 					outlined
 				>
 					<template #append>
-						<v-icon size="20">$icoCalendar</v-icon>
+						<div class="pr-1">
+							<a-icon class="v-icon" type="calendar" style="width: 14px; height: 14px;" />
+						</div>
 					</template>
 					<template #append-outer>
 						<div ref="endpicker-container" id="endpicker-container"></div>
@ -212,9 +214,9 @@ export default {
 		},
 		arrowIcon() {
 			if(this.isDarkMode){
-				return require('@/assets/images/arrow_datepicker_dm.png');
+				return require('@/assets/images/SwapRight_Dark.svg');
 			}
-			return require('@/assets/images/arrow_datepicker.png');
+			return require('@/assets/images/SwapRight.svg');
 		}
 	},
 	watch: {
--- a/components/common/DatepickerTopView.vue
+++ b/components/common/DatepickerTopView.vue
@ -5,10 +5,7 @@
 				<!-- <v-icon x-small :color="required ? '#fb8200' : 'primary'" class="mr-1"
 					>mdi-record-circle</v-icon
 				> -->
-				<v-icon
-					small
-					:class="['mr-1', required ? 'icon-orange' : 'icon-blue']"
-					>
+				<v-icon small :class="['mr-1', required ? 'icon-orange' : 'icon-blue']">
 					$icoBulletPoint
 				</v-icon>
 				{{ label }}
@ -16,17 +13,11 @@
 		</v-col>
 		<v-col :cols="label ? textCols : ''">
 			<div class="datepicker-container">
-				<v-text-field
-					id="startpicker"
-					ref="startpicker"
-					v-model="fromDtValue"
-					:class="isRange ? 'v-input__custom half' : 'v-input__custom'"
-					:hide-details="true"
-					readonly
-					outlined
-				>
-					<template #append >
-						<v-icon size="20" v-show="!isRange">$icoCalendar</v-icon>
+				<v-text-field id="startpicker" ref="startpicker" v-model="fromDtValue"
+					:class="isRange ? 'v-input__custom half' : 'v-input__custom'" :hide-details="true" readonly
+					outlined>
+					<template v-slot:append>
+						<a-icon v-show="!isRange" class="v-icon" type="calendar" style="width: 14px; height: 14px;" />
 					</template>
 					<template #append-outer>
 						<div ref="startpicker-container" id="startpicker-container"></div>
@ -36,18 +27,13 @@
 				<div v-show="isRange" class="mx-3" :style="{ lineHeight: 0 }">
 					<img :src="arrowIcon" alt="">
 				</div>
-				<v-text-field
-					v-show="isRange"
-					id="endpicker"
-					ref="endpicker"
-					v-model="toDtValue"
-					:class="isRange ? 'v-input__custom half' : 'v-input__custom'"
-					:hide-details="true"
-					readonly
-					outlined
-				>
+				<v-text-field v-show="isRange" id="endpicker" ref="endpicker" v-model="toDtValue"
+					:class="isRange ? 'v-input__custom half' : 'v-input__custom'" :hide-details="true" readonly
+					outlined>
 					<template #append>
-						<v-icon size="20">$icoCalendar</v-icon>
+						<div class="pr-1">
+							<a-icon class="v-icon" type="calendar" style="width: 14px; height: 14px;" />
+						</div>
 					</template>
 					<template #append-outer>
 						<div ref="endpicker-container" id="endpicker-container"></div>
@ -183,7 +169,8 @@ export default {
 				toDt: Utility.setFormatDate(
 					this.searchParam.toDt,
 					this.myOptions.viewFormat,
-			)};
+				)
+			};
 		},
 		fromDtChange() {
 			return {
@ -191,7 +178,8 @@ export default {
 				fromDt: Utility.setFormatDate(
 					this.searchParam.fromDt,
 					this.myOptions.viewFormat,
-			)};
+				)
+			};
 		},
 		defaultRange() {
 			return this.searchParam.defaultRange
@ -206,9 +194,9 @@ export default {
 		},
 		arrowIcon() {
 			if (this.isDarkMode) {
-				return require('@/assets/images/arrow_datepicker_dm.png');
+				return require('@/assets/images/SwapRight_Dark.svg');
 			}
-			return require('@/assets/images/arrow_datepicker.png');
+			return require('@/assets/images/SwapRight.svg');
 		}
 	},
 	watch: {
@ -424,6 +412,7 @@ export default {
 		display: flex;
 		justify-content: space-around;
 		background-color: #edf4fc;
+
 		.tui-timepicker-column.tui-timepicker-colon {
 			color: #000 !important;
 		}
--- a/components/common/Grid.vue
+++ b/components/common/Grid.vue
@ -301,7 +301,7 @@ export default {
 			// console.log('startEditing2...')
 			if (this.editorGrid && e.rowKey >= 0) {
 				this.editorStartKey = e.rowKey;
-				this.gridInstance.invoke('startEditing', e.rowKey, e.columnName);
+				this.gridInstance.invoke('startEditing', e.rowKey, e.columnName, 'row-modify');
 				this.$emit(
 					'getRowsData',
 					this.gridInstance.invoke('getRow', e.rowKey),
--- a/components/common/PastRsltDatePicker.vue
+++ b/components/common/PastRsltDatePicker.vue
@ -3,24 +3,18 @@
 		<v-col v-if="label" :cols="labelCols">
 			<label for="" class="search-box-label">
 				<v-icon small color="primary"
-				:class="['mr-1', required ? 'icon-orange' : 'icon-blue']"
-				>$icoBulletPoint</v-icon>
+					:class="['mr-1', required ? 'icon-orange' : 'icon-blue']">$icoBulletPoint</v-icon>
 				{{ label }}
 			</label>
 		</v-col>
 		<v-col :cols="label ? textCols : ''">
 			<div :class="['datepicker-container', customClass]">
-				<v-text-field
-					id="startpicker"
-					ref="startpicker"
-					v-model="fromDtValue"
-					:class="isRange ? 'v-input__custom half' : 'v-input__custom'"
-					:hide-details="true"
-					readonly
-					outlined
-				>
+				<v-text-field id="startpicker" ref="startpicker" v-model="fromDtValue"
+					:class="isRange ? 'v-input__custom half' : 'v-input__custom'" :hide-details="true" readonly
+					outlined>
 					<template #append>
-						<v-icon size="20" v-show="!isRange">$icoCalendar</v-icon>
+						<a-icon class="v-icon" v-show="!isRange" type="calendar" style="width: 14px; height: 14px;" />
+						<!-- <v-icon size="20" v-show="!isRange">$icoCalendar</v-icon> -->
 					</template>
 					<template #append-outer>
 						<div ref="startpicker-container" id="startpicker-container"></div>
@ -29,18 +23,13 @@
 				<div v-if="isRange" class="mx-3" :style="{ lineHeight: 0 }">
 					<img :src="arrowIcon" alt="">
 				</div>
-				<v-text-field
-					v-show="isRange"
-					id="endpicker"
-					ref="endpicker"
-					v-model="toDtValue"
-					:class="isRange ? 'v-input__custom half' : 'v-input__custom'"
-					:hide-details="true"
-					readonly
-					outlined
-				>
+				<v-text-field v-show="isRange" id="endpicker" ref="endpicker" v-model="toDtValue"
+					:class="isRange ? 'v-input__custom half' : 'v-input__custom'" :hide-details="true" readonly
+					outlined>
 					<template #append>
-						<v-icon size="20">$icoCalendar</v-icon>
+						<div class="pr-1">
+							<a-icon class="v-icon" type="calendar" style="width: 14px; height: 14px;" />
+						</div>
 					</template>
 					<template #append-outer>
 						<div ref="endpicker-container" id="endpicker-container"></div>
@ -98,6 +87,7 @@ export default {
 			searchParam(state) {
 				return state.pageData[this.parentPrgmId];
 			},
+			isDarkMode: "isDarkMode",
 		}),
 		myCmCycle() {
 			return this.searchParam.cmCycle;
@ -139,9 +129,9 @@ export default {
 		},
 		arrowIcon() {
 			if (this.isDarkMode) {
-				return require('@/assets/images/arrow_datepicker_dm.png');
+				return require('@/assets/images/SwapRight_Dark.svg');
 			}
-			return require('@/assets/images/arrow_datepicker.png');
+			return require('@/assets/images/SwapRight.svg');
 		}
 	},
 	watch: {
@ -334,6 +324,7 @@ export default {
 		display: flex;
 		justify-content: space-around;
 		background-color: #edf4fc;
+
 		.tui-timepicker-column.tui-timepicker-colon {
 			color: #000 !important;
 		}
--- a/components/common/chartoptions/GaugeChart.js
+++ b/components/common/chartoptions/GaugeChart.js
@ -2,15 +2,13 @@
 export default function getGaugeChartOption({ title, min = 0, max = 160, unit = '%', isDarkMode = false, backgroundRadius = 97 }) {
    const colorRanges = isDarkMode
        ? [
-            [0.375, '#49AA19'], // Dark Green
-            // [0.5, '#B8860B'],   // Dark Yellow
-            [0.625, '#D89614'], // Dark Orange
+            [60 / 160, '#49AA19'], // Dark Green
+            [100 / 160, '#D89614'], // Dark Orange
            [1, '#D32029'],     // Dark Red
        ]
        : [
-            [0.375, '#52C41A'], // Light Green
-            // [0.5, '#FFD700'],   // Light Yellow
-            [0.625, '#FAAD14'], // Light Orange
+            [60 / 160, '#52C41A'], // Light Green
+            [100 / 160, '#FAAD14'], // Light Orange
            [1, '#F5222D'],     // Light Red
        ];
    // Old color range
@ -56,6 +54,7 @@ export default function getGaugeChartOption({ title, min = 0, max = 160, unit =
                endAngle: -45,
                min: min,
                max: max,
+                splitNumber: 8,
                // progress: {
                //   show: true,
                //   width: 15,
--- a/components/common/chartoptions/LineChart.js
+++ b/components/common/chartoptions/LineChart.js
@ -34,6 +34,8 @@ export default function getLineChartOption({
        legend: {
            // data: legendData,
            icon: 'circle',
+            itemWidth: 15, // Width of the legend icon
+            itemHeight: 15, 
            top: '0%',
            right: '5%',
            orient: 'horizontal',
--- a/components/common/modal/ElecPowChrgPop.vue
+++ b/components/common/modal/ElecPowChrgPop.vue
@ -17,20 +17,24 @@
 				{{ item.label }}
 			</label>
 		</v-col>
-		<v-col :cols="label ? item.textCols : ''">
+		<v-col :cols="label ? item.textCols : ''" class="py-0">
 			<!-- <v-col :cols="label ? 9 : ''"> -->
 			<!-- :value="textfield" -->
 			<v-text-field
 				readonly
 				v-model="selectValue"
-				append-icon="mdi-magnify"
 				class="v-input__custom"
 				@click="dialog = !dialog"
 				outlined
 				:hide-details="true"
 				:disabled="item.disabled || false"
 				:required="item.required || false"
-			></v-text-field>
+			>
+			<template v-slot:append>
+				<!-- Custom SVG icon -->
+				<v-icon>$icoSearch</v-icon>
+			</template>
+			</v-text-field>
 		</v-col>

 		<!-- <v-row justify="center"> -->
--- a/components/common/modal/PlanPop.vue
+++ b/components/common/modal/PlanPop.vue
@ -238,7 +238,13 @@ export default {
 			type: Object,
 			require: false,
 			default: () => {
-				return {};
+				return {
+					selectTimeValue1: "00 : 00", // selectBoxTime에 필요한 prop
+					selectTimeValueList1: [], // selectBoxTime에 필요한 prop
+					selectTimeValue2: "01 : 00", // selectBoxTime에 필요한 prop
+					selectTimeValueList2: [], // selectBoxTime에 필요한 prop
+					minInterval: 10,
+				};
 			},
 		},
 	},
--- a/components/common/modal/ReadPlcPop.vue
+++ b/components/common/modal/ReadPlcPop.vue
@ -1,5 +1,5 @@
 <template>
-	<v-row class="search-box" align="center">
+	<v-row class="search-box" align="center" no-gutters>
 		<!-- <v-col v-if="label" cols="2"> -->
 		<v-col v-if="item.label" :cols="item.labelCols" class="py-0">
 			<label for="" class="search-box-label">
--- a/components/common/select/SelectBoxTime.vue
+++ b/components/common/select/SelectBoxTime.vue
@ -20,7 +20,7 @@
        item-value="value"
        solo
        outlined
-        :menu-props="{ auto: true, offsetY: true }"
+        :menu-props="{ top: false, offsetY: true }"
        :hide-details="true"
        :class="['v-select__custom', customClass]"
        :disabled="disabled"
--- a/components/icons/icoSend.vue
+++ b/components/icons/icoSend.vue
@ -1,5 +1,5 @@
 <template>
 <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M15.4899 7.76897L0.552358 0.279682C0.491643 0.249325 0.422 0.242182 0.355929 0.258253C0.282599 0.276381 0.219441 0.322828 0.180282 0.387423C0.141124 0.452017 0.129156 0.529497 0.147 0.602896L1.68629 6.89218C1.7095 6.98682 1.77914 7.06361 1.872 7.09397L4.5095 7.99932L1.87379 8.90468C1.78093 8.93682 1.71129 9.01182 1.68986 9.10647L0.147 15.4047C0.130929 15.4708 0.138072 15.5404 0.168429 15.5993C0.238072 15.7404 0.4095 15.7975 0.552358 15.7279L15.4899 8.28147C15.5452 8.25468 15.5899 8.20825 15.6184 8.15468C15.6881 8.01182 15.6309 7.8404 15.4899 7.76897ZM1.90771 13.6154L2.80593 9.94397L8.07736 8.13504C8.11843 8.12075 8.15236 8.08861 8.16664 8.04575C8.19164 7.97075 8.15236 7.8904 8.07736 7.86361L2.80593 6.05647L1.91129 2.39932L13.1256 8.02254L1.90771 13.6154Z" fill="white"/>
+  <path d="M15.4899 7.76897L0.552358 0.279682C0.491643 0.249325 0.422 0.242182 0.355929 0.258253C0.282599 0.276381 0.219441 0.322828 0.180282 0.387423C0.141124 0.452017 0.129156 0.529497 0.147 0.602896L1.68629 6.89218C1.7095 6.98682 1.77914 7.06361 1.872 7.09397L4.5095 7.99932L1.87379 8.90468C1.78093 8.93682 1.71129 9.01182 1.68986 9.10647L0.147 15.4047C0.130929 15.4708 0.138072 15.5404 0.168429 15.5993C0.238072 15.7404 0.4095 15.7975 0.552358 15.7279L15.4899 8.28147C15.5452 8.25468 15.5899 8.20825 15.6184 8.15468C15.6881 8.01182 15.6309 7.8404 15.4899 7.76897ZM1.90771 13.6154L2.80593 9.94397L8.07736 8.13504C8.11843 8.12075 8.15236 8.08861 8.16664 8.04575C8.19164 7.97075 8.15236 7.8904 8.07736 7.86361L2.80593 6.05647L1.91129 2.39932L13.1256 8.02254L1.90771 13.6154Z" fill="currentColor"/>
 </svg>
 </template>
--- a/components/pages/ems/EccInfo/EccIaoTab.vue
+++ b/components/pages/ems/EccInfo/EccIaoTab.vue
@ -99,18 +99,16 @@ export default {
 		selectedObjId(val) {
 			if (val === 'TAG') {
 				this.detailList[1].class = 'd-none ';
-				this.detailList[2].class = 'd-block pl-4';
+				this.detailList[2].class = 'd-block pl-4 mt-2';
 				this.detailList[3].class = 'd-block';
+				this.detailList[4].class = 'pl-4 mt-2';
 			} else {
 				// }else if(val==="READ_PLC"){
+				this.detailList[4].class = 'pl-4 mt-2';
 				this.detailList[3].class = 'd-block';
 				this.detailList[2].class = 'd-none';
-				this.detailList[1].class = 'd-block pl-4';
+				this.detailList[1].class = 'd-block pl-4 mt-1 pb-0';
 			}
-			this.detailList[4].class = 'pl-4 mt-2';
-			
-			console.log(val)
-			console.log(this.detailList)
 		},
 	},
 	created() {},
@ -380,7 +378,7 @@ const myDetail = [
 		label: '대상 유형',
 		disabled: false,
 		cols: 6,
-		class: 'pr-4',
+		class: 'pr-4 py-2 mt-1',
 		list: 'emMapDivList',
 		valueNm: 'objKind',
 		itemText: 'commCdNm',
@ -395,7 +393,7 @@ const myDetail = [
 		type: 'ReadPlcPop',
 		label: '대상 항목',
 		valueNm: 'objId',
-		disabled: false,
+		disabled: true,
 		cols: 6,
 		class: 'pl-4 py-2',
 		required: true,
@ -482,7 +480,6 @@ const myDetail = [
 		disabledFg: 'objKind',
 		labelCols: 12,
 		textCols: 12,
-		iconShow: true,
 	},
 	{
 		type: 'InputText',
--- a/components/pages/ems/ErcChrgInfo/ErcChrgInfoTab.vue
+++ b/components/pages/ems/ErcChrgInfo/ErcChrgInfoTab.vue
@ -21,9 +21,9 @@
 			</v-col>
 		</v-row>
 		<!-- Create the line between date picker and form -->
-		<v-row class="my-5" no-gutters>
+		<v-row class="mt-6 mb-7" no-gutters>
 			<v-col>
-				<div style="height: 1px; background-color: #ccc;"></div>
+				<div style="height: 1px; background-color: #0000000F;"></div>
 			</v-col>
 		</v-row>
 		<v-row class="search-box" align="center" no-gutters style="height: 44px;">
@ -43,7 +43,7 @@
 				<div
 					ref="gridParent"
 					class="w100"
-					style="height: calc((100vh - 600px) / 2);"
+					style="height: calc((100vh - 500px) / 2);"
 				>
 					<Grid
 						:ref="gridName"
@ -57,7 +57,7 @@
 				</div>
 			</v-col>
 		</v-row>
-		<v-row class="search-box" align="center" no-gutters style="height: 44px;">
+		<v-row class="search-box mt-2" align="center" no-gutters style="height: 44px;">
 			<v-col :cols="4">
 				<label for="" class="search-box-label">
 					<!-- <v-icon x-small color="primary" class="mr-1"
@ -77,7 +77,7 @@
 				<div
 					ref="chartParent"
 					class="h100 w100"
-					style="height: calc((100vh - 600px) / 2  - 30px);"
+					style="height: calc((100vh - 500px) / 2);"
 				>
 					<component
 						class="w100 h100"
--- a/pages/comm/auth/UserRoleMngPage.vue
+++ b/pages/comm/auth/UserRoleMngPage.vue
@ -912,17 +912,6 @@ const myColumns = [
 ];

 const unAsgnRoleByUserColumns = [
-	{
-		header: '',
-		name: '',
-		align: 'center',
-		width: 50,
-		formatter: (props) => {
-			return `<label class="custom-radio">
-						<span class="radio-mark"></span>
-					</label>`;
-		}
-	},	
 	{ header: '역할ID', name: 'roleId', align: 'left' },
 	{ header: '역할명', name: 'roleNm' },
 	{ header: '적용시작일', name: 'aplyStartDt', hidden: true },
@ -932,8 +921,7 @@ const unAsgnRoleByUserColumns = [
 ];

 const asgnRoleByUserColumns = [
-	
-	{ header: '역할ID', name: 'roleId', align: 'center' },
+	{ header: '역할ID', name: 'roleId', align: 'left' },
 	{ header: '역할명', name: 'roleNm' },
 	{
 		header: '적용시작일',
--- a/pages/comm/base/NoticeMngPage.vue
+++ b/pages/comm/base/NoticeMngPage.vue
@ -105,15 +105,17 @@
 										@click="writeActionData.업로드fileData.splice(index, 1)" />
 								</div>
 							</div>
-							<a-button class="mt-2" icon="upload" @click="$refs.writeInputFile.$refs.input.click()">
+							<a-button class="ant-btn-popup-default mt-3" color="primary" icon="upload" @click="$refs.writeInputFile.$refs.input.click()">
 								업로드
 							</a-button>
 							<v-file-input ref="writeInputFile" v-model="writeActionData.fileData" multiple outlined
 								hide-input class="d-none" prepend-icon="mdi-tray-arrow-up"></v-file-input>
 						</v-col>
 						<v-col :cols="12" class="text-right">
-							<a-button @click="writePageButtonGroupClickEvent('cancel')" :ripple="false"
-								class="mr-2">취소</a-button>
+							<a-button @click="writePageButtonGroupClickEvent('cancel')" 
+								:ripple="false"
+								class="ant-btn-popup-default mr-2" 
+								color="primary" >취소</a-button>
 							<a-button @click="writePageButtonGroupClickEvent('write')" :ripple="false"
 								type="primary">등록</a-button>
 						</v-col>
@ -151,7 +153,7 @@
 									@click="replyActionData.fileData.splice(index, 1)" />
 							</div>
 						</div>
-						<a-button class="mt-3" icon="upload" @click="$refs.replyInputFile.$refs.input.click()">
+						<a-button class="ant-btn-popup-default mt-3" color="primary" icon="upload" @click="$refs.replyInputFile.$refs.input.click()">
 							업로드
 						</a-button>
 						<v-file-input ref="replyInputFile" multiple show-size v-model="replyActionData.fileData"
@ -159,7 +161,10 @@
 						</v-file-input>
 					</v-col>
 					<v-col :cols="12" class="text-right">
-						<a-button @click="replyPageButtonGroupClickEvent('cancel')" :ripple="false">취소</a-button>
+						<a-button @click="replyPageButtonGroupClickEvent('cancel')" 
+							class="ant-btn-popup-default mr-2" 
+							color="primary"
+							:ripple="false">취소</a-button>
 						<a-button @click="replyPageButtonGroupClickEvent('reply')" :ripple="false"
 							type="primary">등록</a-button>
 					</v-col>
@ -212,7 +217,7 @@
 										@click="addFileToDeleteFileList(fileData)" />
 								</div>
 							</div>
-							<a-button class="mt-2" icon="upload" @click="$refs.updateInputFile.$refs.input.click()">
+							<a-button class="ant-btn-popup-default mt-2" color="primary" icon="upload" @click="$refs.updateInputFile.$refs.input.click()">
 								업로드
 							</a-button>
 							<v-file-input ref="updateInputFile" multiple show-size v-model="updateActionData.fileData"
@ -220,7 +225,10 @@
 							</v-file-input>
 						</v-col>
 						<v-col :cols="12" class="text-right">
-							<a-button @click="updatePageButtonGroupClickEvent('cancel')">취소</a-button>
+							<a-button @click="updatePageButtonGroupClickEvent('cancel')" 
+								class="ant-btn-popup-default mr-2" 
+								color="primary"
+							>취소</a-button>
 							<a-button @click="updatePageButtonGroupClickEvent('update')" type="primary">등록</a-button>
 						</v-col>
 					</v-row>
--- a/pages/ems/base/DashboardPage.vue
+++ b/pages/ems/base/DashboardPage.vue
@ -1196,7 +1196,8 @@ export default {
            show: false,
          },
          left: "22%",
-          radius: ["50%", "80%"], // Bigger inner and outer radius
+          bottom: "23",
+          radius: ["67%", "97%"], // Bigger inner and outer radius
          center: ["60%", "50%"], // Shift chart slightly right to make room for legend
          itemStyle: {
            borderColor: "#fff", // Color of the gap
@ -1272,7 +1273,10 @@ export default {
          top: "middle",
          type: "scroll",
          orient: "vertical",
-          left: "left",
+          left: "20",
+          icon: 'rect',     
+          itemWidth: 15, // Width of the legend icon
+          itemHeight: 15, 
          textStyle: {
            color: this.isDarkMode ? "#fff" : "#333333",
          },
--- a/pages/ems/base/EnrgReadPlaceMngPage.vue
+++ b/pages/ems/base/EnrgReadPlaceMngPage.vue
@ -63,7 +63,7 @@
 						<v-tabs-items v-model="tab" style="height: calc(100% - 65px);" class="pt-6 py-2">
 							<v-tab-item v-for="(item, idx) in items" :key="item.id">
 								<component v-if="item.id == 'readPlcBaseInfoTab'" :is="'Form'" :parentPrgmId="myPrgmId"
-									:detailList="detailList" :bindingData="gridName"
+									:detailList="f" :bindingData="gridName"
 									@gridEditingFinish="gridEditingFinish" />
 								<ReadPlcAddInfoTab v-if="item.id == 'readPlcAddInfoTab'" :parentPrgmId="myPrgmId"
 									:innerTabGridInfo="{ tab, idx }" />
--- a/pages/ems/base/EnrgResourceCenterMngPage.vue
+++ b/pages/ems/base/EnrgResourceCenterMngPage.vue
@ -835,7 +835,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pr-4',
+		class: 'py-3 pr-4',
 		required: false,
 		placeholder: '시스템 자동입력',
 	},
@ -848,7 +848,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pl-4',
+		class: 'py-3 pl-4',
 		required: true,
 	},
 	{
@ -860,7 +860,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pr-4',
+		class: 'py-3 pr-4 mt-2',
 		list: 'ercKindList',
 		itemText: 'commCdNm',
 		itemValue: 'commCd',
@ -875,7 +875,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pl-4',
+		class: 'py-3 pl-4 mt-2',
 		list: 'readObjList',
 		itemText: 'readObjNm',
 		itemValue: 'readObjId',
@ -890,7 +890,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pr-4',
+		class: 'py-3 pr-4 mt-2',
 		list: 'chrgKindList',
 		itemText: 'commCdNm',
 		itemValue: 'commCd',
@ -905,7 +905,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pl-4',
+		class: 'py-3 pl-4 mt-2',
 	},
 	{
 		type: 'InputText',
@ -916,7 +916,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pr-4',
+		class: 'py-3 pr-4 mt-2',

 	},
 	{
@ -928,7 +928,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pl-4',
+		class: 'py-3 pl-4 mt-2',
 		list: 'blocMstrList',
 		itemText: 'blocNm',
 		itemValue: 'blocId',
@ -944,7 +944,7 @@ const myDetail = [
 		textCols: 12,
 		iconShow: true,
 		// class: 'py-2',
-		class: 'pb-0 mb-0 pr-4',
+		class: 'pb-0 mb-0 pr-4 mt-2',
 		disableContent: true,
 	},
 	{
@ -956,7 +956,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pl-4',
+		class: 'pb-0 mb-0 pl-4 mt-2',
 	},
 	{
 		type: 'InputText',
@ -981,7 +981,7 @@ const myDetail = [
 		disabled: false,
 		cols: 6,
 		iconShow: true,
-		class: 'py-2 pr-4',
+		class: 'py-3 pr-4 mt-2',
 		value: { '1': true, '0': false },
 	},
 	{
@ -991,7 +991,7 @@ const myDetail = [
 		disabled: false,
 		cols: 6,
 		iconShow: true,
-		class: 'py-2 pl-4',
+		class: 'py-3 pl-4 mt-2',
 		value: { '1': true, '0': false },
 		required: true,
 	},
--- a/pages/ems/base/PastRsltDataReadPage.vue
+++ b/pages/ems/base/PastRsltDataReadPage.vue
@ -12,7 +12,7 @@
 						</v-col>
 						<v-col :cols="3">
 							<component :is="'EvtObjPop'" :parentPrgmId="myPrgmId" :item="evtObjPopItem"
-								customClass="select-large" />
+								class="no-gutters" customClass="select-large" />
 						</v-col>
 						<v-col :cols="3">
 							<!-- 대상일 -->
@ -29,17 +29,18 @@
 			</v-col>
 		</v-row>
 		<v-row ref="contents">
-			<v-col :cols="12" style="height: 100%" class="h100">
-				<v-card class="px-5 py-5 h100">
-					<div ref="gridParent" class="h100 px-5" style="height: 100%">
+			<v-col :cols="12" class="h100">
+				<v-card class="px-5 py-5">
+					<div ref="gridParent" class="px-5" style="height:calc(100% - 40px)">
 						<component ref="myGrid" :is="loadGrid ? 'Grid' : null" :gridName="gridName"
 							:parentPrgmId="myPrgmId" />
 					</div>
-					<div class="d-flex align-center justify-space-between">
+					<div class="d-flex align-center justify-center pa-5" v-if="loadGrid && totalCount > 0">
 							<pagination id="pagination" :total-count="totalCount" :page-num="page" :limit="limit"
 								@loadData="changeGrid" />
 						</div>
 				</v-card>
+
 			</v-col>
 		</v-row>
 	</div>
@ -61,7 +62,7 @@ import BtnExcelDownload from '~/components/common/button/BtnExcelDownload';
 import DateUtility from '~/plugins/dateUtility';
 // import Search from "~/components/common/search";
 import EvtObjPop from '~/components/common/modal/EvtObjPop';
-import pagination from '~/components/Pagination';
+import pagination from '~/components/common/Pagination';

 let myTitle;
 // const myPrgmId = "PRG0052";
@ -212,7 +213,7 @@ export default {
 		},
 		layoutInit() {
 			const searchFilterHeight = this.$refs.searchFilter.offsetHeight;
-			this.$refs.contents.style.height = `calc(100% - ${searchFilterHeight}px)`;
+			this.$refs.contents.style.height = `calc(100% - 30px - ${searchFilterHeight}px) `;
 		},
 		async setFromDt() {
 			this.pageData.fromDt = Utility.setBeforetDate(
@ -220,7 +221,6 @@ export default {
 				this.pageData.toDt,
 				'YYYYMMDD',
 			);
-			// this.pageData.toDt = Utility.setAftertDate(this.pageData, this.pageData.fromDt, "YYYYMMDD");
 		},
 		gridInit() {
 			this.loadGrid = false;
--- a/pages/ems/base/ReadResultCloseMngPage.vue
+++ b/pages/ems/base/ReadResultCloseMngPage.vue
@ -100,6 +100,10 @@
                :gridName="gridName"
              />
          </div>
+					<div class="d-flex align-center justify-center pa-5" v-if="loadGrid && totalCount > 0">
+            <pagination id="pagination" :total-count="totalCount" :page-num="page" :limit="limit"
+								@loadData="changeGrid" />
+						</div>
        </v-card>
      </v-col>
    </v-row>
@ -117,6 +121,7 @@ import selectCodeList from "@/components/common/select/selectCodeList";
 import SelectMttList from "@/components/common/select/SelectMttList";
 import Datepicker from "~/components/common/Datepicker";
 import BtnExcelDownload from "~/components/common/button/BtnExcelDownload";
+import pagination from '~/components/common/Pagination';

 let myTitle;
 // const myPrgmId = "PRG0018";
@ -144,27 +149,18 @@ export default {
    Datepicker,
    Search,
    Grid,
+    pagination,
  },
  data() {
    return {
      myPrgmId: myPrgmId,
      gridName: "rowGrid",
      loadGrid: false,
-      dataPathMock: {
-        rowGrid: {
-          column: [
-            { header: "태그", name: "id", headerAlign: "left" },
-            { header: "배율", name: "lable", headerAlign: "left" },
-            { header: "설비비", name: "type", headerAlign: "left" },
-            { header: "설비배분비율", name: "note", headerAlign: "left" },
-            { header: "금일데이터", name: "note", headerAlign: "left" },
-            { header: "최종마감시각", name: "date", headerAlign: "left" },
-          ],
-          data: dataPathDataExample,
-          defaultRow: dataPathDataExample,
-          option: {},
-        },
-      },
+			itemsPerPage: 10,
+			itemsPerPageArray: [10, 20, 30],
+			limit: 20,
+			page: 1,
+			totalCount: 0,
    };
  },
  computed: {
@ -190,7 +186,10 @@ export default {
  },
  watch: {
    chkIsFind(val) {
-      if (val) this.search();
+      if (val) {
+				this.page = 1;
+				this.search();
+			}
    },
    chkBlocId() {
      this.setPageData({ isFind: true });
@ -243,10 +242,6 @@ export default {
        columnOptions: {
          resizable: true,
        },
-        pageOptions: {
-					useClient: true,
-					perPage: 13,
-				},
      };
      this.setGridOption({
        gridKey: this.gridName,
@ -261,6 +256,8 @@ export default {
      await this.getRowGridData();
    },
    async getRowGridData() {
+      this.loadGrid = false;
+
      if (
        this.pageData.blocMstrList.length > 0 &&
        this.pageData.commCdList.length > 0 &&
@ -274,8 +271,25 @@ export default {
            mttCd: this.pageData.commCd, // 검침대상유형
            mttTp: this.pageData.readObjId, // 검침대상
            readDt: this.pageData.fromDt, // 조회기간
+            limit: this.limit,
+					  page: this.page,
+					  offset: (this.page - 1) * this.limit, // MariaDB Query에서 직접 계산이 안됨
          },
        });
+
+        const res2 = await this.postApiReturn({
+					apiKey: 'selectReadResultCloseMngPageTotal',
+					resKey: 'cdKindPageTotal',
+          sendParam: {
+            blocId: this.pageData.blocMstrList[this.pageData.blocId].blocId, // 사업장
+            mttCd: this.pageData.commCd, // 검침대상유형
+            mttTp: this.pageData.readObjId, // 검침대상
+            readDt: this.pageData.fromDt, // 조회기간
+          },
+				});
+
+				this.totalCount = res2[0].totalcount;
+
        this.setGridData({
          gridKey: this.gridName,
          value: res.map((item) => ({
@ -325,6 +339,12 @@ export default {
        this.setPageData({ isFind: true });
      }
    },
+    changeGrid: async function (pageNum, limit) {
+			this.page = pageNum;
+			this.limit = limit;
+
+			this.search();
+		},
  },
 };

@ -431,13 +451,4 @@ const myColumns = [
    },
  },
 ];
-
-import { getPathDataExample } from "@/const/const";
-const dataPathDataExample = getPathDataExample({
-  id: "INCHEON.HVAC.EQP_HT_CH001.UT_CH101.CHI_AMP_1A_PV",
-  lable: "INCHEON 고온 냉동기 101호기 - 호로1",
-  type: "사용",
-  note: "-",
-  date: "2023-01-10 20:02:00",
-});
 </script>
--- a/pages/ems/effc/EnrgReptMngPage.vue
+++ b/pages/ems/effc/EnrgReptMngPage.vue
@ -35,7 +35,7 @@
 						</v-col>
 						<v-col :cols="6.5" class="text-right d-flex align-end justify-end align-self-end">
 							<!-- 조회버튼 -->
-							<a-button icon="file-excel" class="d-inline-flex-1 mr-1" size="large" @click="createExcel()">엑셀</a-button>
+							<a-button type="default" icon="file-excel" class="d-inline-flex-1 mr-1" size="large" @click="createExcel()">엑셀</a-button>
 							<BtnSearch @click="search" size="large"  />
 						</v-col>
 					</v-row>
--- a/pages/ems/effc/EnrgUseEqpmDetlMntrPage.vue
+++ b/pages/ems/effc/EnrgUseEqpmDetlMntrPage.vue
@ -154,14 +154,15 @@
        </v-row>
        <v-row class="pa-1" style="height: 52%; width: 100%">
          <v-card class="pa-1" style="height: 100%; width: 100%; overflow: hidden">
-            <div style="height: 25%">
-              <v-card-title class="d-flex align-center justify-space-between pa-5">
+            <div style="height: 15%">
+              <v-card-title class="d-flex align-center justify-space-between pl-3">
                <span class="tit ft-size_20 ft-weight_600">가이드 알람정보</span>
              </v-card-title>
            </div>
            <div
              ref="gridParent01"
-              style="height: 75%; overflow: hidden; margin-top: 15px"
+              class="pl-3 mt-5"
+              style="height: 75%; overflow: hidden;"
            >
              <component
                :ref="gridName01"
@ -177,12 +178,12 @@
            <v-row style="height: 100%">
              <v-col :cols="5" class="">
                <v-card class="pa-1" style="height: 100%; width: 100%">
-                  <div style="height: 25%">
-                    <v-card-title class="d-flex align-center justify-space-between pa-5">
+                  <div style="height: 15%">
+                    <v-card-title class="d-flex align-center justify-space-between pl-3">
                      <span class="tit ft-size_20 ft-weight_600">설비 상세 정보</span>
                    </v-card-title>
                  </div>
-                  <div ref="gridParent02" style="height: 75%">
+                  <div ref="gridParent02" style="height: 75%" class="pl-3 mt-5">
                    <component
                      :ref="gridName02"
                      :is="loadGrid02 ? 'Grid' : null"
--- a/pages/ems/effc/EnrgUseTotSummPage.vue
+++ b/pages/ems/effc/EnrgUseTotSummPage.vue
@ -47,13 +47,14 @@
    <v-row ref="contents" style="overflow: auto">
      <v-col>
        <div v-for="(value, key, index) in contentData" :key="'key1_' + index">
+          <v-card style="background: none">
            <v-card-title class="d-flex align-center justify-space-between pa-3">
              <span class="tit ft-size_20 ft-weight_600">{{ value.eqpmGrpNm }}</span>
            </v-card-title>
+          </v-card>
          <v-row>
            <v-col :cols="3" v-for="(item, i) in value.chartData" :key="'key2_' + i">
            <v-card>
-
              <div
                class="v-box"
                style="height: 330px; position: relative"
@ -126,7 +127,6 @@
                </v-col>
              </div>
            </v-card>
-
            </v-col>
          </v-row>
        </div>
--- a/pages/ems/effc/EqpmIndMntrPage.vue
+++ b/pages/ems/effc/EqpmIndMntrPage.vue
@ -105,8 +105,7 @@
                :gridName="gridName"
                :parentPrgmId="myPrgmId"
              />
-
-              <div class="pagination-wrapper">
+              <div v-if="loadGrid && totalCount > 0" class="pagination-wrapper">
                <pagination
                  id="pagination"
                  :total-count="totalCount"
@ -201,7 +200,7 @@ export default {
      gridName: "grid01",

      enrgUseMainIdxDesc: [],
-      itemsPerPageArray: [10, 20, 30],
+      itemsPerPageArray: [10, 20, 50],
      limit: 10,
      page: 1,
      totalCount: 0,
--- a/store/modules/list.js
+++ b/store/modules/list.js
@ -210,6 +210,8 @@ const INIT_URL_STATE = {
 	// prgmId: "TMP0013" 검침실적마감관리 ems/ReadResultCloseMngPage
 	selectReadResultCloseMng:
 		'ems/base/ReadResultCloseMngCtr/selectReadResultCloseMng', // 일일검침정보
+	selectReadResultCloseMngPageTotal:
+		'ems/base/ReadResultCloseMngCtr/selectReadResultCloseMngPageTotal', // 일일검침정보
 	saveReadResultCloseMngSP:
 		'ems/base/ReadResultCloseMngCtr/saveReadResultCloseMngSP', // 전월 or 일 마감
 	saveReadResultCloseMngSPMM:
Author	SHA1	Message	Date
Nguyen Van Luan/(Nguyen Van Luan)/현장대리인/SK	856d0db130	updatecode	2025-08-14 12:01:07 +09:00
Nguyen Van Luan/(Nguyen Van Luan)/현장대리인/SK	6973321137	fixbug	2025-08-14 11:34:02 +09:00
dev	2cea34dbab	Merge pull request 'Update screen 13, grid color' (#64 ) from dev-trungvq7-0729 into dev Reviewed-on: #64	2025-08-13 19:02:06 +09:00
dev	f41bd1283a	Update 1308	2025-08-13 18:20:59 +09:00
dev	d5c59286ad	Merge branch 'dev' of http://218.237.212.51:30003/gitadmin/sk_fems_ui into dev-trungvq7-0729	2025-08-13 17:14:44 +09:00
dev	287c68252b	Update 1108	2025-08-13 17:14:39 +09:00
dev	59ec2eda59	Merge pull request 'dev-dungtv-0813' (#63 ) from dev-dungtv-0813 into dev Reviewed-on: #63	2025-08-13 16:12:46 +09:00
Tran Van Dung/(Tran Van Dung)/현장대리인/SK	f6c071bdf0	fix menu item:hover style	2025-08-13 13:37:51 +07:00
Tran Van Dung/(Tran Van Dung)/현장대리인/SK	24882a21a5	fix bugs style button delete	2025-08-13 13:20:58 +07:00
Tran Van Dung/(Tran Van Dung)/현장대리인/SK	9aa9939a43	Merge branch 'dev' of http://218.237.212.51:30003/gitadmin/sk_fems_ui into dev-dungtv-0813	2025-08-13 11:47:03 +07:00
dev	0760bde4e1	Merge pull request 'add pagination for screen 27 move pagination screen 28' (#62 ) from dev-manhph1-figbug into dev Reviewed-on: #62	2025-08-13 13:46:53 +09:00
Pham Hoang Manh/(Pham Hoang Manh)/현장대리인/SK	2802e93a44	add pagination for screen 27 move pagination screen 28	2025-08-13 13:38:12 +09:00
dev	39905e6f80	Merge pull request 'update code s32 s17' (#61 ) from dev-luannv24-s32-s17fixbug into dev Reviewed-on: #61	2025-08-12 18:47:56 +09:00
dev	0825663c64	Merge pull request 'fix icon datepicker' (#60 ) from dev-manhph1-figbug into dev Reviewed-on: #60	2025-08-12 18:47:08 +09:00
dev	8d444eafcd	Merge pull request 'Update pagination UI + Fix bugs gauge chart line chart + Fix bugs s14' (#59 ) from dev-nghiantt-fix-bugs into dev Reviewed-on: #59	2025-08-12 18:43:04 +09:00
Nguyen Van Luan/(Nguyen Van Luan)/현장대리인/SK	71e90064a2	update code s32 s17	2025-08-12 18:37:21 +09:00
Pham Hoang Manh/(Pham Hoang Manh)/현장대리인/SK	7d2bcb9496	fix icon datepicker	2025-08-12 18:00:01 +09:00
Michael	84c7e61254	Update pagination UI + Fix bugs gauge chart line chart + Fix bugs s14	2025-08-12 17:07:52 +09:00