From 293407919a9b4ff991677b07813931a2dffadf68 Mon Sep 17 00:00:00 2001
From: limengnan <420004014@qq.com>
Date: Tue, 20 Jan 2026 09:36:41 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E8=AE=A1=E7=AE=97=E7=BB=93?=
 =?UTF-8?q?=E6=9E=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/antvx6/changesettings.vue  |   7 -
 .../src/components/antvx6/echartsModel.vue    |   2 +-
 .../src/components/antvx6/tableModel.vue      |   2 +-
 .../src/views/component/scenario/index.vue    | 226 +++++++++++++-----
 business-css/frontend/vite.config.ts          |   2 +-
 5 files changed, 168 insertions(+), 71 deletions(-)

diff --git a/business-css/frontend/src/components/antvx6/changesettings.vue b/business-css/frontend/src/components/antvx6/changesettings.vue
index 1ff3255..4da9b32 100644
--- a/business-css/frontend/src/components/antvx6/changesettings.vue
+++ b/business-css/frontend/src/components/antvx6/changesettings.vue
@@ -56,13 +56,6 @@ if(deviceTypetype.value == ''){
       deviceList.value = res.data;
     }
   })
-// topologyDevicesLsit(params).then((result:any) => {
-//   deviceList.value = result.records;
-// }).catch((err) => {
-
-// });
-
-
 }
 
 
diff --git a/business-css/frontend/src/components/antvx6/echartsModel.vue b/business-css/frontend/src/components/antvx6/echartsModel.vue
index 09e625e..a5b6d9a 100644
--- a/business-css/frontend/src/components/antvx6/echartsModel.vue
+++ b/business-css/frontend/src/components/antvx6/echartsModel.vue
@@ -1,6 +1,6 @@
 <!--  线 + 柱混合图 -->
 <template>
-  <div id="chartContainer" :class="className"  style="height: calc(100vh - 200px); width: 1360px;" />
+  <div id="chartContainer" :class="className"  style="height: calc(100vh - 200px); width: 100%;" />
 </template>
 
 <script setup lang="ts">
diff --git a/business-css/frontend/src/components/antvx6/tableModel.vue b/business-css/frontend/src/components/antvx6/tableModel.vue
index 72adcfc..6891c3e 100644
--- a/business-css/frontend/src/components/antvx6/tableModel.vue
+++ b/business-css/frontend/src/components/antvx6/tableModel.vue
@@ -76,7 +76,7 @@ onMounted(() => {
 
 <template>
   <div class="editdevice-box">
-      <el-table  :data="scenarioResultData" style="width: 100%; height: calc(100vh - 260px);margin-bottom: 10px;" border
+      <el-table  :data="scenarioResultData" style="width: 100%; height: calc(100vh - 275px);margin-bottom: 10px;" border
         :header-cell-style="{ background: 'rgb(250 250 250)', color: '#383838', height: '50px' }">
         <el-table-column type="selection" width="50" align="center"></el-table-column>
         <el-table-column prop="step" label="时间" width="100"></el-table-column>
diff --git a/business-css/frontend/src/views/component/scenario/index.vue b/business-css/frontend/src/views/component/scenario/index.vue
index d4d4cf8..5724ac6 100644
--- a/business-css/frontend/src/views/component/scenario/index.vue
+++ b/business-css/frontend/src/views/component/scenario/index.vue
@@ -15,6 +15,9 @@ import Page from '@/components/Pagination/page.vue'
 import { getDictItemById } from '@/api/dict';
 import Createscenario from '@/views/component/scenario/createscenario.vue'
 import { eventsBatchSave } from '@/api/business/event';
+import { topologyDevicesLsit } from '@/api/business/project';
+import TableModels from '@/components/antvx6/tableModel.vue';
+import EchartsModels from '@/components/antvx6/echartsModel.vue';
 const webUrl = import.meta.env.VITE_APP_BASE_HTTP; // 基础路径
 const algorithmTypeData: any = ref([]); // 算法类型数据
 const stepsActive = ref(0); // 步骤导航栏当前激活的步骤索引
@@ -85,60 +88,6 @@ function addClick() {
 }
 
 const isSwitch = ref(false); // 事故情景id
-//新建事故情景-确认按钮/修改按钮
-function confirmClick(formEl: any) {
-  console.log(info.value)
-  formEl.validate((valid: any) => {
-    if (valid) {
-
-      if (!info.value.scenarioId) {
-        const params = {
-          projectId: props.projectInfo.projectId,
-          name: info.value.name,
-          algorithmType: info.value.algorithmType,
-          description: info.value.description,
-        };
-        if(isSwitch.value == true){
-          return ;
-        }
-        isSwitch.value = true
-        addScenarios(params).then((res:any) => {
-          isSwitch.value = false;
-          if(res && res.code == 0) {
-            scenarioId.value = res.scenarioId;
-            gettableData();
-            ElMessage({
-              type: "success",
-              message: "新增成功",
-            });
-            stepsActive.value = 1;
-          } else {
-            ElMessage({
-              type: "error",
-              message: "新增失败",
-            });
-          }
-        }).catch(() => {
-          isSwitch.value = false;
-        })
-      } else if (info.value.scenarioId) {
-        const params = {
-          scenarioId: info.value.scenarioId,
-          projectId: info.value.projectId,
-          name: info.value.name,
-          algorithmType: info.value.algorithmType,
-          description: info.value.description,
-        };
-        updateScenarios(params).then((res) => {
-          gettableData();
-          dialogVisible.value = false;
-        });
-      } else {
-        return false;
-      }
-    }
-  });
-}
 
 //新建角色-取消按钮
 function handleClose() {
@@ -169,11 +118,6 @@ function departureClick(row: any,type: string) {
   scenarioId.value = row.scenarioId;
   isShowCondition.value = true;
 }
-function editClick1(row: any) {
-
-  info.value = JSON.parse(JSON.stringify(row));
-  dialogEditVisible.value = true;
-}
 
 //删除事故情景
 function delAloneClick(row: any) {
@@ -354,6 +298,51 @@ function submitConditionClick(){
   
 }
 
+function resultClick(row:any){
+  isAcitve.value = 0
+   scenarioId.value = row.scenarioId,
+  getMenuData()
+  isShowResult.value = true;
+}
+const isShowResult = ref<boolean>(false); // 是否显示结果模型
+const deviceList:any = ref([]) // 变动设备列表
+const isAcitve:any = ref(-1) // 选中项
+const deviceId:any = ref('') // 变动设备id
+function getMenuData() {
+  topologyDevicesLsit({
+    id: props.projectInfo.projectId
+  }).then((res:any) => {
+    if (res.code == 0) {
+      deviceList.value = res.data;
+      deviceId.value = res.data[0].deviceId
+    }
+  })
+}
+// const title = ref<string>('') // 标题
+function handleClick(item:any, index:any){
+  // formulaInfo.value.correlation =  JSON.parse(JSON.stringify(item.deviceName))
+  isAcitve.value = index
+
+  deviceId.value = ""
+  setTimeout(() => {
+    deviceId.value = item.deviceId
+  }, 
+  200);
+}
+function handleResultClose(){ // 关闭结果模型
+  isShowResult.value = false;
+}
+const isEchartsModel = ref<boolean>(false) // 是否显示echarts模型
+
+function changeShowResult(isShow:boolean){ // 切换显示结果模型
+  isEchartsModel.value = isShow
+  let tempId = deviceId.value
+  deviceId.value = ''
+  setTimeout(() => {
+    deviceId.value = tempId
+  }, 
+  200);
+}
 </script>
 
 <template>
@@ -414,7 +403,7 @@ function submitConditionClick(){
               <img  src="@/assets/table/moni_disabled.png" alt="" title="查看始发事件" v-if="scope.row.status != 0">
 
               <img  src="@/assets/table/result.png" alt="" title="计算结果" v-if="scope.row.status == 2"
-                @click="editClick1(scope.row)" style="cursor: pointer; ">
+                @click="resultClick(scope.row)" style="cursor: pointer; ">
               <img  src="@/assets/table/result_disabled.png" alt="" title="计算结果" v-if="scope.row.status != 2">
             
               <img  src="@/assets/table/del.png" alt="" title="删除"
@@ -461,6 +450,34 @@ function submitConditionClick(){
          <el-button  @click="handleScenarioClose">取消</el-button> 
         <el-button  type="primary" @click="submitConditionClick" v-if="title == '初始条件设置'">确定</el-button> 
       </div>
+    </el-dialog>
+
+
+    <el-dialog v-model="isShowResult" :close-on-click-modal="false"
+    :modal="false" draggable :before-close="handleResultClose" :title="title"
+      append-to-body width="calc(100% - 100px)" class="resultmodel-dialog-box">
+      <div style="display: flex;">
+        <div class="choiceMateria-left">
+          <div class="choiceMateria-left-title">设备列表</div>
+          <div style="height: calc(100% - 70px);overflow: auto;margin-top: 10px;">
+            <div v-for="(item, index) in deviceList" :key="index" class="choiceMateria-left-item"
+              :class="{'choiceMateria-item-active': index == isAcitve}"
+              @click="handleClick(item, index)">
+              {{ item.deviceName }}
+            </div>
+          </div>
+        </div>
+        <div style="padding-left: 45px;padding-top: 40px;  width: calc(100% - 290px);    height: calc(100vh - 100px);">
+          <div style="display: flex; margin-bottom: 20px; border-bottom: 1px solid #e5e5e5;padding-bottom: 5px;">
+            <div @click="changeShowResult(false)" class="adddevice_navigation_left" :class="{'adddevice_navigation_activeleft':!isEchartsModel}">列表</div>
+            <div @click="changeShowResult(true)" class="adddevice_navigation_right" :class="{'adddevice_navigation_activeright':isEchartsModel}">图形</div>
+          </div>
+
+          <TableModels  v-if="isShowResult && isEchartsModel == false && deviceId !=''" :deviceId="deviceId" :scenarioId="scenarioId"/>
+          <EchartsModels  v-if="isShowResult && isEchartsModel == true && deviceId !=''" :deviceId="deviceId" :scenarioId="scenarioId"/>
+        </div>
+
+      </div>
       
     </el-dialog>
 
@@ -634,4 +651,91 @@ function submitConditionClick(){
   align-items: center;
 }
 
-</style>
\ No newline at end of file
+.choiceMateria-left{
+  width: 240px;
+  height: calc(100vh - 200px);
+  border-right: 1px solid rgba(240, 240, 240, 1);
+  box-sizing: border-box;
+}
+.choiceMateria-left-title{
+  width: 240px;
+  height: 44px;
+  line-height: 44px;
+  font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
+  font-weight: 700;
+  font-style: normal;
+  font-size: 14px;
+  color: #1B1B1B;
+  padding-left: 16px;
+  border-bottom: 1px solid rgba(240, 240, 240, 1);
+}
+.choiceMateria-left-item{
+    width: 100%;
+    height: 40px;
+    line-height: 40px;
+    padding-left: 16px;
+    font-family: 'Arial Normal', 'Arial';
+    font-weight: 400;
+    font-style: normal;
+    font-size: 14px;
+    color: #333333;
+    cursor: pointer;
+}
+.choiceMateria-left-item:hover{
+  background-color: #f5f8ff;
+}
+.choiceMateria-item-active{
+    background-color: #f5f8ff;
+    color: #266fff;
+}
+
+
+
+
+.adddevice_navigation_left{
+  width: 110px;
+  height: 32px;
+  line-height: 32px;
+  text-align: center;
+  cursor: pointer;
+  font-family: 'Arial Normal', 'Arial';
+  font-weight: 400;
+  font-style: normal;
+  font-size: 14px;
+  color: #363636;
+  background-image: url('@/assets/x6/navleft.png');
+}
+.adddevice_navigation_left:hover{
+  color: #266fff ;
+}
+.adddevice_navigation_activeleft{
+  background-image: url('@/assets/x6/navleft_active.png');
+  color: #fff !important;
+}
+.adddevice_navigation_right{
+   width: 110px;
+  height: 32px;
+  line-height: 32px;
+  text-align: center;
+  cursor: pointer;
+  font-family: 'Arial Normal', 'Arial';
+  font-weight: 400;
+  font-style: normal;
+  font-size: 14px;
+  color: #363636;
+  background-image: url('@/assets/x6/navright.png');
+}
+.adddevice_navigation_right:hover{
+  color: #266fff ;
+}
+.adddevice_navigation_activeright{
+  background-image: url('@/assets/x6/navright_active.png');
+  color: #fff !important;
+}
+</style>
+
+<style>
+.resultmodel-dialog-box.el-dialog .el-dialog__body{
+  padding: 0 !important;
+}
+</style>
diff --git a/business-css/frontend/vite.config.ts b/business-css/frontend/vite.config.ts
index fe7de1f..5df1cfe 100644
--- a/business-css/frontend/vite.config.ts
+++ b/business-css/frontend/vite.config.ts
@@ -25,7 +25,7 @@ export default ({ mode }: ConfigEnv): UserConfig => {
       proxy: {
         [env.VITE_APP_BASE_API]: {
           // 线上API地址
-          //target: 'http://192.168.1.20:8090/',
+          // target: 'http://192.168.1.166:8090/',
           // 本地API地址
            target: 'http://localhost:8090',
           changeOrigin: true,