620运行

src/store/project.js

@@ -3,6 +3,7 @@ import { ref } from 'vue'
 
 export const useProjectStore = defineStore('project', () => {
   const pid = ref('');
+  const runtype = ref("");
 
   const projectInfo = ref(null);
   // 项目信息
@@ -14,14 +15,21 @@ export const useProjectStore = defineStore('project', () => {
     pid.value = val
   }
 
+  const setruntype = (val) => {
+    runtype.value = val
+  }
+
   const clearproject = () => {
     pid.value = ''
     projectInfo.value = null; // 清除项目信息
+    runtype.value = ""; // 清除运行类型
   }
   
   return {
     pid,
     setpid,
+    runtype,
+    setruntype,
     clearproject,
     projectInfo,
     setProjectInfo,

src/style/index.css

@@ -305,3 +305,8 @@ img{
 .el-textarea__inner {
   height: 100%;
 }
+
+.spaceclass {
+  display: flex;
+  justify-items: flex-start;
+}

src/views/file/index.vue

@@ -26,7 +26,7 @@
 <script setup>
 import { RouterView, RouterLink,useRouter } from "vue-router"
 import { useI18n } from 'vue-i18n'
-
+import { useProjectStore } from "@/stores/projectStore"
 
 
 import tempic from "@/assets/img/temp.png"
@@ -35,6 +35,8 @@ import exit from "@/assets/img/exit.png"
 const { t, locale } = useI18n()
 const router = useRouter();
 
+const projectStore = useProjectStore()
+
 
 const filemenuitems = ref([
   { index: '1', img: tempic, label: 'Back' },
@@ -48,6 +50,7 @@ const filemenuitems = ref([
 
 
 const exittop = () => {
+  projectStore.clearproject();
   router.push({path:'/'})
 }
 

src/views/model/dialog/RunDialog.vue

@@ -0,0 +1,85 @@
+<template>
+  <!-- 运行弹窗 -->
+  <el-dialog
+    v-model="visible"
+    align-center
+    :append-to-body="true"
+    width="700"
+    class="dialog_class"
+    draggable
+  >
+    <template #header="{ titleId, titleClass }">
+      <div class="my-header">
+        <h4 :id="titleId" :class="titleClass">实时仿真</h4>
+      </div>
+    </template>
+    <div class="dialog-content">
+      <div :size="spacesize" class="spaceclass">
+        <el-button class="custom-icon-button" @click="runProject">
+          <img :src="run" style="width: 24px" />
+        </el-button>
+        <el-button class="custom-icon-button">
+          <img :src="stop" style="width: 24px" />
+        </el-button>
+      </div>
+      <div class="echarts-container">
+        <EchartLine />
+      </div>
+    </div>
+    
+
+    
+  </el-dialog>
+</template>
+
+<script setup>
+import { request, getImage } from "@/utils/request"
+import { ElMessage } from "element-plus"
+import run from "@/assets/img/run.png"
+import stop from "@/assets/img/stop.png"
+
+import EchartLine from "../echarts/EchartLine.vue"
+
+const visible = ref(false)
+let spacesize = ref(10)
+
+function openDialog() {
+  visible.value = true
+}
+
+function closeDialog() {
+  visible.value = false
+}
+
+const runProject = () => {
+  const params = {
+    transCode: "ES0013",
+    pid: pid.value
+  }
+  request(params)
+    .then((res) => {
+      ElMessage.success("开始运行")
+    })
+    .catch((err) => {
+      ElMessage.error(err.returnMsg)
+    })
+}
+
+
+
+// 暴露给父组件
+defineExpose({ openDialog, closeDialog })
+</script>
+
+<style scoped>
+.dialog-content {
+  display: flex;
+  flex-direction: column;
+}
+
+.echarts-container {
+  width: 100%;
+  height: 400px;
+}
+
+</style>

src/views/model/echarts/EchartLine.vue

@@ -0,0 +1,96 @@
+<template>
+  <!-- 折线图 -->
+  <div style="width: 100%; height: 100%">
+    <div id="line" ref="chartContainer" style="width: 100%; height: 100%"></div>
+  </div>
+</template>
+<script setup>
+import * as echarts from "echarts"
+
+const chartContainer = ref(null)
+let chartInstance = null
+
+// 使用 dataset：二维数组，第一行为表头
+const datasetSource = ref([["Time", "value"]])
+
+const initChart = () => {
+  if (!chartContainer.value) return
+
+  chartInstance = echarts.init(chartContainer.value)
+
+  const option = {
+    tooltip: { trigger: "axis" },
+    legend: {},
+    dataset: { source: datasetSource.value },
+
+    xAxis:
+      datasetSource.value.length <= 1
+        ? {
+            type: "category",
+            name: "Time",
+            data: ["1", "2", "3", "4", "5"],
+            splitNumber: 5
+          }
+        : {
+            type: "category",
+            name: "Time"
+            // 自动使用 dataset 的第一列作为类目轴
+          },
+
+    yAxis:
+      datasetSource.value.length <= 1
+        ? {
+            type: "value",
+            name: "Value",
+            min: 0,
+            max: 100,
+            splitNumber: 5
+          }
+        : {
+            type: "value",
+            name: "Value",
+          },
+
+    series: datasetSource.value[0]
+      .slice(1) // 跳过第一列（x轴列名）
+      .map((name) => ({
+        type: "line",
+        name, // 设置图例名称
+        smooth: true // 平滑曲线
+      }))
+  }
+
+  chartInstance.setOption(option)
+}
+
+watch(datasetSource, () => {
+  if (chartInstance) {
+    chartInstance.setOption({
+      dataset: {
+        source: datasetSource.value
+      }
+    })
+  }
+})
+
+onMounted(() => {
+  nextTick(() => {
+    initChart()
+    window.addEventListener("resize", resizeChart)
+  })
+})
+
+onBeforeUnmount(() => {
+  if (chartInstance) {
+    chartInstance.dispose()
+    chartInstance = null
+  }
+  window.removeEventListener("resize", resizeChart)
+})
+
+const resizeChart = () => {
+  chartInstance?.resize()
+}
+</script>
+<style scoped>
+</style>

src/views/model/index.vue

@@ -193,6 +193,8 @@
 
     <!-- 模拟数据弹窗 -->
     <SLDataDialog ref="SLdatadialogref" @selectRunType="handleSelectRunType" />
+    <!-- 运行弹窗 -->
+    <RunDialog ref="RunDialogRef" />
 
   </el-container>
 </template>
@@ -222,6 +224,7 @@ import {
 } from "@element-plus/icons-vue"
 import changebak from "./vueflow/changebak.vue"
 import SLDataDialog from "./dialog/SLDataDialog.vue"
+import RunDialog from "./dialog/RunDialog.vue"
 import { useVueFlow } from "@vue-flow/core"
 
 const { zoomIn, zoomOut, fitView } = useVueFlow()
@@ -253,6 +256,7 @@ const activities = ref([])
 const jobId = ref()
 
 const SLdatadialogref = ref(null)
+const RunDialogRef = ref(null)
 
 const headerbuttons = ref([
   { type: "button", img: "newproject.png", name: "temp" },
@@ -365,18 +369,20 @@ const btnfunc = (name) => {
       return
     }else if(runtype.value === 'Incompressible Transient'){
       // 处理不可压缩瞬态的逻辑
-
+      RunDialogRef.value?.openDialog?.()
     }else if(runtype.value === 'Incompressible Steady State'){
       // 处理不可压缩稳态的逻辑
+      runProject();
     }else if(runtype.value === 'Compressible Transient'){
       // 处理可压缩瞬态的逻辑
     }else if(runtype.value === 'Compressible Steady State'){
       // 处理可压缩稳态的逻辑
+      runProject();
     }else{
       ElMessage.error("未知的模拟类型")
       return
     }
-    runProject()
+    
   } else if (name === "SLdata") {
     nextTick(() => {
       SLdatadialogref.value?.openDialog?.(pid.value)
@@ -400,6 +406,7 @@ const runProject = () => {
 
 const handleSelectRunType = (type) => {
   runtype.value = type
+  projectStore.setruntype(type)
 }
 
 // 获取结果列表
@@ -576,6 +583,8 @@ const getlogs = () => {
 }
 
 onMounted(() => {
+  runtype.value = projectStore.runtype || '';
+
   getComponent()
 
   setTimeout(function () {
@@ -612,11 +621,6 @@ onMounted(() => {
   border: 1px solid #d8d8d8;
 }
 
-.spaceclass {
-  display: flex;
-  justify-items: flex-start;
-}
-
 .coms-container {
   display: flex;
   flex-wrap: wrap;