n20-common-lib 2.4.15 → 2.4.17

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "n20-common-lib",
-  "version": "2.4.15",
+  "version": "2.4.17",
   "private": false,
   "main": "src/index.js",
   "scripts": {

package/src/components/TablePro/index.js

@@ -26,7 +26,7 @@ vxeTable.formats.mixin({
   formatRate({ cellValue }) {
     return numerify(cellValue, '0.000000', Math.floor)
   },
-  // 四舍五入金额，每隔3位逗号分隔，默认2位数
+  // 格式化时间，默认 yyyy-MM-dd HH:mm:ss
   formatDatetime({ cellValue }) {
     return dayjs(cellValue).format('YYYY-MM-DD HH:mm:ss')
   }

package/src/components/TablePro/index.vue

@@ -3,8 +3,8 @@
     <vxe-table
       ref="vxeTable"
       :key="colsKey"
-      row-key
       :align="'center'"
+      :header-align="'center'"
       :data="data"
       :height="height"
       :class="{ 'cell-default-set--': cellDefault }"
@@ -26,7 +26,6 @@
       @sort-change="(val) => customSortMethod(val)"
       @filter-change="filterChange"
       @checkbox-change="handleSelectionChange"
-      @checkbox-all="handleSelectionChange"
     >
       <template v-for="(item, i) in columns">
         <slot v-if="item.slotName" :name="item.slotName" :column="item"></slot>
@@ -40,20 +39,20 @@
           width="50"
           fixed="left"
         >
-          <!-- <template #header="{ $table, checked, indeterminate }">
-            <span class="custom-checkbox" @click.stop="toggleAll($table)">
-              <el-checkbox v-if="indeterminate" :key="key" :indeterminate="indeterminate" />
-              <el-checkbox v-else-if="checked" :key="key" :value="checked" />
-              <el-checkbox v-else :key="key" :value="checked" />
+          <template #header="{ $table, checked, indeterminate, disabled }">
+            <span class="custom-checkbox" @click.stop="toggleAll($table, disabled)">
+              <el-checkbox v-if="indeterminate" :key="key" :indeterminate="indeterminate" :disabled="disabled" />
+              <el-checkbox v-else-if="checked" :key="key" :value="checked" :disabled="disabled" />
+              <el-checkbox v-else :key="key" :value="checked" :disabled="disabled" />
             </span>
           </template>
-          <template #checkbox="{ $table, row, checked, indeterminate }">
-            <span class="custom-checkbox" @click.stop="toggleChecked($table, row)">
-              <el-checkbox v-if="indeterminate" :key="key" :indeterminate="indeterminate" />
-              <el-checkbox v-else-if="checked" :key="key" :value="checked" />
-              <el-checkbox v-else :key="key" :value="checked" />
+          <template #checkbox="{ $table, row, checked, indeterminate, disabled }">
+            <span class="custom-checkbox" @click.stop="toggleChecked($table, row, disabled)">
+              <el-checkbox v-if="indeterminate" :key="key" :indeterminate="indeterminate" :disabled="disabled" />
+              <el-checkbox v-else-if="checked" :key="key" :value="checked" :disabled="disabled" />
+              <el-checkbox v-else :key="key" :value="checked" :disabled="disabled" />
             </span>
-          </template> -->
+          </template>
         </vxe-column>
         <vxe-column
           v-else
@@ -130,16 +129,49 @@ export default {
     },
     size(val) {
       this.sizeC = val
+    },
+    data() {
+      // 翻页清除选中
+      this.$refs.vxeTable.clearCheckboxRow()
+      this.$emit('selection-change-method', [])
     }
   },
   mounted() {},
   methods: {
-    toggleAll($table) {
+    // 全选
+    toggleAllSelection() {
+      if (this.$refs.vxeTable) {
+        this.$refs.vxeTable.setAllCheckboxRow(true)
+        // 得手动触发
+        this.handleSelectionChange()
+      }
+    },
+    // 清空选择
+    clearSelection() {
+      if (this.$refs.vxeTable) {
+        this.$refs.vxeTable.setAllCheckboxRow(false)
+        // 得手动触发
+        this.handleSelectionChange()
+      }
+    },
+    // 选中某些行
+    toggleRowSelection(row, state = true) {
+      this.$refs.vxeTable.setCheckboxRow(row, state)
+      // 得手动触发
+      this.handleSelectionChange()
+    },
+    toggleAll($table, disabled) {
+      if (disabled) {
+        return false
+      }
       $table.toggleAllCheckboxRow()
       this.key++
       this.handleSelectionChange()
     },
-    toggleChecked($table, row) {
+    toggleChecked($table, row, disabled) {
+      if (disabled) {
+        return false
+      }
       $table.toggleCheckboxRow(row)
       this.key++
       this.handleSelectionChange()
@@ -155,8 +187,18 @@ export default {
     },
     filterChange({ filterList }) {
       const obj = {}
+      // 复制默认筛选条件为空
+      this.columns.forEach((item) => {
+        if (item.filters) {
+          this.$set(obj, item.prop, undefined)
+        }
+      })
       filterList.forEach((item) => {
-        this.$set(obj, item.field, item.values)
+        if (item.column.filterMultiple) {
+          this.$set(obj, item.field, item.values)
+        } else {
+          this.$set(obj, item.field, item.values && item.values[0])
+        }
       })
       this.$emit('filter-change-method', obj)
     },