From f2c8563d7f3bcc3131524214456464a512e2624a Mon Sep 17 00:00:00 2001 From: wangqi <magical1908@outlook.com> Date: 星期一, 15 三月 2021 11:51:34 +0800 Subject: [PATCH] 企业指标统计右侧 --- src/components/table/summarySheets.vue | 124 +++++++++++++++++++++++----------------- 1 files changed, 71 insertions(+), 53 deletions(-) diff --git a/src/components/table/summarySheets.vue b/src/components/table/summarySheets.vue index 2a45071..1bb0dc4 100644 --- a/src/components/table/summarySheets.vue +++ b/src/components/table/summarySheets.vue @@ -1,32 +1,38 @@ <template> <div class="summary-sheets"> - <el-row type="flex" class="head-area" align="middle"> - <el-col> - <span>浼佷笟鎸囨爣鍒嗙被缁熻</span> - </el-col> - <el-col class="head-area-button"> - <el-button style="float: right; padding: 3px 0" icon="el-icon-close" type="info"></el-button> - </el-col> - </el-row> +<!-- <div id="summary">--> +<!-- <el-row type="flex" class="head-area" align="middle">--> +<!-- <el-col>--> +<!-- <span>浼佷笟鎸囨爣鍒嗙被缁熻</span>--> +<!-- </el-col>--> +<!-- <el-col class="head-area-button">--> +<!-- <el-button style="float: right; padding: 3px 0" icon="el-icon-close" type="info" @click="closeBtn"></el-button>--> +<!-- </el-col>--> +<!-- </el-row>--> <!-- <el-tabs class="tabs-text">--> - <el-row :gutter="20" class="el-rowscol"> - <el-col> - <el-tabs class="tabs-text" v-model="activeName" type="card" @tab-click="handleClick"> - <el-tab-pane label="搴熸按" name="first"> - <waste-water></waste-water> - </el-tab-pane> - <el-tab-pane label="搴熸皵" name="second"> - <waste-gas></waste-gas> - </el-tab-pane> - <el-tab-pane label="鍥哄簾" name="third"> - <solid-waste></solid-waste> - </el-tab-pane> - <el-tab-pane label="绌烘皵璐ㄩ噺" name="fourth"> - <AirQuality></AirQuality> - </el-tab-pane> - </el-tabs> - </el-col> - </el-row> + <div> + <i class="el-icon-c-scale-to-original" @click="closeBtn"></i> + </div> + <Dialog ref="summarySheets" title="浼佷笟鎸囨爣鍒嗙被缁熻"> +<!-- <el-row :gutter="20" >--> +<!-- <el-col>--> + <el-tabs v-model="activeName" type="border-card"> + <el-tab-pane label="搴熸按" name="first"> + <waste-water></waste-water> + </el-tab-pane> + <el-tab-pane label="搴熸皵" name="second"> + <waste-gas></waste-gas> + </el-tab-pane> + <el-tab-pane label="鍥哄簾" name="third"> + <solid-waste></solid-waste> + </el-tab-pane> + <el-tab-pane label="绌烘皵璐ㄩ噺" name="fourth"> + <AirQuality></AirQuality> + </el-tab-pane> + </el-tabs> +<!-- </el-col>--> +<!-- </el-row>--> + </Dialog > </div> </template> @@ -35,9 +41,11 @@ import WasteGas from './components/WasteGas' import SolidWaste from './components/SolidWaste' import AirQuality from './components/AirQuality' +import Dialog from '@views/popup/Dialog' export default { - name: 'summary sheet.vue', + name: 'summary-sheet.vue', components: { + Dialog, WasteWater, WasteGas, SolidWaste, @@ -49,41 +57,51 @@ } }, methods: { - handleClick (tab, event) { - console.log(tab, event) + closeBtn () { + // const summary = document.getElementById('summary') + // summary.style.display = 'none' + this.$refs.summarySheets.show() + }, + tableHeaderColor ({ row, column, owIndex, columnIndex }) { + return 'background-color: rgba(26, 73, 81, 0.901960784313726);color:#fff;font-wight:500;font-size:12px;text-align:center;height:0px' + }, + // 琛ㄥご鏍峰紡璁剧疆 + rowClass () { + return 'text-align: center;background-color: rgba(26, 73, 81, 0.901960784313726);color:#fff;width:64px' } } } </script> -<style> +<style scoped lang="less"> .summary-sheets { - /*overflow: hidden;*/ position: absolute; - top: 50px; - left: 50px; - width: 850px; - height: 265px; + top: 450px; + left: 200px; + width: 40px; + height: 40px; + /*width: 850px;*/ + /*height: 265px;*/ border: #90c8e0 1px solid; - z-index:9999999; + z-index:2000; background-color: rgba(26, 73, 81, 0.901960784313726); /*color: #fff;*/ + .el-icon-c-scale-to-original { + width: 100%; + height: 100%; + } } - .head-area{ - color: #fff; - width: 100%; - height: 40px; - background-color: #002433; - font-size: 16px; - border-bottom: #90c8e0 2px solid; - padding-left: 16px; - /*line-height: 40px;*/ - } - .head-area-button{ - margin-right: 5px; - } - .el-rowscol{ - width: 100%; - height: 100%; - } + /*.head-area{*/ + /* color: #fff;*/ + /* width: 100%;*/ + /* height: 40px;*/ + /* background-color: #002433;*/ + /* font-size: 16px;*/ + /* border-bottom: #90c8e0 2px solid;*/ + /* padding-left: 16px;*/ + /* !*line-height: 40px;*!*/ + /*}*/ + /*.head-area-button{*/ + /* margin-right: 5px;*/ + /*}*/ </style> -- Gitblit v1.8.0