src/views/alarm/gis/index.vue

@@ -16,7 +16,7 @@
                   <el-icon class="el-input__icon"><search /></el-icon>
                 </template>
           </el-select>
-        </el-form-item>
+        </el-form-item> 
 
         <el-form-item label="所属基地：" prop="base">
           <el-select v-model="searchParam.base" placeholder="请选择" style="width: 200px">
@@ -27,15 +27,15 @@
         <el-form-item><div class="lv-state">设备正常3</div></el-form-item>
         <el-form-item><div class="hong-state">设备故障2</div></el-form-item>
         <el-form-item><div class="cheng-state">危险天气1{{ info.one }}</div></el-form-item> <!-- 操作1     -->
-
+        
         <!-- 基本信息 -->
         <el-form-item>
-          <el-popover
-            v-model="visible"
+          <el-popover 
+            v-model="visible" 
             @show="handleShowChange"
-            @hide="handleHideChange"
-            placement="bottom"
-            :width="200"
+            @hide="handleHideChange" 
+            placement="bottom" 
+            :width="200" 
             trigger="click">
             <el-checkbox-group v-model="checkList">
               <!--鹰眼  -->
@@ -54,7 +54,7 @@
                   size="large"
                   v-model="showNineGrid"
                     inline-prompt
-                    active-text="开九宫格"
+                    active-text="开九宫格"    
                     inactive-text="关九宫格"
                 />
               </el-form-item>
@@ -78,6 +78,16 @@
                     inactive-text="关闭站名"
                 />
               </el-form-item>
+              <!-- 站号 -->
+              <el-form-item>
+                <el-switch
+                  size="large"
+                  v-model="isstationCode"
+                    inline-prompt
+                    active-text="打开站号"
+                    inactive-text="关闭站号"
+                />
+              </el-form-item>
               <!-- 街道地图 -->
               <el-form-item>
                 <el-switch
@@ -87,7 +97,7 @@
                     active-text="街道地图"
                     inactive-text="关闭"
                 />
-              </el-form-item>
+              </el-form-item>             
             </el-checkbox-group>
             <template #reference>
               <div :class="visible ? 'hei-state-primary' : 'hei-state'">基本功能</div>
@@ -95,7 +105,7 @@
           </el-popover>
         </el-form-item>
 
-      </el-form>
+      </el-form>      
       <!-- 右侧功能栏 -->
       <div class="header-button-ri">
         <el-popover
@@ -119,7 +129,7 @@
                 <template v-for="item in elementList" :key="item.id"  >
                   <div v-if="item.data_type==='温湿度'"  :class="item.isSelected?'item-tag-active':'item-tag'" @click="toggleSelection(item)" >{{item.data_name}}</div>
                 </template>
-              </div>
+              </div>  
             </el-tab-pane>
 
             <!-- 气压 -->
@@ -134,7 +144,7 @@
                 <template v-for="item in elementList" :key="item.id"  >
                   <div v-if="item.data_type==='气压'"  :class="item.isSelected?'item-tag-active':'item-tag'" @click="toggleSelection(item)" >{{item.data_name}}</div>
                 </template>
-              </div>
+              </div>  
             </el-tab-pane>
 
             <!-- 湿度 -->
@@ -149,9 +159,9 @@
                 <template v-for="item in elementList" :key="item.id"  >
                   <div v-if="item.data_type==='温湿度'"  :class="item.isSelected?'item-tag-active':'item-tag'" @click="toggleSelection(item)" >{{item.data_name}}</div>
                 </template>
-              </div>
+              </div>  
             </el-tab-pane>
-
+           
             <!-- 风 -->
             <el-tab-pane>
               <template #label>
@@ -167,19 +177,19 @@
               </div>
             </el-tab-pane>
 
-            <!-- 降雨 -->
+            <!-- 降雨 -->   
             <el-tab-pane>
               <template #label>
                 <div class="gis-c">
                   <span>降雨</span>
                   <img class="gis-icon" src="../../../assets/images/rainfall.svg">
                 </div>
-              </template>
+              </template>              
               <div class="container-tag" style="overflow-y:auto; height:300px ">
                 <template v-for="item in elementList" :key="item.id"  >
                   <div v-if="item.data_type==='降水'"  :class="item.isSelected?'item-tag-active':'item-tag'" @click="toggleSelection(item)" >{{item.data_name}}</div>
                 </template>
-              </div>
+              </div>             
 
             </el-tab-pane>
 
@@ -196,7 +206,7 @@
                 <template v-for="item in elementList" :key="item.id"  >
                   <div v-if="item.data_type==='云'"  :class="item.isSelected?'item-tag-active':'item-tag'" @click="toggleSelection(item)" >{{item.data_name}}</div>
                 </template>
-              </div>
+              </div>  
             </el-tab-pane>
 
             <!-- 能见度 -->
@@ -211,7 +221,7 @@
                 <template v-for="item in elementList" :key="item.id"  >
                   <div v-if="item.data_type==='能见度'"  :class="item.isSelected?'item-tag-active':'item-tag'" @click="toggleSelection(item)" >{{item.data_name}}</div>
                 </template>
-              </div>
+              </div>  
             </el-tab-pane>
 
             <!-- 天气现象 -->
@@ -226,7 +236,7 @@
                 <template v-for="item in elementList" :key="item.id"  >
                   <div v-if="item.data_type==='天气现象'"  :class="item.isSelected?'item-tag-active':'item-tag'" @click="toggleSelection(item)" >{{item.data_name}}</div>
                 </template>
-              </div>
+              </div>  
             </el-tab-pane>
           </el-tabs>
           <template #reference>
@@ -238,8 +248,8 @@
           </template>
         </el-popover>
       </div>
-    </div>
-
+    </div>  
+    
     <!-- 地图与经纬度显示区域 -->
     <div id="map" class="map" style="width: 100%; height: 100vh;">
       <!-- 九宫格盒子 -->
@@ -248,13 +258,13 @@
           {{ value }}
         </div>
       </div>
-
-    </div>
-
-    <div id="mouse-position" class="mouse-position">经纬度: </div>
+      
+    </div> 
+    <!-- 右下角经纬度显示 -->
+    <div id="mouse-position" class="mouse-position">经纬度: </div>    
 
     <!-- 地图底部控制栏 -->
-    <div class="gis-bottom-box">
+    <div class="gis-bottom-box">  
       <div class="gis-bottom-item">
         <div class="button-bg" @click="isPlay=!isPlay">
           <img v-if="isPlay" class="button-bg-c" style="margin-left: 3px"  src="../../../assets/images/stop.svg"/>
@@ -262,12 +272,14 @@
         </div>
         <div style="margin-left: 2px" class="gis-bottom-text">{{isPlay?'暂停':'播放'}}</div>
       </div>
+
       <div class="gis-bottom-item" @click="handleBack">
         <div class="button-bg">
           <img class="button-bg-c"  src="../../../assets/images/back.svg"/>
         </div>
         <div style="margin-left: 2px" class="gis-bottom-text">上一个</div>
       </div>
+
       <div class="gis-bottom-item">
         <el-date-picker
           style="margin-top: 5px"
@@ -276,33 +288,48 @@
           placeholder="请选择时间"
         />
       </div>
+
+
+      <!-- 动态绑定事件间隔 timeInterval -->
       <div class="gis-bottom-item">
-        <el-slider
+        <el-slider          
           :min="0"
           :max="1439"
-          :step="10"
           :format-tooltip="formatTooltip"
-          v-model="value2"
+          v-model="value2"            
           style="width: 720px;margin: 0px 0px 0px 10px" />
-        <img src="../../../assets/images/scale.svg" style="width: 720px;margin-top: -10px"/>
+        <img src="../../../assets/images/scale.svg" style="width: 720px;margin-top: -10px"/>        
       </div>
+     
       <div class="gis-bottom-item">
         <div class="button-bg" @click="handleForward">
           <img class="button-bg-c"  src="../../../assets/images/forward.svg"/>
-        </div>
+        </div> 
         <div style="margin-left: 2px" class="gis-bottom-text">下一个</div>
       </div>
+      
+      
+      <!-- 添加事件下拉框 -->
+      <div class="gis-bottom-item">                
+        <el-select v-model="timeInterval" placeholder="选择时间间隔" style="width: 150px;">
+          <el-option label="5秒间隔" :value="5000"></el-option>
+          <el-option label="2分钟间隔" :value="120000"></el-option>
+          <el-option label="5分钟间隔" :value="300000"></el-option>
+          <el-option label="10分钟间隔" :value="600000"></el-option>
+          <el-option label="60分钟间隔" :value="3600000"></el-option>          
+        </el-select>         
+      </div>
+
       <div class="gis-bottom-item">
         <div class="gis-bottom-hei-state">当前时间 {{formatTooltip(value2)}}</div>
       </div>
-    </div>
-  </div>
-
+    </div> 
 
+  </div>
 </template>
 
-  <script setup lang="ts">
-  import { ref, reactive, onMounted } from "vue";
+<script setup lang="ts">
+  import { ref, reactive, onMounted,onUnmounted } from "vue";
   import imglogo from '/src/assets/images/logo.svg'
   import 'ol/ol.css';
   import TileLayer from 'ol/layer/Tile';
@@ -331,17 +358,55 @@
   import { METERS_PER_UNIT } from 'ol/proj/Units';
   import { labelZoomSize, colorRGBtoHex } from "@/assets/map/maptool";
   import { Draw } from 'ol/interaction';
-  // import NineGrid from './NineGrid.vue';
+  
+
+
+
+  // const isStationCode = ref()
+
+
+
+
+
+
+// 时间选择器、滑块和时间间隔的控制变量
+const value2 = ref(0); // 滑动条的默认值（从0点开始）
+const intervalDuration = 5000; // 定义持续时间间隔为1000毫秒 5秒刷新一次
+let intervalId: ReturnType<typeof setInterval> | null = null;
+const timeInterval = ref(5000); // 默认毫秒时间间隔
+
+// 获取当前时间分钟数（以一天的分钟为单位）
+const now = new Date();
+const currentMinutes = now.getHours() * 60 + now.getMinutes(); 
+const currentDate = ref(new Date()); // 创建一个响应式变量 currentDate，初始化为当前日期
+const updateTime = () =>{
+  const fullYear = currentDate.value.getFullYear(); // 获取当前年份
+  const month = currentDate.value.getMonth(); //获取当前月份
+  const currentHour = currentDate.value.getHours(); // 获取当前小时
+  const currentMinute = currentDate.value.getMinutes(); // 获取当前分钟
+  const currentSeconds = currentDate.value.getSeconds(); // 获取当前秒钟
+}
+
+// 设置默认时间为当前时间
+// const selectedTime = ref(new Date(currentDate.value.getFullYear(), currentDate.value.getMonth(), currentDate.getDate(), currentDate.getHours(), currentDate.getMinutes()));
+
+// 初始化滑动条的值为当前分钟数
+const value = ref(currentMinutes);
+
+// 处理时间间隔的改变
+const handleIntervalChange = (newInterval: number) => {
+  timeInterval.value = newInterval;
+};
 
 
   const showNineGrid = ref(false); // 控制九宫格显示与否
-  const dataValues = ref(Array(9).fill(0)); // 替换为实际的数据
+  const dataValues = ref(Array(9).fill(0)); // 替换为实际的数据 
   const currentStationIndex = ref(0); // 选择的站点索引
-  // const stationCoordinates = { longitude: 116.397128, latitude: 39.916527 }; // 示例经纬度（北京天安门）
+  
 
   // 存储站点的经纬度和数据值
   const stations = ref([
-    { lat: 34.638163632, lon: 116.426066261, value: 10 },
+    { lat: 34.638163632, lon: 116.426066261, value: 10 }, 
     { lat: 34.638263632, lon: 116.426166261, value: 20 },
     { lat: 34.638363632, lon: 116.426266261, value: 30 },
     // 继续添加其他站点
@@ -385,8 +450,6 @@
 
 
 
-
-
   // 新建VectorSource（矢量信息图层） 来存放台站数据
   const stationSource = new VectorSource();
   const stationLayer = new VectorLayer({
@@ -395,20 +458,118 @@
 
   // 定义状态变量
   const value1 = ref('');
-  const value2 = ref(0);
+  // const value2 = ref(0); // 设置默认滑块值为0 即0时开始
   const visible = ref(false);
   const visible2 = ref(false);
   const checkList = ref(['Value selected and disabled', 'Value A']);
   const isPlay = ref(true);
   const isEagleEyeOn = ref(true); // 鹰眼开关状态
-  const isjGG = ref(false); // 九宫格开关状态 默认关闭
-  const isboxDrawn = ref(false); // 框选开关状态 默认关闭  boxDrawn
+  const isjGG = ref(false); // 九宫格开关状态 默认关闭  
+  const isboxDrawn = ref(false); // 框选开关状态 默认关闭  boxDrawn 
   const isstationName = ref(false); // 站名开关状态 默认关闭  isstationName
-  const isstreet = ref(true); // 街道地图开关状态 默认关闭
+  const isstationCode = ref(true); // 站号开关状态 默认打开  isstationCode
+  const isstreet = ref(true); // 街道地图开关状态 默认关闭  
   const searchParam = reactive({ base: undefined, station: undefined });
   const baseOptions = ref([{ value: 0, label: '基地1' }, { value: 1, label: '基地2' }]);
   const stationOptions = ref([{ value: 0, label: 'M1986' }, { value: 1, label: 'M1987' }]);
 
+
+  /**站号开关功能 */
+  // 监听站号开关变化
+  watch(isstationCode,(newValue) =>{
+    if(newValue){
+      // 打开站号 - 
+      showStationCodes(); // 显示站号
+      
+    }else{
+      hideStationCodes();// 关闭站号
+    }
+  })
+
+  // 显示站号的函数
+function showStationCodes() {
+  platformList.value.forEach((station) => {
+    const latitude = parseFloat(station.as_lat.replace('N', ''));
+    const longitude = parseFloat(station.as_lon.replace('E', ''));
+
+    const feature = new Feature({
+      geometry: new Point(fromLonLat([longitude, latitude])),
+      name: station.as_name,
+      code: station.as_code,
+    });
+
+    // 设置带站号的样式
+    feature.setStyle(new Style({
+      image: new Icon({
+        src: imglogo,
+        scale: 0.008,
+      }),
+      text: new Text({
+        text: station.as_code, // 仅显示站号
+        font: '12px Calibri,sans-serif',
+        fill: new Fill({ color: '#000' }),
+        stroke: new Stroke({ color: '#fff', width: 2 }),
+        offsetY: -20,
+        textAlign: 'center',
+      })
+    }));
+
+    stationSource.addFeature(feature); // 添加特征到数据源
+  });
+}
+// 隐藏站号的函数
+function hideStationCodes() {
+  stationSource.clear(); // 清除所有站号 
+}
+
+
+
+  /**站名开关功能 */
+  // 监听站名开关变化
+  watch(isstationName,(newValue) =>{
+    if(newValue){
+      showStationName();// 打开站号 
+    }else{
+      hideStationName()// 关闭站号
+    }
+  })
+  // 显示站名的函数
+function showStationName() {
+  platformList.value.forEach((station) => {
+    const latitude = parseFloat(station.as_lat.replace('N', ''));
+    const longitude = parseFloat(station.as_lon.replace('E', ''));
+
+    const feature = new Feature({
+      geometry: new Point(fromLonLat([longitude, latitude])),
+      name: station.as_name,
+      code: station.as_code,
+    });
+
+    // 设置带站号的样式
+    feature.setStyle(new Style({
+      image: new Icon({
+        src: imglogo,
+        scale: 0.008,
+      }),
+      text: new Text({
+        text: station.as_name, // 仅显示站名
+        font: '12px Calibri,sans-serif',
+        fill: new Fill({ color: '#000' }),
+        stroke: new Stroke({ color: '#fff', width: 2 }),
+        offsetY: -20,
+        textAlign: 'center',
+      })
+    }));
+
+    stationSource.addFeature(feature); // 添加特征到数据源
+  });
+}
+// 隐藏站名的函数
+function hideStationName() {
+  stationSource.clear(); // 清除所有站名
+}
+
+
   // 查询自动站列表
   const queryas = ref<Platform>({
     pageSize: 10000,
@@ -420,14 +581,14 @@
   const getPlatforms = async () => {
     try{
       const { data } = await getPlatformList(queryas.value);
-      platformList.value = data.list;
-      console.log("platformList.value:",+ platformList.value); // 在控制台输出平台列表
+      platformList.value = data.list;    
+      console.log("platformList.value:",+ platformList.value); // 在控制台输出平台列表    
 
       getStations(data.list);
       // console.log("打印data.list的数据：",+data.list)
     }catch(error){
       console.log("获取平台列表失败：",error)
-    }
+    }    
   };
 
   const pageable = ref<any>({
@@ -447,7 +608,7 @@
       const { data } = await getDataItemList(pageable.value); // 假设此函数调用成功并返回数据
       processTableData.value = data.list || []; //保证processTableData不会为null
       getStations(platformList.value);  //更新getStation更新站点
-
+      
       return data.list; // 确保返回数据
     } catch (error) {
       console.error("获取数据时出错:", error);
@@ -455,17 +616,17 @@
     }
   };
 
-  // 地图台站信息标注
+  // 地图台站信息标注 
   const getStations = (stations) => {
-    console.log(stations,'getstation2');
-
+    console.log(stations,'getstation2');  
+    
     stationSource.clear();  // 清除之前的站点标记
     stations.forEach(station => {
-      console.log(processTableData.value,'11');
-
+      console.log(processTableData.value,'11');    
+    
       if (station.as_lon && station.as_lat) {
       const result = processTableData.value.find(item => item.as_code === station.as_code)
-      console.log(result,'......result');
+      console.log(result,'......result');    
 
         const latitude = parseFloat(station.as_lat.replace('N', ''));
         const longitude = parseFloat(station.as_lon.replace('E', ''));
@@ -519,8 +680,8 @@
 
         // 将站点特征添加到站点源
         stationSource.addFeature(feature);
-
-      }
+        
+      } 
     });
   };
 
@@ -544,6 +705,23 @@ const forwardIcon = ref('@/assets/images/forward.svg');
 const formatTooltip = (value) => `${Math.floor(value / 60).toString().padStart(2, '0')}:${(value % 60).toString().padStart(2, '0')}`;
 const handleBack = () => value2.value -= 10;
 const handleForward = () => value2.value += 10;
+
+// 启动定时器 时间间隔器
+const startInterval = () => {
+  if (intervalId) clearInterval(intervalId);
+  intervalId = setInterval(() => {
+    value2.value += 5; // 按每秒自增1进行示例，可根据需求修改
+  }, intervalDuration);
+};
+
+// 停止定时器
+const stopInterval = () => {
+  if (intervalId) clearInterval(intervalId);
+  intervalId = null;
+};
+
+
+
 const handleHideChange = () => { visible.value = false; };
 const handleShowChange = () => { visible.value = true; };
 const handleShowChange2 = () => { visible2.value = true; };
@@ -572,7 +750,7 @@ const info=ref<any>({
 const createWMSLayer = ({ layerName, minZoom, maxZoom, opacity = 1 }) => {
   return new TileLayer({
     source: new TileWMS({
-      url: 'http://192.168.43.77:8080/geoserver/wms',
+      url: 'http://192.168.127.124:8080/geoserver/wms',
       params: { 'LAYERS': layerName, 'TILED': true, 'FORMAT': 'image/png', 'TRANSPARENT': true, 'ENCODING': 'UTF-8' },
       serverType: 'geoserver'
     }),
@@ -583,7 +761,7 @@ const createWMSLayer = ({ layerName, minZoom, maxZoom, opacity = 1 }) => {
 };
 
 
-let map; // 定义为全局变量
+let map:any; // 定义为全局变量
 let overviewMapControl: OverviewMap;
 // 地图初始化
 const initializeMap = () => {
@@ -602,11 +780,11 @@ const initializeMap = () => {
     view: view
   });
 
-
+ 
   // 定义鹰眼视图层
   const overviewMapLayer = new TileLayer({
     source: new TileWMS({
-      url: 'http://192.168.43.77:8080/geoserver/wms',
+      url: 'http://192.168.127.124:8080/geoserver/wms',
       params: {
         'LAYERS': 'basemap:province',  // 选择可见的图层为省级
         'TILED': true,
@@ -624,7 +802,7 @@ const initializeMap = () => {
     layers: [overviewMapLayer]
   });
   map.addControl(overviewMapControl);
-
+  
   // 显示小数点经纬度
   map.on('pointermove', (evt) => {
       // const [lon, lat] = toLonLat(map.getCoordinateFromPixel(evt.pixel));
@@ -637,11 +815,11 @@ const initializeMap = () => {
 watch(isEagleEyeOn, (newValue) => {
   overviewMapControl.setCollapsed(!newValue);
 });
-// 鹰眼图层的初始化
-const initializeOverviewMap = () => {
+// 鹰眼图层的初始化  
+const initializeOverviewMap = () => {   
   const overviewMapLayer = new TileLayer({
     source: new TileWMS({
-      url: 'http://192.168.43.77:8080/geoserver/wms',
+      url: 'http://192.168.127.124:8080/geoserver/wms',
       params: {
         'LAYERS': 'basemap:province',
         'TILED': true,
@@ -652,7 +830,7 @@ const initializeOverviewMap = () => {
       serverType: 'geoserver'
     })
   })
-};
+};   
 
 // 查询所有人工要素字典表
 const elementList =ref<any>([])
@@ -664,10 +842,10 @@ const getAllRgDataList = async () => {
 
 // 存放选中要素列表
 const copiedCustomizeColumns = ref<any>([]);
-// 要素的选中和取消
+// 要素的选中和取消  
 const toggleSelection = (item) => {
   item.isSelected = !item.isSelected;
-
+  
   if (item.isSelected) {
     // 添加选中的要素
     copiedCustomizeColumns.value.push(item);
@@ -687,12 +865,19 @@ const toggleSelection = (item) => {
 
 };
 
-  // 在组件挂载时初始化地图
+  // 在组件挂载时初始化地图 
   onMounted(() => {
+    // startInterval(); // 组件中挂载启动时间器
+    updateTime(); // 页面加载时更新时间
+    // selectedTime.value = new Date(currentDate.value.getFullYear(), currentDate.value.getMonth(), currentDate.getDate(), currentDate.getHours(), currentDate.getMinutes());
     getAllRgDataList(); // 存放人工选择的要素列表
     initializeMap();
-    getPlatforms();
+    getPlatforms();    
   });
+  // 在组件卸载时清除定时器
+onUnmounted(() => {
+  stopInterval();
+});
 
 </script>
 
@@ -707,7 +892,7 @@ const toggleSelection = (item) => {
 </style>
 
 <style scoped>
-.map {
+.map { 
   width: 100%;
   /* height: 100vh; */
   height: calc(100vh - 50px); /* 使用 calc() 来确保地图占满视口高度，减去上方的固定高度 */
@@ -740,25 +925,40 @@ const toggleSelection = (item) => {
 }
 
 
-.slider-scale {
-  width: 720px;
-  margin-top: -10px;
+.slider-scale { 
+  width: 720px; 
+  margin-top: -10px; 
 }
 
 .gis-bottom-box {
-  display: flex;
-  align-items: center;
+  display: flex; 
+  align-items: center; 
   }
 
 /* 经纬度所在位置 */
 .mouse-position {
-  position: absolute;
-  bottom: 0px;
-  right: 1px;
-  background-color: rgba(255, 255, 255, 0.7);
-  padding: 3px;
-  border: 1px solid #ccc;
-  font-size: 14px;
-  z-index: 1000;
+  position: absolute; 
+  bottom: 0px; 
+  right: 1px; 
+  background-color: rgba(255, 255, 255, 0.7); 
+  padding: 3px; 
+  border: 1px solid #ccc; 
+  font-size: 14px; 
+  z-index: 1000; 
 }
+/**时间轴样式 */
+.gis-bottom-hei-state {
+  display: flex;  
+  align-items: center;
+  justify-content: center;
+  padding: 4px 0px 0px 4px; /*上、右、下、左内边距。增加右侧间距*/  
+  background-color: #fffdfd; /* 背景颜色 */
+  border-radius: 4px;
+  display: inline-block; /* 让容器适应内容大小 */
+  font-size: 14px; /* 调整字体大小，确保时间显示清晰 */
+  white-space: nowrap; /* 防止换行 */
+}
+/**时间间隔 */
+
+
 </style>

src/views/system/stations/components/newspapers.vue

@@ -259,9 +259,11 @@ const pkt_bbys2 = ref()
 const pkt_jssd = ref()
 
 const findData=()=>{
+  if(processTableData.value===undefined){
+    return;
+  }
   const result = processTableData.value.find(item => item.pkt_type === searchPktType.value && item.pkt_fmt === searchPktFmt.value);
   if(result){
-    console.log(pkt_bbys1.value)
     pkt_jbxm.value = result.pkt_jbxm.split('|').map((val, index) => val === '1' ? index : -1);
     pkt_hkht.value =result.pkt_hkht.split('|').map((val, index) => val === '1' ? index : -1);
     pkt_zywx.value =result.pkt_zywx.split('|').map((val, index) => val === '1' ? index : -1);
@@ -272,7 +274,6 @@ const findData=()=>{
     pkt_bbys2.value =result.pkt_bbys2
     pkt_jssd.value = result.pkt_jssd
   }else {
-    console.log("======")
     pkt_jbxm.value = []
     pkt_hkht.value = []
     pkt_zywx.value = []

src/views/system/stations/components/parametersBasic.vue

@@ -238,64 +238,73 @@
           <el-col :span="20">
             <div style="display: flex;align-items: center;margin-bottom: 5px">
               <span>主通信</span>
-              <el-checkbox v-model="formInline.enableCorrespondence" style="margin-left: 10px" label="启用从通信" />
+              <el-checkbox v-model="isFromCommunication" disabled style="margin-left: 10px" label="启用从通信" />
             </div>
           </el-col>
         </el-row>
         <el-row :gutter="20">
           <el-col :span="4">
             <el-form-item label="通信方式" prop="methods" style="width: 200px">
-              <el-select v-model="formInline.methods">
-                <el-option label="2G" value="2"></el-option>
-                <el-option label="3G" value="3"></el-option>
-                <el-option label="4G" value="4"></el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="4">
-            <el-form-item label="传输协议" prop="agreement" style="width: 200px">
-              <el-select v-model="formInline.agreement">
-                <el-option label="TCP+DDP" value="2"></el-option>
+              <el-select v-model="primaryCommunications.comm_type" disabled>
+                <el-option label="串口" :value="0"></el-option>
+                <el-option label="北斗" :value="1"></el-option>
+                <el-option label="4G" :value="2"></el-option>
+                <el-option label="文件" :value="3"></el-option>
+                <el-option label="TCPClient" :value="4"></el-option>
               </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="4">
-            <el-form-item label="SIM卡号" prop="sim" style="width: 200px">
-              <el-input v-model="formInline.sim"></el-input>
-            </el-form-item>
-          </el-col>
-          <el-col :span="4">
-            <el-form-item label="通信模块ID" prop="modelId" style="width: 200px">
-              <el-input v-model="formInline.modelId"></el-input>
-            </el-form-item>
-          </el-col>
-          <el-col :span="4">
+<!--          <el-col :span="4">-->
+<!--            <el-form-item label="传输协议" prop="agreement" style="width: 200px">-->
+<!--              <el-select v-model="formInline.agreement">-->
+<!--                <el-option label="主动+补收" value="0"></el-option>-->
+<!--              </el-select>-->
+<!--            </el-form-item>-->
+<!--          </el-col>-->
+<!--          <el-col :span="4">-->
+<!--            <el-form-item label="SIM卡号" prop="sim" style="width: 200px">-->
+<!--              <el-input v-model="formInline.sim"></el-input>-->
+<!--            </el-form-item>-->
+<!--          </el-col>-->
+<!--          <el-col :span="4">-->
+<!--            <el-form-item label="通信模块ID" prop="modelId" style="width: 200px">-->
+<!--              <el-input v-model="formInline.modelId"></el-input>-->
+<!--            </el-form-item>-->
+<!--          </el-col>-->
+          <el-col :span="4" v-if="primaryCommunications.comm_type===4">
+            <el-form-item label="ip地址" prop="port" style="width: 200px">
+              <el-input v-model="ip" disabled></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="4" v-if="primaryCommunications.comm_type===4">
             <el-form-item label="端口号" prop="port" style="width: 200px">
-              <el-input v-model="formInline.port"></el-input>
+              <el-input v-model="port" disabled></el-input>
             </el-form-item>
           </el-col>
-          <el-col :span="4">
+          <el-col :span="4" v-if="primaryCommunications.comm_type===4">
             <el-form-item label="通信模式" prop="communicationMode" style="width: 200px">
-              <el-select v-model="formInline.communicationMode">
-                <el-option label="主动+补发" value="2"></el-option>
+              <el-select v-model="primaryCommunications.comm_mode" disabled>
+                <el-option label="主动+补发" :value="0"></el-option>
+                <el-option label="被动" :value="1"></el-option>
+                <el-option label="主动" :value="2"></el-option>
+                <el-option label="被动 + 补收" :value="3"></el-option>
               </el-select>
             </el-form-item>
           </el-col>
         </el-row>
-        <el-row :gutter="20">
+        <el-row :gutter="20" v-if="primaryCommunications.comm_type!==3">
           <el-col :span="20">
             <el-form-item label="" prop="modeObservation" style="width: 200px">
               <div style="display: flex;align-items: center">
                 <span>命令设置</span>
-                <el-button type="primary" plain style="margin-left: 10px">设置命令</el-button>
+<!--                <el-button type="primary" plain style="margin-left: 10px">设置命令</el-button>-->
               </div>
             </el-form-item>
             <!-- 表格主体 -->
             <div class="table-box" style="width:920px;">
-            <el-table stripe ref="tableRef" :border="true" :data="processTableData"  size="small">
+            <el-table stripe ref="tableRef" :border="true" :data="processTableData"  size="small" height="150">
               <template v-for="item in columns" :key="item">
                 <el-table-column v-bind="item" :align="item.align ?? 'left'" :reserve-selection="item.type == 'selection'" :show-overflow-tooltip="true">
-                  <template #default="scope"></template>
                 </el-table-column>
               </template>
 
@@ -474,23 +483,9 @@ function updateSelectedItems(newSelectedItems: number[]) {
 
 const allTime = ref(false)
 
-const processTableData = ref([
-  {
-    id: "681913747276782417",
-    a: "FZSJ",
-    b: "FZSJ",
-    c: "观测数据",
-    d: "1分钟",
-  }
-]);
 
-// 表格配置项
-const columns = reactive<ColumnProps[]>([
-  { prop: "a", label: "命令名称"},
-  { prop: "b", label: "命令标识符"},
-  { prop: "c", label: "命令类型" },
-  { prop: "d", label: "间隔时间(分钟)"}
-]);
+
+
 
 const pageable = ref<any>({
   asCode: props.selectData.as_code,
@@ -498,15 +493,49 @@ const pageable = ref<any>({
   pageSize: 20,
 });
 
-const primaryCommunications = ref();
-const fromCommunication = ref();
+const primaryCommunications = ref({});
+const fromCommunication = ref({});
+const isFromCommunication =ref(false)
+const ip = ref()
+const port =ref()
 
 const getYascommList= async ()=> {
   const {data} = await getYascomm(pageable.value);
   const averageList = data[props.selectData.as_code]
-  console.log(averageList)
+  if(averageList!=undefined){
+    primaryCommunications.value = averageList.find(station => station.comm_level === 0);
+    console.log("=====================")
+    console.log(primaryCommunications.value)
+    if (primaryCommunications.value.comm_type===4){
+      if(primaryCommunications.value.comm_param){
+        const params = primaryCommunications.value.comm_param.split(',');
+        if (params.length === 2) {
+          ip.value= params[0].trim(),
+          port.value= params[1].trim()
+
+        }
+      }
+
+    }
+
+
+
+
+    fromCommunication.value = averageList.find(station => station.comm_level === 0);
+    isFromCommunication.value = fromCommunication.value.user_able === 1? true:false
+  }
 }
 
+const processTableData = ref([]);
+
+// 表格配置项
+const columns = reactive<ColumnProps[]>([
+  { prop: "a", label: "命令名称"},
+  { prop: "b", label: "命令标识符"},
+  { prop: "c", label: "命令类型" },
+  { prop: "d", label: "间隔时间(分钟)"}
+]);
+
 onMounted(() => {
   const observe_time = props.selectData.observe_time
   if (observe_time) {

src/views/system/stations/components/threshold.vue

@@ -184,6 +184,9 @@ const getList= async ()=>{
 const getYasaverageList= async ()=>{
   const { data } = await getYasaverage(pageable.value);
  const averageList = data[props.selectData.as_code]
+  if(averageList===undefined){
+    return;
+  }
   //温湿度设置
   const as_wd = averageList.as_wd_list
   const as_sd = averageList.as_sd_list
@@ -205,6 +208,10 @@ const getYasaverageList= async ()=>{
 const getYasthresholdList= async ()=>{
   const { data } = await getYasthreshold(pageable.value);
   voltageHigh.value = data[props.selectData.as_code]
+  if(voltageHigh.value===undefined){
+    return;
+  }
+  console.log(voltageHigh.value)
   //云底高度设置
   as_h_yun.value = voltageHigh.value.as_h_yun
   as_z_yun.value = voltageHigh.value.as_z_yun