From 0e4ef4b4e9f68acee331cf31e96b4c2c3c7a968d Mon Sep 17 00:00:00 2001 From: zhangshuaibao <15731629597@163.com> Date: 星期二, 30 三月 2021 17:41:07 +0800 Subject: [PATCH] 弹窗中折线统计图基本布局 --- src/components/BaseNav/PublicBounced/PublicBounced.vue | 29 +++++++++++------------------ 1 files changed, 11 insertions(+), 18 deletions(-) diff --git a/src/components/BaseNav/PublicBounced/PublicBounced.vue b/src/components/BaseNav/PublicBounced/PublicBounced.vue index 0522449..2307d3f 100644 --- a/src/components/BaseNav/PublicBounced/PublicBounced.vue +++ b/src/components/BaseNav/PublicBounced/PublicBounced.vue @@ -6,8 +6,9 @@ </div> <div class="public-bounced-content"> <div class="public-bounced-content-left"> - <GasTable></GasTable> - <GasECharts></GasECharts> + <GasTab :displayContent="displayContent"></GasTab> + <PublicTable v-if="value === 'gufei'"></PublicTable> + <GasECharts v-else></GasECharts> </div> <div class="public-bounced-content-right"> <GasVideo></GasVideo> @@ -19,14 +20,16 @@ <script> import '@/components/BaseNav/SolidWaste/directive' -import GasTable from '@components/BaseNav/PublicBounced/GasComponents/GasTable' +import GasTab from '@components/BaseNav/PublicBounced/GasComponents/GasTab' +import PublicTable from '@components/BaseNav/PublicBounced/GasComponents/PublicTable' import GasECharts from '@components/BaseNav/PublicBounced/GasComponents/GasECharts' import GasVideo from '@components/BaseNav/PublicBounced/GasComponents/GasVideo' export default { name: 'PublicBounced', components: { - GasTable, + GasTab, + PublicTable, GasECharts, GasVideo }, @@ -37,9 +40,10 @@ } }, methods: { - setData (data) { + setData (data, value) { this.displayContent = data this.flag = true + this.value = value }, closePopup () { this.flag = false @@ -50,18 +54,14 @@ <style lang="less" scoped> .public-bounced { - width: 80%; - height: 450px; z-index: 999; position: absolute; - top: 25%; - left: 10%; + top: 50%; + left: 50%; background-color: #002432; - margin: 1% auto; border: 1px #9fc5c8 solid; .public-bounced-title { - width: 100%; border: 1px #a4c0d8 solid; display: flex; align-items: center; @@ -82,22 +82,15 @@ } .public-bounced-content { - width: 100%; - height: 100%; display: flex; align-items: center; justify-content: space-around; .public-bounced-content-left { - width: 48%; - height: 400px; } .public-bounced-content-right { - width: 48%; - height: 400px; } } - } </style> -- Gitblit v1.8.0