演练培训Web统计报表代码 导出功能代码提交

src/views/core/reportForms/drill.vue

@@ -53,27 +53,27 @@
 
             </el-form>
             <!-- 按纽    -->
-        <el-row :gutter="10" class="mb8">
+            <el-row :gutter="10" class="mb8">
               <el-col :span="1.5">
                 <el-button
-                type="primary"
-                icon="el-icon-search"
-                size="mini"
-                @click="handleQuery"
-                >搜索</el-button
-              >
-              <el-button type="primary" icon="el-icon-refresh" size="mini" @click="resetQuery"
-                >重置</el-button
-              >
-                <!-- <el-button
                   type="primary"
-                  plain
-                  icon="el-icon-plus"
+                  icon="el-icon-search"
                   size="mini"
-                  @click="exportExcel"
-
-                  >导出</el-button
-                > -->
+                  @click="handleQuery"
+                >搜索
+                </el-button
+                >
+                <el-button type="primary" icon="el-icon-refresh" size="mini" @click="resetQuery"
+                >重置
+                </el-button
+                >
+                <el-button
+                  type="primary"
+                  icon="el-icon-download"
+                  size="mini"
+                  @click="handleExport"
+                >导出数据
+                </el-button>
               </el-col>
             </el-row>
           </div>
@@ -107,17 +107,19 @@
   </div>
 </template>
 <script>
-import { mapGetters } from "vuex";
-import {getDrillList, getDrillReportData } from "@/api/evaluateTable/evaluateTable.js";
-import { deptTreeSelect } from "@/api/system/public";
+import {mapGetters} from "vuex";
+import {getDrillList, getDrillReportData} from "@/api/evaluateTable/evaluateTable.js";
+import {deptTreeSelect} from "@/api/system/public";
 import OrgTree from "@/components/orgTree/orgQuerySelector.vue";
 import DataRangePicker from "@/components/dateTime/daterange.picker.vue";
+import dayjs from "dayjs";
+
 export default {
   name: "DrillReport",
 
-  components: {OrgTree,DataRangePicker},
+  components: {OrgTree, DataRangePicker},
   data() {
-    const { params, query } = this.$route;
+    const {params, query} = this.$route;
     return {
       targetList: [],
       loading: false,
@@ -125,12 +127,13 @@ export default {
       queryParams: {
         orgId: null,
         planId: "",
-        range: [new Date(),new Date()],
-        isWebSelect:1,
+        range: [new Date(), new Date()],
+        isWebSelect: 1,
       },
       // 显示搜索条件
       showSearch: true,
       deptOptions: [], //机构数组
+      selectedOrgName: null,
     };
   },
   created() {
@@ -152,15 +155,20 @@ export default {
   },
   methods: {
     changeHandler() {
-     // this.getList();
+      // this.getList();
     },
-    changeSelect() {
+    changeSelect(org) {
+      this.selectedOrgName = org.shortName
+      console.log("this.selectedOrgName", this.selectedOrgName)
       //this.getList();
     },
     /** 查询机构树数据 */
     getDeptTree() {
       deptTreeSelect().then((response) => {
         this.deptOptions = response.data;
+        if (response.data.length > 0) {
+          this.selectedOrgName = response.data[0].shortName
+        }
       });
     },
     /** 获取所有计划列表 */
@@ -184,31 +192,15 @@ export default {
         children: node.children,
       };
     },
-    //单选框状态改变
-    checkChange(state) {
-      this.queryParams.checkSub = state;
-      this.handleQuery();
-    },
-    getDefaultOrg(org) {
-      this.queryParams.orgId = org.id;
-      this.selectedOrgName = org.shortName;
-     // this.getList();
-    },
-    // 节点单击事件
-    clickTreeNode(data) {
-      this.queryParams.orgId = data.id;
-      this.selectedOrgName = data.shortName;
-      this.handleQuery();
-    },
     //获取列表
     getList() {
       this.loading = true;
       getDrillReportData(this.queryParams).then((res) => {
-        let { code, data, msg } = res;
+        let {code, data, msg} = res;
         if (code == 200) {
-          if (data.length>0){
+          if (data.length > 0) {
             this.targetList = data || [];
-          }else {
+          } else {
             this.$message.error("暂无数据")
           }
         }
@@ -237,8 +229,19 @@ export default {
 
       this.getList();
     },
-    //导出
-    exportExcel() {},
+    /** 导出按钮操作 */
+    handleExport() {
+      console.log("this.queryParams", this.queryParams)
+      this.download(
+        "core/drill/task/exportReport",
+        {
+          ...this.queryParams,
+        },
+        `${
+          this.selectedOrgName
+        }-${this.$tab.getCurrentTabName()}-${dayjs().format("YYYYMMDD")}.xlsx`
+      );
+    },
   },
 };
 </script>
@@ -248,8 +251,10 @@ export default {
     width: 264px;
   }
 }
+
 .securityEquipmentMonitoringtable {
   background-color: #fff;
+
   .table-scroll {
     // table-layout:auto;
 
@@ -288,6 +293,7 @@ export default {
     .greentd {
       color: green;
     }
+
     .redtd {
       color: red;
     }

src/views/core/reportForms/eduTraining.vue

@@ -30,15 +30,15 @@
                   noResultsText="没有搜索结果"
                 />
               </el-form-item>
-<!--              <el-form-item label="受训机构">
-                <org-tree
-                  v-model="queryParams.orgId"
-                  @defaultOrg="getDefaultOrg"
-                  @checkChange="checkChange"
-                  @click="clickTreeNode"
-                  :defaultCheckSub="false"
-                ></org-tree>
-              </el-form-item>-->
+              <!--              <el-form-item label="受训机构">
+                              <org-tree
+                                v-model="queryParams.orgId"
+                                @defaultOrg="getDefaultOrg"
+                                @checkChange="checkChange"
+                                @click="clickTreeNode"
+                                :defaultCheckSub="false"
+                              ></org-tree>
+                            </el-form-item>-->
               <el-form-item label="培训任务名称:" label-width="50">
                 <el-select v-model="queryParams.planId" @change="changeHandler">
                   <el-option
@@ -51,35 +51,33 @@
                 </el-select>
               </el-form-item>
 
-              <el-form-item label="时间" prop="date" >
-                <el-date-picker   value-format='yyyy-MM-dd' v-model="queryParams.date"
-                                  align="right" type="month" placeholder="请选择查询时间">
+              <el-form-item label="时间" prop="date">
+                <el-date-picker value-format='yyyy-MM-dd' v-model="queryParams.date"
+                                align="right" type="month" placeholder="请选择查询时间">
                 </el-date-picker>
               </el-form-item>
 
             </el-form>
             <!-- 按纽    -->
-        <el-row :gutter="10" class="mb8">
+            <el-row :gutter="10" class="mb8">
               <el-col :span="1.5">
                 <el-button
-                type="primary"
-                icon="el-icon-search"
-                size="mini"
-                @click="handleQuery"
-                >搜索</el-button
-              >
-              <el-button type="primary" icon="el-icon-refresh" size="mini" @click="resetQuery"
-                >重置</el-button
-              >
-                <!-- <el-button
                   type="primary"
-                  plain
-                  icon="el-icon-plus"
+                  icon="el-icon-search"
                   size="mini"
-                  @click="exportExcel"
-
-                  >导出</el-button
-                > -->
+                  @click="handleQuery"
+                >搜索
+                </el-button>
+                <el-button type="primary" icon="el-icon-refresh" size="mini" @click="resetQuery"
+                >重置
+                </el-button>
+                <el-button
+                  type="primary"
+                  icon="el-icon-download"
+                  size="mini"
+                  @click="handleExport"
+                >导出数据
+                </el-button>
               </el-col>
             </el-row>
           </div>
@@ -113,16 +111,18 @@
   </div>
 </template>
 <script>
-import { mapGetters } from "vuex";
+import {mapGetters} from "vuex";
 import {getEduPlanList, getEduReportData} from "@/api/evaluateTable/evaluateTable.js";
-import { deptTreeSelect } from "@/api/system/public";
+import {deptTreeSelect} from "@/api/system/public";
 import OrgTree from "@/components/orgTree/orgQuerySelector.vue";
+import dayjs from "dayjs";
+
 export default {
   name: "eduTrainingReport",
 
   components: {OrgTree},
   data() {
-    const { params, query } = this.$route;
+    const {params, query} = this.$route;
     return {
       targetList: [],
       loading: false,
@@ -131,11 +131,12 @@ export default {
         orgId: null,
         planId: "",
         date: new Date(),
-        isWebSelect:1,
+        isWebSelect: 1,
       },
       // 显示搜索条件
       showSearch: true,
       deptOptions: [], //机构数组
+      selectedOrgName:null,
     };
   },
   created() {
@@ -157,15 +158,19 @@ export default {
   },
   methods: {
     changeHandler() {
-      this.getList();
+      //  this.getList();
     },
-    changeSelect() {
-      this.getList();
+    changeSelect(org) {
+      this.selectedOrgName=org.shortName
+      // this.getList();
     },
     /** 查询机构树数据 */
     getDeptTree() {
       deptTreeSelect().then((response) => {
         this.deptOptions = response.data;
+        if (response.data.length > 0) {
+          this.selectedOrgName = response.data[0].shortName
+        }
       });
     },
     /** 获取所有计划列表 */
@@ -189,36 +194,21 @@ export default {
         children: node.children,
       };
     },
-    //单选框状态改变
-    checkChange(state) {
-      this.queryParams.checkSub = state;
-      this.handleQuery();
-    },
-    getDefaultOrg(org) {
-      this.queryParams.orgId = org.id;
-      this.selectedOrgName = org.shortName;
-     // this.getList();
-    },
-    // 节点单击事件
-    clickTreeNode(data) {
-      this.queryParams.orgId = data.id;
-      this.selectedOrgName = data.shortName;
-      this.handleQuery();
-    },
     //获取列表
     getList() {
       this.loading = true;
       getEduReportData(this.queryParams).then((res) => {
-        let { code, data, msg } = res;
+        let {code, data, msg} = res;
         if (code == 200) {
-          if (data.length>0){
+          if (data.length > 0) {
             this.targetList = data || [];
-          }else {
+          } else {
             this.$message.error("暂无数据")
           }
         }
         this.loading = false;
       });
+
     },
 
     /** 新增按钮操作 */
@@ -239,11 +229,24 @@ export default {
         orgId: this.orgId,
         planId: this.options[0].id,
       };
-
       this.getList();
     },
-    //导出
-    exportExcel() {},
+
+    /** 导出按钮操作 */
+    handleExport() {
+      console.log("this.queryParams",this.queryParams)
+      let param={
+        ...this.queryParams,
+      }
+      param.date=dayjs(param.date).format("YYYY-MM-DD HH:mm:s")
+      this.download(
+        "core/eduTask/exportReport",
+        param,
+        `${
+          this.selectedOrgName
+        }-${this.$tab.getCurrentTabName()}-${dayjs().format("YYYYMMDD")}.xlsx`
+      );
+    },
   },
 };
 </script>
@@ -253,8 +256,10 @@ export default {
     width: 264px;
   }
 }
+
 .securityEquipmentMonitoringtable {
   background-color: #fff;
+
   .table-scroll {
     // table-layout:auto;
 
@@ -293,6 +298,7 @@ export default {
     .greentd {
       color: green;
     }
+
     .redtd {
       color: red;
     }