From a19ce43fb54c9d5e3aeb237ca3b2ca2f2abe0ba8 Mon Sep 17 00:00:00 2001 From: zhangshuaibao <15731629597@163.com> Date: 星期三, 14 四月 2021 10:38:08 +0800 Subject: [PATCH] 废水图标完善 --- src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue | 46 +++++++++++++++++++++++++++++++++++----------- 1 files changed, 35 insertions(+), 11 deletions(-) diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue index efb16e4..e4d0a61 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue @@ -4,11 +4,17 @@ <div class="border_corner border_corner_right_top"></div> <div class="border_corner border_corner_left_bottom"></div> <div class="border_corner border_corner_right_bottom"></div> - <ul class="tab"> - <li @click='tabTaggle("Echarts")'>瀹炴椂鏁版嵁</li> - <li @click='tabTaggle("EChartsHour")'>灏忔椂鏁版嵁</li> - <li @click='tabTaggle("EChartsDate")'>鏃ユ暟鎹�</li> - <li @click='tabTaggle("ECharts")'>浜哄伐鏁版嵁</li> + <ul class="tab" v-if="this.$attrs.value === 'feiqi'"> + <li :class="active==0?'hover':''" @click='tabTaggle("ECharts",0)'>瀹炴椂鏁版嵁</li> + <li :class="active==1?'hover':''" @click='tabTaggle("EChartsHour",1)'>灏忔椂鏁版嵁</li> + <li :class="active==2?'hover':''" @click='tabTaggle("EChartsDate",2)'>鏃ユ暟鎹�</li> + <li :class="active==3?'hover':''" @click='tabTaggle("EChartsTable",3)'>浜哄伐鏁版嵁</li> + </ul> + <ul class="tab" v-else> + <li :class="active==0?'hover':''" @click='tabTaggle("EChartsRealWasteWater",0)'>瀹炴椂鏁版嵁</li> + <li :class="active==1?'hover':''" @click='tabTaggle("EChartsHourWasteWater",1)'>灏忔椂鏁版嵁</li> + <li :class="active==2?'hover':''" @click='tabTaggle("EChartsDateWasteWater",2)'>鏃ユ暟鎹�</li> + <li :class="active==3?'hover':''" @click='tabTaggle("EChartsWasteWaterTable",3)'>浜哄伐鏁版嵁</li> </ul> <div class="legend" > <span >姝e父</span> @@ -18,28 +24,46 @@ <span >瓒呮爣</span> <i style=" background: orange;"></i> </div> - <component :is="currentTab" v-bind="$attrs"></component> + <component :is="currentTab" v-bind="$attrs" ref="Echatrs"></component> </div> </template> <script> +import ECharts from './Echarts' import EChartsHour from './EChartsHour' import EChartsDate from './EChartsDate' +import EChartsTable from './EChartsTable' + +import EChartsRealWasteWater from './EChartsRealWasteWater' +import EChartsHourWasteWater from './EChartsHourWasteWater' +import EChartsDateWasteWater from './EChartsDateWasteWater' +import EChartsWasteWaterTable from './EChartsWasteWaterTable' export default { name: 'PublicChart', components: { EChartsHour, - EChartsDate + EChartsDate, + ECharts, + EChartsTable, + EChartsHourWasteWater, + EChartsDateWasteWater, + EChartsRealWasteWater, + EChartsWasteWaterTable + }, + mounted () { + this.$refs.Echatrs.CreateChart() }, data () { return { - currentTab: 'EChartsHour' + currentTab: 'EChartsHour', + active: '1' } }, methods: { - tabTaggle (taggleMenu) { + tabTaggle (taggleMenu, num) { this.currentTab = taggleMenu + this.active = num // debugger } } @@ -107,10 +131,10 @@ margin-right: 10px; padding:0 15px } - +.tab li.hover, .tab li:hover { background-color: #0e639e; - color: #682000; + color: #fff; cursor: pointer; } .legend{ -- Gitblit v1.8.0