From 4df0471b7dff0494625ff09969b1a13b5359a26e Mon Sep 17 00:00:00 2001 From: XingChuan <m17600301067@163.com> Date: 星期一, 31 五月 2021 22:41:47 +0800 Subject: [PATCH] 统计表弹框UI优化;增加点击企业名称缩放至企业;二级表展示功能优化。 --- src/components/table/enterprise.vue | 47 +++++++++++++++++++++++++++++++++++------------ 1 files changed, 35 insertions(+), 12 deletions(-) diff --git a/src/components/table/enterprise.vue b/src/components/table/enterprise.vue index f024ad2..da345c3 100644 --- a/src/components/table/enterprise.vue +++ b/src/components/table/enterprise.vue @@ -1,12 +1,22 @@ <template> <div class="enterprise-panel"> <div class="enterprise-function" @click="showWarnDialog()"> - <img src="@/assets/images/map-pages/icon/map/warn.png" alt="" width="32px"> + <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="棰勬姤璀�" placement="left"> + <div :class='["iconBtn",warnVisible ? "active-button" : ""]'> + <img src="@/assets/images/map-pages/icon/map/warn.png" alt="" class="icon"> + <!--<span class="icon-name">棰勬姤璀�</span>--> + </div> + </el-tooltip> </div> <div class="enterprise-function" @click="showStatisDialog()"> - <img src="@/assets/images/map-pages/icon/map/company.png" alt="" width="32px"> + <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="鎸囨爣" placement="bottom"> + <div :class='["iconBtn",companyVisible ? "active-button" : ""]'> + <img src="@/assets/images/map-pages/icon/map/company.png" alt="" class="icon"> + <!-- <span class="icon-name">鎸囨爣</span>--> + </div> + </el-tooltip> </div> - <Dialog ref="warnDialog" title="浼佷笟棰勮鎶ヨ鍒嗙被缁熻"> + <Dialog ref="warnDialog" title="浼佷笟棰勮鎶ヨ鍒嗙被缁熻" > <warn></warn> </Dialog> <Dialog ref="indexStatisticsDialog" title="浼佷笟鎸囨爣鍒嗙被缁熻"> @@ -28,7 +38,9 @@ }, data () { return { - comp: Warn + comp: Warn, + warnVisible: false, + companyVisible: false } }, methods: { @@ -38,10 +50,23 @@ }, showWarnDialog () { this.$refs.warnDialog.show() + this.warnVisible = true }, showStatisDialog () { this.$refs.indexStatisticsDialog.show() + this.companyVisible = true } + }, + mounted () { + const that = this + this.$nextTick(() => { + this.$refs.warnDialog.$on('closeDialog', () => { + that.warnVisible = false + }) + this.$refs.indexStatisticsDialog.$on('closeDialog', () => { + that.companyVisible = false + }) + }) } } </script> @@ -49,14 +74,12 @@ <style lang="less" scoped> .enterprise-panel{ position: absolute; - right: 5px; - top:5px; - z-index: 9999; - - .enterprise-function{ - width: 40px; - float: left; - cursor: pointer; + right: 0.14583rem; + top:0.11979rem; + z-index: 1000; + display: flex; + .enterprise-function:not(:first-child){ + margin-left: 0.05rem; } } </style> -- Gitblit v1.8.0