feat: vxe-table 适配多主题

4 files changed, 24 insertions, 14 deletions

diff --git a/src/styles/theme/core/layout.scss b/src/styles/theme/core/layout.scss
index 0dec9d1..133944d 100644
--- a/src/styles/theme/core/layout.scss
+++ b/src/styles/theme/core/layout.scss
@@ -44,7 +44,7 @@
       color: $font-color !important;
       border: 1px solid $border-color !important;
       &.active {
-        background-color: $active-theme-bg-color !important;
+        background-color: $theme-color !important;
         color: $active-font-color !important;
         border-color: $border-color !important;
       }
diff --git a/src/styles/theme/core/vxe-table.scss b/src/styles/theme/core/vxe-table.scss
index ee491f1..57fa5ef 100644
--- a/src/styles/theme/core/vxe-table.scss
+++ b/src/styles/theme/core/vxe-table.scss
@@ -7,36 +7,46 @@
 $vxe-font-color: $font-color;
 
 /** color */
-// $vxe-primary-color: $active-theme-bg-color;
-// $vxe-success-color: $active-theme-bg-color;
+$vxe-primary-color: $theme-color;
+$vxe-success-color: $theme-color;
+
+/** input/radio/checkbox */
+$vxe-input-border-color: $theme-color;
+$vxe-input-disabled-color: $theme-color;
+$vxe-input-disabled-background-color: lighten($theme-bg-color, 12%);
+
+/** popup */
+$vxe-table-popup-border-color: $border-color;
 
 /** table */
 $vxe-table-font-color: $font-color;
 $vxe-table-border-color: $border-color;
-$vxe-table-header-background-color: lighten($theme-bg-color, 4%);
+$vxe-table-header-background-color: lighten($theme-bg-color, 8%);
 $vxe-table-body-background-color: lighten($theme-bg-color, 4%);
 $vxe-table-row-hover-background-color: lighten($theme-bg-color, 8%);
-$vxe-table-checkbox-range-background-color: lighten($theme-bg-color, 8%);
 $vxe-table-row-current-background-color: lighten($theme-bg-color, 8%);
 $vxe-table-row-hover-current-background-color: lighten($theme-bg-color, 8%);
+$vxe-table-checkbox-range-background-color: lighten($theme-bg-color, 8%);
 
 /** toolbar */
-$vxe-toolbar-background-color: $theme-bg-color;
+$vxe-toolbar-background-color: lighten($theme-bg-color, 4%);
+$vxe-toolbar-custom-active-background-color: lighten($theme-bg-color, 16%);
+$vxe-toolbar-panel-background-color: lighten($theme-bg-color, 4%);
 
 /** pager */
 $vxe-pager-background-color: lighten($theme-bg-color, 4%);
 
 /** modal */
-$vxe-modal-header-background-color: $theme-bg-color;
-$vxe-modal-body-background-color: $theme-bg-color;
+$vxe-modal-header-background-color: lighten($theme-bg-color, 4%);
+$vxe-modal-body-background-color: lighten($theme-bg-color, 4%);
 $vxe-modal-border-color: $border-color;
 
 /** button */
 $vxe-button-default-background-color: lighten($theme-bg-color, 8%);
 
 /** input */
-$vxe-input-background-color: lighten($theme-bg-color, 8%);
-$vxe-input-panel-background-color: lighten($theme-bg-color, 8%);
+$vxe-input-background-color: lighten($theme-bg-color, 4%);
+$vxe-input-panel-background-color: $vxe-input-background-color;
 
 /** form */
 $vxe-form-background-color: lighten($theme-bg-color, 4%);
diff --git a/src/styles/theme/dark-blue/variables.scss b/src/styles/theme/dark-blue/variables.scss
index a99d383..d71847d 100644
--- a/src/styles/theme/dark-blue/variables.scss
+++ b/src/styles/theme/dark-blue/variables.scss
@@ -4,8 +4,8 @@
 $theme-name: "dark-blue";
 // 主题背景颜色
 $theme-bg-color: #021633;
-// active 状态下主题背景颜色
-$active-theme-bg-color: var(--el-color-primary);
+// 主题色
+$theme-color: #01efb7bb;
 // 默认文字颜色
 $font-color: rgba(255, 255, 255, 0.8);
 // active 状态下文字颜色
diff --git a/src/styles/theme/dark/variables.scss b/src/styles/theme/dark/variables.scss
index f4d8918..9ce62b9 100644
--- a/src/styles/theme/dark/variables.scss
+++ b/src/styles/theme/dark/variables.scss
@@ -4,8 +4,8 @@
 $theme-name: "dark";
 // 主题背景颜色
 $theme-bg-color: #151515;
-// active 状态下主题背景颜色
-$active-theme-bg-color: var(--el-color-primary);
+// 主题色
+$theme-color: #409eff;
 // 默认文字颜色
 $font-color: #c0c4cc;
 // active 状态下文字颜色