From 5abba695b2b0414929cc0922642e711a6d597c7a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tran=20Van=20Dung/=28Tran=20Van=20Dung=29/=ED=98=84?=
 =?UTF-8?q?=EC=9E=A5=EB=8C=80=EB=A6=AC=EC=9D=B8/SK?= <20074470@skcc.com>
Date: Tue, 19 Aug 2025 13:43:44 +0700
Subject: [PATCH 1/2] optimize-css

---
 assets/scss/common.scss                           | 12 ------------
 assets/scss/theme.scss                            |  7 -------
 components/common/AdminMenu.vue                   |  1 -
 components/common/Calendar.vue                    |  2 --
 components/common/Datepicker.vue                  |  2 --
 components/common/DatepickerTimeSelectBox.vue     |  1 -
 components/common/DatepickerTopView.vue           |  2 --
 components/common/DatepickerWidget.vue            |  2 --
 components/common/PastRsltDatePicker.vue          |  2 --
 components/common/modal/ElecPowChrgPop.vue        |  1 -
 components/common/modal/EnrgEffcEqpmDetailPop.vue |  1 -
 components/common/modal/EnrgEffcGdIdxDetPop.vue   |  1 -
 layouts/default.vue                               |  1 -
 nuxt.config.js                                    |  6 +++---
 pages/ems/base/AddInfoMngPage.vue                 |  3 ---
 pages/ems/base/ReadObjectMngPage.vue              |  1 -
 pages/ems/effc/EnrgEffcTotSummPage.vue            | 12 ------------
 pages/ems/effc/EnrgUsePlanPage.vue                |  2 --
 pages/ems/effc/TagTrndPage.vue                    |  1 -
 pages/login/index.vue                             |  2 --
 20 files changed, 3 insertions(+), 59 deletions(-)

diff --git a/assets/scss/common.scss b/assets/scss/common.scss
index 0ae7289..f624b36 100644
--- a/assets/scss/common.scss
+++ b/assets/scss/common.scss
@@ -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 {
diff --git a/assets/scss/theme.scss b/assets/scss/theme.scss
index 51fcc95..062990b 100644
--- a/assets/scss/theme.scss
+++ b/assets/scss/theme.scss
@@ -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{
diff --git a/components/common/AdminMenu.vue b/components/common/AdminMenu.vue
index e6691ec..96b3806 100644
--- a/components/common/AdminMenu.vue
+++ b/components/common/AdminMenu.vue
@@ -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 {
diff --git a/components/common/Calendar.vue b/components/common/Calendar.vue
index 00681b4..57044b9 100644
--- a/components/common/Calendar.vue
+++ b/components/common/Calendar.vue
@@ -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;
diff --git a/components/common/Datepicker.vue b/components/common/Datepicker.vue
index b628db8..1ce93e6 100644
--- a/components/common/Datepicker.vue
+++ b/components/common/Datepicker.vue
@@ -431,8 +431,6 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-// @import "@/assets/scss/datepicker.scss";
-
 ::v-deep {
 	.tui-timepicker-row {
 		display: flex;
diff --git a/components/common/DatepickerTimeSelectBox.vue b/components/common/DatepickerTimeSelectBox.vue
index 2a7b67b..9d95c3d 100644
--- a/components/common/DatepickerTimeSelectBox.vue
+++ b/components/common/DatepickerTimeSelectBox.vue
@@ -539,7 +539,6 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-@import "@/assets/scss/datepicker.scss";
 
 ::v-deep {
   .tui-timepicker-row {
diff --git a/components/common/DatepickerTopView.vue b/components/common/DatepickerTopView.vue
index 731360a..ac79351 100644
--- a/components/common/DatepickerTopView.vue
+++ b/components/common/DatepickerTopView.vue
@@ -405,8 +405,6 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-@import "@/assets/scss/datepicker.scss";
-
 ::v-deep {
 	.tui-timepicker-row {
 		display: flex;
diff --git a/components/common/DatepickerWidget.vue b/components/common/DatepickerWidget.vue
index 03d5ba0..55efbd4 100644
--- a/components/common/DatepickerWidget.vue
+++ b/components/common/DatepickerWidget.vue
@@ -355,8 +355,6 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-@import "@/assets/scss/datepicker.scss";
-
 ::v-deep {
 	.tui-timepicker-row {
 		display: flex;
diff --git a/components/common/PastRsltDatePicker.vue b/components/common/PastRsltDatePicker.vue
index 208767c..a73b12a 100644
--- a/components/common/PastRsltDatePicker.vue
+++ b/components/common/PastRsltDatePicker.vue
@@ -317,8 +317,6 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-@import "@/assets/scss/datepicker.scss";
-
 ::v-deep {
 	.tui-timepicker-row {
 		display: flex;
diff --git a/components/common/modal/ElecPowChrgPop.vue b/components/common/modal/ElecPowChrgPop.vue
index 7d16d41..8fc76ec 100644
--- a/components/common/modal/ElecPowChrgPop.vue
+++ b/components/common/modal/ElecPowChrgPop.vue
@@ -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 {
diff --git a/components/common/modal/EnrgEffcEqpmDetailPop.vue b/components/common/modal/EnrgEffcEqpmDetailPop.vue
index 53704b9..e6ceebd 100644
--- a/components/common/modal/EnrgEffcEqpmDetailPop.vue
+++ b/components/common/modal/EnrgEffcEqpmDetailPop.vue
@@ -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;
 }
diff --git a/components/common/modal/EnrgEffcGdIdxDetPop.vue b/components/common/modal/EnrgEffcGdIdxDetPop.vue
index 4a473dc..59bec96 100644
--- a/components/common/modal/EnrgEffcGdIdxDetPop.vue
+++ b/components/common/modal/EnrgEffcGdIdxDetPop.vue
@@ -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;
 }
diff --git a/layouts/default.vue b/layouts/default.vue
index 838b321..e6f6355 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -846,5 +846,4 @@ export default {
 
 <style lang="scss" scoped>
 @import '@/assets/scss/layout.scss';
-
 </style>
diff --git a/nuxt.config.js b/nuxt.config.js
index a878b91..beed21e 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -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/",
diff --git a/pages/ems/base/AddInfoMngPage.vue b/pages/ems/base/AddInfoMngPage.vue
index 55d8139..bbed97a 100644
--- a/pages/ems/base/AddInfoMngPage.vue
+++ b/pages/ems/base/AddInfoMngPage.vue
@@ -626,6 +626,3 @@ const myDetail = [
 	},
 ];
 </script>
-<style lang="scss">
-@import '@/assets/scss/common.scss';
-</style>
diff --git a/pages/ems/base/ReadObjectMngPage.vue b/pages/ems/base/ReadObjectMngPage.vue
index 4f8a11c..1bf102c 100644
--- a/pages/ems/base/ReadObjectMngPage.vue
+++ b/pages/ems/base/ReadObjectMngPage.vue
@@ -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;
diff --git a/pages/ems/effc/EnrgEffcTotSummPage.vue b/pages/ems/effc/EnrgEffcTotSummPage.vue
index 614c429..1128dfe 100644
--- a/pages/ems/effc/EnrgEffcTotSummPage.vue
+++ b/pages/ems/effc/EnrgEffcTotSummPage.vue
@@ -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>
diff --git a/pages/ems/effc/EnrgUsePlanPage.vue b/pages/ems/effc/EnrgUsePlanPage.vue
index e86ff17..71b48f6 100644
--- a/pages/ems/effc/EnrgUsePlanPage.vue
+++ b/pages/ems/effc/EnrgUsePlanPage.vue
@@ -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 {
diff --git a/pages/ems/effc/TagTrndPage.vue b/pages/ems/effc/TagTrndPage.vue
index ed7e0a6..4ca482e 100644
--- a/pages/ems/effc/TagTrndPage.vue
+++ b/pages/ems/effc/TagTrndPage.vue
@@ -1214,7 +1214,6 @@ const defaultData = {
 };
 </script>
 <style lang="scss" scoped>
-@import "@/assets/scss/var.scss";
 
 ::v-deep {
   .datepicker-container {
diff --git a/pages/login/index.vue b/pages/login/index.vue
index d14b91e..ed913e0 100644
--- a/pages/login/index.vue
+++ b/pages/login/index.vue
@@ -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 {

From dc4326450359eaca9d16cbb52324692edbf51f96 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tran=20Van=20Dung/=28Tran=20Van=20Dung=29/=ED=98=84?=
 =?UTF-8?q?=EC=9E=A5=EB=8C=80=EB=A6=AC=EC=9D=B8/SK?= <20074470@skcc.com>
Date: Tue, 19 Aug 2025 14:26:27 +0700
Subject: [PATCH 2/2] fix bugs change theme model

---
 assets/scss/common.scss |  68 -------------------
 assets/scss/layout.scss |  65 ++++++++++++++++++
 layouts/default.vue     | 145 ----------------------------------------
 3 files changed, 65 insertions(+), 213 deletions(-)

diff --git a/assets/scss/common.scss b/assets/scss/common.scss
index f624b36..53daefe 100644
--- a/assets/scss/common.scss
+++ b/assets/scss/common.scss
@@ -322,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");
     }
diff --git a/assets/scss/layout.scss b/assets/scss/layout.scss
index d5dc948..c93766d 100644
--- a/assets/scss/layout.scss
+++ b/assets/scss/layout.scss
@@ -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;
+          }
+        }
+      }
+
     }
   }
 }
diff --git a/layouts/default.vue b/layouts/default.vue
index e6f6355..5e9f6bd 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -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>