Merge branch 'main' of http://183.222.39.242:3000/zy_oyj/sgxt_web

.env.development

@@ -4,5 +4,5 @@ ENV='development'
 # base api
 # VUE_APP_BASE_API = '/api'
 VUE_APP_GATEWAY_API = '/mosty-api/mosty-base'
-VUE_APP_GATEWAY_BASE_URL = 'http://123.60.110.230'
+VUE_APP_GATEWAY_BASE_URL = 'http://172.20.19.62'
 VUE_APP_GATEWAY_HOST = '123.60.110.230'

node.js

@@ -1,5 +0,0 @@
-const express = require('express')
-const app = express()
-app.get('/', (req, res) => res.send('Hello World!'))
-app.use(express.static('./www'))
-app.listen(3000, () => console.log('Example app listening on port 3000!'))

package.json

@@ -16,14 +16,18 @@
     "@fullcalendar/timegrid": "^5.9.0",
     "@fullcalendar/vue3": "^5.9.0",
     "@types/video.js": "^7.3.42",
+    "@wangeditor/editor": "^5.1.23",
+    "@wangeditor/editor-for-vue": "^5.1.12",
     "axios": "^0.26.0",
     "core-js": "^3.6.5",
     "echarts": "^5.3.3",
     "echarts-gl": "^2.0.9",
+    "el-table-infinite-scroll": "^3.0.6",
     "element-plus": "2.0.2",
     "gifler": "^0.1.0",
     "lodash": "^4.17.21",
     "mitt": "^3.0.0",
+    "moment": "^2.30.1",
     "ol": "^6.14.1",
     "pinia": "^3.0.1",
     "vue": "^3.2.8",

public/index.html

@@ -20,6 +20,8 @@
     <%= htmlWebpackPlugin.options.title %>
   </title>
 
+    <!-- 地图 -->
+    <script type="text/javascript" src="./pgis/eliMapboxgl.min.js"></script>
 
   <!-- 视频 -->
   <script src="./static/js/vconsole.min.js"></script>

src/App.vue

@@ -49,7 +49,8 @@ li {
   -moz-osx-font-smoothing: grayscale;
   color: #fff;
   overflow-x: auto;
-  background: #263445;
+  // background: #263445;
+  background: #fff;
 }
 
 //只显示一排内容

src/assets/css/homeScreen.scss

@@ -6,35 +6,62 @@
 .homeBox{
     width: 100%;
     height: 100vh;
-    .home-contant{
+    .home-aside{
       position: relative;
+      width: 442px;
       top: 70px;
-      width: 100%;
+      height: 100%;
       height: calc(100vh - 72px);
       overflow: hidden;
-      z-index: 2;
-      .home-aside{
-        width: 442px;
-        height: 100%;
-        z-index: 10;
+      z-index: 10;
+      .asideTitle{
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        padding: 0 10px;
+        box-sizing: border-box;
+        background: linear-gradient( 90deg, #124CB3 0%, rgba(18,76,179,0.23) 77%, rgba(18,76,179,0) 100%);
+        border-radius: 0px 0px 0px 0px;
+        height: 40px;
+        .title{
+            font-weight: bold;
+            font-size: 16px;
+            color: #FFFFFF;
+            margin-right: 20px;
+        }
       }
-      .homeBtn{
-        height: 302px;
-        width: calc(100% - 894px);
-        position: absolute;
-        bottom: 2px;
-        left: 50%;
-        transform: translateX(-50%);
+      .asideCnt{
+        height: calc(100% - 40px);
       }
+      .aside-middle{
+          height: calc(100%/2);
+          padding: 4px;
+          box-sizing: border-box;
+      }
+    }
+    .homeBtn{
+      height: 302px;
+      width: calc(100% - 894px);
+      position: absolute;
+      bottom: 2px;
+      left: 50%;
+      transform: translateX(-50%);
     }
     // 头部
     .headBox {
       position: fixed;
       top: 0;
       width: 100%;
-      height: 151px;
-      background: url("~@/assets/images/home_head.png") no-repeat center center;
-      background-size: 100% 100%;
+      height: 70px;
+      background: rgba(0,0,0,0.8);
+      z-index: 2;
+      .headBoxBg{
+        width: 100%;
+        height: 100%;
+        background: url("~@/assets/images/home_head.png") no-repeat center center;
+        background-size: 100% 100%;
+        height: 151px;
+      }
       .top-center {
         position: absolute;
         left: 50%;
@@ -44,14 +71,7 @@
         letter-spacing: 2px;
         font-family: "YSBTH";
         white-space: nowrap;
-        background-image: linear-gradient(
-          72deg,
-          #0072ff 0%,
-          #00ffff 18%,
-          #07e9ff 51%,
-          #00ffff 83%,
-          #0072ff 100%
-        );
+        background: linear-gradient(180deg, #FFFFFF 0%, #66B5FF 100%);
         -webkit-background-clip: text;
         -webkit-text-fill-color: transparent;
         text-shadow: 4px 4px 4px rgba(54, 255, 243, 0.15);
@@ -59,7 +79,7 @@
       .topBtn {
         display: flex;
         position: absolute;
-        top: 15%;
+        top: 22px;
         .topBtn-item {
           width: 190px;
           height: 38px;
@@ -76,26 +96,10 @@
             @include textColor(#a1d6ff, #ffffff);
           }
         }
-        .yjbtn{
-          width: 155px;
-          height: 38px;
-          line-height: 38px;
-          text-align: center;
-          background: url("~@/assets/images/home_btns.png") no-repeat center center;
-          background-size: 100% 100%;
-          font-size: 16px;
-          font-family: "YSBTH";
-          .btms{
-            @include textColor(#a1d6ff, #ffffff);
-          }
-        }
-        .yjbtnActive{
-          // background: url("~@/assets/images/home_btns_active.png") no-repeat center center;
-          // background-size: 100% 100%;
-        }
+        
       }
       .topBtn-left {
-        left: 5px;
+        left: 30px;
         font-size: 12px;
         .text {
           font-family: "YSBTH";
@@ -105,8 +109,34 @@
           color: #0a99ff;
         }
       }
+      .leftBtn-yjbtn{
+        position: absolute;
+        left: 360px;
+        top: 20px;
+        .leftBtn-item{
+          width: 155px;
+          height: 38px;
+          line-height: 38px;
+          text-align: center;
+          background: url("~@/assets/images/home_btns.png") no-repeat center center;
+          background-size: 100% 100%;
+          font-size: 16px;
+          font-family: "YSBTH";
+        }
+        .btms{
+          @include textColor(#a1d6ff, #ffffff);
+        }
+      }
+      .yjbtnActive{
+        background: url("~@/assets/images/home_btns_active.png") no-repeat center center;
+        background-size: 100% 100%;
+        .btms{
+          @include textColor(#00ffff, #faff00);
+        }
+      }
       .topBtn-right {
-        right: 170px;
+        right: 270px;
+        top: 22px;
         .topBtn-item {
           background: url("~@/assets/images/home_btns_right.png") no-repeat center
             center;
@@ -124,8 +154,9 @@
       .rightIcon {
         position: absolute;
         right: 20px;
-        top: 20%;
+        top: 22px;
         font-size: 17px;
+        z-index: 9;
         span {
           color: #0bb7ff;
           cursor: pointer;
@@ -139,7 +170,7 @@
     .asideL{
       position: absolute;
       box-sizing: border-box;
-      left: 10px;
+      left: 0px;
       .asideL-top{
         width: 100%;
         height: 141px;
@@ -157,7 +188,7 @@
     // 右边
     .asideR{
       position: absolute;
-      right: 10px;
+      right: 0px;
       .commom-aside-small{
         height: calc(((100% - 146px) /3) - 6px);
         background: #052249;
@@ -173,20 +204,24 @@
     .home-center{
       position: absolute;
       left: 50%;
-      top: 0px;
+      top: 70px;
       transform: translateX(-50%);
-      width: calc(100% - 920px);
+      width: calc(100% - 890px);
       height: 80px;
+      z-index: 9;
+      background: #fff;
     }
-    .home-foot{
+
+    .home-foot-t{
       position: absolute;
       left: 50%;
-      bottom: 0px;
+      bottom: 2px;
       transform: translateX(-50%);
       width: calc(100% - 920px);
-      height: calc((100% - 141px)/3 - 9px);
+      height: calc((100% - 141px)/3 - 32px);
       min-width: 560px;
       overflow: hidden;
+      z-index: 9;
       background: url("~@/assets/images/right-1.png") no-repeat center center;
       background-size: 100% 100%;
       .comom-title{

src/assets/css/layout.scss

@@ -99,7 +99,7 @@ header {
   left: 10px;
   background-color: #fff;
   z-index: 998;
-  color: #fff;
+  color: #333;
   padding: 20px;
   box-sizing: border-box;
   .head_box {
@@ -160,13 +160,12 @@ header {
   &::v-deep .el-textarea__inner {
     height: 7.5em;
     border: 1px solid #F1F4F8;
-    // background-color: #02163b;
   }
   
 }
 
 .searchBox {
-  padding: 15px 15px 0 15px;
+  padding: 15px;
   border-radius: 1px;
   position: relative;
   background: #fff;
@@ -211,7 +210,7 @@ header {
     position: relative;
     background: #fff;
     border-radius: 4px;
-    height: calc(100vh - 124px);
+    height: calc(100vh - 327px);
     .el-table--fit {
       width: calc(100% - 20px) !important;
       position: absolute;

src/components/DictTag/index.vue

@@ -7,7 +7,7 @@
           :key="item.value"
           :index="index"
           :class="item.elTagType"
-          >{{ item.label }}</span>
+          >{{ item.label || item.zdmc }}</span>
         <el-tag
           v-else
           :disable-transitions="true"
@@ -15,7 +15,7 @@
           :index="index"
           :type="item.elTagType === 'primary' ? '' : item.elTagType"
           :class="item.elTagType"
-          >{{ item.label }}</el-tag
+          >{{ item.label || item.zdmc }}</el-tag
         >
       </template>
     </template>

src/components/GdMap/index.vue

@@ -0,0 +1,348 @@
+<template>
+  <div :id="mapid" class="map"></div>
+  <div class="changeMap_box" v-if="props.isShow">
+    <el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况" style="--el-switch-color:#13ce66;--el-switch-off-color:#ff4949;" />
+    <!-- <el-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3"  @change="onMapImageChange">
+      <el-carousel-item>
+        <div class="mapImageItem">
+          <img :src="require('@/assets/images/slt.jpg')" alt="" />
+          <div>栅格浅色</div>
+        </div>
+      </el-carousel-item>
+      <el-carousel-item>
+        <div class="mapImageItem">
+          <img :src="require('@/assets/images/yxt.jpg')" alt="" />
+          <div>影像图</div>
+        </div>
+      </el-carousel-item>
+      <el-carousel-item>
+        <div class="mapImageItem">
+          <img :src="require('@/assets/images/yst.jpg')" alt="" />
+          <div>栅格深色</div>
+        </div>
+      </el-carousel-item>
+      <el-carousel-item>
+        <div class="mapImageItem">
+          <img :src="require('@/assets/images/shy.png')" alt="" />
+          <div>三合一</div>
+        </div>
+      </el-carousel-item>
+    </el-carousel> -->
+    <!-- 地图缩放 -->
+    <div class="zoomTargetBox">
+      <el-input-number :min="7" :max="18" v-model="zoomTarget" :step="1" step-strictly @change="handleZoom">
+      </el-input-number>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted, onUnmounted, defineProps, nextTick } from "vue";
+import { MapUtil } from "./mapUtil";
+import emitter from "@/utils/eventBus.js";
+import { getItem } from "@/utils/storage";
+const conditionRoute = ref(true); //路况
+const mMap = ref(null); //地图对象
+const mapUtil = ref(null); //地图工具对象
+const zoomTarget = ref(6);
+
+const props = defineProps({
+  mapid: {
+    type: String,
+    default: "mapDiv"
+  },
+  //是否显示可以切换地图底图
+  isShow: {
+    type: Boolean,
+    default: false
+  },
+  //是否显示实时路况
+  isShowMvt: {
+    type: Boolean,
+    default: false
+  },
+  //是否显示地图层级
+  isShowZoom: {
+    type: Boolean,
+    default: false
+  },
+  //是否显示绘制控件
+  isShowDraw: {
+    type: Boolean,
+    default: false
+  }
+});
+try {
+  const userInfo = getItem("deptId")[0].deptCode;
+} catch (error) {}
+let map;
+let mapLayer;
+let mapLayer1;
+onMounted(() => {
+  emitter.on("followUp", (res) => {
+    let box = document.getElementsByClassName("changeMap_box");
+    if (!box) return;
+    box[0].style.right = !res ? "4px" : "398px";
+    box[0].style.transition = "0.5s";
+  });
+  
+  map = new EliMap({
+    id: props.mapid,
+    crs: "EPSG:3857",
+    style: {
+      glyphs: "./fonts/{fontstack}/{range}.pbf",
+      center: [94.36,29.65],
+      zoom: 10
+    },
+    transformRequest: (url) => {
+      if (url.indexOf("TileMatrix=") != -1) {
+        const arr = url.split("TileMatrix=");
+        const arr1 = arr[1].split("&");
+        const nurl = `${arr[0]}&TileMatrix=${Number(arr1[0])}&${arr1[1]}&${arr1[2]}`;
+
+      }
+    }
+  });
+
+  window.map = map;
+  map.mapboxGLMap.on("load", () => {
+     map.addGaudLayer({
+      url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
+    })
+    zoomTarget.value = map.mapboxGLMap.getZoom();
+  });
+  mapUtil.value = new MapUtil(map);
+
+  mapUtil.value.Drawplot(); //初始化加载绘制工具
+
+  // 设置地图中心点及图层
+  emitter.on("setMapCenter", (res) => {
+    mapUtil.value.setMapCenter(res.location, res.zoomLevel);
+  });
+
+  emitter.on("removePlot", (flag) => {
+    mapUtil.value.removePlot(flag);
+  });
+  emitter.on("removeAll", (flag) => {
+    mapUtil.value.removeAll(flag);
+  });
+  // 撒点
+  emitter.on("addPointArea", (obj) => {
+    mapUtil.value.makerSki(obj);
+  });
+  // 鼠标滑过提示文字的点位
+  emitter.on("showPoint", (obj) => {
+    mapUtil.value.showPoint(obj);
+  });
+
+  // 清除覆盖物
+  emitter.on("deletePointArea", (res) => {
+    mapUtil.value.removeElement(res);
+  });
+  // 清除某个覆盖物的单个
+  emitter.on("deletePointAreaOne", (obj) => {
+    mapUtil.value.removeElementOne(obj.flag, obj.id);
+  });
+
+  // 清除某个覆盖物的单个
+  emitter.on("showSquire", (obj) => {
+    mapUtil.value.zdySquire(obj);
+  });
+
+  // 绘制图形 - 回显区域
+  emitter.on("drawShape", (res) => {
+    mapUtil.value.plot(res, resFun);
+  });
+  emitter.on("removeEara", (flag) => {
+    mapUtil.value.removeEara(flag);
+  });
+  // 回显图形
+  emitter.on("echoPlane", (res) => {
+    mapUtil.value.echoPlane(res);
+  });
+  //移除绘制区域
+  emitter.on("removeEara", (flag) => {
+    mapUtil.value.removeEara(flag);
+  });
+  // 回显线
+  emitter.on("echoLine", (res) => {
+    mapUtil.value.createLine(res, res.flag);
+  });
+  //创建边界面（geojson）
+  emitter.on("setBoundarys", (res) => {
+    mapUtil.value.createBoundarys(res);
+  });
+  // 移除边界
+  emitter.on("removeBj", (res) => {
+    mapUtil.value.removeBj(res);
+  });
+
+  // 轨迹回放
+  emitter.on("drawLineAnimation", (res) => {
+    mapUtil.value.displayLineAnimation(res);
+  });
+
+  // 聚合撒点
+  emitter.on("addPoint", (obj) => {
+    mapUtil.value.aggregateScatteringPoint(obj);
+  });
+
+  // 热力图显示
+  emitter.on("thermodynamicChart", (res) => {
+    mapUtil.value.showHeatDrawing(res);
+  });
+
+  // 扩散圆
+  emitter.on("diffusionCircle", (res) => {
+    mapUtil.value.diffusionCircle(res);
+  });
+
+  // 展示盘曲
+  emitter.on("showGapText", (obj) => {
+    mapUtil.value.gapText(obj);
+  });
+
+  // 获取当前地图中心点
+  emitter.on("getCurrentCenter", (res) => {
+    let centerPoint = map.mapboxGLMap.getCenter();
+    let coords = [centerPoint.lng, centerPoint.lat];
+    emitter.emit("getcentercoord", coords);
+  });
+});
+//切换地图底图
+const onMapImageChange = (val) => {
+  //清除已经存在胡地图图层
+  if (map.mapboxGLMap.getLayer("SGQS_ID"))
+    map.mapboxGLMap.removeLayer("SGQS_ID");
+  if (map.mapboxGLMap.getLayer("YX_ID")) map.mapboxGLMap.removeLayer("YX_ID");
+  if (map.mapboxGLMap.getLayer("SGSG_ID"))
+    map.mapboxGLMap.removeLayer("SGSG_ID");
+  if (map.mapboxGLMap.getLayer("TDT_TITLE_ID"))
+    map.mapboxGLMap.removeLayer("TDT_TITLE_ID");
+  if (map.mapboxGLMap.getLayer("TDT_ROAD_ID"))
+    map.mapboxGLMap.removeLayer("TDT_ROAD_ID");
+  if (map.mapboxGLMap.getLayer("TDT_POI_ID"))
+    map.mapboxGLMap.removeLayer("TDT_POI_ID");
+  //设置图层
+  switch (val) {
+    case 0:
+      mapSetLayer("SGQS_ID", "SGQS");
+      break;
+    case 1:
+      mapSetLayer("YX_ID", "YX");
+      break;
+    case 2:
+      mapSetLayer("SGSG_ID", "SGSG");
+      break;
+    case 3:
+      mapSetLayer("TDT_TITLE_ID", "TDT_TITLE_SOURCES");
+      mapSetLayer("TDT_ROAD_ID", "TDT_ROAD_SOURCES");
+      mapSetLayer("TDT_POI_ID", "TDT_POI_SOURCES");
+      break;
+  }
+  if (map.mapboxGLMap.getLayer("realTimeTrafficlevelOne"))
+    map.mapboxGLMap.moveLayer("realTimeTrafficlevelOne");
+  if (map.mapboxGLMap.getLayer("map_id")) map.mapboxGLMap.moveLayer("map_id");
+  if (map.mapboxGLMap.getLayer("map_ids")) map.mapboxGLMap.moveLayer("map_ids");
+};
+
+//设置图层函数
+const mapSetLayer = (id, source) => {
+  map.mapboxGLMap.addLayer({ id, type: "raster", source });
+};
+
+//获取地图绘制的数据
+const resFun = (coord, type, flag, data) => {
+  
+  emitter.emit("coordString", {
+    coord: coord,
+    type: type,
+    flag: flag,
+    data: data
+  });
+};
+
+// 地图层级
+const handleZoom = (val) => {
+  map.mapboxGLMap.setZoom(val);
+};
+
+// 是否打开或者关闭路况
+const handleSwitch = (val) => {
+  if (val) {
+    // 打开
+  } else {
+    // 关闭
+  }
+};
+
+onUnmounted(() => {
+  emitter.off("removePlot");
+  emitter.off("setMapCenter");
+  emitter.off("addPointArea");
+  emitter.off("showPoint");
+  emitter.off("deletePointArea");
+  emitter.off("deletePointAreaOne");
+  emitter.off("drawShape");
+  emitter.off("echoPlane");
+  emitter.off("removeEara");
+  emitter.off("echoLine");
+  emitter.off("addPoint");
+  emitter.off("thermodynamicChart");
+  emitter.off("drawLineAnimation");
+  emitter.off("aggregateScatteringPoint");
+  emitter.off("hotmap");
+  emitter.off("setBoundarys");
+  emitter.off("diffusionCircle");
+  emitter.off("SsCircle");
+  emitter.off("ClearssCircle");
+});
+</script>
+
+<style lang="scss" scoped>
+.map {
+  width: 100%;
+  height: 100%;
+  background-color: aliceblue;
+  position: absolute;
+  left: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  margin: auto;
+  z-index: 1;
+}
+
+.changeMap_box {
+  position: absolute;
+  right: 398px;
+  bottom: 4px;
+  z-index: 9;
+  .mapImageItem {
+    border: 1px solid #08aae8;
+    background: rgb(9, 26, 70);
+    & > img {
+      width: 100%;
+      height: 50px;
+    }
+    & > div {
+      text-align: center;
+      position: relative;
+      top: -3px;
+    }
+  }
+  .zoomTargetBox {
+    margin-top: 10px;
+    margin-left: 23px;
+  }
+  ::v-deep .el-input-number__decrease,
+  ::v-deep .el-input-number__increase {
+    background: #133362;
+    color: #fff;
+    border: none;
+  }
+  ::v-deep .el-input__inner {
+    background: #0c1641;
+  }
+}
+</style>

src/components/GdMap/mapUtil.js

@@ -0,0 +1,777 @@
+import emitter from "@/utils/eventBus.js";
+
+export function MapUtil(map) {
+  let _that = this;
+  _that.mMap = map; //地图对象
+  _that._self = {};//图层对象
+  _that._CustomDraw = null;//自定义绘图
+  _that.polygonGeo = null;//边界
+  _that.idsBox = {} //存放id的容器（需要某个标记单个删除的时候存储）
+  _that.isCheck = false
+  /**
+   * 设置地图中心点以 
+   * @param {*} location 中心坐标 [jd,wd]
+   * @param {*} zoomLevel 层级  10
+   */
+  MapUtil.prototype.setMapCenter = (location, zoomLevel) => {
+    map.mapboxGLMap.setCenter(location);
+    map.mapboxGLMap.setZoom(zoomLevel);
+  };
+
+  /**
+   * 撒点.鼠标滑动展示内容
+   * @param {*} coords 坐标 geojson
+   * @param {*} icon 图标
+   * @param {*} flag 标识
+   */
+  MapUtil.prototype.showPoint = (res) => {
+    let { coords, icon, flag, iconH } = res
+    if (!coords) return;
+    if (!_that._self[flag]) _that._self[flag] = [];
+    let pointList = coords.map((it, index) => {
+      let text = it.kfdMc || it.wzBc || it.gajgmc || it.xm || it.jczmc;
+      let obj = {
+        position: [it.jd, it.wd],
+        userData: { deviceSn: 'text' + index, area: text },
+        id: it.id,
+        text: text,
+        data: it
+      }
+      if (it.jd && it.wd) return obj;
+    });
+
+    const point = map.createdPoint(pointList, {
+      image: icon,//对应上面的图片名称
+      scale: 1,
+      highlightImage: iconH ? iconH : icon,//高亮图标
+      labelOption: {
+        pixelOffset: [0, -2],
+        allShow: false,
+        fontSize: '18px',
+        fontWeight: 600,
+        fontColor: '#000000'
+      }
+    })
+    _that._self[flag].push(point)
+
+
+    point.addEventListener("click", (val) => {
+      let data = val.data ? JSON.parse(val.data) : {};
+      // point.highlight(data.id) //高亮展示选中的点位
+      _that.openInfoDetail(flag, [data]) //点击打开详情
+    })
+  }
+
+  /**
+   * 撒点
+   * @param {*} coords 坐标 geojson
+   * @param {*} icon 图标
+   * @param {*} flag 标识
+   * @param {*} showTitle 是否展示标题
+   */
+
+  MapUtil.prototype.makerSki = (res) => {
+    let { coords, icon, flag, showTitle } = res
+    if (!coords) return;
+    if (!_that._self[flag]) _that._self[flag] = []; //存储地图标识的容器
+    if (!_that.idsBox[flag]) _that.idsBox[flag] = []; //存储id的容器
+    if (flag == 'rx') {
+      _that.handlePolice(coords, icon, flag, showTitle)
+    } else {
+      coords.forEach(item => {
+        let el = document.createElement("img");
+        el.src = item.icon || icon;
+        el.style.width = flag == 'kfd' ? '32px' : "25px";
+        if (flag.includes('jczMap_')) el.style.width = '45px';
+        if (showTitle) _that.makerShowTitle(item, [item.jd, item.wd], flag) //展示标题
+        const marker = map.Marker(el, [item.jd, item.wd], { anchor: 'bottom', offset: [0, 0] })
+        el.addEventListener("click", () => {
+          _that.openInfoDetail(flag, item) //点击打开详情
+        })
+        _that._self[flag].push(marker)
+        _that.idsBox[flag].push(item.id)
+      });
+    }
+  };
+
+
+  // 警力处理展示
+  MapUtil.prototype.handlePolice = (coords, icon, flag, showTitle) => {
+    // 01-大型车辆-DXCL， 02-小型车辆=XXCL，03-摩托车-MTC，04-其他车辆-QTCL，05-重型车辆-ZXCL，06-风控车-FKC，07-巡逻车-XLC，08-装甲车-ZJC
+    coords.forEach(item => {
+      let el = document.createElement("img");
+      let jcIcon = require(`@/assets/point/police-car-bx.png`);
+      switch (item.lx) {
+        case '01': // 特警
+          jcIcon = require(`@/assets/point/specialPolice.png`);
+          break;
+        case '02': // 交警
+          jcIcon = require(`@/assets/point/trafficPolice.png`);
+          break;
+        case '03': // 派出所民警
+          jcIcon = require(`@/assets/point/peoplePolice.png`);
+          break;
+        default: // 默认图标
+          jcIcon = require(`@/assets/point/specialPolice.png`);
+          break;
+      }
+      if (item.zzlx == 1) jcIcon = require(`@/assets/point/by.png`); //便衣
+      let cllxList = item.cllx ? item.cllx.split(',') : [];
+
+      if ((cllxList.includes('03') || cllxList.includes('04')) && item.lx == '02') jcIcon = require(`@/assets/point/xljmtc.png`); //交警-摩托车
+      if ((cllxList.includes('03') || cllxList.includes('04')) && item.lx == '01') jcIcon = require(`@/assets/point/tjc.png`); //特警-摩托车
+      if (cllxList.includes('08') || cllxList.includes('06')) jcIcon = require(`@/assets/point/zjc.png`); //装甲车
+
+      el.src = jcIcon;
+      let isShoeCar = cllxList.includes('03') || cllxList.includes('08') //车辆类型
+      // el.style.width = isShoeCar ? '38px':"25px"; //图片大小
+      // if(cllxList.includes('08')) el.style.height = '40px'
+      if (showTitle) _that.makerShowTitle(item, [item.jd, item.wd], flag) //展示标题
+      _that.shouIcon(item, [item.jd, item.wd]); // 展示装备图标
+
+      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 })
+      el.addEventListener("click", () => {
+        _that.openInfoDetail(flag, item) //点击打开详情
+      })
+      _that._self[flag].push(marker)
+      _that.idsBox[flag].push(item.id)
+    });
+  }
+
+  // 信息框展示
+  MapUtil.prototype.makerShowTitle = (item,points,flag,text) =>{
+    let T = flag == 'rx' ? 'rxTitle' :'Title'
+    let flagT = flag+T;
+    if(!_that._self[flagT]) _that._self[flagT] = [];
+
+    // 展示名字
+    let textTitle = item.jzMc ? item.jzMc : item.fzrXm + '警组';
+    if (flag == 'sbwz_car' || flag == 'sbwz_sb' || flag == 'sbwz_zfjly') textTitle = item.sbmc;
+    if (flag == 'gapText') textTitle = text;
+
+    // 设置样式
+    const el = document.createElement('div');
+    el.className = 'makerTitle';
+    if (flag == 'sbwz_car' || flag == 'sbwz_sb' || flag == 'sbwz_zfjly') el.className = 'makerTitlezb';
+    if (flag == 'rx') {
+      if (item.xfzt == '0') el.classList.add('makerTitleLine');
+      else if (item.xfzt == '1') el.classList.add('makerTitlecj');
+      else el.classList.add('makerTitleUnLine');
+    }
+    if (flag == 'gapText') el.className = 'makerTitleGapText';
+
+    // 渲染
+    el.innerHTML = textTitle;
+    const marker = map.Marker(el, points, { anchor: 'bottom', offset: [0, -50] })
+    _that._self[flagT].push(marker)
+  }
+
+
+
+  /**
+   * 装备图标
+   * @param {点位数据} data
+   * @param {点} point
+   */
+  MapUtil.prototype.shouIcon = (data, point) => {
+    if (!_that._self.gpsZb) _that._self.gpsZb = []
+    var qxIcon = require(`@/assets/point/qx.png`); //qixie
+    var zfjlyIcon = require(`@/assets/point/interphone.png`); // 对讲机
+    var clIcon = require(`@/assets/point/car.png`); // 车辆
+    let jyqx = typeof data.jyqx == "string" ? JSON.parse(data.jyqx) : data.jyqx ? data.jyqx : [];
+    let txzb = typeof data.txzb == "string" ? JSON.parse(data.txzb) : data.txzb ? data.txzb : [];
+    let pbcl = typeof data.pbcl == "string" ? JSON.parse(data.pbcl) : data.pbcl ? data.pbcl : [];
+    let list = []
+    let cl = (pbcl && pbcl.length > 0) ? true : false; // 车辆
+    let zb = (txzb && txzb.length > 0) ? true : false; // 智能装备
+    let qx = (jyqx && jyqx.length > 0) ? true : false; // 警用器械
+    if (zb) {
+      let el = document.createElement("img");
+      el.style.width = "15px"
+      el.src = zfjlyIcon;
+      const makerZb = map.Marker(el, point, { anchor: 'bottom', offset: [20, -26] })
+      list.push(makerZb)
+    }
+    if (qx) {
+      let elqx = document.createElement("img");
+      elqx.style.width = "15px"
+      elqx.src = qxIcon;
+      const makerQx = map.Marker(elqx, point, { anchor: 'bottom', offset: [20, -10] })
+      list.push(makerQx)
+    }
+    if (cl) {
+      let elcl = document.createElement("img");
+      elcl.style.width = "20px"
+      elcl.src = clIcon;
+      const makerCl = map.Marker(elcl, point, { anchor: 'bottom', offset: [20, 2] })
+      list.push(makerCl)
+    }
+    _that._self.gpsZb[data.id] = list
+  }
+
+
+  // 自定义展示
+  MapUtil.prototype.zdySquire = (obj) => {
+    let { points, flag, distance } = obj
+    if (!_that._self[flag]) _that._self[flag] = [];
+    let textTitle = '距离：' + distance; // 展示名字
+    const el = document.createElement('div');
+    el.className = 'makerTitle';
+    if (flag == 'distance') el.className = 'makerTitleDistance'; // 设置样式
+    el.innerHTML = textTitle;
+    const marker = map.Marker(el, points, { anchor: 'bottom', offset: [0, -76] }) // 渲染
+    _that._self[flag].push(marker)
+  }
+
+  /**扩散圆
+   * @param coords:[jd,wd]
+  */
+  MapUtil.prototype.diffusionCircle = (obj) => {
+    let { coords, flag, isClear } = obj
+    if (!_that._self[flag]) _that._self[flag] = {}
+    if (isClear) _that._self[flag].destroy() //destroy销毁，show(false) 移除
+    let data = [{ position: coords }]
+    _that._self[flag] = map.DiffuseCircle(data, {
+      radius: 10,
+      color: 'rgba(81,217,254)',//扫描扇形的颜色，必须是十六进制或者rgb
+      duration: 30,//圆环与上一个圆环出现的间隔时间。配合speed参数可以调整圆圈的数量
+      speed: 4 //圆环移动速度
+    })
+  }
+
+  /**
+   * 聚合撒点 
+   * @param {*} coords 点位数据 geojson  lng lat
+   * @param {*} icon 点位图
+   */
+  MapUtil.prototype.aggregateScatteringPoint = (obj) => {
+    let { coords, icon, flag, isclear, scale, fontColor } = obj;
+    let points = coords.map(item => {
+      item.lng = item.jd;
+      item.lat = item.wd;
+      return item
+    })
+    if (!_that._self[flag]) _that._self[flag] = [];
+    if (isclear) _that.removeElement(flag) //移除聚合
+    let maker = map.clusterLayer(points, {
+      id: flag,
+      size: 18,
+      pixelRange: 60,
+      // gradient:{'1':'#00BFFF','10':'#008000', '100':'#FFA500', '1000':'#FF0000'},//可以自定义图片,把颜色换成图片地址
+      gradient: { '1': icon, '10': icon, '100': icon, '1000': icon },//可以自定义图片,把颜色换成图片地址
+      fontSize: 14,
+      fontColor: fontColor ? fontColor : '#001022',
+      style: 'custom',// spiral（螺旋形状），circle(圆圈)，custom(自定义)
+      image: icon,
+      scale: scale ? scale : 1,
+      // highlightImage:icon,
+      fontFamily: ['Microsoft YaHei']
+    })
+
+    _that._self[flag].push(maker)
+
+    //  聚合的点击一个
+    maker.addEventListener("click", (val) => {
+      _that.openInfoDetail(flag, [val]) //点击打开详情
+    })
+    // 聚合的多个
+    maker.addEventListener("clusterClick", (val) => {
+      _that.openInfoDetail(flag, val) //点击打开详情
+    })
+  };
+
+  /**
+   * 热力图
+   * @param {*} coords 数组
+   */
+  MapUtil.prototype.showHeatDrawing = (res) => {
+    let { coords, flag,isclear ,color} = res;
+    if(!_that._self[flag]) _that._self[flag] = [];
+    if(isclear) _that.removeElement(flag) //清除热力
+    let data = {
+      type: 'FeatureCollection',
+      features: []
+    }
+    for (let index = 0; index < coords.length; index++) {
+      const item = coords[index];
+      let jd = item.lng || item.jd;
+      let wd = item.lat || item.wd;
+      let mag = item.count <= 10 ? 1.4 : (item.count > 10 && item.count <= 50) ? 1.6 : 1.9;
+      let obj = {
+        properties: { mag },
+        type: 'Feature',
+        geometry: { type: 'Point', coordinates: [jd, wd, 0.1] }
+      }
+      data.features.push(obj)
+    }
+    let colors = { '0': 'rgba(23,102,172,0)', '0.5': 'rgb(209,229,240)', '1': 'rgb(178,24,43)' }
+    if (color) colors = { '0': color[0], '0.5': color[1], '1': color[2] }
+    let heartmap = map.HeatMap(data, { colors })
+    _that._self[flag].push(heartmap)
+  };
+
+
+  // 清除所有
+  MapUtil.prototype.removeAll = () => {
+    for(let key in _that._self){
+      if(key != 'rx' && key !='gpsZb' && !key.includes('rxTitle')){
+        let list = _that._self[key]
+        for (let i = 0; i < list.length; i++) {
+          const el = list[i];
+          if(el && typeof el == 'object') el.destroy() //destory()销毁 , show(false) false:隐藏  true ：展示
+        }
+        _that._self[key] = [];
+      }
+    }
+  }
+
+  /**
+   * 删除图层要素
+   * @param {*} layer 唯一标识
+   */
+  MapUtil.prototype.removeElement = (layer) => {
+    //警力装备
+    if (layer == 'gpsZb') {
+      for (let key in _that._self.gpsZb) {
+        let item = _that._self.gpsZb[key]
+        if (item && item.length > 0) {
+          for (let child in item) { item[child].destroy() }
+          _that._self.gpsZb[key] = []
+        }
+      }
+    }
+    if(layer == 'rx') _that.idsBox[layer] = [];
+    // 其他图层
+    if (!_that._self[layer]) return false;
+
+    if (layer !== 'gpsZb') {
+      for (let i = 0; i < _that._self[layer].length; i++) {
+        const el = _that._self[layer][i];
+        el.destroy()//destory()销毁 , show(false) false:隐藏  true ：展示
+      }
+      _that._self[layer] = [];
+
+      // d带标题的撒点
+      let T = layer == 'rx' ? 'rxTitle' :'Title'
+      let flagT = layer+T;
+      if (!_that._self[flagT]) return false;
+      for (let i = 0; i < _that._self[flagT].length; i++) {
+        const el = _that._self[flagT][i];
+        el.destroy()//destory()销毁 , show(false) false:隐藏  true ：展示
+      }
+      _that._self[flagT] = []
+    }
+  };
+  /**
+   * 删除图层的某个要素
+   * @param {*} layer 唯一标识
+   */
+  MapUtil.prototype.removeElementOne = (layer, id) => {
+    if (!_that.idsBox[layer]) return false;
+    let list = _that.idsBox[layer];
+    list.forEach((el, index) => {
+      if (el == id) {
+        _that.idsBox[layer].splice(index, 1);
+        if (_that._self[layer][index]) _that._self[layer][index].destroy()
+        _that._self[layer].splice(index, 1)
+        if(layer == 'rx'){
+          let flagT = layer +'rxTitle';
+          if(_that._self[flagT][index]) _that._self[flagT][index].destroy()
+          _that._self[flagT].splice(index, 1)
+          _that.removeGpsZbOverlayById(id) //删除图标
+        }
+      }
+    })
+  };
+
+  // 删除图标装备
+  MapUtil.prototype.removeGpsZbOverlayById = (id) => {
+    if (_that._self.gpsZb[id]) {
+      try {
+        let info = _that._self.gpsZb[id]
+        if (info) {
+          info.forEach(element => { element.destroy() });
+          delete _that._self.gpsZb[id]
+        }
+      } catch (err) { }
+    }
+  }
+
+
+  // 绘制数据的初始化
+  MapUtil.prototype.Drawplot = (color) => {
+    const { point, line, polygon, circle, rectangle, geoJson, remove, enableEdit } = map.draw({
+      lineWidth: 2,
+      lineColor: 'rgba(233,168,32,1)',
+      fillColor: 'rgba(233,168,32,0.5)',
+      color: 'rgba(233,168,32,1)',
+      pixelSzie: 0,
+    })
+    _that._CustomDraw = { point, line, polygon, circle, rectangle, geoJson, remove, enableEdit }
+  }
+  /**
+   * 绘制工具
+   * @param {*} type 绘制形状
+   * (point 点, line 线, circle 圆, polygon 多边形, rectangle 矩形) ,
+   * geoJson:根据geojson回显图
+   */
+  MapUtil.prototype.plot = (res,resFun) => {
+    let {flag ,color,linecolor, type ,coords} = res
+    if(!_that._self[flag]) _that._self[flag] = [];
+    if(res.isclear) _that.removePlot(flag); //移除绘制工具
+    if(res.isclear && (res.type == 'polygon' || res.type == 'line')) _that.removeEara(flag); //移除回显的面和线条
+    switch(type){
+      case 'point':
+        _that._CustomDraw.point((val) => { _that.handlePlot(val, type, flag, resFun) })
+        break;
+      case 'rectangle':
+        _that._CustomDraw.rectangle((val) => { _that.handlePlot(val, type, flag, resFun) })
+        break;
+      case 'circle':
+        _that._CustomDraw.circle((val) => { _that.handlePlot(val, type, flag, resFun) })
+        break;
+      case 'polygon':
+        _that._CustomDraw.polygon((val) => { _that.handlePlot(val, type, flag, resFun) }, {
+          fillColor: color || 'rgba(233,168,32,0.5)',
+          lineColor: linecolor || 'rgba(233,168,32,1)',
+        })
+        break;
+      case 'line':
+        _that._CustomDraw.line((val) => { _that.handlePlot(val, type, flag, resFun) })
+        break;
+      case 'geoJson'://返回面
+        let json = {
+          type: 'FeatureCollection',
+          features: [{
+            type: 'Feature',
+            geometry: {
+              type: 'Polygon',
+              coordinates: coords // coords 是三维数组
+            },
+            id: flag,
+            properties: {
+              fillColor: color || 'rgba(233,168,32,1)',
+              lineColor: linecolor || 'rgba(233,168,32,1)',
+            }
+          }],
+        }
+        _that._CustomDraw.geoJson(json, (data) => { _that.handlePlot(data, type, flag, resFun) })
+        break;
+    }
+  }
+  /**
+   * 处理自定义数据
+   * @param {*} val 返回数据
+   * @param {*} type 类型
+   * @param {*} flag 唯一标识
+   * @param {*} resFun 回调
+   */
+  // 校验
+  MapUtil.prototype.handlePlot = (val, type, flag, resFun) => {
+    _that._self[flag].push(val.id)
+    let coords = val.positionData; //绘制区域
+    resFun(coords, type, flag, val);
+  }
+
+  /**
+   * 移除绘制工具
+   * @param {*} flag 唯一标识
+   */
+  MapUtil.prototype.removePlot = (flag) => {
+    if (!_that._self[flag]) return false;
+    _that._self[flag].forEach(v => {
+      _that._CustomDraw.remove(v)
+    })
+  }
+  /**
+   * 移除绘制面 
+   * @param {*} flag 唯一标识
+   */
+  MapUtil.prototype.removeEara = (flag) => {
+    _that._CustomDraw.remove(flag)
+    _that.removePlot(flag)
+  }
+  /**
+   * 创建线
+   * @param {*} type 回显形状
+   * (solid 实线, dash 虚线, FlowColor 彩虹线, RoadLine 流线
+   */
+  MapUtil.prototype.createLine = (res) => {
+    let { type , coords , isclear ,flag ,color,width } = res;
+    if(!coords) return false; // coords 是数组对象，可以同时撒多条数据
+    if(!_that._self[flag]) _that._self[flag] = [] ;
+    if(isclear) _that.removeElement(flag); //移除回显的线条
+    let data = coords.map((item,index)=>{
+      return {
+        position: item.coords[0], //二维数组
+        text: '',
+        id: index,
+        userData: {
+          name: item.text
+        }
+      }
+    })
+    let line = map.createLine(data, {
+      color: color ? color : 'rgba(20, 237, 245,1)',
+      width: width ? width : 8,
+      type,
+      highlightColor: 'red',
+      labelOption: {
+        pixelOffset: [0, -1],
+        allShow: false,
+        type: 'text',
+        fontColor: 'rgba(20, 237, 245,1)'
+      }
+    })
+    _that._self[flag].push(line)
+  }
+
+
+
+
+
+  /**
+   * 回显平面- 圆 - 多边形 - 矩形
+   * @param {*} type 回显形状
+   * type: 'polygon', 'rectangle
+      coords = [{
+        position:[[[jd,wd],[jd,wd] ---]], //三维数组
+        text,//展示的文字
+        id, //唯一标识
+        FID, //渲染颜色的标识
+        userData:{} //存储数据
+    }]
+
+   * type:circle
+     coords:[jd,wd]  radius:半径
+
+   * @param {*} text 展示的文字
+   */
+  MapUtil.prototype.echoPlane = (res) => {
+    let { type, coords, fontColor, fontSize, text = '', radius = 0, isclear, flag, id = 1, color, linecolor } = res;
+    if (!coords) return;
+    if (isclear) _that.removeElement(flag)
+    if (!_that._self[flag]) _that._self[flag] = [];
+    let color1 = color ? color : 'rgba(29,237,245,0.6)'
+    let linecolor1 = linecolor ? linecolor : 'rgba(29,237,245,0.6)'
+    let style = {
+      color: color1,
+      outLineColor: linecolor1,
+      outLineWidth: 2,
+      highlightColor: 'rgba(255,0,0,0.5)',
+      labelOption: {
+        pixelOffset: [0, 0],
+        allShow: true,
+        fontColor: fontColor ? fontColor : '#ffffff',
+        fontSize: fontSize ? fontSize : '12px'
+      }
+    }
+    let maker;
+    // 圆
+    if (type == 'circle') {
+      let params = [{ center: coords, radius, text, id }]
+      maker = map.createCircle(params, style);
+    }
+
+    // 矩形
+    if (type == 'rectangle') maker = map.createRectangle(coords, style);
+
+    // 多边形
+    if (type == 'polygon') maker = map.createPolygon(coords, style);
+    _that._self[flag].push(maker);
+
+    maker.addEventListener("click", (val) => {
+      if (flag == 'xfq') {
+        maker.highlight(val.id) //高亮展示
+        emitter.emit('showXFQinfo', val)
+        if (val.id == _that.lightHeight) {
+          _that.isCheck = !_that.isCheck
+          if (_that.isCheck) {
+            maker.highlight(0); //取消高亮展示
+            emitter.emit('showXFQinfo', null)
+          } else {
+            emitter.emit('showXFQinfo', val)
+          }
+        }
+        _that.lightHeight = val.id
+      }
+      if (flag == 'zdxl_fzyc') {
+        emitter.emit('showFzycInfo', { info: val, type: true })
+      }
+    })
+  }
+
+
+  // 分割线展示文字
+  MapUtil.prototype.gapText = (obj) => {
+    let { points, text, flag } = obj
+    _that.makerShowTitle({}, points, flag, text) //展示标题
+  }
+
+  /**
+   * 轨迹回放
+   * @param {*} coords 轨迹坐标.二维数组[[104.03640684556253,30.7415801286654],[103.98021233220163,30.6555411499294],[103.85766040251299,30.58094579138167]]
+   * @param {*} isClear 是否清除上一次的记录
+   */
+  MapUtil.prototype.displayLineAnimation = (res) => {
+    let { coords, isClear, flag } = res
+    if (!coords) return;
+    if (!_that._self[flag]) _that._self[flag] = [];
+    if (isClear && _that._self[flag]) _that.removeElement(flag); //destroy 移除,start 播放,pause 暂停
+    let lineString = getUUid().slice(3, 5)
+    const data = [
+      {
+        position: coords,
+        text: '实线',
+        id: lineString,
+        userData: { name: '测试1' }
+      }
+    ]
+    const track = map.trajectoryRealtime(data, {
+      color: '#28F', //轨迹背景颜色
+      width: 8,
+      image: 'images/car.png',
+      speed: 80, // 单位 m/s
+      imageWidth: 20,
+      imageHeight: 40,
+      isShowLine: false, //轨迹线是否显示
+      isAgain: false,//轨迹运动是否重复,
+      traveledColor: '#32b1fb' //运动轨迹颜色
+    })
+    track.start()
+
+    track.on('length', (data) => {
+      let obj = { flag }
+      if (data && data[0].percent == 0) {
+        obj.icon = require('@/assets/point/start.png') // 开始
+        let item = data[0].position[0]
+        obj.coords = [{ jd: item[0], wd: item[1] }]
+        _that.makerSki(obj)
+      }
+      if (data && data[0].percent == 99) {
+        let len = data[0].position.length
+        let val = data[0].position[len - 1]
+        obj.coords = [{ jd: val[0], wd: val[1] }]
+        obj.icon = require('@/assets/point/end.png') // 结束
+        _that.makerSki(obj)
+      }
+    })
+    _that._self[flag].push(track)
+  }
+
+  // 移除轨迹
+  MapUtil.prototype.removeTrajectory = (flag) => {
+    if (_that._self[flag]) {
+      _that._self[flag].destroy();
+      _that._self[flag] = null
+    }
+  }
+
+
+/**geojson 创建边界
+   * let data = { 
+   * type: "FeatureCollection", 
+   * features: [
+    *  {
+          geometry: {
+            type: "Polygon",
+            coordinates: [it.coordinates]
+          },
+          properties: {
+          },
+          type: "Feature",
+        }
+   * ] 
+   };
+  */
+  MapUtil.prototype.createBoundarys = (res) => {
+    let { data } = res
+    if (!data) return false;
+    if (_that.polygonGeo) _that.removeBj();
+    _that.polygonGeo = map.createPolygon(data, {
+      color: 'rgba(20,237,245,0.3)',
+      outLineColor: '#cf1010',
+      outLineWidth: 6,
+      highlightColor: 'red',
+      type: 'solid',
+      labelOption: {
+        pixelOffset: [2, 0],
+        allShow: false,
+        fontColor: '#ffffff'
+      }
+    })
+    _that.polygonGeo.flyTo()
+  }
+  // 移除边界
+  MapUtil.prototype.removeBj = (res) => {
+    _that.polygonGeo.destroy()
+  }
+
+  // 打开详情弹窗
+  MapUtil.prototype.openInfoDetail = (flag, data) => {
+    switch (flag) {
+      case "rx":
+        emitter.emit('showJzInfo', data);
+        break;
+      case 'gaj':
+      case 'pcs':
+      case 'jwz':
+      case 'xfq':
+      case 'zdfkd':
+        emitter.emit('showGazy', data);
+        break;
+      case 'kfd':
+        emitter.emit("changeGroupPoint", { lx: 'kfd', xffwlx: '2', xffwid: data.kfdId });
+        emitter.emit('showGazy', [data]);
+        break;
+      case 'sp':
+        emitter.emit('showGzy', data);
+        emitter.emit("showGzyInfo", data);
+        break;
+      case 'kk':
+        emitter.emit('showGzy', data);
+        break;
+      case 'aj':
+      case 'jqMap':
+        emitter.emit('showAj', data);
+        break;
+      case 'yj':
+      case 'yjMap':
+        emitter.emit("showYjxq", data);
+        break;
+      case 'dzjg':
+      case 'school':
+      case 'hospital':
+      case 'banck':
+      case 'shop':
+        emitter.emit("showShzy", data);
+        break;
+      case 'qchzc_map':
+      case 'jczMap_hm':
+      case 'jczMap_hhx':
+        emitter.emit("showJcz", [data]);
+        break;
+      case 'cyryMap':
+        console.log(data, '从业人员');
+        emitter.emit("showCyry", [data]);
+        break;
+    }
+  }
+}
+// 获取uuid 作为边界图层ID
+function getUUid() {
+  var list = [];
+  var hexDigits = "0123456789abcdefghijklmnopqrstuvwxyz";
+  for (var i = 0; i < 32; i++) {
+    list[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
+  }
+  list[14] = "4";
+  list[19] = hexDigits.substr((list[19] & 0x3) | 0x8, 1);
+  list[8] = list[13] = list[18] = list[23];
+  let uuid = list.join("");
+  return uuid;
+}
+
+

src/components/GdMap/rs.json

@@ -0,0 +1,3 @@
+{
+    "coords":"104.191712,30.332337,104.190379,30.321575,104.231962,30.315252,104.227763,30.283791,104.241479,30.268395,104.228153,30.257561,104.242864,30.244730,104.270769,30.240455,104.269092,30.219985,104.277914,30.224568,104.293406,30.209630,104.302729,30.213200,104.307097,30.202998,104.325129,30.207037,104.355347,30.194195,104.363096,30.183460,104.354874,30.185101,104.352787,30.178549,104.386214,30.163126,104.392108,30.139422,104.386563,30.134069,104.406584,30.128212,104.417883,30.110023,104.411449,30.102072,104.421724,30.093237,104.433945,30.091459,104.434490,30.102374,104.447575,30.103505,104.455815,30.090000,104.477106,30.090159,104.472787,30.079513,104.480840,30.075074,104.465410,30.062860,104.479359,30.049892,104.456587,30.050092,104.452813,30.040084,104.465165,30.035835,104.455327,30.027999,104.458818,30.019591,104.448027,29.999489,104.477911,29.990649,104.457530,29.956299,104.478816,29.947313,104.470366,29.937748,104.486035,29.924377,104.486081,29.908460,104.505562,29.900162,104.492675,29.891903,104.492992,29.877076,104.501067,29.874142,104.487466,29.868024,104.475572,29.839224,104.480389,29.823872,104.473848,29.813915,104.499239,29.808909,104.491448,29.794094,104.465447,29.790942,104.442186,29.735454,104.427166,29.742971,104.414194,29.733388,104.404817,29.736075,104.393217,29.753224,104.373968,29.744401,104.367685,29.731782,104.356188,29.739397,104.355446,29.733333,104.335661,29.730418,104.332333,29.717842,104.347244,29.712211,104.346778,29.702659,104.336663,29.700136,104.313561,29.713003,104.295611,29.673814,104.280138,29.671614,104.283271,29.663143,104.274707,29.653997,104.280570,29.652266,104.271474,29.639306,104.247799,29.635751,104.237983,29.645245,104.243843,29.650490,104.231474,29.654349,104.237800,29.660088,104.228079,29.663086,104.233011,29.673066,104.227693,29.678490,104.204520,29.666834,104.193826,29.684265,104.200269,29.695269,104.183408,29.688925,104.185530,29.712206,104.181102,29.708149,104.167587,29.719218,104.164097,29.712006,104.156209,29.719685,104.147994,29.708280,104.132691,29.711712,104.116456,29.735662,104.105234,29.739340,104.109314,29.745872,104.099019,29.750351,104.088669,29.742201,104.058084,29.781140,104.070105,29.785362,104.088526,29.816182,104.072903,29.815785,104.072469,29.829395,104.040234,29.833418,104.056118,29.857406,104.049233,29.871115,104.040958,29.865559,104.027382,29.876641,104.001555,29.876057,103.981529,29.851563,103.964863,29.857306,103.968616,29.869100,103.991537,29.880289,103.998148,29.894420,103.984192,29.887484,103.969852,29.890776,103.952945,29.917885,103.962461,29.927505,103.946054,29.965100,103.952523,29.969262,103.917956,29.980131,103.926683,29.990640,103.959824,29.983321,103.957729,29.994857,103.972654,30.001121,103.966893,30.009745,103.977840,30.029956,103.971729,30.047714,103.987262,30.074897,103.977687,30.093740,103.981558,30.102835,103.968602,30.112735,103.978708,30.128111,103.970273,30.143360,103.981090,30.145538,103.982377,30.158880,103.974518,30.161745,103.979487,30.172736,103.969649,30.180335,103.989892,30.197132,103.959528,30.216906,103.966730,30.233955,103.979510,30.240572,103.964281,30.252780,103.969394,30.267698,103.984404,30.277331,103.997281,30.265453,104.047086,30.274065,104.051446,30.261304,104.062409,30.268811,104.066778,30.256984,104.074634,30.261237,104.078283,30.250003,104.089862,30.253217,104.094024,30.241503,104.124537,30.228739,104.149999,30.246957,104.150805,30.269599,104.165559,30.285692,104.179104,30.327688,104.191656,30.332522,104.191712,30.332337;104.479952"
+}

src/components/MyComponents/ChooseUser/index.vue

@@ -0,0 +1,252 @@
+<template>
+  <el-dialog
+    :title="titleValue"
+    width="1400px"
+    :model-value="modelValue"
+    append-to-body
+    @close="closed"
+  >
+    <div>
+      <el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
+        <el-form-item label="所属部门">
+          <MOSTY.Department width="100%" clearable v-model="listQuery.ssbmdm" />
+        </el-form-item>
+        <el-form-item label="用户名">
+          <el-input
+            placeholder="请输入用户名"
+            v-model="listQuery.loginName"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="电话号码">
+          <el-input
+            placeholder="请输入电话号码"
+            v-model="listQuery.phone"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="success" @click="handleFilter">查询</el-button>
+          <el-button type="info" @click="reset()"> 重置 </el-button>
+        </el-form-item>
+      </el-form>
+      <div
+        class="tabBox"
+        :class="props.Single ? 'tabBoxRadio' : ''"
+        style="margin-top: 0px"
+      >
+        <el-table
+          ref="multipleUserRef"
+          @selection-change="handleSelectionChange"
+          :data="tableData"
+          border
+          :row-key="keyid"
+          style="width: 100%"
+          height="450"
+        >
+          <el-table-column
+            type="selection"
+            width="55"
+            :reserve-selection="true"
+          />
+          <el-table-column
+            prop="loginName"
+            align="center"
+            label="用户名"
+            width="150"
+          ></el-table-column>
+          <el-table-column
+            prop="idEntityCard"
+            align="center"
+            label="身份证号"
+          ></el-table-column>
+          <el-table-column
+            prop="deptName"
+            align="center"
+            label="部门"
+          ></el-table-column>
+          <el-table-column
+            prop="inDustRialId"
+            align="center"
+            width="150"
+            label="警号"
+          ></el-table-column>
+
+          <el-table-column
+            prop="mobile"
+            width="150"
+            align="center"
+            label="电话"
+          ></el-table-column>
+
+          <el-table-column prop="sex" align="center" label="性别">
+            <template #default="{ row }">
+              <span> {{ row.sex == 1 ? "男" : "女" }}</span>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <div class="fenye" :style="{ top: tableHeight + 'px' }">
+        <el-pagination
+          class="pagination"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="listQuery.current"
+          :page-sizes="[10, 20, 50, 100]"
+          :page-size="listQuery.size"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="total"
+        ></el-pagination>
+      </div>
+    </div>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="closed">取消</el-button>
+        <el-button type="primary" @click="onComfirm">确认</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import * as rule from "@/utils/rules.js";
+import * as MOSTY from "@/components/MyComponents/index";
+import { ElMessage } from "element-plus";
+import { defineProps, watch, ref, onMounted, nextTick } from "vue";
+import { selectUnAccreditPage, selectUserDeptPage } from "@/api/user-manage";
+const props = defineProps({
+  modelValue: {
+    type: Boolean,
+    required: true
+  },
+  titleValue: {
+    type: String,
+    default: "选择用户"
+  },
+  LeaderType: {
+    type: String,
+    default: ""
+  },
+  //是否单选
+  Single: {
+    type: Boolean,
+    default: true
+  },
+  roleIds: {
+    type: Array,
+    default: []
+  }
+});
+const total = ref(0);
+const listQuery = ref({
+  current: 1,
+  size: 20
+});
+const form = ref({});
+const tableData = ref([]);
+const emits = defineEmits(["update:modelValue", "choosedUsers"]);
+onMounted(() => {
+  handleFilter();
+});
+const closed = () => {
+  emits("update:modelValue", false);
+};
+const reset = () => {
+  listQuery.value = {
+    current: 1,
+    size: 20,
+    loginName: "",
+    phone: ""
+  };
+  getListData();
+};
+
+const keyid = (row) => {
+  return row.id;
+};
+// 为用户分配角色
+const onComfirm = () => {
+  const userList = multipleSelectionUser.value;
+  let list = [];
+  let listId = [];
+  userList.forEach((val) => {
+    if (listId.indexOf(val.id) == -1) {
+      list.push(val);
+      listId.push(val.id);
+    }
+  });
+  emits("choosedUsers", list);
+  let data = { type: props.LeaderType, userList: userList };
+
+  emits("choosedUsersLeader", data);
+  closed();
+};
+/**
+ * pageSize 改变触发
+ */
+const handleSizeChange = (currentSize) => {
+  listQuery.value.size = currentSize;
+  getListData();
+};
+
+/**
+ * 页码改变触发
+ */
+const handleCurrentChange = (currentPage) => {
+  listQuery.value.current = currentPage;
+  getListData();
+};
+const getListData = () => {
+  const params = listQuery.value;
+  selectUserDeptPage(params).then((res) => {
+    tableData.value = res?.records;
+    total.value = Number(res.total);
+    multipleUser();
+  });
+};
+
+//列表回显
+function multipleUser() {
+  tableData.value.forEach((item) => {
+    if (props.roleIds.some((id) => id == item.id)) {
+      multipleUserRef.value.toggleRowSelection(item, true);
+    }
+  });
+}
+
+const handleFilter = () => {
+  listQuery.value.current = 1;
+  getListData();
+};
+
+const multipleUserRef = ref(null);
+const multipleSelectionUser = ref([]);
+const handleSelectionChange = (val) => {
+  if (props.Single) {
+    if (val.length > 1) {
+      let del_row = val.shift();
+      multipleUserRef.value.toggleRowSelection(del_row, false);
+    }
+    multipleSelectionUser.value = val;
+  } else {
+    multipleSelectionUser.value = val;
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/layout.scss";
+@import "@/assets/css/element-plus.scss";
+</style>
+<style>
+.tabBoxRadio .el-checkbox__inner {
+  border-radius: 50% !important;
+}
+.tabBoxRadio .el-table__header-wrapper .el-checkbox {
+  display: none;
+}
+
+.el-dialog__title {
+  color: #fff;
+}
+</style>

src/components/MyComponents/Department/index.vue

@@ -18,15 +18,7 @@
 <script setup>
 import { COMPONENT_WIDTH } from "@/constant";
 import { qcckPost, qcckGet, qcckFlvGet } from "@/api/qcckApi.js";
-import {
-  ref,
-  defineProps,
-  defineEmits,
-  defineExpose,
-  computed,
-  onMounted,
-  watch
-} from "vue";
+import { ref, defineProps, defineEmits, defineExpose, computed, onMounted, watch } from "vue";
 import { selectDeptPage } from "@/api/user-manage";
 const props = defineProps({
   //获取组件传值
@@ -99,7 +91,6 @@ watch(
 );
 const emits = defineEmits(["update:modelValue",'getDepValue']);
 const handleChange = (e) => {
-  console.log(e,'e');
   if (props.multiple === true) {
     const data = e.map((item) => {return item[item.length - 1];});
     emits("update:modelValue", data);

src/components/MyComponents/Select/index.vue

@@ -1,8 +1,19 @@
-
 <template>
   <div class="Select-wrap" :style="{ width: width }">
-    <el-select :disabled="props.disabled" v-bind="$attrs" v-model="modelValue" @change="hanlderSelect" :popper-class="selectOption.length > 20 ? 'nation-select' : ''" :placeholder="placeholder">
-      <el-option v-for="item in dictEnum" :key="item.value" :label="item.zdmc || item.label" :value="item.dm || item.value">
+    <el-select
+      :disabled="props.disabled"
+      v-bind="$attrs"
+      v-model="modelValue"
+      @change="hanlderSelect"
+      :popper-class="selectOption.length > 20 ? 'nation-select' : ''"
+      :placeholder="placeholder"
+    >
+      <el-option
+        v-for="item in dictEnum"
+        :key="item.value"
+        :label="item.zdmc || item.label"
+        :value="item.dm || item.value"
+      >
       </el-option>
     </el-select>
   </div>
@@ -16,20 +27,24 @@ const props = defineProps({
     default: "请选择",
     type: String
   },
-  disabled:{
+  disabled: {
     default: false,
     type: Boolean
   },
   modelValue: {
-    default: "",
-    type: String
+    type: [String, Array], // 允许 String 或 Array
+    default: "", // 默认值设为空字符串
+    validator: (value) => {
+      // 允许：空字符串、非空字符串、数组
+      return typeof value === "string" || Array.isArray(value);
+    }
   },
   dictEnum: {
-    default: Array,
-    type: String
+    default: [],
+    type: Array
   },
   width: {
-    default: '100%',
+    default: "100%",
     type: String
   }
 });

src/components/MyComponents/Sex/index.vue

@@ -1,6 +1,11 @@
 <template>
   <div class="form-item-box" :style="{ width: width }">
-    <el-select :disabled="disabled" v-model="sex" placeholder="请选择性别" @change="onChange">
+    <el-select
+      :disabled="disabled"
+      v-model="sex"
+      placeholder="请选择性别"
+      @change="onChange"
+    >
       <el-option
         v-for="item in D_BZ_XB"
         :key="item"
@@ -26,11 +31,12 @@ const { D_BZ_XB } = proxy.$dict("D_BZ_XB");
 const props = defineProps({
   //获取组件传值
   sex: {
-    type: String
+    type: String,
+    default: ""
   },
-  disabled:{
-    type:Boolean,
-    default:false
+  disabled: {
+    type: Boolean,
+    default: false
   },
   width: {
     default: COMPONENT_WIDTH,

src/components/aboutTable/DarkTable.vue

@@ -104,7 +104,6 @@
 </template>
 
 <script setup>
-import elTableInfiniteScroll from 'el-table-infinite-scroll';
 import {
   nextTick,
   onMounted,
@@ -159,6 +158,10 @@ const props = defineProps({
   fixed: {
     type: String,
     default: "right"
+  },
+  tabelModel:{
+    type: String,
+    default: "table"
   }
 });
 // 可选的时候选择的数据
@@ -303,10 +306,7 @@ const createScroll = () => {
     timer.value = setInterval(() => {
       tableWrapper.scrollTop += 1;
       //判断滚动到底部,设置为0(可视高度+距离顶部 = 整个高度)
-      if (
-        tableWrapper.clientHeight + tableWrapper.scrollTop ==
-        tableWrapper.scrollHeight
-      ) {
+      if ( tableWrapper.clientHeight + tableWrapper.scrollTop == tableWrapper.scrollHeight) {
         tableWrapper.scrollTop = 0;
       }
     }, 100);
@@ -315,7 +315,7 @@ const createScroll = () => {
 
 // 触底加载
 const loadTable = () => {
-  emit("changePage");
+  emit("changePage",props.tabelModel);
 };
 
 onUnmounted(() => {

src/components/aboutTable/FormMessage.vue

@@ -1,127 +1,219 @@
 <template>
-    <el-form
-      ref="elform"
-      :model="listQuery"
-      :label-width="140"
-      :rules="props.rules"
-      :inline="true"
-      label-position="right"
+  <el-form
+    ref="elform"
+    :model="listQuery"
+    :label-width="props.labelWidth"
+    :rules="props.rules"
+    :inline="true"
+    label-position="right"
+  >
+    <el-form-item
+      v-for="item in props.formList"
+      :style="item.width && { width: item.width }"
+      :prop="item.prop"
+      :label="item.label"
+      :label-width="item.labelWidth"
+      :key="item"
     >
-      <el-form-item v-for="item in props.formData" :style="{ width: item.width }" :prop="item.prop" :label="item.text" :label-width="item.labelWidth"   :key="item">
-        <!-- input表单 -->
-        <MOSTY.Other v-if="item.type == 'input'" width="100%" clearable v-model="listQuery[item.prop]" :placeholder="`请输入${item.text}`"/>
-        <el-input v-model="listQuery[item.prop]" v-else-if="item.type == 'textarea'" :placeholder="`请输入${item.text}`" />
-        <!-- Select选择 -->
-        <MOSTY.Select
-          v-else-if="item.type == 'select'"
-          width="100%"
-          clearable
-          v-model="listQuery[item.prop]"
-          :dictEnum="item.optionList"
-          :placeholder="`请选择${item.text}`"
-        />
+      <!-- input表单 input-->
+      <MOSTY.Other
+        v-if="item.type == 'input'"
+        width="100%"
+        clearable
+        v-model="listQuery[item.prop]"
+        :placeholder="`请输入${item.label}`"
+        :disabled="item.disabled"
+      />
+      <el-input
+        v-model="listQuery[item.prop]"
+        v-else-if="item.type == 'textarea'"
+        type="textarea"
+        :rows="3"
+        :placeholder="`请输入${item.label}`"
+        :disabled="item.disabled"
+      />
+      <!-- 数值 inputNumber-->
+      <el-input
+        type="number"
+        v-model="listQuery[item.prop]"
+        v-else-if="item.type == 'inputNumber'"
+        :placeholder="`请输入${item.label}`"
+        :disabled="item.disabled"
+      />
+      <!-- 数值 number-->
+      <el-input-number
+        v-model="listQuery[item.prop]"
+        v-else-if="item.type == 'number'"
+        style="width: 100%"
+        :min="item.min || 0"
+        :max="item.max || 1000"
+        :disabled="item.disabled"
+      />
+      <!--选择 select-->
+      <MOSTY.Select
+        v-else-if="item.type == 'select'"
+        filterable
+        :multiple="item.multiple"
+        v-model="listQuery[item.prop]"
+        :dictEnum="item.options"
+        width="100%"
+        clearable
+        :placeholder="`请选择${item.label}`"
+        :disabled="item.disabled"
+      />
+      <!-- 部门department -->
+      <template v-else-if="item.type === 'department'">
+        <MOSTY.Department clearable v-model="listQuery[item.prop]" />
+      </template>
 
-        <template v-else-if="item.showType === 'department'">
-          <MOSTY.Department clearable v-model="listQuery[item.prop]" />
-        </template>
+      <!-- 上传 upload -->
+      <MOSTY.Upload
+        v-else-if="item.type == 'upload'"
+        width="100%"
+        v-model="listQuery[item.prop]"
+        :isImg="item.isImg"
+        :disabled="item.disabled"
+      />
+      <!--选择checkbox -->
+      <MOSTY.CheckBox
+        v-else-if="item.type == 'checkbox'"
+        width="100%"
+        clearable
+        v-model="listQuery[item.prop]"
+        :checkList="item.options"
+        :placeholder="`请选择${item.label}`"
+        :disabled="item.disabled"
+      />
 
-        <!-- Upload选择 -->
-        <MOSTY.Upload
-          v-else-if="item.type == 'upload'"
-          width="100%"
-          v-model="listQuery[item.prop]"
-        />
-        <!-- CheckBox选择 -->
-        <MOSTY.CheckBox
-          v-else-if="item.type == 'checkbox'"
-          width="100%"
-          clearable
-          v-model="listQuery[item.prop]"
-          :checkList="item.optionList"
-          :placeholder="`请选择${item.text}`"
-        />
-        <el-radio-group v-model="listQuery[item.prop]" v-else-if="item.type == 'radio'">
-          <el-radio
-            v-for="obj in item.optionList"
-            :key="obj.value"
-            :label="obj.value"
-            >{{ obj.label }}</el-radio
-          >
-        </el-radio-group>
-        <el-date-picker
-          v-else-if="item.type == 'date'"
-          v-model="listQuery[item.prop]"
-          type="date"
-          value-format="YYYY-MM-DD"
-          :placeholder="请选择时间"
-        />
-        <el-date-picker
-          v-else-if="item.type == 'datetime'"
-          v-model="listQuery[item.prop]"
-          type="datetime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          :placeholder="请选择时间"
-        />
-        <el-date-picker
-          v-else-if="item.type == 'datetimerange'"
-          v-model="listQuery[item.prop]"
-          type="datetimerange"
-          :shortcuts="shortcuts"
-          range-separator="To"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          start-placeholder="选择开始时间"
-          end-placeholder="选择结束时间"
-        />
-        <el-date-picker
-          v-else-if="item.type == 'daterange'"
-          v-model="listQuery[item.prop]"
-          type="daterange"
-          range-separator="To"
-          value-format="YYYY-MM-DD"
-          start-placeholder="选择开始日期"
-          end-placeholder="选择开始日期"
-        />
-        <el-switch
-          v-else-if="item.type == 'switch'"
-          v-model="listQuery[item.prop]"
-          class="ml-2"
-          style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
-        />
-        <template v-else-if="item.type === 'slot'">
-          <slot :name="item.prop"></slot>
-        </template>
-      </el-form-item>
-    </el-form>
-  </template>
-  <script setup>
-  import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
-  import * as MOSTY from "@/components/MyComponents/index";
-  import { ref, defineProps, defineEmits, defineExpose } from "vue";
-  const props = defineProps({
-    //循环的值
-    formData: {
-      default: [],
-      type: Array
-    },
-    propName: {
-      default: "",
-      type: String
-    },
-    rules: {
-      default: {},
-      type: Object
-    }
+      <!-- 单选radio -->
+      <el-radio-group
+        v-model="listQuery[item.prop]"
+        v-else-if="item.type == 'radio'"
+        :disabled="item.disabled"
+      >
+        <el-radio
+          v-for="obj in item.options"
+          :key="obj.value"
+          :label="obj.value"
+          >{{ obj.label }}</el-radio
+        >
+      </el-radio-group>
+
+      <!-- 时间选择 -->
+      <el-time-picker
+        v-else-if="item.type == 'time'"
+        v-model="listQuery[item.prop]"
+        placeholder="选择时间"
+        style="width: 100%"
+        :disabled="item.disabled"
+      />
+      <el-date-picker
+        v-else-if="item.type == 'date'"
+        v-model="listQuery[item.prop]"
+        type="date"
+        value-format="YYYY-MM-DD"
+        placeholder="请选择日期"
+        style="width: 100%"
+        :disabled="item.disabled"
+      />
+      <el-date-picker
+        v-else-if="item.type == 'datetime'"
+        v-model="listQuery[item.prop]"
+        type="datetime"
+        value-format="YYYY-MM-DD HH:mm:ss"
+        placeholder="请选择时间"
+        style="width: 100%"
+        :disabled="item.disabled"
+      />
+      <el-date-picker
+        v-else-if="item.type == 'datetimerange'"
+        v-model="listQuery[item.prop]"
+        type="datetimerange"
+        :shortcuts="shortcuts"
+        range-separator="To"
+        value-format="YYYY-MM-DD HH:mm:ss"
+        start-placeholder="选择开始时间"
+        end-placeholder="选择结束时间"
+        style="width: 100%"
+        :disabled="item.disabled"
+      />
+      <el-date-picker
+        v-else-if="item.type == 'daterange'"
+        v-model="listQuery[item.prop]"
+        type="daterange"
+        range-separator="To"
+        value-format="YYYY-MM-DD"
+        start-placeholder="选择开始日期"
+        end-placeholder="选择开始日期"
+        style="width: 100%"
+        :disabled="item.disabled"
+      />
+
+      <el-switch
+        v-else-if="item.type == 'switch'"
+        v-model="listQuery[item.prop]"
+        class="ml-2"
+        :disabled="item.disabled"
+        style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
+      />
+
+      <template v-else-if="item.type === 'slot'">
+        <slot :name="item.prop"></slot>
+      </template>
+    </el-form-item>
+  </el-form>
+</template>
+<script setup>
+import * as MOSTY from "@/components/MyComponents/index";
+import { ref, defineProps, defineEmits, defineExpose, watch } from "vue";
+const props = defineProps({
+  //循环的值
+  formList: {
+    default: [],
+    type: Array
+  },
+  rules: {
+    default: {},
+    type: Object
+  },
+  labelWidth: {
+    default: "140px",
+    type: String
+  },
+  modelValue: {
+    type: Object,
+    default: {}
+  }
+});
+const elform = ref();
+const listQuery = ref({});
+const emits = defineEmits(["update:modelValue"]);
+// 提交
+const submit = (resfun) => {
+  elform.value.validate((valid) => {
+    if (!valid) return false;
+    resfun(listQuery.value);
   });
-  const elform = ref();
-  const listQuery = ref({});
-  const emits = defineEmits(["update:modelValue"]);
- 
-  const submit = (resfun) => {
-    elform.value.validate((valid) => {
-      if (!valid) return false;
-      resfun(listQuery.value);
-    });
-  };
-  defineExpose({ submit });
-  </script>
-  
+};
+
+watch(
+  () => listQuery.value,
+  (newVal) => {
+    emits("update:modelValue", newVal);
+  },
+  { immediate: true, deep: true }
+);
+
+watch(
+  () => props.modelValue,
+  (newVal) => {
+    // 只有在新值确实变化时才更新（避免空值覆盖）
+    if (newVal && Object.keys(newVal).length > 0) {
+      listQuery.value = { ...newVal };
+    }
+  },
+  { immediate: true, deep: true }
+);
+
+defineExpose({ submit });
+</script>

src/components/aboutTable/MyTable.vue

@@ -45,7 +45,7 @@
         width="60"
         :align="getConfiger?.align"
       />
-     
+
       <el-table-column
         v-for="(item, index) in tableColumn"
         :align="getConfiger?.align"
@@ -104,7 +104,7 @@ const props = defineProps({
     default: 180
   },
   tableHeight: {
-    type: Number
+    type: Number || String
   },
   treePros: {
     type: Object,
@@ -208,7 +208,7 @@ function setDefaultChoose() {
   });
 }
 </script>
- 
+
 <style lang = "scss">
 
-</style>
+</style>

src/components/aboutTable/PageTitle.vue

@@ -5,6 +5,9 @@
         <li :class=" idx == active ? 'hedBtn':''" @click="handleBtn(it,idx)" class="pointer ml10 mr10" v-for="(it,idx) in title" :key="it">{{ it }}</li>
       </ul>
       <div class="font" v-else>{{ title }}</div>
+      <div class="ml30">
+        <slot name="left"></slot>
+      </div>
     </div>
     <div class="cnetr">
       <slot name="center"></slot>