支持字符串类型的数值排序

2026-01-21 05:27:57 +08:00 · 2021-01-27 18:32:44 +08:00
parent 84657b46d5
commit 52c8bf672b
17 changed files with 133 additions and 87 deletions
--- a/examples/api/checkbox-group.js
+++ b/examples/api/checkbox-group.js
@@ -8,14 +8,23 @@ const apis = [
    defVal: '',
    list: [
      {
-        name: 'label',
-        desc: '绑定值',
+        name: 'v-model / value',
+        descKey: 'app.api.checkbox.desc.value',
        version: '',
        type: 'any[]',
        enum: '',
        defVal: '',
        list: []
      },
+      {
+        name: 'size',
+        descKey: 'app.api.checkbox.desc.size',
+        version: '',
+        type: 'string',
+        enum: 'medium, small, mini',
+        defVal: '继承上下文',
+        list: []
+      },
      {
        name: 'disabled',
        desc: '是否禁用',
--- a/examples/api/checkbox.js
+++ b/examples/api/checkbox.js
@@ -8,7 +8,7 @@ const apis = [
    defVal: '',
    list: [
      {
-        name: 'v-model',
+        name: 'v-model / value',
        descKey: 'app.api.checkbox.desc.value',
        version: '',
        type: 'any',
--- a/examples/api/column.js
+++ b/examples/api/column.js
@@ -248,7 +248,7 @@ const apis = [
        version: '3.1.1',
        type: 'string',
        enum: 'auto, number, string',
-        defVal: '',
+        defVal: 'auto',
        list: []
      },
      {
--- a/examples/api/input.js
+++ b/examples/api/input.js
@@ -8,7 +8,7 @@ const apis = [
    defVal: '',
    list: [
      {
-        name: 'v-model',
+        name: 'v-model / value',
        descKey: 'app.api.input.desc.value',
        version: '',
        type: 'any',
@@ -304,7 +304,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -313,7 +313,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -322,7 +322,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -331,7 +331,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -340,7 +340,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -349,7 +349,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -358,7 +358,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -367,7 +367,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -376,7 +376,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -385,7 +385,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -394,7 +394,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -403,7 +403,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ visible, $event }',
+        defVal: '{ value, visible, $event }',
        list: []
      },
      {
@@ -412,7 +412,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -421,7 +421,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -430,7 +430,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -439,7 +439,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -448,7 +448,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -457,7 +457,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -466,7 +466,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      }
    ]
--- a/examples/api/modal.js
+++ b/examples/api/modal.js
@@ -8,7 +8,7 @@ const apis = [
    defVal: '',
    list: [
      {
-        name: 'v-model',
+        name: 'v-model / value',
        descKey: 'app.api.modal.desc.value',
        version: '',
        type: 'any',
--- a/examples/api/radio-button.js
+++ b/examples/api/radio-button.js
@@ -7,6 +7,15 @@ const apis = [
    enum: '',
    defVal: '',
    list: [
+      {
+        name: 'v-model / value',
+        descKey: 'app.api.radio.desc.value',
+        version: '',
+        type: 'any',
+        enum: '',
+        defVal: '',
+        list: []
+      },
      {
        name: 'label',
        desc: '绑定值',
--- a/examples/api/radio-group.js
+++ b/examples/api/radio-group.js
@@ -8,14 +8,23 @@ const apis = [
    defVal: '',
    list: [
      {
-        name: 'label',
-        desc: '绑定值',
+        name: 'v-model / value',
+        descKey: 'app.api.radio.desc.value',
        version: '',
-        type: 'string | number',
+        type: 'any[]',
        enum: '',
        defVal: '',
        list: []
      },
+      {
+        name: 'size',
+        descKey: 'app.api.radio.desc.size',
+        version: '',
+        type: 'string',
+        enum: 'medium, small, mini',
+        defVal: '继承上下文',
+        list: []
+      },
      {
        name: 'disabled',
        desc: '是否禁用',
--- a/examples/api/radio.js
+++ b/examples/api/radio.js
@@ -8,7 +8,7 @@ const apis = [
    defVal: '',
    list: [
      {
-        name: 'v-model',
+        name: 'v-model / value',
        descKey: 'app.api.radio.desc.value',
        version: '',
        type: 'any',
--- a/examples/api/select.js
+++ b/examples/api/select.js
@@ -8,7 +8,7 @@ const apis = [
    defVal: '',
    list: [
      {
-        name: 'v-model',
+        name: 'v-model / value',
        descKey: 'app.api.select.desc.value',
        version: '',
        type: 'any',
--- a/examples/api/switch.js
+++ b/examples/api/switch.js
@@ -8,7 +8,7 @@ const apis = [
    defVal: '',
    list: [
      {
-        name: 'v-model',
+        name: 'v-model / value',
        descKey: 'app.api.switch.desc.value',
        version: '',
        type: 'string | number | boolean',
--- a/examples/api/textarea.js
+++ b/examples/api/textarea.js
@@ -8,7 +8,7 @@ const apis = [
    defVal: '',
    list: [
      {
-        name: 'v-model',
+        name: 'v-model / value',
        descKey: 'app.api.input.desc.value',
        version: '',
        type: 'any',
@@ -168,7 +168,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -177,7 +177,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -186,7 +186,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -195,7 +195,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -204,7 +204,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -213,7 +213,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -222,7 +222,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -231,7 +231,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      },
      {
@@ -240,7 +240,7 @@ const apis = [
        version: '',
        type: '',
        enum: '',
-        defVal: '{ $event }',
+        defVal: '{ value, $event }',
        list: []
      }
    ]
--- a/examples/views/table/base/Sort.vue
+++ b/examples/views/table/base/Sort.vue
@@ -2,7 +2,7 @@
  <div>
    <p class="tip">
      通过给需要排序功能的列加上 <table-api-link prop="sortable"/> 属性可以支持排序，还可以通过设置 <table-column-api-link prop="sort-by"/> 多字段进行排序<br>
-      如果该列的值为字符串类型，但实际是数值，可以设置 <table-column-api-link prop="sort-type"/>='number' 按数值类型进行排序<br>
+      如果该列的值为字符串类型，但实际是数值，可以设置 <table-column-api-link prop="sort-type"/>=number|string 按指定类型进行排序，默认 auto 自动转换数值<br>
      如果是服务端排序，只需加上 <table-api-link prop="sort-config"/>.<table-api-link prop="remote"/> 和 <table-api-link prop="sort-change"/> 事件就可以实现<br>
      还可以通过调用 <table-api-link prop="sort"/> 方法实现手动排序
    </p>
@@ -25,7 +25,7 @@
      <vxe-table-column field="name" title="Name" sortable></vxe-table-column>
      <vxe-table-column field="role" title="Role" sortable></vxe-table-column>
      <vxe-table-column field="age" title="Age" sortable></vxe-table-column>
-      <vxe-table-column field="num" title="字符串" sortable></vxe-table-column>
+      <vxe-table-column field="num" title="字符串" sort-type="string" sortable></vxe-table-column>
      <vxe-table-column field="num2" title="数值" sort-type="number" sortable></vxe-table-column>
      <vxe-table-column field="address" title="Address" sortable></vxe-table-column>
    </vxe-table>
@@ -188,7 +188,7 @@ export default {
          <vxe-table-column field="name" title="Name" sortable></vxe-table-column>
          <vxe-table-column field="role" title="Role" sortable></vxe-table-column>
          <vxe-table-column field="age" title="Age" sortable></vxe-table-column>
-          <vxe-table-column field="num" title="字符串" sortable></vxe-table-column>
+          <vxe-table-column field="num" title="字符串" sort-type="string" sortable></vxe-table-column>
          <vxe-table-column field="num2" title="数值" sort-type="number" sortable></vxe-table-column>
          <vxe-table-column field="address" title="Address" sortable></vxe-table-column>
        </vxe-table>
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "vxe-table",
-  "version": "3.1.0",
+  "version": "3.1.1",
  "description": "一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟滚动、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、虚拟列表、模态窗口、自定义模板、渲染器、贼灵活的配置项、扩展接口等...",
  "scripts": {
    "serve": "vue-cli-service serve",
--- a/packages/grid/src/grid.js
+++ b/packages/grid/src/grid.js
@@ -52,53 +52,68 @@ function renderDefaultForm (h, _vm) {
  return []
 }

+function getFuncSlot (_vm, optSlots, slotKey) {
+  const { $scopedSlots } = _vm
+  const funcSlot = optSlots[slotKey]
+  if (funcSlot) {
+    if (XEUtils.isString(funcSlot)) {
+      if ($scopedSlots[funcSlot]) {
+        return $scopedSlots[funcSlot]
+      } else {
+        if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') {
+          UtilTools.error('vxe.error.notSlot', [funcSlot])
+        }
+      }
+    } else {
+      return funcSlot
+    }
+  }
+  return null
+}
+
 function getToolbarSlots (_vm) {
  const { $scopedSlots, toolbarOpts } = _vm
  const toolbarOptSlots = toolbarOpts.slots
-  let $buttons
-  let $tools
+  let buttonsSlot
+  let toolsSlot
  const slots = {}
+  if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') {
+    if ($scopedSlots.buttons && (!toolbarOptSlots || toolbarOptSlots.buttons !== 'buttons')) {
+      UtilTools.warn('vxe.error.reqProp', ['toolbar-config.slots.buttons'])
+    }
+    if ($scopedSlots.tools && (!toolbarOptSlots || toolbarOptSlots.tools !== 'tools')) {
+      UtilTools.warn('vxe.error.reqProp', ['toolbar-config.slots.tools'])
+    }
+  }
  if (toolbarOptSlots) {
-    $buttons = toolbarOptSlots.buttons
-    $tools = toolbarOptSlots.tools
-    if ($buttons && $scopedSlots[$buttons]) {
-      $buttons = $scopedSlots[$buttons]
+    buttonsSlot = getFuncSlot(_vm, toolbarOptSlots, 'buttons')
+    toolsSlot = getFuncSlot(_vm, toolbarOptSlots, 'tools')
+    if (buttonsSlot) {
+      slots.buttons = buttonsSlot
    }
-    if ($tools && $scopedSlots[$tools]) {
-      $tools = $scopedSlots[$tools]
+    if (toolsSlot) {
+      slots.tools = toolsSlot
    }
  }
-  if ($buttons) {
-    slots.buttons = $buttons
-  }
-  if ($tools) {
-    slots.tools = $tools
-  }
  return slots
 }

 function getPagerSlots (_vm) {
-  const { $scopedSlots, pagerOpts } = _vm
+  const { pagerOpts } = _vm
  const pagerOptSlots = pagerOpts.slots
  const slots = {}
-  let $left
-  let $right
+  let leftSlot
+  let rightSlot
  if (pagerOptSlots) {
-    $left = pagerOptSlots.left
-    $right = pagerOptSlots.right
-    if ($left && $scopedSlots[$left]) {
-      $left = $scopedSlots[$left]
+    leftSlot = getFuncSlot(_vm, pagerOptSlots, 'left')
+    rightSlot = getFuncSlot(_vm, pagerOptSlots, 'right')
+    if (leftSlot) {
+      slots.left = leftSlot
    }
-    if ($right && $scopedSlots[$right]) {
-      $right = $scopedSlots[$right]
+    if (rightSlot) {
+      slots.right = rightSlot
    }
  }
-  if ($left) {
-    slots.left = $left
-  }
-  if ($right) {
-    slots.right = $right
-  }
  return slots
 }

--- a/packages/table/src/methods.js
+++ b/packages/table/src/methods.js
@@ -236,20 +236,21 @@ function clearAllSort (_vm) {
 }

 function getOrderField (_vm, column) {
-  const { property, sortBy, sortType, formatter } = column
+  const { sortBy, sortType } = column
  if (sortBy) {
    return XEUtils.isArray(sortBy) ? sortBy[0] : sortBy
-  } else if (sortType === 'auto') {
-    return (row) => {
-      const cellValue = _vm.getCellLabel(row, column)
-      return isNaN(cellValue) ? cellValue : XEUtils.toNumber(cellValue)
-    }
-  } else if (sortType === 'number') {
-    return (row) => XEUtils.toNumber(_vm.getCellLabel(row, column))
-  } else if (formatter) {
-    return (row) => _vm.getCellLabel(row, column)
  }
-  return property
+  return (row) => {
+    const cellValue = _vm.getCellLabel(row, column)
+    if (!sortType || sortType === 'auto') {
+      return isNaN(cellValue) ? cellValue : XEUtils.toNumber(cellValue)
+    } else if (sortType === 'number') {
+      return XEUtils.toNumber(cellValue)
+    } else if (sortType === 'string') {
+      return XEUtils.toString(cellValue)
+    }
+    return cellValue
+  }
 }

 const Methods = {
--- a/packages/table/src/table.js
+++ b/packages/table/src/table.js
@@ -126,7 +126,7 @@ export default {
    // 是否显示表尾合计
    showFooter: Boolean,
    // 表尾合计的计算方法
-    footerMethod: { type: Function, default: () => GlobalConfig.table.footerMethod },
+    footerMethod: { type: Function, default: GlobalConfig.table.footerMethod },
    // 给行附加 className
    rowClassName: [String, Function],
    // 给单元格附加 className
@@ -693,6 +693,9 @@ export default {
      if (treeConfig && treeOpts.line && (!this.rowKey || !showOverflow)) {
        UtilTools.warn('vxe.error.reqProp', ['row-key | show-overflow'])
      }
+      if (this.showFooter && !this.footerMethod) {
+        UtilTools.warn('vxe.error.reqProp', ['footer-method'])
+      }
      if (treeConfig && this.stripe) {
        UtilTools.warn('vxe.error.noTree', ['stripe'])
      }
--- a/packages/tools/src/utils.js
+++ b/packages/tools/src/utils.js
@@ -221,7 +221,7 @@ export const UtilTools = {
    if (groupConfig) {
      if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') {
        if ($xecolumn.$options._componentTag === 'vxe-table-column') {
-          UtilTools.warn('vxe.error.groupTag', [`<vxe-table-colgroup title=${$xecolumn.title} ...>`, `<vxe-table-column title=${$xecolumn.title} ...>`])
+          UtilTools.error('vxe.error.groupTag', [`<vxe-table-colgroup title=${$xecolumn.title} ...>`, `<vxe-table-column title=${$xecolumn.title} ...>`])
        }
      }
      if (!groupConfig.children) {