905改

src/views/mainContent/index.vue

@@ -16,13 +16,17 @@
             <op-run :type="type" @saveAllData="projectinfochange"/>
           </div>
         </el-aside>
-        <el-main></el-main>
+        <el-main class="mid">
+          <div class="mid-1">
+            <analyze-work @changetype="handleTypeChange"/>
+          </div>
+        </el-main>
         <el-aside class="rightaside">
           <div class="right-1">
             <op-problem ref="opRef" :type="type" :opDatajson="fourData" :runtype="type"/>
           </div>
           <div class="right-2">
-            <analyze-work @changetype="handleTypeChange"/>
+            <iterative-curve />
           </div>
         </el-aside>
       </el-container>
@@ -45,6 +49,7 @@ import opAlgorithm from './leftaside/opAlgorithm.vue';
 import opRun from './leftaside/opRun.vue';
 import analyzeWork from './rightaside/analyzeWork.vue';
 import opProblem from './rightaside/opProblem.vue';
+import IterativeCurve from "./rightaside/IterativeCurve.vue";
 
 import { useProjectStore } from '@/store/project'
 import { useValOptionsStore } from '@/store/valoptions'
@@ -298,6 +303,19 @@ onUnmounted(() => {
   }
 }
 
+.mid {
+  display: flex;
+  flex-direction: column;
+  justify-content: end;
+  align-items: center;
+  padding: 0;
+  overflow: hidden;
+
+  .mid-1 {
+    height: 20%;
+  }
+}
+
 .footer {
   width: 100%;
   height: 20%;

src/views/mainContent/rightaside/analyzeWork.vue

@@ -1,26 +1,22 @@
 <template>
   <!-- 分析工况 -->
-  <div style="height: 100%;">
-    <el-card class="custom-card">
-      <template #header>
-        <span>分析工况</span>
-      </template>
-      <el-space style="height: 100%;">
-        <div v-for="item in btninfo">
-          <el-button
-            :key="item.name"
-            class="work-btn"
-            @click="handleWorkClick(item)"
-          >
-            <img
-              :src="selectedWork === item.name ? item.highlightImg : item.img"
-              alt="work icon"
-            />
-            <!-- {{ item.name }} -->
-          </el-button>
-        </div>
-      </el-space>
-    </el-card>
+  <div class="container">
+    <el-space style="width: 80%;height: 100%;">
+      <div v-for="item in btninfo">
+        <el-button
+          :key="item.name"
+          class="work-btn"
+          @click="handleWorkClick(item)"
+        >
+          <img
+            :src="selectedWork === item.name ? item.highlightImg : item.img"
+            alt="work icon"
+          />
+          <!-- {{ item.name }} -->
+        </el-button>
+      </div>
+    </el-space>
+    
   </div>
 </template>
 
@@ -53,16 +49,26 @@ const handleWorkClick = (item) => {
 </script>
 
 <style scoped>
+.container {
+  width: 100%;
+  height: 100%;
+
+  display: flex;
+  justify-content: center;
+}
+
+
 .work-btn {
   width: 100%;
   height: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;
-  justify-content: center;
+  justify-content: space-around;
 
   background-color: transparent !important;
   border: none;
+
 }
 
 </style>

src/views/mainContent/rightaside/iterativeCurve.vue

@@ -0,0 +1,16 @@
+<template>
+  <!-- 分析工况 -->
+  <div style="height: 100%;">
+    <el-card class="custom-card">
+      <template #header>
+        <span>迭代曲线</span>
+      </template>
+      
+    </el-card>
+  </div>
+</template>
+
+<script setup>
+
+
+</script>