From 1873f17e4c4c4d27f92fc9a40636a000d97d25d0 Mon Sep 17 00:00:00 2001
From: caoqianming <caoqianming@foxmail.com>
Date: Thu, 1 Feb 2024 09:32:28 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0cems=E5=AF=BC?=
 =?UTF-8?q?=E5=87=BA=E7=95=8C=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../bigScreen/enpComponents/cemsExport.vue    | 136 ++++++++++++++++++
 src/views/bigScreen/index_enp_blue.vue        |   7 +-
 2 files changed, 141 insertions(+), 2 deletions(-)
 create mode 100644 src/views/bigScreen/enpComponents/cemsExport.vue

diff --git a/src/views/bigScreen/enpComponents/cemsExport.vue b/src/views/bigScreen/enpComponents/cemsExport.vue
new file mode 100644
index 00000000..9f03823d
--- /dev/null
+++ b/src/views/bigScreen/enpComponents/cemsExport.vue
@@ -0,0 +1,136 @@
+<template>
+    <el-card header="CEMS报表导出">
+        <el-date-picker size="large" v-model="query.time" type="datetime" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="时间选择" style=" width: 400px" />
+        <el-select size="large" v-model="query.type" placeholder="周期" style="margin-left:4px">
+            <el-option v-for="item in typeOptions" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+        <el-button size="large" type="primary" @click="exportExcel" style="margin-left: 4px"
+            v-loading="eLoading">导出报表</el-button>
+    </el-card>
+    <!-- <div class="exportContainer">
+        <div class="ecard">
+            <div>
+                <el-icon :size="80" color="#536DFE">
+                    <Grid />
+                </el-icon>
+            </div>
+            <el-date-picker style="width: 90%"></el-date-picker>
+            <div style="height: 6px;"></div>
+            <p class="ecard_title">小时报表</p>
+            <div style="height: 6px;"></div>
+            <el-button type="primary" v-loading="eLoading" @click="exportXlsx('hour')">导出</el-button>
+        </div>
+        <div class="ecard">
+            <div>
+                <el-icon :size="80" color="#536DFE">
+                    <Grid />
+                </el-icon>
+            </div>
+            <el-date-picker style="width: 90%"></el-date-picker>
+            <div style="height: 6px;"></div>
+            <p class="ecard_title">日报表</p>
+            <div style="height: 6px;"></div>
+            <el-button type="primary" v-loading="eLoading" @click="exportXlsx('day')">导出</el-button>
+        </div>
+        <div class="ecard">
+            <div>
+                <el-icon :size="80" color="#536DFE">
+                    <Grid />
+                </el-icon>
+            </div>
+            <el-date-picker style="width: 90%"></el-date-picker>
+            <div style="height: 6px;"></div>
+            <p class="ecard_title">周报表</p>
+            <div style="height: 6px;"></div>
+            <el-button type="primary" v-loading="eLoading">导出</el-button>
+        </div>
+        <div class="ecard">
+            <div>
+                <el-icon :size="80" color="#536DFE">
+                    <Grid />
+                </el-icon>
+            </div>
+            <el-date-picker style="width: 90%"></el-date-picker>
+            <div style="height: 6px;"></div>
+            <p class="ecard_title">月报表</p>
+            <div style="height: 6px;"></div>
+            <el-button type="primary" v-loading="eLoading">导出</el-button>
+        </div>
+        <div class="ecard">
+            <div>
+                <el-icon :size="80" color="#536DFE">
+                    <Grid />
+                </el-icon>
+            </div>
+            <el-date-picker style="width: 90%"></el-date-picker>
+            <div style="height: 6px;"></div>
+            <p class="ecard_title">季度报表</p>
+            <div style="height: 6px;"></div>
+            <el-button type="primary" v-loading="eLoading">导出</el-button>
+        </div>
+        <div class="ecard">
+            <div>
+                <el-icon :size="80" color="#536DFE">
+                    <Grid />
+                </el-icon>
+            </div>
+            <el-date-picker style="width: 90%"></el-date-picker>
+            <div style="height: 6px;"></div>
+            <p class="ecard_title">年报表</p>
+            <div style="height: 6px;"></div>
+            <el-button type="primary" v-loading="eLoading">导出</el-button>
+        </div>
+    </div> -->
+</template>
+<script>
+export default {
+    data() {
+        return {
+            query: { time: '', type: 'hour' },
+            eLoading: false,
+            typeOptions: [
+                { label: '小时', value: 'hour' },
+                { label: '日', value: 'day' },
+                { label: '周', value: 'week' },
+                { label: '月', value: 'month' },
+                { label: '季度', value: 'season' },
+                { label: '年', value: 'year' },
+            ]
+        }
+    },
+    mounted() {
+        this.initTime()
+    },
+    methods: {
+        initTime() {
+            let date = new Date()
+            this.query.time = this.$TOOL.dateFormat(date)
+        },
+        exportExcel() {
+            this.eLoading = true;
+            console.log(this.query)
+            this.eLoading = false;
+        }
+    },
+}
+</script>
+<style scoped>
+.exportContainer {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, 210px);
+    grid-template-rows: repeat(3, 210px);
+    column-gap: 10px;
+    row-gap: 10px;
+}
+
+.ecard {
+    background-color: white;
+    border-radius: 4%;
+    text-align: center;
+}
+
+.ecard_title {
+    font-size: 22px
+}
+</style>
\ No newline at end of file
diff --git a/src/views/bigScreen/index_enp_blue.vue b/src/views/bigScreen/index_enp_blue.vue
index 6393aff5..18290fa9 100644
--- a/src/views/bigScreen/index_enp_blue.vue
+++ b/src/views/bigScreen/index_enp_blue.vue
@@ -22,7 +22,7 @@
                     <el-dropdown-item command="paikou">排放口清单</el-dropdown-item>
                     <el-dropdown-item command="cems">CEMS监测清单</el-dropdown-item>
                     <el-dropdown-item command="cems2">CEMS监测预警</el-dropdown-item>
-                    <el-dropdown-item>CEMS报表导出</el-dropdown-item>
+                    <el-dropdown-item command="cemsExport">CEMS报表导出</el-dropdown-item>
                   </el-dropdown-menu>
                 </template>
               </el-dropdown>
@@ -284,6 +284,7 @@
           <org-dialog v-if="activeDrawerName == 'paikou'" @close="closeDialog"></org-dialog>
           <cems-drawer v-else-if="activeDrawerName == 'cems'" @close="closeDialog"></cems-drawer>
           <cems2-drawer v-else-if="activeDrawerName == 'cems2'" @close="closeDialog"></cems2-drawer>
+          <cems-export v-else-if="activeDrawerName == 'cemsExport'" @close="closeDialog"></cems-export>
         </el-drawer>
       </div>
     </el-main>
@@ -298,13 +299,15 @@ import * as BABYLON_MATERIAL from "@/utils/babylonMaterial"
 import orgDialog from "./enpComponents/orgwryList"
 import cemsDrawer from './enpComponents/cems.vue'
 import cems2Drawer from './enpComponents/cems2.vue'
+import cemsExport from './enpComponents/cemsExport.vue'
 import 'babylonjs-loaders';
 import 'animate.css';
 export default {
   components: {
     orgDialog,
     cemsDrawer,
-    cems2Drawer
+    cems2Drawer,
+    cemsExport
   },
   data() {
     return {