[Feat 0000] 主题化添加默认变量

src/design/theme.less

@@ -113,6 +113,9 @@ html[data-theme='light'] {
 @vent-modal-border: var(--vent-modal-border);
 @vent-modal-bg: var(--vent-modal-bg);
 @vent-modal-box-shadow: var(--vent-modal-box-shadow);
+@vent-tabs-bg: var(--vent-tabs-bg);
+@vent-tabs-table-thead: var(--vent-tabs-table-thead);
+@vent-tabs-action-link: var(--vent-tabs-action-link);
 
 // 下面的代码负责将主题相关的选择器、图片前缀等 less 变量声明
 @theme-dark: ~"html[data-theme='dark2']";

src/design/themify/dark.less

@@ -15,6 +15,10 @@ html[data-theme='dark2'] {
     --vent-modal-border: #04bdaa;
     --vent-modal-bg: #0042ab22;
     --vent-modal-box-shadow: #2b87ff;
+
+    --vent-tabs-bg: linear-gradient(#0091aa33, #2081ff11);
+    --vent-tabs-table-thead: #3d9dd433;
+    --vent-tabs-action-link: #28f3f3;
     
     --vent-form-item-boder: #3ad8ff77;
     

src/design/themify/deepblue.less

@@ -15,6 +15,13 @@ html[data-theme='deepblue'] {
     --vent-modal-border: #3F506A;
     --vent-modal-bg: #0b1f3980;
     --vent-modal-box-shadow: #316b92;
+
+    --vent-tabs-bg: linear-gradient(#0091aa33, #2081ff11);
+    --vent-tabs-table-thead: #3d9dd433;
+    // --vent-tabs-action-link: #28f3f3;
+    // --vent-tabs-bg: linear-gradient(#28385155, #27334722);
+    // --vent-tabs-table-thead: #172943;
+    --vent-tabs-action-link: #0a80fa;
     
     --vent-form-item-boder: #3ad8ff77;
 
@@ -33,7 +40,7 @@ html[data-theme='deepblue'] {
     --vent-configurable-home-timeline: linear-gradient(to top, #39a3ff00, #0091ff99, #39a3ff00);
     --vent-configurable-home-light-border: #fbfdff;
 
-    --vent-gas-list-item-bg-img: linear-gradient(to right, #3d82be55, #3977e500);
+    --vent-gas-list-item-bg-img: linear-gradient(to right, #213248, #21324800);
     --vent-gas-tab-bg: #10427a;
     --vent-gas-tab-bg-actived: #166ab5;
     --vent-gas-tab-border: #3F506A;
@@ -46,5 +53,5 @@ html[data-theme='deepblue'] {
 
     --vent-warn-tab-bg: #0f376c;
     --vent-warn-tab-border: #107eec;
-    --vent-warn-tab-bg-actived: #0A84FF;
+    --vent-warn-tab-bg-actived: #0963c1;
 }

src/design/themify/light.less

@@ -15,6 +15,10 @@ html[data-theme='light'] {
     --vent-modal-border: #04bdaa;
     --vent-modal-bg: #0042ab22;
     --vent-modal-box-shadow: #2b87ff;
+
+    --vent-tabs-bg: linear-gradient(#0091aa33, #2081ff11);
+    --vent-tabs-table-thead: #3d9dd433;
+    --vent-tabs-action-link: #28f3f3;
     
     --vent-form-item-boder: #3ad8ff77;
     

src/design/themify/vent1.less

@@ -1,4 +1,5 @@
-html[data-theme='vent1'] {
+html {
+    // html[data-theme='vent1'] {
     --vent-header-bg-color: linear-gradient(#005177, #0a344c);
 
     --vent-btn-primary-hover-color: #389bd9;
@@ -15,6 +16,10 @@ html[data-theme='vent1'] {
     --vent-modal-border: #04bdaa;
     --vent-modal-bg: #0042ab22;
     --vent-modal-box-shadow: #2b87ff;
+
+    --vent-tabs-bg: linear-gradient(#0091aa33, #2081ff11);
+    --vent-tabs-table-thead: #3d9dd433;
+    --vent-tabs-action-link: #28f3f3;
     
     --vent-form-item-boder: #3ad8ff77;
     

src/design/vent/modal.less

@@ -104,7 +104,7 @@
       /*垂直展示*/
       writing-mode: tb-lr;
       /*兼容IE*/
-      color: #fff;
+      color: var(--vent-font-base);
       text-orientation: upright;
     }
   }
@@ -172,7 +172,7 @@
       position: relative;
       pointer-events: none;
       .title {
-        color: #fff;
+        color: var(--vent-font-base);
         font-family: 'douyuFont';
         text-align: center;
         font-size: 12px;
@@ -229,7 +229,7 @@
     align-items: center;
     pointer-events: auto;
     .row {
-      color: #fff;
+      color: var(--vent-font-base);
       display: flex;
       align-items: center;
     }
@@ -296,7 +296,7 @@
       display: flex;
       align-items: center;
       justify-content: center;
-      color: #fff;
+      color: var(--vent-font-base);
       padding: 0 15px 5px 15px;
       cursor: pointer;
       &:hover {
@@ -414,7 +414,7 @@
     .dv_border_8{
       position: relative;
       .enter-detail {
-        color: #fff;
+        color: var(--vent-font-base);
         cursor: pointer;
         position: absolute;
         right: 120px;
@@ -428,7 +428,7 @@
         display: flex;
         align-items: center;
         justify-content: center;
-        color: #fff;
+        color: var(--vent-font-base);
         padding: 5px 15px 5px 15px;
         cursor: pointer;
         right: 20px;
@@ -474,7 +474,7 @@
       pointer-events: auto;
       // background: #02263aaa;
       // background: linear-gradient(#00daff33, #2081ff11);
-      background: linear-gradient(#0091aa33, #2081ff11);
+      background: var(--vent-tabs-bg);
       // background: radial-gradient(circle at 50% 80%, #3df6ff33, #0038b433);
       backdrop-filter: blur(18px);
       overflow-y: hidden;
@@ -484,7 +484,7 @@
       }
       .tab-item {
         height: 240px;
-        color: #fff;
+        color: var(--vent-font-base);
       }
       // .@{ventSpace}-tabs-content,
       // .vent-table {
@@ -502,10 +502,10 @@
       .vent-table {
         .@{ventSpace}-table-column-title,
         .@{ventSpace}-table-thead > tr > th {
-          color: #84f2ff !important;
+          color: var(--vent-table-action-link) !important;
         }
         .@{ventSpace}-progress-text {
-          color: #fff !important;
+          color: var(--vent-font-base) !important;
         }
       }
       .@{ventSpace}-tabs-nav {
@@ -515,10 +515,10 @@
         padding-left: 10px !important;
       }
       .@{ventSpace}-tabs-tab.@{ventSpace}-tabs-tab-active .@{ventSpace}-tabs-tab-btn {
-        color: #28f3f3 !important;
+        color: var(--vent-tabs-action-link) !important;
       }
       .@{ventSpace}-tabs-ink-bar {
-        background: #28f3f3;
+        background: var(--vent-tabs-action-link);
       }
       .@{ventSpace}-tabs-top > .@{ventSpace}-tabs-nav::before {
         border-color: #f0f0f022 !important;
@@ -596,11 +596,11 @@
 
 :deep(.@{ventSpace}-table-thead) {
   // background: linear-gradient(#003f77 0%, #004a86aa 10%); //#003f77, #0a134c
-  background-color: #3d9dd433 !important;
+  background-color: var(--vent-tabs-table-thead) !important;
   & > tr > th,
   .@{ventSpace}-table-column-title {
     // color: #70f9fc !important;
-    color: #84f2ff !important;
+    color: var(--vent-table-action-link) !important;
     border-color: #91e9fe55 !important;
     border-left: none !important;
     // border-right: none !important;
@@ -641,7 +641,7 @@
   input,
   .@{ventSpace}-select-selection-item,
   .@{ventSpace}-picker-suffix {
-    color: #fff !important;
+    color: var(--vent-font-base) !important;
   }
   .@{ventSpace}-select-selection-placeholder {
     color: #b7b7b7 !important;
@@ -649,7 +649,7 @@
 }
 :deep(.@{ventSpace}-select-arrow),
 :deep(.@{ventSpace}-picker-separator) {
-  color: #fff !important;
+  color: var(--vent-font-base) !important;
 }
 :deep(.@{ventSpace}-picker-dropdown) {
   top: 0 !important;

src/utils/env.ts

@@ -100,7 +100,7 @@ export function getHomePath(key): string {
     case 'styleOne':
       // 显示6.0
       homePath = '/micro-vent-3dModal/dashboard/analysis';
-      switchTheme(ThemeModel.theme6_0);
+      // switchTheme(ThemeModel.theme6_0);
       break;
     case 'styleTwo':
       // 显示5.5

src/views/vent/monitorManager/deviceMonitor/components/device/index.vue

@@ -1177,8 +1177,10 @@
       // --image-tree-icon-cover-bg: url('/@/assets/images/themify/deepblue/vent/home/tree-icon-cover-bg.png');
       // --image-tree-icon-cover-hover-bg: url('/@/assets/images/themify/deepblue/vent/home/tree-icon-cover-hover-bg.png');
       // --image-tohome: url('/@/assets/images/themify/deepblue/vent/home/tohome.png');
-      --tree-node-select: #166ab5;
-      --tree-node-hover: #0f376ccc;
+      // --tree-node-select: #0963c1;
+      // --tree-node-hover: #0f376ccc;
+      // --location-bottom-bg: #21324855;
+      // --location-bottom-border: #aed1ff4d;
     }
   }
 
@@ -1191,13 +1193,14 @@
     --image-tree-expansion-hover-bg: url('/@/assets/images/vent/home/tree-expansion-hover-bg.png');
     --image-location-bg: url('/@/assets/images/vent/home/location-bg.png');
     --image-location-hover-bg: url('/@/assets/images/vent/home/location-hover-bg.png');
-    --image-tree-bg: url('/@/assets/images/vent/home/tree-bg.png');
     --image-turn-location-top-bg: url('/@/assets/images/vent/home/turn-location-top-bg.png');
     --image-tree-icon-cover-bg: url('/@/assets/images/vent/home/tree-icon-cover-bg.png');
     --image-tree-icon-cover-hover-bg: url('/@/assets/images/vent/home/tree-icon-cover-hover-bg.png');
     --image-tohome: url('/@/assets/images/vent/home/tohome.png');
     --tree-node-select: #00b1c8;
     --tree-node-hover: #00b1c855;
+    --location-bottom-bg: #00709955;
+    --location-bottom-border: #aef3ff4d;
   }
 
   .top-header {
@@ -1450,13 +1453,14 @@
         line-height: 30px;
         display: flex;
         justify-content: space-between;
+        // background-image: var(--vent-gas-list-item-bg-img);
         background-image: linear-gradient(to left, #39f5ff05, #39f5ff10);
         margin: 3px 0;
 
         .item-title {
           width: 80px;
           text-align: right;
-          color: #87f1ff;
+          color: var(--vent-table-action-link);
         }
       }
 
@@ -1470,9 +1474,9 @@
         span {
           display: inline-block;
           width: 100%;
-          background: #00709955;
+          background: var(--location-bottom-bg);
           border-radius: 3px;
-          border: 1px solid rgba(174, 243, 255, 0.3);
+          border: 1px solid var(--location-bottom-border);
           text-align: center;
           padding: 2px 0;
           cursor: pointer;
@@ -1527,6 +1531,7 @@
     .tabs-box {
       width: calc(100% - 12px) !important;
       bottom: 3px !important;
+      background-color: red;
     }
 
     .to-small {

src/views/vent/monitorManager/deviceMonitor/index.vue

@@ -67,7 +67,6 @@
   onMounted(() => {
     const { type, deviceType, topage, deviceid } = route.query;
     deviceKind.value = deviceType as string;
-    console.log('debug rr', isShow, routerParam);
     if (!topage) {
       isShow.value = true;
       if (type === 'timesolution') {
@@ -105,28 +104,9 @@
 </script>
 
 <style lang="less" scoped>
-  @import '/@/design/theme.less';
   @import '/@/design/vent/modal.less';
   @ventSpace: zxm;
 
-  @{theme-deepblue} {
-    .scene-box {
-      // --image-modal-top: url('/@/assets/images/themify/deepblue/vent/home/modal-top.png');
-      // --image-tree-icon-bg: url('/@/assets/images/themify/deepblue/vent/home/tree-icon-bg.png');
-      // --image-tree-icon-hover-bg: url('/@/assets/images/themify/deepblue/vent/home/tree-icon-hover-bg.png');
-      // --image-tree-bg: url('/@/assets/images/themify/deepblue/vent/home/tree-bg.png');
-      // --image-tree-expansion-bg: url('/@/assets/images/themify/deepblue/vent/home/tree-expansion-bg.png');
-      // --image-tree-expansion-hover-bg: url('/@/assets/images/themify/deepblue/vent/home/tree-expansion-hover-bg.png');
-      // --image-location-bg: url('/@/assets/images/themify/deepblue/vent/home/location-bg.png');
-      // --image-location-hover-bg: url('/@/assets/images/themify/deepblue/vent/home/location-hover-bg.png');
-      // --image-tree-bg: url('/@/assets/images/themify/deepblue/vent/home/tree-bg.png');
-      // --image-turn-location-top-bg: url('/@/assets/images/themify/deepblue/vent/home/turn-location-top-bg.png');
-      // --image-tree-icon-cover-bg: url('/@/assets/images/themify/deepblue/vent/home/tree-icon-cover-bg.png');
-      // --image-tree-icon-cover-hover-bg: url('/@/assets/images/themify/deepblue/vent/home/tree-icon-cover-hover-bg.png');
-      // --image-tosmall: url('/@/assets/images/themify/deepblue/vent/home/tosmall.png');
-    }
-  }
-
   .scene-box {
     --image-modal-top: url('/@/assets/images/vent/home/modal-top.png');
     --image-tree-icon-bg: url('/@/assets/images/vent/home/tree-icon-bg.png');
@@ -136,7 +116,6 @@
     --image-tree-expansion-hover-bg: url('/@/assets/images/vent/home/tree-expansion-hover-bg.png');
     --image-location-bg: url('/@/assets/images/vent/home/location-bg.png');
     --image-location-hover-bg: url('/@/assets/images/vent/home/location-hover-bg.png');
-    --image-tree-bg: url('/@/assets/images/vent/home/tree-bg.png');
     --image-turn-location-top-bg: url('/@/assets/images/vent/home/turn-location-top-bg.png');
     --image-tree-icon-cover-bg: url('/@/assets/images/vent/home/tree-icon-cover-bg.png');
     --image-tree-icon-cover-hover-bg: url('/@/assets/images/vent/home/tree-icon-cover-hover-bg.png');

src/views/vent/sys/setting/setting.data.ts

@@ -68,10 +68,10 @@ export const formSchema: FormSchema[] = [
           label: '5.5',
           value: 'styleTwo',
         },
-        {
-          label: '默认（开发中）',
-          value: ThemeEnum.VENT1,
-        },
+        // {
+        //   label: '默认（开发中）',
+        //   value: ThemeEnum.VENT1,
+        // },
         {
           label: '明亮（开发中）',
           value: ThemeEnum.LIGHT,