feat:火灾预测

app/src/api/index.js

@@ -246,3 +246,11 @@ export function getDtskgzList(params) {
     params
   })
 }
+// 或者预测防火重点
+export function getFhzdType(params) {
+  return request({
+    url: 'system/map/hzyc',
+    method: 'GET',
+    params
+  })
+}

app/src/views/Home/components/FireIndex/index.vue

@@ -228,6 +228,7 @@ export default {
         const month = temp.sxzbMonth.splice(temp.sxzbMonth.length - 12, 12)
         this.monthLabel = month.map(item => item.y)
         this.yearLabel = year.map(item => item.n)
+        // console.log('009988--------',month);
         this.monthData = [
           month.map((item,index) =>  month.length - 1 === index ? ({ name: item.qhyy, value: item.hzqs, itemStyle: {
             color: "#cccccc89",

app/src/views/Home/components/RiskWarning.vue

@@ -92,43 +92,64 @@
       <div
         style="display: flex; flex-wrap: wrap; justify-content: space-around"
       >
-        <div class="card" >
+        <div class="card">
           <div class="left-card">
             <div class="card-item">重大风险</div>
           </div>
-          <div class="right-card" @click="showStice('重大风险')">{{ showValue("重大风险") }}</div>
+          <div class="right-card" @click="showStice('重大风险')">
+            {{ showValue("重大风险") }}
+          </div>
         </div>
         <div class="card">
           <div class="left-card" style="background: #ff833d">
             <div class="card-item">较大风险</div>
           </div>
-          <div class="right-card" @click="showStice('较大风险')">{{ showValue("较大风险") }}</div>
+          <div class="right-card" @click="showStice('较大风险')">
+            {{ showValue("较大风险") }}
+          </div>
         </div>
         <div class="card">
           <div class="left-card" style="background: #fbff3d">
             <div class="card-item">一般风险</div>
           </div>
-          <div class="right-card" @click="showStice('一般风险')">{{ showValue("一般风险") }}</div>
+          <div class="right-card" @click="showStice('一般风险')">
+            {{ showValue("一般风险") }}
+          </div>
         </div>
         <div class="card">
           <div class="left-card" style="background: #35c2ff">
             <div class="card-item">低风险</div>
           </div>
-          <div class="right-card" @click="showStice('低风险（蓝色）')">{{ showValue("低风险") }}</div>
+          <div class="right-card" @click="showStice('低风险（蓝色）')">
+            {{ showValue("低风险") }}
+          </div>
         </div>
       </div>
     </div>
     <!-- 预测 -->
-    <div style="width: 434px; height: 340px; margin-left: 2px; text-align: right;" v-show="idx==2">
-      <span >单位：起</span>
-      <div ref="chart" style="width: 434px; height: 150px" />
-      <div style="display: flex; align-items: center; font-size: 16px; margin-left: 5px;">
-      <div class="time-on">近期防火重点预测</div>
-      <div>用电用气</div>
-    </div>
+    <div
+      style="width: 434px; height: 340px; margin-left: 2px; text-align: right"
+      v-show="idx == 2"
+    >
+      <span>单位：起</span>
+      <div ref="chart" style="width: 424px; height: 150px" />
+      <div
+        style="
+          display: flex;
+          align-items: center;
+          font-size: 16px;
+          margin-left: 5px;
+        "
+      >
+        <div class="time-on">近期防火重点预测</div>
+        <div class="qhyy">
+          <span style="margin-left: 5px;" v-for="(item,index) in typeList" :key="index">{{ item.qhyy }}</span>
+          <!-- <span style="margin-left: 2px; margin-right: -6px;">、</span> -->
+          <!-- <span>{{ typeList[1].qhyy }}</span> -->
+        </div>
+      </div>
     </div>
     <!-- 近期防火重点预测 -->
-   
   </div>
 </template>
 
@@ -140,6 +161,7 @@ export default {
     riskList: Array,
     qy: String,
     monthData: Array,
+    typeList: Array,
   },
   data() {
     return {
@@ -158,7 +180,6 @@ export default {
   watch: {
     monthData: {
       handler(val) {
-        // console.log("-----------3333", val);
         this.chart = null;
         if (val.length > 0) {
           this.$nextTick(() => {
@@ -184,11 +205,11 @@ export default {
       const option = {
         backgroundColor: "#11183c",
         grid: {
-          left: "1%",
-          right: "3%",
+          left: "10%",
+          right: "1%",
           top: "10%",
           bottom: "15%",
-          containLabel: true,
+          // containLabel: true,
         },
         tooltip: {
           show: true,
@@ -198,7 +219,7 @@ export default {
           extraCssText: "z-index: 1000;",
           backgroundColor: "#02809a",
           borderColor: "rgba(0,213,255, .6)",
-          formatter: '{b}: {c}',
+          formatter: "{b}: {c}",
           textStyle: {
             color: "#fff",
           },
@@ -222,6 +243,7 @@ export default {
             axisLabel: {
               color: fontColor,
               interval: 1,
+              // showMaxLabel: true
             },
             axisLine: {
               show: true,
@@ -238,8 +260,10 @@ export default {
                 color: "#195384",
               },
             },
+            // data:[srcData[0].y,srcData[3].y,srcData[6].y,srcData[11].y]
             data: srcData.map((item) => {
               // return `${item.y.substring(5,7)}月`;
+
               return item.y;
             }),
           },
@@ -298,14 +322,39 @@ export default {
             // data: srcData.slice(0, -1).map((item) => {
             //   return item.hzqs;
             // }),
-            data:[srcData[0].hzqs,srcData[1].hzqs,srcData[2].hzqs,srcData[3].hzqs,srcData[4].hzqs,srcData[5].hzqs,srcData[6].hzqs,srcData[7].hzqs,srcData[8].hzqs,srcData[9].hzqs,srcData[10].hzqs]
+            data: [
+              srcData[0].hzqs,
+              srcData[1].hzqs,
+              srcData[2].hzqs,
+              srcData[3].hzqs,
+              srcData[4].hzqs,
+              srcData[5].hzqs,
+              srcData[6].hzqs,
+              srcData[7].hzqs,
+              srcData[8].hzqs,
+              srcData[9].hzqs,
+              srcData[10].hzqs,
+            ],
           },
           {
             type: "line",
             // data: srcData.map((item) => {
             //   return item.hzqs;
             // }),
-            data:[null,null,null,null,null,null,null,null,null,null,srcData[10].hzqs,srcData[11].hzqs],
+            data: [
+              null,
+              null,
+              null,
+              null,
+              null,
+              null,
+              null,
+              null,
+              null,
+              null,
+              srcData[10].hzqs,
+              srcData[11].hzqs,
+            ],
             lineStyle: {
               normal: {
                 type: "dotted",
@@ -372,6 +421,7 @@ export default {
   width: 120px;
   height: 27px;
   margin: 9px 12px;
+  color: rgb(93, 169, 231);
   // background: #ccc;
   // transform: perspective(0.5em) rotateX(5deg);
   font-size: 16px;
@@ -379,12 +429,12 @@ export default {
   line-height: 27px;
   // color: black;
   border-radius: 5px;
-    box-sizing: border-box;
-    background: linear-gradient(360deg, #0094ff90 0%, #0094ff10 100%);
+  box-sizing: border-box;
+  background: linear-gradient(360deg, #0094ff90 0%, #0094ff10 100%);
 }
 .active {
   // background: rgb(93, 169, 231);
-  color: rgb(93, 169, 231);
+  color: #fff;
 }
 .card {
   width: 200px;
@@ -416,13 +466,24 @@ export default {
     text-align: center;
   }
 }
-.time-on{
+.time-on {
   width: 120px;
   height: 40px;
-  border: 1px solid rgb(93, 169, 231);
+  border: 1px solid rgb(10, 98, 171);
+  background: rgb(23, 114, 225);
   font-size: 14px;
   line-height: 40px;
   text-align: center;
   margin-right: 5px;
 }
+.qhyy{
+    width: 290px;
+    height: 40px;
+    line-height: 40px;
+    font-size: 16px;
+    text-align: left;
+    padding: 0 10px;
+    background: #fff;
+    color: #000;
+  }
 </style>

app/src/views/Home/index.vue

@@ -75,6 +75,7 @@
           @showFxyj="showFxyj"
           :qy="qy"
           :monthData="monthData"
+          :typeList="typeList"
         />
         <template #ext-header>
           <img
@@ -133,7 +134,7 @@ import FireIndex from "./components/FireIndex/index.vue";
 import BasicInfoModalContent from "./components/BasicInfoModalContent.vue";
 import SearchBox from "@/components/SearchBox.vue";
 import zzglModul from "./components/zzglModul.vue";
-import { getSxzbListToatl } from "@/api/index.js";
+import { getSxzbListToatl,getFhzdType } from "@/api/index.js";
 import {
   totaldata,
   getJqdt,
@@ -193,6 +194,7 @@ export default {
         wbxs: "", //维保形式
         dxjj: "", //大修基金
       },
+      typeList:[]
     };
   },
   watch: {
@@ -200,6 +202,7 @@ export default {
       this.getList();
       this.getFireList();
       this.getIotList();
+      this.zdType()
     },
   },
   methods: {
@@ -360,8 +363,13 @@ export default {
         this.iotList = res.data.rows[0];
       });
     },
-
-    openAutoManageModal() {
+    //重点类型
+    zdType(){
+      getFhzdType( { ...this.params, qx: this.qy === "重庆市" ? "" : this.qy }).then(res=>{
+       this.typeList=res.data
+      })
+    },
+      openAutoManageModal() {
       this.showModal("autoManageModal");
     },
     loadMapData() {
@@ -439,6 +447,7 @@ export default {
     this.getIotList();
     this.loadMapData();
     this.loadHzzbSxzbYoy();
+    this.zdType()
   },
   mounted() {
     this.timer = setInterval(() => {

app/src/views/PoliceSituation/components/Alarm.vue

@@ -21,7 +21,7 @@
 				<span class="result2">报警时间</span>
 			</div>
 			<!-- <VueSeamlessScroll :data="list" :class-option="classOption" class="warp" hoverStop> -->
-			<div class="" style="height: 190px;overflow: auto;">
+			<div class="" style="height: 190px;overflow: auto; cursor: pointer;">
 				<ul class="item">
 					<div v-for="(item, index) in czztList" :key="index">
 						<li class="row" @click="tab(item.id)" :class="item.id === id ? 'selected' : ''">

app/src/views/PoliceSituation/index.vue

@@ -43,7 +43,7 @@
         <img
           v-if="Mapflag == true"
           class="map-null"
-          src="../../assets/images/jqdt-null.png"
+          src="../../assets/images/map-null1.png"
           alt=""
         />
       </div>