编辑测试修改

backend/src/main/java/io/metersphere/base/mapper/ext/ExtLoadTestMapper.xml

@@ -21,6 +21,9 @@
             <if test="request.projectId != null">
                 AND project.id = #{request.projectId}
             </if>
+            <if test="request.id != null">
+                AND load_test.id = #{request.id}
+            </if>
         </where>
         <if test="request.recent">
             order by load_test.update_time desc

backend/src/main/java/io/metersphere/controller/LoadTestController.java

@@ -64,6 +64,11 @@ public class LoadTestController {
         return loadTestService.edit(request, file);
     }
 
+    @GetMapping("/get/{testId}")
+    public LoadTestDTO get(@PathVariable String testId) {
+        return loadTestService.get(testId);
+    }
+
     @PostMapping("/delete")
     public void delete(@RequestBody DeleteTestPlanRequest request) {
         loadTestService.delete(request);

backend/src/main/java/io/metersphere/service/LoadTestService.java

@@ -196,4 +196,14 @@ public class LoadTestService {
         request.setRecent(true);
         return extLoadTestMapper.list(request);
     }
+
+    public LoadTestDTO get(String testId) {
+        QueryTestPlanRequest request = new QueryTestPlanRequest();
+        request.setId(testId);
+        List<LoadTestDTO> testDTOS = extLoadTestMapper.list(request);
+        if (!CollectionUtils.isEmpty(testDTOS)) {
+            return testDTOS.get(0);
+        }
+        return null;
+    }
 }

frontend/src/performance/components/router/router.js

@@ -4,7 +4,7 @@ import RouterSidebar from "./RouterSidebar";
 import Setting from "../settings/Setting";
 import Workspace from "../settings/Workspace";
 import User from "../settings/User";
-import CreateTestPlan from "../testPlan/CreateTestPlan";
+import EditTestPlan from "../testPlan/EditTestPlan";
 import AllTestPlan from "../testPlan/AllTestPlan";
 import Organization from "../settings/Organization";
 import OrganizationMember from "../settings/OrganizationMember";
@@ -74,7 +74,14 @@ const router = new VueRouter({
       path: "/createTest",
       name: "createTest",
       components: {
-        content: CreateTestPlan
+        content: EditTestPlan
+      }
+    },
+    {
+      path: "/editTest/:testId",
+      name: "editTest",
+      components: {
+        content: EditTestPlan
       },
       props: {
         content: (route) => {

frontend/src/performance/components/testPlan/AllTestPlan.vue

@@ -93,6 +93,7 @@
         pageSize: 5,
         total: 0,
         loading: false,
+        testId: null,
       }
     },
     watch: {
@@ -140,8 +141,9 @@
       },
       handleEdit(testPlan) {
         this.$router.push({
-          name: 'createTest',
+          path: '/editTest/' + testPlan.id,
           params: {
+            testId: testPlan.id,
             testPlanObj: testPlan
           }
         })

frontend/src/performance/components/testPlan/CreateTestPlan.vue → frontend/src/performance/components/testPlan/EditTestPlan.vue

 <template>
   <div class="edit-testplan-container" v-loading="result.loading">
+    <div class="main-content">
+      <el-card>
         <el-row>
           <el-col :span="10">
             <el-input placeholder="请输入名称" v-model="testPlan.name" class="input-with-select">
@@ -20,29 +22,31 @@
 
         <el-tabs v-model="active" type="border-card" :stretch="true">
           <el-tab-pane label="基础配置">
-        <test-plan-basic-config :test-plan="testPlan"/>
+            <ms-test-plan-basic-config :test-plan="testPlan"/>
           </el-tab-pane>
           <el-tab-pane label="压力配置">
-        <test-plan-pressure-config :test-plan="testPlan"/>
+            <ms-test-plan-pressure-config :test-plan="testPlan"/>
           </el-tab-pane>
           <el-tab-pane label="高级配置">
-        <test-plan-advanced-config/>
+            <ms-test-plan-advanced-config/>
           </el-tab-pane>
         </el-tabs>
+      </el-card>
+    </div>
   </div>
 </template>
 
 <script>
-  import TestPlanBasicConfig from './components/BasicConfig';
-  import TestPlanPressureConfig from './components/PressureConfig';
-  import TestPlanAdvancedConfig from './components/AdvancedConfig';
+  import MsTestPlanBasicConfig from './components/BasicConfig';
+  import MsTestPlanPressureConfig from './components/PressureConfig';
+  import MsTestPlanAdvancedConfig from './components/AdvancedConfig';
 
   export default {
-    name: "CreateTestPlan",
+    name: "MsEditTestPlan",
     components: {
-      TestPlanBasicConfig,
-      TestPlanPressureConfig,
-      TestPlanAdvancedConfig,
+      MsTestPlanBasicConfig,
+      MsTestPlanPressureConfig,
+      MsTestPlanAdvancedConfig,
     },
     props: ['testPlanObj'],
     data() {
@@ -70,10 +74,25 @@
         }]
       }
     },
+    watch: {
+      '$route'(to) {
+        window.console.log(to);
+        let testId = to.path.split('/')[2]; // find testId
+        this.$get('/testplan/get/' + testId, response => {
+          this.testPlan = response.data;
+        });
+      }
+
+    },
     created() {
-      if (this.testPlanObj) {
-        this.testPlan = this.testPlanObj;
+      let testId = this.$route.path.split('/')[2];
+      window.console.log(testId);
+      if (testId) {
+        this.$get('/testplan/get/' + testId, response => {
+          this.testPlan = response.data;
+        });
       }
+
       this.listProjects();
     },
     methods: {
@@ -185,9 +204,19 @@
 </script>
 
 <style>
-  .edit-testplan-container .el-tabs__nav {
+  .edit-testplan-container {
     float: none;
     text-align: center;
+    padding: 15px;
+    width: 100%;
+    height: 100%;
+    box-sizing: border-box;
+  }
+
+  .main-content {
+    margin: 0 auto;
+    width: 100%;
+    max-width: 1200px;
   }
 
   .edit-testplan-container .el-select .el-input {

frontend/src/performance/components/testPlan/RecentTestPlan.vue

 <template>
-  <el-menu>
+  <el-menu router menu-trigger="click" :default-active="$route.path">
     <div class="recent-text">
       <i class="el-icon-time"/>
       最近的测试
     </div>
-    <el-menu-item :key="recentTestPlan.id" v-for="recentTestPlan in recentTestPlans">
-      {{ recentTestPlan.name }}
+    <el-menu-item :key="t.id" v-for="t in recentTestPlans" :index="'/editTest/' + t.id">
+      {{ t.name }}
     </el-menu-item>
   </el-menu>
 </template>

frontend/src/performance/components/testPlan/components/AdvancedConfig.vue

@@ -11,7 +11,7 @@
 
 <script>
   export default {
-    name: "TestPlanAdvancedConfig",
+    name: "MsTestPlanAdvancedConfig",
     data() {
       return {
       }

frontend/src/performance/components/testPlan/components/BasicConfig.vue

@@ -56,7 +56,7 @@
   import {Message} from "element-ui";
 
   export default {
-    name: "TestPlanBasicConfig",
+    name: "MsTestPlanBasicConfig",
     props: ["testPlan"],
     data() {
       return {
@@ -73,8 +73,15 @@
         this.getFileMetadata(this.testPlan)
       }
     },
+    watch: {
+      testPlan() {
+        this.getFileMetadata(this.testPlan);
+      }
+    },
     methods: {
       getFileMetadata(testPlan) {
+        this.fileList = [];// 一个测试只有一个文件
+        this.tableData = [];// 一个测试只有一个文件
         this.result = this.$get(this.getFileMetadataPath + "/" + testPlan.id, response => {
           let file = response.data;
 
@@ -84,7 +91,6 @@
           }
 
           this.testPlan.file = file;
-
           this.fileList.push({
             id: file.id,
             name: file.name

frontend/src/performance/components/testPlan/components/PressureConfig.vue

@@ -92,10 +92,10 @@
 
 <script>
   export default {
-    name: "TestPlanPressureConfig",
-    props: ["testPlan"],
+    name: "MsTestPlanPressureConfig",
     data() {
       return {
+        testPlan: {},
         threadNumber: 2,
         duration: 3,
         rampUpTime: 12,
@@ -107,6 +107,11 @@
       this.testPlan.loadConfigurationObj = [];
       this.convertProperty();
     },
+    watch: {
+      testPlan() {
+        this.convertProperty();
+      }
+    },
     methods: {
       convertProperty() {
         /// todo：下面4个属性是jmeter ConcurrencyThreadGroup plugin的属性，这种硬编码不太好吧，在哪能转换这种属性？