chore:首页联调

src/api/powerdistribution/home.js

@@ -0,0 +1,19 @@
+import request from "@/utils/request";
+
+// 根据作业单位分类查询作业数量汇总
+export function getWorkNumStatistics(params) {
+  return request({
+    url: "/power/workPlan/getWorkNumStatistics",
+    method: "get",
+    params,
+  });
+}
+
+// 查询风险汇总-日
+export function getWorkRiskStatistics(params) {
+  return request({
+    url: "/power/workPlan/getWorkRiskStatistics",
+    method: "get",
+    params,
+  });
+}

src/views/distributionnetwork/secure/risk-identification/index.vue

@@ -63,7 +63,6 @@
       </el-form-item>
       <el-form-item label="风险类型" prop="exceptionType">
         <el-select
-          style="margin-right: 8px"
           v-model="queryParams.exceptionType"
           placeholder="请选择"
           clearable
@@ -77,6 +76,22 @@
           </el-option>
         </el-select>
       </el-form-item>
+      <el-form-item label="作业风险" prop="riskType">
+        <el-select
+          style="margin-right: 8px"
+          v-model="queryParams.riskType"
+          placeholder="请选择"
+          clearable
+        >
+          <el-option
+            v-for="item in riskTypeList"
+            :key="item.roleCode"
+            :label="item.roleName"
+            :value="item.roleCode"
+          >
+          </el-option>
+        </el-select>
+      </el-form-item>
       <el-form-item>
         <el-button
           type="primary"
@@ -278,6 +293,7 @@ export default {
         workPrincipNm: "",
         submitOrgNm: "",
         exceptionType: "",
+        riskType: "",
         pageNum: 1,
         pageSize: 10,
       },
@@ -293,6 +309,9 @@ export default {
     };
   },
   created() {
+    if (this.$route.query["riskType"]) {
+      this.queryParams.riskType = this.$route.query["riskType"];
+    }
     this.getWorkUnit();
     this.getRiskTypeList();
     this.getExceptionTypeList();

src/views/home/components/box1 copy/index.vue → src/views/home/components/RiskIdentification/index.vue

@@ -99,10 +99,7 @@ export default {
                 shadowColor: "rgba(0, 0, 0, 0.5)",
               },
             },
-            data: [
-              { value: 1048, name: "风险作业" },
-              { value: 735, name: "作业单位" },
-            ],
+            data: this.chartOptions.data || [],
           },
         ],
       };
@@ -111,6 +108,14 @@ export default {
       window.addEventListener("resize", () => {
         myChart.resize();
       });
+      myChart.on("click", (params) => {
+        this.$router.push({
+          path: "secure/risk-identification",
+          query: {
+            riskType: params.name == "起重作业" ? 1001 : 1002,
+          },
+        });
+      });
     },
   },
 };

src/views/home/components/box1/index.vue → src/views/home/components/TargetSituation/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="w-full h-full">
-    <div class="c-title">可靠性完成情况</div>
+    <div class="c-title">目标完成情况</div>
     <div
       ref="barChart"
       id="barChart"

src/views/home/components/map/MapDemo.vue

@@ -1,9 +0,0 @@
-<template>
-  <div id="container"></div>
-</template>
-
-<script>
-export default {};
-</script>
-
-<style></style>

src/views/home/components/map/index.vue

@@ -1,18 +1,21 @@
 <template>
   <div class="h-full">
     <div class="c-title flex justify-between">
-      <span>当日作业计划</span>
+      <span>作业计划</span>
       <el-date-picker
         size="mini"
-        v-model="year"
-        type="year"
-        placeholder="选择年"
-        style="padding-left: 40px"
+        v-model="dateRange"
+        type="daterange"
+        range-separator="至"
+        start-placeholder="开始日期"
+        end-placeholder="结束日期"
+        value-format="yyyyMMdd"
+        style="width: 240px"
+        @change="init"
       >
       </el-date-picker>
     </div>
     <div class="flex align-middle">
-      <!--el-button type="primary" style="margin-left: 4px">导出</el-button-->
       <el-button @click="back" type="text" v-if="currentMap != '衡阳市'"
         >返回></el-button
       >
@@ -46,25 +49,48 @@ const mapEnum = {
   蒸湘区: require("./蒸湘区.json"),
   珠晖区: require("./珠晖区.json"),
 };
+import { getWorkNumStatistics } from "@/api/powerdistribution/home";
+import moment from "moment";
 export default {
   name: "map",
   data() {
     return {
-      year: "2024",
-      loading: true,
-      itemData: [
-        { lable: "日计划完成情况" },
-        { lable: "周计划完成情况" },
-        { lable: "月计划完成情况" },
-        { lable: "年计划完成情况" },
+      dateRange: [
+        moment().endOf("day").format("YYYYMMDD"),
+        moment().endOf("day").format("YYYYMMDD"),
       ],
+      loading: true,
+      itemData: [{ lable: "作业数量" }],
       currentMap: "",
+      mapData: [],
     };
   },
   mounted() {
-    this.back();
+    this.init();
   },
   methods: {
+    async init() {
+      await this.getData();
+      this.back();
+    },
+    async getData() {
+      const params = {
+        startDate: this.dateRange[0],
+        endDate: this.dateRange[1],
+      };
+      this.mapData = [];
+      const data = await getWorkNumStatistics(params);
+      Object.keys(mapEnum).forEach((key) => {
+        (data || []).map((ite) => {
+          if (key.includes(ite.submitOrgNm)) {
+            this.mapData.push({
+              name: key,
+              value: ite.workNum ?? 0,
+            });
+          }
+        });
+      });
+    },
     back() {
       this.currentMap = "衡阳市";
       this.initCharts();
@@ -76,39 +102,28 @@ export default {
       var option = {
         tooltip: {
           trigger: "item",
-          // trigger: "axis",
           alwaysShowContent: true,
           formatter: function (params) {
-            return (
-              params.name +
-              "<br/>日计划完成情况" +
-              params.value +
-              "<br/>周计划完成情况" +
-              params.value +
-              "<br/>月计划完成情况" +
-              params.value +
-              "<br/>年计划完成情况" +
-              params.value
-            );
-          },
-        },
-        visualMap: {
-          show: false,
-          min: 0,
-          max: 100,
-          text: ["低", "高"],
-          left: 10,
-          y: "center",
-          calculable: true,
-          inRange: {
-            color: ["#3a92fe", "#173881"],
-          },
-          itemWidth: 10,
-          itemHeight: 100,
-          textStyle: {
-            color: "#fff",
+            return params.name + "<br/>作业数量 " + params.value;
           },
         },
+        // visualMap: {
+        //   show: false,
+        //   min: 0,
+        //   max: 100,
+        //   text: ["低", "高"],
+        //   left: 10,
+        //   y: "center",
+        //   calculable: true,
+        //   inRange: {
+        //     color: ["#3a92fe", "#173881"],
+        //   },
+        //   itemWidth: 10,
+        //   itemHeight: 100,
+        //   textStyle: {
+        //     color: "#fff",
+        //   },
+        // },
         geo: [
           // {
           //   show: true,
@@ -148,7 +163,7 @@ export default {
             label: {
               normal: {
                 show: true,
-                formatter: "{t|}\n\n{b}",
+                // formatter: "{t|}\n\n{b}",
                 textStyle: {
                   color: "#fff",
                 },
@@ -191,7 +206,7 @@ export default {
                 areaColor: "#5a6fc0", // 选中的区域颜色
               },
             },
-            data: [],
+            data: this.mapData,
           },
         ],
       };
@@ -202,7 +217,7 @@ export default {
       myChart.dispatchAction({
         type: "showTip",
         seriesIndex: 0,
-        dataIndex: 0,
+        dataIndex: 3,
       });
       myChart.on("click", (params) => {
         this.currentMap = params.name;

src/views/home/index.vue

@@ -16,20 +16,30 @@
       </el-col> -->
       <el-col :span="12" class="h-full-calc">
         <el-card class="h-40">
-          <Box2
-            v-if="chartOptions.data && chartOptions.data.length > 0"
-            :chartOptions="chartOptions"
+          <RiskIdentification
+            v-if="chartOptions1.data && chartOptions1.data.length > 0"
+            :chartOptions="chartOptions1"
             height="95%"
-          ></Box2>
-          <el-empty v-else></el-empty>
+          ></RiskIdentification>
+          <div
+            style="text-align: center; color: #fff; line-height: 200px"
+            v-else
+          >
+            暂无数据
+          </div>
         </el-card>
         <el-card class="h-60 mt-10">
-          <Box1
-            v-if="chartOptions.data && chartOptions.data.length > 0"
-            :chartOptions="chartOptions"
+          <TargetSituation
+            v-if="chartOptions2.data && chartOptions2.data.length > 0"
+            :chartOptions="chartOptions2"
             height="100%"
-          ></Box1>
-          <el-empty v-else></el-empty>
+          ></TargetSituation>
+          <div
+            style="text-align: center; color: #fff; line-height: 400px"
+            v-else
+          >
+            暂无数据
+          </div>
         </el-card>
       </el-col>
     </el-row>
@@ -38,19 +48,23 @@
 
 <script>
 import MapHy from "./components/map/index.vue";
-import Box1 from "./components/box1/index.vue";
-import Box2 from "./components/box1 copy/index.vue";
-import PointsRanking from "./components/points-ranking/index.vue";
+import TargetSituation from "./components/TargetSituation/index.vue";
+import RiskIdentification from "./components/RiskIdentification/index.vue";
+import PointsRanking from "./components/PointsRanking/index.vue";
+import { getWorkRiskStatistics } from "@/api/powerdistribution/home";
 export default {
   components: {
-    Box1,
-    Box2,
+    TargetSituation,
+    RiskIdentification,
     MapHy,
     PointsRanking,
   },
   data() {
     return {
-      chartOptions: {
+      chartOptions1: {
+        data: [],
+      },
+      chartOptions2: {
         xData: [],
         data: [],
       },
@@ -60,9 +74,14 @@ export default {
     this.init();
   },
   methods: {
-    init() {
-      this.chartOptions.data = [120, 200, 150, 80, 70, 110];
-      this.chartOptions.xData = Array(12)
+    async init() {
+      const data1 = await getWorkRiskStatistics();
+      this.chartOptions1.data = (data1 || []).map((ite) => ({
+        name: ite.riskName,
+        value: ite.riskNum,
+      }));
+      this.chartOptions2.data = [120, 200, 150, 80, 70, 110];
+      this.chartOptions2.xData = Array(12)
         .fill(0)
         .map((it, i) => `${i + 1}月`);
     },