fix bugs change theme model

Reviewed-on: #75

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 {
@@ -334,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");
     }

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;
+          }
+        }
+      }
+
     }
   }
 }

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{

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 {

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;

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;

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 {

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;

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;

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;

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 {

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;
 }

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;
 }

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>
@@ -846,5 +701,4 @@ export default {
 
 <style lang="scss" scoped>
 @import '@/assets/scss/layout.scss';
-
 </style>

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/",

pages/ems/base/AddInfoMngPage.vue

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

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;

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>

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 {

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 {

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 {