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/panel/LegendPanel.vue | 33 ++++++++++++++++++++++++---------
1 files changed, 24 insertions(+), 9 deletions(-)
diff --git a/src/components/panel/LegendPanel.vue b/src/components/panel/LegendPanel.vue
index fe6d347..87c4fce 100644
--- a/src/components/panel/LegendPanel.vue
+++ b/src/components/panel/LegendPanel.vue
@@ -1,13 +1,13 @@
<template>
<div class="legend-panel">
<transition name="fade">
- <div :class="'legend-content map-background'" v-show="legendControl">
+ <div :class="'legend-content map-background'" v-show="isShow">
<div class="legend-content-box" v-for="(item,index) in serviceLayers" :key="index">
<p><span>{{ item.name }}</span></p>
<div class="map-under-line"></div>
<ul>
- <li v-for="(ite,inde) in item.layers" :key="inde">
- <img :src='ite.legendImage' alt=''>
+ <li v-for="(ite,idx) in item.layers" :key="idx">
+ <img :src="ite.legendImage===undefined?'../.././assets/images/map-pages/setting.png':ite.legendImage" alt=''>
<span>{{ ite.name }}</span>
</li>
</ul>
@@ -15,7 +15,7 @@
</div>
</transition>
<el-tooltip :popper-class="'map-tooltip'" effect="dark" content="鍥句緥" placement="left">
- <div :class="this.legendControl?'legend-btn map-btn-active':'legend-btn map-btn-unactive'"
+ <div :class="this.isShow?'legend-btn map-btn-active':'legend-btn map-btn-unactive'"
@click="legendChange()">
<i class="el-icon-more-outline"></i>
</div>
@@ -32,20 +32,33 @@
import { LayerPipeLines } from '../../conf/layers/LayerPipeLines'
import { LayerPk } from '../../conf/layers/LayerPk'
import { LayerArea } from '../../conf/layers/LayerArea'
-
+import bus from '@/eventBus'
export default {
name: 'LegendPanel',
data () {
return {
// 鎺у埗鍥句緥 鍐呭鐨� 鏄剧ず/闅愯棌
- legendControl: false,
+ isShow: false,
serviceLayers: [LayerSoilGroundWater, LayerEnvRisk, LayerAirQuality, LayerWasteSolid, LayerWasteGas, LayerWasteWater, LayerArea, LayerPk, LayerPipeLines]
}
+ },
+ mounted () {
+ const that = this
+ bus.$on('changeState', function (state) {
+ if (state.num !== 4 && state.type) {
+ that.isShow = false
+ }
+ })
},
methods: {
// 鍥炬爣 鎺у埗鍐呭鐨勫睍绀轰笌闅愯棌
legendChange () {
- this.legendControl = !this.legendControl
+ this.isShow = !this.isShow
+ const state = {
+ type: this.isShow,
+ num: 4
+ }
+ bus.$emit('changeState', state)
}
}
}
@@ -169,8 +182,10 @@
margin: 0.05208rem 0;
img {
- width: .08333rem;
- height: .08333rem;
+ // width: .08333rem;
+ // height: .08333rem;
+ width: 0.1rem;
+ height: 0.1rem;
margin-right: .01042rem;
}
--
Gitblit v1.8.0