From bed780cb78ba7ae3b7b5844d6f88b3e8a13e550e Mon Sep 17 00:00:00 2001
From: iczer <1126263215@qq.com>
Date: Thu, 22 Sep 2022 11:45:59 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20the=20check=20problem=20of=20standard=20?=
=?UTF-8?q?table=20with=20pagination;=20:bug:=20=E4=BF=AE=E5=A4=8D?=
=?UTF-8?q?=EF=BC=9A=E6=A0=87=E5=87=86=E8=A1=A8=E6=A0=BC=E5=88=86=E9=A1=B5?=
=?UTF-8?q?=E5=8B=BE=E9=80=89=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/components/table/StandardTable.vue | 68 +++++++++++++++++++++-----
1 file changed, 57 insertions(+), 11 deletions(-)
diff --git a/src/components/table/StandardTable.vue b/src/components/table/StandardTable.vue
index 44c4574..bb64533 100644
--- a/src/components/table/StandardTable.vue
+++ b/src/components/table/StandardTable.vue
@@ -23,7 +23,7 @@
:expandedRowKeys="expandedRowKeys"
:expandedRowRender="expandedRowRender"
@change="onChange"
- :rowSelection="selectedRows ? {selectedRowKeys: selectedRowKeys, onChange: updateSelect} : undefined"
+ :rowSelection="selectedRows ? {selectedRowKeys, onSelect, onSelectAll} : undefined"
>
<template slot-scope="text, record, index" :slot="slot" v-for="slot in Object.keys($scopedSlots).filter(key => key !== 'expandedRowRender') ">
<slot :name="slot" v-bind="{text, record, index}"></slot>
@@ -64,22 +64,70 @@ export default {
}
},
methods: {
- updateSelect (selectedRowKeys, selectedRows) {
- this.$emit('update:selectedRows', selectedRows)
- this.$emit('selectedRowChange', selectedRowKeys, selectedRows)
+ equals(record1, record2) {
+ if (record1 === record2) {
+ return true
+ }
+ const {rowKey} = this
+ if (rowKey && typeof rowKey === 'string') {
+ return record1[rowKey] === record2[rowKey]
+ } else if (rowKey && typeof rowKey === 'function') {
+ return rowKey(record1) === rowKey(record2)
+ }
+ return false
+ },
+ contains(arr, item) {
+ if (!arr || arr.length === 0) {
+ return false
+ }
+ const {equals} = this
+ for (let i = 0; i < arr.length; i++) {
+ if (equals(arr[i], item)) {
+ return true
+ }
+ }
+ return false
+ },
+ onSelectAll(selected, rows) {
+ const {getKey, contains} = this
+ const unselected = this.dataSource.filter(item => !contains(rows, item, this.rowKey))
+ const _selectedRows = this.selectedRows.filter(item => !contains(unselected, item, this.rowKey))
+ const set = {}
+ _selectedRows.forEach(item => set[getKey(item)] = item)
+ rows.forEach(item => set[getKey(item)] = item)
+ const _rows = Object.values(set)
+ this.$emit('update:selectedRows', _rows)
+ this.$emit('selectedRowChange', _rows.map(item => getKey(item)), _rows)
+ },
+ getKey(record) {
+ const {rowKey} = this
+ if (!rowKey || !record) {
+ return undefined
+ }
+ if (typeof rowKey === 'string') {
+ return record[rowKey]
+ } else {
+ return rowKey(record)
+ }
+ },
+ onSelect(record, selected) {
+ const {equals, selectedRows, getKey} = this
+ const _selectedRows = selected ? [...selectedRows, record] : selectedRows.filter(row => !equals(row, record))
+ this.$emit('update:selectedRows', _selectedRows)
+ this.$emit('selectedRowChange', _selectedRows.map(item => getKey(item)), _selectedRows)
},
initTotalList (columns) {
- const totalList = columns.filter(item => item.needTotal)
+ return columns.filter(item => item.needTotal)
.map(item => {
return {
...item,
total: 0
}
})
- return totalList
},
onClear() {
- this.updateSelect([], [])
+ this.$emit('update:selectedRows', [])
+ this.$emit('selectedRowChange', [], [])
this.$emit('clear')
},
onChange(pagination, filters, sorter, {currentDataSource}) {
@@ -110,10 +158,8 @@ export default {
},
computed: {
selectedRowKeys() {
- return this.selectedRows.map(record => {
- return (typeof this.rowKey === 'function') ? this.rowKey(record) : record[this.rowKey]
- })
- }
+ return this.selectedRows.map(record => this.getKey(record))
+ },
}
}
</script>