更新

src/views/backOfficeSystem/ResearchJudgment/InformationFlows/ReportStatisticalAnalysis/components/headLayout.vue

@@ -10,7 +10,16 @@
                         <el-radio v-for="(it,idx) in timeList" :key="idx" :label="it.num" >{{ it.label }}</el-radio>
                     </el-radio-group>
                     <span class="ml5 mr5">自定义：</span>
-                    <el-date-picker @change="handleDateChange" v-model="formSearch.dateRange" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
+                    <el-date-picker 
+                      @change="handleDateChange" 
+                      v-model="formSearch.dateRange" 
+                      :unlink-panels="true"
+                      type="daterange" 
+                      range-separator="至" 
+                      start-placeholder="开始日期" 
+                      end-placeholder="结束日期" 
+                      format="YYYY-MM-DD" 
+                      value-format="YYYY-MM-DD" />
                 </div>
             </el-form-item>
             <el-form-item>

src/views/backOfficeSystem/ResearchJudgment/InformationFlows/ReportStatisticalAnalysis/components/statusCount.vue

@@ -31,13 +31,12 @@ const props = defineProps({
 })
 const legendList = ref([])
 watch(() => props.data, (newVal) => {
-    console.log(newVal,'-------------监听');
     if (newVal.length) {
         const total = newVal.reduce((s, v) => s + v.value, 0);
         legendList.value = newVal.map((d, i) => ({
             name: d.name,
-            value: 20,
+            value: d.value,
-            percent: Math.round((d.value / total )* 100),
+            percent: total > 0 ? Math.round((d.value / total )* 100) : 0,
             dotColor:   i === 0 ? 'linear-gradient(90deg, #FF8DA7 0%, #D66A8D 100%)': d.color
         }))
         nextTick(() => {

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

@@ -21,7 +21,7 @@ import XxhjCount from './xxhjCount.vue'
 import QygktjCount from './qygktjCount.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

@@ -14,10 +14,10 @@
             </li>
             <li class="cnt-item">
                 <div class="common-title">
-                    <div class="title">管控状态统计</div>
+                    <div class="title">重点人等级</div>
                 </div>
                 <div class="echratsBox">
-                    <StatusCount :data="obj.gkztList" id="gkztCount" />
+                    <StatusCount :data="obj.zdrdjList" id="gkztCount" />
                 </div>
             </li>
             <li class="cnt-item">
@@ -29,9 +29,12 @@
             <li class="cnt-item">
                 <div class="common-title">
                     <div class="title">各部门管控数量统计</div>
+                    <div class="btn-group">
+                        <div class="btn"  @click="handle_gbmgk" v-if="activeTab">返回</div>
+                    </div>
                 </div>
-                 <div class="echratsBox">
+                 <div class="echratsBox" v-loading="loading">
-                     <DbarEcharts echartsId="bardepDChart" :key="ketcount" :data="obj.gbmgkList" />
+                     <DbarEcharts echartsId="bardepDChart" :key="ketcount" :data="obj.gbmgkList" @click="handleClick" />
                  </div>
             </li>
         </ul>
@@ -39,6 +42,8 @@
 </template>
 
 <script setup>
+import { getItem } from "@/utils/storage";
+import { qcckGet } from '@/api/qcckApi'
 import * as echarts from 'echarts'
 import HeadLayout from './components/headLayout.vue'
 import BqyjslCount from './components/bqyjslCount.vue'
@@ -48,59 +53,152 @@ import { onMounted, reactive, ref } from "vue";
 const searchRef = ref() //筛选组件实例
 const boxHeight = ref() //盒子高度
 const formSearch = ref({}) //查询条件
+const activeTab = ref(false)
+const loading = ref(false)
 const ketcount = ref(0)
 const obj = reactive({
-    gkztList: [
-        { name: '失控', value: 85 ,color: new echarts.graphic.LinearGradient(0, 0, 1, 1, [{ offset: 0, color: '#FF8DA7' },{ offset: 1, color: '#D66A8D' }])},
-        { name: '在控', value: 55 ,color: '#17C0AE'},
-    ],//管控状态统计
-    bqgkslList: [
-        { label: '涉兼爆炸等恐怖袭击人员', value: 100 },
-        { label: '全国涉稳重点人', value: 80 },
-        { label: '国保涉稳人员', value: 70 },
-        { label: '涉政涉恐涉稳重点人员', value: 60 },
-        { label: '区涉稳人员', value: 50 },
-    ],//各类标签预警数量统计
-    sevenList: [
-        { label:'涉恐',value:30 },
-        { label:'涉暴',value:20 },
-        { label:'涉恐暴',value:10 },
-        { label:'涉睡',value:30 },
-        { label:'涉睡暴',value:20 },
-        { label:'涉睡恐',value:10 },
-        { label:'涉睡恐暴',value:5 },
-    ],//7类重点人员预警统计
     rylyList: {
         list: [
-            { label:'基础库',value:50 },
+            { label:'基础库',value:0 },
-            { label:'重点库',value:40 },
+            { label:'重点库',value:0 },
-            { label:'关注库',value:10 },
+            { label:'关注库',value:0 },
-            { label:'重点群体',value:50 },
+            { label:'重点群体',value:0 },
-            { label:'重点车辆',value:40 },
+            { label:'重点车辆',value:0 },
         ],
         topColor:'#17c8c3',
         colors: ["#28EEBF","#0DBAC5"],
     },//人员来源统计
+
+    zdrdjList: [
+        { name: '一级', value: 0 ,color: new echarts.graphic.LinearGradient(0, 0, 1, 1, [{ offset: 0, color: '#FF8DA7' },{ offset: 1, color: '#D66A8D' }])},
+        { name: '二级', value: 0 ,color: '#FFB944'},
+        { name: '三级', value: 0 ,color: '#fcfc54'},
+        { name: '四级', value: 0 ,color: '#0072ff'},
+    ],//重点人等级
+
+    bqgkslList: [
+        { label: '涉嫌爆炸等恐怖袭击人员', value: 0 },
+        { label: '全国涉稳重点人', value: 0 },
+        { label: '自治区涉稳人员', value: 0 },
+        { label: '国保涉稳人员', value: 0 },
+        { label: '涉政涉恐涉稳重点人员', value: 0 },
+    ],//各类标签预警数量统计
+    
     gbmgkList: {
         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:60 },
+            { label:'墨脱县',value:0,ssbmdm: "540423000000" },
-            { label:'其他保',value:50 },
+            { label:'波密县',value:0,ssbmdm: "540424000000" },
+            { label:'察隅县',value:0,ssbmdm: "540425000000" },
+            { label:'朗县',value:0,ssbmdm: "540426000000" },
+            { label:'雅下分局',value:0,ssbmdm: "540481450000" },
         ],
         topColor:'#17c8c3',
         colors: ["#28EEBF","#0DBAC5"],
     },//各部门管控数量统计
 })
-
+// 2开头是市、3开头是县、4开头派出所级
+const userInfo = getItem("deptId")[0];
 onMounted(()=>{
+    init()
     tabHeightFn()
 })
 
 // 筛选
 const handleChange = (val) => {
-  formSearch.value = val
+  formSearch.value = {...val }
+  formSearch.value.startTime = val.dateRange ? val.dateRange[0] : ''
+  formSearch.value.endTime = val.dateRange ? val.dateRange[1] : ''
+  delete formSearch.value.dateRange;
+  init()
+}
+
+// 初始化
+const init = () =>{
+    handle_ryly(); //人员来源统计
+    handle_gkjb(); //管控级别统计
+    handle_bq(); //各类标签预警数量统计
+    handle_gbmgk(); //各部门管控数量统计
+}
+
+//人员来源统计
+const handle_ryly = async () => {
+    let params = {...formSearch.value}
+    let res = await qcckGet(params,'/mosty-gsxt/tbGsxtZdry/lytjCount');
+    let list = res || [];
+    obj.rylyList.list = list.map(item => ({
+        label: item.mc,
+        value: item.sl || 0,
+    }))
+}
+
+// 重点人等级
+const handle_gkjb = async () => {
+    let params = {...formSearch.value}
+    let res = await qcckGet(params,'/mosty-gsxt/tbGsxtZdry/gkdjCount');
+    let color = [
+        new echarts.graphic.LinearGradient(0, 0, 1, 1, [{ offset: 0, color: '#FF8DA7' },{ offset: 1, color: '#D66A8D' }]),
+        '#FFB944',
+        '#fcfc54',
+        '#0072ff'
+    ]
+    obj.zdrdjList = (res || []).map((item,idx) => ({
+        name: item.zdmc,
+        value: Number(item.sl) || 0,
+        color: color[idx],
+    }))
+    console.log(obj.zdrdjList,'=====00');
+
+}
+
+//各类标签预警数量统计
+const handle_bq = async () => {
+    let params = {...formSearch.value}
+    let res = await qcckGet(params,'/mosty-gsxt/tbGsxtZdry/rybqCount');
+    let list = res || [];
+    obj.bqgkslList = list.map(item => ({
+        label: item.bqmc,
+        value: item['count(bq_mc)'] || 0,
+    }))
+}
+
+// 部门点击事件
+const handleClick = async (val) =>{
+    // 当前部门是派出所 bb
+    if(userInfo?.deptLevel?.startsWith('4')) return;
+    let info = obj.gbmgkList.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.gbmgkList.list = (res || []).map(v=>{
+        return {
+            label: v.ssbmmc,
+            value: Number(v.sl),
+            ssbmdm:v.ssbmdm
+        }
+    })
+}
+
+//各部门管控数量统计
+const handle_gbmgk = async () => {
+    activeTab.value = false;
+    let params = {...formSearch.value}
+    params.ssbmdm = userInfo?.deptCode;
+    loading.value = true;
+    let res = await qcckGet(params,'/mosty-gsxt/tbGsxtZdry/bmCount');
+    loading.value = false;
+    obj.gbmgkList.list = (res || []).map(v=>{
+        return {
+            label: v.ssbmmc,
+            value: Number(v.sl),
+            ssbmdm:v.ssbmdm
+        }
+    })
 }
 
 // 表格高度计算

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

@@ -41,6 +41,8 @@
 </template>
 
 <script setup>
+import { getItem } from "@/utils/storage";
+import { qcckGet } from '@/api/qcckApi'
 import * as echarts from 'echarts'
 import HeadLayout from './components/headLayout.vue'
 import StatusCount from './components/statusCount.vue'
@@ -51,17 +53,22 @@ const boxHeight = ref() //盒子高度
 const formSearch = ref({}) //查询条件
 const ketcount = ref(0)
 const obj = reactive({
+    // 采用情况统计
     cyqkList: [
-        { name:'采纳',value:30,color:'#0dbac5' },
+        { name:'采纳',value:0,color:'#0dbac5' },
-        { name:'退回',value:20,color:'#ff7700' },
+        { name:'退回',value:0,color:'#ff7700' },
     ],
+
+    // 分组统计
     fzList: [
-        { name:'内部',value:30,color:'#fdbc3a' },
+        { name:'内部',value:0,color:'#fdbc3a' },
-        { name:'共享',value:20,color:'#ff7700' },
+        { name:'共享',value:0,color:'#ff7700' },
     ],
+
+    // 状态统计
     ztList: [
-        { name: '送审', value: 85 ,color: new echarts.graphic.LinearGradient(0, 0, 1, 1, [{ offset: 0, color: '#FF8DA7' },{ offset: 1, color: '#D66A8D' }])},
+        { name: '送审', value: 0 ,color: new echarts.graphic.LinearGradient(0, 0, 1, 1, [{ offset: 0, color: '#FF8DA7' },{ offset: 1, color: '#D66A8D' }])},
-        { name: '转线索', value: 55 ,color: '#17C0AE'},
+        { name: '转线索', value: 0 ,color: '#17C0AE'},
     ],
     bqList: {
         list: [
@@ -84,14 +91,66 @@ const obj = reactive({
 })
 
 onMounted(()=>{
+    init()
     tabHeightFn()
 })
 
 // 筛选
 const handleChange = (val) => {
-  formSearch.value = val
+  formSearch.value = {...val }
+  formSearch.value.startTime = val.dateRange ? val.dateRange[0] : ''
+  formSearch.value.endTime = val.dateRange ? val.dateRange[1] : ''
+  delete formSearch.value.dateRange;
+  init()
 }
 
+const init = async () => {
+    await handle_cyqk(); //采用情况统计
+    await handle_fz(); //分组统计
+    await handle_zt(); //状态统计
+}
+
+//采用情况统计
+const handle_cyqk = async () => {
+    let params = {...formSearch.value}
+    let res = await qcckGet(params,'/mosty-gsxt/xxcj/cyqkCount');
+    let list = res || [];
+    let color = ['#0dbac5','#ff7700','#409eff']
+    obj.cyqkList = list.map((item,idx) => ({
+        name: item.dmmc,
+        value: item.sl || 0,
+        color: color[idx] || '#0dbac5',
+    }))
+}
+
+//分组统计
+const handle_fz = async () => {
+    let params = {...formSearch.value}
+    let res = await qcckGet(params,'/mosty-gsxt/xxcj/fzCount');
+    let list = res || [];
+    let color = ['#fdbc3a','#ff7700','#409eff']
+    obj.fzList = list.map((item,idx) => ({
+        name: item.dmmc,
+        value: item.sl || 0,
+        color: color[idx] || '#0dbac5',
+    }))
+}
+
+//状态统计
+const handle_zt = async () => {
+    let params = {...formSearch.value}
+    let res = await qcckGet(params,'/mosty-gsxt/xxcj/ztCount');
+    let list = res || [];
+    let color = [new echarts.graphic.LinearGradient(0, 0, 1, 1, [{ offset: 0, color: '#FF8DA7' },{ offset: 1, color: '#D66A8D' }]),'#17C0AE','#409eff']
+    obj.ztList = list.map((item,idx) => ({
+        name: item.dmmc,
+        value: item.sl || 0,
+        color: color[idx] || '#0dbac5',
+    }))
+}
+
+
+
 // 表格高度计算
 const tabHeightFn = () => {
   boxHeight.value = window.innerHeight - searchRef.value.offsetHeight - 200;

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

@@ -87,18 +87,26 @@ const activeTab = ref(false)
 const loading = ref(false)
 const ketcount = ref(0)
 const countList = ref([
-    { zddm:'01',label: '红色预警', hb:0,tb:0, dysl: '0', sysl: '0', snsl: '0', icon: require('@/assets/images/icon-red.png') },
+    { zddm:'01',label: '红色预警', hb:0,tb:0, dysl: 0, sysl: 0, snsl: 0, icon: require('@/assets/images/icon-red.png') },
-    { zddm:'02',label: '橙色预警', hb:0,tb:0, dysl: '0', sysl: '0', snsl: '0', icon: require('@/assets/images/icon-orange.png') },
+    { zddm:'02',label: '橙色预警', hb:0,tb:0, dysl: 0, sysl: 0, snsl: 0, icon: require('@/assets/images/icon-orange.png') },
-    { zddm:'03',label: '黄色预警', hb:0,tb:0, dysl: '0', sysl: '0', snsl: '0', icon: require('@/assets/images/icon-yellow.png') },
+    { zddm:'03',label: '黄色预警', hb:0,tb:0, dysl: 0, sysl: 0, snsl: 0, icon: require('@/assets/images/icon-yellow.png') },
-    { zddm:'04',label: '蓝色预警', hb:0,tb:0, dysl: '0', sysl: '0', snsl: '0', icon: require('@/assets/images/icon-blue.png') },
+    { zddm:'04',label: '蓝色预警', hb:0,tb:0, dysl: 0, sysl: 0, snsl: 0, icon: require('@/assets/images/icon-blue.png') },
 ])
 const obj = reactive({
     bqyjslList: [], //各类标签预警数量统计 { label: '涉毒人员', value: 0 },
     sevenList: [], //7类重点人员预警统计 { label:'涉恐',value:0 },
-
     // 2开头是市、3开头是县、4开头派出所级 { label:'工布江达县',value:0 },
     cnList: {
-        list: [],
+        list: [
+            { label:'巴宜区',value:0,ssbmdm: "540402000000" },
+            { label:'工布江达县',value:0,ssbmdm: "540421000000" },
+            { label:'米林县',value:0,ssbmdm: "540481000000" },
+            { label:'墨脱县',value:0,ssbmdm: "540423000000" },
+            { label:'波密县',value:0,ssbmdm: "540424000000" },
+            { label:'察隅县',value:0,ssbmdm: "540425000000" },
+            { label:'朗县',value:0,ssbmdm: "540426000000" },
+            { label:'雅下分局',value:0,ssbmdm: "540481450000" },
+        ],
         topColor:'#17c8c3',
         colors: ["#28EEBF","#0DBAC5"],
     },
@@ -128,11 +136,11 @@ const handleChange = (val) => {
 
 // 初始化
 const init = () =>{
-    handle_yjfl();
+    handle_yjfl(); //预警分类统计 同比、环比
-    handle_gbm();
+    handle_gbm(); // 各部门预警数量统计
-    handle_yjbq();
+    handle_yjbq(); // 预警标签统计
-    handle_seven();
+    handle_seven(); // 7类重点人员预警统计
-    handle_czzt();
+    handle_czzt(); // 处置状态统计
 }
 
 // 预警分类统计 同比、环比
@@ -144,11 +152,10 @@ const handle_yjfl = async () =>{
         let obj = list.find(i => i.zddm === item.zddm);
         obj.hb = Number(obj.hb.substring(0, obj.hb.length - 1));
         obj.tb = Number(obj.tb.substring(0, obj.tb.length - 1));
-        return obj ? {...item,obj} : item
+        return obj ? { ...item, ...obj } : item;
     })
 }
 
-
 // 部门点击事件
 const handleClick = async (val) =>{
     // 当前部门是派出所 bb
@@ -169,8 +176,6 @@ const handleClick = async (val) =>{
     })
 }
 
-
-
 // 各部门预警数量统计
 const handle_gbm = async () =>{
     activeTab.value = false;
@@ -187,16 +192,17 @@ const handle_gbm = async () =>{
         }
     })
 }
+
 // 预警标签统计
 const handle_yjbq = async () =>{
     let params = {...formSearch.value}
-    params.ssbmdm = userInfo?.deptCode;
     let res = await qcckGet(params,'/mosty-gsxt/yjxx/tj/yjbqtj');
     obj.bqyjslList = (res || []).map(item => ({
         label: item.yjbq,
         value: Number(item.count),
     }));
 }
+
 // 7类重点人员预警统计
 const handle_seven = async () =>{
     let params = {...formSearch.value}
@@ -206,6 +212,7 @@ const handle_seven = async () =>{
         value: Number(item.sl),
     }));
 }
+
 // 处置状态统计
 const handle_czzt = async () =>{
     let params = {...formSearch.value}
@@ -216,7 +223,6 @@ const handle_czzt = async () =>{
     }));
 }
 
-
 // 表格高度计算
 const tabHeightFn = () => {
   boxHeight.value = window.innerHeight - searchRef.value.offsetHeight - 300;

src/views/home/echarts/3DbarEcharts.vue

@@ -139,12 +139,12 @@ function chartFn() {
         show: true
       }, 
       axisLabel: {
-        interval: 1, // 控制标签的显示间隔，0 表示全部显示，可以根据需要调整为其他值，例如 1 表示每隔一个显示一个标签。
+        interval: 0, // 控制标签的显示间隔，0 表示全部显示，可以根据需要调整为其他值，例如 1 表示每隔一个显示一个标签。
         color: '#666666'
       }
     },
     yAxis: {
-       type: "value",
+      type: "value",
       splitLine: {
         show:true ,
         lineStyle: {
@@ -155,7 +155,6 @@ function chartFn() {
       axisTick: { show: false },
       axisLine: { show: false },
       axisLabel: { color: props.color },
-
     },
     series: [
       {