diff --git a/src/components/table/advance/ActionColumns.vue b/src/components/table/advance/ActionColumns.vue index 2dc9d06..3a97ec9 100644 --- a/src/components/table/advance/ActionColumns.vue +++ b/src/components/table/advance/ActionColumns.vue @@ -49,18 +49,16 @@ checkedCounts(val) { this.checkAll = val === this.columns.length this.indeterminate = val > 0 && val < this.columns.length + }, + columns(newVal, oldVal) { + if (newVal != oldVal) { + this.checkedCounts = newVal.length + this.formatColumns(newVal) + } } }, created() { - this.$emit('update:visibleColumns', [...this.columns]) - for (let col of this.columns) { - if (col.visible === undefined) { - this.$set(col, 'visible', true) - } - if (!col.visible) { - this.checkedCounts -= 1 - } - } + this.formatColumns(this.columns) }, methods: { onCheckChange(e, col) { @@ -126,6 +124,16 @@ conditions[col.dataIndex] = col.search.value }) return conditions + }, + formatColumns(columns) { + for (let col of columns) { + if (col.visible === undefined) { + this.$set(col, 'visible', true) + } + if (!col.visible) { + this.checkedCounts -= 1 + } + } } } } diff --git a/src/components/table/advance/AdvanceTable.vue b/src/components/table/advance/AdvanceTable.vue index fa8d05b..c64da1b 100644 --- a/src/components/table/advance/AdvanceTable.vue +++ b/src/components/table/advance/AdvanceTable.vue @@ -32,7 +32,7 @@ - +
@@ -70,12 +73,14 @@ props: ['columns', 'formatConditions'], inject: ['table'], created() { - this.columns.forEach(item => { - this.$set(item, 'search', {...item.search, visible: false, value: undefined, format: this.getFormat(item)}) - }) - console.log(this.columns) + this.formatColumns(this.columns) }, watch: { + columns(newVal, oldVal) { + if (newVal != oldVal) { + this.formatColumns(newVal) + } + }, searchCols(newVal, oldVal) { if (newVal.length != oldVal.length) { const newConditions = this.getConditions(newVal) @@ -218,6 +223,11 @@ return true } return false + }, + formatColumns(columns) { + columns.forEach(item => { + this.$set(item, 'search', {...item.search, visible: false, value: undefined, format: this.getFormat(item)}) + }) } } } diff --git a/src/mock/goods/index.js b/src/mock/goods/index.js index 4bdfa17..9af9e53 100644 --- a/src/mock/goods/index.js +++ b/src/mock/goods/index.js @@ -48,4 +48,59 @@ Mock.mock(RegExp(`${process.env.VUE_APP_API_BASE_URL}/goods` + '.*'),'get', ({ur list: result } } +}) + +const columnsConfig = [ + { + title: '商品名称', + dataIndex: 'name', + searchAble: true + }, + { + title: '订单号', + dataIndex: 'orderId' + }, + { + searchAble: true, + dataIndex: 'status', + dataType: 'select', + slots: {title: 'statusTitle'}, + scopedSlots: {customRender: 'status'}, + search: { + selectOptions: [ + {title: '已下单', value: 1}, + {title: '已付款', value: 2}, + {title: '已审核', value: 3}, + // {title: '已发货', value: 4} + ] + } + }, + { + title: '发货', + searchAble: true, + dataIndex: 'send', + dataType: 'boolean', + scopedSlots: {customRender: 'send'} + }, + { + title: '发货时间', + dataIndex: 'sendTime', + dataType: 'datetime' + }, + { + title: '下单日期', + searchAble: true, + dataIndex: 'orderDate', + dataType: 'date', + visible: false + }, + { + title: '审核时间', + dataIndex: 'auditTime', + dataType: 'time', + }, +] + +Mock.mock(`${process.env.VUE_APP_API_BASE_URL}/columns`, 'get', () => { + return columnsConfig }) \ No newline at end of file diff --git a/src/pages/components/table/Table.vue b/src/pages/components/table/Table.vue index 7625a10..be829c4 100644 --- a/src/pages/components/table/Table.vue +++ b/src/pages/components/table/Table.vue @@ -90,24 +90,19 @@ searchAble: true, dataIndex: 'send', dataType: 'boolean', - scopedSlots: {customRender: 'send'} - }, - { - title: '发货时间', - dataIndex: 'sendTime', - dataType: 'datetime' - }, - { - title: '下单日期', - searchAble: true, - dataIndex: 'orderDate', - dataType: 'date' + scopedSlots: {customRender: 'send'}, + search: { + switchOptions: { + checkedText: '开', + uncheckedText: '关' + } + } }, { title: '审核时间', dataIndex: 'auditTime', dataType: 'time', - }, + } ], dataSource: [], conditions: {} @@ -115,6 +110,7 @@ }, created() { this.getGoodList() + this.getColumns() }, methods: { getGoodList() { @@ -129,8 +125,12 @@ this.loading = false }) }, + getColumns() { + ds.goodsColumns().then(res => { + this.columns = res.data + }) + }, onSearch(conditions, searchOptions) { - console.log(conditions) console.log(searchOptions) this.page = 1 this.conditions = conditions diff --git a/src/services/api.js b/src/services/api.js index 26eee91..f74208a 100644 --- a/src/services/api.js +++ b/src/services/api.js @@ -6,4 +6,5 @@ module.exports = { LOGIN: `${BASE_URL}/login`, ROUTES: `${BASE_URL}/routes`, GOODS: `${BASE_URL}/goods`, + GOODS_COLUMNS: `${BASE_URL}/columns`, } diff --git a/src/services/dataSource.js b/src/services/dataSource.js index 1846189..22bb960 100644 --- a/src/services/dataSource.js +++ b/src/services/dataSource.js @@ -1,8 +1,12 @@ -import {GOODS} from './api' +import {GOODS, GOODS_COLUMNS} from './api' import {METHOD, request} from '@/utils/request' export async function goodsList(params) { return request(GOODS, METHOD.GET, params) } -export default {goodsList} \ No newline at end of file +export async function goodsColumns() { + return request(GOODS_COLUMNS, METHOD.GET) +} + +export default {goodsList, goodsColumns} \ No newline at end of file