refactor(router):路由更新

admin/src/main/resources/mapper/hnyzdcs/EquipmentParamMapper.xml

@@ -31,6 +31,7 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
         <result property="ipAddress"    column="ip_address"    />
         <result property="port"    column="port"    />
         <result property="protocolId"    column="protocol_id"    />
+        <result property="unitId" column="unit_id"/>
     </resultMap>
 
     <resultMap id="EquipmentFormResultMap" type="com.dcs.hnyz.domain.vo.EquipmentParamFormVO" extends="EquipmentParamResult">

ui/src/router/index.js

@@ -60,7 +60,7 @@ export const constantRoutes = [
   {
     path: '',
     component: Layout,
-    redirect: '/flowSelect/m1',//重定向到首页
+    redirect: '/index',//重定向到首页
     children: [
       {
         path: '/index',
@@ -197,7 +197,12 @@ export const constantRoutes = [
     path:'/IronAlloy',//铁合金
     component: () => import('@/views/hnyzConfiguratePage/IronAlloy/index'),
     name: 'IronAlloy',
-  }
+  },
+  {
+    path:'/mgm',//铁合金
+    component: () => import('@/views/hnyzConfiguratePage/MGM/index'),
+    name: 'MGM',
+  },
 ]
 
 // 动态路由，基于用户权限动态去加载

ui/src/views/hnyzConfiguratePage/MGM/index.vue

@@ -4,18 +4,20 @@
         <div class="content_page">
             <!-- 左侧操作栏 -->
             <div class="left_operation">
-                <el-button type="primary" @click="closeAllValves">关闭所有阀门</el-button>
+                <el-switch v-model="isControl" class="mb-2" active-text="控制" inactive-text="展示" />
+                <!-- <el-button type="primary" @click="closeAllValves">关闭所有阀门</el-button>
                 <el-button type="primary" @click="filterProcess">过滤流程</el-button>
                 <el-button type="primary" @click="blowProcess">吹扫流程</el-button>
                 <el-button type="primary" @click="blockingOutProcess">反吹排堵流程</el-button>
-                <el-button type="primary" @click="slagDiachargeProcess">排渣流程</el-button>
+                <el-button type="primary" @click="slagDiachargeProcess">排渣流程</el-button> -->
             </div>
             <!-- 阀门 -->
             <div class="valves">
                 <component v-for="item in deviceConfigGroup.VALVES" :key="item.id" :is="getComponentName(item.modelId)"
                     :title="getEquipmentTitle(item.equipmentName)"
                     :valveStatusArr="getValveStatusArr(item.equipmentName)" :rotateAngle="item.rotate || 0"
-                    :iconSize="item.size" :style="getComponentStyle(item)" />
+                    :iconSize="item.size" :style="getComponentStyle(item)"
+                    @click="clickValves(item.equipmentId, item.code)" />
             </div>
 
             <!-- 罐体 -->
@@ -28,61 +30,17 @@
             <!-- 传感器 -->
             <div class="sensors">
                 <component v-for="item in deviceConfigGroup.SENSORS" :key="item.id" :is="getComponentName(item.modelId)"
-                    :sensorValue="sensorHelper.getDataArrByCode(item.code)[0]" :sensorWidth="item.width"
+                    :sensorValue="sensorHelper.getDataArrByCode(item.code)" :sensorWidth="item.width"
                     :sensorHeight="item.height" :sensorSize="item.size" :style="getComponentStyle(item)" />
             </div>
-            <!-- 外部管道排布 -->
-            <div class="outer_progress">
-                <Pipe :pipeStatus="getValveAndStatus('FM1')" class="progress_steam progress_pos1" />
-                <Pipe :pipeStatus="getValveAndStatus('FM2')" class="progress_steam progress_pos2" />
-                <Pipe :pipeStatus="getValveAndStatus('FM3')" class="progress_steam progress_pos3" />
-                <Pipe :pipeStatus="getValveAndStatus('FM9')" class="progress_steam progress_pos4 rotate_270" />
-                <Pipe :pipeStatus="getValveOrStatus('FM1', 'FM9')" class="progress_steam progress_pos5" />
-                <Pipe :pipeStatus="getValveAndStatus('FM9')" class="progress_steam progress_pos6" />
-                <Pipe :pipeStatus="getValveAndStatus('FM7') && getValveOrStatus('FM4', 'FM5', 'FM6')"
-                    class="progress_steam progress_pos7" :style="getPipeRotateStyle2(180)" />
-                <Pipe
-                    :pipeStatus="getValveAndStatus('FM7') && getValveOrStatus('FM4', 'FM5', 'FM6') && !getValveOrStatus('FM9')"
-                    class="progress_steam progress_pos8" />
-                <Pipe :pipeStatus="getValveAndStatus('FM8') && getValveOrStatus('FM4', 'FM5', 'FM6')"
-                    class="progress_steam progress_pos9" />
-                <Pipe :pipeStatus="getValveAndStatus('FM6', 'FM8') || getValveAndStatus('FM6', 'FM7')"
-                    class="progress_steam progress_pos10" :style="getPipeRotateStyle2(180)" />
-                <Pipe :pipeStatus="getValveAndStatus('FM5', 'FM8') || getValveAndStatus('FM5', 'FM7')"
-                    class="progress_steam progress_pos11" :style="getPipeRotateStyle2(180)" />
-                <Pipe :pipeStatus="getValveAndStatus('FM4', 'FM8') || getValveAndStatus('FM4', 'FM7')"
-                    class="progress_steam progress_pos12" :style="getPipeRotateStyle2(180)" />
-                <Pipe :pipeStatus="getValveAndStatus('FM6', 'FM8') || getValveAndStatus('FM6', 'FM7')"
-                    class="progress_steam progress_pos13" :style="getPipeRotateStyle2(90)" />
-                <Pipe :pipeStatus="getValveAndStatus('FM5', 'FM8') || getValveAndStatus('FM5', 'FM7')"
-                    class="progress_steam progress_pos14" :style="getPipeRotateStyle2(90)" />
-                <Pipe :pipeStatus="getValveAndStatus('FM4', 'FM8') || getValveAndStatus('FM4', 'FM7')"
-                    class="progress_steam progress_pos15" :style="getPipeRotateStyle2(90)" />
-                <Pipe :pipeStatus="getValveAndStatus('FM11')" class="progress_materials progress_pos16 rotate_90" />
-                <Pipe :pipeStatus="getValveAndStatus('FM7') && getValveOrStatus('FM4', 'FM5', 'FM6')"
-                    class="progress_steam progress_pos17_1" :style="getPipeRotateStyle(90)" />
-                <Pipe
-                    :pipeStatus="getValveAndStatus('FM6', 'FM8') || getValveAndStatus('FM4', 'FM7') || getValveAndStatus('FM5', 'FM7')"
-                    class="progress_steam progress_pos17_2" :style="getPipeRotateStyle(90)" />
-                <Pipe
-                    :pipeStatus="getValveAndStatus('FM7', 'FM4') || getValveAndStatus('FM5', 'FM8') || getValveAndStatus('FM6', 'FM8')"
-                    class="progress_steam progress_pos17_3" :style="getPipeRotateStyle(90)" />
-                <Pipe :pipeStatus="getValveAndStatus('FM8') && getValveOrStatus('FM4', 'FM5', 'FM6')"
-                    class="progress_steam progress_pos17_4 rotate_90" />
-                <Pipe :pipeStatus="getValveAndStatus('FM10')" class="progress_steam progress_pos18 rotate_270" />
-                <Pipe :pipeStatus="getValveAndStatus('FM9')" class="progress_steam progress_pos19 rotate_90" />
 
+            <!-- 管道  -->
+            <div class="pipelines">
+                <component v-for="item in pipeConfig" :key="item.id" :is="getComponentName(item.modelId)"
+                    :pipeStatus="evaluateCondition(item.flowCondition)" :strokeWidth="item.pipeWidth"
+                    :style="getPipelineStyle(item, evaluateCondition(item.reverseCondition))"
+                    :class="getPipelineClass(item.pipeClass, getPipeType(item.dynamicPipelineCondition))" />
             </div>
-
-            <!-- 其他图标 -->
-            <div class="icon_others">
-
-            </div>
-            <!-- 外部组件 -->
-            <div class="outer_components">
-
-            </div>
-
             <!-- 大箭头指向 -->
             <div class="arrows">
                 <Arrow flexDir="row" :iconFirst="false" arrowDir="right" arrowText="进气口" class="arrow_pos1" />
@@ -99,24 +57,24 @@
 </template>
 
 <script setup>
-import Pipe from '@/components/HnyzDcs/PipeComponent.vue';
 import Arrow from '@/components/HnyzDcs/ArrowComponent.vue';
 import { useValveHelper } from '@/hooks/useValveHelper'
-import { useRouter } from 'vue-router'
 import { computed, onMounted, onBeforeUnmount, reactive } from 'vue';
 import { stompClient } from '@/utils/ws/stompClient';
 import { updateZTPageConfig } from '@/api/dcs/configurePage';
-
+import { setCoil } from '@/api/dcs/flowControl';
+import { getMainSetParam } from '@/api/hnyz/param'
 import { openInfoElNotification } from '@/utils/message'
 import { useEquipmentLayout } from '@/hooks/useEquipmentLayout'
 import { useComponentHelper } from '@/hooks/useComponentHelper'
-const router = useRouter()
 
 const pageCode = 'MGM';
 const flowId = 9;//当前页面流程Id
 
-// 获取设备布局 & 数据订阅
+// 获取设备布局
+// 获取设备布局 
 const {
+    pipeConfig,//管道配置信息
     deviceConfigGroup,//设备配置分组
     modelMap,//设备模型映射
     pageParams,//页面参数
@@ -128,7 +86,9 @@ const {
     getComponentName,
     getComponentStyle,
     getIconClass,
-    getEquipmentTitle
+    getEquipmentTitle,
+    getPipelineClass,
+    getPipelineStyle,
 } = useComponentHelper(modelMap)
 
 
@@ -191,6 +151,18 @@ const valveArr = [
 ]
 //传感器状态
 const sensorArr = [
+    {
+        code: 'PT1001',
+        value: [0.66]
+    },
+    {
+        code: 'PT1002',
+        value: [1]
+    },
+    {
+        code: 'PT1003',
+        value: [1]
+    },
 ]
 
 
@@ -216,9 +188,29 @@ function updatePageConfig() {
         });
 }
 // const pumpHelper = useValveHelper(computed(() => deviceDataGroup.PUMPS))
-const { getValveStatusArr, getValveAndStatus, getValveOrStatus } = useValveHelper(computed(() => deviceDataGroup.VALVES))
+const { getValveStatusArr, getValveAndStatus, getValveOrStatus, evaluateCondition, getPipeType } = useValveHelper(computed(() => deviceDataGroup.VALVES))
 const sensorHelper = useValveHelper(computed(() => deviceDataGroup.SENSORS))
 
+const isControl = ref(false)
+
+function clickValves(equipmentId, code) {
+    if (isControl.value) {
+        getMainSetParam(equipmentId).then(res => {
+            const registerData = res.data
+            console.log('获取设备参数成功：', registerData)
+            setCoil({
+                dataArr: [!getValveStatusArr(code)[0]],
+                startAddress: registerData.address,
+                unitId: registerData.unitId,
+                ipAddress: '127.0.0.1',
+                port: '22502',
+            })
+        }).catch(err => {
+            console.log('获取设备参数失败：', err);
+        });
+
+    }
+}
 // 工具函数：sleep
 function sleep(ms) {
     return new Promise(resolve => setTimeout(resolve, ms));
@@ -399,6 +391,10 @@ function getPipeRotateStyle2(defaultDeg) {
             top: 2%;
             left: 2%;
 
+            :deep(.el-switch__label) {
+                color: #fff;
+            }
+
         }
 
         .arrows {
@@ -444,178 +440,6 @@ function getPipeRotateStyle2(defaultDeg) {
                 left: 47.3%;
             }
 
-
-        }
-
-
-        //外部管道排布
-        .outer_progress {
-            .progress_pos1 {
-                position: absolute;
-                top: 46.5%;
-                left: 30%;
-                width: 15%;
-            }
-
-            .progress_pos2 {
-                position: absolute;
-                top: 60.5%;
-                left: 30%;
-                width: 15%;
-            }
-
-            .progress_pos3 {
-                position: absolute;
-                top: 60.5%;
-                left: 54%;
-                width: 15%;
-            }
-
-            .progress_pos4 {
-                position: absolute;
-                top: 27.1%;
-                left: 30.2%;
-                width: 20.7%;
-            }
-
-            .progress_pos4_2 {
-                position: absolute;
-                top: 43.3%;
-                left: 87.5%;
-                width: 18%;
-            }
-
-
-
-            .progress_pos5 {
-                position: absolute;
-                top: 46.5%;
-                left: 25%;
-                width: 5.2%;
-            }
-
-            .progress_pos6 {
-                position: absolute;
-                top: 7.2%;
-                left: 30.1%;
-                width: 44%;
-            }
-
-
-            .progress_pos7 {
-                position: absolute;
-                top: 13.5%;
-                left: 65%;
-                width: 9%;
-            }
-
-            .progress_pos8 {
-                position: absolute;
-                top: 13.5%;
-                left: 74%;
-                width: 9%;
-            }
-
-            .progress_pos9 {
-                position: absolute;
-                top: 45.5%;
-                left: 65%;
-                width: 20%;
-            }
-
-            .progress_pos10 {
-                position: absolute;
-                top: 21.5%;
-                left: 53%;
-                width: 12%;
-            }
-
-
-
-            .progress_pos11 {
-                position: absolute;
-                top: 28.5%;
-                left: 54%;
-                width: 11%;
-            }
-
-            .progress_pos12 {
-                position: absolute;
-                top: 35.5%;
-                left: 55%;
-                width: 10%;
-            }
-
-            .progress_pos13 {
-                position: absolute;
-                top: 31.3%;
-                left: 53%;
-                width: 10%;
-            }
-
-            .progress_pos14 {
-                position: absolute;
-                top: 35.3%;
-                left: 54%;
-                width: 7%;
-            }
-
-            .progress_pos15 {
-                position: absolute;
-                top: 40.3%;
-                left: 55%;
-                width: 5%;
-            }
-
-            .progress_pos16 {
-                position: absolute;
-                top: 87%;
-                left: 49.95%;
-                width: 12%;
-            }
-
-            .progress_pos17_1 {
-                position: absolute;
-                top: 18%;
-                left: 64.95%;
-                width: 4.5%;
-            }
-
-            .progress_pos17_2 {
-                position: absolute;
-                top: 25.4%;
-                left: 64.95%;
-                width: 4%;
-            }
-
-            .progress_pos17_3 {
-                position: absolute;
-                top: 32.4%;
-                left: 64.95%;
-                width: 4%;
-            }
-
-            .progress_pos17_4 {
-                position: absolute;
-                top: 41%;
-                left: 64.95%;
-                width: 5.5%;
-            }
-
-            .progress_pos18 {
-                position: absolute;
-                top: 36%;
-                left: 45.2%;
-                width: 12%;
-            }
-
-            .progress_pos19 {
-                position: absolute;
-                top: 10.6%;
-                left: 73.95%;
-                width: 3.5%;
-            }
-
         }
 
     }