releases 4.2.33

x-extends · Oct 26, 2024 · 36f5ddc · 36f5ddc
1 parent 0cf94c9
commit 36f5ddc
Show file tree

Hide file tree

Showing 3 changed files with 169 additions and 64 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vxe-pc-ui",
-  "version": "4.2.32",
+  "version": "4.2.33",
   "description": "A vue based PC component library",
   "scripts": {
     "update": "npm install --legacy-peer-deps",
@@ -63,7 +63,7 @@
     "vue": "3.5.5",
     "vue-i18n": "^9.13.1",
     "vue-router": "^4.3.2",
-    "vxe-table": "^4.7.94"
+    "vxe-table": "^4.7.96"
   },
   "vetur": {
     "tags": "helper/vetur/tags.json",

diff --git a/styles/theme/light.scss b/styles/theme/light.scss
@@ -1,108 +1,109 @@
 @use './base.scss';
+@use '../variable.scss' as light-variable;
 
 [data-vxe-ui-theme="light"] {
   /*font color*/
-  --vxe-ui-font-color: #606266;
-  --vxe-ui-font-tinge-color: #d4d5d7;
-  --vxe-ui-font-lighten-color: #797b80;
-  --vxe-ui-font-darken-color: #47494c;
-  --vxe-ui-font-disabled-color: #BFBFBF;
+  --vxe-ui-font-color: #{light-variable.$vxe-ui-font-color};
+  --vxe-ui-font-tinge-color: #{light-variable.$vxe-ui-font-tinge-color};
+  --vxe-ui-font-lighten-color: #{light-variable.$vxe-ui-font-lighten-color};
+  --vxe-ui-font-darken-color: #{light-variable.$vxe-ui-font-darken-color};
+  --vxe-ui-font-disabled-color: #{light-variable.$vxe-ui-font-disabled-color};
 
   /*font status color*/
-  --vxe-ui-font-primary-color: #409eff;
-  --vxe-ui-font-primary-hover-color: #f5f7fa;
-  --vxe-ui-font-primary-tinge-color: #e8f3ff;
-  --vxe-ui-font-primary-lighten-color: #73b8ff;
-  --vxe-ui-font-primary-darken-color: #0d84ff;
-  --vxe-ui-font-primary-disabled-color: #a6d2ff;
+  --vxe-ui-font-primary-color: #{light-variable.$vxe-ui-font-primary-color};
+  --vxe-ui-font-primary-hover-color: #{light-variable.$vxe-ui-font-primary-hover-color};
+  --vxe-ui-font-primary-tinge-color: #{light-variable.$vxe-ui-font-primary-tinge-color};
+  --vxe-ui-font-primary-lighten-color: #{light-variable.$vxe-ui-font-primary-lighten-color};
+  --vxe-ui-font-primary-darken-color: #{light-variable.$vxe-ui-font-primary-darken-color};
+  --vxe-ui-font-primary-disabled-color: #{light-variable.$vxe-ui-font-primary-disabled-color};
 
-  --vxe-ui-status-success-color: #67c23a;
-  --vxe-ui-status-info-color: #909399;
-  --vxe-ui-status-warning-color: #e6a23c;
-  --vxe-ui-status-danger-color: #f56c6c;
-  --vxe-ui-status-error-color: #f56c6c;
+  --vxe-ui-status-success-color: #{light-variable.$vxe-ui-status-success-color};
+  --vxe-ui-status-info-color: #{light-variable.$vxe-ui-status-info-color};
+  --vxe-ui-status-warning-color: #{light-variable.$vxe-ui-status-warning-color};
+  --vxe-ui-status-danger-color: #{light-variable.$vxe-ui-status-danger-color};
+  --vxe-ui-status-error-color: #{light-variable.$vxe-ui-status-error-color};
 
-  --vxe-ui-status-success-tinge-color: #eef8e9;
-  --vxe-ui-status-info-tinge-color: #f5f5f6;
-  --vxe-ui-status-warning-tinge-color: #fcf4e8;
+  --vxe-ui-status-success-tinge-color: #{light-variable.$vxe-ui-status-success-tinge-color};
+  --vxe-ui-status-info-tinge-color: #{light-variable.$vxe-ui-status-info-tinge-color};
+  --vxe-ui-status-warning-tinge-color: #{light-variable.$vxe-ui-status-warning-tinge-color};
   --vxe-ui-status-danger-tinge-color: var(--vxe-ui-status-error-tinge-color);
-  --vxe-ui-status-error-tinge-color: #fef2f2;
+  --vxe-ui-status-error-tinge-color: #{light-variable.$vxe-ui-status-error-tinge-color};
 
-  --vxe-ui-status-success-lighten-color: #85cf60;
-  --vxe-ui-status-info-lighten-color: #abadb1;
-  --vxe-ui-status-warning-lighten-color: #ecb869;
+  --vxe-ui-status-success-lighten-color: #{light-variable.$vxe-ui-status-success-lighten-color};
+  --vxe-ui-status-info-lighten-color: #{light-variable.$vxe-ui-status-info-lighten-color};
+  --vxe-ui-status-warning-lighten-color: #{light-variable.$vxe-ui-status-warning-lighten-color};
   --vxe-ui-status-danger-lighten-color: var(--vxe-ui-status-error-lighten-color);
-  --vxe-ui-status-error-lighten-color: #f89c9c;
+  --vxe-ui-status-error-lighten-color: #{light-variable.$vxe-ui-status-error-lighten-color};
 
-  --vxe-ui-status-success-darken-color: #529b2e;
-  --vxe-ui-status-info-darken-color: #767980;
-  --vxe-ui-status-warning-darken-color: #d48a1b;
+  --vxe-ui-status-success-darken-color: #{light-variable.$vxe-ui-status-success-darken-color};
+  --vxe-ui-status-info-darken-color: #{light-variable.$vxe-ui-status-info-darken-color};
+  --vxe-ui-status-warning-darken-color: #{light-variable.$vxe-ui-status-warning-darken-color};
   --vxe-ui-status-danger-darken-color: var(--vxe-ui-status-error-darken-color);
-  --vxe-ui-status-error-darken-color: #f56c6c;
+  --vxe-ui-status-error-darken-color: #{light-variable.$vxe-ui-status-error-darken-color};
 
-  --vxe-ui-status-success-disabled-color: #a3db87;
-  --vxe-ui-status-info-disabled-color: #c5c7ca;
-  --vxe-ui-status-warning-disabled-color: #f2cd96;
+  --vxe-ui-status-success-disabled-color: #{light-variable.$vxe-ui-status-success-disabled-color};
+  --vxe-ui-status-info-disabled-color: #{light-variable.$vxe-ui-status-info-disabled-color};
+  --vxe-ui-status-warning-disabled-color: #{light-variable.$vxe-ui-status-warning-disabled-color};
   --vxe-ui-status-danger-disabled-color: var(--vxe-ui-status-error-disabled-color);
-  --vxe-ui-status-error-disabled-color: #f5a8a8;
+  --vxe-ui-status-error-disabled-color: #{light-variable.$vxe-ui-status-error-disabled-color};
 
   /*base*/
-  --vxe-ui-base-popup-border-color: #DADCE0;
-  --vxe-ui-base-popup-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.16);
-  --vxe-ui-base-drag-background-color: #dde9fd;
-  --vxe-ui-base-active-background-color: #e6f4ff;
-  --vxe-ui-base-hover-background-color: rgba(0, 0, 0, 0.04);
+  --vxe-ui-base-popup-border-color: #{light-variable.$vxe-ui-base-popup-border-color};
+  --vxe-ui-base-popup-box-shadow: #{light-variable.$vxe-ui-base-popup-box-shadow};
+  --vxe-ui-base-drag-background-color: #{light-variable.$vxe-ui-base-drag-background-color};
+  --vxe-ui-base-active-background-color: #{light-variable.$vxe-ui-base-active-background-color};
+  --vxe-ui-base-hover-background-color: #{light-variable.$vxe-ui-base-hover-background-color};
 
   /*layout*/
-  --vxe-ui-layout-background-color: #ffffff;
+  --vxe-ui-layout-background-color: #{light-variable.$vxe-ui-layout-background-color};
 
   /*input*/
-  --vxe-ui-input-border-color: #dcdfe6;
-  --vxe-ui-input-placeholder-color: #C0C4CC;
-  --vxe-ui-input-disabled-background-color: #f3f3f3;
+  --vxe-ui-input-border-color: #{light-variable.$vxe-ui-input-border-color};
+  --vxe-ui-input-placeholder-color: #{light-variable.$vxe-ui-input-placeholder-color};
+  --vxe-ui-input-disabled-background-color: #{light-variable.$vxe-ui-input-disabled-background-color};
 
   /*modal*/
-  --vxe-ui-modal-header-background-color: #F8F8F8;
+  --vxe-ui-modal-header-background-color: #{light-variable.$vxe-ui-modal-header-background-color};
 
   /*tabs*/
-  --vxe-ui-tabs-card-header-background-color: #f5f7fa;
-  --vxe-ui-tabs-close-hover-background-color: rgba(0, 0, 0, 0.1);
-  --vxe-ui-tabs-bar-scrolling-box-shadow-color: rgba(0, 0, 0, 0.12);
+  --vxe-ui-tabs-card-header-background-color: #{light-variable.$vxe-ui-tabs-card-header-background-color};
+  --vxe-ui-tabs-close-hover-background-color: #{light-variable.$vxe-ui-tabs-close-hover-background-color};
+  --vxe-ui-tabs-bar-scrolling-box-shadow-color: #{light-variable.$vxe-ui-tabs-bar-scrolling-box-shadow-color};
 
   /*menu*/
-  --vxe-ui-menu-item-hover-color: var(--vxe-ui-font-primary-color);
+  --vxe-ui-menu-item-hover-color: #{light-variable.$vxe-ui-menu-item-hover-color};
   --vxe-ui-menu-collapse-wrapper-box-shadow: var(--vxe-ui-base-popup-box-shadow);
 
   /*loading*/
-  --vxe-ui-loading-background-color: rgba(255, 255, 255, 0.5);
+  --vxe-ui-loading-background-color: #{light-variable.$vxe-ui-loading-background-color};
 
   /*form*/
-  --vxe-ui-form-title-background-color: #f8f8f9;
-  --vxe-ui-form-border-color: #e8eaec;
+  --vxe-ui-form-title-background-color: #{light-variable.$vxe-ui-form-title-background-color};
+  --vxe-ui-form-border-color: #{light-variable.$vxe-ui-form-border-color};
 
   /*form-design*/
   --vxe-ui-form-design-widget-hover-background-color: var(--vxe-ui-base-hover-background-color);
-  --vxe-ui-form-design-sub-widget-hover-background-color: rgba(0, 0, 0, 0.05);
+  --vxe-ui-form-design-sub-widget-hover-background-color: #{light-variable.$vxe-ui-form-design-sub-widget-hover-background-color};
 
   /*list-design*/
-  --vxe-ui-list-design-table-border-color: #e8eaec;
-  --vxe-ui-list-design-table-header-background-color: #f8f8f9;
+  --vxe-ui-list-design-table-border-color: #{light-variable.$vxe-ui-list-design-table-border-color};
+  --vxe-ui-list-design-table-header-background-color: #{light-variable.$vxe-ui-list-design-table-header-background-color};
 
   /*switch*/
-  --vxe-ui-switch-close-background-color: rgba(0,0,0,0.35);
+  --vxe-ui-switch-close-background-color: #{light-variable.$vxe-ui-switch-close-background-color};
 
   /*upload*/
-  --vxe-ui-upload-drag-over-background-color:rgba(255,255,200,0.8);
+  --vxe-ui-upload-drag-over-background-color:#{light-variable.$vxe-ui-upload-drag-over-background-color};
 
   /*tree*/
-  --vxe-ui-tree-node-hover-background-color: #f5f7fa;
-  --vxe-ui-tree-node-radio-checked-background-color: #fff3e0;
-  --vxe-ui-tree-node-hover-radio-checked-background-color: #ffebbc;
-  --vxe-ui-tree-node-checkbox-checked-background-color: #fff3e0;
-  --vxe-ui-tree-node-hover-checkbox-checked-background-color: #ffebbc;
-  --vxe-ui-tree-node-current-background-color: #e6f7ff;
-  --vxe-ui-tree-node-hover-current-background-color: #d7effb;
+  --vxe-ui-tree-node-hover-background-color: #{light-variable.$vxe-ui-tree-node-hover-background-color};
+  --vxe-ui-tree-node-radio-checked-background-color: #{light-variable.$vxe-ui-tree-node-radio-checked-background-color};
+  --vxe-ui-tree-node-hover-radio-checked-background-color: #{light-variable.$vxe-ui-tree-node-hover-radio-checked-background-color};
+  --vxe-ui-tree-node-checkbox-checked-background-color: #{light-variable.$vxe-ui-tree-node-checkbox-checked-background-color};
+  --vxe-ui-tree-node-hover-checkbox-checked-background-color: #{light-variable.$vxe-ui-tree-node-hover-checkbox-checked-background-color};
+  --vxe-ui-tree-node-current-background-color: #{light-variable.$vxe-ui-tree-node-current-background-color};
+  --vxe-ui-tree-node-hover-current-background-color: #{light-variable.$vxe-ui-tree-node-hover-current-background-color};
 
   /*rate*/
-  --vxe-ui-rate-item-color: #f7ba2a;
+  --vxe-ui-rate-item-color: #{light-variable.$vxe-ui-rate-item-color};
 }
diff --git a/styles/variable.scss b/styles/variable.scss
@@ -0,0 +1,104 @@
+/*font color*/
+$vxe-ui-font-color: #606266;
+$vxe-ui-font-tinge-color: #d4d5d7;
+$vxe-ui-font-lighten-color: #797b80;
+$vxe-ui-font-darken-color: #47494c;
+$vxe-ui-font-disabled-color: #BFBFBF;
+
+/*font status color*/
+$vxe-ui-font-primary-color: #409eff;
+$vxe-ui-font-primary-hover-color: #f5f7fa;
+$vxe-ui-font-primary-tinge-color: #e8f3ff;
+$vxe-ui-font-primary-lighten-color: #73b8ff;
+$vxe-ui-font-primary-darken-color: #0d84ff;
+$vxe-ui-font-primary-disabled-color: #a6d2ff;
+
+$vxe-ui-status-success-color: #67c23a;
+$vxe-ui-status-info-color: #909399;
+$vxe-ui-status-warning-color: #e6a23c;
+$vxe-ui-status-danger-color: #f56c6c;
+$vxe-ui-status-error-color: #f56c6c;
+
+$vxe-ui-status-success-tinge-color: #eef8e9;
+$vxe-ui-status-info-tinge-color: #f5f5f6;
+$vxe-ui-status-warning-tinge-color: #fcf4e8;
+$vxe-ui-status-error-tinge-color: #fef2f2;
+$vxe-ui-status-danger-tinge-color: $vxe-ui-status-error-tinge-color;
+
+$vxe-ui-status-success-lighten-color: #85cf60;
+$vxe-ui-status-info-lighten-color: #abadb1;
+$vxe-ui-status-warning-lighten-color: #ecb869;
+$vxe-ui-status-error-lighten-color: #f89c9c;
+$vxe-ui-status-danger-lighten-color: $vxe-ui-status-error-lighten-color;
+
+$vxe-ui-status-success-darken-color: #529b2e;
+$vxe-ui-status-info-darken-color: #767980;
+$vxe-ui-status-warning-darken-color: #d48a1b;
+$vxe-ui-status-error-darken-color: #f56c6c;
+$vxe-ui-status-danger-darken-color: $vxe-ui-status-error-darken-color;
+
+$vxe-ui-status-success-disabled-color: #a3db87;
+$vxe-ui-status-info-disabled-color: #c5c7ca;
+$vxe-ui-status-warning-disabled-color: #f2cd96;
+$vxe-ui-status-error-disabled-color: #f5a8a8;
+$vxe-ui-status-danger-disabled-color: $vxe-ui-status-error-disabled-color;
+
+/*base*/
+$vxe-ui-base-popup-border-color: #DADCE0;
+$vxe-ui-base-popup-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.16);
+$vxe-ui-base-drag-background-color: #dde9fd;
+$vxe-ui-base-active-background-color: #e6f4ff;
+$vxe-ui-base-hover-background-color: rgba(0, 0, 0, 0.04);
+
+/*layout*/
+$vxe-ui-layout-background-color: #ffffff;
+
+/*input*/
+$vxe-ui-input-border-color: #dcdfe6;
+$vxe-ui-input-placeholder-color: #C0C4CC;
+$vxe-ui-input-disabled-background-color: #f3f3f3;
+
+/*modal*/
+$vxe-ui-modal-header-background-color: #F8F8F8;
+
+/*tabs*/
+$vxe-ui-tabs-card-header-background-color: #f5f7fa;
+$vxe-ui-tabs-close-hover-background-color: rgba(0, 0, 0, 0.1);
+$vxe-ui-tabs-bar-scrolling-box-shadow-color: rgba(0, 0, 0, 0.12);
+
+/*menu*/
+$vxe-ui-menu-item-hover-color: $vxe-ui-font-primary-color;
+$vxe-ui-menu-collapse-wrapper-box-shadow: $vxe-ui-base-popup-box-shadow;
+
+/*loading*/
+$vxe-ui-loading-background-color: rgba(255, 255, 255, 0.5);
+
+/*form*/
+$vxe-ui-form-title-background-color: #f8f8f9;
+$vxe-ui-form-border-color: #e8eaec;
+
+/*form-design*/
+$vxe-ui-form-design-widget-hover-background-color: $vxe-ui-base-hover-background-color;
+$vxe-ui-form-design-sub-widget-hover-background-color: rgba(0, 0, 0, 0.05);
+
+/*list-design*/
+$vxe-ui-list-design-table-border-color: #e8eaec;
+$vxe-ui-list-design-table-header-background-color: #f8f8f9;
+
+/*switch*/
+$vxe-ui-switch-close-background-color: rgba(0,0,0,0.35);
+
+/*upload*/
+$vxe-ui-upload-drag-over-background-color:rgba(255,255,200,0.8);
+
+/*tree*/
+$vxe-ui-tree-node-hover-background-color: #f5f7fa;
+$vxe-ui-tree-node-radio-checked-background-color: #fff3e0;
+$vxe-ui-tree-node-hover-radio-checked-background-color: #ffebbc;
+$vxe-ui-tree-node-checkbox-checked-background-color: #fff3e0;
+$vxe-ui-tree-node-hover-checkbox-checked-background-color: #ffebbc;
+$vxe-ui-tree-node-current-background-color: #e6f7ff;
+$vxe-ui-tree-node-hover-current-background-color: #d7effb;
+
+/*rate*/
+$vxe-ui-rate-item-color: #f7ba2a;