修改

ruoyi-admin/pom.xml

@@ -101,15 +101,15 @@
             <groupId>com.ruoyi</groupId>
             <artifactId>gw-plugin-common</artifactId>
             <version>3.8.8</version>
-            <!--            <scope>system</scope>-->
-            <!--            <systemPath>${project.basedir}/libs/js-gw-plugin-common-3.8.8.jar</systemPath>-->
+            <scope>system</scope>
+            <systemPath>${project.basedir}/libs/gw-plugin-common-3.8.8.jar</systemPath>
         </dependency>
         <dependency>
             <groupId>com.ruoyi</groupId>
             <artifactId>gw-plugin-starter</artifactId>
             <version>3.8.8</version>
-            <!--            <scope>system</scope>-->
-            <!--            <systemPath>${project.basedir}/libs/gw-plugin-starter-3.8.8.jar</systemPath>-->
+            <scope>system</scope>
+            <systemPath>${project.basedir}/libs/gw-plugin-starter-3.8.8.jar</systemPath>
         </dependency>
         <dependency>
             <groupId>org.pf4j</groupId>

ruoyi-admin/src/main/java/com/ruoyi/web/controller/monitor/ServerController.java

@@ -4,17 +4,21 @@ import com.ruoyi.common.core.domain.AjaxResult;
 import com.ruoyi.framework.web.domain.Server;
 import com.ruoyi.interfaces.service.ServerMonitorService;
 import com.ruoyi.web.core.config.ServerMonitorProperties;
+import lombok.extern.slf4j.Slf4j;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.security.access.prepost.PreAuthorize;
 import org.springframework.web.bind.annotation.GetMapping;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RestController;
 
+import java.util.List;
+
 /**
  * 服务器监控
  *
  * @author ruoyi
  */
+@Slf4j
 @RestController
 @RequestMapping("/monitor/server")
 public class ServerController {
@@ -35,6 +39,8 @@ public class ServerController {
 
     @GetMapping("/list")
     public AjaxResult serverList() {
+        List<String> serverList = serverMonitorProperties.getUrls();
+        log.info("serverList:{}", serverList);
         return AjaxResult.success(serverMonitorService.getServerMonitorData(serverMonitorProperties.getUrls()));
     }
 }

ruoyi-common/pom.xml

@@ -258,6 +258,8 @@
             <groupId>com.koal</groupId>
             <artifactId>kms-sdk</artifactId>
             <version>1.4.1</version>
+            <scope>system</scope>
+            <systemPath>${project.basedir}/libs/kms-sdk-1.4.1.jar</systemPath>
         </dependency>
         <!--
                 <dependency>

ruoyi-ui/src/api/monitor/server.js

@@ -12,7 +12,8 @@ export function getServer() {
 export function getServerList() {
     return request({
         url: '/monitor/server/list',
-        method: 'get'
+        method: 'get',
+        timeout: 1000 * 180,
     })
 }
 

ruoyi-ui/src/api/standardization/model.js

@@ -0,0 +1,24 @@
+import request from '@/utils/request'
+
+/**
+ * 水量水质模型 - 方案列表
+ * @returns {*}
+ */
+export function getFanganList() {
+    return request({
+        url: '/gateway-api/SZHYB/model/getSchList?sid=84f41094-810f-410a-83a5-b9b51d1fe803',
+        method: 'get',
+    })
+}
+
+/**
+ * 水量水质模型 - 模型结果
+ * @param id 方案编码
+ * @returns {*}
+ */
+export function getFanganDataList(id) {
+    return request({
+        url: `/gateway-api/SZHYB/model/getSchById/${id}?sid=84f41094-810f-410a-83a5-b9b51d1fe803`,
+        method: 'get',
+    })
+}

ruoyi-ui/src/router/index.js

@@ -57,19 +57,19 @@ export const constantRoutes = [
         component: () => import('@/views/error/401'),
         hidden: true
     },
-    // {
-    //     path: '',
-    //     component: Layout,
-    //     redirect: '/index',
-    //     children: [
-    //         {
-    //             path: '/index',
-    //             component: () => import('@/views/index'),
-    //             name: 'Index',
-    //             meta: {title: '首页', icon: 'dashboard', affix: true}
-    //         }
-    //     ]
-    // },
+    {
+        path: '',
+        component: Layout,
+        redirect: '/datamonitor/monitorservice',
+        // children: [
+        //     {
+        //         path: '/index',
+        //         component: () => import('@/views/index'),
+        //         name: 'Index',
+        //         meta: {title: '首页', icon: 'dashboard', affix: true}
+        //     }
+        // ]
+    },
     {
         path: '/user',
         component: Layout,

ruoyi-ui/src/views/map/components/map.vue

@@ -3,55 +3,60 @@
     <!-- 苏州河 -->
     <div ref="scrollContainer" v-if="route.params.id=='28'" style="border: 2px solid #409EFF;background-color: rgba(127, 161, 215, 0.5);border-radius: 50px 50px 50px 50px;
     align-items: center;display: flex;position: absolute;z-index: 9999;bottom: 1%;left: 1%;width:50vw;height: 10vh;overflow-x:auto;overflow-y: hidden;">
-        <svg-icon icon-class="start1" v-if="!isStart" @click="reStart" style="margin-left: 10%;width: 30px;height:30px;cursor: pointer;"/>
-        <svg-icon icon-class="pause1" v-if="isStart" @click="pause" style="margin-left: 10%;width: 30px;height:30px;cursor: pointer;"/>
-        <el-slider @change="pauseIn" :format-tooltip="formatTooltip"  v-model="activities1" :max="dateLength"  :marks="marks" style="width: 80%;margin-left: 1%;"/>
-      
+      <svg-icon icon-class="start1" v-if="!isStart" @click="reStart"
+                style="margin-left: 10%;width: 30px;height:30px;cursor: pointer;"/>
+      <svg-icon icon-class="pause1" v-if="isStart" @click="pause"
+                style="margin-left: 10%;width: 30px;height:30px;cursor: pointer;"/>
+      <el-slider @change="pauseIn" :format-tooltip="formatTooltip" v-model="activities1" :max="dateLength"
+                 :marks="marks" style="width: 80%;margin-left: 1%;"/>
+
     </div>
-    <div v-if="route.params.id=='28'" style="background-color: white;position: absolute;z-index: 9999;top: 1%;left: 1%;width: 20vw;height: 45vh;overflow:auto;">
+    <div v-if="route.params.id=='28'"
+         style="background-color: white;position: absolute;z-index: 9999;top: 1%;left: 1%;width: 20vw;height: 45vh;overflow:auto;">
       <div class="biz-data-card-header">方案列表</div>
-      <el-table 
+      <el-table
           :data="tableDataFangan"
           style="width: 98%;margin-left: 1%;margin-top: 1%;height: 40vh;"
           :cell-style="{ padding:'5px' }"
           :header-cell-style="{height: heightAll*0.01+'px',}"
           :row-style="{ fontSize: '16px',textAlign:'center'}"
-          border >
-          <el-table-column type="index" label="序号" width="80">
-            <template #default="{ $index }">
-              <div style="text-align: center;">
-                {{ $index + 1 }}
-              </div>
-            </template>
-          </el-table-column>
-          <el-table-column prop="name" label="名称">
-            <template #default="scope">
-              <span style="cursor: pointer;color:#409EFF" @click="getZ(scope.row)">{{ scope.row.name }}</span>
-            </template>
-          </el-table-column>
-        </el-table>
+          border>
+        <el-table-column type="index" label="序号" width="80">
+          <template #default="{ $index }">
+            <div style="text-align: center;">
+              {{ $index + 1 }}
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="name" label="名称">
+          <template #default="scope">
+            <span style="cursor: pointer;color:#409EFF" @click="getZ(scope.row)">{{ scope.row.name }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
     </div>
-    <div v-if="route.params.id=='28'" style="background-color: white;position: absolute;z-index: 9999;top: 1%;right: 1%;width: 30vw;height: 85vh;overflow:auto;">
+    <div v-if="route.params.id=='28'"
+         style="background-color: white;position: absolute;z-index: 9999;top: 1%;right: 1%;width: 30vw;height: 85vh;overflow:auto;">
       <div class="biz-data-card-header">水位信息</div>
-      <el-table 
+      <el-table
           :data="tableData"
           style="width: 98%;margin-left: 1%;margin-top: 1%;height: 80vh;"
           :cell-style="{ padding:'5px' }"
           :header-cell-style="{height: heightAll*0.01+'px',}"
           :row-style="{ fontSize: '16px',textAlign:'center'}"
-          border >
-          <el-table-column type="index" label="序号" width="80">
-            <template #default="{ $index }">
-              <div style="text-align: center;">
-                {{ $index + 1 }}
-              </div>
-            </template>
-          </el-table-column>
-          <el-table-column prop="name" label="站名"  width="200">
-          </el-table-column>
-          <el-table-column prop="z" label="水位"  width=""/>
-          <el-table-column prop="time" label="时间"  width="210"/>
-        </el-table>
+          border>
+        <el-table-column type="index" label="序号" width="80">
+          <template #default="{ $index }">
+            <div style="text-align: center;">
+              {{ $index + 1 }}
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="name" label="站名" width="200">
+        </el-table-column>
+        <el-table-column prop="z" label="水位" width=""/>
+        <el-table-column prop="time" label="时间" width="210"/>
+      </el-table>
     </div>
     <!-- 温带风暴潮 -->
     <div ref="scrollContainer" v-if="route.params.id=='20'" style="border: 2px solid #409EFF;background-color: rgba(127, 161, 215, 0.5);border-radius: 50px 50px 50px 50px;
@@ -173,6 +178,7 @@ import {getStromlist,getStromdataList,getStromdatade} from "@/api/standardizatio
 const dialogVisibleFengbao = ref(false)
 const titleFengbao = ref('')
 const tableDataFangan = ref([])
+const fanganId = ref(null)
 const scrollContainer = ref(null);
 const scrollAmount =0;
 const widthAll = ref(window.innerWidth)
@@ -197,62 +203,68 @@ onMounted(async () => {
     polygonLayer.value = createPolygonLayer(jsonDatak5)
     mapChart.value.addLayer(polygonLayer.value);
   }
-  if(route.params.id==='28'){
-    tableDataFangan.value = fangan.data.records
-    const keys = Object.keys(suzhouJson.data.outPutQUZ)
-    dateLength.value = keys.length-1
-    keys.forEach(item=>{
-      var par = {
-        content: '',
-        timestamp: item,
-        size: 'large',
-        type: 'primary',
-      }
-      activities.value.push(par)
+  if (route.params.id === '28') {
+    getFanganList().then(res => {
+      tableDataFangan.value = res.data.records
+      fanganId.value = tableDataFangan.value[0].id
+      getFanganDataList(fanganId.value).then(res => {
+        const outPutQUZ = res.data.outPutQUZ
+        const keys = Object.keys(outPutQUZ)
+        dateLength.value = keys.length - 1
+        keys.forEach(item => {
+          let par = {
+            content: '',
+            timestamp: item,
+            size: 'large',
+            type: 'primary',
+          }
+          activities.value.push(par)
+        })
+        var parTime = uniformSample(activities.value)
+        console.log(activities.value)
+        var a = Math.round((dateLength.value - 1) * 1 / 3)
+        var b = Math.round((dateLength.value - 1) * 2 / 3)
+        var c = dateLength.value
+        marks.value = {
+          0: {
+            style: {
+              color: '#1989FA',
+            },
+            label: parTime[0].timestamp.slice(5),
+          },
+        }
+        marks.value[a] = {
+          style: {
+            color: '#1989FA',
+          },
+          label: parTime[1].timestamp.slice(5),
+        }
+        marks.value[b] = {
+          style: {
+            color: '#1989FA',
+          },
+          label: parTime[2].timestamp.slice(5),
+        }
+        marks.value[c] = {
+          style: {
+            color: '#1989FA',
+          },
+          label: parTime[3].timestamp.slice(5),
+        }
+        suzhouJson.data.inputParam = JSON.parse(suzhouJson.data.inputParam)
+        console.log(suzhouJson.data)
+        timerId = setInterval(changeMap, 1000)
+        pointLayer.value = createPointlayer(suzhouPoint)
+        mapChart.value.addLayer(pointLayer.value);
+      })
     })
-    var parTime = uniformSample(activities.value)
-    console.log(activities.value)
-    var a = Math.round((dateLength.value - 1) * 1 / 3)
-    var b = Math.round((dateLength.value - 1) * 2 / 3)
-    var c = dateLength.value
-    marks.value = {
-      0:{
-        style: {
-          color: '#1989FA',
-        },
-        label: parTime[0].timestamp.slice(5),
-      },
-    }
-    marks.value[a] = {
-      style: {
-        color: '#1989FA',
-      },
-      label: parTime[1].timestamp.slice(5),
-    }
-    marks.value[b] = {
-      style: {
-        color: '#1989FA',
-      },
-      label: parTime[2].timestamp.slice(5),
-    }
-    marks.value[c] = {
-      style: {
-        color: '#1989FA',
-      },
-      label: parTime[3].timestamp.slice(5),
-    }
-    suzhouJson.data.inputParam = JSON.parse(suzhouJson.data.inputParam)
-    console.log(suzhouJson.data)
-    timerId = setInterval(changeMap, 1000)
-    pointLayer.value = createPointlayer(suzhouPoint)
-    mapChart.value.addLayer(pointLayer.value);
   }
   if(route.params.id==='20'){
     tableDataFangan.value = fangan.data.records
     wendai()
   }
   if (props.config) {
-    // toCenter(props.config.center, props.config.zoom);
+    toCenter(props.config.center, props.config.zoom);
     await loadLayers(props.config.layers);
   }
 });
@@ -270,10 +282,10 @@ function initChart(x,y,mdName,id,color,danwei){
         trigger: 'axis'
     },
     grid: {
-      left: '5%', 
-      right: '5%',  
-      bottom: '15%', 
-      top: '18%',     
+      left: '5%',
+      right: '5%',
+      bottom: '15%',
+      top: '18%',
       containLabel: true
     },
     xAxis: {
@@ -542,7 +554,7 @@ function changeMap(){
   }
   pointLayer.value = createPointlayer(suzhouPoint)
   mapChart.value.addLayer(pointLayer.value);
-  // if(count.value%10===0&&count.value!==0){ 
+  // if(count.value%10===0&&count.value!==0){
   //   scrollContainer.value.scrollLeft += scrollAmount + widthAll.value;
   // }
   
@@ -776,7 +788,7 @@ const initMap = () => {
       maxZoom: 16,
       projection: 'EPSG:4326',
     }),
-    layers: [vecLayer, cvaLayer],
+    layers: [vecLayer,], // cvaLayer
     controls: defaultControls({
       zoom: false,//不显示放大放小按钮
       rotate: false,//不显示指北针控件

ruoyi-ui/src/views/map/index.vue

@@ -305,7 +305,231 @@ const maps = {
         }
       },
     ]
-  }
+  },
+  "29": {
+    zoom: 11,
+    center: [121.52720881780915, 31.297834087410234],
+    layers: [
+      {
+        id: 'weather-stations',
+        type: 'vector', // 指定为矢量图层
+        name: '行政区划面图层',
+        source: {
+          type: 'api', // 数据源类型为API
+          url: 'http://localhost:8081/sh_data_platform/service/api/service/api/fxt/getPlanGridMaxWaterDepth?client_id=a8f4f426a8684caf8a63051385aa1836&planId=34046&includeGeom=true&pageNumber=2&pageSize=1000',
+          method: 'GET',
+          responseResolution: "$.result",
+          // 定义数据映射规则
+          mapping: {
+            // 指定哪些字段包含几何信息（经度、纬度）
+            geometry: {
+              type: 'MultiPolygon', // 几何类型
+              coordinates: {
+                geometry: 'geometry', // 接口中的经度字段名
+              }
+            },
+            textField: 'gridName',
+            // 定义要保留的属性字段
+            properties: {
+              '名称': 'gridName',     // 目标属性名: 源数据字段名
+              '地区': 'district',
+              '所属村镇': 'town',
+              '预报最大水深': 'maxWaterDepth',
+              '预报最大水深时间': 'maxWaterDepthTime',
+            }
+          },
+          // 轮询更新（可选）
+          refreshInterval: 30000 // 30秒刷新一次
+        },
+        visible: true,
+        zIndex: 1000,
+        style: {
+          multipolygon: {
+            rules: [
+              // {
+              //   condition: {
+              //     property: '预报最大水深',
+              //     operator: '<',
+              //     value: 0.05,
+              //   },
+              //   style: {
+              //     fill: {color: '#ebf1fc'}
+              //   }
+              // },
+              // {
+              //   condition: {
+              //     property: '预报最大水深',
+              //     operator: '<',
+              //     value: 0.10,
+              //   },
+              //   style: {
+              //     fill: {color: '#d7e2f8'}
+              //   }
+              // },
+              {
+                condition: {
+                  property: '预报最大水深',
+                  operator: '<',
+                  value: 0.15,
+                },
+                style: {
+                  fill: {color: '#739ae8'},
+                  stroke: {color: '#376FDE', width: 2}
+                }
+              },
+              // {
+              //   condition: {
+              //     property: '预报最大水深',
+              //     operator: '<',
+              //     value: 0.2,
+              //   },
+              //   style: {
+              //     fill: {color: '#9bb7ef'}
+              //   }
+              // },
+              // {
+              //   condition: {
+              //     property: '预报最大水深',
+              //     operator: '<',
+              //     value: 0.25,
+              //   },
+              //   style: {
+              //     fill: {color: '#739ae8'}
+              //   }
+              // },
+              {
+                condition: {
+                  property: '预报最大水深',
+                  operator: '<',
+                  value: 0.30,
+                },
+                style: {
+                  fill: {color: '#376FDE'},
+                  stroke: {color: '#0066ff', width: 2}
+                }
+              },
+              {
+                condition: {
+                  property: '预报最大水深',
+                  operator: '<',
+                  value: 0.35,
+                },
+                style: {
+                  fill: {color: '#f6e2ba'},
+                  stroke: {color: '#eabc5f', width: 2}
+                }
+              },
+              {
+                condition: {
+                  property: '预报最大水深',
+                  operator: '<',
+                  value: 0.4,
+                },
+                style: {
+                  fill: {color: '#eabc5f'},
+                   stroke: {color: '#E19F1A', width: 2}
+                }
+              },
+              {
+                condition: {
+                  property: '预报最大水深',
+                  operator: '<',
+                  value: 0.45,
+                },
+                style: {
+                  fill: {color: '#E19F1A'},
+                  stroke: {color: '#b47f15', width: 2}
+                }
+              },
+              {
+                condition: {
+                  property: '预报最大水深',
+                  operator: '<',
+                  value: 0.50,
+                },
+                style: {
+                  fill: {color: '#b47f15'}
+                }
+              },
+              {
+                condition: {
+                  property: '预报最大水深',
+                  operator: '<',
+                  value: 0.6,
+                },
+                style: {
+                  fill: {color: '#ffdbdc'}
+                }
+              },
+              {
+                condition: {
+                  property: '预报最大水深',
+                  operator: '<',
+                  value: 0.7,
+                },
+                style: {
+                  fill: {color: '#ffcaca'}
+                }
+              },
+              {
+                condition: {
+                  property: '预报最大水深',
+                  operator: '<',
+                  value: 0.8,
+                },
+                style: {
+                  fill: {color: '#ffa6a7'}
+                }
+              },
+              {
+                condition: {
+                  property: '预报最大水深',
+                  operator: '<',
+                  value: 0.9,
+                },
+                style: {
+                  fill: {color: '#ff8284'}
+                }
+              },
+              {
+                condition: {
+                  property: '预报最大水深',
+                  operator: '<',
+                  value: 1,
+                },
+                style: {
+                  fill: {color: '#FF4D4F'}
+                }
+              },
+              {
+                condition: {
+                  property: '预报最大水深',
+                  operator: '>=',
+                  value: 1,
+                },
+                style: {
+                  fill: {color: '#cc3e3f'}
+                }
+              },
+            ],
+          }
+        },
+        events: {
+          click: {
+            action: 'popup',           // 点击触发弹窗
+            popupConfig: {
+              // 弹窗模板ID
+              template: 'FLOOD_GRID_POPUP',
+              offset: [0, -20]
+            }
+          },
+          // hover: {
+          //   action: 'highlight'       // 悬停高亮
+          // }
+        }
+      },
+    ]
+  },
 }
 
 function getBizDataConfigList() {

ruoyi-ui/src/views/map/utils/styleParser.js

@@ -27,18 +27,26 @@ export function createDynamicStyle(styleConfig) {
 
 // 支持条件样式规则
 function evaluateStyleRules(styleConfig, properties, resolution, geometryType) {
-    const style = {...styleConfig[geometryType.toLowerCase()]};
-
-    // 处理条件样式
-    if (style.rules) {
-        style.rules.forEach(rule => {
-            if (evaluateCondition(rule.condition, properties, resolution)) {
-                Object.assign(style, rule.style);
-            }
-        });
+    const baseStyle = {...styleConfig[geometryType.toLowerCase()]};
+
+    // 移除rules，保留基础样式
+    const { rules, ...baseStyleWithoutRules } = baseStyle;
+
+    // 如果没有规则，直接返回基础样式
+    if (!rules || !rules.length) {
+        return baseStyleWithoutRules;
     }
 
-    return style;
+    for (const rule of rules) {
+        if (evaluateCondition(rule.condition, properties, resolution)) {
+            // 合并基础样式和匹配的规则样式
+            return {
+                ...baseStyleWithoutRules,
+                ...rule.style
+            };
+        }
+    }
+    return baseStyleWithoutRules;
 }
 
 // 条件评估函数

ruoyi-ui/vite.config.js

@@ -52,6 +52,11 @@ export default defineConfig(({mode, command}) => {
                     changeOrigin: true,
                     rewrite: (p) => p.replace(/^\/sh-api/, '')
                 },
+                '/gateway-api': {
+                    target: 'http://localhost:8081',
+                    changeOrigin: true,
+                    rewrite: (p) => p.replace(/^\/gateway-api/, '')
+                },
                 // '/service_api': {
                 //     target: 'http://localhost:8081',
                 //     changeOrigin: true,