更新

src/components/GdMap/mapUtil.js

@@ -146,9 +146,12 @@ export function MapUtil(map) {
   // 展示气泡框  
   MapUtil.prototype.makerPopup = (item,flag,style = 'Dark')=>{
     // Dark   Light   Custom
+    let marker;
+    let flagPop = flag+'_pop'
+    if(!_that._self[flagPop]) _that._self[flagPop] = [];
     if(style == 'Dark' || style == 'Light') { 
       let list = zdyContent(flag,item);// 默认的样式
-      map.createPopup([item.jd,item.wd],{
+      marker = map.createPopup([item.jd,item.wd],{
         style:style, // 气泡框样式:
         data:list,
         title:item.ssbm,
@@ -157,7 +160,7 @@ export function MapUtil(map) {
         pixelOffset:[0,-50]
       })
     }else {
-      map.createPopup([item.jd,item.wd],{
+      marker = map.createPopup([item.jd,item.wd],{
         style:'Custom', // // 自定义样式
         attrs:{
           class:'popupCustom'
@@ -168,13 +171,14 @@ export function MapUtil(map) {
         pixelOffset:[0,-30]
       })
     }
+    _that._self[flagPop].push(marker)
   }
   // 弹窗自定义默认内容
   function zdyContent(flag,item){
     switch (flag) {
       case 'hm':
         return [
-          { label:'临安码线索数量',value:item.lamsx },
+          { label:'林安码线索数量',value:item.lamsx },
           { label:'布控预警数量',value:item.bkyj },
           { label:'红色预警数量',value:item.hsyj },
           { label:'信息采集数量',value:item.xxcjsl },
@@ -189,7 +193,7 @@ export function MapUtil(map) {
         html = `
         <div class="popupCustomBox">
           <div class="popupCustomTitle_title">${item.ssbm}</div>
-          <div>临安码线索数量：${item.lamsx}</div>
+          <div>林安码线索数量：${item.lamsx}</div>
           <div>布控预警数量：${item.bkyj}</div>
           <div>红色预警数量：${item.hsyj}</div>
           <div>信息采集数量：${item.xxcjsl}</div>

src/components/aboutTable/DarkTable.vue

@@ -287,27 +287,56 @@ const rowcontextmenuHland = (row, column, e) => {
 };
 
 const timer = ref(null);
+const isCloned = ref(false);
+const originalBodyHeight = ref(0);
 // 鼠标进入
 const clearnScroll = () => {
   clearInterval(timer.value);
   timer.value = null;
 };
+
+watch(() => props.tableData, () => {
+  nextTick(() => {
+    if (props.isScroll) createScroll();
+  })
+},{deep:true});
+
 // 鼠标离开
 const createScroll = () => {
   clearnScroll();
-  // 拿到table
+  nextTick(() => {
-  const tabel = multipleTableRef.value.layout.table.refs;
+    const refsPath = multipleTableRef.value?.$refs || multipleTableRef.value?.layout?.table?.refs;
-  // 拿到可以滚动的元素
+    const scrollEl = refsPath?.bodyWrapper || multipleTableRef.value?.$el?.querySelector('.el-table__body-wrapper');
-  const tableWrapper = tabel.bodyWrapper.firstElementChild.firstElementChild;
+    const tableEl = scrollEl?.querySelector('table') || multipleTableRef.value?.$el?.querySelector('.el-table__body-wrapper table');
-  if (props.isScroll) {
+    const bodyEl = tableEl?.tBodies?.[0];
-    timer.value = setInterval(() => {
+    if (!props.isScroll || !scrollEl || !tableEl || !bodyEl) return;
-      tableWrapper.scrollTop += 1;
+    if (!props.tableHeight) {
-      //判断滚动到底部,设置为0(可视高度+距离顶部 = 整个高度)
+      const fixedH = scrollEl.clientHeight || multipleTableRef.value?.$el?.clientHeight || 0;
-      if ( tableWrapper.clientHeight + tableWrapper.scrollTop == tableWrapper.scrollHeight) {
+      if (fixedH > 0) {
-        tableWrapper.scrollTop = 0;
+        scrollEl.style.height = fixedH + 'px';
+        scrollEl.style.overflowY = 'auto';
       }
-    }, 100);
+    }
-  }
+    originalBodyHeight.value = bodyEl.offsetHeight;
+    const oldClone = tableEl.querySelector('tbody[data-clone="true"]');
+    if (oldClone) {
+      tableEl.removeChild(oldClone);
+      isCloned.value = false;
+    }
+    if (!isCloned.value) {
+      const clone = bodyEl.cloneNode(true);
+      clone.setAttribute('data-clone', 'true');
+      tableEl.appendChild(clone);
+      isCloned.value = true;
+    }
+    const target = scrollEl.firstElementChild?.firstElementChild || scrollEl;
+    timer.value = setInterval(() => {
+      target.scrollTop += 1;
+      if (target.scrollTop >= originalBodyHeight.value) {
+        target.scrollTop -= originalBodyHeight.value;
+      }
+    }, 20);
+  });
 };
 
 // 滚动-触底加载
@@ -370,4 +399,10 @@ onUnmounted(() => {
 .header-icon {
   white-space: nowrap;
 }
-</style>
+</style>
+watch(() => props.isScroll, (val) => {
+  nextTick(() => {
+    if (val) createScroll();
+    else clearnScroll();
+  });
+},{immediate:true});

src/views/backOfficeSystem/fourColorManage/warningControl/identityWarning/components/addFrom.vue

@@ -47,7 +47,6 @@ watch(() => props.dict, (res) => {
       { label: "所属县局", prop: "ssxgaj", type: "input" },
       { label: "所属市局", prop: "sssgaj", type: "input" },
       { label: "接警员姓名", prop: "jjyxm", type: "input" },
-      // { label: "预警内容", prop: "yjNr", type: "textarea", width: "100%" },
     ]
   }
 

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

@@ -3,8 +3,7 @@
 </template>
 <script setup>
 import * as echarts from "echarts";
-import { fa } from "element-plus/es/locale.mjs";
+import { defineProps, watch, nextTick } from "vue";
-import { onMounted, ref, reactive, defineProps, onUnmounted, watch, nextTick } from "vue";
 const props = defineProps({
   echartsId:{
     type:String,
@@ -14,7 +13,8 @@ const props = defineProps({
     type:Object,
     default:{
       list:[],
-      colors:[]
+      colors:[],
+      topColor:'#1bd6c2'
     }
   }
 });
@@ -64,21 +64,21 @@ function chartFn(val,x_value,color,topColor) {
         axisLabel: {
           show: true,
           textStyle: {
-            color: "#333" //X轴文字颜色
+            color: "#fff" //X轴文字颜色
           },
         },
       }
     ],
     yAxis: [
       {
-        name:'单位：元/吨',
+        name:'',
         nameTextStyle: { color: "#fff" },
         type: 'value',
         splitLine: { show: false },
         axisLabel: {
           show: true,
           textStyle: {
-            color: "#333" //X轴文字颜色
+            color: "#FFF" //X轴文字颜色
           },
         },
       }
@@ -109,7 +109,7 @@ function chartFn(val,x_value,color,topColor) {
           textStyle: {
             color: '#0EBBC5',
             fontSize: 14,
-            fontWeight: 'bold'
+            fontWeight: 'bold',
           },
           formatter: '{c}'
         }
@@ -132,7 +132,7 @@ function chartFn(val,x_value,color,topColor) {
         barGap: 0,
         data: sideData1,
         label: {
-          show: true,
+          show: false,
           position: 'top',
           textStyle: {
             color: 'white',

src/views/home/index.vue

@@ -83,7 +83,15 @@
         <WarningPoints></WarningPoints>
       </div>
       <div style="width: 33%;">
-        <WarningLevels></WarningLevels>
+         <transition name="flip" mode="out-in">
+          <div :key="'qb'" v-if="modelWarning" class="flip-wrapper">
+            <WarningLevels @changeModel="changeModel"></WarningLevels>
+          </div>
+          <div :key="'text'" v-else class="flip-wrapper">
+            <BkWarning @changeModel="changeModel"></BkWarning>
+          </div>
+         </transition>
+        
       </div>
       <div style="width: 33%;">
         <Bkcz></Bkcz>
@@ -108,6 +116,7 @@ import QblyType from './model/qblyType.vue'
 import TextType from './model/textType.vue'
 import Bkcz from './model/bkcz.vue'
 import WarningLevels from './model/warningLevels.vue'
+import BkWarning from './model/bkWarning.vue'
 import Yszs from './model/yszs.vue'
 import DeployControl from './model/deployControl.vue';
 import Experience from './model/experience.vue'
@@ -127,6 +136,7 @@ import Statistics from './model/statistics.vue'
 // 导入音频播放器工具类
 import audioPlayer from '@/utils/audioPlayer'
 const webSoket = new WebSoketClass()
+const modelWarning = ref(true)
 const changeXzqh = (val, trg) => {
   setTimeout(() => {
     // 先移除已有的边界
@@ -215,9 +225,12 @@ const getDepId = () => {
 
   }
 }
+
 const makerCenter = () => {
   const dw = require("@/assets/point/dingwei.png")
   qcckGet({},'/mosty-gsxt/tbYjxx/selectSsbm').then(res=>{
+    emitter.emit('deletePointArea','hm')
+    emitter.emit('deletePointArea','hm_pop')
     let list = res || [];
     list.forEach(item => {
       let obj = centralPoint.find(i => i.name == item.ssbm);
@@ -258,11 +271,14 @@ const initAudioPlayer = () => {
       console.error('初始化音频播放器失败:', error);
     })
 }
+const bnTimer = ref(null)
 // 组件挂载时初始化音频播放器
 onMounted(() => {
-
   getDepId()
   makerCenter()
+  bnTimer.value = setInterval(()=>{
+    makerCenter()
+  },10000)
   mouseLeave()
   getTbYjxxGetList()
   // 初始化音频播放器
@@ -344,6 +360,7 @@ const reversal= () => {
   reversalShow.value = !reversalShow.value
   // 移除clearInterval调用，避免定时器被清除
 }
+
 // 鼠标移入
 const mouseEnter = () => {
   clearInterval(timing.value)
@@ -358,8 +375,13 @@ const mouseLeave = () => {
     reversal()
   }, 30000)
 }
+
+function changeModel(){
+  modelWarning.value = !modelWarning.value
+}
 onUnmounted(() => {
   clearInterval(timing.value)
+  clearInterval(bnTimer.value)
   // 组件卸载时停止音频播放并释放资源
   if (audioPlayer) {
     audioPlayer.destroy()

src/views/home/model/bkWarning.vue

@@ -0,0 +1,85 @@
+<template>
+  <div class="comom-title">
+  <div class="title">布控预警级别统计<span class="switchover" @click.stop="reversalPush">切换</span></div>
+  </div>
+  <div class="comom-cnt" style="border-right: 1px solid #ebebeb;width: 100%;" v-loading="loadingyj">
+    <DbarEcharts echartsId="bar3DYkChart" :data="cnList"></DbarEcharts>
+  </div>
+</template>
+
+<script setup>
+import DbarEcharts from "@/views/home/echarts/3DbarEcharts.vue";
+import { qcckGet } from "@/api/qcckApi.js";
+import { onMounted,ref,defineEmits ,reactive} from "vue";
+const emit = defineEmits(["changeModel"])
+const loadingyj = ref(false)
+let cnList = reactive({
+  list: [
+    { label:'一级',val:0,type:'01' },
+    { label:'二级',val:0,type:'02' },
+    { label:'三级',val:0,type:'03' },
+    { label:'四级',val:0,type:'04' },
+  ],
+  topColor:'#1bd6c2',
+  colors: ["#28EEBF","#0DBAC5"],
+}) 
+onMounted(() => {
+  getYjczDate()
+});
+
+const getYjczDate = () => {
+  loadingyj.value = true;
+  qcckGet({}, '/mosty-gsxt/tbYjxx/bdbkYjxxTj').then(res => {
+    loadingyj.value = false;
+    let list = res || []
+    cnList.list.forEach(item => {
+      let obj = list.find(v => v.yj_jb == item.type)
+      item.val = obj?.count || 0
+    })
+  })
+};
+
+const reversalPush = () => {
+  emit('changeModel')
+}
+
+
+
+</script>
+
+
+<style lang="scss" scoped>
+@import "@/assets/css/homeScreen.scss";
+::v-deeep .comom-title{
+  background: url("~@/assets/images/bg18.png") no-repeat center center;
+  background-size: 100% 100%;
+}
+::v-deeep .comom-cnt{
+  background: url("~@/assets/images/bg18.png") no-repeat center center;
+  background-size: 100% 100%;
+}
+
+::v-deep .el-table td.el-table__cell{
+  color: #ffffff;
+}
+
+::v-deep .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell{
+  background: rgba(0,61,130,0.75);
+}
+.switchover{
+  cursor: pointer;
+  font-size: 14px;
+  margin-left: 20px;
+  color: rgb(255, 146, 4);
+}
+</style>
+<style lang="scss">
+.zdy_bkcz_table td.el-table__cell {
+    color: #ffffff !important;
+}
+.zdy_bkcz_table th.el-table__cell {
+    color: #ffffff !important;
+    font-size: 15px;
+}
+
+</style>

src/views/home/model/keyPpersonneltypes.vue

@@ -1,7 +1,6 @@
 <template>
   <div class="comom-title">
-    <!-- <span class="title">重点人员类型</span> -->
+    <div class="title">重点人员类型<span class="switchover" @click.stop="reversalPush">切换</span></div>
-         <div class="title">重点人员类型<span class="switchover" @click.stop="reversalPush">切换</span></div>
     <div class="title titleFz" style="" @click="visible = true">
       查看列表
     </div>

src/views/home/model/mesgSwitch/timeData.vue

@@ -1,9 +1,8 @@
 <template>
   <div>
- <el-date-picker v-model="listQuery" :type="type" :shortcuts="shortcuts" range-separator="至" start-placeholder="开始时间"
+  <el-date-picker v-model="listQuery" :type="type" :shortcuts="shortcuts" range-separator="至" start-placeholder="开始时间"
     :value-format="valueFrmat" :format="valueFrmat" end-placeholder="结束时间" @change="changeTime" />
   </div>
-
 </template>
 
 <script setup>

src/views/home/model/qingBaowbTable.vue

@@ -11,15 +11,22 @@
 
 
     <div class="table-wrapper">
-      <el-table :data="tableData" style="width: 100%" height="calc(100% - 1px)" :header-cell-style="{
+      <el-table 
-        background: 'transparent',
+        :data="tableData" 
-        color: '#0d4b8a',
+        style="width: 100%"
-        borderColor: '#0d4b8a'
+        stripe
-      }" :row-style="{
+        height="calc(100% - 1px)" 
-        background: 'transparent',
+        :header-cell-style="{
-        color: '#fff',
+          background: 'transparent',
-        borderColor: '#0d4b8a'
+          color: '#ffffff',
-      }" stripe>
+          borderColor: '#0d4b8a'
+        }" 
+        :row-style="{
+          background: 'transparent',
+          color: '#fff',
+          borderColor: '#0d4b8a'
+        }" 
+      >
         <el-table-column prop="ssbm" label="部门名称" min-width="120" show-overflow-tooltip />
         <el-table-column prop="xm" label="姓名" min-width="80" show-overflow-tooltip />
         <!-- 信息员积分 和 研判员积分 -->
@@ -90,7 +97,7 @@ defineExpose({
     gap: 10px;
 
     .tab-button {
-      padding: 0px 4px;
+      padding: 0px 10px;
       background: rgba(0, 77, 167, 0.6);
       color: #fff;
       border: 1px solid #0099ff;
@@ -105,7 +112,7 @@ defineExpose({
 
       &.active {
         background: rgba(0, 244, 255, 0.8);
-        color: #000;
+        color: #0072ff;
         border-color: #00f4ff;
       }
     }

src/views/home/model/textType.vue

@@ -20,13 +20,15 @@
 </template>
 
 <script setup>
-import { qcckPost } from "@/api/qcckApi.js";
+import { qcckPost,qcckGet } from "@/api/qcckApi.js";
 import BarHatEcharts from "@/views/home/echarts/barHatEcharts.vue";
 import { onMounted, reactive, ref } from "vue";
 import TimeData from '@/views/home/model/mesgSwitch/timeData.vue'
 const list = ref({
-  xDate: ['上访','诈骗','敲诈勒索','盗窃'],
+  xDate: ['共享','内部','林安码'],
-  list:[{ name: "总数", value: [0,0,0,0] ,color:['rgba(0,244,255,1)','rgba(0,77,167,1)'] ,hatColor:'#087df9'}],
+  list:[{ name: "总数", value: [0,0,0] ,color:['rgba(0,244,255,1)','rgba(0,77,167,1)'] ,hatColor:'#087df9'}],
+  // xDate: ['上访','诈骗','敲诈勒索','盗窃'],
+  // list:[{ name: "总数", value: [0,0,0,0] ,color:['rgba(0,244,255,1)','rgba(0,77,167,1)'] ,hatColor:'#087df9'}],
 })
 
 onMounted(() => {
@@ -38,13 +40,14 @@ const getCount = () => {
     startTime: listQuery.value?.startTime || "",
     endTime: listQuery.value?.endTime || ""
   }
-  qcckPost(promes, '/mosty-gsxt/qbcj/getXscjTjBySszt').then(res => {
+  qcckGet(promes, '/mosty-gsxt/xxcj/xxlylx').then(res => {
-    console.log(res);
+    list.value.list[0].value = [res.gxxx || 0,res.nbxx || 0,res.lam || 0]
-    list.value.xDate = res ? res.map(v=> v.zdmc):[];
-    list.value.list[0].value = res ? res.map(v => v.count) : [0, 0, 0, 0];
-  console.log(list.value);
-
   })
+  // qcckPost(promes, '/mosty-gsxt/qbcj/getXscjTjBySszt').then(res => {
+    // list.value.xDate = res ? res.map(v=> v.zdmc):[];
+    // list.value.list[0].value = res ? res.map(v => v.count) : [0, 0, 0, 0];
+    // console.log(list.value);
+  // })
 }
 const visible = ref(false)
 const changeTime = (val) => {

src/views/home/model/warningLevels.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="comom-title">
- <div class="title">四色预警统计</div>
+  <div class="title">四色预警统计<span class="switchover" @click.stop="reversalPush">切换</span></div>
   </div>
   <div class="comom-cnt" style="border-right: 1px solid #ebebeb;width: 100%;" v-loading="loadingyj">
      <WarningCount ref="yjjbRef"></WarningCount>
@@ -10,9 +10,15 @@
 <script setup>
 import { qcckGet, qcckPost } from "@/api/qcckApi.js";
 import WarningCount from "@/views/backOfficeSystem/fourColorManage/warningControl/centerHome/components/WarningCount.vue";
-import { onMounted,ref } from "vue";
+import { onMounted,ref,defineEmits } from "vue";
 const yjjbRef = ref()
 const loadingyj = ref(false)
+
+const emit = defineEmits(["changeModel"])
+const reversalPush = () => {
+  emit('changeModel')
+}
+
 const getYjczDate = () => {
   loadingyj.value = true;
   qcckGet({}, '/mosty-gsxt/tbYjxx/getYjxxTj').then(res => {
@@ -50,7 +56,13 @@ getYjczDate()
 }
 
 ::v-deep .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell{
-    background: rgba(0,61,130,0.75);
+  background: rgba(0,61,130,0.75);
+}
+.switchover{
+  cursor: pointer;
+  font-size: 14px;
+  margin-left: 20px;
+  color: rgb(255, 146, 4);
 }
 </style>
 <style lang="scss">
@@ -61,4 +73,5 @@ getYjczDate()
     color: #ffffff !important;
     font-size: 15px;
 }
+
 </style>

src/views/home/model/warningPoints.vue

@@ -9,7 +9,7 @@
             :tableColumn="pageData.tableColumn"
             :tableHeight="pageData.tableHeight"
             :key="pageData.keyCount"
-            :isScroll="true"
+            :isScroll="isScroll"
             :tableConfiger="pageData.tableConfiger"
             >
         </DarkTable>
@@ -17,9 +17,10 @@
 </template>
 
 <script setup>
-import { reactive,onMounted } from 'vue'
+import { reactive,onMounted,ref } from 'vue'
 import DarkTable from '@/components/aboutTable/DarkTable.vue'
 import { qcckGet } from "@/api/qcckApi.js";
+const isScroll = ref(false)
 const pageData = reactive({
   tableData: [],
   keyCount: 0,
@@ -47,10 +48,12 @@ const getList = () => {
   pageData.tableConfiger.loading = true
   qcckGet({},'/mosty-gsxt/tbYjxx/selectYjxxFzTen').then(res => {
       let list = res || []
+      isScroll.value =  list.length > 3 ? true : false;
       pageData.tableData = list.map((item, index) => {
         item.order = index + 1
         return item
       })
+      
     pageData.tableConfiger.loading = false
   }).catch(() => {
     pageData.tableConfiger.loading = false