更新

src/views/backOfficeSystem/ResearchJudgment/InformationFlows/ReportStatisticalAnalysis/index.vue

@@ -17,11 +17,11 @@
 import PageTitle from "@/components/aboutTable/PageTitle.vue";
 import QbtjCount from './qbtjCount.vue'
 import YjCount from './yjCount.vue'
-import XxhjCount from './xxhjCount.vue'
 import QygktjCount from './qygktjCount.vue'
+import XxhjCount from './xxhjCount.vue'
 import { ref } from "vue";
 const butList=ref(["情报统计分析","预警统计",'全域管控统计','信息汇聚统计'])
-const qh = ref('预警统计')
+const qh = ref('信息汇聚统计')
 
 </script>
 <style lang="scss" scoped>

src/views/backOfficeSystem/ResearchJudgment/InformationFlows/ReportStatisticalAnalysis/qygktjCount.vue

@@ -34,7 +34,7 @@
                     </div>
                 </div>
                  <div class="echratsBox" v-loading="loading">
-                     <DbarEcharts echartsId="bardepDChart" :key="ketcount" :data="obj.gbmgkList" @click="handleClick" />
+                     <DbarEcharts echartsId="bardepDChart" :rotate="25" :key="ketcount" :data="obj.gbmgkList" @click="handleClick" />
                  </div>
             </li>
         </ul>
@@ -168,6 +168,7 @@ const handle_bq = async () => {
 const handleClick = async (val) =>{
     // 当前部门是派出所 bb
     if(userInfo?.deptLevel?.startsWith('4')) return;
+    if(val.includes('派出所')) return;
     let info = obj.gbmgkList.list.find(i => i.label === val);
     let params = {...formSearch.value }
     params.ssbmdm = info.ssbmdm;

src/views/backOfficeSystem/ResearchJudgment/InformationFlows/ReportStatisticalAnalysis/xxhjCount.vue

@@ -30,10 +30,21 @@
             </li>
             <li class="cnt-item cnt-item-last">
                 <div class="common-title">
-                    <div class="title">各部门管控数量统计</div>
+                    <div class="title">标签统计</div>
                 </div>
                  <div class="echratsBox">
-                     <DbarEcharts echartsId="bardepDChart" :key="ketcount" :data="obj.bqList" />
+                    <BqyjslCount :data="obj.bqList"/>
+                 </div>
+            </li>
+            <li class="cnt-item cnt-item-last">
+                <div class="common-title">
+                    <div class="title">各部门管控数量统计</div>
+                    <div class="btn-group">
+                        <div class="btn" @click="handle_bm" v-if="activeTab">返回</div>
+                    </div>
+                </div>
+                 <div class="echratsBox" v-loading="loading">
+                     <DbarEcharts echartsId="bardepDChart" :rotate="25" :key="ketcount" @click="handleClick" :data="obj.bmList" />
                  </div>
             </li>
         </ul>
@@ -42,6 +53,7 @@
 
 <script setup>
 import { getItem } from "@/utils/storage";
+import BqyjslCount from './components/bqyjslCount.vue'
 import { qcckGet } from '@/api/qcckApi'
 import * as echarts from 'echarts'
 import HeadLayout from './components/headLayout.vue'
@@ -52,6 +64,8 @@ const searchRef = ref() //筛选组件实例
 const boxHeight = ref() //盒子高度
 const formSearch = ref({}) //查询条件
 const ketcount = ref(0)
+const activeTab = ref(true)
+const loading = ref(false)
 const obj = reactive({
     // 采用情况统计
     cyqkList: [
@@ -70,26 +84,24 @@ const obj = reactive({
         { name: '送审', value: 0 ,color: new echarts.graphic.LinearGradient(0, 0, 1, 1, [{ offset: 0, color: '#FF8DA7' },{ offset: 1, color: '#D66A8D' }])},
         { name: '转线索', value: 0 ,color: '#17C0AE'},
     ],
-    bqList: {
+    bqList: [],//标签
+    bmList: {
         list: [
-            { label:'肇事肇祸',value:100 },
+            { label:'巴宜区',value:0,ssbmdm: "540402000000" },
-            { label:'涉稳人员',value:80 },
+            { label:'工布江达县',value:0,ssbmdm: "540421000000" },
-            { label:'前科人员',value:70 },
+            { label:'米林县',value:0,ssbmdm: "540481000000" },
-            { label:'肇事肇祸',value:100 },
+            { label:'墨脱县',value:0,ssbmdm: "540423000000" },
-            { label:'涉稳人员',value:80 },
+            { label:'波密县',value:0,ssbmdm: "540424000000" },
-            { label:'前科人员',value:70 },
+            { label:'察隅县',value:0,ssbmdm: "540425000000" },
-            { label:'肇事肇祸',value:100 },
+            { label:'朗县',value:0,ssbmdm: "540426000000" },
-            { label:'涉稳人员',value:80 },
+            { label:'雅下分局',value:0,ssbmdm: "540481450000" },
-            { label:'前科人员',value:70 },
-            { label:'肇事肇祸',value:100 },
-            { label:'涉稳人员',value:80 },
-            { label:'前科人员',value:70 },
         ],
         topColor:'#17c8c3',
         colors: ["#28EEBF","#0DBAC5"],
     },//各部门管控数量统计
 })
-
+// 2开头是市、3开头是县、4开头派出所级
+const userInfo = getItem("deptId")[0];
 onMounted(()=>{
     init()
     tabHeightFn()
@@ -108,6 +120,8 @@ const init = async () => {
     await handle_cyqk(); //采用情况统计
     await handle_fz(); //分组统计
     await handle_zt(); //状态统计
+    await handle_bq(); //标签统计
+    await handle_bm(); //各部门管控数量统计
 }
 
 //采用情况统计
@@ -149,7 +163,54 @@ const handle_zt = async () => {
     }))
 }
 
+//标签
+const handle_bq = async () => {
+    let params = {...formSearch.value}
+    let res = await qcckGet(params,'/mosty-gsxt/xxcj/bqCount');
+    let list = res || [];
+    obj.bqList = list.map((item) => ({
+        label: item.bqmc,
+        value: item['count(bqmc)'] || 0,
+    }))
+}
 
+// 部门点击事件
+const handleClick = async (val) =>{
+    // 当前部门是派出所 bb
+    if(userInfo?.deptLevel?.startsWith('4')) return;
+    if(val.includes('派出所')) return;
+    let info = obj.bmList.list.find(i => i.label === val);
+    let params = {...formSearch.value }
+    params.ssbmdm = info.ssbmdm;
+    loading.value = true;
+    let res = await qcckGet(params,'/mosty-gsxt/tbGsxtZdry/bmCount');
+    activeTab.value = true;
+    loading.value = false;
+    obj.bmList.list = (res || []).map(v=>{
+        return {
+            label: v.ssbmmc,
+            value: Number(v.sl),
+            ssbmdm:v.ssbmdm
+        }
+    })
+}
+
+//各部门管控数量统计
+const handle_bm = async () => {
+    activeTab.value = false;
+    let params = {...formSearch.value}
+    params.ssbmdm = userInfo?.deptCode;
+    loading.value = true;
+    let res = await qcckGet(params,'/mosty-gsxt/xxcj/bmCount');
+    loading.value = false;
+    obj.bmList.list = (res || []).map(v=>{
+        return {
+            label: v.ssbmmc,
+            value: Number(v.sl),
+            ssbmdm:v.ssbmdm
+        }
+    })
+}
 
 // 表格高度计算
 const tabHeightFn = () => {
@@ -198,6 +259,32 @@ const tabHeightFn = () => {
                     background: linear-gradient(to right, #409EFF, #ffffff);
                 }
             }
+            .btn-group {
+                display: flex;
+                gap: 10px;
+                .btn {
+                    padding: 3px 16px;
+                    border: 1px solid #dcdfe6;
+                    border-radius: 4px;
+                    font-size: 12px;
+                    cursor: pointer;
+                    color: #606266;
+                    transition: all 0.3s;
+                    user-select: none;
+
+                    &.active {
+                        background: #409EFF;
+                        color: #fff;
+                        border-color: #409EFF;
+                    }
+                    
+                    &:hover:not(.active) {
+                        color: #409EFF;
+                        border-color: #c6e2ff;
+                        background-color: #ecf5ff;
+                    }
+                }
+            }
         }
         .echratsBox{
             height: calc(100% - 40px);
@@ -205,7 +292,7 @@ const tabHeightFn = () => {
         }
     }
     .cnt-item-last{
-        width: 100%;
+        width: 49.5%;
     }
   }
 }