大屏

src/api/kshdata.js

@@ -54,8 +54,8 @@ export const getXalbtj = params =>
 post(`${base.alyIP}/sjdp/getXyrHjdtj`, params);
 
 // 嫌疑人年龄段统计
-export const toXyrNldtj = params =>
-post(`${base.alyIP}/sjdp/toXyrNldtj`, params);
+export const toZdryNldtj = params =>
+post(`${base.alyIP}/sjdp/toZdryNldtj`, params);
 
 // 地域性高危人员统计
 export const getGwrytj = params =>
@@ -64,3 +64,7 @@ post(`${base.alyIP}/sjdp/getGwrytj`, params);
 // 抓获人员数统计
 export const getZhryCount = params =>
 post(`${base.alyIP}/sjdp/getZhryCount`, params);
+
+// 标注率
+export const getBzajzb = params =>
+post(`${base.alyIP}/sjdp/getBzajzb`, params);

src/views/index/kshData.vue

 <template>
-  <div style="height:100vh;overflow: hidden" >
+  <div style="height: 100vh; overflow: hidden">
     <div class="daping_box" id="dataVId">
       <!--头部区域-->
       <div class="daping_box_head">
         <div
-          v-if="isNum"
+          v-if="istabShow"
           style="position: absolute; left: 40px; top: 35px; color: #9fbcda"
         >
           <div>
@@ -186,7 +186,11 @@
           v-loading="maMapTongJiLoading"
           element-loading-text="拼命加载中"
         ></div>
-        <div id="ssChart" v-loading="ssLoading" element-loading-text="拼命加载中"></div>
+        <div
+          id="ssChart"
+          v-loading="ssLoading"
+          element-loading-text="拼命加载中"
+        ></div>
       </div>
       <div v-else class="daping_box_content">
         <div class="daping_box_content2_top">
@@ -220,6 +224,18 @@
                         "
                       ></div>
                     </span>
+                    <span class="pTitle"
+                      >案件总数: {{ ajtjList[0].value }}
+                      <div
+                        style="
+                          position: absolute;
+                          left: -30px;
+                          top: -8px;
+                          color: #9fbcda;
+                          z-index: 10;
+                        "
+                      ></div>
+                    </span>
                   </div>
                   <div
                     class="real_chart_wrap"
@@ -231,7 +247,7 @@
                 </div>
                 <div class="daping_box_content2_top_ajxztj">
                   <div class="chart_wrap_title">
-                    <span class="pTitle">小案别占比 </span>
+                    <span class="pTitle">{{ xatitle }}小案类别占比 </span>
                   </div>
                   <div
                     class="real_chart_wrap"
@@ -243,9 +259,9 @@
                 </div>
               </div>
             </el-tab-pane>
-            <el-tab-pane label="嫌疑人分析" name="2">
+            <el-tab-pane label="重点人员分析" name="2">
               <div class="daping_box_content2_one">
-                <div class="daping_box_content2_top_xyrfx">
+                <!-- <div class="daping_box_content2_top_xyrfx">
                   <div class="chart_wrap_title">
                     <span class="pTitle"
                       >户籍地分析
@@ -258,30 +274,28 @@
                     v-loading="hjdLoading"
                     element-loading-text="拼命加载中"
                   ></div>
-                </div>
-                <div class="daping_box_content2_top_xyrfx">
+                </div> -->
+                <div class="daping_box_content2_top_ajxztj">
                   <div class="chart_wrap_title">
-                    <span class="pTitle">年龄段和性别分布</span>
+                    <span class="pTitle">地域性高危人员 </span>
                   </div>
                   <div
                     class="real_chart_wrap"
-                    id="nldhxbfb"
+                    id="dyxgwry"
                     style="width: 880px; height: calc(100%)"
-                    v-loading="nldhxbfbLoading"
+                    v-loading="dyxgwryLoading"
                     element-loading-text="拼命加载中"
                   ></div>
                 </div>
-                <div class="daping_box_content2_top_xyrfx">
+                <div class="daping_box_content2_top_ajxztj">
                   <div class="chart_wrap_title">
-                    <span class="pTitle"
-                      >地域性高危人员
-                    </span>
+                    <span class="pTitle">年龄段和性别分布</span>
                   </div>
                   <div
                     class="real_chart_wrap"
-                    id="dyxgwry"
+                    id="nldhxbfb"
                     style="width: 880px; height: calc(100%)"
-                    v-loading="dyxgwryLoading"
+                    v-loading="nldhxbfbLoading"
                     element-loading-text="拼命加载中"
                   ></div>
                 </div>
@@ -323,9 +337,10 @@ import {
   getAjlbtj,
   getXalbtj,
   getXyrHjdtj,
-  toXyrNldtj,
+  toZdryNldtj,
   getGwrytj,
-  getZhryCount
+  getZhryCount,
+  getBzajzb,
 } from "@/api/kshdata.js";
 import axios from "axios";
 export default {
@@ -350,8 +365,8 @@ export default {
       jabnqyfpaqkLoading: true,
       jaxyrzttjLoading: true, // 积案嫌疑人状态统计
       bnfasjfxLoading: true,
-      dyxgwryLoading:true,
-      ssLoading:true,
+      dyxgwryLoading: true,
+      ssLoading: true,
       bnyrdsLoading: true,
       bndajxzfafxLoading: true, // 案件性质lodaing
       fadytjLoading: true, // 发案地域lodaing
@@ -583,9 +598,10 @@ export default {
       ],
       formDataTimeRange: [],
       clickCity: "",
-      mapCenter:[109.844902, 19.0392],
-      mapZoom:1.5,
-      ajlbdmTj:'05000200'
+      mapCenter: [109.844902, 19.0392],
+      mapZoom: 1.5,
+      ajlbdmTj: "05000200",
+      xatitle: "盗窃案",
     };
   },
   created() {
@@ -654,7 +670,7 @@ export default {
         this.areaDistributionInit();
       } else if (val == "2") {
         this.fzxyrnldjxbhfswtjInit();
-        this.hjdInit()
+        // this.hjdInit()
         this.gwryInit();
       }
     },
@@ -664,12 +680,12 @@ export default {
      * 返回地图上一级
      */
     backToUper() {
-      var self = this
+      var self = this;
       if (this.chartsList["maMapTongJiChart"]) {
         self.queryNum = "460000";
-        self.mapCenter = [109.844902, 19.0392]
-        self.mapZoom = 1.5
-        self.$set(self.formData,'unitcode',``)
+        self.mapCenter = [109.844902, 19.0392];
+        self.mapZoom = 1.5;
+        self.$set(self.formData, "unitcode", ``);
         this.reload();
       }
     },
@@ -682,7 +698,7 @@ export default {
     },
     // 切换
     toTab(val) {
-      debugger
+      debugger;
       let self = this;
       if (val == "1") {
         self.istabShow = false;
@@ -725,7 +741,7 @@ export default {
         this.getZtry(); //积案破案
         this.getAjbz(); //案件标注
         this.getAjxz(); // 为破数
-        this.ssLoading = true
+        this.ssLoading = true;
         setTimeout(() => {
           self.renderSs();
         }, 2000);
@@ -735,21 +751,21 @@ export default {
      * 年度案件统计（数据透视）
      */
     toTs(statisticItem, tabRadio) {
-      let routeData;
-      if (statisticItem.value != 0) {
-        //debugger;
-        routeData = this.$router.resolve({
-          path: "/bndfas",
-          query: {
-            id: statisticItem.id,
-            tabRadio: tabRadio,
-            larqJssj: this.formData.larqJssj,
-            larqQssj: this.formData.larqQssj,
-            unitcode: this.formData.unitcode,
-          },
-        });
-        window.open(routeData.href, "_blank");
-      }
+      // let routeData;
+      // if (statisticItem.value != 0) {
+      //   //debugger;
+      //   routeData = this.$router.resolve({
+      //     path: "/bndfas",
+      //     query: {
+      //       id: statisticItem.id,
+      //       tabRadio: tabRadio,
+      //       larqJssj: this.formData.larqJssj,
+      //       larqQssj: this.formData.larqQssj,
+      //       unitcode: this.formData.unitcode,
+      //     },
+      //   });
+      //   window.open(routeData.href, "_blank");
+      // }
     },
     /**
      * 统计信息上图
@@ -760,7 +776,7 @@ export default {
       getDpfatj({
         larqQssj: self.formData.larqQssj,
         larqJssj: self.formData.larqJssj,
-        unitcode:self.formData.unitcode
+        unitcode: self.formData.unitcode,
       }).then((res) => {
         if (res.code == 200) {
           var dataList = res.data.result;
@@ -960,17 +976,21 @@ export default {
       });
       myChart.off("click");
       myChart.on("click", function (params) {
-        debugger
+        debugger;
         if (self.cityCodes[params.name]) {
           self.queryNum = self.cityCodes[params.name];
-          self.mapCenter = null
-          self.$set(self.formData,'unitcode',`${self.cityCodes[params.name]}000000`)
+          self.mapCenter = null;
+          self.$set(
+            self.formData,
+            "unitcode",
+            `${self.cityCodes[params.name]}000000`
+          );
           axios.get(`map/${self.queryNum}.json`).then((res) => {
             debugger;
             self.$echarts.registerMap(self.queryNum, res);
             option.series[0].map = self.queryNum;
             option.geo.map = self.queryNum;
-            self.mapZoom = 1
+            self.mapZoom = 1;
             myChart.setOption(option);
             self.getNum(); //发案数
             self.bnqyfpaqkInit(); // 区域发、破案情况
@@ -981,6 +1001,7 @@ export default {
             self.getZdry(); //重点人员
             self.getHyyh(); //活跃用户
             self.getJrczcs(); //活跃用户
+            self.getZhrys(); //在逃人员数
             self.maMapTongJi(); //地图上图统计
           });
           myChart.resize({
@@ -1058,7 +1079,7 @@ export default {
         });
       });
       // 绘制图表
-      this.ssLoading = false
+      this.ssLoading = false;
       myChart.resize({
         width: $("#ssChart").width(),
         height: $("#ssChart").height(),
@@ -1075,7 +1096,7 @@ export default {
       getFaCount({
         larqQssj: self.formData.larqQssj,
         larqJssj: self.formData.larqJssj,
-        unitcode:self.formData.unitcode
+        unitcode: self.formData.unitcode,
       }).then((res) => {
         if (res.code == 200) {
           self.ajtjList.forEach((item) => {
@@ -1102,7 +1123,7 @@ export default {
       getZhryCount({
         larqQssj: self.formData.larqQssj,
         larqJssj: self.formData.larqJssj,
-        unitcode:self.formData.unitcode
+        unitcode: self.formData.unitcode,
       }).then((res) => {
         if (res.code == 200) {
           self.ajtjList.forEach((item) => {
@@ -1130,7 +1151,7 @@ export default {
       getPaCount({
         larqQssj: self.formData.larqQssj,
         larqJssj: self.formData.larqJssj,
-        unitcode:self.formData.unitcode
+        unitcode: self.formData.unitcode,
       }).then((res) => {
         if (res.code == 200) {
           self.ajtjList.forEach((item) => {
@@ -1160,7 +1181,7 @@ export default {
       getJrxzajCount({
         larqQssj: self.formData.larqQssj,
         larqJssj: self.formData.larqJssj,
-        unitcode:self.formData.unitcode
+        unitcode: self.formData.unitcode,
       }).then((res) => {
         if (res.code == 200) {
           self.ajtjList.forEach((item) => {
@@ -1191,7 +1212,7 @@ export default {
       getZtryCount({
         larqQssj: self.formData.larqQssj,
         larqJssj: self.formData.larqJssj,
-        unitcode:self.formData.unitcode
+        unitcode: self.formData.unitcode,
       }).then((res) => {
         if (res.code == 200) {
           self.ajRightList.forEach((item) => {
@@ -1221,7 +1242,7 @@ export default {
       getAjbzCount({
         larqQssj: self.formData.larqQssj,
         larqJssj: self.formData.larqJssj,
-        unitcode:self.formData.unitcode
+        unitcode: self.formData.unitcode,
       }).then((res) => {
         if (res.code == 200) {
           self.ajtjList.forEach((item) => {
@@ -1250,7 +1271,7 @@ export default {
       getZdgzryCount({
         larqQssj: self.formData.larqQssj,
         larqJssj: self.formData.larqJssj,
-        unitcode:self.formData.unitcode
+        unitcode: self.formData.unitcode,
       }).then((res) => {
         if (res.code == 200) {
           self.ajRightList.forEach((item) => {
@@ -1280,7 +1301,7 @@ export default {
       getHyyhCount({
         larqQssj: self.formData.larqQssj,
         larqJssj: self.formData.larqJssj,
-        unitcode:self.formData.unitcode
+        unitcode: self.formData.unitcode,
       }).then((res) => {
         if (res.code == 200) {
           self.ajRightList.forEach((item) => {
@@ -1310,7 +1331,7 @@ export default {
       getJrdlCount({
         larqQssj: self.formData.larqQssj,
         larqJssj: self.formData.larqJssj,
-        unitcode:self.formData.unitcode
+        unitcode: self.formData.unitcode,
       }).then((res) => {
         if (res.code == 200) {
           self.ajRightList.forEach((item) => {
@@ -1369,9 +1390,9 @@ export default {
       getDpfatj({
         larqQssj: self.formData.larqQssj,
         larqJssj: self.formData.larqJssj,
-         unitcode:self.formData.unitcode
+        unitcode: self.formData.unitcode,
       }).then((res) => {
-        debugger
+        debugger;
         if (res.code == 200) {
           let resData = res.data.result;
           let arr = [],
@@ -1761,7 +1782,9 @@ export default {
         if (res.code == 200) {
           let resData = res.data.result;
           let yData = [];
+          let qtarr = [];
           resData.forEach((item) => {
+            if (item.ajlbdm != "999") {
               if (
                 item.count != "0" &&
                 item.count != "" &&
@@ -1775,8 +1798,15 @@ export default {
                   value: item.count,
                 });
               }
+            } else {
+              qtarr = item;
+            }
+          });
+          yData.push({
+            code: qtarr.ajlbdm,
+            name: qtarr.ajlbdmStr,
+            value: qtarr.count,
           });
-          debugger;
           self.bndajxzfafx(yData);
         } else {
           self.$message({
@@ -1791,6 +1821,7 @@ export default {
      * 度案件性质发案渲染
      */
     bndajxzfafx(y) {
+      this.xatitle = "盗窃案";
       // 基于准备好的dom，初始化echarts实例
       let myChart = this.$echarts.init(document.getElementById("ajxztj"));
       // 绘制图表
@@ -1883,9 +1914,10 @@ export default {
       let self = this;
       myChart.off("click");
       myChart.on("click", function (params) {
-        self.ajlbdmTj = params.data.code
-        self.areaDistributionInit()
-        window.open(routeData.href, "_blank");
+        self.fadytjLoading = true;
+        self.xatitle = params.data.name;
+        self.ajlbdmTj = params.data.code;
+        self.areaDistributionInit();
       });
       // this.chartsList['ajxztj'] = myChart
       this.bndajxzfafxLoading = false;
@@ -1895,11 +1927,11 @@ export default {
      */
     areaDistributionInit() {
       let self = this;
-      this.fadytjLoading = true;
+      self.fadytjLoading = true;
       getXalbtj({
         larqQssj: self.formData.larqQssj,
         larqJssj: self.formData.larqJssj,
-        ajlbdm: self.ajlbdmTj
+        ajlbdm: self.ajlbdmTj,
       }).then((res) => {
         if (res.code == 200) {
           let resData = res.data.result;
@@ -1925,7 +1957,7 @@ export default {
             type: "error",
             message: res.message,
           });
-          this.fadytjLoading = false;
+          self.fadytjLoading = false;
         }
       });
     },
@@ -2039,16 +2071,13 @@ export default {
       //   window.open(routeData.href, "_blank");
       // });
       // this.chartsList['ajxztj'] = myChart
-      this.bndajxzfafxLoading = false;
+      this.fadytjLoading = false;
     },
     /* 嫌疑人start*/
     fzxyrnldjxbhfswtjInit() {
       let self = this;
       this.nldhxbfbLoading = true;
-      toXyrNldtj({
-        larqQssj: self.formData.larqQssj,
-        larqJssj: self.formData.larqJssj,
-      }).then((res) => {
+      toZdryNldtj({}).then((res) => {
         if (res.code == 200) {
           let resData = res.data.data;
           let mCount = res.data.mCount;
@@ -2066,7 +2095,7 @@ export default {
             y3.push({ value: item.ONUM, code: item.NLD });
             y5.push({ value: item.TNUM, code: item.NLD });
           });
-            debugger
+          debugger;
           self.fzxyrnldjxbhfswtj(x, y1, y2, y3, y5, mCount, wCount, oCount);
         } else {
           self.$message({
@@ -2278,10 +2307,7 @@ export default {
     hjdInit() {
       let self = this;
       this.facstjLoading = true;
-      getXyrHjdtj({
-        larqQssj: self.formData.larqQssj,
-        larqJssj: self.formData.larqJssj,
-      }).then((res) => {
+      getXyrHjdtj({}).then((res) => {
         if (res.code == 200) {
           let resData = res.data.result;
           let x = [];
@@ -2443,10 +2469,7 @@ export default {
     gwryInit() {
       let self = this;
       this.facstjLoading = true;
-      getGwrytj({
-        larqQssj: self.formData.larqQssj,
-        larqJssj: self.formData.larqJssj,
-      }).then((res) => {
+      getGwrytj({}).then((res) => {
         if (res.code == 200) {
           let resData = res.data.result;
           let x = [];
@@ -2590,7 +2613,6 @@ export default {
                     ["#816EFF", "#413780"],
                     ["#29D1FF", "#156980"],
                     ["#969EB8", "#4B4F5C"],
-                    
                   ];
                   let index = params.dataIndex;
                   return new self.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -3156,8 +3178,9 @@ export default {
           .chart_wrap_title {
             color: #dadfeb;
             font-size: 22px;
-            padding-left: 20px;
-            padding-top: 10px;
+            padding: 10px 20px 0 20px;
+            display: flex;
+            justify-content: space-between;
 
             .pTitle {
               position: relative;