首页大屏前端1.5

src/api/data/supervisionNotify.ts

@@ -1,21 +1,17 @@
 import request from "@/api/request";
-export function importCaseVerif(body) {
-    return request.post({
-        url: '/data/caseVerif/import',
-        body
-    });
-}
 
-export function listCaseVerif(query) {
+
+
+export function getAllSupervisionNotifyCount(times) {
     return request.get({
-        url: '/data/caseVerif',
+        url: `/datav/supervisonNotify?beginTime=${times[0]}&endTime=${times[1]}`
-        query
     });
 }
 
 
-export function getAllSupervisionNotifyCount(times) {
+
+export function getChangedRank(times, groupType) {
     return request.get({
-        url: `/datav/supervisonNotify?beginTime=${times[0]}&endTime=${times[1]}`
+        url: `/datav/supervisonNotify/rank?beginTime=${times[0]}&endTime=${times[1]}&groupType=${groupType}`
     });
 }

src/components/datav/chart-bar-pro.vue

@@ -92,6 +92,7 @@ function getMax() {
 
 onMounted  ( () => {
    getMax();
+
 });
 
 function getColor(val) {
@@ -118,12 +119,15 @@ function getColor(val) {
 .bar-title {
   font-size: 19px;
 }
+
 .bar-sub-title {
   color: #597ae9;
   font-size: 14px;
 }
+
 .bar-item {
   font-size: 17px;
+
   &[size="large"] {
     .bar-item_content {
       .bar-item_content-bar {
@@ -131,9 +135,11 @@ function getColor(val) {
       }
     }
   }
+
   &[size="small"] {
     font-size: 12px;
   }
+
   .bar-item-label {
     text-align: right;
     width: var(--label-width);
@@ -141,25 +147,32 @@ function getColor(val) {
     white-space: nowrap;
     text-overflow: ellipsis;
   }
+
   &[position="left"] {
     height: 32px;
     line-height: 32px;
   }
+
   &[position="top"] {
     margin-bottom: 4px;
+
     .bar-item-label {
       width: 100%;
       text-align: left;
     }
+
     .bar-item_content {
       width: calc(100% - 80px);
     }
   }
+
   .bar-item_content {
     width: calc(100% - var(--label-width) - 16px - 30px);
+
     &[long=false] {
       width: calc(100% - var(--label-width) - 36px - 58px);
     }
+
     .bar-item_content-bar {
       width: 0;
       height: 9px;
@@ -167,8 +180,10 @@ function getColor(val) {
       transition: width 0.3s;
     }
   }
+
   .bar-item_remark {
     font-size: 14px;
+
     .text-success {
       color: #09c700;
     }
@@ -176,5 +191,4 @@ function getColor(val) {
 }
 
 
-
 </style>

src/views/datav/SceneInsp.vue

@@ -4,13 +4,14 @@
       <datav-header/>
       <main>
         <el-row :gutter="16">
+
           <el-col :span="6">
             <datav-card title="日常督察情况">
               <el-row class="mb-32">
                 <el-col :span="6">
                   <div class="descriptions_cell text-center">
                     <div class="descriptions_content">
-                      56
+                      {{rankOverview.proTotal}}
                     </div>
                     <div class="descriptions_label">
                       问题数
@@ -20,7 +21,7 @@
                 <el-col :span="6">
                   <div class="descriptions_cell text-center">
                     <div class="descriptions_content">
-                      0
+                      {{rankOverview.changing}}
                     </div>
                     <div class="descriptions_label">
                       整改中
@@ -30,7 +31,7 @@
                 <el-col :span="6">
                   <div class="descriptions_cell text-center">
                     <div class="descriptions_content">
-                      56
+                      {{ rankOverview.changed }}
                     </div>
                     <div class="descriptions_label">
                       已整改
@@ -40,7 +41,7 @@
                 <el-col :span="6">
                   <div class="descriptions_cell text-center">
                     <div class="descriptions_content">
-                      100%
+                      {{ rankOverview.correctionRate }}%
                     </div>
                     <div class="descriptions_label">
                       整改率
@@ -53,18 +54,17 @@
                   type="bottom-button"
                   v-model="activeTabLeft"
               >
-                <datav-tab-item label="分县市局" name="1">
+                <datav-tab-item label="分县市局" name="3">
                   <el-scrollbar height="350px">
                     <datav-chart-bar
                         :data="data1"
-                        size="large"
                         :color="colors"
                         title="整改率排名"
-                        sub-title="完成数/问题数"
+                        sub-title="已整改/问题数"
                     />
                   </el-scrollbar>
                 </datav-tab-item>
-                <datav-tab-item label="局属单位" name="2">
+                <datav-tab-item label="局属单位" name="4">
                   <el-scrollbar height="350px">
                     <datav-chart-bar
                         :data="jsdwBarList"
@@ -79,6 +79,7 @@
               </datav-tabs>
 
             </datav-card>
+
             <datav-card title="问题类型占比">
               <v-charts
                   style="height: 300px"
@@ -87,6 +88,7 @@
               />
             </datav-card>
           </el-col>
+
           <el-col :span="12">
             <datav-date-picker v-model="time"/>
             <div class="flex gap-42">
@@ -135,10 +137,10 @@
               />
             </datav-card>
           </el-col>
+
           <el-col :span="6">
             <datav-card>
-              <datav-tabs v-model="activeTabRight" size="small">
+<!--              <datav-tabs v-model="activeTabRight" size="small">
-
                 <datav-tab-item label="枪支管理" name="1">
                   <datav-tabs
                       v-model="activeMailTabRight"
@@ -305,7 +307,7 @@
                     </datav-tab-item>
                   </datav-tabs>
                 </datav-tab-item>
-              </datav-tabs>
+              </datav-tabs>-->
 
               <!--              <datav-chart-bar
                                 title="问题数排名"
@@ -350,17 +352,19 @@
               </el-scrollbar>
             </datav-card>
           </el-col>
+
         </el-row>
       </main>
     </div>
   </el-scrollbar>
 </template>
+
 <script setup>
 import vCharts from "vue-echarts";
 import changshaMap from "@/assets/data/changsha.json";
 import * as echarts from "echarts/core";
 import moment from "moment";
-import {getAllSupervisionNotifyCount} from "@/api/data/supervisionNotify.ts";
+import {getAllSupervisionNotifyCount, getChangedRank} from "@/api/data/supervisionNotify.ts";
 
 echarts.registerMap("changsha", changshaMap);
 const option = {
@@ -488,42 +492,42 @@ const data1 = ref([
   },
   {
     label: "芙蓉分局",
-    value: 100,
+    value: 80,
     unit: "%",
     numerator: 11,
     denominator: 11,
   },
   {
     label: "岳麓分局",
-    value: 100,
+    value: 80,
     unit: "%",
     numerator: 10,
     denominator: 10,
   },
   {
     label: "雨花分局",
-    value: 100,
+    value: 80,
     unit: "%",
     numerator: 9,
     denominator: 9,
   },
   {
     label: "望城分局",
-    value: 100,
+    value: 80,
     unit: "%",
     numerator: 4,
     denominator: 4,
   },
   {
     label: "浏阳市局",
-    value: 100,
+    value: 80,
     unit: "%",
     numerator: 3,
     denominator: 3,
   },
   {
     label: "长沙县局",
-    value: 100,
+    value: 80,
     unit: "%",
     numerator: 3,
     denominator: 3,
@@ -586,7 +590,7 @@ const option2 = {
 
 
 // region  初始化数据
-const activeTabLeft = ref("1");
+const activeTabLeft = ref("3");
 const overview = ref({
   supervisionNotifyTotal: 0,
   supervisionNotifyOrgTotal: 0,
@@ -595,6 +599,13 @@ const overview = ref({
   supervisionNotifyChangedTotal: 0,
   correctionRate: 0,
 });
+const rankOverview = ref({
+  proTotal: 0,
+  changing: 0,
+  changed: 0,
+  correctionRate: 0,
+});
+
 
 const time = ref([
   moment().startOf("year").format("YYYY-MM-DD"),
@@ -605,11 +616,23 @@ function getData() {
   getAllSupervisionNotifyCount(time.value).then((res) => {
     overview.value = res.overview;
   });
+  getChangedRank(time.value, 3).then((res) => {
+    rankOverview.value = res.rankOverview;
+  });
 }
 
 watch(time, () => {
   getData();
 });
+watch(activeTabLeft, () => {
+  alert(activeTabLeft.value)
+  getChangedRank(time.value, activeTabLeft.value).then((res) => {
+    rankOverview.value = res.rankOverview;
+  });
+});
+
+
+
 onMounted(() => {
   getData();
 });
@@ -632,6 +655,7 @@ const colors = [
 
 
 </script>
+
 <style lang="scss" scoped>
 @import "@/style/datav.scss";