|
@@ -1,10 +1,12 @@
|
|
<template>
|
|
<template>
|
|
<el-table class="custom-table" :class="customClass" stripe :data="data.data" :height="height" style="width: 100%" @cell-click="onClick" @header-click="onHeaderClick">
|
|
<el-table class="custom-table" :class="customClass" stripe :data="data.data" :height="height" style="width: 100%" @cell-click="onClick" @header-click="onHeaderClick">
|
|
- <template v-for="col in data.column" :key="col">
|
|
|
|
|
|
+ <template v-for="(col, cIndex) in data.column" :key="col">
|
|
<el-table-column v-if="col.child && col.child.length > 0" :label="col.name" :key="col">
|
|
<el-table-column v-if="col.child && col.child.length > 0" :label="col.name" :key="col">
|
|
<el-table-column
|
|
<el-table-column
|
|
- v-for="sub in col.child"
|
|
|
|
|
|
+ v-for="(sub, sindex) in col.child"
|
|
:key="sub"
|
|
:key="sub"
|
|
|
|
+ :index="cIndex"
|
|
|
|
+ :class-name="getClassName(cIndex, sindex)"
|
|
:label="sub.name"
|
|
:label="sub.name"
|
|
:prop="sub.field"
|
|
:prop="sub.field"
|
|
:width="sub.width"
|
|
:width="sub.width"
|
|
@@ -89,6 +91,10 @@ export default {
|
|
};
|
|
};
|
|
},
|
|
},
|
|
},
|
|
},
|
|
|
|
+ isColumnLight: {
|
|
|
|
+ type: Boolean,
|
|
|
|
+ default: true,
|
|
|
|
+ },
|
|
},
|
|
},
|
|
emits: {
|
|
emits: {
|
|
onPagging: null,
|
|
onPagging: null,
|
|
@@ -98,6 +104,8 @@ export default {
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
currentPage: 1,
|
|
currentPage: 1,
|
|
|
|
+ headerIndex: -1,
|
|
|
|
+ subIndex: -1,
|
|
};
|
|
};
|
|
},
|
|
},
|
|
computed: {
|
|
computed: {
|
|
@@ -142,6 +150,10 @@ export default {
|
|
if (column.rawColumnKey.click) column.rawColumnKey.click(event, row);
|
|
if (column.rawColumnKey.click) column.rawColumnKey.click(event, row);
|
|
},
|
|
},
|
|
onHeaderClick(column, event) {
|
|
onHeaderClick(column, event) {
|
|
|
|
+ if (column.level == 2) {
|
|
|
|
+ this.headerIndex = column.index;
|
|
|
|
+ this.subIndex = column.no;
|
|
|
|
+ }
|
|
this.$emit("headerClick", { event: event, col: column.rawColumnKey, data: this.data.data });
|
|
this.$emit("headerClick", { event: event, col: column.rawColumnKey, data: this.data.data });
|
|
},
|
|
},
|
|
handleCurrentChange(val) {
|
|
handleCurrentChange(val) {
|
|
@@ -153,6 +165,10 @@ export default {
|
|
end: this.endRow,
|
|
end: this.endRow,
|
|
});
|
|
});
|
|
},
|
|
},
|
|
|
|
+ getClassName(cindex, sindex) {
|
|
|
|
+ if (this.isColumnLight == true && cindex == this.headerIndex && sindex == this.subIndex) return "light";
|
|
|
|
+ return "";
|
|
|
|
+ },
|
|
},
|
|
},
|
|
// 生命周期钩子
|
|
// 生命周期钩子
|
|
beforeCreate() {
|
|
beforeCreate() {
|