mirror of
https://github.com/iczer/vue-antd-admin
synced 2025-04-06 04:00:06 +08:00
feat: add slots support for StandardTable.vue; 🌟
This commit is contained in:
parent
d279d2f976
commit
de9af0c238
@ -20,11 +20,15 @@
|
|||||||
:dataSource="dataSource"
|
:dataSource="dataSource"
|
||||||
:rowKey="rowKey"
|
:rowKey="rowKey"
|
||||||
:pagination="pagination"
|
:pagination="pagination"
|
||||||
|
@change="onChange"
|
||||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: updateSelect}"
|
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: updateSelect}"
|
||||||
>
|
>
|
||||||
<template slot-scope="text, record, index" :slot="slot" v-for="slot in scopedSlots">
|
<template slot-scope="text, record, index" :slot="slot" v-for="slot in scopedSlots">
|
||||||
<slot :name="slot" v-bind="{text, record, index}"></slot>
|
<slot :name="slot" v-bind="{text, record, index}"></slot>
|
||||||
</template>
|
</template>
|
||||||
|
<template :slot="slot" v-for="slot in slots">
|
||||||
|
<slot :name="slot"></slot>
|
||||||
|
</template>
|
||||||
</a-table>
|
</a-table>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -36,13 +40,14 @@ export default {
|
|||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
needTotalList: [],
|
needTotalList: [],
|
||||||
scopedSlots: []
|
scopedSlots: [],
|
||||||
|
slots: []
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
updateSelect (selectedRowKeys, selectedRows) {
|
updateSelect (selectedRowKeys, selectedRows) {
|
||||||
this.$emit('update:selectedRows', selectedRows)
|
this.$emit('update:selectedRows', selectedRows)
|
||||||
this.$emit('change', selectedRowKeys, selectedRows)
|
this.$emit('selectedRowChange', selectedRowKeys, selectedRows)
|
||||||
},
|
},
|
||||||
initTotalList (columns) {
|
initTotalList (columns) {
|
||||||
const totalList = []
|
const totalList = []
|
||||||
@ -54,16 +59,30 @@ export default {
|
|||||||
return totalList
|
return totalList
|
||||||
},
|
},
|
||||||
getScopedSlots(columns) {
|
getScopedSlots(columns) {
|
||||||
return columns.filter(item => item.scopedSlots && item.scopedSlots.customRender)
|
let scopedSlots = columns.filter(item => item.scopedSlots).map(item => item.scopedSlots)
|
||||||
.map(item => item.scopedSlots.customRender)
|
scopedSlots = scopedSlots.flatMap(item => {
|
||||||
|
return Object.keys(item).map(key => item[key])
|
||||||
|
})
|
||||||
|
return scopedSlots
|
||||||
|
},
|
||||||
|
getSlots(columns) {
|
||||||
|
let slots = columns.filter(item => item.slots).map(item => item.slots)
|
||||||
|
slots = slots.flatMap(item => {
|
||||||
|
return Object.keys(item).map(key => item[key])
|
||||||
|
})
|
||||||
|
return slots
|
||||||
},
|
},
|
||||||
onClear() {
|
onClear() {
|
||||||
this.updateSelect([], [])
|
this.updateSelect([], [])
|
||||||
this.$emit('clear')
|
this.$emit('clear')
|
||||||
|
},
|
||||||
|
onChange(pagination, filters, sorter, {currentDataSource}) {
|
||||||
|
this.$emit('change', pagination, filters, sorter, {currentDataSource})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
created () {
|
created () {
|
||||||
this.scopedSlots = this.getScopedSlots(this.columns)
|
this.scopedSlots = this.getScopedSlots(this.columns)
|
||||||
|
this.slots = this.getSlots(this.columns)
|
||||||
this.needTotalList = this.initTotalList(this.columns)
|
this.needTotalList = this.initTotalList(this.columns)
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
|
@ -12,7 +12,7 @@ export default {
|
|||||||
computed: {
|
computed: {
|
||||||
...mapState('setting', ['multiPage']),
|
...mapState('setting', ['multiPage']),
|
||||||
minHeight() {
|
minHeight() {
|
||||||
return this.multiPage ? this.layoutMinHeight : this.layoutMinHeight
|
return this.multiPage ? this.layoutMinHeight - 32 : this.layoutMinHeight
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -13,7 +13,7 @@ export default {
|
|||||||
...mapState('setting', ['multiPage']),
|
...mapState('setting', ['multiPage']),
|
||||||
minHeight() {
|
minHeight() {
|
||||||
let layoutMinHeight = this.layoutMinHeight || window.innerHeight
|
let layoutMinHeight = this.layoutMinHeight || window.innerHeight
|
||||||
return this.multiPage ? layoutMinHeight: layoutMinHeight
|
return this.multiPage ? layoutMinHeight - 32 : layoutMinHeight
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -12,7 +12,7 @@ export default {
|
|||||||
computed: {
|
computed: {
|
||||||
...mapState('setting', ['multiPage']),
|
...mapState('setting', ['multiPage']),
|
||||||
minHeight() {
|
minHeight() {
|
||||||
return this.multiPage ? this.layoutMinHeight : this.layoutMinHeight
|
return this.multiPage ? this.layoutMinHeight - 24 : this.layoutMinHeight
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user