|
@@ -1,14 +1,16 @@
|
|
|
<template>
|
|
|
<el-table
|
|
|
+ ref="multipleTable"
|
|
|
class="expandTable"
|
|
|
:data="dataList"
|
|
|
style="width: 100%;z-index:1"
|
|
|
:row-key="getRowKeys"
|
|
|
- :expand-row-keys="expands"
|
|
|
+ :expand-row-keys="expands"
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
>
|
|
|
<el-table-column type="expand">
|
|
|
<template slot-scope="props">
|
|
|
- <el-table :data="props.row.children" style="width: 100%;">
|
|
|
+ <el-table :ref="`table${props.row.id}`" :data="props.row.children" style="width: 100%;">
|
|
|
<el-table-column type="selection" width="50" align="right"></el-table-column>
|
|
|
<el-table-column prop label align="right" width="150">
|
|
|
<template slot-scope="{row}">
|
|
@@ -49,28 +51,44 @@
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
- getRowKeys(row) {
|
|
|
- return row.id;
|
|
|
- },
|
|
|
+ selected: [],
|
|
|
+ expands: []
|
|
|
};
|
|
|
},
|
|
|
props: ["dataList"],
|
|
|
computed: {
|
|
|
- expands() {
|
|
|
- return this.dataList.map(i => {
|
|
|
- // 增加 isExpand 属性
|
|
|
- i.isExpand = i.children.some(c => c.isSatisfy == false)
|
|
|
- return i
|
|
|
- }).filter(j => j.isExpand).map(i => i.id)
|
|
|
- }
|
|
|
},
|
|
|
- methods: {
|
|
|
-
|
|
|
+ watch: {
|
|
|
+ dataList(newVal, oldVal) {
|
|
|
+ if(newVal) {
|
|
|
+ this.$nextTick(() => this.doSelect())
|
|
|
+ }
|
|
|
+ }
|
|
|
},
|
|
|
mounted() {
|
|
|
-
|
|
|
+ this.initExpand()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ initExpand() {
|
|
|
+ this.dataList.forEach(i => {
|
|
|
+ if(i.children.some(c => c.isSatisfy == false)) this.expands.push(i.id)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ doSelect() {
|
|
|
+ this.dataList.forEach(i => {
|
|
|
+ i.children.forEach(row => {
|
|
|
+ this.$refs[`table${i.id}`].toggleRowSelection(row)
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleSelectionChange(val) {
|
|
|
+ this.selected = val
|
|
|
+ },
|
|
|
+ getRowKeys(row) {
|
|
|
+ return row.id;
|
|
|
+ },
|
|
|
}
|
|
|
-};
|
|
|
+}
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
.expandTable {
|