适配主题颜色

src/App.vue

@@ -38,5 +38,6 @@
     color: #2c3e50;
     width: 100%;
     height: 100vh;
+    --el-color-primary: var(--system-primary-color);
   }
 </style>

src/components/from/index.vue

@@ -148,6 +148,23 @@ export default {
   max-width: 250px;
 }
 
+:deep() {
+  .fixed-width-input .el-input__wrapper,
+  .fixed-width-select .el-input__wrapper,
+  .fixed-width-picker .el-input__wrapper {
+    background-color: var(--system-page-background);
+    color: var(--system-page-color);
+    border-color: var(--system-page-border-color);
+  }
+
+  .el-input__wrapper,
+  .default-but {
+    background-color: var(--system-page-background);
+    color: var(--system-page-color);
+    border-color: var(--system-page-border-color);
+  }
+}
+
 
 .is_button {
   display: flex;

src/components/layer/index.vue

@@ -9,7 +9,7 @@
         <div style="position: relative;">
           <slot name="bottom"></slot>
           <el-button type="primary" @click="confirm">确认</el-button>
-          <el-button @click="close">取消</el-button>
+          <el-button class="default-but" @click="close">取消</el-button>
         </div>
       </template>
     </el-dialog>
@@ -17,51 +17,71 @@
 </template>
 
 <script lang="js">
-  import { defineComponent } from 'vue'
-  import drag from '@/directive/drag/index'
-  export default defineComponent({
-    props: {
-      layer: {
-        type: Object,
-        default: () => {
-          return {
-            show: false,
-            title: '',
-            showButton: false,
-            width: 400,
-            top: '8vh',
-            height: '70vh'
-          }
-        },
-        required: true
-      }
-    },
-    directives: {
-      drag
-    },
-    setup(props, ctx) {
-      function confirm() {
-        ctx.emit('confirm')
-      }
-      function close() {
-        props.layer.show = false
-        ctx.emit('close')
-      }
-      return {
-        confirm,
-        close
-      }
+import { defineComponent } from 'vue'
+import drag from '@/directive/drag/index'
+export default defineComponent({
+  props: {
+    layer: {
+      type: Object,
+      default: () => {
+        return {
+          show: false,
+          title: '',
+          showButton: false,
+          width: 400,
+          top: '8vh',
+          height: '70vh'
+        }
+      },
+      required: true
     }
-  })
+  },
+  directives: {
+    drag
+  },
+  setup(props, ctx) {
+    function confirm() {
+      ctx.emit('confirm')
+    }
+    function close() {
+      props.layer.show = false
+      ctx.emit('close')
+    }
+    return {
+      confirm,
+      close
+    }
+  }
+})
 </script>
 
 <style lang="scss" scoped>
-  :deep(.el-dialog--center) {
-    min-width: 30vw;
-  }
+el-dialog {
+  background-color: var(--system-page-background);
+}
+
+:deep(.el-dialog--center) {
+  min-width: 30vw;
+}
 
-  :deep(.el-dialog__body) {
-    max-height: 60vh;
-    overflow: auto;
+:deep(.el-dialog__body) {
+  max-height: 60vh;
+  overflow: auto;
+}
+
+:deep() {
+  .el-dialog,
+  .el-dialog__title,
+  .el-input__wrapper,
+  .el-textarea__inner,
+  .el-upload--picture-card,
+  .default-but {
+    background-color: var(--system-page-background);
+    color: var(--system-page-color);
+    border-color: var(--system-page-border-color);
+  }
+  .el-switch__core {
+    background-color: var(--system-page-border-color);
   }
+}
 </style>

src/components/table/index.vue

@@ -97,4 +97,32 @@
       }
     }
   }
+
+  :deep() {
+    .el-table {
+      color: var(--system-page-color);
+      --el-table-tr-bg-color: var(--system-page-background);
+      --el-table-bg-color: var(--system-page-background);
+      --el-table-header-bg-color: var(--system-page-background);
+      --el-table-border-color: var(--system-page-border-color);
+      --el-table-row-hover-bg-color: var(--system-container-background);
+      --el-bg-color: var(--system-page-background) !important; //左边固定栏背景色
+     
+    }
+   
+    // 分页器
+    .el-input__wrapper,
+    .btn-prev,
+    .btn-next,
+    .number {
+      background-color: var(--system-page-background) !important;
+      color: var(--system-page-color);
+      border-color: var(--system-page-border-color);
+    }
+
+    .is-active {
+      color: var(--system-primary-text-color);
+      background-color: var(--system-primary-color) !important;
+    }
+  }
 </style>

src/views/main/dashboard/components/charts/lineChartModel.vue

@@ -9,7 +9,7 @@
                 <div class="main" v-if="totalProfit">
                     <el-row v-if="type === 'earn'">
                         <el-col :span="8">
-                            <el-statistic title="今日收益" :value="totalProfit.today" :precision="2" />
+                            <el-statistic class="statistic" title="今日收益" :value="totalProfit.today" :precision="2" />
                         </el-col>
                         <el-col :span="8">
                             <el-statistic title="昨日收益" :value="totalProfit.yesterday" :precision="2" />
@@ -257,9 +257,10 @@ watch(() => props.lineListData, (newVal) => {
         margin-bottom: 1.25rem;
         /* height: 26.94rem; */
         border-radius: 0.5rem;
-        background: #fff;
+        background-color: var(--system-page-background);
         box-shadow: 0 0 0.13rem #00000029;
 
+
         .layout-container-main-top {
             height: 6vh;
             display: flex;
@@ -272,7 +273,7 @@ watch(() => props.lineListData, (newVal) => {
                     width: 0.25rem;
                     height: 1.56rem;
                     border-radius: 0.13rem;
-                    background: #409eff;
+                    background-color: var(--system-primary-color);
                 }
 
                 span {
@@ -280,8 +281,7 @@ watch(() => props.lineListData, (newVal) => {
                     font-family: "PingFang SC SNaNremibold";
                     font-weight: 600;
                     font-size: 1.13rem;
-
-                    color: #333;
+                    color: var(--system-page-color);
                 }
 
                 .text {
@@ -369,8 +369,19 @@ watch(() => props.lineListData, (newVal) => {
     width: 100vw;
 }
 
-:deep(.el-table__header th) {
-    background-color: #f5f7fa;
-    font-weight: bold;
+:deep() {
+    .el-table {
+        color: var(--system-page-color);
+        --el-table-tr-bg-color: var(--system-page-background);
+        --el-table-bg-color: var(--system-page-background);
+        --el-table-header-bg-color: var(--system-page-background);
+        --el-table-border-color: var(--system-page-border-color);
+        --el-table-row-hover-bg-color: var(--system-container-background);
+    }
+
+    .el-statistic {
+        --el-statistic-title-color: var(--system-page-tip-color);
+        --el-statistic-content-color: var(--system-page-color);
+    }
 }
 </style>

src/views/main/dashboard/components/charts/userDataChart.vue

@@ -58,7 +58,10 @@ const options = ref({
     },
     legend: {
         // data: ['新增数(ZID)', '注册数', '登录数', '新增封禁', '总封禁', '新增封号', '总封号']
-        data: ['注册数', '新增封禁', '新增封号']
+        data: ['注册数', '新增封禁', '新增封号'],
+        textStyle: {
+            color: '#808080'
+        }
     },
     xAxis: {
         type: 'category',
@@ -144,7 +147,7 @@ onBeforeMount(async () => {
         margin-bottom: 1.25rem;
         /* height: 26.94rem; */
         border-radius: 0.5rem;
-        background: #fff;
+        background-color: var(--system-page-background);
         box-shadow: 0 0 0.13rem #00000029;
 
         .layout-container-main-top {
@@ -159,7 +162,7 @@ onBeforeMount(async () => {
                     width: 0.25rem;
                     height: 1.56rem;
                     border-radius: 0.13rem;
-                    background: #409eff;
+                    background-color: var(--system-primary-color);
                 }
 
                 span {
@@ -167,8 +170,7 @@ onBeforeMount(async () => {
                     font-family: "PingFang SC SNaNremibold";
                     font-weight: 600;
                     font-size: 1.13rem;
-
-                    color: #333;
+                    color: var(--system-page-color);
                 }
 
                 .text {
@@ -253,7 +255,18 @@ onBeforeMount(async () => {
 }
 
 :deep(.el-table__header th) {
-    background-color: #f5f7fa;
+    background-color: var(--system-page-background);
     font-weight: bold;
 }
+
+:deep() {
+  .el-table {
+    color: var(--system-page-color);
+    --el-table-tr-bg-color: var(--system-page-background);
+    --el-table-bg-color: var(--system-page-background);
+    --el-table-header-bg-color: var(--system-page-background);
+    --el-table-border-color: var(--system-page-border-color);
+    --el-table-row-hover-bg-color: var(--system-container-background);
+  }
+}
 </style>

src/views/main/riskModule/components/configForm.vue

@@ -139,7 +139,7 @@
             <template #footer v-if="layer.showButton">
                 <div>
                     <el-button type="primary" @click="confirm">确认</el-button>
-                    <el-button @click="close">取消</el-button>
+                    <el-button class="default-but" @click="close">取消</el-button>
                 </div>
             </template>
         </el-dialog>
@@ -586,4 +586,16 @@
             box-shadow: 0 0 0 1px red !important;
         }
     }
+    :deep() {
+        .default-but,
+        .el-dialog,
+        .el-card,
+        .el-dialog__title,
+        .el-input__wrapper,
+        .el-textarea__inner{
+            background-color: var(--system-page-background) !important;
+            color: var(--system-page-color) !important;
+            border-color: var(--system-page-border-color) !important;
+        }
+    }
 </style>