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 | 50 +++++++++++++++++++++++++------------------------- 1 files changed, 25 insertions(+), 25 deletions(-) diff --git a/src/components/BaseNav/PublicBounced/PublicBounced.vue b/src/components/BaseNav/PublicBounced/PublicBounced.vue index dab29fe..2307d3f 100644 --- a/src/components/BaseNav/PublicBounced/PublicBounced.vue +++ b/src/components/BaseNav/PublicBounced/PublicBounced.vue @@ -1,14 +1,18 @@ <template> - <div class="public-bounced" v-show="flag"> + <div class="public-bounced" v-draw v-show="flag"> <div class="public-bounced-title"> <span>{{ displayContent.Name }}</span> <i class="el-icon-circle-close" @click="closePopup"></i> </div> <div class="public-bounced-content"> - <div class="public-bounced-content-left"></div> - <div class="public-bounced-content-right"></div> -<!-- <span>鍐呭</span>--> - <popup-gas></popup-gas> + <div class="public-bounced-content-left"> + <GasTab :displayContent="displayContent"></GasTab> + <PublicTable v-if="value === 'gufei'"></PublicTable> + <GasECharts v-else></GasECharts> + </div> + <div class="public-bounced-content-right"> + <GasVideo></GasVideo> + </div> </div> </div> </template> @@ -16,23 +20,30 @@ <script> import '@/components/BaseNav/SolidWaste/directive' +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' -import PopupGas from '@components/flueGas/popup-gas' export default { name: 'PublicBounced', + components: { + GasTab, + PublicTable, + GasECharts, + GasVideo + }, data () { return { displayContent: [], flag: false } }, - components: { - PopupGas - }, methods: { - setData (data) { + setData (data, value) { this.displayContent = data this.flag = true + this.value = value }, closePopup () { this.flag = false @@ -43,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; @@ -75,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; - border: 1px red solid; } + .public-bounced-content-right { - width: 48%; - height: 400px; - border: 1px red solid; } } - } </style> -- Gitblit v1.8.0