（部分兼容）参数 start-week 更改为 start-day、修改数据无法还原问题

2026-01-21 05:27:57 +08:00 · 2021-05-07 20:41:00 +08:00
parent 7b3f50d96e
commit 72923c6d63
23 changed files with 125 additions and 67 deletions
--- a/examples/api/input.js
+++ b/examples/api/input.js
@@ -218,11 +218,30 @@ const apis = [
      },
      {
        name: 'start-week',
-        desc: '只对 type=week 有效，设置起始周',
+        disabled: true,
+        desc: '即将废弃，请使用 start-day',
        version: '',
        type: 'number | string',
        enum: '0, 1, 2, 3, 4, 5, 6',
-        defVal: '默认 1，继承 setup.input.startWeek',
+        defVal: '',
+        list: []
+      },
+      {
+        name: 'start-day',
+        desc: '设置每周的起始日期是星期几',
+        version: '3.3.2',
+        type: 'number | string',
+        enum: '0, 1, 2, 3, 4, 5, 6',
+        defVal: '默认 1，继承 setup.input.startDay',
+        list: []
+      },
+      {
+        name: 'select-day',
+        desc: '只对 type=week 有效，设置周视图选中后返回星期几',
+        version: '3.3.2',
+        type: 'number | string',
+        enum: '0, 1, 2, 3, 4, 5, 6',
+        defVal: '默认 1，继承 setup.input.selectDay',
        list: []
      },
      {
--- a/examples/views/input/Input.vue
+++ b/examples/views/input/Input.vue
@@ -3,7 +3,7 @@
    <h2>{{ $t('app.aside.nav.input') }}</h2>
    <p class="tip">
      输入框、选择器，查看 <router-link class="link" :to="{name: 'VXEAPI', params: {name: 'input'}}">API</router-link><br>
-      <span class="red">（注：输入组件只能是字符串类型，其他类型谨慎使用）</span>
+      <span class="red">（注：输入组件输出为字符串类型）</span>
    </p>

    <p>
--- a/examples/views/pulldown/Pulldown.vue
+++ b/examples/views/pulldown/Pulldown.vue
@@ -58,6 +58,7 @@
        <template #dropdown>
          <div class="my-dropdown4">
            <vxe-grid
+              border
              highlight-hover-row
              auto-resize
              height="auto"
@@ -176,6 +177,7 @@ export default {
            <template #dropdown>
              <div class="my-dropdown4">
                <vxe-grid
+                  border
                  highlight-hover-row
                  auto-resize
                  height="auto"
@@ -308,16 +310,16 @@ export default {
          height: 200px;
          overflow: auto;
          border-radius: 4px;
-          background-color: #fff;
          border: 1px solid #dcdfe6;
+          background-color: #fff;
        }
        .list-item1:hover {
          background-color: #f5f7fa;
        }
        .my-dropdown2 {
          border-radius: 4px;
-          background-color: #fff;
          border: 1px solid #dcdfe6;
+          background-color: #fff;
        }
        .list-item2:hover {
          background-color: #f5f7fa;
@@ -325,14 +327,12 @@ export default {
        .my-dropdown3 {
          width: 400px;
          background-color: #fff;
-          border: 1px solid #dcdfe6;
          box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
        }
        .my-dropdown4 {
          width: 600px;
          height: 300px;
          background-color: #fff;
-          border: 1px solid #dcdfe6;
          box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
        }
        `
@@ -419,16 +419,16 @@ export default {
  height: 200px;
  overflow: auto;
  border-radius: 4px;
-  background-color: #fff;
  border: 1px solid #dcdfe6;
+  background-color: #fff;
 }
 .list-item1:hover {
  background-color: #f5f7fa;
 }
 .my-dropdown2 {
  border-radius: 4px;
-  background-color: #fff;
  border: 1px solid #dcdfe6;
+  background-color: #fff;
 }
 .list-item2:hover {
  background-color: #f5f7fa;
@@ -436,14 +436,12 @@ export default {
 .my-dropdown3 {
  width: 400px;
  background-color: #fff;
-  border: 1px solid #dcdfe6;
  box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
 }
 .my-dropdown4 {
  width: 600px;
  height: 300px;
  background-color: #fff;
-  border: 1px solid #dcdfe6;
  box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
 }
 </style>
--- a/examples/views/table/advanced/Dynamic.vue
+++ b/examples/views/table/advanced/Dynamic.vue
@@ -1,9 +1,9 @@
 <template>
  <div>
    <p class="tip">
-      使用 v-for 去循环静态列是不建议的，需确保 key 唯一性<span class="green">（动态场景需使用 <grid-api-link name="vxe-grid"/> 进行渲染）</span><br>
+      使用 v-for 去循环静态列是非常糟糕的，仅用于改变属性，需确保 key 唯一性<span class="green">（动态场景需使用 <grid-api-link name="vxe-grid"/> 进行渲染）</span><br>
      如果列信息发生变动，则需要通过调用 <table-api-link prop="refreshColumn"/> 方法刷新列信息<br>
-      <span class="red">（注：该用法是不建议使用，该示例仅供参考）</span>
+      <span class="red">（注：该用法是不建议使用，所有兼容性应自行解决，该示例仅供参考）</span>
    </p>

    <vxe-toolbar>
--- a/examples/views/table/base/Resizable.vue
+++ b/examples/views/table/base/Resizable.vue
@@ -7,7 +7,7 @@
      :data="tableData">
      <vxe-table-column type="seq" width="60"></vxe-table-column>
      <vxe-table-column field="name" title="Name"></vxe-table-column>
-      <vxe-table-column field="sex" title="Sex"></vxe-table-column>
+      <vxe-table-column field="sex" title="最小列宽" min-width="20%"></vxe-table-column>
      <vxe-table-column field="age" title="Age"></vxe-table-column>
      <vxe-table-column field="time" title="Time"></vxe-table-column>
      <vxe-table-column field="address" title="Address" show-overflow></vxe-table-column>
@@ -29,7 +29,7 @@
      :data="tableData">
      <vxe-table-column type="seq" width="60"></vxe-table-column>
      <vxe-table-column field="name" title="Name" width="300"></vxe-table-column>
-      <vxe-table-column field="sex" title="Sex" width="300"></vxe-table-column>
+      <vxe-table-column field="sex" title="最小列宽" min-width="300"></vxe-table-column>
      <vxe-table-column field="age" title="Age" width="300"></vxe-table-column>
      <vxe-table-column field="time" title="Time" width="300"></vxe-table-column>
      <vxe-table-column field="address" title="Address" width="300" show-overflow></vxe-table-column>
@@ -198,7 +198,7 @@ export default {
          :data="tableData">
          <vxe-table-column type="seq" width="60"></vxe-table-column>
          <vxe-table-column field="name" title="Name"></vxe-table-column>
-          <vxe-table-column field="sex" title="Sex"></vxe-table-column>
+          <vxe-table-column field="sex" title="最小列宽" min-width="20%"></vxe-table-column>
          <vxe-table-column field="age" title="Age"></vxe-table-column>
          <vxe-table-column field="time" title="Time"></vxe-table-column>
          <vxe-table-column field="address" title="Address" show-overflow></vxe-table-column>
@@ -226,7 +226,7 @@ export default {
          :data="tableData">
          <vxe-table-column type="seq" width="60"></vxe-table-column>
          <vxe-table-column field="name" title="Name" width="300"></vxe-table-column>
-          <vxe-table-column field="sex" title="Sex" width="300"></vxe-table-column>
+          <vxe-table-column field="sex" title="最小列宽" min-width="300"></vxe-table-column>
          <vxe-table-column field="age" title="Age" width="300"></vxe-table-column>
          <vxe-table-column field="time" title="Time" width="300"></vxe-table-column>
          <vxe-table-column field="address" title="Address" width="300" show-overflow></vxe-table-column>
--- a/examples/views/table/start/Global.vue
+++ b/examples/views/table/start/Global.vue
@@ -133,7 +133,7 @@
          //   parseFormat: 'yyyy-MM-dd HH:mm:ss.SSS',
          //   labelFormat: '',
          //   valueFormat: '',
-          //   startWeek: 1,
+          //   startDay: 1,
          //   digits: 2,
          //   controls: true
          // },
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "vxe-table",
-  "version": "3.3.1",
+  "version": "3.3.2-beta.0",
  "description": "一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟滚动、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、虚拟列表、弹窗、自定义模板、渲染器、贼灵活的配置项、扩展接口等...",
  "scripts": {
    "serve": "vue-cli-service serve",
--- a/packages/input/src/input.js
+++ b/packages/input/src/input.js
@@ -656,13 +656,18 @@ export default {
    dateConfig: Object,
    minDate: { type: [String, Number, Date], default: () => GlobalConfig.input.minDate },
    maxDate: { type: [String, Number, Date], default: () => GlobalConfig.input.maxDate },
-    startWeek: { type: Number, default: () => GlobalConfig.input.startWeek },
+    // 已废弃 startWeek，被 startDay 替换
+    startWeek: Number,
+    startDay: { type: [String, Number], default: () => GlobalConfig.input.startDay },
    labelFormat: { type: String, default: () => GlobalConfig.input.labelFormat },
    valueFormat: { type: String, default: () => GlobalConfig.input.valueFormat },
    editable: { type: Boolean, default: true },
    festivalMethod: { type: Function, default: () => GlobalConfig.input.festivalMethod },
    disabledMethod: { type: Function, default: () => GlobalConfig.input.disabledMethod },

+    // week
+    selectDay: { type: Number, default: () => GlobalConfig.input.selectDay },
+
    prefixIcon: String,
    suffixIcon: String,
    placement: String,
@@ -798,7 +803,8 @@ export default {
    weekDatas () {
      const weeks = []
      if (this.isDatePickerType) {
-        let sWeek = XEUtils.toNumber(this.startWeek)
+        const { startDay, startWeek } = this
+        let sWeek = XEUtils.toNumber(XEUtils.isNumber(startDay) || XEUtils.isString(startDay) ? startDay : startWeek)
        weeks.push(sWeek)
        for (let index = 0; index < 6; index++) {
          if (sWeek >= 6) {
@@ -1290,15 +1296,21 @@ export default {
                  }
                  this.inputValue = inpDateVal
                } else {
+                  let isChange = false
                  if (type === 'datetime') {
-                    if (!XEUtils.isDateSame(inputValue, inpDateVal, dateLabelFormat)) {
+                    if (inputValue !== XEUtils.toDateString(this.dateValue, dateLabelFormat) || inputValue !== XEUtils.toDateString(inpDateVal, dateLabelFormat)) {
+                      isChange = true
                      datetimePanelValue.setHours(inpDateVal.getHours())
                      datetimePanelValue.setMinutes(inpDateVal.getMinutes())
                      datetimePanelValue.setSeconds(inpDateVal.getSeconds())
                    }
+                  } else {
+                    isChange = true
                  }
                  this.inputValue = XEUtils.toDateString(inpDateVal, dateLabelFormat)
-                  this.dateChange(inpDateVal)
+                  if (isChange) {
+                    this.dateChange(inpDateVal)
+                  }
                }
              } else {
                this.dateRevert()
@@ -1698,7 +1710,7 @@ export default {
    dateChange (date) {
      const { value, datetimePanelValue, dateValueFormat } = this
      if (this.type === 'week') {
-        const sWeek = XEUtils.toNumber(this.startWeek)
+        const sWeek = XEUtils.toNumber(this.selectDay)
        date = XEUtils.getWhatWeek(date, 0, sWeek)
      } else if (this.hasTime) {
        date.setHours(datetimePanelValue.getHours())
--- a/packages/table/src/methods.js
+++ b/packages/table/src/methods.js
@@ -840,10 +840,14 @@ const Methods = {
  revertData (rows, field) {
    const { keepSource, tableSourceData, treeConfig } = this
    if (keepSource) {
-      if (arguments.length) {
-        if (rows && !XEUtils.isArray(rows)) {
+      if (rows) {
+        if (!XEUtils.isArray(rows)) {
          rows = [rows]
        }
+      } else {
+        rows = XEUtils.toArray(this.getUpdateRecords())
+      }
+      if (rows.length) {
        rows.forEach(row => {
          if (!this.isInsertByRow(row)) {
            const rowIndex = this.getRowIndex(row)
--- a/packages/table/src/util.js
+++ b/packages/table/src/util.js
@@ -1,5 +1,6 @@
 import VXETable from '../../v-x-e-table'
 import XEUtils from 'xe-utils'
+import { DomTools } from '../../tools'

 const lineOffsetSizes = {
  mini: 3,
@@ -42,13 +43,14 @@ export function getColMinWidth (params) {
  const { $table, column, cell } = params
  const { showHeaderOverflow: allColumnHeaderOverflow, resizableOpts } = $table
  const { minWidth } = resizableOpts
+  // 如果自定义调整宽度逻辑
  if (minWidth) {
    const customMinWidth = XEUtils.isFunction(minWidth) ? minWidth(params) : minWidth
    if (customMinWidth !== 'auto') {
      return Math.max(1, XEUtils.toNumber(customMinWidth))
    }
  }
-  const { showHeaderOverflow } = column
+  const { showHeaderOverflow, minWidth: colMinWidth } = column
  const headOverflow = XEUtils.isUndefined(showHeaderOverflow) || XEUtils.isNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow
  const showEllipsis = headOverflow === 'ellipsis'
  const showTitle = headOverflow === 'title'
@@ -56,7 +58,8 @@ export function getColMinWidth (params) {
  const hasEllipsis = showTitle || showTooltip || showEllipsis
  const minTitleWidth = XEUtils.floor((XEUtils.toNumber(getComputedStyle(cell).fontSize) || 14) * 1.6)
  const paddingLeftRight = getPaddingLeftRightSize(cell) + getPaddingLeftRightSize(queryCellElement(cell, ''))
-  let colMinWidth = minTitleWidth + paddingLeftRight
+  let mWidth = minTitleWidth + paddingLeftRight
+  // 默认最小宽处理
  if (hasEllipsis) {
    const checkboxIconWidth = getPaddingLeftRightSize(queryCellElement(cell, '--title>.vxe-cell--checkbox'))
    const requiredIconWidth = getElemenMarginWidth(queryCellElement(cell, '>.vxe-cell--required-icon'))
@@ -64,9 +67,23 @@ export function getColMinWidth (params) {
    const helpIconWidth = getElemenMarginWidth(queryCellElement(cell, '>.vxe-cell-help-icon'))
    const sortIconWidth = getElemenMarginWidth(queryCellElement(cell, '>.vxe-cell--sort'))
    const filterIconWidth = getElemenMarginWidth(queryCellElement(cell, '>.vxe-cell--filter'))
-    colMinWidth += checkboxIconWidth + requiredIconWidth + editIconWidth + helpIconWidth + filterIconWidth + sortIconWidth
+    mWidth += checkboxIconWidth + requiredIconWidth + editIconWidth + helpIconWidth + filterIconWidth + sortIconWidth
  }
-  return colMinWidth
+  // 如果设置最小宽
+  if (colMinWidth) {
+    const { tableBody } = $table.$refs
+    const bodyElem = tableBody ? tableBody.$el : null
+    if (bodyElem) {
+      if (DomTools.isScale(colMinWidth)) {
+        const bodyWidth = bodyElem.clientWidth - 1
+        const meanWidth = bodyWidth / 100
+        return Math.max(mWidth, Math.floor(XEUtils.toInteger(colMinWidth) * meanWidth))
+      } else if (DomTools.isPx(colMinWidth)) {
+        return Math.max(mWidth, XEUtils.toInteger(colMinWidth))
+      }
+    }
+  }
+  return mWidth
 }

 function countTreeExpand (prevRow, params) {
--- a/packages/v-x-e-table/src/conf.js
+++ b/packages/v-x-e-table/src/conf.js
@@ -250,7 +250,8 @@ export default {
    // valueFormat: '',
    minDate: new Date(1900, 0, 1),
    maxDate: new Date(2100, 0, 1),
-    startWeek: 1,
+    startDay: 1,
+    selectDay: 1,
    digits: 2,
    controls: true
  },
--- a/styles/button.scss
+++ b/styles/button.scss
@@ -366,7 +366,7 @@ $btnThemeList: (
 }
 .vxe-button--dropdown-wrapper {
  padding: 5px;
-  background-color: #fff;
+  background-color: $vxe-button-dropdown-panel-background-color;
  border-radius: $vxe-border-radius;
  border: 1px solid $vxe-input-border-color;
  box-shadow: 0 1px 6px rgba(0,0,0,.2);
--- a/styles/checkbox.scss
+++ b/styles/checkbox.scss
@@ -17,6 +17,7 @@
  user-select: none;
  line-height: 1;
  cursor: pointer;
+  color: $vxe-font-color;
  &+.vxe-checkbox {
    margin-left: 10px;
  }
--- a/styles/footer.scss
+++ b/styles/footer.scss
@@ -1,8 +1,8 @@
 /**Variable**/

 .vxe-table--footer-wrapper {
+  color: $vxe-table-footer-font-color;
  margin-top: -1px;
-  background-color: $vxe-table-background-color;
  &.body--wrapper{
    overflow-x: auto;
  }
--- a/styles/header.scss
+++ b/styles/header.scss
@@ -2,6 +2,7 @@

 .vxe-table {
  .vxe-table--header-wrapper {
+    color: $vxe-table-header-font-color;
    .vxe-table--header-border-line {
      position: absolute;
      left: 0;
--- a/styles/input.scss
+++ b/styles/input.scss
@@ -20,6 +20,9 @@ $iconWidth: 1.6em;
  &::placeholder {
    color: $vxe-input-placeholder-color;
  }
+  &::-webkit-autofill {
+    background-color: $vxe-input-background-color;
+  }
  &[type="number"] {
    appearance: none;
    -moz-appearance: textfield;
--- a/styles/list.scss
+++ b/styles/list.scss
@@ -4,6 +4,7 @@
  position: relative;
  display: block;
  padding: 0;
+  color: $vxe-font-color;
  .vxe-list--virtual-wrapper {
    position: relative;
    overflow: auto;
--- a/styles/pager.scss
+++ b/styles/pager.scss
@@ -97,14 +97,7 @@
  &.is--perfect {
    border: 1px solid $vxe-table-border-color;
    border-top-width: 0;
-    background-color: $vxe-table-header-background-color;
-    .vxe-pager--prev-btn,
-    .vxe-pager--next-btn,
-    .vxe-pager--jump-prev,
-    .vxe-pager--num-btn,
-    .vxe-pager--jump-next {
-      background-color: #fff;
-    }
+    background-color: $vxe-pager-perfect-background-color;
  }
  &.is--border {
    .vxe-pager--num-btn {
--- a/styles/radio.scss
+++ b/styles/radio.scss
@@ -21,6 +21,7 @@
  user-select: none;
  line-height: 1;
  cursor: pointer;
+  color: $vxe-font-color;
  > input {
    &[type="radio"] {
      position: absolute;
@@ -107,7 +108,7 @@

 .vxe-radio-button {
  .vxe-radio--label {
-    background-color: #fff;
+    background-color: $vxe-radio-button-default-background-color;
  }
  &:first-child {
    .vxe-radio--label {
--- a/styles/switch.scss
+++ b/styles/switch.scss
@@ -18,7 +18,7 @@
  &.is--on {
    .vxe-switch--button {
      padding-right: 1.7em;
-      background-color: $vxe-primary-color;
+      background-color: $vxe-switch-open-background-color;
    }
    .vxe-switch--icon {
      left: 100%;
@@ -28,7 +28,7 @@
  &.is--off {
    .vxe-switch--button {
      padding-left: 1.7em;
-      background-color: rgba(0,0,0,.35);
+      background-color: $vxe-switch-close-background-color;
    }
    .vxe-switch--icon {
      left: 0.2em;
@@ -66,7 +66,7 @@
    }
    &.is--off {
      .vxe-switch--button {
-        background-color: rgba(0,0,0,.15);
+        background-color: $vxe-switch-disabled-background-color;
      }
    }
  }
--- a/styles/table.scss
+++ b/styles/table.scss
@@ -351,10 +351,10 @@
      background-color: $vxe-table-row-striped-background-color;
    }
    &.row--radio {
-      background-color: $vxe-table-row-radio-background-color;
+      background-color: $vxe-table-row-radio-checked-background-color;
    }
    &.row--checked {
-      background-color: $vxe-table-row-checked-background-color;
+      background-color: $vxe-table-row-checkbox-checked-background-color;
    }
    &.row--current {
      background-color: $vxe-table-row-current-background-color;
@@ -365,10 +365,10 @@
        background-color: $vxe-table-row-hover-striped-background-color;
      }
      &.row--radio {
-        background-color: $vxe-table-row-hover-radio-background-color;
+        background-color: $vxe-table-row-hover-radio-checked-background-color;
      }
      &.row--checked {
-        background-color: $vxe-table-row-hover-checked-background-color;
+        background-color: $vxe-table-row-hover-checkbox-checked-background-color;
      }
      &.row--current {
        background-color: $vxe-table-row-hover-current-background-color;
@@ -384,12 +384,12 @@
  //     }
  //     &.row--radio {
  //       .vxe-tree--btn-wrapper {
-  //         background-color: $vxe-table-row-radio-background-color;
+  //         background-color: $vxe-table-row-radio-checked-background-color;
  //       }
  //     }
  //     &.row--checked {
  //       .vxe-tree--btn-wrapper {
-  //         background-color: $vxe-table-row-checked-background-color;
+  //         background-color: $vxe-table-row-checkbox-checked-background-color;
  //       }
  //     }
  //     &.row--current {
@@ -408,12 +408,12 @@
  //       }
  //       &.row--radio {
  //         .vxe-tree--btn-wrapper {
-  //           background-color: $vxe-table-row-hover-radio-background-color;
+  //           background-color: $vxe-table-row-hover-radio-checked-background-color;
  //         }
  //       }
  //       &.row--checked {
  //         .vxe-tree--btn-wrapper {
-  //           background-color: $vxe-table-row-hover-checked-background-color;
+  //           background-color: $vxe-table-row-hover-checkbox-checked-background-color;
  //         }
  //       }
  //       &.row--current {
@@ -578,7 +578,7 @@
  &.border--inner,
  &.border--none {
    .vxe-table--header-wrapper {
-      background-color: $vxe-table-background-color;
+      background-color: $vxe-table-body-background-color;
    }
    .vxe-table--fixed-left-wrapper {
      border-right: 0;
@@ -747,13 +747,13 @@
    left: 0;
    width: 200px;
    &.scrolling--middle {
-      box-shadow: 4px 3px 4px 0px rgba(0, 0, 0, 0.12);
+      box-shadow: $vxe-table-fixed-left-scrolling-box-shadow;
    }
  }
  .vxe-table--fixed-right-wrapper {
    right: 0;
    &.scrolling--middle {
-      box-shadow: -4px 3px 4px 0px rgba(0, 0, 0, 0.12);
+      box-shadow: $vxe-table-fixed-right-scrolling-box-shadow;
    }
  }
  .vxe-table--header-wrapper,
@@ -827,9 +827,6 @@
        background-image: none;
      }
    }
-    // .vxe-tree--btn-wrapper {
-    //   background-color: $vxe-table-background-color;
-    // }
  }
  .vxe-tree--line-wrapper {
    position: relative;
--- a/styles/toolbar.scss
+++ b/styles/toolbar.scss
@@ -61,6 +61,7 @@
    & > .vxe-button {
      display: flex;
      align-items: center;
+      justify-content: center;
    }
  }
  .vxe-tools--wrapper,
--- a/styles/variable.scss
+++ b/styles/variable.scss
@@ -33,15 +33,16 @@ $vxe-table-popup-border-color: #DADCE0;

 /*table*/
 $vxe-table-font-color: $vxe-font-color;
+$vxe-table-header-font-color: $vxe-font-color;
+$vxe-table-footer-font-color: $vxe-font-color;
 $vxe-table-border-radius: $vxe-border-radius;
 $vxe-table-border-width: 1px;
 $vxe-table-border-color: #e8eaec;
 $vxe-table-resizable-line-color: #D9DDDF;
 $vxe-table-resizable-drag-line-color: $vxe-primary-color;
-$vxe-table-background-color: #ffffff;
 $vxe-table-header-background-color: #f8f8f9;
-$vxe-table-body-background-color: $vxe-table-background-color;
-$vxe-table-footer-background-color: $vxe-table-background-color;
+$vxe-table-body-background-color: #ffffff;
+$vxe-table-footer-background-color: #ffffff;
 $vxe-table-tree-node-line-color:#909399;
 $vxe-table-tree-node-line-style: dotted;
 $vxe-table-header-font-weight: 700;
@@ -54,10 +55,10 @@ $vxe-table-row-line-height: 24px;
 $vxe-table-row-hover-background-color: #f5f7fa;
 $vxe-table-row-striped-background-color: #fafafa;
 $vxe-table-row-hover-striped-background-color: #f5f7fa;
-$vxe-table-row-radio-background-color: #fff3e0;
-$vxe-table-row-hover-radio-background-color: #ffebbc;
-$vxe-table-row-checked-background-color: #fff3e0;
-$vxe-table-row-hover-checked-background-color: #ffebbc;
+$vxe-table-row-radio-checked-background-color: #fff3e0;
+$vxe-table-row-hover-radio-checked-background-color: #ffebbc;
+$vxe-table-row-checkbox-checked-background-color: #fff3e0;
+$vxe-table-row-hover-checkbox-checked-background-color: #ffebbc;
 $vxe-table-row-current-background-color: #e6f7ff;
 $vxe-table-row-hover-current-background-color: #d7effb;

@@ -92,6 +93,9 @@ $vxe-table-checkbox-range-border-width: 1px;
 $vxe-table-checkbox-range-border-color: #006af1;
 $vxe-table-checkbox-range-background-color: rgba(50,128,252,0.2);

+$vxe-table-fixed-left-scrolling-box-shadow: 4px 3px 4px 0px rgba(0, 0, 0, 0.12);
+$vxe-table-fixed-right-scrolling-box-shadow: -4px 3px 4px 0px rgba(0, 0, 0, 0.12);
+
 /*filter*/
 $vxe-table-filter-panel-background-color: #fff;

@@ -129,6 +133,7 @@ $vxe-tooltip-validate-error-background-color: #f56c6c;

 /*pager*/
 $vxe-pager-background-color: #fff;
+$vxe-pager-perfect-background-color: #fff;
 $vxe-pager-perfect-button-background-color: #f4f4f5;

 /*modal*/
@@ -160,10 +165,12 @@ $vxe-radio-border-width: $vxe-checkbox-border-width;
 $vxe-radio-icon-background-color: #fff;
 $vxe-radio-checked-icon-background-color: #fff;
 $vxe-radio-indeterminate-icon-background-color: #fff;
+$vxe-radio-button-default-background-color: #fff;

 /*button*/
 $vxe-button-max-width: 500px;
 $vxe-button-default-background-color: #fff;
+$vxe-button-dropdown-panel-background-color: #fff;
 $vxe-button-height-default: 34px;
 $vxe-button-height-medium: 32px;
 $vxe-button-height-small: 30px;
@@ -175,7 +182,6 @@ $vxe-input-panel-background-color: $vxe-input-background-color;
 $vxe-input-date-festival-color: #999999;
 $vxe-input-date-festival-important-color: $vxe-primary-color;
 $vxe-input-date-notice-background-color: #FF0000;
-$vxe-input-date-header-background-color: #f8f8f9;
 $vxe-input-date-picker-hover-background-color: #f2f6fc;
 $vxe-input-date-picker-selected-color: #fff;
 $vxe-input-date-time-confirm-button-color: #fff;
@@ -231,6 +237,9 @@ $vxe-optgroup-title-color:#909399;
 /*switch*/
 $vxe-switch-font-color: #fff;
 $vxe-switch-icon-background-color: #fff;
+$vxe-switch-open-background-color: $vxe-primary-color;
+$vxe-switch-close-background-color: rgba(0,0,0,0.35);
+$vxe-switch-disabled-background-color: rgba(0,0,0,0.15);

 /*pulldown*/
 $vxe-pulldown-panel-background-color: #fff;