Merge pull request '设备类型增加参数、说明、视频' (#30) from liubiao/dyf-vue-ui:main into main

Reviewed-on: dyf/dyf-vue-ui#30

.env.development

@@ -5,12 +5,13 @@ VITE_APP_TITLE = 云平台管理系统
 VITE_APP_ENV = 'development'
 
 # 开发环境
- #VITE_APP_BASE_API = 'https://fuyuanshen.com/backend'
+#  VITE_APP_BASE_API = 'http://139.224.253.23:8000'
- VITE_APP_BASE_API = 'https://www.cnxhyc.com/jq'
+# VITE_APP_BASE_API = 'https://www.cnxhyc.com/jq'
-#VITE_APP_BASE_API = 'http://192.168.2.34:8000'   
+VITE_APP_BASE_API = 'http://192.168.110.57:8000'   
 #代永飞接口
 # VITE_APP_BASE_API = 'http://457102h2d6.qicp.vip:24689'   
 
+VITE_AMAP_KEY='84a12a692ae378effdf741e16d584cd3'
 
 # 应用访问路径 例如使用前缀 /admin/
 VITE_APP_CONTEXT_PATH = '/'

.env.production

@@ -2,13 +2,16 @@
 VITE_APP_TITLE = 云平台管理系统
 
 # 生产环境配置 晶全1
-VITE_APP_ENV = 'https://fuyuanshen.com/backend'
+VITE_APP_ENV = 'production'
 
 # 生产环境配置 富源晟2
 # VITE_APP_ENV = 'https://fuyuanshen.com/backend-fys'
 
 # 应用访问路径 晶全1
-VITE_APP_CONTEXT_PATH = '/jingquan/'
+VITE_APP_CONTEXT_PATH = '/PC/'
+
+# 高德地图Key
+VITE_AMAP_KEY='84a12a692ae378effdf741e16d584cd3'
 
 # 应用访问路径 富源晟2
 #VITE_APP_CONTEXT_PATH = '/sys/'          
@@ -19,8 +22,10 @@ VITE_APP_MONITOR_ADMIN = '/admin/applications'
 # SnailJob 控制台地址
 VITE_APP_SNAILJOB_ADMIN = '/snail-job'
 
-# 生产环境 晶全3
+# 生产环境 晶全3 代理访问
-VITE_APP_BASE_API = '/backend'
+VITE_APP_BASE_API = 'https://www.cnxhyc.com/jq'
+
+# VITE_APP_BASE_API = 'http://139.224.253.23:8000'
 
 # 生产环境 富源晟3
 #VITE_APP_BASE_API = '/backend-fys'

dyf-vue-ui/src/views/homeIndex/index.vue

@@ -1,174 +0,0 @@
-
-<style scoped>
-.dashboard-container {
-  width: 100vw;
-  height: 100vh;
-  display: flex;
-  flex-direction: column;
-  position: relative;
-  overflow: hidden;
-  background: radial-gradient( 0% 0% at 0% 0%, #091B2D 0%, #0C2644 100%), #267AD0;
-}
-
-/* 全屏地图 - 背景图层 */
-.fullscreen-map {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  z-index: 1;
-  pointer-events: none;
-}
-
-/* 顶部栏 */
-.top-bar {
-  position: relative;
-  z-index: 10;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 12px 20px;
-  background-color: rgba(74, 85, 104, 0.9);
-  color: #fff;
-  font-size: 14px;
-  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
-}
-
-.top-bar h1 {
-  font-size: 18px;
-  margin: 0;
-  font-weight: 600;
-}
-
-.header-info {
-  display: flex;
-  gap: 16px;
-  align-items: center;
-}
-
-.header-info span {
-  font-size: 12px;
-}
-
-/* 悬浮模块容器 */
-.floating-modules {
-  display: flex;
-  flex-direction: column;
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: calc(100% - 60px); /* 减去顶部栏高度 */
-  z-index: 5;
-  padding: 20px;
-  box-sizing: border-box;
-  pointer-events: none;
-}
-
-.left-modules,
-.right-modules {
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-  width: 100%;
-  flex: 1;
-  pointer-events: auto;
-}
-
-.bottom-middle-module {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  max-width: 800px;
-  pointer-events: auto;
-}
-
-.module-card {
-  background-color: rgba(107, 114, 128, 0.9);
-  border-radius: 6px;
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
-  border: 1px solid rgba(255, 255, 255, 0.1);
-  width: 100%;
-  box-sizing: border-box;
-  overflow: hidden;
-}
-
-.module-card:hover {
-  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
-}
-
-.module-header {
-  padding: 10px 14px;
-  font-size: 14px;
-  font-weight: 600;
-  color: #fff;
-  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
-  display: flex;
-  align-items: center;
-  background: linear-gradient(90deg, #3b82f6, #60a5fa);
-}
-
-.module-header::before {
-  content: '';
-  display: inline-block;
-  width: 8px;
-  height: 16px;
-  margin-right: 8px;
-  border-radius: 2px;
-  background-color: inherit;
-}
-
-.module-content {
-  padding: 14px;
-  color: #e5e7eb;
-  font-size: 13px;
-  height: calc(100% - 36px);
-  box-sizing: border-box;
-  overflow: auto;
-}
-
-.overview-card .module-header::before { background-color: #3b82f6; }
-.alarm-card .module-header::before { background-color: #ef4444; }
-.realtime-card .module-header::before { background-color: #f97316; }
-.module-card:nth-child(2) .module-header::before { background-color: #8b5cf6; }
-.module-card:nth-child(3) .module-header::before { background-color: #06b6d4; }
-
-@media (max-width: 1400px) {
-  .left-modules,
-  .right-modules {
-    width: 100%;
-  }
-}
-
-@media (max-width: 1200px) {
-  .left-modules,
-  .right-modules {
-    width: 100%;
-  }
-  .bottom-middle-module {
-    max-width: 600px;
-  }
-}
-
-@media (max-width: 900px) {
-  .left-modules,
-  .right-modules {
-    width: 100%;
-  }
-  .bottom-middle-module {
-    max-width: 500px;
-  }
-}
-
-@media (max-width: 768px) {
-  .left-modules,
-  .right-modules {
-    width: 100%;
-  }
-  .bottom-middle-module {
-    max-width: 100%;
-  }
-}
-</style>

index.html

@@ -6,7 +6,12 @@
     <meta name="renderer" content="webkit" />
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
     <link rel="icon" href="/favicon.ico" />
-      <script src="https://webapi.amap.com/maps?v=2.0&key=90bc158992feb8ccd0145e168cab1307&plugin=AMap.CircleEditor"></script>
+    <script  type="text/javascript">
+      window._AMapSecurityConfig = {
+        securityJsCode: "4239900f4fb7b2569df651ac814a28de",
+      };
+    </script>
+      <script src="https://webapi.amap.com/maps?v=2.0&key=78c36a1e251a95f1a21a9e5ea7a1331c&plugin=AMap.CircleEditor"></script>
     <title>物联网管理平台</title>
     <!--[if lt IE 11
       ]><script>

src/api/FenceManager/fence.ts

@@ -64,6 +64,34 @@ function DelFence(ids) {
     })
 }
 
+//添加终端
+function addTerminal(data){
+  return request({
+        url: '/api/equipment/geoFence/addTerminal',
+        method: 'post',
+        data: data
+    })
+}
+
+//删除终端
+function delTerminal(data){
+ return request({
+        url: '/api/equipment/geoFence/delTerminal',
+        method: 'post',
+        data:data
+    })
+}
+
+//查询终端
+function pageTerminal(data){
+    return request({
+        url:'api/device/pageTerminal',
+        method:'get',
+        params:data
+    });
+}
+
+
 export default{
     updateFence:updateFence,
     AddFence:AddFence,
@@ -71,7 +99,10 @@ export default{
     check:check,
     geoFenceById:geoFenceById,
     getList:getList,
-    DelFence:DelFence
+    DelFence:DelFence,
+    addTerminal:addTerminal,
+    delTerminal:delTerminal,
+    pageTerminal:pageTerminal
 }
 
 

src/api/FenceManager/mapOpt.ts

@@ -1,7 +1,7 @@
 var map = null;
 var circle = null;
 var polygon = null;
-
+import mapLocation from '@/assets/images/mapLocation.png';
 
 function initMap() {
     // let key = '90bc158992feb8ccd0145e168cab1307';
@@ -9,12 +9,18 @@ function initMap() {
         map = new AMap.Map("map", {
             viewMode: '2D', //默认使用 2D 模式
             zoom: 11, //地图级别
+              dragEnable: true, // 强制开启拖拽
+    zoomEnable: true, // 开启滚轮缩放（辅助验证）
             center: [114.420739, 30.487514], //地图中心点
         });
 
-        map.on('click',function(evt){
+        
-          alert('您点击的位置:'+evt.lnglat.lng+' , '+ evt.lnglat.lat);
+setTimeout(() => {
-        });
+    map.resize();
+}, 1000);
+        // map.on('click',function(evt){
+        //   alert('您点击的位置:'+evt.lnglat.lng+' , '+ evt.lnglat.lat);
+        // });
     }
     return new Promise((resolve, reject) => {
         if(map){
@@ -39,7 +45,7 @@ function AddPoint(point, index, dragEnd, click) {
             let center = point ? new AMap.LngLat(point.lng, point.lat) : map.getCenter();
 
             let marker = new AMap.Text({
-                icon: "http://wdxm.ztzhtech.com:8111/Script/Home/img/welComeImg/mapLocation.png",
+                icon: mapLocation,
                 position: center,
                 offset: new AMap.Pixel(-15, -24),
                 draggable: true,

src/api/equipmentManagement/device/types.ts

@@ -6,6 +6,7 @@ export interface deviceQuery extends PageQuery {
     deviceStatus: string;
     bluetoothName?: string; // 蓝牙名称查询字段
     onlineStatus?: string;
+    bindingStatus?:string
 }
 
 export interface deviceForm {
@@ -38,6 +39,7 @@ export interface deviceVO {
     customerId?: string | number;
     typeName?: string;
     bluetoothName?: string; // 蓝牙名称字段
+    
 }
 
 export interface deviceTypeOption {

src/api/equipmentManagement/deviceType/index.ts

@@ -17,7 +17,10 @@ export const addDeviceType = (data: any): AxiosPromise<deviceTypeVO[]> => {
   return request({
     url: '/api/deviceType/add',
     method: 'post',
-    data: data
+    data: data,
+     headers:{
+      'Content-Type':'application/x-www-form-urlencoded;charset=UTF-8'
+    }
   });
 };
 
@@ -26,6 +29,9 @@ export const updateDeviceType = (data: any): AxiosPromise<deviceTypeVO[]> => {
   return request({
     url: '/api/deviceType/update',
     method: 'put',
+    headers:{
+      'Content-Type':'application/x-www-form-urlencoded;charset=UTF-8'
+    },
     data
   })
 }
@@ -34,6 +40,7 @@ export const deleteDeviceType = (ids: any): AxiosPromise<deviceTypeVO[]> => {
   return request({
     url: '/api/deviceType/delete',
     method: 'delete',
+    
     data: ids
   })
 }

src/api/system/service/api.ts

@@ -0,0 +1,118 @@
+import request from '@/utils/request';
+import { AxiosPromise } from 'axios';
+import { ServiceVO, ServiceForm, ServiceQuery } from '@/api/system/service/types';
+
+/**
+ * 查询轨迹服务列表
+ * @param query
+ * @returns {*}
+ */
+
+export const listService = (query?: ServiceQuery): AxiosPromise<ServiceVO[]> => {
+  return request({
+    url: '/api/trackService/list',
+    method: 'get',
+    params: query
+  });
+};
+
+/**
+ * 查询轨迹服务详细
+ * @param id
+ */
+export const getService = (id: string | number): AxiosPromise<ServiceVO> => {
+  return request({
+    url: '/api/trackService/' + id,
+    method: 'get'
+  });
+};
+
+/**
+ * 新增轨迹服务
+ * @param data
+ */
+export const addService = (data: ServiceForm) => {
+  return request({
+    url: '/api/trackService/add',
+    method: 'post',
+    data: data
+  });
+};
+
+/**
+ * 修改轨迹服务
+ * @param data
+ */
+export const updateService = (data: ServiceForm) => {
+    return Promise.reject({code:500,msg:'不允许此操作'});
+//   return request({
+//     url: '/api/trackService/update',
+//     method: 'put',
+//     data: data
+//   });
+};
+
+/**
+ * 删除轨迹服务
+ * @param id
+ */
+export const delService = (id: string | number | Array<string | number>) => {
+//   return request({
+//     url: '/api/trackService/' + id,
+//     method: 'delete'
+//   });
+
+return Promise.reject({code:500,msg:'不允许此操作'});
+};
+
+
+//获取设备
+export const getDevice = (data) => {
+  return request({
+    url: '/api/device',
+    method: 'get',
+    params:data
+  });
+};
+
+//获取设备
+export const getDeviceList = (data) => {
+  return request({
+    url: '/api/device/list',
+    method: 'get',
+    params:data
+  });
+};
+//保存
+export const terminalDevice=(data)=>{
+   return request({
+    url: '/api/trackService/terminal',
+    method: 'post',
+    data:data
+  });
+}
+//删除
+export const delTerminalDevice=(id)=>{
+   return request({
+    url: '/api/trackService/delTerminal/'+id,
+    method: 'delete'    
+  });
+}
+
+//获取地图的终端，列表查询
+export const getMapDevice = (data) => {
+  return request({
+    url: '/api/trackService/listTerminal',
+    method: 'get',
+    params:data
+  });
+};
+
+//获取地图的终端，模糊查询
+export const getMapDeviceByFilter = (data) => {
+  return request({
+    url: '/api/trackService/searchTerminal',
+    method: 'get',
+    params:data
+  });
+};

src/api/system/service/types.ts

@@ -0,0 +1,56 @@
+export interface ServiceVO {
+  /**
+   * 
+   */
+  id: string | number;
+
+  /**
+   * 猎鹰服务ID
+   */
+  sid: string | number;
+
+  /**
+   * 服务名称
+   */
+  sname: string;
+
+}
+
+export interface ServiceForm extends BaseEntity {
+  /**
+   * 
+   */
+  id?: string | number;
+
+  /**
+   * 猎鹰服务ID
+   */
+  sid?: string | number;
+
+  /**
+   * 服务名称
+   */
+  sname?: string;
+
+}
+
+export interface ServiceQuery extends PageQuery {
+
+  /**
+   * 猎鹰服务ID
+   */
+  sid?: string | number;
+
+  /**
+   * 服务名称
+   */
+  sname?: string;
+
+    /**
+     * 日期范围参数
+     */
+    params?: any;
+}
+
+
+

src/components/FileUpload/index.vue

@@ -57,9 +57,9 @@ const props = defineProps({
   // 数量限制
   limit: propTypes.number.def(5),
   // 大小限制(MB)
-  fileSize: propTypes.number.def(5),
+  fileSize: propTypes.number.def(200),
   // 文件类型, 例如['png', 'jpg', 'jpeg']
-  fileType: propTypes.array.def(['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'pdf']),
+  fileType: propTypes.array.def(['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'pdf','apk','wgt','html','mp3','mp4']),
   // 是否显示提示
   isShowTip: propTypes.bool.def(true),
   // 禁用组件（仅查看文件）

src/views/controlCenter/6170/index.vue

@@ -592,17 +592,15 @@ const getMainLightModeLabel = (mode: any) => {
 // 处理设备消息
 const handleDeviceMessage = (msg: any) => {
     try {
-        // 解析设备消息（假设格式为 { state: [类型, 模式值, 亮度, 续航...] }）
         const payloadObj = JSON.parse(msg.payload.toString());
         const deviceState = payloadObj.state; // 设备状态数组
         if (!Array.isArray(deviceState)) {
             return;
         }
-        // 用switch处理不同的消息类型（deviceState[0]）
         switch (deviceState[0]) {
             case 1:
                 // 类型1灯光主键
-                const lightModeId = getMainLightModeLabel(deviceState[1]); // 获取模式ID（如'strong'）
+                const lightModeId = getMainLightModeLabel(deviceState[1]);
                 const brightness = deviceState[2]; // 亮度值
                 const batteryTime = deviceState[3]; // 续航时间
                 console.log('灯光模式消息:', { 模式ID: lightModeId, 亮度: brightness, 续航: batteryTime });
@@ -625,7 +623,7 @@ const handleDeviceMessage = (msg: any) => {
                 break;
             case 12:
                 // 灯光主键
-                const lightModeIdA = getMainLightModeLabel(deviceState[1]); // 获取模式ID（如'strong'）
+                const lightModeIdA = getMainLightModeLabel(deviceState[1]);
                 if (lightModeIdA !== 'unknown') {
                     lightModes.value.forEach(mode => {
                         const isActive = mode.id === lightModeIdA;
@@ -650,7 +648,6 @@ const handleDeviceMessage = (msg: any) => {
 
                 break;
             default:
-                // 其他类型消息（不处理，仅打印）
                 console.log('未处理的消息类型:', deviceState[0]);
                 break;
         }
@@ -658,7 +655,7 @@ const handleDeviceMessage = (msg: any) => {
     }
 };
 onMounted(async () => {
-    await getList(); // 先获取设备信息
+    await getList();
     // 连接mqtt
     onConnect(async () => {
         const deviceImei = deviceDetail.value.deviceImei;
@@ -684,7 +681,7 @@ onMounted(async () => {
         handleDeviceMessage(msg);
     });
     onError((err) => {
-        console.error('MQTT连接失败原因:', err.message); // 关键：打印连接失败的具体原因
+        console.error('MQTT连接失败原因:', err.message);
     });
     connect();
 });

src/views/controlCenter/670/index.vue

@@ -2,7 +2,7 @@
   <div class="device-page p-2">
     <!-- 头部信息栏 -->
     <div class="header-bar">
-      <div>设备名称：{{ deviceDetail.deviceName }}，IMEI:{{deviceDetail.deviceImei  }}</div>
+      <div>设备名称：{{ deviceDetail.deviceName }}，IMEI:{{ deviceDetail.deviceImei }}</div>
       <div>设备型号：{{ deviceDetail.typeName }}</div>
       <div class="device-status">
         设备状态：
@@ -19,8 +19,8 @@
       <el-row :gutter="20" class="content-row" :class="deviceDetail.sta_ShakeBit == 1 || deviceDetail.staSOSGrade == 1 ? '' : 'displayNone'">
         <el-col :lg="24" :xs="24">
           <div class="staticRwo" :class="deviceDetail.sta_ShakeBit == 1 ? '' : 'displayNone'">设备静止报警中!</div>
-          <div class="staticRwo" :class="(deviceDetail.staSOSGrade == 1 && Status.timeOut>0) ? '' : 'displayNone'" @click="showClose()">
+          <div class="staticRwo" :class="deviceDetail.staSOSGrade == 1 && Status.timeOut > 0 ? '' : 'displayNone'" @click="showClose()">
-            设备强制报警中<span v-show="Status.timeOut>0">,{{ Status.timeOut }}S</span>!
+            设备强制报警中<span v-show="Status.timeOut > 0">,{{ Status.timeOut }}S</span>!
           </div>
         </el-col>
       </el-row>
@@ -99,11 +99,11 @@
               </div>
               <div class="form-item">
                 <span class="form-label">职位:</span>
-                <el-input v-if="deviceDetail" placeholder="请输入职位" v-model="deviceDetail.personnelInfo.name" />
+                <el-input v-if="deviceDetail" placeholder="请输入职位" v-model="deviceDetail.personnelInfo.position" />
               </div>
               <div class="form-item">
                 <span class="form-label">姓名:</span>
-                <el-input v-if="deviceDetail" placeholder="请输入姓名" v-model="deviceDetail.personnelInfo.position" />
+                <el-input v-if="deviceDetail" placeholder="请输入姓名" v-model="deviceDetail.personnelInfo.name" />
               </div>
               <div class="form-item">
                 <span class="form-label">ID:</span>
@@ -209,7 +209,6 @@ import strongLightActive from '@/assets/images/strong-light_HL.png';
 import floodLightDefault from '@/assets/images/flood-light.png';
 import floodLightActive from '@/assets/images/flood-light_HL.png';
 
-
 import di from '@/assets/images/di.png';
 import diAc from '@/assets/images/diAc.png';
 import high from '@/assets/images/high.png';
@@ -314,7 +313,7 @@ const staticModes = ref<any[]>([
     id: '2',
     name: '中档',
     icon: zhong, // 直接使用导入的变量
-    activeIcon:zhongAc,
+    activeIcon: zhongAc,
 
     active: false
   },
@@ -385,7 +384,7 @@ const deviceDetail = ref<any>({
 });
 
 //模式设置
-const handleModeClick = async (id: string, type: string) => {  
+const handleModeClick = async (id: string, type: string) => {
   if (Status[type] == id) {
     return;
   }
@@ -394,7 +393,7 @@ const handleModeClick = async (id: string, type: string) => {
 
     let dic = { promise: null, callback: null, key: '' };
 
-   //测试环境假装成功
+    //测试环境假装成功
     dic.promise = Promise.resolve({ code: 200, msg: '操作成功' });
 
     let arr = [];
@@ -418,7 +417,7 @@ const handleModeClick = async (id: string, type: string) => {
       });
     };
 
-    dic.promise.then((res) => {  
+    dic.promise.then((res) => {
       if (res.code === 200) {
         Status[type] = id;
         ElMessage.closeAll();
@@ -427,37 +426,35 @@ const handleModeClick = async (id: string, type: string) => {
           dic.callback();
         }
         if (callback) {
-          
           callback();
         }
-
       } else {
         proxy?.$modal.msgError(res.msg);
       }
     });
   };
-  if(type == 'sosMode' && Status.sosMode=== '1' && id==='0' && timer){
+  if (type == 'sosMode' && Status.sosMode === '1' && id === '0' && timer) {
     showClose();
     return;
-  }
+  } else if (type == 'sosMode' && id === '1' && timer == null) {
-  else if (type == 'sosMode' && id === '1') {
     ShowConfirm({
       title: '提示',
       text: '您确认开启180秒强制报警',
-      cancelCallback: null,
+      cancelCallback: () => {
+        timer = null;
+      },
       OkCallback: () => {
         sendCmd(function () {
-          
           Status.confirm.Visible = false;
-           deviceDetail.value.staSOSGrade="1";
+          deviceDetail.value.staSOSGrade = '1';
           Status.timeOut = 180;
           timer = setInterval(() => {
             if (Status.timeOut === 0) {
               clearInterval(timer);
               timer = null;
               hideConfirm();
-              handleModeClick('1','sosMode');
+              handleModeClick('1', 'sosMode');
-             deviceDetail.value.staSOSGrade="0";
+              deviceDetail.value.staSOSGrade = '0';
               return;
             }
 
@@ -476,26 +473,32 @@ const handleModeClick = async (id: string, type: string) => {
 };
 
 const getList = () => {
-  api.deviceRealTimeStatus(route.params.deviceId).then((res) => {
+  return new Promise((resolve, reject) => {
-    if (res && res.code == 200) {
+    api
-      let keys = Object.keys(res.data);
+      .deviceRealTimeStatus(route.params.deviceId)
-      keys.forEach((key) => {
+      .then((res) => {
-        deviceDetail.value[key] = res.data[key];
+        if (res && res.code == 200) {
-      });
+          
-      Status.sosMode = res.data.staSOSGrade;
+          let keys = Object.keys(res.data);
-      Status.staticPower = res.data.staDetectGrade;
+          keys.forEach((key) => {
-      Status.lightMode = res.data.staLightGrade;
+            deviceDetail.value[key] = res.data[key];
-      if(!deviceDetail.value.personnelInfo){
+          });
-        deviceDetail.value.personnelInfo={
+          Status.sosMode = res.data.staSOSGrade;
-          'id': null,
+          Status.staticPower = res.data.staDetectGrade;
-    'deviceId': null,
+          Status.lightMode = res.data.staLightGrade;
-    'name': null,
+          if (!deviceDetail.value.personnelInfo) {
-    'position': null,
+            deviceDetail.value.personnelInfo = {
-    'unitName': null,
+              'id': null,
-    'code': null
+              'deviceId': null,
+              'name': null,
+              'position': null,
+              'unitName': null,
+              'code': null
+            };
+          }
         }
-      }
+      })
-    }
+      .finally(resolve);
   });
 };
 
@@ -561,8 +564,6 @@ const sendTextMessage = async () => {
     batchId: ''
   };
 
- 
-
   api.SendMessage(json).then((res) => {
     if (res.code === 200) {
       ElMessage.closeAll();
@@ -571,6 +572,7 @@ const sendTextMessage = async () => {
       proxy?.$modal.msgError(res.msg);
     }
   });
+
 };
 const lookMap = (row: any) => {
   console.log(row, 'row');
@@ -586,52 +588,63 @@ const lookMap = (row: any) => {
 function showClose() {
   Status.confirm.Visible = true;
   Status.confirm.OkTxt = '关闭';
-  Status.confirm.OkCallback=()=>{
+  Status.confirm.OkCallback = () => {
-      clearInterval(timer);
+    clearInterval(timer);
-    timer=null;
+    timer = null;
-    handleModeClick('0','sosMode');
+    handleModeClick('0', 'sosMode');
-    deviceDetail.value.staSOSGrade="0";
+    deviceDetail.value.staSOSGrade = '0';
-  
+
-    Status.timeOut=0;
+    Status.timeOut = 0;
-    
+
     hideConfirm();
-  }
+  };
 }
 // 处理设备消息
 const handleDeviceMessage = (payload: any) => {
-  let json = JSON.parse(payload);
+  let json = null;
+  try {
+    json = JSON.parse(payload);
+  } catch (ex) {
+    return;
+  }
+
   let keys = Object.keys(json);
 
   function parseDataMQ(json) {
-    deviceDetail.value.staDetectGrade = json.sta_DetectGrade;
+    try {
-    deviceDetail.value.staLightGrade = json.sta_LightGrade;
+      debugger;
-    deviceDetail.value.staDetectResult = json.sta_DetectResult;
+      deviceDetail.value.staDetectGrade = json.sta_DetectGrade;
-    deviceDetail.value.staSOSGrade = json.sta_SOSGrade;
+      deviceDetail.value.staLightGrade = json.sta_LightGrade;
-    deviceDetail.value.sta_ShakeBit = json.sta_ShakeBit;
+      deviceDetail.value.staDetectResult = json.sta_DetectResult;
-    deviceDetail.value.staPowerTime = json.sta_PowerTime;
+      deviceDetail.value.staSOSGrade = json.sta_SOSGrade;
-    deviceDetail.value.staPowerPercent = json.sta_PowerPercent;
+      deviceDetail.value.sta_ShakeBit = json.sta_ShakeBit;
-    deviceDetail.value.longitude = json.sta_longitude;
+      deviceDetail.value.staPowerTime = json.sta_PowerTime;
-    deviceDetail.value.latitude = json.sta_latitude;
+      deviceDetail.value.staPowerPercent = json.sta_PowerPercent;
-    deviceDetail.value.onlineStatus = 1;
+      deviceDetail.value.longitude = json.sta_longitude;
+      deviceDetail.value.latitude = json.sta_latitude;
+      deviceDetail.value.onlineStatus = 1;
 
-    Status.sosMode = json.sta_SOSGrade;
+      Status.sosMode = json.sta_SOSGrade;
-    Status.staticPower = json.sta_DetectGrade;
+      Status.staticPower = json.sta_DetectGrade;
-    Status.lightMode = json.sta_LightGrade;
+      Status.lightMode = json.sta_LightGrade;
+      console.log('Status=', Status);
+      console.log('sosModes=', sosModes.value);
+      console.log('sta_SOSGrade=', json.sta_SOSGrade);
+      if (json.sta_PowerPercent < 20) {
+        centerDialogVisible.value = true;
+      }
 
-    if (json.sta_PowerPercent < 20) {
+      if (json.sta_SOSGrade == 1 && json.sta_ShakeBit == 1) {
-      centerDialogVisible.value = true;
+        confirm('设备SOS报警、静止预警中');
-    }
+        return;
-
+      }
-    if (json.sta_SOSGrade == 1 && json.sta_ShakeBit == 1) {
+      if (json.sta_SOSGrade == 1) {
-      confirm('设备SOS报警、静止预警中');
+        confirm('设备SOS报警中');
-      return;
+      }
-    }
+      if (json.sta_ShakeBit == 1) {
-    if (json.sta_SOSGrade == 1) {
+        confirm('设备静止报警中');
-      confirm('设备SOS报警中');
+      }
-    }
+    } catch (err) {}
-    if (json.sta_ShakeBit == 1) {
-      confirm('设备静止报警中');
-    }
   }
 
   if (keys.indexOf('sta_DetectGrade') > -1) {
@@ -639,11 +652,21 @@ const handleDeviceMessage = (payload: any) => {
     console.log('收到设备上报的数据', payload);
     parseDataMQ(json);
   }
+
+  
+  if(keys.indexOf('sta_BreakNews')>-1){
+    if(json.sta_BreakNews==='I get it'){
+
+      confirm('用户已确认收到紧急通知');
+    }
+  }
+
 };
 onMounted(async () => {
   await getList(); // 先获取设备信息
   // 连接mqtt
   onConnect(async () => {
+    
     const deviceImei = deviceDetail.value.deviceImei;
     if (!deviceImei) {
       return;
@@ -657,6 +680,7 @@ onMounted(async () => {
   });
   // 2. 注册消息接收回调（核心：处理设备发送的消息）
   onMessage((msg) => {
+    
     console.log('收到新消息:', {
       主题: msg.topic,
       内容: msg.payload,
@@ -664,7 +688,7 @@ onMounted(async () => {
       QoS: msg.qos
     });
     // 在这里处理消息（根据实际业务逻辑）
-    handleDeviceMessage(msg);
+    handleDeviceMessage(msg.payload);
   });
   onError((err) => {
     console.error('MQTT连接失败原因:', err.message); // 关键：打印连接失败的具体原因
@@ -745,7 +769,7 @@ window.hideConfirm = function () {
 };
 </script>
 <style lang="scss" scoped>
-.p-2{
+.p-2 {
   background: rgba(247, 248, 252, 1);
   min-height: 100vh;
   box-sizing: border-box;

src/views/controlCenter/controlPanel/components/map.vue

@@ -222,7 +222,7 @@ onUnmounted(() => {
 }
 
 .amap-container {
-  height: calc(100vh - 22vh);
+  height: calc(100vh - 25vh);
   border-radius: 4px;
   overflow: hidden;
   width: 100%;

src/views/controlCenter/controlPanel/index.vue

@@ -82,7 +82,7 @@
         </transition>
         <el-card class="Maplist">
           <div v-if="isListView" key="list">
-            <el-table v-loading="loading" border :data="deviceList" @selection-change="handleSelectionChange">
+            <el-table v-loading="loading" border :data="deviceList" @selection-change="handleSelectionChange"  height="calc(100vh - 310px)">
               <el-table-column type="selection" width="50" align="center" :selectable="isSelectable" />
               <el-table-column label="设备名称" align="center" prop="deviceName" />
               <el-table-column label="设备图片" align="center" prop="devicePic">
@@ -575,7 +575,7 @@ const forceAlarm = async () => {
 }
 
 .Maplist {
- height: calc(100vh - 24vh);
+ //height: calc(100vh - 24vh);
-  overflow: auto;
+  //overflow: auto;
 }
 </style>

src/views/controlCenter/delivery/index.vue

@@ -58,7 +58,7 @@
         </transition>
         <el-card class="Maplist">
           <div>
-            <el-table v-loading="loading" border :data="deviceList" @selection-change="handleSelectionChange">
+            <el-table v-loading="loading" border :data="deviceList" @selection-change="handleSelectionChange" height="calc(100vh - 400px)">
               <el-table-column type="selection" width="50" align="center" />
               <el-table-column label="设备名称" align="center" prop="deviceName" />
               <el-table-column label="设备型号" align="center" prop="deviceType" />
@@ -299,7 +299,7 @@ height: calc(100vh - 8vh);
 }
 
 .Maplist {
-  height: calc(100vh - 24vh);
+ height: calc(100vh - 24vh);
-  overflow: auto;
+ // overflow: auto;
 }
 </style>

src/views/controlCenter/historyjectory/index.vue

@@ -58,7 +58,7 @@
         </transition>
         <el-card class="Maplist">
           <div>
-            <el-table v-loading="loading" border :data="deviceList" @selection-change="handleSelectionChange">
+            <el-table v-loading="loading" border :data="deviceList" @selection-change="handleSelectionChange" height="calc(100vh - 400px)">
               <el-table-column type="selection" width="50" align="center" />
               <el-table-column label="设备名称" align="center" prop="deviceName" />
               <el-table-column label="设备型号" align="center" prop="deviceType" />
@@ -308,6 +308,6 @@ height: calc(100vh - 8vh);
 
 .Maplist {
  height: calc(100vh - 24vh);
-  overflow: auto;
+  // overflow: auto;
 }
 </style>

src/views/debugCenter/debugPanel/index.vue

@@ -25,7 +25,7 @@
           <el-collapse-item name="1">
             <el-form ref="queryFormRef" :model="queryParams" :inline="true" class="queryFormRef">
               <el-form-item label="设备类型" prop="deviceType">
-                <el-select v-model="queryParams.deviceType" placeholder="设备类型">
+                <el-select v-model="queryParams.deviceType" placeholder="设备类型" clearable filterable>
                   <el-option v-for="item in deviceTypeOptions" :key="item.value" :label="item.typeName" :value="item.deviceTypeId" />
                 </el-select>
               </el-form-item>
@@ -69,7 +69,7 @@
         :data="List"
         :height="Status.showSearch.length > 0 ? 'calc(100vh - 355px)' : 'calc(100vh - 255px)'"
       >
-        <el-table-column type="selection" width="50" align="center"  :selectable="isSelectable"/>
+        <el-table-column type="selection" width="50" align="center" :selectable="isSelectable" />
         <el-table-column label="设备名称" align="center" prop="deviceName" />
         <el-table-column label="设备图片" align="center" prop="devicePic">
           <template #default="scope">
@@ -189,7 +189,7 @@
             <div class="Preview">
               <div class="imgContent" v-for="(item, index) in cEdit.fileParam">
                 <img class="img" :src="item.src" />
-                <div class="opt" @click.stop="DelImg(item,index,'fileParam')">
+                <div class="opt" @click.stop="DelImg(item, index, 'fileParam')">
                   <el-icon>
                     <Delete />
                   </el-icon>
@@ -207,7 +207,14 @@
           <div class="title">操作说明</div>
           <div class="imgs">
             <div class="Preview">
-              <img onerror="this.style.display='none'" v-for="(item, index) in cEdit.fileOprat" class="img" :src="item.src" />
+              <div class="imgContent" v-for="(item, index) in cEdit.fileOprat">
+                <img class="img" :src="item.src" />
+                <div class="opt" @click.stop="DelImg(item, index, 'fileOprat')">
+                  <el-icon>
+                    <Delete />
+                  </el-icon>
+                </div>
+              </div>
             </div>
           </div>
           <div class="option center" @click.stop="showCheckFile('fileOprat')">添加</div>
@@ -231,8 +238,8 @@
 
     <!-- 提示框 -->
     <el-dialog :width="300" :draggable="true" v-model="Status.confirm.Visible" :title="Status.confirm.title" center>
-      <span>
+      <span v-html="Status.confirm.text">
-        {{ Status.confirm.text }}
+        
       </span>
       <template #footer>
         <div class="dialog-footer">
@@ -248,7 +255,7 @@
 import api from '@/api/debugCenter/debugCenter';
 import common from '@/utils/common';
 import apiTypeAll from '@/api/equipmentManagement/device/index';
-import uploadHelper   from '@/api/debugCenter/deviceApi';
+import uploadHelper from '@/api/debugCenter/deviceApi';
 
 var fileInput = document.getElementById('fileInput');
 var fileInputs = {
@@ -293,7 +300,7 @@ var cEdit = reactive({
   fileParam: [],
   fileOprat: [],
   Video: '',
-  fileIds:[]
+  fileIds: []
 });
 //页码控件数据
 var pagin = reactive({
@@ -340,8 +347,7 @@ function handleQuery() {
 const isSelectable = (row: any) => {
   // 仅当在线状态（onlineStatus == 1）时允许选中
   return row.onlineStatus === 1;
-}
+};
-
 
 function getList() {
   Status.loading = true;
@@ -425,10 +431,11 @@ function ShowMultiEdit(type: MideaType) {
 
   setTimeout(dragImgAddEvt, 500);
 }
+
 function ShowSingleEdit(item) {
   Status.ShowEditPop = true;
   //期待接口返回以下4个字段
-  
+
   cEdit.deviceId = item.id;
   cEdit.deviceImei = item.deviceImei;
   cEdit.Video = item.Video;
@@ -454,7 +461,7 @@ function ShowSingleEdit(item) {
           return v.fileType == 1;
         })
         .map((v) => {
-          return {id:v.id, name: v.fileName, type: '', size: '', src: v.fileUrl, file: null };
+          return { id: v.id, name: v.fileName, type: '', size: '', src: v.fileUrl, file: null };
         });
 
       cEdit.fileParam = arr
@@ -462,7 +469,7 @@ function ShowSingleEdit(item) {
           return v.fileType == 2;
         })
         .map((v) => {
-          return {id:v.id, name: v.fileName, type: '', size: '', src: v.fileUrl, file: null };
+          return { id: v.id, name: v.fileName, type: '', size: '', src: v.fileUrl, file: null };
         });
 
       cEdit.fileBoot.src = '';
@@ -478,7 +485,7 @@ function CloseSingleEdit() {
   cEdit.fileBoot = { name: '', type: '', size: '', src: '', file: null };
   cEdit.fileOprat = [];
   cEdit.fileParam = [];
-  cEdit.fileIds=[];
+  cEdit.fileIds = [];
 }
 
 //关闭上传框
@@ -575,7 +582,7 @@ function updaeLogo(ids, file, deviceType?: number) {
   }
   const finalDeviceType = deviceType || realDeviceType;
   const finalIds = Array.isArray(ids) ? ids : [ids];
-  const finalFile = file || checkFile.file || cEdit.fileBoot.file; 
+  const finalFile = file || checkFile.file || cEdit.fileBoot.file;
   if (!finalFile || finalIds.length === 0) {
     return Promise.resolve({ code: 200, msg: '成功' });
   }
@@ -591,7 +598,7 @@ function SaveItemData() {
   var formData = new FormData();
   formData.append('deviceId', cEdit.deviceId);
   formData.append('deviceImei', cEdit.deviceImei);
-  formData.append("fileIds",cEdit.fileIds);
+  formData.append('fileIds', cEdit.fileIds);
 
   cEdit.fileParam.forEach((v) => {
     if (v.file) {
@@ -615,11 +622,20 @@ function SaveItemData() {
       if (res[0].status == 'fulfilled' && res[1].status == 'fulfilled') {
         if (res[0].value.code == 200 && res[1].value.code == 200) {
           CloseSingleEdit();
-          alert('操作成功');
+          alert('<span class="green">操作成功</span>');
           return;
         }
       }
-      alert('全部失败或部分失败');
+      if(res[0].status == 'fulfilled' && res[0].value.code == 200){
+        alert('<span class="green">产品参数、操作说明、操作视频保存成功</span>，<span class="red">开机画面保存失败</span>');
+        return;
+      }
+
+      if(res[1].status == 'fulfilled' && res[1].value.code == 200){
+        alert('<span class="red">产品参数、操作说明、操作视频保存失败</span>，<span class="green">开机画面保存成功</span>');
+        return;
+      }
+      alert('<span class="red">操作失败</span>');
     })
     .finally(() => {
       Status.fullLoading = false;
@@ -822,17 +838,15 @@ var hideConfirm = function () {
 };
 
 //删除某个图片
-function DelImg(item,index,type){
+function DelImg(item, index, type) {
-  
+  if (item.id) {
-if(item.id){
+    confirm('您确认删除吗?', () => {
-confirm('您确认删除吗?',()=>{
+      cEdit.fileIds.push(item.id);
-  cEdit.fileIds.push(item.id);
+      cEdit[type].splice(index, 1);
-   cEdit[type].splice(index,1);
+    });
-
+  } else {
-});
+    cEdit[type].splice(index, 1);
-}else{
+  }
-  cEdit[type].splice(index,1);
-}
 }
 
 onMounted(() => {
@@ -1079,8 +1093,8 @@ onMounted(() => {
   cursor: pointer;
   color: #bd2b2b;
   font-size: 30px;
- text-align: center;
+  text-align: center;
- line-height: 90px;
+  line-height: 90px;
 }
 .SingEditContent .item .imgContent:hover .opt {
   display: block !important;
@@ -1093,5 +1107,4 @@ onMounted(() => {
 .red {
   color: rgba(224, 52, 52, 1);
 }
-
 </style>

src/views/equipmentManagement/devices/eqDetail.vue

@@ -24,7 +24,7 @@
         
         <div class="item">
           <div class="lable">通讯方式<span>：</span></div>
-          <div class="val">{{ detailData?.communicationMode===1 ?'蓝牙':'4G' }}</div>
+          <div class="val">{{ detailData?.communicationMode===1 ?'4G':'蓝牙' }}</div>
         </div>
         <div class="item">
           <div class="lable">蓝牙名称<span>：</span></div>
@@ -183,7 +183,7 @@ watch(
   font-size: 14px;
   font-weight: 400;
 
-  letter-spacing: 0px;
+  letter-spacing: 0px;   
   text-align: left;
   float: left;
 }

src/views/equipmentManagement/devices/index.vue

@@ -15,23 +15,29 @@
               <el-form-item label="设备IMEI" prop="deviceImei">
                 <el-input v-model="queryParams.deviceImei" placeholder="请输入设备IMEI" clearable />
               </el-form-item>
-              <el-form-item label="设备类型" prop="deviceType">
+              <el-form-item label="设备类型" prop="deviceType" >
-                <el-select v-model="queryParams.deviceType" placeholder="设备类型">
+                <el-select v-model="queryParams.deviceType" placeholder="设备类型" clearable filterable>
                   <el-option v-for="item in deviceTypeOptions" :key="item.value" :label="item.typeName"
                     :value="item.id" />
                 </el-select>
               </el-form-item>
               <el-form-item label="设备状态" prop="deviceStatus" v-hasPermi="['equipment:devices:allocate']">
-                <el-select v-model="queryParams.deviceStatus" placeholder="设备状态" style="margin-left: 10px">
+                <el-select v-model="queryParams.deviceStatus" placeholder="设备状态"  clearable>
                   <el-option label="正常" value="1" />
                   <el-option label="失效" value="0" />
                 </el-select>
               </el-form-item>
               <el-form-item label="在线状态" prop="onlineStatus">
-                <el-select v-model="queryParams.onlineStatus" placeholder="在线状态" style="margin-left: 10px">
+                <el-select v-model="queryParams.onlineStatus" placeholder="在线状态" clearable>
                   <el-option label="在线" value="1" />
                   <el-option label="离线" value="0" />
-                   <el-option label="故障" value="2" />
+                  <el-option label="故障" value="2" />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="绑定状态" prop="bindingStatus">
+                <el-select v-model="queryParams.bindingStatus" placeholder="绑定状态" clearable>
+                  <el-option label="已绑定" value="1" />
+                  <el-option label="未绑定" value="0" />
                 </el-select>
               </el-form-item>
               <el-form-item label="创建时间">
@@ -221,7 +227,7 @@
           <el-col :span="24">
             <el-form-item label="设备类型" prop="deviceType">
               <el-select v-model="form.deviceType" placeholder="设备类型" @change="(id) => handleDeviceTypeChange(id)"
-                :disabled="form.id != ''">
+                >
                 <el-option v-for="item in deviceTypeOptions" :key="item.value" :label="item.typeName"
                   :value="item.id" />
               </el-select>
@@ -312,11 +318,11 @@
           <span style="color: #409eff">批量导入完成，共检测到 <span style="color: #e6a23c">{{ importResult.total }}</span> 条数据，导入成功
             <span style="color: #67c23a">{{ importResult.succeed }}</span> 条，失败
             <span style="color: red">{{ importResult.errorSun }}</span> 条。</span>
-          <p v-if="importResult.errorSun > 0" style="padding: 10px">
-            <a :href="importResult.link">>>> 上传失败明细下载 <i class="el-icon-download" /></a>
-          </p>
         </div>
       </el-upload>
+      <p v-if="importResult.errorSun > 0" style="padding: 10px">
+        <a :href="importResult.link">>>> 上传失败明细下载 <i class="el-icon-download" /></a>
+      </p>
       <template #footer>
         <div class="dialog-footer">
           <el-button @click="importDialogVisible = false">取 消</el-button>
@@ -459,7 +465,8 @@ const initData: PageData<deviceForm, deviceQuery> = {
     deviceImei: '',
     deviceType: '',
     deviceStatus: '',
-    onlineStatus:''
+    onlineStatus: '',
+    bindingStatus:''
   },
   rules: {
     deviceName: [{ required: true, message: '请输入设备名称', trigger: 'blur' }],
@@ -909,7 +916,7 @@ const handleBatchImport = () => {
 const downloadTemplate = () => {
   // 这里可用 window.open 或 a 标签下载模板
   const link = document.createElement('a');
-  link.href = 'https://fuyuanshen.com/fys/Equipmentimporttemplate/EquipmentImportTemplate.xlsx';
+  link.href = 'https://www.cnxhyc.com/jquan/Equipmentimporttemplate/EquipmentImportTemplate.xlsx';
   link.download = '设备数据导入模板.xlsx'; // 可选：指定下载文件名
   link.style.display = 'none'; // 隐藏标签
   document.body.appendChild(link);
@@ -917,11 +924,11 @@ const downloadTemplate = () => {
   document.body.removeChild(link); // 移除标签
 };
 const beforeImportUpload = (file: any) => {
-  const isLt5M = file.size / 1024 / 1024 < 5;
+  // const isLt5M = file.size / 1024 / 1024 < 5;
-  if (!isLt5M) {
+  // if (!isLt5M) {
-    proxy?.$modal.msgError('上传文件大小不能超过 5MB!');
+  //   proxy?.$modal.msgError('上传文件大小不能超过 5MB!');
-  }
+  // }
-  return isLt5M;
+  // return isLt5M;
 };
 
 //添加tokenf方法head_upload 直接返回 getBearerToken()
@@ -930,10 +937,8 @@ const handleImportSuccess = (response: any) => {
   if (response.code == 200) {
     console.log('导入成功了么');
     importResult.value.isShow = true;
-
     if (response.data) {
       console.log(response.data, 'response.data');
-
       importResult.value.succeed = response.data.successCount;
       importResult.value.errorSun = response.data.failureCount;
       importResult.value.total = importResult.value.succeed + importResult.value.errorSun;
@@ -944,6 +949,9 @@ const handleImportSuccess = (response: any) => {
     }
     getList(); // 初始化列表数据
   } else {
+    if (importUpload.value) {
+      importUpload.value.clearFiles();
+    }
     proxy?.$modal.msgError(response.msg);
   }
 };
@@ -967,15 +975,13 @@ const handleBatchAssignConfirm = () => {
     customerId: batchAssignCustomerId.value, // 目标客户ID
     deviceIds: selectedIds // 选中的设备ID数组
   };
-  api
+  api.deviceAssignCustomer(data).then((res) => {
-    .deviceAssignCustomer(data)
+    if (res.code == 200) {
-    .then((res) => {
+      batchAssignDialogVisible.value = false;
-      if (res.code == 200) {
+      getList();
-        batchAssignDialogVisible.value = false;
+      return proxy?.$modal.msgSuccess(`分配成功`);
-        getList();
+    }
-        return proxy?.$modal.msgSuccess(`分配成功`);
+  })
-      }
-    })
     .catch(() => { });
 };
 

src/views/equipmentManagement/devices/shareManage.vue

@@ -141,6 +141,7 @@
 import request from '@/utils/request';
 import common from '@/utils/common';
 import api from '@/api/equipmentManagement/device/shareManage';
+import { dataURLtoImage } from 'image-conversion';
 const props = defineProps({
   data: {
     type: Object,
@@ -211,18 +212,172 @@ var dic = reactive({
 });
 
 
-var power = computed(() => {
+var power =ref([]); 
-  let arr = [];
+
-  let keys = Object.keys(dic);
+function calcPower() {
-  keys.forEach((key) => {
+  
-    arr.push({ label: dic[key], value: key });
+
-  });
+  let array = [{
-  return arr;
+				value: "1",
-});
+				label: "灯光模式",
+				checked: false,
+				type: ['BJQ6170', 'HBY670','HBY102','BJQ6155','HBY650','BJQ7305','61XH55']
+			},
+			{
+				value: "2",
+				label: "激光模式",
+				checked: false,
+				type: ['BJQ6170']
+			},
+			{
+				value: "3",
+				label: "开机画面",
+				checked: false,
+				type: ['HBY210', 'BJQ6170', 'HBY670','BJQ6155','HBY650','BJQ7305','61XH55']
+			},
+			{
+				value: "4",
+				label: "人员信息登记",
+				checked: false,
+				type: ['HBY210', 'BJQ6170', 'HBY670','BJQ6155','HBY650','BJQ7305','61XH55']
+			},
+			{
+				value: "5",
+				label: "发送信息",
+				checked: false,
+				type: ['HBY210', 'BJQ6170', 'HBY670']
+			},
+			{
+				value: "6",
+				label: "产品信息",
+				checked: false,
+				type: ['HBY210', 'BJQ6170', 'HBY670']
+			}, {
+				value: "41",
+				label: "静电探测",
+				checked: false,
+				type: ['HBY670','HBY650']
+			}, {
+				value: "42",
+				label: "SOS",
+				checked: false,
+				type: ['HBY670','BJQ4877']
+			},
+			{
+				value: "43",
+				label: "联机设备",
+				checked: false,
+				type: ['HBY210']
+			},
+				{
+				value: "44",
+				label: "报警声音",
+				checked: false,
+				type: ['HBY210']
+			},
+				{
+				value: "45",
+				label: "自动报警",
+				checked: false,
+				type: ['HBY210']
+			},
+				{
+				value: "46",
+				label: "手动报警",
+				checked: false,
+				type: ['HBY210','HBY102']
+			},
+				{
+				value: "47",
+				label: "报警时长",
+				checked: false,
+				type: ['HBY210']
+			},
+			{
+				value: "48",
+				label: "物体感应",
+				checked: false,
+				type: ['HBY102']
+			},
+			{
+				value: "49",
+				label: "联机模式",
+				checked: false,
+				type: ['HBY102']
+			},
+			
+			{
+				value: "50",
+				label: "报警模式",
+				checked: false,
+				type: ['HBY100','HBY100-J']
+			},
+			
+			{
+				value: "51",
+				label: "警示灯",
+				checked: false,
+				type: ['HBY100','HBY100-J']
+			},
+			
+			{
+				value: "52",
+				label: "语音管理",
+				checked: false,
+				type: ['HBY100','HBY100-J']
+			},
+			
+			{
+				value: "53",
+				label: "箭头模式",
+				checked: false,
+				type: ['BJQ4877']
+			},
+			{
+				value: "54",
+				label: "配组设置",
+				checked: false,
+				type: ['BJQ4877']
+			},
+			{
+				value: "55",
+				label: "修改信道",
+				checked: false,
+				type: ['BJQ4877']
+			},
+			{
+				value: "56",
+				label: "灯光类型设置",
+				checked: false,
+				type: ['HBY100-J']
+			}
+		];
+
+     
+let f=array.filter(v=>{
+ if(v.type.indexOf(data.value.typeName)>-1){
+  return true;
+ }
+ return false;
+})
+
+power.value=f;
+
+  // let arr = [];
+  // let keys = Object.keys(dic);
+
+  // keys.forEach((key) => {
+  //   arr.push({ label: dic[key], value: key });
+  // });
+  // return arr;
+};
+
+
 //打开编辑
 function ShowEdit() {
   Status.ShowEditPop = true;
   getUsrs();
+  calcPower();
 }
 //关闭编辑
 function CloseEdit() {
@@ -276,6 +431,7 @@ function SaveFormData(type) {
 }
 
 function getPower(item) {
+  
   let str = [];
   if (item && item.permission) {
     let arr = item.permission.split(',');

src/views/equipmentManagement/repairRecords/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="content" v-loading="Status.fullLoading">
     <div class="main">
-      <div class="TopTool">
+      <div class         ="TopTool">
         <div class="button-row">
           <el-button type="primary" icon="Plus" @click.stop="ShowEdit(null, true, formRef)">新增维修</el-button>
           <el-button type="primary" plain icon="Download" @click.stop="ExportRecord()">导出</el-button>
@@ -9,14 +9,8 @@
         </div>
 
         <div class="rightSearch">
-          <el-input
+          <el-input :suffix-icon="'Search'" clearable v-model="advanceSearch.searchValue" class="responsive-input"
-            :suffix-icon="'Search'"
+            placeholder="名称" @input="txtSearch">
-            clearable
-            v-model="advanceSearch.searchValue"
-            class="responsive-input"
-            placeholder="名称"
-            @input="txtSearch"
-          >
           </el-input>
 
           <el-button style="margin-left: 10px" type="primary" @click.stop="ToggleAdvance()">高级筛选</el-button>
@@ -43,17 +37,9 @@
             <el-input v-model="advanceSearch.repairReason" placeholder="请输入" clearable />
           </el-form-item> -->
           <el-form-item label="维修时间">
-            <el-date-picker
+            <el-date-picker v-model="advanceSearch.Date" type="daterange" format="YYYY-MM-DD" style="width: 240px"
-              v-model="advanceSearch.Date"
+              value-format="YYYY-MM-DD" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
-              type="daterange"
+              :size="'default'" />
-              format="YYYY-MM-DD"
-              style="width: 240px"
-              value-format="YYYY-MM-DD"
-              range-separator="-"
-              start-placeholder="开始日期"
-              end-placeholder="结束日期"
-              :size="'default'"
-            />
             <div>
               <el-button style="margin-left: 5px" type="primary" @click.stop="Search()">查询</el-button>
               <el-button type="primary" @click.stop="Reset()">重置</el-button>
@@ -71,7 +57,8 @@
           <el-table-column label="损坏原因" align="center" prop="repairReason" />
           <el-table-column label="维修人员" align="center" prop="repairPerson" />
 
-          <el-table-column label="操作" align="center" fixed="right" width="280" class-name="small-padding fixed-width opt">
+          <el-table-column label="操作" align="center" fixed="right" width="280"
+            class-name="small-padding fixed-width opt">
             <template #default="scope">
               <div class="center">
                 <el-text class="mx-1" type="primary" @click.stop="ShowEdit(scope.row, true, formRef)">编辑</el-text>
@@ -81,47 +68,29 @@
             </template>
           </el-table-column>
         </el-table>
-        <pagination
+        <pagination v-show="pagin.total > 0" v-model:page="advanceSearch.pageNum" v-model:limit="advanceSearch.pageSize"
-          v-show="pagin.total > 0"
+          :total="pagin.total" @pagination="getRecordList" />
-          v-model:page="advanceSearch.pageNum"
-          v-model:limit="advanceSearch.pageSize"
-          :total="pagin.total"
-          @pagination="getRecordList"
-        />
       </div>
     </div>
 
     <!-- 新增、编辑弹出层 -->
-    <el-dialog
+    <el-dialog class="editPop" v-model="Status.ShowEditPop" :data-val="Status.ShowEditPop"
-      class="editPop"
+      :title="!cEdit.isEdit ? '维修详情' : cEdit.recordId ? '编辑维修' : '新增维修'" width="800" :draggable="true">
-      v-model="Status.ShowEditPop"
-      :data-val="Status.ShowEditPop"
-      :title="!cEdit.isEdit ? '维修详情' : cEdit.recordId ? '编辑维修' : '新增维修'"
-      width="800"
-      :draggable="true"
-    >
       <div class="form">
         <el-form :model="cEdit" ref="formRef" style="max-width: 750px" :rules="rules">
           <el-form-item label="设备名称" label-position="right" prop="deviceId">
             <!-- <el-input v-model="selectedRow['deviceName']" :readonly="true" @click.stop="ShowDevice('Edit', true)" placeholder="请选择设备" /> -->
             <el-select v-model="cEdit.deviceId" placeholder="选择设备" clearable :disabled="!cEdit.isEdit" filterable>
-              <el-option v-for="item in deviceDist" :key="item.deviceId" :label="item.deviceName" :value="item.deviceId"
+              <el-option v-for="item in deviceDist" :key="item.deviceId" :label="item.deviceName"
-            /></el-select>
+                :value="item.deviceId" /></el-select>
           </el-form-item>
 
           <el-form-item label="维修人员" label-position="right" prop="repairPerson">
             <el-input v-model="cEdit.repairPerson" :readonly="!cEdit.isEdit" placeholder="请输入姓名" />
           </el-form-item>
           <el-form-item label="维修时间" label-position="right" prop="repairTime">
-            <el-date-picker
+            <el-date-picker v-model="cEdit.repairTime" :readonly="!cEdit.isEdit" type="datetime" placeholder="请选择时间"
-              v-model="cEdit.repairTime"
+              format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" style="width: 100%" />
-              :readonly="!cEdit.isEdit"
-              type="datetime"
-              placeholder="请选择时间"
-              format="YYYY-MM-DD HH:mm:ss"
-              value-format="YYYY-MM-DD HH:mm:ss"
-              style="width: 100%"
-            />
           </el-form-item>
           <el-form-item label="维修部位" label-position="right" prop="repairPart">
             <el-input v-model="cEdit.repairPart" :readonly="!cEdit.isEdit" placeholder="请输入维修部位" />
@@ -131,19 +100,10 @@
           </el-form-item>
 
           <el-form-item label="损坏照片" label-position="right">
-            <el-upload
+            <el-upload :disabled="!cEdit.isEdit" ref="beforeUploadRef" class="upload-demo" action=""
-              :disabled="!cEdit.isEdit"
+              :auto-upload="false" :on-change="handleFileChange1" :file-list="beforeFiles"
-              ref="beforeUploadRef"
+              accept=".jpg,.jpeg,.png,.gif.webp" :limit="9" list-type="picture-card"
-              class="upload-demo"
+              :class="{ 'hide-add-btn': !cEdit.isEdit }">
-              action=""
-              :auto-upload="false"
-              :on-change="handleFileChange1"
-              :file-list="beforeFiles"
-              accept=".jpg,.jpeg,.png,.gif.webp"
-              :limit="9"
-              list-type="picture-card"
-              :class="{ 'hide-add-btn': !cEdit.isEdit }"
-            >
               <el-icon>
                 <Plus />
               </el-icon>
@@ -168,19 +128,9 @@
           </el-form-item>
 
           <el-form-item label="修复照片" label-position="right">
-            <el-upload
+            <el-upload :disabled="!cEdit.isEdit" ref="afterUploadRef" class="upload-demo" action="" :auto-upload="false"
-              :disabled="!cEdit.isEdit"
+              :on-change="handleFileChange2" :file-list="afterFiles" accept=".jpg,.jpeg,.png,.gif.webp" :limit="9"
-              ref="afterUploadRef"
+              list-type="picture-card" :class="{ 'hide-add-btn': !cEdit.isEdit }">
-              class="upload-demo"
-              action=""
-              :auto-upload="false"
-              :on-change="handleFileChange2"
-              :file-list="afterFiles"
-              accept=".jpg,.jpeg,.png,.gif.webp"
-              :limit="9"
-              list-type="picture-card"
-              :class="{ 'hide-add-btn': !cEdit.isEdit }"
-            >
               <el-icon>
                 <Plus />
               </el-icon>
@@ -321,7 +271,8 @@
     </el-dialog> -->
 
     <!-- 提示框 -->
-    <el-dialog :width="300" :draggable="true" v-model="Status.confirm.Visible" :title="Status.confirm.title" width="500" center>
+    <el-dialog :width="300" :draggable="true" v-model="Status.confirm.Visible" :title="Status.confirm.title" width="500"
+      center>
       <span>
         {{ Status.confirm.text }}
       </span>
@@ -509,18 +460,21 @@ function ToggleAdvance() {
 
 //显示编辑
 function ShowEdit(item = undefined, isEdit = true, formEl = undefined) {
+  // 先隐藏弹窗，避免提前渲染错误状态
   Status.ShowEditPop = true;
   let def = {
-    recordId: null, //维修记录id
+    recordId: null,
-
+    deviceId: '',
-    deviceId: '', //设备id
+    repairTime: '',
-    repairTime: '', //维修时间
+    repairPart: '',
-    repairPart: '', //维修部位
+    repairReason: '',
-    repairReason: '', //维修原因
+    repairPerson: '',
-    repairPerson: '', //维修人员,
     imageIds: []
   };
-
+  // 先重置表单和状态，避免残留
+  ResetFormData();
+  // 先赋值 isEdit 基础状态
+  cEdit.isEdit = isEdit;
   let promise1 = new Promise((resolve, reject) => {
     if (item) {
       api
@@ -542,60 +496,43 @@ function ShowEdit(item = undefined, isEdit = true, formEl = undefined) {
 
   promise1
     .then((res) => {
-      debugger;
       item = res;
       if (!item) {
+        // 新增场景，isEdit 保持 true
         cEdit.isEdit = isEdit;
         return;
       }
       let keys = Object.keys(cEdit);
       keys.forEach((key, i) => {
         if (item) {
-          //编辑
+          // 编辑/详情场景，赋值数据
           if (item[key] !== undefined) {
             cEdit[key] = item[key];
           } else {
             cEdit[key] = def[key];
           }
         } else {
-          //新增
+          // 新增场景
           cEdit[key] = def[key];
         }
       });
-      debugger;
       if (item.images && item.images.length) {
+        // 处理图片逻辑（保持原有代码）
         beforeFiles.value = item.images
-          .filter((v) => {
+          .filter((v) => v.imageType == 'BEFORE')
-            if (v.imageType == 'BEFORE') {
+          .map((v) => ({ name: v.imageId, url: v.imageUrl, id: v.imageId }));
-              return true;
-            }
-
-            return false;
-          })
-          .map((v) => {
-            return { name: v.imageId, url: v.imageUrl, id: v.imageId };
-          });
-
         afterFiles.value = item.images
-          .filter((v) => {
+          .filter((v) => v.imageType == 'AFTER')
-            if (v.imageType == 'AFTER') {
+          .map((v) => ({ name: v.imageId, url: v.imageUrl, id: v.imageId }));
-              return true;
+        if (formEl) formEl.validate();
-            }
-            return false;
-          })
-          .map((v) => {
-            return { name: v.imageId, url: v.imageUrl, id: v.imageId };
-          });
-
-        if (!formEl) return;
-
-        formEl.validate();
       }
       if (item) {
         selectedRow.value['deviceName'] = item.deviceName;
       }
-
+      // 确保 isEdit 最终赋值正确（覆盖异步过程中可能的异常）
       cEdit.isEdit = isEdit;
+      // 所有状态赋值完成后，再显示弹窗
+      Status.ShowEditPop = true;
     })
     .finally(() => {});
 }
@@ -611,11 +548,9 @@ function ShowDevice(type, isvalid) {
   if (isvalid && !cEdit.isEdit) {
     return;
   }
-
   Status.CheckDeviceType = type;
   Status.ShowCheckDevice = true;
   selectedRowId.value = '';
-
   if (total.value === 0) {
     handleQuery();
   }
@@ -643,11 +578,8 @@ function ResetFormData() {
   cEdit.repairPart = ''; //维修部位
   cEdit.repairReason = ''; //维修原因
   cEdit.repairPerson = ''; //维修人员
-
   cEdit.imageIds = [];
-
   selectedRow.value = { deviceName: '', deviceId: '' };
-
   clearUploadFiles();
 }
 
@@ -749,7 +681,7 @@ function ExportRecord() {
   proxy?.download('/equipment/repairRecords/export', advanceSearch, `维修记录_${new Date().getTime()}.xlsx`, 'post').finally(hideloading);
 }
 
-function RowSelectionChange(row) {}
+function RowSelectionChange(row) { }
 //获取已选中的行
 var getSelectionRows = (gridInstance) => {
   if (gridInstance.value) {
@@ -950,8 +882,9 @@ const rules = reactive<FormRules<RuleForm>>({
 :deep .el-form--inline .el-form-item {
   margin-right: 15px !important;
 }
-:deep .el-dialog__body .form {
+
-}
+:deep .el-dialog__body .form {}
+
 :deep .el-dialog__body,
 .dialog__body {
   position: relative;
@@ -1064,6 +997,7 @@ input:focus {
   margin-right: 10px;
   cursor: pointer;
 }
+
 :deep .el-dialog__footer,
 .el-dialog__footer {
   padding-top: 0px !important;

src/views/fys-equipment/geoFence/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="content" v-loading="Status.fullLoading">
-    <div class="percent100">
+    <div class="percent100" v-show="!Status.showEdit && !Status.showDevice">
       <div class="topTool">
         <div class="button-row">
           <el-button type="primary" @click.stop="ShowEdit(null)"
@@ -16,8 +16,7 @@
         <div>
           <el-form :inline="true" :model="queryParams" class="demo-form-inline" @submit.native.prevent>
             <el-form-item label="" style="margin-right: 15px">
-              <el-input :suffix-icon="'Search'" v-model="queryParams.name" placeholder="名称" clearable
+              <el-input :suffix-icon="'Search'" v-model="queryParams.name" placeholder="名称" clearable @input="handleQuery" />
-                @input="handleQuery"/>
             </el-form-item>
 
             <el-form-item style="margin-right: 0px">
@@ -81,6 +80,7 @@
         <el-table-column label="操作" fixed="right" width="180" class-name="small-padding fixed-width">
           <template #default="scope">
             <el-button link type="primary" @click="ShowEdit(scope.row)">编辑</el-button>
+            <el-button link type="primary" @click="ShowDevice(scope.row)">终端管理</el-button>
             <el-button link type="danger" @click="DropFence(scope.row)">删除</el-button>
           </template>
         </el-table-column>
@@ -95,9 +95,17 @@
     </div>
 
     <!-- 围栏编辑弹出层 -->
-    <el-dialog width="calc(calc(100% - 250px) * 0.9)" v-model="Status.showEdit" :title="'编辑围栏'" :draggable="true">
+    <div class="editLayer percent100 popLayer" v-show="Status.showEdit" :title="'编辑围栏'">
+      <div class="abClose" @click="CloseEdit">
+        <el-icon><Close /></el-icon>
+      </div>
       <div>
         <el-form :inline="true" :model="cEdit" label-width="auto">
+          <el-form-item label="服务id">
+            <el-select v-model="cEdit.sid" placeholder="请选择" :disabled="cEdit.id !== null">
+              <el-option v-for="(item, index) in services" :key="item.sid" :label="item.sname" :value="item.sid" />
+            </el-select>
+          </el-form-item>
           <el-form-item label="围栏名称">
             <el-input v-model="cEdit.name" />
           </el-form-item>
@@ -126,25 +134,135 @@
       </div>
       <div>
         <el-button type="primary" @click.stop="AddPoint()"
-          ><el-icon><Plus /></el-icon>添加坐标</el-button
+          ><el-icon><Plus /></el-icon>添加点</el-button
         >
 
-        <el-button type="primary" @click.stop="ClearPoint()">
+        <el-button type="danger" @click.stop="ClearPoint()">
           <el-icon><Delete /></el-icon>清空</el-button
         >
       </div>
       <div class="map" id="map"></div>
       <div class="center footerBtn" style="margin-top: 20px">
         <el-button type="primary" @click="SaveFormData"> 确定 </el-button>
-        <el-button type="primary" plain @click="CloseEdit"> 取消 </el-button>
+        <el-button type="danger" plain @click="CloseEdit"> 关闭 </el-button>
       </div>
+    </div>
+
+    <!-- 终端维护的弹窗 -->
+    <div class="percent100 deviceLayer popLayer" v-show="Status.showDevice">
+      <div class="abClose" @click="CloseDevice">
+        <el-icon><Close /></el-icon>
+      </div>
+
+        
+
+      <div class="gridContent">
+        <div class="button-row">
+          <el-button type="primary" @click="showCheckDevice" class="fleft"
+            ><el-icon><Plus /></el-icon>添加</el-button
+          >
+          <el-button type="danger" @click="DropDevice(null)" class="fleft"
+            ><el-icon><Delete /></el-icon>删除</el-button
+          >
+          <div class="fright">
+          <el-form :inline="true">
+            <el-form-item label="" prop="checkedKey">
+              <el-input v-model="searchFilter.nocheckKey"  placeholder="imei查询" clearable @keyup.enter="SearchDevice" />
+            </el-form-item>
+            <!-- <el-form-item>
+              <el-button type="primary" icon="Search" @click="SearchDevice">搜索</el-button>
+            </el-form-item> -->
+          </el-form>
+        </div>
+        <div class="clear"></div>
+        </div>
+
+        <el-table ref="gridDevice" v-loading="Status.deviceLoading" border :data="DeviceList" @selection-change="ZDSelectionChange">
+          <el-table-column type="selection" width="55" align="center" />
+            <!-- <el-table-column label="deviceId" align="center" prop="deviceId" />
+            <el-table-column label="id" align="center" prop="id" /> -->
+            <el-table-column label="设备类型" align="center" prop="typeName" />
+            <el-table-column label="设备名称" align="center" prop="deviceName" />
+            <el-table-column label="IMEI" align="center" prop="deviceImei" />
+            <el-table-column label="Mac" align="center" prop="deviceMac" />
+            <el-table-column label="蓝牙名称" align="center" prop="bluetoothName" />
+            <!-- <el-table-column label="高德服务id" align="center" prop="sid" /> -->
+            <el-table-column label="高德终端id" align="center" prop="tid" />
+            <el-table-column label="高德轨迹id" align="center" prop="trid" />
+
+          <el-table-column label="操作" fixed="right" width="180" class-name="small-padding fixed-width">
+            <template #default="scope">
+              <el-icon color="#FF0000" @click="DropDevice(scope.row)"><Delete /></el-icon>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination
+          v-show="devicePage.total > 0"
+          v-model:page="devicePage.pageNum"
+          v-model:limit="devicePage.pageSize"
+          :total="devicePage.total"
+          @pagination="getList"
+        />
+      </div>
+      <div class="center footerBtn" style="margin-top: 20px">
+        <el-button type="danger" plain @click="CloseDevice"> 关闭 </el-button>
+      </div>
+    </div>
+
+    <el-dialog :title="'选择终端'" :draggable="true" footer-class="dilogFooter" v-model="Status.showCheckDevice" width="65%" append-to-body>
+      <div class="deviceContent">
+        <div class="filter">
+          <el-form :inline="true">
+            <el-form-item label="关键字" prop="checkedKey">
+              <el-input v-model="searchFilter.checkedKey" placeholder="imei查询" clearable @keyup.enter="searchZD" />
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" icon="Search" @click="searchZD">搜索</el-button>
+            </el-form-item>
+          </el-form>
+        </div>
+
+        <div class="checked">
+          <el-table
+            v-loading="Status.showCheckDeviceLoading"
+            border
+            :data="checkedDevices"
+            @selection-change="handleSelectionChange"
+            ref="multipleTableRef"
+            row-key="id"
+          >
+            <el-table-column type="selection" width="55" align="center" />
+            <!-- <el-table-column label="deviceId" align="center" prop="deviceId" />
+            <el-table-column label="id" align="center" prop="id" /> -->
+            <el-table-column label="设备类型" align="center" prop="typeName" />
+            <el-table-column label="设备名称" align="center" prop="deviceName" />
+            <el-table-column label="IMEI" align="center" prop="deviceImei" />
+            <el-table-column label="Mac" align="center" prop="deviceMac" />
+            <el-table-column label="蓝牙名称" align="center" prop="bluetoothName" />
+            <!-- <el-table-column label="高德服务id" align="center" prop="sid" /> -->
+            <el-table-column label="高德终端id" align="center" prop="tid" />
+            <el-table-column label="高德轨迹id" align="center" prop="trid" />
+          </el-table>
+
+          <pagination
+            :total="checkedPageParams.total"
+            v-model:page="checkedPageParams.pageNum"
+            v-model:limit="checkedPageParams.pageSize"
+            @pagination="searchZD"
+          />
+        </div>
+      </div>
+      <template #footer>
+        <div class="center footerBtn" style="margin-top: 20px">
+          <el-button type="primary" @click="SaveChecked"> 确定 </el-button>
+          <el-button type="danger" plain @click="CloseCheckDevice"> 关闭 </el-button>
+        </div>
+      </template>
     </el-dialog>
 
     <!-- 提示框 -->
     <el-dialog :width="300" :draggable="true" v-model="Status.confirm.Visible" :title="Status.confirm.title" center>
-      <span :class="Status.confirm.isWarn">
+      <span :class="Status.confirm.isWarn" v-html="Status.confirm.text"> </span>
-        {{ Status.confirm.text }}
-      </span>
       <template #footer>
         <div class="dialog-footer">
           <el-button type="primary" @click="Status.confirm.OkCallback"> 确定 </el-button>
@@ -159,9 +277,13 @@
 import api from '@/api/FenceManager/fence';
 import common from '@/utils/common';
 import map from '@/api/FenceManager/mapOpt';
-
+import { listService } from '@/api/system/service/api';
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 
+import { getDevice } from '@/api/system/service/api';
+
+const mapApiKey = import.meta.env.VITE_AMAP_KEY;
+
 var grid = ref(null);
 
 //全局状态控制
@@ -179,7 +301,12 @@ var Status = reactive({
     isWarn: false //是否警告色
   },
   showSearch: [], //是否显示高级查询
-  showEdit: false //是否显示编辑弹窗
+  showEdit: false, //是否显示编辑弹窗
+  showDevice: false, //是否显示终端维护
+  deviceLoading: false, //终端查询的loading
+
+  showCheckDevice: false, //是否显示选择终端
+  showCheckDeviceLoading: false
 });
 //查询的条件
 var queryParams = reactive({
@@ -197,17 +324,373 @@ var cEdit = reactive({
   areaType: null,
   coordinates: [],
   radius: undefined,
-  isActive: null
+  isActive: null,
+  sid: null,
+  gfid: null
+});
+var checkGf = reactive({
+  //当前正在操作的数据
+  sid: null,
+  gfid: null
 });
-
 //页码控件数据
 var pagin = reactive({
   total: 0
 });
+var devicePage = reactive({
+  total: 0,
+  pageNum: 1,
+  pageSize: 10
+});
+
+var checkedPageParams = reactive({
+  pageNum: 1,
+  pageSize: 20,
+  total: 0
+});
 
 //列表数据
 var List = ref<any[]>(null);
 
+var services = ref<any[]>(null);
+
+var DeviceList = ref<any[]>(null);
+
+const checkZd = ref<any>([]);
+
+var checkedDevices = ref([]);
+const searchFilter = ref({
+  nocheckKey: '',
+  checkedKey: ''
+});
+
+const ids = ref<any>([]);
+
+//显示终端
+function ShowDevice(item) {
+  Status.showDevice = true;
+  checkGf = item;
+  SearchDevice();
+}
+//选择终端
+
+function ZDSelectionChange(selection: any[]) {
+  checkZd.value = selection;
+}
+//查询已选择的终端
+function SearchDevice() {
+  Status.deviceLoading = true;
+
+  let searchMap = () => {
+    let json = {
+      key: mapApiKey,
+      sid: checkGf.sid,
+      gfid: checkGf.gfid
+    };
+    let formData = [];
+    if (json) {
+      let keys = Object.keys(json);
+      for (let index = 0; index < keys.length; index++) {
+        let key = keys[index];
+        let encodedKey = encodeURIComponent(key);
+        let encodedValue = encodeURIComponent(json[key]);
+        formData.push(`${encodedKey}=${encodedValue}`);
+      }
+    }
+
+    let queryString = formData.join('&'); // 拼接成 key1=value1&key2=value2
+
+    request({
+      url: 'https://tsapi.amap.com/v1/track/geofence/terminal/list?' + queryString,
+      method: 'GET',
+      data: ''
+    })
+      .then((res) => {
+        if (res && res.errcode === 10000) {
+          DeviceList.value = res.data.results;
+          devicePage.total = res.data.count;
+        }
+      })
+      .finally(() => {
+        Status.deviceLoading = false;
+      });
+  };
+
+  let searchSys = () => {
+    let json = {
+      fenceId: checkGf.gfid,
+      sid: checkGf.sid,
+      isTid: true,
+       pageNum: devicePage.pageNum,
+      pageSize: devicePage.pageSize,
+      deviceImei: searchFilter.value.nocheckKey
+    };
+    api
+      .pageTerminal(json)
+      .then((res) => {
+        if (res && res.code === 200) {
+          DeviceList.value = res.rows;
+          devicePage.total = res.total;
+          return;
+        }
+
+        DeviceList.value = [];
+        devicePage.total = 0;
+      })
+      .finally(() => {
+        Status.deviceLoading = false;
+      });
+  };
+
+  searchSys();
+}
+
+//关闭终端
+function CloseDevice() {
+  Status.showDevice = false;
+}
+//显示选择终端
+function showCheckDevice() {
+  Status.showCheckDevice = true;
+  searchZD();
+}
+
+//查询待选择的终端
+function searchZD() {
+  return new Promise((resolve, reject) => {
+    let json = {
+      fenceId: checkGf.gfid,
+      sid: checkGf.sid,
+      isTid: false,
+      pageNum: checkedPageParams.pageNum,
+      pageSize: checkedPageParams.pageSize,
+      deviceImei: searchFilter.value.checkedKey
+    };
+
+    api
+      .pageTerminal(json)
+      .then((res) => {
+        if (res.code === 200) {
+          checkedDevices.value = res.rows;
+          checkedPageParams.total = res.total;
+          resolve(res);
+          return;
+        }
+        resolve(null);
+      })
+      .catch((ex) => {
+        resolve(null);
+      })
+      .finally(() => {
+        Status.showCheckDeviceLoading = false;
+      });
+  });
+
+  // return new Promise((resolve, reject) => {
+  //   let para = {
+  //     deviceStatus: 1,
+  //     isTid: true,
+  //     sid: cEdit.sid,
+  //     pageNum: checkedPageParams.pageNum,
+  //     pageSize: checkedPageParams.pageSize,
+  //     deviceImei: searchFilter.value.checkedKey
+  //   };
+  //   checkedPageParams.total = 0;
+  //   Status.showCheckDeviceLoading = true;
+  //   getDevice(para)
+  //     .then((res) => {
+  //       console.log('查询已选择设备成功');
+  //       if (res.code === 200) {
+  //         checkedDevices.value = res.rows;
+  //         checkedPageParams.total = res.total;
+  //         resolve(res);
+  //         return;
+  //       }
+  //       resolve(null);
+  //     })
+  //     .catch((ex) => {
+  //       resolve(null);
+  //     })
+  //     .finally(() => {
+  //       Status.showCheckDeviceLoading = false;
+  //     });
+  // });
+}
+//关闭选择终端
+function CloseCheckDevice() {
+  Status.showCheckDevice = false;
+}
+//保存选择的终端
+function SaveChecked() {
+  if (ids.value.length === 0) {
+    alert('请选择终端');
+    return;
+  }
+  if (ids.value.length > 100) {
+    alert('最多只能选100条数据');
+    return;
+  }
+  let tids = ids.value
+    .map((v) => {
+      return v.tid;
+    })
+    .join(',');
+
+  let deviceIds = ids.value.map((v) => {
+    return v.deviceId;
+  });
+  let mapAdd = () => {
+    //先从高德添加数据，成功后再提交后台
+    return new Promise((resolve, reject) => {
+      let url = 'https://tsapi.amap.com/v1/track/geofence/terminal/bind';
+      let method = 'POST';
+      let data = {
+        key: mapApiKey,
+        sid: checkGf.sid,
+        gfid: checkGf.gfid,
+        tids: tids
+      };
+
+      request({ url: url, method: method, data: data })
+        .then((res) => {
+          if (res && res.errcode === 10000) {
+            resolve(res);
+            return;
+            // alert('操作成功');
+            //
+          } else {
+            alert(res.errmsg);
+            reject(res);
+          }
+        })
+        .catch((ex) => {
+          reject(ex);
+        });
+    });
+  };
+
+  mapAdd()
+    .then((res) => {
+      let json = {
+        sid: checkGf.sid,
+        fenceId: checkGf.gfid,
+        deviceIds: deviceIds
+      };
+      api
+        .addTerminal(json)
+        .then((result) => {
+          //高德添加成功了，提交到后台
+          if (result && result.code === 200) {
+            alert('操作成功');
+          } else {
+            alert('在高德保存成功，系统保存失败,失败数据:' + JSON.stringify(json));
+          }
+        })
+        .finally(() => {
+          SearchDevice();
+        });
+    })
+    .then((ex) => {});
+}
+
+//删除终端
+function DropDevice(row) {
+  let arr = [];
+  if (row) {
+    arr = [row];
+  } else {
+    arr = checkZd.value;
+  }
+  if (arr.length === 0) {
+    alert('请选择要删除的数据');
+    return;
+  }
+  if (arr.length > 100) {
+    alert('最多只能选择100条数据');
+    return;
+  }
+
+  let tids = arr
+    .map((v) => {
+      return v.tid;
+    })
+    .join(',');
+
+  let deviceIds = arr.map((v) => {
+    return v.deviceId;
+  });
+
+  let mapDrop = () => {
+    //从高德删除
+    return new Promise((resolve, reject) => {
+      let url = 'https://tsapi.amap.com/v1/track/geofence/terminal/unbind';
+
+      let data = {
+        key: mapApiKey,
+        sid: checkGf.sid,
+        gfid: checkGf.gfid,
+        tids: tids
+      };
+      request({
+        url: url,
+        method: 'POST',
+        data: data
+      })
+        .then((res) => {
+          if (res && res.errcode === 10000) {
+            resolve(res);
+            return;
+          } else {
+            alert(res.errmsg);
+            reject(res);
+          }
+        })
+        .catch((ex) => {
+          alert(JSON.stringify(ex));
+          reject(ex);
+        });
+    });
+  };
+  //先从高德删除，再从系统删除
+  let execDrop = () => {
+    mapDrop().then((res) => {
+      let json = {
+        sid: checkGf.sid,
+        fenceId: checkGf.gfid,
+        deviceIds: deviceIds
+      };
+      api
+        .delTerminal(json)
+        .then((result) => {
+          //从系统删除
+          if (result && result.code === 200) {
+            alert('操作成功');
+
+            return;
+          }
+          alert('<div class="red">从高德删除成功，但从系统删除失败了,失败数据:' + JSON.stringify(json) + '</div>');
+        })
+        .finally(() => {
+          SearchDevice();
+        });
+    });
+  };
+
+  confirm('<div class="red">删除后不可恢复，您确认删除所选数据吗？</div>', execDrop, null, '提示');
+}
+
+const handleSelectionChange = (selection: any[]) => {
+  ids.value = selection;
+};
+
+//查询所有服务
+function getServices() {
+  listService({ pageNum: 1, pageSize: 9999 }).then((res) => {
+    if (res.code === 200) {
+      services.value = res.rows;
+    }
+  });
+}
 //显示隐藏高级查询
 function showSearch() {
   if (Status.showSearch.length > 0) {
@@ -216,6 +699,7 @@ function showSearch() {
     Status.showSearch = ['1'];
   }
 }
+
 function ShowEdit(item) {
   Status.showEdit = true;
   if (item) {
@@ -236,7 +720,10 @@ function ShowEdit(item) {
     cEdit.coordinates = [];
     cEdit.radius = null;
     cEdit.isActive = null;
+    cEdit.sid = null;
+    cEdit.gfid = null;
   }
+  getServices();
   map.clearOverLays();
   setTimeout(() => {
     map
@@ -258,6 +745,7 @@ function ShowEdit(item) {
       });
   }, 500);
 }
+
 function CloseEdit() {
   Status.showEdit = false;
   let defCfg = {
@@ -267,7 +755,9 @@ function CloseEdit() {
     areaType: null,
     coordinates: [],
     radius: null,
-    isActive: null
+    isActive: null,
+    sid: null,
+    gfid: null
   };
   let keys = Object.keys(defCfg);
   keys.forEach((key) => {
@@ -378,29 +868,240 @@ function AddPoint(point, i) {
     refreshOverLayer();
   });
 }
+//调用高德的接口添加/修改围栏
+function updateGeoFence() {
+  const legalChars = cEdit.name.match(/[\u4e00-\u9fa5a-zA-Z0-9_\-]/g) || [];
+
+  let geoFenceName = legalChars.join('').slice(0, 128);
+
+  let json = {
+    key: mapApiKey,
+    sid: cEdit.sid,
+    name: geoFenceName,
+    desc: geoFenceName
+  };
+  if (cEdit.gfid && cEdit.id) {
+    //修改围栏
+    json.gfid = cEdit.gfid;
+  }
+  let url = '';
+  if (cEdit.areaType == 0) {
+    //多边形新增/修改
+
+    json.points = cEdit.coordinates
+      .map((v) => {
+        return v.lng + ',' + v.lat;
+      })
+      .join(';');
+    if (!cEdit.id) {
+      url = 'https://tsapi.amap.com/v1/track/geofence/add/polygon';
+    } else {
+      url = 'https://tsapi.amap.com/v1/track/geofence/update/polygon';
+    }
+  } else if (cEdit.areaType == 1) {
+    //圆形新增/修改
+    json.center = cEdit.coordinates[0].lng + ',' + cEdit.coordinates[0].lat;
+    json.radius = parseFloat(cEdit.radius);
+    if (!cEdit.id) {
+      url = 'https://tsapi.amap.com/v1/track/geofence/add/circle';
+    } else {
+      url = 'https://tsapi.amap.com/v1/track/geofence/update/circle';
+    }
+  }
+
+  return request({
+    url: url,
+    method: 'POST',
+    data: json
+  });
+}
+
+function dropGeoFence(arr) {
+  let ids = arr.filter((v) => {
+    return v.gfid;
+  });
+  let defaultSucc = Promise.resolve({ errcode: 10000, msg: '操作成功' });
+  if (ids.length === 0) {
+    return defaultSucc;
+  }
+
+  let sids = [];
+
+  arr.filter((v) => {
+    let f = sids.find((sid) => {
+      return sid === v.sid;
+    });
+    if (!f && v.sid) {
+      sids.push(v.sid);
+    }
+  });
+
+  let task = (sid, gfids) => {
+    if (!gfids || !sid) {
+      return defaultSucc;
+    }
+
+    let json = {
+      key: mapApiKey,
+      sid: sid,
+      gfids: gfids
+    };
+
+    const url = 'https://tsapi.amap.com/v1/track/geofence/delete';
+    return request({
+      url: url,
+      method: 'POST',
+      data: json
+    });
+  };
+
+  let promises = [];
+  for (let i = 0; i < sids.length; i++) {
+    const serviceId = sids[i];
+    const gfids = arr
+      .filter((v) => {
+        return v.sid === serviceId && v.gfid;
+      })
+      .map((v) => {
+        return v.gfid;
+      })
+      .join(',');
+
+    if (serviceId && gfids) {
+      promises.push(task(serviceId, gfids));
+    }
+  }
+
+  if (promises.length) {
+    return Promise.allSettled(promises)
+      .then((res) => {
+        let succIds = [];
+        for (let i = 0; i < promises.length; i++) {
+          if (res[i].status === 'fulfilled') {
+            let result = res[i].value;
+            if (result.errcode === 10000) {
+              succIds = succIds.concat(result.data.gfids);
+            }
+          }
+        }
+        if (succIds.length > 0) {
+          return Promise.resolve({ errcode: 10000, data: succIds });
+        } else {
+          return Promise.resolve({ errcode: 10000, errmsg: 'UNKNOWN_ERROR' });
+        }
+      })
+      .catch((ex) => {
+        console.log('出现异常', ex);
+      });
+  } else {
+    return defaultSucc;
+  }
+}
+
+function request(cfg) {
+  return new Promise((resolve, reject) => {
+    let json = cfg.data;
+    let url = cfg.url;
+    let method = cfg.method;
+
+    let formData = [];
+    if (json) {
+      let keys = Object.keys(json);
+      for (let index = 0; index < keys.length; index++) {
+        let key = keys[index];
+        let encodedKey = encodeURIComponent(key);
+        let encodedValue = encodeURIComponent(json[key]);
+        formData.push(`${encodedKey}=${encodedValue}`);
+      }
+    }
+
+    let queryString = formData.join('&'); // 拼接成 key1=value1&key2=value2
+    let xhr = new XMLHttpRequest();
+    xhr.open(method, url, true);
+    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;charset=UTF-8');
+    xhr.responseType = 'json';
+    xhr.onreadystatechange = function () {
+      // readyState=4 表示请求完成，status=200 表示响应成功
+      if (xhr.readyState === XMLHttpRequest.DONE) {
+        if (xhr.status >= 200 && xhr.status < 300) {
+          // 成功：返回响应数据
+          resolve(xhr.response);
+        } else {
+          // 失败：返回状态码和错误信息
+          reject(new Error(`请求失败：状态码 ${xhr.status}，信息：${xhr.statusText}`));
+        }
+      }
+    };
+
+    // 6. 监听网络错误（如断网、跨域、服务器不可达）
+    xhr.onerror = function () {
+      reject(new Error('网络错误：请求无法完成'));
+    };
+
+    // 7. 监听超时（可选，建议设置）
+    xhr.ontimeout = function () {
+      reject(new Error('请求超时：超过指定时间未响应'));
+    };
+
+    // 8. 设置超时时间（毫秒）
+    xhr.timeout = 20000; // 20秒超时
+
+    try {
+      // 9. 发送请求：将 JSON 对象转为字符串
+      xhr.send(queryString);
+    } catch (error) {
+      // 捕获数据序列化错误
+      reject(error);
+    }
+  });
+}
+
 //保存数据
 function SaveFormData() {
-  if (cEdit.areaType == 0 && cEdit.coordinates.length < 3) {
+  let err = [];
-    alert('多边形的围栏至少需要3个点');
+  if (!cEdit.sid) {
-    return;
+    err.push('请选择服务id');
+  }
+  if (!cEdit.name) {
+    err.push('请填写围栏名称');
+  }
+  if (cEdit.areaType === null) {
+    err.push('请选择围栏类型');
+  } else {
+    if (cEdit.areaType == 0 && cEdit.coordinates.length < 3) {
+      err.push('多边形的围栏至少需要3个点');
+    }
+    if (cEdit.areaType == 1 && cEdit.coordinates.length == 0) {
+      err.push('圆形的围栏至少需要1个点');
+    }
   }
 
-  if (cEdit.areaType == 1 && cEdit.coordinates.length == 0) {
+  if (err.length) {
-    alert('圆形的围栏至少需要1个点');
+    alert(err.join('<br/>'));
     return;
   }
-
   let promise = Promise.resolve({ code: 200, msg: '操作成功' });
   Status.fullLoading = true;
   let json = Object.assign({}, cEdit);
   json.coordinates = JSON.stringify(json.coordinates);
-  if (cEdit.id !== null) {
+
-    //编辑
+  promise = updateGeoFence()
-    promise = api.updateFence(json);
+    .then((res) => {
-  } else {
+      if (res.errcode === 10000) {
-    //新增
+        if (cEdit.id !== null) {
-    promise = api.AddFence(json);
+          //编辑
-  }
+          return api.updateFence(json);
+        } else {
+          //新增
+          json.gfid = res.data.gfid;
+          return api.AddFence(json);
+        }
+      }
+      return Promise.resolve({ code: 500, msg: res.errmsg });
+    })
+    .catch((ex) => {
+      return { code: ex.code, msg: ex.message };
+    });
 
   promise
     .then((res) => {
@@ -427,28 +1128,53 @@ function DropFence(item) {
     return;
   }
 
-  let execDelete=()=>{
+  let execDelete = () => {
+    //先从高德删除围栏，再从后台删除
+    dropGeoFence(arr).then((res) => {
+      if (res.errcode === 10000) {
+        let dropIds = res.data;
+        if (!dropIds) {
+          alert('从高德地图删除围栏失败');
+          return;
+        }
+        let ids = [];
 
-    arr = arr
+        arr.filter((v) => {
-      .map((v) => {
+          if (!v.gfid || !v.sid) {
-        return v.id;
+            ids.push(v.id);
-      })
+            return true;
-      .join(',');
+          }
-    api.DelFence(arr).then((res) => {
+          if (dropIds) {
-      if (res.code == 200) {
+            let f = dropIds.find((gfid) => {
-        handleQuery();
+              return gfid === v.gfid;
+            });
+            if (f) {
+              ids.push(v.id);
+            }
+          } else {
+            ids.push(v.id);
+          }
+
+          return true;
+        });
+        if (!ids.length) {
+          alert('操作没有成功');
+          return;
+        }
+        ids = ids.join(',');
+        api.DelFence(ids).then((res) => {
+          if (res.code == 200) {
+            handleQuery();
+          }
+          alert(res.msg);
+        });
+      } else {
+        alert(res.errmsg);
       }
-      alert(res.msg);
     });
-  }
+  };
-
-   confirm(
-    '删除后不可恢复,您确认?',
-    execDelete,
-    null,
-    '提示'
-  );
 
+  confirm('删除后不可恢复,您确认?', execDelete, null, '提示');
 }
 
 function getList() {
@@ -609,9 +1335,9 @@ onMounted(() => {
 
 .map {
   width: 100%;
-  height: calc(58vh - 50px);
+  height: calc(100% - 200px);
   box-sizing: border-box;
-  border: 1px solid #7371719e;
+  border: 1px solid #ccc;
   border-radius: 8px;
   margin-top: 10px;
 }
@@ -651,4 +1377,32 @@ onMounted(() => {
   //  width: 100%;
   //  left: 0px;
 }
+
+.deviceLayer .gridContent {
+  width: 100%;
+  height: calc(100% - 50px);
+}
+.button-row {
+  margin-top: 10px;
+  width:auto;
+  height: 36px;
+  box-sizing: border-box;
+}
+
+.popLayer {
+  position: relative;
+}
+
+.popLayer .abClose {
+  position: absolute;
+  top: 15px;
+  right: 15px;
+  z-index: 9;
+  cursor: pointer;
+}
+
+.red,
+:deep .red {
+  color: #ff0000;
+}
 </style>

src/views/fys-equipment/group/index.vue

@@ -10,7 +10,8 @@
       </div>
 
       <div class="treeContent">
-        <el-tree :data="treeData" :props="defaultProps" accordion @node-click="handleNodeClick" :highlight-current="true">
+        <el-tree :default-expand-all="true" :data="treeData" :props="defaultProps" accordion
+          @node-click="handleNodeClick" :highlight-current="true">
           <template #default="{ node, data }">
             <div class="custom-tree-node">
               <span :class="data.parentId != null ? '' : 'treeBold'">{{ node.label }}</span>
@@ -60,7 +61,7 @@
               </el-select>
             </el-form-item>
             <el-form-item>
-              <div class="btnSearch" @click="getDeviceList()">查询</div>
+              <div class="btnSearch" @click="getDeviceList">查询</div>
               <div class="btnReset" @click="ResetQuery()">重置</div>
             </el-form-item>
           </el-form>
@@ -76,14 +77,8 @@
               <el-button type="danger" plain @click="groupDelDevice()">删除</el-button>
             </div>
           </div>
-          <el-table
+          <el-table ref="grid" height="calc(100vh - 320px)" v-loading="Status.loading" border :data="deviceList"
-            ref="grid"
+            @selection-change="RowSelectionChange">
-            height="calc(100vh - 320px)"
-            v-loading="Status.loading"
-            border
-            :data="deviceList"
-            @selection-change="RowSelectionChange"
-          >
             <el-table-column type="selection" width="50" align="center" />
             <el-table-column label="设备名称" align="center" prop="deviceName" />
 
@@ -91,11 +86,9 @@
               <template #default="scope">
                 <el-popover placement="right" trigger="click">
                   <template #reference>
-                    <img
+                    <img :src="scope.row.devicePic"
-                      :src="scope.row.devicePic"
                       style="width: 40px; height: 40px; cursor: pointer; object-fit: contain"
-                      class="hover:opacity-80 transition-opacity"
+                      class="hover:opacity-80 transition-opacity" />
-                    />
                   </template>
                   <img :src="scope.row.devicePic" style="max-width: 600px; max-height: 600px; object-fit: contain" />
                 </el-popover>
@@ -120,13 +113,8 @@
               </template>
             </el-table-column>
           </el-table>
-          <pagination
+          <pagination v-show="pagin.total > 0" v-model:page="GjSearchForm.pageNum" v-model:limit="GjSearchForm.pageSize"
-            v-show="pagin.total > 0"
+            :total="pagin.total" @pagination="getDeviceList" />
-            v-model:page="GjSearchForm.pageNum"
-            v-model:limit="GjSearchForm.pageSize"
-            :total="pagin.total"
-            @pagination="getDeviceList"
-          />
         </el-card>
       </div>
     </div>
@@ -134,7 +122,8 @@
     <div class="clear"></div>
 
     <!-- 提示框 -->
-    <el-dialog :width="300" :draggable="true" v-model="Status.confirm.Visible" :title="Status.confirm.title" width="500" center>
+    <el-dialog :width="300" :draggable="true" v-model="Status.confirm.Visible" :title="Status.confirm.title" width="500"
+      center>
       <span>
         {{ Status.confirm.text }}
       </span>
@@ -148,7 +137,7 @@
 
     <!-- 选择分组的弹窗 -->
     <el-dialog v-model="Status.dialogGroupVisible" title="选择分组" width="500" :draggable="true">
-      <el-tree :data="treeData" :props="defaultProps" accordion>
+      <el-tree :data="treeData" :props="defaultProps" accordion default-expand-all>
         <template #default="{ node, data }">
           <div class="custom-tree-node" @click.stop="CheckGroup(data)">
             <span :class="data.parentId != null ? '' : 'treeBold'">{{ node.label }}</span>
@@ -156,12 +145,16 @@
           </div>
         </template>
       </el-tree>
-      <el-button type="primary" @click="OkCheckGroup()"> 确定 </el-button>
+      <div style="text-align: right;">
-      <el-button type="primary" @click="CancelCheckGroup()"> 取消 </el-button>
+        
+        <el-button  @click="CancelCheckGroup()"> 取消 </el-button>
+        <el-button type="primary" @click="OkCheckGroup()"> 确定 </el-button>
+      </div>
+
     </el-dialog>
 
     <!-- 选择设备的穿梭框 -->
-    <el-dialog v-model="Status.dialogDeviceVisible" title="选择设备" width="800" :draggable="true">
+    <el-dialog v-model="Status.dialogDeviceVisible" title="选择设备" width="630" :draggable="true">
       <el-transfer :titles="['所有设备', '已选择设备']" v-model="transfer.value" :data="transfer.data" :filterable="true" />
 
       <div class="center" style="margin-top: 10px">
@@ -171,13 +164,13 @@
     </el-dialog>
 
     <!-- 添加节点的弹出框 -->
-    <el-dialog :width="350" :draggable="true" v-model="Status.dialogEditNode" :title="cEdit.id ? '修改分组' :(cEdit.pNode?'新增子节点': '新增根节点')" center>
+    <el-dialog :width="350" :draggable="true" v-model="Status.dialogEditNode"
+      :title="cEdit.id ? '修改分组' : cEdit.pNode ? '新增子节点' : '新增根节点'" center>
       <div>
         <el-form class="demo-form-inline" :inline="true" :model="cEdit" label-width="auto" style="width: 100%">
-          <el-form-item label="分组名称"> <el-input v-model="cEdit.groupName" placeholder="请输入" /> </el-form-item
+          <el-form-item label="分组名称"> <el-input v-model="cEdit.groupName" placeholder="请输入" /> </el-form-item>
-        >
+          <div style="text-indent: 68px; color: #f56c6c; margin-top: -15px">{{ cEdit.groupName ? '' : '请输入分组名称' }}</div>
-        <div style="text-indent: 68px;color: #f56c6c;margin-top: -15px;">{{ cEdit.groupName?'':'请输入分组名称' }}</div>
+        </el-form>
-      </el-form>
       </div>
       <template #footer>
         <div class="dialog-footer">
@@ -319,36 +312,41 @@ var hideloading = closeLoading;
 function ResetQuery() {
   GjSearchForm.deviceType = '';
   GjSearchForm.netMode = '';
+  getDeviceList()
+
 }
 //查询某个节点的设备
-var getDeviceList = () => {
+const getDeviceList = () => {
-  if (!checkNode.val) {
+  // 无论是否有 checkNode.val，都返回 Promise
-    pagin.total = 0;
+  return new Promise((resolve, reject) => {
-    deviceList.value = [];
+    if (!checkNode.val && checkNode.val !== '') { // 排除全部设备的空字符串
-    return;
+      pagin.total = 0;
-  }
+      deviceList.value = [];
-
+      hideloading(); // 确保 loading 关闭
-  let para = {
+      resolve();
-    nodeCode: checkNode.val,
+      return;
-    pageIndex: GjSearchForm.pageNum,
+    }
-    pageSize: GjSearchForm.pageSize,
+    showloading();
-    communicationMode: GjSearchForm.netMode,
+    let para = {
-    deviceType: GjSearchForm.deviceType,
+      nodeCode: checkNode.val || '', // 空ID对应全部设备
-    deviceName: GjSearchForm.deviceName
+      pageIndex: GjSearchForm.pageNum,
-  };
+      pageSize: GjSearchForm.pageSize,
-  showloading();
+      communicationMode: GjSearchForm.netMode,
-  api
+      deviceType: GjSearchForm.deviceType,
-    .getNodeDevice(para)
+      deviceName: GjSearchForm.deviceName
-    .then((res) => {
+    };
+    api.getNodeDevice(para).then((res: any) => {
+      console.log(res, 'ressss');
       deviceList.value = res.rows;
       pagin.total = res.total;
-    })
+      resolve();
-    .catch((ex) => {
+    }).catch((ex) => {
       console.log('出现了异常', ex);
-    })
+      reject(ex); // 抛出错误
-    .finally(() => {
+    }).finally(() => {
       hideloading();
     });
+  });
 };
 //树控件节点点击事件
 var handleNodeClick = (node) => {
@@ -360,10 +358,26 @@ var handleNodeClick = (node) => {
   getDeviceList();
 };
 
+const ALL_DEVICE_NODE = {
+  id: '',
+  groupName: '全部设备',
+  parentId: null,
+  children: [],
+  isAll: true
+};
 //树控件筛选后显示的数据源
 var treeData = computed(() => {
   let arr = api.treeNodeSearch(treeDataOrin.value, searchTxt.value, 'groupName', 'children');
-  return arr;
+  let newArr = [JSON.parse(JSON.stringify(ALL_DEVICE_NODE))];
+  if (arr.length) {
+    newArr = newArr.concat(arr);
+  }
+  if (newArr.length && !checkNode.val) {
+    checkNode.val = newArr[0].id; // 空ID
+    Promise.resolve(getDeviceList()).finally(() => {
+    });
+  }
+  return newArr;
 });
 
 //显示/隐藏高级筛选
@@ -379,7 +393,7 @@ var editNode = (node) => {
   Status.isEditTreeNode = true;
   cEdit.value.editNode = node;
   cEdit.value.pNode = null;
-  Status.dialogEditNode=true;
+  Status.dialogEditNode = true;
   //
 };
 
@@ -413,7 +427,7 @@ var completeEdit = (node) => {
       if (res.code == 200) {
         alert('操作成功');
         RefreshTree();
-        Status.dialogEditNode=false;
+        Status.dialogEditNode = false;
       } else {
         alert(res.msg);
       }
@@ -477,7 +491,7 @@ var addNode = (node) => {
 };
 
 var saveNode = () => {
-  if(!cEdit.value.groupName){
+  if (!cEdit.value.groupName) {
     return;
   }
   let val = new Date().getTime();
@@ -551,6 +565,7 @@ var getSelectionRows = () => {
 
 var RefreshTree = function () {
   api.getTreeData(searchTxt.value).then((res) => {
+    console.log(res, 'reddddd');
     treeDataOrin.value = res;
   });
 };
@@ -622,9 +637,8 @@ var showDevice = () => {
         let arr = res1.rows.map((item) => ({
           key: item.deviceId,
           label: item.deviceName //,
-          // disabled: item.groupId && item.groupId == checkNode.val ? false : item.groupId ? true : false
         }));
-
+        ;
         transfer.data = arr;
       }
     }
@@ -917,8 +931,8 @@ onMounted(() => {
 }
 
 .custom-tree-node .iconContent .icon {
-  width: 18px;
+  width: 15px;
-  height: 18px;
+  height: 15px;
   visibility: hidden;
 }
 

src/views/fys-equipment/trackService/index.vue

@@ -0,0 +1,687 @@
+<template>
+  <div class="p-2">
+    <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
+      <div v-show="showSearch" class="mb-[10px]">
+        <el-card shadow="hover">
+          <el-form ref="queryFormRef" :model="queryParams" :inline="true">
+            <!-- <el-form-item label="猎鹰服务ID" prop="sid">
+              <el-input v-model="queryParams.sid" placeholder="请输入猎鹰服务ID" clearable @keyup.enter="handleQuery" />
+            </el-form-item> -->
+            <el-form-item label="服务名称" prop="sname">
+              <el-input v-model="queryParams.sname" placeholder="请输入服务名称" clearable @keyup.enter="handleQuery" />
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+              <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+            </el-form-item>
+          </el-form>
+        </el-card>
+      </div>
+    </transition>
+
+    <el-card shadow="never">
+      <template #header>
+        <el-row :gutter="10" class="mb8">
+          <el-col :span="1.5">
+            <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:service:add']">新增</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['system:service:edit']"
+              >修改</el-button
+            >
+          </el-col>
+
+          <!-- <el-col :span="1.5">
+            <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['system:service:export']">导出</el-button>
+          </el-col> -->
+          <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+        </el-row>
+      </template>
+
+      <el-table v-loading="loading" border :data="serviceList" @selection-change="handleSelectionChange">
+        <el-table-column label="猎鹰服务ID" align="center" prop="sid" />
+        <el-table-column label="服务名称" align="center" prop="sname" />
+        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+          <template #default="scope">
+            <el-tooltip content="关联设备" placement="top">
+              <el-button link type="primary" icon="Connection" @click="ShowCheckDevice(scope.row)" v-hasPermi="['system:service:edit']"></el-button>
+            </el-tooltip>
+            <el-tooltip content="修改" placement="top">
+              <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:service:edit']"></el-button>
+            </el-tooltip>
+            <el-tooltip content="终端" placement="top">
+              <el-button link type="primary" icon="View" @click="ShowMapDevice(scope.row)"></el-button>
+            </el-tooltip>
+            <!-- <el-tooltip content="删除" placement="top">
+              <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:service:remove']"></el-button>
+            </el-tooltip> -->
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
+    </el-card>
+    <!-- 添加或修改轨迹服务对话框 -->
+    <el-dialog :title="dialog.title" :draggable="true" v-model="dialog.visible" width="500px" append-to-body>
+      <el-form ref="serviceFormRef" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="服务名称" prop="sname">
+          <el-input v-model="form.sname" placeholder="请输入服务名称" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <!-- 关联设备维护 -->
+    <el-dialog :title="dialog.connectTitle" :draggable="true" footer-class="dilogFooter" v-model="dialog.connectVisible" width="80%" append-to-body>
+      <div class="deviceContent" v-loading="dialog.connctLoading">
+        <div class="filter">
+          <el-form :inline="true">
+            <el-form-item label="关键字" prop="checkedKey">
+              <el-input v-model="searchFilter.checkedKey" placeholder="imei查询" clearable @keyup.enter="handleTerminalQuery" />
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" icon="Search" @click="searchCheckedDevice">搜索</el-button>
+              <el-button icon="Refresh" @click="searchFilter.checkedKey='';searchCheckedDevice()">重置</el-button>
+            </el-form-item>
+          </el-form>
+        </div>
+        <div>
+          <el-row :gutter="10" class="mb8">
+            <el-col :span="1.5">
+              <el-button type="primary" plain icon="Plus" @click="ShowAllDevice" v-hasPermi="['system:service:add']">新增</el-button>
+            </el-col>
+
+            <el-col :span="1.5">
+              <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="DelChecked()" v-hasPermi="['system:service:remove']"
+                >删除</el-button
+              >
+            </el-col>
+          </el-row>
+        </div>
+        <div class="checked">
+          <el-table
+            v-loading="loading"
+            border
+            :data="checkedDevices"
+            @selection-change="handleSelectionChange"
+            reserve-selection="true"
+            ref="multipleTableRef"
+            row-key="id"
+          >
+            <el-table-column type="selection" width="55" align="center" reserve-selection="true" />
+            <!-- <el-table-column label="deviceId" align="center" prop="deviceId" />
+            <el-table-column label="id" align="center" prop="id" /> -->
+            <el-table-column label="设备类型" align="center" prop="typeName" />
+            <el-table-column label="设备名称" align="center" prop="deviceName" />
+            <el-table-column label="IMEI" align="center" prop="deviceImei" />
+            <el-table-column label="Mac" align="center" prop="deviceMac" />
+            <el-table-column label="蓝牙名称" align="center" prop="bluetoothName" />
+            <!-- <el-table-column label="高德服务id" align="center" prop="sid" /> -->
+            <el-table-column label="高德终端id" align="center" prop="tid" />
+            <el-table-column label="高德轨迹id" align="center" prop="trid" />
+          </el-table>
+
+          <pagination
+            :total="checkedPageParams.total"
+            v-model:page="checkedPageParams.pageNum"
+            v-model:limit="checkedPageParams.pageSize"
+            @pagination="searchCheckedDevice"
+          />
+        </div>
+      </div>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="cancelConn">关闭</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <el-dialog title="选择设备" :draggable="true" footer-class="dilogFooter" v-model="dialog.checkVisible" width="65%" append-to-body>
+      <div class="checkdeviceContent" v-loading="dialog.checkLoading">
+             <div class="filter">
+          <el-form :inline="true">
+            <el-form-item label="关键字" prop="nocheckKey">
+              <el-input v-model="searchFilter.nocheckKey" placeholder="imei查询" clearable @keyup.enter="handleTerminalQuery" />
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" icon="Search" @click="searchNoCheckDevice">搜索</el-button>
+              <el-button icon="Refresh" @click="searchFilter.nocheckKey='';searchNoCheckDevice()">重置</el-button>
+            </el-form-item>
+          </el-form>
+        </div>
+        <div class="noCheck">
+          <el-table v-loading="loading" border :data="noCheckDevices" @selection-change="checkNocheckChange" row-key="id">
+            <el-table-column type="selection" width="55" align="center" :selectable="selectable" />
+            <!-- <el-table-column label="deviceId" align="center" prop="deviceId" />
+            <el-table-column label="id" align="center" prop="id" /> -->
+            <el-table-column label="设备类型" align="center" prop="typeName" />
+            <el-table-column label="设备名称" align="center" prop="deviceName" />
+            <el-table-column label="IMEI" align="center" prop="deviceImei" />
+            <el-table-column label="Mac" align="center" prop="deviceMac" />
+            <el-table-column label="蓝牙名称" align="center" prop="bluetoothName" />
+            <el-table-column label="高德服务id" align="center" prop="sid" />
+            <el-table-column label="高德终端id" align="center" prop="tid" />
+            <el-table-column label="高德轨迹id" align="center" prop="trid" />
+          </el-table>
+
+          <pagination
+            :total="noCheckPageParams.total"
+            v-model:page="noCheckPageParams.pageNum"
+            v-model:limit="noCheckPageParams.pageSize"
+            @pagination="searchNoCheckDevice"
+          />
+        </div>
+      </div>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button :loading="buttonLoading" type="primary" :disabled="checkNoFlag" @click="checkedOK">保 存</el-button>
+          <el-button @click="cancelCheck">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <el-dialog title="查看终端" :draggable="true" footer-class="dilogFooter" v-model="dialog.showMap" width="70%" append-to-body>
+      <div class="checkdeviceContent" v-loading="dialog.viewLoading">
+        <div class="filter">
+          <el-form :inline="true">
+            <el-form-item label="关键字" prop="keywork">
+              <el-input v-model="TerminalQuery.keywork" placeholder="终端名称/描述/自定义内容" clearable @keyup.enter="handleQuery" />
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" icon="Search" @click="handleTerminalQuery">搜索</el-button>
+              <el-button icon="Refresh" @click="resetTterminalQuery">重置</el-button>
+            </el-form-item>
+          </el-form>
+        </div>
+
+        <div class="noCheck">
+          <el-table v-loading="loading" border :data="mapDevices" reserve-selection="true" row-key="tid">
+            <el-table-column label="终端设备id" align="center" prop="tid" />
+            <el-table-column label="终端名称" align="center" prop="name" />
+            <el-table-column label="创建时间" align="center" prop="createtime" />
+            <el-table-column label="最后定位时间" align="center" prop="locatetime" />
+            <el-table-column label="终端描述" align="center" prop="desc" />
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+              <template #default="scope">
+                <el-tooltip content="删除" placement="top">
+                  <el-button link type="primary" icon="Delete" @click="deleteDevice(scope.row)" v-hasPermi="['system:service:remove']"></el-button>
+                </el-tooltip>
+              </template>
+            </el-table-column>
+          </el-table>
+
+          <pagination
+            :total="viewDevicePageParams.total"
+            v-model:page="viewDevicePageParams.pageNum"
+            v-model:limit="viewDevicePageParams.pageSize"
+            @pagination="ShowMapDevice"
+          />
+        </div>
+      </div>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button :loading="buttonLoading" type="primary" :disabled="checkNoFlag" @click="checkedOK">保 存</el-button>
+          <el-button @click="HideMapDevice">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="Service" lang="ts">
+import {
+  listService,
+  getService,
+  delService,
+  addService,
+  updateService,
+  getDevice,
+  terminalDevice,
+  delTerminalDevice,
+  getMapDevice,
+  getMapDeviceByFilter,
+  getDeviceList
+} from '@/api/system/service/api';
+import { ServiceVO, ServiceQuery, ServiceForm } from '@/api/system/service/types';
+import type { TableInstance } from 'element-plus';
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+
+const serviceList = ref<ServiceVO[]>([]);
+const buttonLoading = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref<any>([]);
+const checkNoDevices = ref<any>([]);
+const single = ref(true);
+const multiple = ref(true);
+const checkNoFlag = ref(true);
+const total = ref(0);
+const multipleTableRef = ref<TableInstance>();
+const queryFormRef = ref<ElFormInstance>();
+const serviceFormRef = ref<ElFormInstance>();
+
+const dialog = reactive({
+  visible: false,
+  title: '',
+  connectVisible: false,
+  connectTitle: '编辑关联设备',
+  connctLoading: false,
+  checkVisible: false,
+  checkLoading: false,
+  showMap: false,
+  viewLoading: false
+});
+
+
+const searchFilter=ref({
+  nocheckKey:'',
+  checkedKey:''
+});
+const initFormData: ServiceForm = {
+  id: undefined,
+  sid: undefined,
+  sname: undefined
+};
+const data = reactive<PageData<ServiceForm, ServiceQuery>>({
+  form: { ...initFormData },
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    sid: undefined,
+    sname: undefined,
+    params: {}
+  },
+  rules: {
+    id: [{ required: true, message: '不能为空', trigger: 'blur' }]
+  }
+});
+
+var cEdit = reactive<ServiceVO>({
+  id: null,
+  sid: null,
+  sname: null
+});
+
+var noCheckPageParams = reactive({
+  pageNum: 1,
+  pageSize: 20,
+  total: 0
+});
+var checkedPageParams = reactive({
+  pageNum: 1,
+  pageSize: 20,
+  total: 0
+});
+
+var viewDevicePageParams = reactive({
+  pageNum: 1,
+  pageSize: 50,
+  total: 0
+});
+
+var noCheckDevices = ref([]);
+var checkedDevices = ref([]);
+var mapDevices = ref([]);
+const { queryParams, form, rules } = toRefs(data);
+/** 重置按钮操作 */
+const resetTterminalQuery = () => {
+  TerminalQuery.value.keywork = '';
+  ShowMapDevice(cEdit);
+};
+
+/** 搜索按钮操作 */
+const handleTerminalQuery = () => {
+  viewDevicePageParams.pageNum = 1;
+  ShowMapDevice(cEdit);
+};
+
+//查看终端
+function ShowMapDevice(row) {
+  debugger;
+  dialog.showMap = true;
+  if(row && row.sid){
+ cEdit = row;
+  }
+ 
+
+  let para2 = { sid: cEdit.sid, 
+    filter: TerminalQuery.value.keywork, 
+    page: viewDevicePageParams.pageNum, 
+    pagesize: viewDevicePageParams.pageSize 
+  };
+
+  dialog.viewLoading = true;
+
+  let p2 = getMapDeviceByFilter(para2);
+
+  p2.then((res) => {
+    if (res.code === 200) {
+      mapDevices.value = res.rows;
+      viewDevicePageParams.total = res.total;
+    } else {
+      mapDevices.value = [];
+      viewDevicePageParams.total = 0;
+    }
+  }).finally(() => {
+    dialog.viewLoading = false;
+  });
+}
+
+function HideMapDevice() {
+  dialog.showMap = false;
+  cEdit = null;
+}
+
+/** 查询轨迹服务列表 */
+const getList = async () => {
+  loading.value = true;
+  const res = await listService(queryParams.value);
+  serviceList.value = res.rows;
+  total.value = res.total;
+  loading.value = false;
+};
+
+/** 取消按钮 */
+const cancel = () => {
+  reset();
+  dialog.visible = false;
+};
+
+function selectable(row, index) {
+  if (row.sid) {
+    return false;
+  }
+  return true;
+}
+
+//查询未选择的设备
+const searchNoCheckDevice = () => {
+  return new Promise((resolve, reject) => {
+    let para = {
+      deviceStatus: 1,
+      // isTid: false,
+      // sid: cEdit.sid,
+      pageNum: noCheckPageParams.pageNum,
+      pageSize: noCheckPageParams.pageSize,
+      deviceImei:searchFilter.value.nocheckKey
+    };
+    dialog.checkLoading = true;
+    getDeviceList(para)
+      .then((res) => {
+        debugger;
+        if (res.code === 200) {
+          noCheckDevices.value = res.rows;
+          noCheckPageParams.total = res.total;
+          resolve(res);
+
+          return;
+        }
+        resolve(null);
+      })
+      .catch((ex) => {
+        resolve(null);
+      })
+      .finally(() => {
+        dialog.checkLoading = false;
+      });
+  });
+};
+//查询已选择的设备
+const searchCheckedDevice = () => {
+  return new Promise((resolve, reject) => {
+    let para = {
+      deviceStatus: 1,
+      isTid: true,
+      sid: cEdit.sid,
+      pageNum: checkedPageParams.pageNum,
+      pageSize: checkedPageParams.pageSize,
+      deviceImei:searchFilter.value.checkedKey
+    };
+    checkedPageParams.total = 0;
+    dialog.connctLoading = true;
+    getDevice(para)
+      .then((res) => {
+        console.log('查询已选择设备成功');
+        if (res.code === 200) {
+          debugger;
+          checkedDevices.value = res.rows;
+          checkedPageParams.total = res.total;
+          resolve(res);
+          return;
+        }
+        resolve(null);
+      })
+      .catch((ex) => {
+        resolve(null);
+      })
+      .finally(() => {
+        dialog.connctLoading = false;
+      });
+  });
+};
+
+/** 关闭关联设备的弹窗 */
+const cancelConn = () => {
+  dialog.connectVisible = false;
+};
+const cancelCheck = () => {
+  dialog.checkVisible = false;
+};
+//弹出选择框
+const ShowCheckDevice = (row) => {
+  cEdit = row;
+  dialog.connectVisible = true;
+  searchCheckedDevice();
+};
+const ShowAllDevice = () => {
+  dialog.checkVisible = true;
+
+  searchNoCheckDevice();
+};
+//删除某一个
+const deleteDevice = (row) => {
+  proxy?.$modal.confirm('删除后不可恢复,是否确认选中的的数据项？').then((res) => {
+    // delTerminalDevice(row.tid).then((res) => {
+    //   if (res.code === 200) {
+    //     proxy?.$modal.msgSuccess(res.msg);
+    //     searchCheckedDevice();
+    //   } else {
+    //     proxy?.$modal.alertError('操作失败');
+    //   }
+    // });
+  });
+};
+//删除所选
+const DelChecked = () => {
+  if (!ids.value.length) {
+    proxy?.$modal.msgError('请选择要删除的数据');
+
+    return;
+  }
+
+  let id = ids.value
+    .map((v) => {
+      return v.deviceId;
+    })
+    .join(',');
+
+  proxy?.$modal.confirm('删除后不可恢复,是否确认选中的的数据项？').then((res) => {
+    delTerminalDevice(id).then((res) => {
+      if (res.code === 200) {
+        proxy?.$modal.msgSuccess(res.msg);
+        searchCheckedDevice();
+      } else {
+        proxy?.$modal.alertError('操作失败');
+      }
+    });
+  });
+};
+//选中某一些设备
+const checkedOK = () => {
+  if (!checkNoFlag.value) {
+    if (checkNoDevices.value.length > 0) {
+      let arr = checkNoDevices.value.map((v) => {
+        return { deviceImei: v.deviceImei, typeName: v.typeName, id: v.id };
+      });
+      let data = { sid: cEdit.sid, deviceList: arr };
+      terminalDevice(data).then((res) => {
+        if (res.code === 200) {
+          proxy?.$modal.msgSuccess('操作成功');
+          searchNoCheckDevice();
+          searchCheckedDevice();
+        } else {
+          proxy?.$modal.msgError('操作失败');
+        }
+      });
+    }
+  }
+};
+
+/** 表单重置 */
+const reset = () => {
+  form.value = { ...initFormData };
+  serviceFormRef.value?.resetFields();
+};
+
+const TerminalQuery = ref({
+  keywork: ''
+});
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.value.pageNum = 1;
+  getList();
+};
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value?.resetFields();
+  handleQuery();
+};
+/** 多选框选中数据 */
+const handleSelectionChange = (selection: ServiceVO[]) => {
+  ids.value = selection;
+  if (selection.length) {
+    multiple.value = false;
+  } else {
+    multiple.value = true;
+  }
+};
+
+const checkNocheckChange = (selection: ServiceVO[]) => {
+  checkNoDevices.value = selection;
+  if (selection.length) {
+    checkNoFlag.value = false;
+  } else {
+    checkNoFlag.value = true;
+  }
+};
+
+/** 新增按钮操作 */
+const handleAdd = () => {
+  reset();
+  dialog.visible = true;
+  dialog.title = '添加轨迹服务';
+};
+
+/** 修改按钮操作 */
+const handleUpdate = async (row?: ServiceVO) => {
+  reset();
+  const _id = row?.id || ids.value[0];
+  const res = await getService(_id);
+  Object.assign(form.value, res.data);
+  dialog.visible = true;
+  dialog.title = '修改轨迹服务';
+};
+
+/** 提交按钮 */
+const submitForm = () => {
+  serviceFormRef.value?.validate(async (valid: boolean) => {
+    if (valid) {
+      buttonLoading.value = true;
+      if (form.value.id) {
+        await updateService(form.value).finally(() => (buttonLoading.value = false));
+      } else {
+        await addService(form.value).finally(() => (buttonLoading.value = false));
+      }
+      proxy?.$modal.msgSuccess('操作成功');
+      dialog.visible = false;
+      await getList();
+    }
+  });
+};
+
+/** 删除按钮操作 */
+const handleDelete = async (row?: ServiceVO) => {
+  const _ids = row?.id || ids.value;
+  await proxy?.$modal.confirm('是否确认删除轨迹服务编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
+  await delService(_ids);
+  proxy?.$modal.msgSuccess('删除成功');
+  await getList();
+};
+
+/** 导出按钮操作 */
+const handleExport = () => {
+  proxy?.download(
+    'system/service/export',
+    {
+      ...queryParams.value
+    },
+    `service_${new Date().getTime()}.xlsx`
+  );
+};
+
+onMounted(() => {
+  getList();
+});
+</script>
+
+<style lang="scss" scoped>
+.deviceContent {
+  width: 100%;
+  height: 75vh;
+}
+
+.checkdeviceContent {
+  width: 100%;
+  height: 65vh;
+}
+
+.noCheck,
+.checked {
+  width: 100%;
+  height: 100%;
+  /* border: 1px solid #b8b6b6; */
+  border-radius: 8px;
+  padding: 8px;
+  box-sizing: border-box;
+}
+
+.dilogFooter {
+  text-align: center;
+}
+.center {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-content: center;
+  justify-content: center;
+  align-items: center;
+}
+
+.cell,
+:deep .cell {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+:deep .el-checkbox__input.is-disabled .el-checkbox__inner,
+.el-checkbox__input.is-disabled .el-checkbox__inner {
+  background-color: #e5e5e5 !important;
+}
+</style>

src/views/index.vue

@@ -4,20 +4,28 @@
     <div>
       <h2>数据总览</h2>
       <div class="data-item">
-        <div class="data_bck">
+        <div class="data_bck data">
-          <div class="number"><span>{{ DataOverview.devicesNumber }}</span> 个</div>
+          <div class="number">
+            <span>{{ DataOverview.devicesNumber }}</span> 个
+          </div>
           <div class="title_number">设备数量</div>
         </div>
-        <div class="data_green">
+        <div class="data_green data">
-          <div class="number"><span>{{ DataOverview.equipmentOnline }}</span> 个</div>
+          <div class="number">
+            <span>{{ DataOverview.equipmentOnline }}</span> 个
+          </div>
           <div class="title_number">在线设备</div>
         </div>
-        <div class="data_orgine">
+        <div class="data_orgine data">
-          <div class="number"><span>{{ DataOverview.binding }}</span> 个</div>
+          <div class="number">
+            <span>{{ DataOverview.binding }}</span> 个
+          </div>
           <div class="title_number">已绑定设备</div>
         </div>
-        <div class="data_red">
+        <div class="data_red data">
-          <div class="number"><span>{{ DataOverview.equipmentAbnormal }}</span> 个</div>
+          <div class="number">
+            <span>{{ DataOverview.equipmentAbnormal }}</span> 个
+          </div>
           <div class="title_number">异常设备</div>
         </div>
       </div>
@@ -28,10 +36,8 @@
           <div class="content-row">
             <h2>设备分类</h2>
             <div class="card-header">
-              <div v-for="(item, index) in deviceList" :key="index" class="progress-item"
+              <div v-for="(item, index) in deviceList" :key="index" class="progress-item" style="display: inline-block; margin-right: 40px">
-                style="display: inline-block; margin-right: 40px;">
+                <el-progress :stroke-width="7" type="circle" :width="100" :percentage="item.total === 0 ? 0 : (item.current / item.total) * 100">
-                <el-progress :stroke-width="7" type="circle" :width="100"
-                  :percentage="item.total === 0 ? 0 : (item.current / item.total) * 100">
                   <template #default>
                     <div class="progress-text">
                       <span class="current">{{ item.current }}</span>
@@ -77,20 +83,12 @@
             <div class="card-header">
               <h2>设备使用频次</h2>
               <div class="chart-controls">
-                <el-select v-model="deviceType" placeholder="设备类型" style="width: 150px;"
+                <el-select v-model="deviceType" placeholder="设备类型" style="width: 150px" @change="handleDeviceTypeChange">
-                  @change="handleDeviceTypeChange">
+                  <el-option v-for="item in deviceTypeOptions" :key="item.value" :label="item.typeName" :value="item.deviceTypeId" />
-                  <el-option v-for="item in deviceTypeOptions" :key="item.value" :label="item.typeName"
-                    :value="item.deviceTypeId" />
                 </el-select>
                 <div class="tab-group">
-                  <div class="tab-item" :class="{ 'tab-item--active': activeTab === '1' }"
+                  <div class="tab-item" :class="{ 'tab-item--active': activeTab === '1' }" @click="updateFrequencyChart('1')">近半年</div>
-                    @click="updateFrequencyChart('1')">
+                  <div class="tab-item" :class="{ 'tab-item--active': activeTab === '2' }" @click="updateFrequencyChart('2')">近一年</div>
-                    近半年
-                  </div>
-                  <div class="tab-item" :class="{ 'tab-item--active': activeTab === '2' }"
-                    @click="updateFrequencyChart('2')">
-                    近一年
-                  </div>
                 </div>
               </div>
             </div>
@@ -141,8 +139,8 @@
 </template>
 
 <script setup name="Index" lang="ts">
-import api from '@/api/home/index'
+import api from '@/api/home/index';
-import { DataOverviewType } from '@/api/home/types'
+import { DataOverviewType } from '@/api/home/types';
 import router from '@/router';
 import * as echarts from 'echarts'; // 引入ECharts核心库
 import apiTypeAll from '@/api/equipmentManagement/device/index';
@@ -153,15 +151,15 @@ const DataOverview = ref<DataOverviewType>({
   equipmentAbnormal: 0
 });
 const deviceTypeOptions = ref([]); //设备类型
-const deviceType = ref()
+const deviceType = ref();
 const activeTab = ref('1');
-const alarmsData = ref()
+const alarmsData = ref();
 // ---------------------- 基础数据 ----------------------
 // 设备分类数据
 const deviceList = ref([
-  { name: "4G设备", current: 0, total: 0 },
+  { name: '4G设备', current: 0, total: 0 },
-  { name: "蓝牙设备", current: 0, total: 0 },
+  { name: '蓝牙设备', current: 0, total: 0 },
-  { name: "4G&蓝牙设备", current: 0, total: 0 },
+  { name: '4G&蓝牙设备', current: 0, total: 0 }
 ]);
 // ---------------------- 图表Ref（用于挂载图表实例） ----------------------
 const frequencyChartRef = ref<HTMLDivElement | null>(null); // 设备使用频次折线图
@@ -193,7 +191,7 @@ const initFrequencyChart = async (range: any = '1', deviceTypeId: any) => {
   try {
     let data = {
       deviceTypeId: deviceTypeId
-    }
+    };
     const res = await api.getEquipmentUsageData(range, data);
     const monthData = res.data[0] || {};
     const monthKeys = ['m1', 'm2', 'm3', 'm4', 'm5', 'm6', 'm7', 'm8', 'm9', 'm10', 'm11', 'm12'];
@@ -202,23 +200,24 @@ const initFrequencyChart = async (range: any = '1', deviceTypeId: any) => {
     let filteredKeys, filteredNames, yAxisData;
     const today = new Date();
     const currentMonth = today.getMonth();
-    if (range === '1') {
+
-      const result = [];
+    let mm = 6;
-      for (let i = 0; i < 6; i++) {
+    if (range === '2') {
-        const targetMonth = (currentMonth - i + 12) % 12;
+      mm = 12;
-        result.push(targetMonth);
-      }
-      const recent6Months = result.reverse();
-      // 匹配接口字段和名称
-      filteredKeys = recent6Months.map(monthIndex => monthKeys[monthIndex]);
-      filteredNames = recent6Months.map(monthIndex => monthNames[monthIndex]);
-      yAxisData = filteredKeys.map(key => monthData[key] || 0);
-    } else {
-      // 近一年：全部12个月（1月→12月）
-      filteredKeys = monthKeys;
-      filteredNames = monthNames;
-      yAxisData = filteredKeys.map(key => monthData[key] || 0);
     }
+    const result = [];
+    for (let i = 0; i < mm; i++) {
+      const targetMonth = (currentMonth - i + 12) % 12;
+      result.push(targetMonth);
+    }
+    const recentMonths = result.reverse();
+
+
+    // 匹配接口字段和名称
+    filteredKeys = recentMonths.map((monthIndex) => monthKeys[monthIndex]);
+    filteredNames = recentMonths.map((monthIndex) => monthNames[monthIndex]);
+    yAxisData = filteredKeys.map((key) => monthData[key] || 0);
+
     const chartData = {
       xAxis: filteredNames,
       yAxis: yAxisData,
@@ -258,7 +257,10 @@ const initFrequencyChart = async (range: any = '1', deviceTypeId: any) => {
           areaStyle: {
             color: {
               type: 'linear',
-              x: 0, y: 0, x2: 0, y2: 1,
+              x: 0,
+              y: 0,
+              x2: 0,
+              y2: 1,
               colorStops: [
                 { offset: 0, color: 'rgba(64, 158, 255, 0.3)' },
                 { offset: 1, color: 'rgba(64, 158, 255, 0)' }
@@ -267,21 +269,22 @@ const initFrequencyChart = async (range: any = '1', deviceTypeId: any) => {
           },
           markPoint: {
             data: chartData.peak.value
-              ? [{
+              ? [
-                name: chartData.peak.name,
+                  {
-                value: chartData.peak.value,
+                    name: chartData.peak.name,
-                xAxis: chartData.xAxis.indexOf(chartData.peak.month),
+                    value: chartData.peak.value,
-                yAxis: chartData.peak.value,
+                    xAxis: chartData.xAxis.indexOf(chartData.peak.month),
-                itemStyle: { color: '#409eff' }
+                    yAxis: chartData.peak.value,
-              }]
+                    itemStyle: { color: '#409eff' }
+                  }
+                ]
               : []
           }
         }
       ]
     };
     frequencyChartInstance.setOption(option);
-  } catch (error) {
+  } catch (error) {}
-  }
 };
 /**
  * 2. 报警环形图（今日报警处理占比）
@@ -292,7 +295,7 @@ const initAlarmRingChart = async () => {
   try {
     const res = await api.getAlarmInformation({});
     const { alarmsTotalToday = 0, processingAlarmToday = 0 } = res.data || {};
-    alarmsData.value = res.data || '0'
+    alarmsData.value = res.data || '0';
     alarmRingChartInstance = echarts.init(alarmRingChartRef.value);
     const option = {
       tooltip: {
@@ -312,22 +315,19 @@ const initAlarmRingChart = async () => {
           label: {
             show: true,
             position: 'center',
-            formatter: [
+            formatter: ['{valueStyle|' + alarmsTotalToday + '/' + processingAlarmToday + '}', '{textStyle|今日报警/处理}'].join('\n'), // 换行
-              '{valueStyle|' + alarmsTotalToday + '/' + processingAlarmToday + '}',
-              '{textStyle|今日报警/处理}'
-            ].join('\n'), // 换行
             // 关键：配置 rich 定义样式
             rich: {
               valueStyle: {
-                color: '#333',    // 数字颜色
+                color: '#333', // 数字颜色
-                fontSize: 18,     // 数字字号
+                fontSize: 18, // 数字字号
-                fontWeight: 'bold',// 数字加粗
+                fontWeight: 'bold', // 数字加粗
-                lineHeight: 24    // 行高（控制与下一行间距）
+                lineHeight: 24 // 行高（控制与下一行间距）
               },
               textStyle: {
                 color: 'rgba(56, 64, 79, 0.6)', // 文字颜色（可自定义）
-                fontSize: 14,     // 文字字号
+                fontSize: 14, // 文字字号
-                lineHeight: 20    // 文字行高
+                lineHeight: 20 // 文字行高
               }
             },
             fontSize: 16,
@@ -338,27 +338,24 @@ const initAlarmRingChart = async () => {
             show: false // 隐藏标签连接线
           },
           data: [
-         
+            {
-            {  
+              value: processingAlarmToday,
-              value:processingAlarmToday ,
               name: '已处理',
               itemStyle: { color: '#07BE75' }
             },
-               {
+            {
               value: alarmsTotalToday,
               name: '报警',
               itemStyle: { color: '#F65757' }
-            },
+            }
-
           ]
         }
       ]
     };
     alarmRingChartInstance.setOption(option);
     // 报警柱状图
-    initAlarmBarChart()
+    initAlarmBarChart();
-  } catch (error) {
+  } catch (error) {}
-  }
 };
 
 /**
@@ -367,21 +364,21 @@ const initAlarmRingChart = async () => {
 const initAlarmBarChart = () => {
   if (!alarmBarChartRef.value) return;
   const alarmTypeMap = [
-    { name: '强制报警', field: 'alarmForced' },         // alarmForced 
+    { name: '强制报警', field: 'alarmForced' }, // alarmForced
-    { name: '撞击闯入', field: 'intrusionImpact' },     // intrusionImpact 
+    { name: '撞击闯入', field: 'intrusionImpact' }, // intrusionImpact
-    { name: '自动报警', field: 'alarmAuto' },          // alarmAuto 
+    { name: '自动报警', field: 'alarmAuto' }, // alarmAuto
-    { name: '电子围栏', field: 'fenceElectronic' }       // fenceElectronic 
+    { name: '电子围栏', field: 'fenceElectronic' } // fenceElectronic
   ];
 
-  const alarmTypes = alarmTypeMap.map(item => item.name);
+  const alarmTypes = alarmTypeMap.map((item) => item.name);
-  const alarmCounts = alarmTypeMap.map(item => {
+  const alarmCounts = alarmTypeMap.map((item) => {
     const value = alarmsData.value[item.field]; // 提取对应字段值
     console.log(`${item.name}数值:`, value); // 打印每个类型的数值
     return value;
   });
   const commonGradient = new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-    { offset: 0, color: 'rgba(246, 87, 87, 1)' },    // 渐变起点：#F65757（不透明）
+    { offset: 0, color: 'rgba(246, 87, 87, 1)' }, // 渐变起点：#F65757（不透明）
-    { offset: 1, color: 'rgba(224, 52, 52, 0)' }     // 渐变终点：#E03434（全透明）
+    { offset: 1, color: 'rgba(224, 52, 52, 0)' } // 渐变终点：#E03434（全透明）
   ]);
   const option = {
     tooltip: {
@@ -413,8 +410,8 @@ const initAlarmBarChart = () => {
         data: alarmCounts,
         barWidth: '20%',
         itemStyle: {
-          color: commonGradient,       // 所有柱子共用同一渐变色
+          color: commonGradient, // 所有柱子共用同一渐变色
-          borderRadius: 4              // 统一4px圆角
+          borderRadius: 4 // 统一4px圆角
         }
       }
     ]
@@ -429,19 +426,18 @@ const updateFrequencyChart = (tabValue: any) => {
   if (frequencyChartInstance) {
     frequencyChartInstance.dispose();
   }
-  deviceType.value=''
+  deviceType.value = '';
   initFrequencyChart(tabValue, '');
 };
 const handleDeviceTypeChange = (all) => {
   initFrequencyChart(activeTab.value, all);
-
 };
 // 首页统计接口
 const getData = async () => {
   //  设备总览
-  api.getDataOverview({}).then(res => {
+  api.getDataOverview({}).then((res) => {
-    DataOverview.value = res.data
+    DataOverview.value = res.data;
-  })
+  });
   // 设备分类
   try {
     const res = await api.getEquipmentClassification({});
@@ -450,48 +446,42 @@ const getData = async () => {
     // 映射数据：current 为各类型设备数量，total 为总设备数（6）
     deviceList.value = [
       {
-        name: "4G设备",
+        name: '4G设备',
         current: equipment4G,
         total: total
       },
       {
-        name: "蓝牙设备",
+        name: '蓝牙设备',
         current: deviceBluetooth,
         total: total
       },
       {
-        name: "4G&蓝牙设备",
+        name: '4G&蓝牙设备',
         current: devices4GAndBluetooth,
         total: total
-      },
+      }
     ];
   } catch (error) {
     console.log('获取设备分类数据失败：', error);
   }
   // 设备类型
-  apiTypeAll.deviceTypeAll().then(res => {
+  apiTypeAll
-    if (res.code == 200) {
+    .deviceTypeAll()
-      const originalData = Array.isArray(res.data) ? res.data : [];
+    .then((res) => {
-      deviceTypeOptions.value = [{ typeName: '全部', deviceTypeId: ''}].concat(originalData); 
+      if (res.code == 200) {
-    }
+        const originalData = Array.isArray(res.data) ? res.data : [];
-  }).catch(err => {
+        deviceTypeOptions.value = [{ typeName: '全部', deviceTypeId: '' }].concat(originalData);
-
+      }
-  })
+    })
+    .catch((err) => {});
 };
 
-
-
-
-
-
-
-
 // ---------------------- 生命周期钩子（初始化/销毁图表） ----------------------
 onMounted(() => {
   // 页面加载时初始化所有图表
   initFrequencyChart('1', '');
   initAlarmRingChart();
-  getData()
+  getData();
 
   // 监听窗口 resize，自动调整图表大小
   window.addEventListener('resize', () => {
@@ -506,11 +496,15 @@ onUnmounted(() => {
   frequencyChartInstance?.dispose();
   alarmRingChartInstance?.dispose();
   //alarmBarChartInstance?.dispose();
-  window.removeEventListener('resize', () => { });
+  window.removeEventListener('resize', () => {});
-});                    
+});
 </script>
 
 <style lang="scss" scoped>
+
+.data,.content-row,.region-chart-card{
+  box-shadow: 0px 0px 12px 0px #3c3c3c2b;
+}
 .home {
   padding: 10px 20px 10px 20px;
   background-color: #f5f7fa;
@@ -528,7 +522,7 @@ onUnmounted(() => {
     .data_green,
     .data_orgine,
     .data_red {
-      width:23%;
+      width: 23%;
       height: 135px;
       border-radius: 10px;
       position: relative;
@@ -556,7 +550,7 @@ onUnmounted(() => {
     }
 
     .number {
-      padding-top:30px;
+      padding-top: 30px;
       font-size: 18px;
 
       span {
@@ -675,7 +669,6 @@ onUnmounted(() => {
     padding: 16px;
     height: 360px; // 固定图表卡片高度，避免布局错乱
 
-
     .card-body {
       height: calc(100% - 40px); // 卡片内容区高度（减去header高度）
     }
@@ -713,7 +706,7 @@ onUnmounted(() => {
         }
 
         .stat.green {
-          color: #07BE75;
+          color: #07be75;
         }
 
         .label {
@@ -845,4 +838,4 @@ onUnmounted(() => {
     }
   }
 }
-</style>
+</style>

src/views/system/dict/index.vue

@@ -43,9 +43,9 @@
               删除
             </el-button>
           </el-col>
-          <el-col :span="1.5">
+          <!-- <el-col :span="1.5">
             <el-button v-hasPermi="['system:dict:export']" type="warning" plain icon="Download" @click="handleExport">导出</el-button>
-          </el-col>
+          </el-col> -->
           <el-col :span="1.5">
             <el-button v-hasPermi="['system:dict:remove']" type="danger" plain icon="Refresh" @click="handleRefreshCache">刷新缓存</el-button>
           </el-col>

src/views/system/role/index.vue

@@ -48,9 +48,9 @@
           <el-col :span="1.5">
             <el-button v-hasPermi="['system:role:delete']" type="danger" plain :disabled="ids.length === 0" @click="handleDelete()">删除</el-button>
           </el-col>
-          <el-col :span="1.5">
+          <!-- <el-col :span="1.5">
             <el-button v-hasPermi="['system:role:export']" type="warning"  plain icon="Download" @click="handleExport">导出</el-button>
-          </el-col>
+          </el-col> -->
           <right-toolbar v-model:show-search="showSearch" @query-table="getList"></right-toolbar>
         </el-row>
       </template>
@@ -84,7 +84,7 @@
               <el-button v-hasPermi="['system:role:edit']" link type="primary" icon="CircleCheck" @click="handleDataScope(scope.row)"></el-button>
             </el-tooltip>
             <el-tooltip v-if="scope.row.roleId !== 1" content="分配用户" placement="top">
-              <el-button v-hasPermi="['system:role:edit']" link type="primary" icon="User" @click="handleAuthUser(scope.row)"></el-button>
+              <el-button v-hasPermi="['system:role:edit']" link type="primary" icon="User" @click=" (scope.row)"></el-button>
             </el-tooltip>
           </template>
         </el-table-column>

src/views/system/user/profile/index.vue

@@ -61,7 +61,7 @@
             <el-tab-pane label="在线设备" name="onlineDevice">
               <onlineDevice :devices="state.devices" />
             </el-tab-pane>
-            <el-tab-pane label="App版本" name="appVer">
+            <el-tab-pane label="" name="appVer" style="visibility: hidden;" >
               <appVer />
             </el-tab-pane>
           </el-tabs>