lcw

2025-11-22 21:59:58 +08:00
parent ea3022c3f6
commit 93c49dff27
661 changed files with 195357 additions and 2160 deletions
--- a/src/components/GdMap/mapUtil.js
+++ b/src/components/GdMap/mapUtil.js
@ -84,7 +84,8 @@ export function MapUtil(map) {
        el.style.width = size ? size : "25px";
        if (flag.includes('jczMap_')) el.style.width = '45px';
        if (showTitle) _that.makerShowTitle(item, [item.jd, item.wd], flag, '', offset) //展示标题
-        const marker = map.Marker(el, [item.jd, item.wd], { anchor: 'bottom', offset: [0, 0] })
+        // 确保坐标格式正确，使用对象格式传递坐标
+        const marker = map.Marker(el, { lng: item.jd, lat: item.wd }, { anchor: 'bottom', offset: [0, 0] })
        el.addEventListener("click", () => {
          _that.openInfoDetail(flag, item) //点击打开详情
        })
@ -131,7 +132,7 @@ export function MapUtil(map) {

      let offset = isShoeCar ? [-10, 0] : [0, 0];
      if (cllxList.includes('08')) offset = [-12, -10]
-      const marker = map.Marker(el, [item.jd, item.wd], { anchor: 'bottom', offset: offset })
+      const marker = map.Marker(el, { lng: item.jd, lat: item.wd }, { anchor: 'bottom', offset: offset })
      el.addEventListener("click", () => {
        _that.openInfoDetail(flag, item) //点击打开详情
      })
@ -140,6 +141,24 @@ export function MapUtil(map) {
    });
  }

+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
  // 信息框展示
  MapUtil.prototype.makerShowTitle = (item, points, flag, text, offset) => {

@ -179,7 +198,7 @@ export function MapUtil(map) {

    // 渲染
    el.innerHTML = textTitle;
-    const marker = map.Marker(el, points, { anchor: 'bottom', offset: offset ? offset : [0, -50] })
+    const marker = map.Marker(el, Array.isArray(points) ? { lng: points[0], lat: points[1] } : points, { anchor: 'bottom', offset: offset ? offset : [0, -50] })
    _that._self[flagT].push(marker)
  }

@ -639,6 +658,9 @@ export function MapUtil(map) {
    if (!_that._self[flag]) _that._self[flag] = [];
    if (isClear && _that._self[flag]) _that.removeElement(flag); //destroy 移除,start 播放,pause 暂停
    let lineString = getUUid().slice(3, 5)
+
+
+    console.log("1");
    const data = [
      {
        position: coords,
@ -647,6 +669,9 @@ export function MapUtil(map) {
        userData: { name: '测试1' }
      }
    ]
+    console.log("2");
+    console.log(data);
+    // const s=data[0].
    const track = map.trajectoryRealtime(data, {
      color: '#28F', //轨迹背景颜色
      width: 8,
@ -658,6 +683,7 @@ export function MapUtil(map) {
      isAgain: false,//轨迹运动是否重复,
      traveledColor: '#32b1fb' //运动轨迹颜色
    })
+    console.log("3");
    track.start()

    track.on('length', (data) => {
@ -790,21 +816,20 @@ export function MapUtil(map) {

    switch (flag) {
      case 'home_yj_map':
-        console.log(data);
        emitter.emit("showHomeYJ", data);
        break;
      case 'home_yj_detail':
-        console.log(data);
        emitter.emit("showHomeWarning", data);
        break;
      case 'jczMap_hm':
-        console.log(data);
        emitter.emit("showJcz", data);
        break;
      case 'sp':
-        console.log(data);
        emitter.emit("showGzyInfo", data);
        break;
+      case 'yj':
+        emitter.emit('yjShow', data);
+        break;
    }
  }
 }
--- a/src/components/MyComponents/Pie3D.vue
+++ b/src/components/MyComponents/Pie3D.vue
@ -1,109 +1,169 @@
 <template>
-  <div ref="chartRef" :style="{ width: '100%', height: '400px' }"></div>
+  <div ref="chartRef" :style="{ width: '100%', height: '100%' }"></div>
 </template>

-<script>
-import { defineComponent, onMounted, ref } from 'vue'
+<script setup>
+import { defineComponent, onMounted, onUnmounted, ref, watch } from 'vue'
 import * as echarts from 'echarts'
-import 'echarts-gl'
-
-export default defineComponent({
-  name: 'Pie3D',
-  setup() {
-    const chartRef = ref(null)
-    let chart = null
-
-    const initChart = () => {
-      if (!chartRef.value) return
-
-      chart = echarts.init(chartRef.value)
-      const option = {
-        backgroundColor: '#1a213c',
-        tooltip: {
-          formatter: '{b}: {c} ({d}%)',
-          backgroundColor: 'rgba(0,0,0,0.7)',
-          borderColor: '#1a213c',
-          textStyle: {
-            color: '#fff'
-          }
-        },
-        legend: {
-          orient: 'vertical',
-          right: '5%',
-          top: 'center',
-          textStyle: {
-            color: '#fff'
-          },
-          formatter: function(name) {
-            const data = option.series[0].data
-            const total = data.reduce((sum, item) => sum + item.value, 0)
-            const target = data.find(item => item.name === name)
-            const percentage = ((target.value / total) * 100).toFixed(0)
-            return `${name}  ${target.value}`
-          }
-        },
-        series: [{
-          type: 'pie',
-          radius: ['30%', '55%'],
-          center: ['40%', '50%'],
-          roseType: false,
-          zlevel: 10,
-          startAngle: 35,
-          selectedMode: 'single',
-          selectedOffset: 10,
-          data: [
-            { value: 18, name: '红色', itemStyle: { color: '#ff4d4f' } },
-            { value: 13, name: '橙色', itemStyle: { color: '#ff7a45' } },
-            { value: 17, name: '黄色', itemStyle: { color: '#ffc53d' } },
-            { value: 2, name: '蓝色', itemStyle: { color: '#40a9ff' } }
-          ],
-          label: {
-            show: true,
-            formatter: '{d}%',
-            color: '#fff',
-            position: 'outside',
-            fontSize: 14,
-            fontWeight: 'bold'
-          },
-          emphasis: {
-            focus: 'self',
-            scaleSize: 10,
-            itemStyle: {
-              shadowBlur: 20,
-              shadowOffsetX: 5,
-              shadowOffsetY: 5,
-              shadowColor: 'rgba(0, 0, 0, 0.5)'
-            }
-          },
-          itemStyle: {
-            borderRadius: 4,
-            borderColor: '#1a213c',
-            borderWidth: 2
-          },
-          animationType: 'scale',
-          animationEasing: 'elasticOut',
-          animationDelay: function (idx) {
-            return Math.random() * 200;
-          }
-        }]
-      }
-
-      chart.setOption(option)
-    }
-
-    onMounted(() => {
-      initChart()
-      window.addEventListener('resize', () => {
-        chart && chart.resize()
-      })
-    })
-
-    return {
-      chartRef
-    }
+const props = defineProps({
+  data: {
+    type: Array,
+    default: () => []
+  },
+  color: {
+    type: Array,
+    default:() => []
  }
 })
+const chartRef = ref(null)
+let chart = null
+const initChart = () => {
+  if (!chartRef.value) return
+  chart = echarts.init(chartRef.value)
+  const option = {
+    // backgroundColor: '#1a213c',
+    tooltip: {
+      formatter: '{b}: {c} ({d}%)',
+      backgroundColor: 'rgba(0,0,0,0.7)',
+      borderColor: '#1a213c',
+      textStyle: {
+        color: '#fff'
+      }
+    },
+    legend: {
+      orient: 'vertical',
+      right: '0%',
+      top: 'center',
+      textStyle: {
+        color: '#fff'
+      },
+      formatter: function (name) {
+        const data = option.series[0].data
+        const total = data.reduce((sum, item) => sum + item.value, 0)
+        const target = data.find(item => item.name === name)
+        const percentage = ((target.value / total) * 100).toFixed(0)
+        return `${name}  ${target.value}`
+      }
+    },
+    series: [{
+      type: 'pie',
+      radius: ['30%', '55%'],
+      center: ['40%', '50%'],
+      roseType: false,
+      zlevel: 10,
+      startAngle: 35,
+      selectedMode: 'single',
+      selectedOffset: 10,
+      data:[...props.data],
+      label: {
+        show: true,
+        formatter: '{d}%',
+        color: '#fff',
+        position: 'outside',
+        fontSize: 14,
+        fontWeight: 'bold'
+      },
+      emphasis: {
+        focus: 'self',
+        scaleSize: 10,
+        itemStyle: {
+          shadowBlur: 20,
+          shadowOffsetX: 5,
+          shadowOffsetY: 5,
+          shadowColor: 'rgba(0, 0, 0, 0.5)'
+        }
+      },
+      itemStyle: {
+        borderRadius: 4,
+        borderColor: '#1a213c',
+        borderWidth: 2
+      },
+      // 启用全局动画控制器
+      animation: true,
+      // 关键：设置animationDelayUpdate确保数据更新时也有动画
+      animationDelayUpdate: function (idx) {
+        return idx * 300;
+      },
+      // 逐个显示的动画效果 - 改为从透明到不透明的过渡效果
+      animationType: 'opacity',
+      animationEasing: 'cubicOut',
+
+      // 关键：设置初始样式，让每个扇形从透明状态开始
+      // 使用动画帧序列来控制动画过程
+      animation: true,
+      animationDuration: 1000,
+      animationDelay: function (idx) {
+        // 按照索引顺序依次显示，设置更明显的延迟
+        return idx * 400;
+      },
+
+      // 动画开始前的回调，确保动画效果
+      animationBegin: function() {
+        // 可以在这里进行额外的动画初始化
+        return 0;
+      },
+
+      // 动画帧序列，控制每个关键帧的样式
+      animationFrame: function (idx, percent) {
+        // percent参数是从0到1的动画进度
+        return {
+          opacity: percent,
+          scale: 0.8 + percent * 0.2 // 从0.8放大到1
+        };
+      }
+    }],
+      media: [
+    {
+      query: { minAspectRatio: 1 },
+      option: {
+        series: [
+          { center: ['36%', '50%'] },
+
+        ]
+      }
+    }
+  ]
+  }
+
+  chart.setOption(option)
+}
+onMounted(() => {
+  initChart()
+  window.addEventListener('resize', () => {
+    chart && chart.resize()
+  })
+})
+
+// 监听数据变化，确保动画在数据更新时也能触发
+watch(
+  () => props.data,
+  (newData) => {
+    if (chart && newData && newData.length > 0) {
+      // 使用clear方法强制重新渲染并触发动画
+      chart.clear()
+      initChart()
+    }
+  },
+  { deep: true }
+)
+
+// 组件卸载时清理资源
+const cleanup = () => {
+  if (chart) {
+    chart.dispose()
+    chart = null
+  }
+  window.removeEventListener('resize', () => {
+    chart && chart.resize()
+  })
+}
+
+// 组件卸载时执行清理
+onUnmounted(() => {
+  cleanup()
+})
+
+
 </script>

-<style scoped>
-</style>
+<style scoped></style>
--- a/src/components/aboutTable/MyTable.vue
+++ b/src/components/aboutTable/MyTable.vue
@ -160,4 +160,5 @@ function setDefaultChoose() {
 .tabBoxRadio .el-table__header-wrapper .el-checkbox {
  display: none;
 }
+
 </style>
--- a/src/components/flowPath/submissionProcess.vue
+++ b/src/components/flowPath/submissionProcess.vue
@ -87,9 +87,9 @@ const qcckGetCount = () => {
  if (!getItem('cookie')) {
    qcckGet({ sfzh: Sfzh }, '/mosty-base/fzmsg/getCokie', true).then(res => {
      if (res.cookie) {
-        setCookie('clientKey', res.cookie.substring(10, res.length))
+        setCookie('JSRSSIONID', res.cookie.substring(10, res.length))
      } else {
-        setCookie('clientKey', res.substring(10, res.length))
+        setCookie('JSRSSIONID', res.substring(10, res.length))
      }

      qcckGetList()
@ -107,7 +107,7 @@ const createProcess = ref({})
 const radioData = ref('')
 // const InterfaceAddress = 'http://192.168.0.231:8006/mosty-api/mosty-gsxt/'
 // const InterfaceAddress = 'http://192.168.0.231:8006/mosty-api/mosty-gsxt/'
-const InterfaceAddress = 'http://155.540.22.30:50037/mosty-api/mosty-gsxt/'
+const InterfaceAddress = 'http://155.240.22.30:2109/mosty-api/mosty-gsxt/'
 // const InterfaceAddress = 'http://192.168.1.32:8006/mosty-api/mosty-gsxt/'
 const changeRadio = (e) => {
  radioData.value = e
@ -119,7 +119,7 @@ const changeRadio = (e) => {
      processType: 1,
      processData:
      {
-        iframe: `#/${props.path.clueVerification}?id=${props.data.id}`,
+        iframe: `${props.path.clueVerification}?id=${props.data.id}`,
        hostPrefix: "sgxtPath",
        rwbh: props.data.id,
        flowType: 'SGSP',
--- a/src/components/fzq/SwitchSysDialog.vue
+++ b/src/components/fzq/SwitchSysDialog.vue
@ -0,0 +1,133 @@
+<!--
+ * @Date: 2025-08-06 14:49:49
+ * @Description: 系统切换窗口
+-->
+<template>
+   <!-- append-to-body -->
+    <div class="a">
+
+
+  <el-dialog
+  :model-value="modelValue"
+    class="switch-sys-dialog"
+    modal-class="switch-sys-dialog-modal"
+    :show-close="false"
+    width="75%"
+    align-center
+
+    destroy-on-close
+    @close="handleModalClick"
+  >
+    <div class="switch-sys-dialog__content">
+      <div class="carousel">
+        <div
+          :class="['card-item']"
+          v-for="(item, index) in list"
+          :key="item.value"
+          @click="goPage(item, index)"
+        >
+          <img :src="item.icon" class="card-item__img" />
+          <div class="card-item__label">{{ item.label }}</div>
+        </div>
+      </div>
+    </div>
+  </el-dialog>
+     </div>
+</template>
+
+<script setup>
+import fk from '@/assets/images/fk.png'
+import ty from '@/assets/images/ty.png'
+import pcs from '@/assets/images/pcs.png'
+const props = defineProps({
+  modelValue: {
+    type: Boolean,
+    default: false
+  }
+})
+
+const emit = defineEmits(['update:modelValue'])
+
+const list = [
+   { label: '俯瞰系统', value: 1, url: `https://tyyy.lz.dsj.xz/overlooking/home`, icon: fk },
+  { label: '统一门户', value: 2, url: 'https://tyyy.lz.dsj.xz/portal/home', icon: ty },
+  { label: '智慧派出所', value: 3, url: 'https://pcs.lz.dsj.xz:9020/index.html', icon: pcs },
+]
+
+const goPage = (item) => {
+  if (item.url) {
+    window.open(item.url, '_self')
+  }
+}
+
+// 处理遮罩点击事件
+const handleModalClick = () => {
+  emit('update:modelValue', false)
+}
+</script>
+
+<style lang="scss">
+
+</style>
+<style lang="scss" scoped>
+.a{
+  ::v-deep(.el-dialog){
+    background-color: transparent !important;
+  }
+}
+body .el-overlay .el-overlay-dialog .el-dialog{
+  background-color: transparent !important;
+}
+.switch-sys-dialog {
+
+  &__content {
+    display: grid;
+    grid-template-columns: auto 1fr auto;
+    width: inherit;
+    // height: 335px;
+    align-items: center;
+    .carousel {
+      display: grid;
+      grid-template-columns: repeat(3, 1fr);
+      gap: 40px;
+      width: 100%;
+      height: 100%;
+
+      .card-item {
+        border-radius: 10px;
+        overflow: hidden;
+        cursor: pointer;
+        transition: all 0.25s ease;
+
+        &:hover {
+          transform: scale(1.05);
+          .card-item__label {
+            height: 30px;
+            line-height: 30px;
+            font-size: 16px;
+            color: var(--theme-text-color);
+            font-weight: bold;
+          }
+        }
+
+        &__img {
+          width: 100%;
+          height: auto;
+          object-fit: cover;
+        }
+
+        &__label {
+          height: 25px;
+          line-height: 25px;
+          background-color: #fff;
+          text-align: center;
+          color: var(--text-color-black);
+          transition: all 0.5s ease;
+        }
+      }
+    }
+  }
+}
+
+</style>
+
--- a/src/components/fzq/fxq.vue
+++ b/src/components/fzq/fxq.vue
@ -0,0 +1,188 @@
+<template>
+  <div class="floating-ball" :style="ballStyle" @mousedown="startDrag" @touchstart="startDrag" @click="handleClick">
+    <slot>
+    </slot>
+  </div>
+
+</template>
+
+<script setup>
+import { ref, onMounted, onUnmounted } from 'vue';
+
+const props = defineProps({
+  // 初始位置
+  initialPosition: {
+    type: Object,
+    default: () => ({ x: 0, y: 0 })
+  },
+  // 是否可拖动
+  draggable: {
+    type: Boolean,
+    default: true
+  },
+  // 自动吸附边缘的阈值
+  snapThreshold: {
+    type: Number,
+    default: 0
+  }
+});
+// watch(() => props.initialPosition, (newVal) => {
+//   position.value = { x: newVal.x, y: newVal.y };
+// },{deep:true})
+const emit = defineEmits(['click']);
+
+const position = ref({ x: props.initialPosition.x, y: props.initialPosition.y });
+const isDragging = ref(false);
+const startPos = ref({ x: 0, y: 0 });
+const startMousePos = ref({ x: 0, y: 0 });
+
+const ballStyle = ref({
+  left: `${position.value.x}px`,
+  top: `${position.value.y}px`,
+  cursor: props.draggable ? 'move' : 'pointer'
+});
+
+// 开始拖动
+const startDrag = (e) => {
+  if (!props.draggable) return;
+
+  isDragging.value = true;
+  startPos.value = { ...position.value };
+
+  // 处理鼠标和触摸事件
+  if (e.type === 'mousedown') {
+    startMousePos.value = { x: e.clientX, y: e.clientY };
+  } else if (e.type === 'touchstart') {
+    startMousePos.value = { x: e.touches[0].clientX, y: e.touches[0].clientY };
+  }
+
+  // 阻止默认行为和冒泡
+  e.preventDefault();
+  e.stopPropagation();
+};
+
+// 处理移动
+const handleMove = (e) => {
+  if (!isDragging.value) return;
+
+  let clientX, clientY;
+  if (e.type === 'mousemove') {
+    clientX = e.clientX;
+    clientY = e.clientY;
+  } else if (e.type === 'touchmove') {
+    clientX = e.touches[0].clientX;
+    clientY = e.touches[0].clientY;
+  }
+
+  const dx = clientX - startMousePos.value.x;
+  const dy = clientY - startMousePos.value.y;
+
+  position.value = {
+    x: startPos.value.x + dx,
+    y: startPos.value.y + dy
+  };
+
+  updatePosition();
+};
+
+// 结束拖动
+const endDrag = () => {
+  if (!isDragging.value) return;
+  isDragging.value = false;
+  snapToEdge();
+};
+
+// 自动吸附到边缘
+const snapToEdge = () => {
+  const windowWidth = window.innerWidth;
+  const windowHeight = window.innerHeight;
+
+  // 检查是否靠近左右边缘
+  if (position.value.x < props.snapThreshold) {
+    position.value.x = 0;
+  } else if (position.value.x > windowWidth - props.snapThreshold) {
+    position.value.x = windowWidth;
+  }
+
+  // 检查是否靠近上下边缘
+  if (position.value.y < props.snapThreshold) {
+    position.value.y = 0;
+  } else if (position.value.y > windowHeight - props.snapThreshold) {
+    position.value.y = windowHeight;
+  }
+
+  updatePosition();
+};
+
+// 更新位置样式
+const updatePosition = () => {
+  ballStyle.value = {
+    ...ballStyle.value,
+    left: `${position.value.x}px`,
+    top: `${position.value.y}px`
+  };
+};
+
+// 点击事件
+const handleClick = (e) => {
+  if (isDragging.value) {
+    // 如果是拖动结束的点击，不触发点击事件
+    isDragging.value = false;
+    return;
+  }
+  emit('click', e);
+};
+
+// 添加事件监听
+onMounted(() => {
+  window.addEventListener('mousemove', handleMove);
+  window.addEventListener('touchmove', handleMove);
+  window.addEventListener('mouseup', endDrag);
+  window.addEventListener('touchend', endDrag);
+});
+
+// 移除事件监听
+onUnmounted(() => {
+  window.removeEventListener('mousemove', handleMove);
+  window.removeEventListener('touchmove', handleMove);
+  window.removeEventListener('mouseup', endDrag);
+  window.removeEventListener('touchend', endDrag);
+});
+</script>
+
+<style scoped>
+.floating-ball {
+  position: fixed;
+  cursor: pointer;
+  width: 50px;
+  padding: 10px;
+  /* height: 50px; */
+  /* border-radius: 50%; */
+  /* background-color: #409eff; */
+  color: white;
+  /* display: flex;
+  justify-content: center;
+  align-items: center; */
+  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
+  z-index: 9999;
+  user-select: none;
+  /* transition: all 0.3s ease; */
+  transform: translate(-50%, -50%);
+}
+
+.ball-content {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+}
+
+.icon {
+  font-size: 24px;
+}
+
+.floating-ball:active {
+  opacity: 0.8;
+}
+</style>
--- a/src/components/fzq/iframe.vue
+++ b/src/components/fzq/iframe.vue
@ -0,0 +1,57 @@
+<template>
+  <div class="iframe-container">
+    <el-dialog class="dialog-container" :model-value="modelValue" width="75%"  :show-close="false" @close="close">
+      <div style="height: 75vh;">
+        <div class="close" @click="close"><el-icon :size="30"><CircleClose /></el-icon></div>
+        <iframe :src="src" frameborder="0" width="100%" height="100%"></iframe>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+const props = defineProps({
+  modelValue: {
+    type: Boolean,
+    required: true
+  }, title: {
+    type: String,
+    default: '提示'
+  }, showFooter: {
+    type: Boolean,
+    default: true
+  }, src: {
+    type: String,
+    default: ''
+  }
+
+})
+const emit = defineEmits(['update:modelValue', 'submit', 'close'])
+const close = () => {
+  emit('update:modelValue', false)
+  emit('close')
+}
+const submit = () => {
+  emit('submit')
+}
+</script>
+
+<style lang="scss" scoped>
+.iframe-container {
+  ::v-deep .el-dialog__header {
+display: none;
+  }
+.close{
+  position: absolute;
+  top: 0px;
+  right: -35px;
+  cursor: pointer;
+  border-radius: 50%;
+  color: #fff;
+}
+  ::v-deep .el-dialog__body {
+    padding: 0 !important;
+  }
+}
+</style>
--- a/src/components/fzq/index.vue
+++ b/src/components/fzq/index.vue
@ -0,0 +1,256 @@
+<template>
+  <Fxq :initial-position="{ x: position.x, y: position.y }" v-if="showFxq" :snapThreshold="50">
+    <div class="badge-container">
+      <div>
+        <div>
+          <el-tooltip effect="dark" content="林小警" placement="left-start">
+            <img style="width: 34px;height: 34px;"
+              @click.stop="skipIframe(`https://tyyy.lz.dsj.xz/embed/home?userId=${userId}&clientKey=${clientKey}&avatar=''`)"
+              class="box-item" src="@/assets/images/streetBi/lxj.png" />
+          </el-tooltip>
+          <el-tooltip effect="dark" content="切换门户" placement="left-start">
+            <img style="width: 34px;height: 34px;" @click.stop="SwitchSysDialogShow = true" class="box-item"
+              src="@/assets/images/streetBi/sst.png" />
+          </el-tooltip>
+          <el-tooltip effect="dark" content="蜂群消息" placement="left-start">
+            <img style="width: 34px;height: 34px; margin-bottom: 14px;"
+              @click.stop="skipIframe('https://fqxt.lz.dsj.xz:9020/fqxt/?source=other')" class="box-item"
+              src="@/assets/images/streetBi/fq.png" />
+          </el-tooltip>
+        </div>
+        <el-badge :value="xxListData.xtxxNumber" class="item badge-top-left">
+          <div class='fxq fxq1' @click.stop="opneMsg('xtxx')">
+            <div class="title">
+              <img src="@/assets/images/streetBi/xtxx.png" />
+              <span>系统消息</span>
+            </div>
+          </div>
+        </el-badge>
+        <el-badge :value="xxListData.tztgNumber" class="item badge-top-left">
+          <div class='fxq fxq2' @click.stop="opneMsg('tztg')">
+            <div class="title">
+              <img src="@/assets/images/streetBi/tztg.png" />
+              <span>通知通报</span>
+            </div>
+          </div>
+        </el-badge>
+      </div>
+    </div>
+  </Fxq>
+  <Iframe v-model='showIframe' :src='src' />
+  <SwitchSysDialog v-model="SwitchSysDialogShow" />
+  <Information v-model='showDialog' :title='title'>
+    <systemMessages :dict="{ BD_D_XXLX, BD_D_XXLY }" :idEntityCard='idEntityCard' :xxlx="showMsgLx" />
+  </Information>
+</template>
+
+<script setup>
+import { ref, nextTick, provide, onMounted, reactive, getCurrentInstance, onUnmounted } from "vue";
+import { queryWdxxPageList, queryWdxxDetail } from '@/api/commit.js'
+import SwitchSysDialog from '@/components/fzq/SwitchSysDialog.vue'
+import systemMessages from '@/components/fzq/systemMessages.vue'
+import Information from '@/components/fzq/information.vue'
+import Fxq from '@/components/fzq/fxq.vue'
+import { getItem } from '@/utils/storage.js'
+import { getCookie } from '@/utils/cookie'
+import Iframe from '@/components/fzq/iframe.vue'
+import emitter from "@/utils/eventBus.js";
+const { proxy } = getCurrentInstance();
+const { BD_D_XXLX, BD_D_XXLY } = proxy.$dict('BD_D_XXLX', 'BD_D_XXLY'); //获取字典
+const position = reactive({
+  x: window.innerWidth - 30,
+  y: window.innerHeight - 160
+})
+const idEntityCard = ref('')
+const xxListData = reactive({
+  xtxxNumber: 0,
+  tztgNumber: 0
+})
+//请求数据
+const handleClick = () => {
+  let promes = {
+    page: 1,
+    rows: 1,
+    jsrid: idEntityCard.value,
+    xxlx: ""
+  }
+  queryWdxxPageList({ ...promes, xxlx: 100 }).then((res) => {
+    xxListData.xtxxNumber = res.total
+  });
+  queryWdxxPageList({ ...promes, xxlx: 200 }).then((res) => {
+    xxListData.tztgNumber = res.total
+  });
+}
+
+const userId = getItem('USERID')
+const clientKey = getCookie('clientKey')
+const SwitchSysDialogShow = ref(false)
+
+const src = ref()
+const showIframe = ref(false)
+const skipIframe = (val) => {
+  src.value = val
+  showIframe.value = true
+}
+const title = ref('系统消息')
+const showDialog = ref(false)
+const showMsgLx = ref('')
+const showFxq = ref(true)
+const opneMsg = (val) => {
+  showDialog.value = true
+  showMsgLx.value = val
+  switch (val) {
+    case 'xtxx':
+      title.value = '系统消息'
+      break;
+    case 'tztg':
+      title.value = '通知通告'
+      break;
+  }
+}
+const intTime = ref(null)
+onMounted(() => {
+  if (window.parent !== window.self) {
+    showFxq.value = false
+  } else {
+    showFxq.value = true
+  }
+  emitter.on("handleClick", () => {
+    idEntityCard.value = getItem('idEntityCard')
+    handleClick()
+    intTime.value = setInterval(() => {
+      handleClick()
+    }, 60000)
+  });
+
+})
+onUnmounted(() => {
+  clearInterval(intTime.value)
+  emitter.off("handleClick")
+})
+</script>
+<style lang="scss" scoped>
+// 蜂群组件样式
+.fxqx {
+  border-radius: 34px;
+  width: 34px;
+  background-color: rgb(1, 127, 245);
+  margin-bottom: 18px;
+  display: flex;
+  align-items: center;
+  position: relative;
+
+  .title {
+    height: 34px;
+    line-height: 34px;
+    display: flex;
+    align-items: center;
+    white-space: nowrap;
+
+    img {
+      margin-left: 9.5px;
+      width: 16px;
+      margin-right: 10px;
+      vertical-align: middle;
+      height: 16px;
+      flex-shrink: 0;
+    }
+
+    span {
+      opacity: 0;
+      transition: opacity 0.2s ease 0.1s;
+      padding-right: 15px;
+    }
+  }
+}
+
+.fxq {
+  border-radius: 34px;
+  width: 34px;
+  transition: width 0.3s ease;
+  background-color: rgb(1, 127, 245);
+  // overflow: hidden;
+  margin-bottom: 10px;
+  display: flex;
+  align-items: center;
+  position: relative;
+
+  .title {
+    height: 34px;
+    line-height: 34px;
+    display: flex;
+    align-items: center;
+    white-space: nowrap;
+
+    img {
+      margin-left: 9.5px;
+      width: 16px;
+      margin-right: 10px;
+      vertical-align: middle;
+      height: 16px;
+      flex-shrink: 0;
+    }
+
+    span {
+      opacity: 0;
+      transition: opacity 0.2s ease 0.1s;
+      padding-right: 15px;
+    }
+  }
+}
+
+.fxq2 {
+  background-color: #9d88f9;
+}
+
+.fxq3 {
+  background-color: #00c07f;
+}
+
+.fxq:hover {
+  width: 120px;
+}
+
+.fxq:hover .title span {
+  opacity: 1;
+}
+
+.item {
+  margin-bottom: 10px;
+}
+
+
+
+.box-item {
+
+  margin-bottom: 10px;
+}
+
+.badge-content {
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  transition: all 0.3s ease;
+  max-height: 200px;
+  /* 默认展开的最大高度 */
+  min-height: 0;
+  /* 确保收缩时有足够空间显示第一个图标 */
+}
+
+.badge-content:not(.expanded) {
+  max-height: 0;
+}
+
+/* 收缩时只显示第一个图标，隐藏其他内容 */
+.badge-content:not(.expanded)> :not(:first-child) {
+  opacity: 0;
+  max-height: 0;
+  margin: 0;
+  padding: 0;
+  overflow: hidden;
+}
+
+::v-deep .el-badge__content.is-fixed {
+  right: calc(100% + 6px);
+}
+</style>
--- a/src/components/fzq/information.vue
+++ b/src/components/fzq/information.vue
@ -0,0 +1,53 @@
+<template>
+ <el-dialog class="dialog-container"
+   :model-value="modelValue"
+    :title="title"
+    :before-close="close" :destroy-on-close="true"
+
+  >
+
+     <slot></slot>
+    <template #footer v-if="showFooter">
+      <div class="dialog-footer"  >
+        <el-button @click="close">取消</el-button>
+        <el-button type="primary" @click="submit">
+          确认
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import {ref} from 'vue'
+const props=defineProps({
+  modelValue: {
+    type: Boolean,
+    required: true
+  },title:{
+    type:String,
+    default:'提示'
+  },showFooter:{
+    type:Boolean,
+    default:true
+  }
+
+})
+const emit=defineEmits(['update:modelValue','submit','close'])
+const close = () => {
+  emit('update:modelValue',false)
+  emit('close')
+}
+const submit=()=>{
+  emit('submit')
+}
+</script>
+
+<style lang="scss" scoped>
+// @import "@/assets/css/homeScreen.scss";
+::v-deep .el-dialog__body{
+  padding-top: 0 !important;
+  padding-bottom: 0 !important;
+}
+
+</style>
--- a/src/components/fzq/systemMessages.vue
+++ b/src/components/fzq/systemMessages.vue
@ -0,0 +1,184 @@
+<template>
+  <!-- <el-button type="success" style='position: absolute;right:30px;'>一键忽略</el-button> -->
+  <el-tabs v-model="activeName" class="demo-tabs" @tab-click="chageHandle">
+    <el-tab-pane label="未查看" name="first">
+      <MyTable customClass="zdy_peo_table" :tableData="pageData.tableData" :tableColumn="pageData.tableColumn"
+        :tableHeight="pageData.tableHeight" :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger"
+        :controlsWidth="pageData.controlsWidth">
+        <template #xxly="{ row }">
+          <DictTag :tag="false" :value="row.xxly" :options="dict.BD_D_XXLY" />
+        </template>
+        <template #xxlx="{ row }">
+          <DictTag :tag="false" :value="row.xxlx" :options="dict.BD_D_XXLX" />
+        </template>
+        <template #controls="{ row }">
+          <el-button size="small" type="primary" @click="handleDetail(row)">查看</el-button>
+        </template>
+      </MyTable>
+      <Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
+        ...pageData.pageConfiger,
+        total: pageData.total
+      }"></Pages>
+    </el-tab-pane>
+    <el-tab-pane label="已查看" name="second">
+      <MyTable customClass="zdy_peo_table" :tableData="pageData.tableData" :tableColumn="pageData.tableColumn"
+        :tableHeight="pageData.tableHeight" :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger"
+        :controlsWidth="pageData.controlsWidth">
+        <template #xxly="{ row }">
+          <DictTag :tag="false" :value="row.xxly" :options="dict.BD_D_XXLY" />
+        </template>
+        <template #xxlx="{ row }">
+          <DictTag :tag="false" :value="row.xxlx" :options="dict.BD_D_XXLX" />
+        </template>
+        <template #controls="{ row }">
+          <el-button size="small" type="primary" @click="handleDetail(row)">查看</el-button>
+        </template>
+      </MyTable>
+      <Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
+        ...pageData.pageConfiger,
+        total: pageData.total
+      }"></Pages>
+    </el-tab-pane>
+  </el-tabs>
+  <Information v-model='showDialog' title='消息详情' :showFooter="false">
+    <Xtxi :item="msgDetail" v-if="xxlx == 'xtxx'" :dict="dict" />
+  </Information>
+</template>
+<script setup>
+import { ref, reactive } from 'vue'
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import Pages from "@/components/aboutTable/Pages.vue";
+import Information from "./information.vue";
+import { queryYdxxPageList, queryWdxxPageList, queryWdxxDetail, queryYdxxDetail, qsXx } from '@/api/commit.js'
+import Xtxi from './xtxi.vue'
+const props = defineProps({
+  dict: {
+    type: Object,
+    default: () => {
+    }
+  }, idEntityCard: {
+    type: String,
+    default: ''
+  }, xxlx: {
+    type: String,
+    default: 'xtxx'
+  }
+})
+const activeName = ref('first')
+const pageData = reactive({
+  tableData: [],
+  keyCount: 0,
+  tableConfiger: {
+    loading: false,
+    rowHieght: 40,
+    haveControls: true,
+  },
+  controlsWidth: 160, //操作栏宽度
+  total: 0,
+  pageConfiger: {
+    pageSize: 20,
+    pageCurrent: 1
+  }, //分页
+  tableColumn: [
+    { label: "消息标题", prop: "xxbt", showOverflowTooltip: true },
+    { label: "消息来源", prop: "xxly", showOverflowTooltip: true, showSolt: true },
+    { label: "消息描述", prop: "xxms", showOverflowTooltip: true },
+    { label: "消息类型", prop: "xxlx", showOverflowTooltip: true, showSolt: true },
+  ], tableHeight: "calc(80vh - 350px)",
+});
+const chageHandle = () => {
+  pageData.pageConfiger.pageCurrent = 1
+  pageData.pageConfiger.pageSize = 20
+  handleClick()
+}
+//请求数据
+const handleClick = async () => {
+  let promes = {
+    page: pageData.pageConfiger.pageCurrent,
+    rows: pageData.pageConfiger.pageSize,
+    jsrid: props.idEntityCard,
+    xxlx: ""
+  }
+  switch (props.xxlx) {
+    case 'xtxx':
+      promes.xxlx = 100
+      const res = activeName.value == 'first' ? await queryWdxxPageList(promes) : await queryYdxxPageList(promes)
+      pageData.tableData = res.rows
+      pageData.total = res.total
+      break;
+    case 'tztg':
+      promes.xxlx = 200
+      const tztgRes = activeName.value == 'first' ? await queryWdxxPageList(promes) : await queryYdxxPageList(promes)
+      pageData.tableData = tztgRes.rows
+      pageData.total = tztgRes.total
+      break;
+    default:
+      break;
+  }
+}
+const changeNo = (val) => {
+  pageData.pageConfiger.pageCurrent = val
+  handleClick()
+}
+const changeSize = (val) => {
+  pageData.pageConfiger.pageSize = val
+  handleClick()
+}
+handleClick()
+// 查看详情
+const showDialog = ref(false)
+const msgDetail = ref({})
+const disposition = (item) => {
+  let arrId = ''
+  if (Array.isArray(item)) {
+    const itemMap = item.map(it => {
+      return it.id
+    })
+    arrId = itemMap.join(',')
+  } else {
+    arrId = item.id
+  }
+  const promes = {
+    xxlx: '100',
+    id: arrId
+  }
+  qsXx(promes).then((result) => {
+    handleClick()
+  }).catch((err) => {
+    console.log(err);
+
+  });
+}
+const handleDetail = async (item) => {
+  showDialog.value = true
+  const res = activeName.value == 'first' ? await queryWdxxDetail({ id: item.id }) : await queryYdxxDetail({ id: item.id })
+  if (res) {
+    msgDetail.value = res[0]
+    if (msgDetail.value.qszt == '0') {
+      disposition(item)
+    }
+  }
+
+}
+</script>
+
+<style lang="scss" scoped>
+// @import "@/assets/css/homeScreen.scss";
+
+.zdy_peo_table td.el-table__cell {
+  color: #ffffff !important;
+}
+
+.zdy_peo_table th.el-table__cell {
+  color: #ffffff !important;
+  font-size: 15px;
+}
+
+.zdy_peo_table .el-table__body tr.el-table__row--striped td.el-table__cell {
+  background: transparent !important;
+}
+
+.zdy_peo_table .table_blue_row {
+  background: linear-gradient(to right, #001D4B 0%, rgba(0, 29, 75, 0.1) 100%) !important;
+}
+</style>
--- a/src/components/fzq/xtxi.vue
+++ b/src/components/fzq/xtxi.vue
@ -0,0 +1,53 @@
+<template>
+    <div style="height: 300px;overflow: auto;font-size: 16px;">
+      <div>通知标题：{{ item.xxbt }}</div>
+      <div class="mt">通知内容：{{ item.xxms }}</div>
+      <div class="flex align-center just-between mt">
+        <div class="flex align-center">接收类型：
+          <DictTag :tag="false" :value="item.xxlx" :options="dict.BD_D_XXLX" />
+        </div>
+        <div class="flex align-center">消息来源：
+          <DictTag :tag="false" :value="item.xxly" :options="dict.BD_D_XXLY" />
+        </div>
+      </div>
+    </div>
+</template>
+<script setup>
+import {ref} from 'vue'
+const props = defineProps({
+  item: {
+    type: Object,
+    default: () => {
+    }
+  }, dict: {
+    type: Object,
+    default: () => {
+    }
+  },
+})
+</script>
+
+<style lang="scss" scoped>
+// @import "@/assets/css/homeScreen.scss";
+
+.zdy_peo_table td.el-table__cell {
+  color: #ffffff !important;
+}
+
+.zdy_peo_table th.el-table__cell {
+  color: #ffffff !important;
+  font-size: 15px;
+}
+
+.zdy_peo_table .el-table__body tr.el-table__row--striped td.el-table__cell {
+  background: transparent !important;
+}
+
+.zdy_peo_table .table_blue_row {
+  background: linear-gradient(to right, #001D4B 0%, rgba(0, 29, 75, 0.1) 100%) !important;
+}
+
+.mt {
+  margin-top: 20px;
+}
+</style>