diff --git a/src/components/Table/AutoDataTable/components/ColumnSettingPopover.vue b/src/components/Table/AutoDataTable/components/ColumnSettingPopover.vue index 29ced96de..57cfc6f7c 100644 --- a/src/components/Table/AutoDataTable/components/ColumnSettingPopover.vue +++ b/src/components/Table/AutoDataTable/components/ColumnSettingPopover.vue @@ -10,10 +10,15 @@ @cancel="restoreDefault()" @confirm="handleColumnConfirm()" > - + + + 全选 + + [] }, + defaultColumns: { + type: Array, + default: () => [] + }, url: { type: String, default: '' @@ -62,16 +71,34 @@ export default { }, data() { return { + checkAll: false, showColumnSettingPopover: false, - iCurrentColumns: '' + iCurrentColumns: '', + isIndeterminate: false + } + }, + watch: { + currentColumns: { + handler(val) { + this.iCurrentColumns = val + } } }, mounted() { this.$eventBus.$on('showColumnSettingPopover', ({ url }) => { if (url === this.url) { + this.checkAll = false this.showColumnSettingPopover = true this.iCurrentColumns = this.currentColumns } + + if (this.iCurrentColumns.length === this.totalColumnsList.length) { + this.checkAll = true + this.isIndeterminate = false + } else { + this.checkAll = false + this.isIndeterminate = true + } }) }, methods: { @@ -82,6 +109,22 @@ export default { restoreDefault() { this.showColumnSettingPopover = false this.$emit('columnsUpdate', { columns: null, url: this.url }) + }, + handleCheckAllChange(value) { + if (value) { + this.iCurrentColumns = this.totalColumnsList.reduce((prev, item) => { + return [...prev, (item.prop)] + }, []) + this.isIndeterminate = false + } else { + this.iCurrentColumns = this.defaultColumns + this.isIndeterminate = true + } + }, + handleCheckedChange(value) { + const checkedCount = value.length + this.checkAll = checkedCount === this.totalColumnsList.length + this.isIndeterminate = checkedCount > 0 && checkedCount < this.totalColumnsList.length } } } diff --git a/src/components/Table/AutoDataTable/index.vue b/src/components/Table/AutoDataTable/index.vue index e551a081a..212784827 100644 --- a/src/components/Table/AutoDataTable/index.vue +++ b/src/components/Table/AutoDataTable/index.vue @@ -13,6 +13,7 @@ :current-columns="popoverColumns.currentCols" :min-columns="popoverColumns.minCols" :total-columns-list="popoverColumns.totalColumnsList" + :default-columns="popoverColumns.defaultCols" :url="config.url" @columnsUpdate="handlePopoverColumnsChange" /> @@ -58,7 +59,8 @@ export default { popoverColumns: { totalColumnsList: [], minCols: [], - currentCols: [] + currentCols: [], + defaultCols: [] } } }, @@ -426,6 +428,8 @@ export default { }) this.popoverColumns.currentCols = this.cleanedColumnsShow.show this.popoverColumns.minCols = this.cleanedColumnsShow.min + this.popoverColumns.defaultCols = this.cleanedColumnsShow.default + this.$log.debug('Popover cols: ', this.popoverColumns) }, handlePopoverColumnsChange({ columns, url }) { @@ -434,6 +438,7 @@ export default { columns = this.cleanedColumnsShow.default } this.popoverColumns.currentCols = columns + const _tableConfig = localStorage.getItem('tableConfig') ? JSON.parse(localStorage.getItem('tableConfig')) : {}