From 043a44a6b4d61796eafdecc02a13d47dd7137888 Mon Sep 17 00:00:00 2001
From: wangqi <magical1908@outlook.com>
Date: 星期五, 19 三月 2021 11:13:13 +0800
Subject: [PATCH] 点击图标箭头，展开图表
---
src/components/table/components/WasteWater.vue | 21 ++++++++++++++++-----
1 files changed, 16 insertions(+), 5 deletions(-)
diff --git a/src/components/table/components/WasteWater.vue b/src/components/table/components/WasteWater.vue
index 0d88a05..3291fb1 100644
--- a/src/components/table/components/WasteWater.vue
+++ b/src/components/table/components/WasteWater.vue
@@ -21,8 +21,8 @@
popper-class="popovers"
>
<ChemicalWastewater v-show="$index ===1"></ChemicalWastewater>
- <i class="el-icon-caret-right" slot="reference" v-if="!isShowIcon" @click="doIcon($index)"></i>
- <i class="el-icon-caret-bottom" slot="reference" v-else @click="doIcon($index)"></i>
+ <i class="el-icon-caret-right" :class="{active: isActive === $index}" slot="reference" @click="doIcon($index)"></i>
+<!-- <i class="el-icon-caret-bottom" slot="reference" v-else @click="doIcon($index)"></i>-->
</el-popover>
</template>
</el-table-column>
@@ -146,6 +146,7 @@
},
data () {
return {
+ isActive: '',
isShowIcon: false,
tableData: [{
UserName: '闆嗗洟鍚嶇О',
@@ -211,11 +212,17 @@
console.log(row.UserName)
},
doIcon (index) {
- if (index === 1) {
- this.isShowIcon = !this.isShowIcon
- } else {
+ if (index !== 1) {
this.isShowIcon = false
+ this.isActive = ''
+ return
}
+ this.isShowIcon = !this.isShowIcon
+ if (index === this.isActive) {
+ this.isActive = ''
+ return
+ }
+ this.isActive = index
}
}
}
@@ -229,5 +236,9 @@
.popovers.el-popover{
padding:0;
}
+.active {
+ /*color: red;*/
+ transform:rotate(90deg);
+}
</style>
--
Gitblit v1.8.0