320

src/views/echart/optimize_monitor.vue

@@ -18,7 +18,7 @@ import { RouterView, RouterLink } from "vue-router"
 import { request, uploadFile } from "@/utils/request"
 import { ElMessage, ElButton, ElDialog, ElSelect } from "element-plus"
 import * as echarts from "echarts"
-let vars = ref(['变量1','变量2'])
+let vars = ref([])
 let vals = ref([])
 let series = ref([
   
@@ -160,16 +160,6 @@ const getsockechart = (data) => {
   console.log("曲线数据", data);
   curvedata.value = data;
 
-  // 如果是第一次传入数据，则初始化为空数组；否则保留之前的数据
-  if (!xdata.value) {
-    xdata.value = [];
-  }
-
-  // 如果是第一次传入数据，则初始化series为空数组；否则保留之前的数据
-  if (!series.value) {
-    series.value = [];
-  }
-
   let rows = curvedata.value;
 
   // 获取变量名
@@ -472,6 +462,18 @@ const linechart = () => {
       },
       
     },
+    dataZoom: [
+      {
+        type: "inside", // 鼠标滚轮缩放
+        xAxisIndex: [0], // 针对 X 轴
+      },
+      {
+        type: "slider", // 滑动条缩放
+        xAxisIndex: [0],
+        
+        show: false,
+      }
+    ],
     series: series.value
   }
   option.value && myChart.setOption(option.value)

src/views/echart/process-monitor1.vue

@@ -18,21 +18,12 @@ import { RouterView, RouterLink } from "vue-router"
 import { request, uploadFile } from "@/utils/request"
 import { ElMessage, ElButton, ElDialog, ElSelect } from "element-plus"
 import * as echarts from "echarts"
-let vars = ref(['变量1','变量2'])
+let vars = ref([])
 let vals = ref([])
 let series = ref([
-  {
-    name: "变量1",
-    type: "line",
-    data: [10, 20, 30, 40] // y轴对应数据
-  },
-  {
-    name: "变量2",
-    type: "line",
-    data: [20, 10, 40, 30] // y轴对应数据
-  }
+  
 ])
-let xdata = ref(['-0.25','0.00','0.25','0.50','0.75','1.00'])
+let xdata = ref([])
 let chartContainer = ref()
 let myChart
 let chartDom = ref()
@@ -67,77 +58,175 @@ const echatinit = () => {
   xdata.value = []
 }
 // 从websocket取数据
+// const getsockechart = (data) => {
+//   curvedata.value = data
+//   series.value = []
+//   let rows = curvedata.value
+//   for (let i = 0; i < rows.length; i++) {
+//     vars.value = rows[i].vars.split(",")
+//     vals.value = rows[i].vals.split(" ")
+//     let data = vals.value.map((str) => Number(str))
+//     convergeDate.value.push(data)
+//     xdata.value.push(rows[i].step)
+//   }
+//   for (let j = 0; j < vars.value.length; j++) {
+//     let firstColumn = convergeDate.value.map((row) => row[j])
+//     let item = {
+//       name: vars.value[j],
+//       type: "line",
+//       stack: "Total",
+//       data: firstColumn
+//     }
+//     series.value.push(item)
+//   }
+//   myChart.setOption({
+//     legend: {
+//       data: vars.value
+//     },
+//     xAxis: {
+//       data: xdata.value
+//     },
+//     series: series.value
+//   })
+//   // linechart();
+// }
+
 const getsockechart = (data) => {
-  curvedata.value = data
-  series.value = []
-  let rows = curvedata.value
-  for (let i = 0; i < rows.length; i++) {
-    vars.value = rows[i].vars.split(",")
-    vals.value = rows[i].vals.split(" ")
-    let data = vals.value.map((str) => Number(str))
-    convergeDate.value.push(data)
-    xdata.value.push(rows[i].step)
-  }
-  for (let j = 0; j < vars.value.length; j++) {
-    let firstColumn = convergeDate.value.map((row) => row[j])
-    let item = {
-      name: vars.value[j],
+  console.log("曲线数据1：", data);
+
+  curvedata.value = data;
+  
+  let rows = curvedata.value;
+
+  vars = rows[0].vars.split(" ");
+  vals = rows[0].vals.split(" ");
+
+  console.log("vars:", vars);
+  console.log("vals:", vals);
+
+  xdata.value.push(parseFloat(vals[0]));
+
+  let existingSeries = series.value.find((s) => s.name === vars[1]);
+
+  if (existingSeries) {
+    existingSeries.data.push([parseFloat(vals[0]), parseFloat(vals[1])]);
+  } else {
+    series.value.push({
+      name: vars[1],
       type: "line",
-      stack: "Total",
-      data: firstColumn
-    }
-    series.value.push(item)
+      showSymbol: false,
+      data: [[parseFloat(vals[0]), parseFloat(vals[1])]], 
+    });
   }
+
   myChart.setOption({
     legend: {
-      data: vars.value
+      data: [vars[1]],  // 图例数据
     },
     xAxis: {
-      data: xdata.value
+      type: "value",  
+      min: 0,         
+      max: 1,       
     },
-    series: series.value
-  })
-  // linechart();
-}
+    yAxis: {
+      type: "value"  // Y 轴也是数值轴
+    },
+    series: series.value  
+  });
+
+  console.log("更新后的 xdata1:", xdata.value);
+  console.log("更新后的 series1:", series.value);
+};
 
 // 数据转化废弃
+// const getshuju = (data) => {
+//   curvedata.value = data
+//   convergeDate.value = []
+//   series.value = []
+//   xdata.value = []
+//   let rows = JSON.parse(curvedata.value)
+//   let num = 0
+//   for (let i = 0; i < rows.length; i++) {
+//     num += 1
+//     vars.value = rows[i].vars.split(",")
+//     vals.value = rows[i].vals.split(" ")
+//     let data = vals.value.map((str) => Number(str))
+//     convergeDate.value.push(data)
+//     xdata.value.push(num)
+//   }
+//   console.log(convergeDate.value)
+//   // console.log( convergeDate.value);
+//   for (let j = 0; j < vars.value.length; j++) {
+//     let firstColumn = convergeDate.value.map((row) => row[j])
+//     let item = {
+//       name: vars.value[j],
+//       type: "line",
+//       stack: "Total",
+//       data: firstColumn
+//     }
+//     series.value.push(item)
+//   }
+//   myChart.setOption({
+//     legend: {
+//       data: vars.value
+//     },
+//     xAxis: {
+//       data: xdata.value
+//     },
+//     series: series.value
+//   })
+// }
+
 const getshuju = (data) => {
-  curvedata.value = data
-  convergeDate.value = []
-  series.value = []
-  xdata.value = []
-  let rows = JSON.parse(curvedata.value)
-  let num = 0
+  // console.log("曲线数据1：", data);
+
+  curvedata.value = data;
+  convergeDate.value = [];
+  series.value = [];
+  xdata.value = [];
+  
+  // 解析传入的 JSON 数据
+  let rows = JSON.parse(curvedata.value);
+
+  vars = rows[0].vars.split(" ");
+
   for (let i = 0; i < rows.length; i++) {
-    num += 1
-    vars.value = rows[i].vars.split(",")
-    vals.value = rows[i].vals.split(" ")
-    let data = vals.value.map((str) => Number(str))
-    convergeDate.value.push(data)
-    xdata.value.push(num)
-  }
-  console.log(convergeDate.value)
-  // console.log( convergeDate.value);
-  for (let j = 0; j < vars.value.length; j++) {
-    let firstColumn = convergeDate.value.map((row) => row[j])
-    let item = {
-      name: vars.value[j],
-      type: "line",
-      stack: "Total",
-      data: firstColumn
+    let vals = rows[i].vals.split(" ");
+    let existingSeries = series.value.find((s) => s.name === vars[1]);
+
+    if (existingSeries) {
+      existingSeries.data.push([parseFloat(vals[0]), parseFloat(vals[1])]);
+    } else {
+      series.value.push({
+        name: vars[1],
+        type: "line",
+        showSymbol: false,
+        data: [[parseFloat(vals[0]), parseFloat(vals[1])]], 
+      });
     }
-    series.value.push(item)
   }
+
+  console.log("vars:", vars);
+  console.log("vals:", vals);
+
   myChart.setOption({
     legend: {
-      data: vars.value
+      data: [vars[1]],  // 图例数据
     },
     xAxis: {
-      data: xdata.value
+      type: "value",  
+      min: 0,         
+      max: 1,       
     },
-    series: series.value
-  })
-}
+    yAxis: {
+      type: "value"  // Y 轴也是数值轴
+    },
+    series: series.value  
+  });
+
+  console.log("初始化后的 xdata1:", xdata.value);
+  console.log("初始化后的 series1:", series.value);
+};
 
 const linechart = () => {
   //  let chartDom = document.getElementById('line');
@@ -175,13 +264,13 @@ const linechart = () => {
       bottom: "10%",
       containLabel: true
     },
-    toolbox: {
-      feature: {
-        saveAsImage: {}
-      }
-    },
+    // toolbox: {
+    //   feature: {
+    //     saveAsImage: {}
+    //   }
+    // },
     xAxis: {
-      type: "category",
+      type: "value",
       boundaryGap: false,
       name: "x/c",
       nameGap:40,
@@ -229,6 +318,17 @@ const linechart = () => {
         show:true,
       }
     },
+    dataZoom: [
+      {
+        type: "inside", // 鼠标滚轮缩放
+        xAxisIndex: [0], // 针对 X 轴
+      },
+      {
+        type: "slider", // 滑动条缩放
+        xAxisIndex: [0],
+        show: false,
+      }
+    ],
     series: series.value
   }
   option.value && myChart.setOption(option.value)

src/views/echart/process-monitor2.vue

@@ -21,13 +21,9 @@ import * as echarts from "echarts"
 let vars = ref([])
 let vals = ref([])
 let series = ref([
-  {
-    name: "变量1",
-    type: "line",
-    data: [10, 20, 30, 40] // y轴对应数据
-  }
+  
 ])
-let xdata = ref(['-0.25','0.00','0.25','0.50','0.75','1.00'])
+let xdata = ref([])
 let chartContainer = ref()
 let myChart
 let chartDom = ref()
@@ -62,77 +58,176 @@ const echatinit = () => {
   xdata.value = []
 }
 // 从websocket取数据
+// const getsockechart = (data) => {
+//   curvedata.value = data
+//   series.value = []
+//   let rows = curvedata.value
+//   for (let i = 0; i < rows.length; i++) {
+//     vars.value = rows[i].vars.split(",")
+//     vals.value = rows[i].vals.split(" ")
+//     let data = vals.value.map((str) => Number(str))
+//     convergeDate.value.push(data)
+//     xdata.value.push(rows[i].step)
+//   }
+//   for (let j = 0; j < vars.value.length; j++) {
+//     let firstColumn = convergeDate.value.map((row) => row[j])
+//     let item = {
+//       name: vars.value[j],
+//       type: "line",
+//       stack: "Total",
+//       data: firstColumn
+//     }
+//     series.value.push(item)
+//   }
+//   myChart.setOption({
+//     legend: {
+//       data: vars.value
+//     },
+//     xAxis: {
+//       data: xdata.value
+//     },
+//     series: series.value
+//   })
+//   // linechart();
+// }
+
 const getsockechart = (data) => {
-  curvedata.value = data
-  series.value = []
-  let rows = curvedata.value
-  for (let i = 0; i < rows.length; i++) {
-    vars.value = rows[i].vars.split(",")
-    vals.value = rows[i].vals.split(" ")
-    let data = vals.value.map((str) => Number(str))
-    convergeDate.value.push(data)
-    xdata.value.push(rows[i].step)
-  }
-  for (let j = 0; j < vars.value.length; j++) {
-    let firstColumn = convergeDate.value.map((row) => row[j])
-    let item = {
-      name: vars.value[j],
+  console.log("曲线数据2：", data);
+
+  curvedata.value = data;
+  
+  let rows = curvedata.value;
+
+  vars = rows[0].vars.split(" ");
+  vals = rows[0].vals.split(" ");
+
+  console.log("vars:", vars);
+  console.log("vals:", vals);
+
+  xdata.value.push(parseFloat(vals[0]));
+
+  let existingSeries = series.value.find((s) => s.name === vars[1]);
+
+  if (existingSeries) {
+    existingSeries.data.push([parseFloat(vals[0]), -1*parseFloat(vals[1])]);
+  } else {
+    series.value.push({
+      name: vars[1],
       type: "line",
-      stack: "Total",
-      data: firstColumn
-    }
-    series.value.push(item)
+      showSymbol: false,
+      data: [[parseFloat(vals[0]), -1*parseFloat(vals[1])]], 
+    });
   }
+
   myChart.setOption({
     legend: {
-      data: vars.value
+      data: [vars[1]],  // 图例数据
     },
     xAxis: {
-      data: xdata.value
+      type: "value",  
+      min: 0,         
+      max: 1,
+      name: "x/c",   
     },
-    series: series.value
-  })
-  // linechart();
-}
+    yAxis: {
+      type: "value"  // Y 轴也是数值轴
+    },
+    series: series.value  
+  });
+
+  console.log("更新后的 xdata2:", xdata.value);
+  console.log("更新后的 series2:", series.value);
+};
 
 // 数据转化废弃
+// const getshuju = (data) => {
+//   curvedata.value = data
+//   convergeDate.value = []
+//   series.value = []
+//   xdata.value = []
+//   let rows = JSON.parse(curvedata.value)
+//   let num = 0
+//   for (let i = 0; i < rows.length; i++) {
+//     num += 1
+//     vars.value = rows[i].vars.split(",")
+//     vals.value = rows[i].vals.split(" ")
+//     let data = vals.value.map((str) => Number(str))
+//     convergeDate.value.push(data)
+//     xdata.value.push(num)
+//   }
+//   console.log(convergeDate.value)
+//   // console.log( convergeDate.value);
+//   for (let j = 0; j < vars.value.length; j++) {
+//     let firstColumn = convergeDate.value.map((row) => row[j])
+//     let item = {
+//       name: vars.value[j],
+//       type: "line",
+//       stack: "Total",
+//       data: firstColumn
+//     }
+//     series.value.push(item)
+//   }
+//   myChart.setOption({
+//     legend: {
+//       data: vars.value
+//     },
+//     xAxis: {
+//       data: xdata.value
+//     },
+//     series: series.value
+//   })
+// }
+
 const getshuju = (data) => {
-  curvedata.value = data
-  convergeDate.value = []
-  series.value = []
-  xdata.value = []
-  let rows = JSON.parse(curvedata.value)
-  let num = 0
+  // console.log("曲线数据2：", data);
+
+  curvedata.value = data;
+  convergeDate.value = [];
+  series.value = [];
+  xdata.value = [];
+  
+  // 解析传入的 JSON 数据
+  let rows = JSON.parse(curvedata.value);
+
+  vars = rows[0].vars.split(" ");
+
   for (let i = 0; i < rows.length; i++) {
-    num += 1
-    vars.value = rows[i].vars.split(",")
-    vals.value = rows[i].vals.split(" ")
-    let data = vals.value.map((str) => Number(str))
-    convergeDate.value.push(data)
-    xdata.value.push(num)
-  }
-  console.log(convergeDate.value)
-  // console.log( convergeDate.value);
-  for (let j = 0; j < vars.value.length; j++) {
-    let firstColumn = convergeDate.value.map((row) => row[j])
-    let item = {
-      name: vars.value[j],
-      type: "line",
-      stack: "Total",
-      data: firstColumn
+    let vals = rows[i].vals.split(" ");
+    let existingSeries = series.value.find((s) => s.name === vars[1]);
+
+    if (existingSeries) {
+      existingSeries.data.push([parseFloat(vals[0]), -1*parseFloat(vals[1])]);
+    } else {
+      series.value.push({
+        name: vars[1],
+        type: "line",
+        showSymbol: false,
+        data: [[parseFloat(vals[0]), -1*parseFloat(vals[1])]], 
+      });
     }
-    series.value.push(item)
   }
+
+  console.log("vars:", vars);
+  console.log("vals:", vals);
+
   myChart.setOption({
     legend: {
-      data: vars.value
+      data: [vars[1]],  // 图例数据
     },
     xAxis: {
-      data: xdata.value
+      type: "value",  
+      min: 0,         
+      max: 1,       
     },
-    series: series.value
-  })
-}
+    yAxis: {
+      type: "value"  // Y 轴也是数值轴
+    },
+    series: series.value  
+  });
+
+  console.log("初始化后的 xdata2:", xdata.value);
+  console.log("初始化后的 series2:", series.value);
+};
 
 const linechart = () => {
   //  let chartDom = document.getElementById('line');
@@ -170,13 +265,13 @@ const linechart = () => {
       bottom: "10%",
       containLabel: true
     },
-    toolbox: {
-      feature: {
-        saveAsImage: {}
-      }
-    },
+    // toolbox: {
+    //   feature: {
+    //     saveAsImage: {}
+    //   }
+    // },
     xAxis: {
-      type: "category",
+      type: "value",
       boundaryGap: false,
       name: "x/c",
       nameGap:40,
@@ -224,6 +319,17 @@ const linechart = () => {
         show:true,
       }
     },
+    dataZoom: [
+      {
+        type: "inside", // 鼠标滚轮缩放
+        xAxisIndex: [0], // 针对 X 轴
+      },
+      {
+        type: "slider", // 滑动条缩放
+        xAxisIndex: [0],
+        show: false,
+      }
+    ],
     series: series.value
   }
   option.value && myChart.setOption(option.value)

src/views/home.vue

@@ -2671,6 +2671,8 @@ const dialogbolen = () => {
       break;
     case "过程监控":
       ifjiankong()
+      curveLine2();
+      curveLine3();
       break;
     case "列表":
       echatsfunc();
@@ -2854,6 +2856,9 @@ const ifjiankong = () => {
 const runok = () => {
   if(echartshow.value){
     optmonitor1.value.echatinit();
+  }else if(echartshow2.value){
+    processMonitor1ref.value.echatinit();
+    processMonitor2ref.value.echatinit();
   }
   const params = {
     transCode: 'MDO0039',
@@ -2965,6 +2970,40 @@ const curveLine = () => {
       ElMessage.error(err.returnMsg)
     })
 }
+
+const curveLine2 = () => {
+  const params = {
+    transCode: 'MDO0021',
+    pid: pid.value,
+    type: 2,
+  }
+  request(params)
+    .then((res) => {
+      curvedata.value = JSON.stringify(res.rows);
+      // console.log(curvedata.value);
+      processMonitor1ref.value.getshuju(curvedata.value);
+    })
+    .catch((err) => {
+      ElMessage.error(err.returnMsg)
+    })
+}
+const curveLine3 = () => {
+  const params = {
+    transCode: 'MDO0021',
+    pid: pid.value,
+    type: 3,
+  }
+  request(params)
+    .then((res) => {
+      curvedata.value = JSON.stringify(res.rows);
+      // console.log(curvedata.value);
+      processMonitor2ref.value.getshuju(curvedata.value);
+    })
+    .catch((err) => {
+      ElMessage.error(err.returnMsg)
+    })
+}
+
 //进化优化器
 
 //选择颜色改变线的颜色
@@ -3707,11 +3746,11 @@ const websocketonopen = (res) => {
 };
 // Websoket接收消息事件
 const websocketonmessage = (res) => {
-  console.log('websocket接受消息:',res.data)
+  // console.log('websocket接受消息:',res.data)
   arrobj.value = [];
   if (res.data.indexOf('{') !== -1) {
     progressshow.value = true;
-    
+    console.log('websocket接受消息:',res.data)
     // 解析 WebSocket 接收到的消息数据
     let parsedData = JSON.parse(res.data);
     let step = Number(parsedData.step);
@@ -3727,8 +3766,12 @@ const websocketonmessage = (res) => {
     if(jiankong.value && parsedData.type === 1){
       console.log('列表监控')
       tablefun1(parsedData.vars, parsedData.vals);  // 传递 vars 和 vals 更新表格
-    }else if(echartshow.value){
+    }else if(echartshow.value&&parsedData.type === 1){
       optmonitor1.value.getsockechart(arrobj.value);
+    }else if(echartshow2.value&&parsedData.type === 2){
+      processMonitor1ref.value.getsockechart(arrobj.value);
+    }else if(echartshow2.value&&parsedData.type === 3){
+      processMonitor2ref.value.getsockechart(arrobj.value);
     }
     
     // optmonitor1.value.getsockechart(arrobj.value);

src/views/titlecomponent/ADflow.vue

@@ -154,6 +154,7 @@
           v-model="isairfoil"
           :suffix-icon="CaretBottom"
           placeholder="请选择"
+          @change="isairfoilChange"
         >
           <el-option
             v-for="item in isairfoilList"
@@ -430,9 +431,85 @@ let outParams = ref([
     flag: 1
   },
   {
-    code: "cm",
+    code: "cmz",
     value: "0.0",
-    name: "力矩系数Cm",
+    name: "力矩系数CmZ",
+    type: 2,
+    flag: 1
+  },
+  {
+    code: " ",
+    value: "0.0",
+    name: "体积",
+    type: 2,
+    flag: 1
+  }
+])
+
+let outParams1 = ref([
+  {
+    code: "cl",
+    value: "0.0",
+    name: "升力系数Cl",
+    type: 2,
+    flag: 1
+  },
+  {
+    code: "cd",
+    value: "0.0",
+    name: "阻力系数Cd",
+    type: 2,
+    flag: 1
+  },
+  {
+    code: "cmz",
+    value: "0.0",
+    name: "力矩系数CmZ",
+    type: 2,
+    flag: 1
+  },
+  {
+    code: " ",
+    value: "0.0",
+    name: "体积",
+    type: 2,
+    flag: 1
+  }
+])
+
+let outParams2 = ref([
+  {
+    code: "cl",
+    value: "0.0",
+    name: "升力系数Cl",
+    type: 2,
+    flag: 1
+  },
+  {
+    code: "cd",
+    value: "0.0",
+    name: "阻力系数Cd",
+    type: 2,
+    flag: 1
+  },
+  {
+    code: "cmx",
+    value: "0.0",
+    name: "力矩系数CmX",
+    type: 2,
+    flag: 1
+  },
+  {
+    code: "cmy",
+    value: "0.0",
+    name: "力矩系数CmY",
+    type: 2,
+    flag: 1
+  },
+  {
+    code: "cmz",
+    value: "0.0",
+    name: "力矩系数CmZ",
     type: 2,
     flag: 1
   },
@@ -495,6 +572,14 @@ const headerCellClassName = ({ column }) => {
   return '';
 };
 
+const isairfoilChange = (value) => {
+  if (value === 1) {
+    outParams.value = outParams1.value
+  } else {
+    outParams.value = outParams2.value
+ }
+}
+
 const convertToStringArray = (result, Data) => {
   console.log("Data:", Data)