数据统计列表页

dcit-hcsystem-hcsystem-master/src/views/Enterprises/EnterprisesInformation.vue

 <template>
-    <div class="EnseList">
-      <el-row class="topBar">
-        <el-col>
-          <el-form :inline="true" :model="searchData">
-            <el-form-item>
-              <el-input v-model="searchData.unitName" placeholder="请输入企业名称"></el-input>
-            </el-form-item>
-            <el-form-item>
-              <el-button type="primary" @click="searchFun()">
-                <i class="el-icon-search"></i> 搜索
-              </el-button>
-              <el-button type="primary" @click="resetFun()">
-                <i class="el-icon-refresh"></i> 重置
-              </el-button>
-            </el-form-item>
-          </el-form>
-        </el-col>
-      </el-row>
-      <el-table :data="tableData.pageData" stripe show-summary border style="width:100%;" :loading="loading">
-        <el-table-column prop="unitName" label="企业名称"></el-table-column>
-        <el-table-column prop="unitName" label="危险源"></el-table-column>
-        <el-table-column prop="legalPerson" label="设备监控"></el-table-column>
-        <el-table-column prop="orgCode" label="职业危害场所"></el-table-column>
-        <el-table-column prop="legalPersonEmail" label="隐患数量""></el-table-column>
-      </el-table>
-      <el-pagination
-        background
-        layout="total,sizes, prev, pager, next, jumper"
-        :total="tableData.total"
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-        :current-page="PAGE.page"
-        :page-size="PAGE.size"
-      ></el-pagination>
-      <EnterprisesMgEdit
-        v-if="dialogVisible"
-        :dialogVisible="dialogVisible"
-        :editFormA="formData"
-        @dialogFun="closeDialog"
-        @refreshTableData="getTableData"
-        :key="zjKey"
-      ></EnterprisesMgEdit>
-    </div>
-  </template>
-  <script lang="ts">
+  <div class="EnseList">
+    <el-row class="topBar">
+      <el-col>
+        <el-form :inline="true" :model="searchData">
+          <el-form-item>
+            <el-input v-model="searchData.unitName" placeholder="请输入企业名称"></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="searchFun()">
+              <i class="el-icon-search"></i> 搜索
+            </el-button>
+            <el-button type="primary" @click="resetFun()">
+              <i class="el-icon-refresh"></i> 重置
+            </el-button>
+          </el-form-item>
+        </el-form>
+      </el-col>
+    </el-row>
+    <el-table :data="tableData.pageData" stripe show-summary :summary-method="getTotal" border style="width:100%;" :loading="loading">
+      <el-table-column prop="unitName" label="企业名称"></el-table-column>
+      <el-table-column prop="dangerNum" label="危险源数量"></el-table-column>
+      <el-table-column prop="cameraNum" label="设备监控数量"></el-table-column>
+      <el-table-column prop="troubleNum" label="隐患数量"></el-table-column>
+    </el-table>
+    <el-pagination
+            background
+            layout="total,sizes, prev, pager, next, jumper"
+            :total="tableData.total"
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            :current-page="PAGE.page"
+            :page-size="PAGE.size"
+    ></el-pagination>
+    <EnterprisesMgEdit
+            v-if="dialogVisible"
+            :dialogVisible="dialogVisible"
+            :editFormA="formData"
+            @dialogFun="closeDialog"
+            @refreshTableData="getTableData"
+            :key="zjKey"
+    ></EnterprisesMgEdit>
+  </div>
+</template>
+<script lang="ts">
   import { Component, Vue, Provide } from "vue-property-decorator";
   import EnterprisesMgEdit from "./EnterprisesMgEdit.vue";
   import City from "@/components/city.vue";
@@ -61,24 +60,70 @@
     @Provide() dialogVisible: Boolean = false;
     @Provide() formData: any = { dataType: "", enterpriseId: "" };
     @Provide() zjKey: any = 0;
-  
+
     getTableData() {
       let that = this;
       that.searchData.accountNotDel=true;
-       let param = Object.assign({}, that.PAGE, that.searchData);
+      let param = Object.assign({}, that.PAGE, that.searchData);
       that.loading = true;
       METHOD.axiosPost(
-        that,
-        `/enterpriseInfo/queryEnterpriseInfo`,
-        param,
-        function(res: any) {
-          that.loading = false;
-          if (res.code == 0) {
-            that.tableData = res.data;
-          }
-        }
+              that,
+              `/dataStatistics/getDataStatistics`,
+              param,
+              function(res: any) {
+                that.loading = false;
+                if (res.code == 0) {
+                  that.tableData = res.data;
+                }
+              }
       );
     }
+    getTotal(param: any) {
+      const { columns, data } = param;
+      const sums: any[] = [];
+
+      columns.forEach((column: any, index: any) => {
+        if (index === 0) {
+          sums[index] = '合计';
+          return;
+        }
+        const values = data.map((item: { [x: string]: any; }) => Number(item[column.property]));
+        if (column.property === 'dangerNum') {
+          sums[index] = values.reduce((prev: any, curr: any) => {
+            const value = Number(curr);
+            if (!isNaN(value)) {
+              return prev + curr;
+            } else {
+              return prev;
+            }
+          }, 0);
+          sums[index];
+        } else if (column.property === 'troubleNum') {
+          sums[index] = values.reduce((prev: any, curr: any) => {
+            const value = Number(curr);
+            if (!isNaN(value)) {
+              return prev + curr;
+            } else {
+              return prev;
+            }
+          }, 0);
+          sums[index];
+        } else if (column.property === 'cameraNum') {
+          sums[index] = values.reduce((prev: any, curr: any) => {
+            const value = Number(curr);
+            if (!isNaN(value)) {
+              return prev + curr;
+            } else {
+              return prev;
+            }
+          }, 0);
+          sums[index];
+        } else {
+          sums[index] = '--';
+        }
+      });
+      return sums;
+    }
     searchFun() {
       this.PAGE = { page: 1, size: 10 };
       this.getTableData();
@@ -114,27 +159,27 @@
     setLock(row: any) {
       let that = this;
       that
-        .$confirm(`确定锁定企业 ${row.unitName} 吗?`, "提示", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-        .then(() => {
-          METHOD.axiosPost(
-            that,
-            `/enterpriseInfo/cancelEnterpriseInfoById/${row.enterpriseId}`,
-            { remarks: "" },
-            function(res: any) {
-              if (res.code == 0) {
-                (that as any).$message({
-                  type: "success",
-                  message: "注销成功!"
-                });
-                that.getTableData();
-              }
-            }
-          );
-        });
+              .$confirm(`确定锁定企业 ${row.unitName} 吗?`, "提示", {
+                confirmButtonText: "确定",
+                cancelButtonText: "取消",
+                type: "warning"
+              })
+              .then(() => {
+                METHOD.axiosPost(
+                        that,
+                        `/enterpriseInfo/cancelEnterpriseInfoById/${row.enterpriseId}`,
+                        { remarks: "" },
+                        function(res: any) {
+                          if (res.code == 0) {
+                            (that as any).$message({
+                              type: "success",
+                              message: "注销成功!"
+                            });
+                            that.getTableData();
+                          }
+                        }
+                );
+              });
     }
     /*选择城市*/
     changeFun(v: any) {
@@ -145,30 +190,30 @@
     resetPw(row: any) {
       let that = this;
       (that as any)
-        .$confirm("确定重置用户 "+ row.userName +" 的密码 为 66668888 吗?", "提示", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-        .then(() => {
-          METHOD.axiosGet(that, `/user/resetUserPwd/${row.userId}`, function(
-            res: any
-          ) {
-            if (res.code == 0) {
-              (that as any).$message({
-                type: "success",
-                message: "重置成功!"
+              .$confirm("确定重置用户 "+ row.userName +" 的密码 为 66668888 吗?", "提示", {
+                confirmButtonText: "确定",
+                cancelButtonText: "取消",
+                type: "warning"
+              })
+              .then(() => {
+                METHOD.axiosGet(that, `/user/resetUserPwd/${row.userId}`, function(
+                        res: any
+                ) {
+                  if (res.code == 0) {
+                    (that as any).$message({
+                      type: "success",
+                      message: "重置成功!"
+                    });
+                  }
+                });
               });
-            }
-          });
-        });
     }
     created() {
       this.getTableData();
     }
   }
-  </script>
-  <style lang="scss" >
+</script>
+<style lang="scss" >
   @import "@/utils/public.scss";
   @media screen and (max-width: 1350px) {
     main > div .el-table {
@@ -176,9 +221,9 @@
     }
   }
   .el-dialog__body{
-      padding: 10px 20px !important;
-      color: #606266;
-      font-size: 14px;
-      word-break: break-all;
+    padding: 10px 20px !important;
+    color: #606266;
+    font-size: 14px;
+    word-break: break-all;
   }
-  </style>
\ No newline at end of file
+</style>
\ No newline at end of file