From 5424f9b505414bb9ca2f9382f0a81aaa19afc1c9 Mon Sep 17 00:00:00 2001
From: chenjianxing <jianxing.chen@fit2cloud.com>
Date: Tue, 25 Aug 2020 17:31:32 +0800
Subject: [PATCH 1/2] =?UTF-8?q?fix(=E6=8E=A5=E5=8F=A3=E6=B5=8B=E8=AF=95):?=
 =?UTF-8?q?=20=E5=89=8D=E7=BD=AE=E8=84=9A=E6=9C=AC=E7=A6=81=E7=94=A8?=
 =?UTF-8?q?=E8=8E=B7=E5=8F=96=E5=93=8D=E5=BA=94=E4=BB=A3=E7=A0=81=E6=A8=A1?=
 =?UTF-8?q?=E7=89=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../processor/BeanShellProcessor.vue          | 19 +++++++++++++------
 .../components/request/ApiHttpRequestForm.vue |  2 +-
 .../components/track/common/NodeTree.vue      |  1 -
 3 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/frontend/src/business/components/api/test/components/processor/BeanShellProcessor.vue b/frontend/src/business/components/api/test/components/processor/BeanShellProcessor.vue
index a15fc33513..6e1882c092 100644
--- a/frontend/src/business/components/api/test/components/processor/BeanShellProcessor.vue
+++ b/frontend/src/business/components/api/test/components/processor/BeanShellProcessor.vue
@@ -7,7 +7,7 @@
       <el-col :span="4" class="script-index">
         <div class="template-title">{{$t('api_test.request.processor.code_template')}}</div>
         <div v-for="(template, index) in codeTemplates" :key="index" class="code-template">
-          <el-link @click="addTemplate(template)">{{template.title}}</el-link>
+          <el-link :disabled="template.disabled" @click="addTemplate(template)">{{template.title}}</el-link>
         </div>
         <div class="document-url">
           <el-link href="https://jmeter.apache.org/usermanual/component_reference.html#BeanShell_PostProcessor" type="primary">{{$t('commons.reference_documentation')}}</el-link>
@@ -29,23 +29,26 @@
           codeTemplates: [
             {
               title: this.$t('api_test.request.processor.code_template_get_variable'),
-              value: 'vars.get("variable_name");'
+              value: 'vars.get("variable_name");',
             },
             {
               title: this.$t('api_test.request.processor.code_template_set_variable'),
-              value: 'vars.put("variable_name", "variable_value");'
+              value: 'vars.put("variable_name", "variable_value");',
             },
             {
               title: this.$t('api_test.request.processor.code_template_get_response_header'),
-              value: 'prev.getResponseHeaders();'
+              value: 'prev.getResponseHeaders();',
+              disabled: this.isPreProcessor
             },
             {
               title: this.$t('api_test.request.processor.code_template_get_response_code'),
-              value: 'prev.getResponseCode();'
+              value: 'prev.getResponseCode();',
+              disabled: this.isPreProcessor
             },
             {
               title: this.$t('api_test.request.processor.code_template_get_response_result'),
-              value: 'prev.getResponseDataAsString();'
+              value: 'prev.getResponseDataAsString();',
+              disabled: this.isPreProcessor
             }
           ],
           isCodeEditAlive: true
@@ -61,6 +64,10 @@
         },
         beanShellProcessor: {
           type: Object,
+        },
+        isPreProcessor: {
+          type: Boolean,
+          default: false
         }
       },
       methods: {
diff --git a/frontend/src/business/components/api/test/components/request/ApiHttpRequestForm.vue b/frontend/src/business/components/api/test/components/request/ApiHttpRequestForm.vue
index c8050d0748..18c63d8c0e 100644
--- a/frontend/src/business/components/api/test/components/request/ApiHttpRequestForm.vue
+++ b/frontend/src/business/components/api/test/components/request/ApiHttpRequestForm.vue
@@ -68,7 +68,7 @@
         <ms-api-extract :is-read-only="isReadOnly" :extract="request.extract"/>
       </el-tab-pane>
       <el-tab-pane :label="$t('api_test.request.processor.pre_exec_script')" name="beanShellPreProcessor">
-        <ms-bean-shell-processor :is-read-only="isReadOnly" :bean-shell-processor="request.beanShellPreProcessor"/>
+        <ms-bean-shell-processor :is-pre-processor="true" :is-read-only="isReadOnly" :bean-shell-processor="request.beanShellPreProcessor"/>
       </el-tab-pane>
       <el-tab-pane :label="$t('api_test.request.processor.post_exec_script')" name="beanShellPostProcessor">
         <ms-bean-shell-processor :is-read-only="isReadOnly" :bean-shell-processor="request.beanShellPostProcessor"/>
diff --git a/frontend/src/business/components/track/common/NodeTree.vue b/frontend/src/business/components/track/common/NodeTree.vue
index c1762f8506..aa87b401bd 100644
--- a/frontend/src/business/components/track/common/NodeTree.vue
+++ b/frontend/src/business/components/track/common/NodeTree.vue
@@ -108,7 +108,6 @@ export default {
   methods: {
     handleDragEnd(draggingNode, dropNode, dropType, ev) {
       let param = this.buildParam(draggingNode, dropNode, dropType);
-      console.log(this.treeNodes);
       this.$post("/case/node/drag", param, () => {
         draggingNode.data.level = param.level;
         this.refreshTable();

From 20a124b593abe303b44a645492875da291179cb1 Mon Sep 17 00:00:00 2001
From: "Captain.B" <bin@fit2cloud.com>
Date: Tue, 25 Aug 2020 17:44:49 +0800
Subject: [PATCH 2/2] =?UTF-8?q?feat:=20=E4=BF=AE=E6=94=B9=E5=88=97?=
 =?UTF-8?q?=E8=A1=A8=E9=A1=B9=E5=88=B7=E6=96=B0head?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/api/test/ApiTestConfig.vue     | 549 ++++++++--------
 .../test/EditPerformanceTestPlan.vue          |   5 +
 .../track/case/components/TestCaseEdit.vue    | 585 +++++++++---------
 .../track/plan/components/TestPlanEdit.vue    | 213 +++----
 4 files changed, 685 insertions(+), 667 deletions(-)

diff --git a/frontend/src/business/components/api/test/ApiTestConfig.vue b/frontend/src/business/components/api/test/ApiTestConfig.vue
index 7ddb614cdb..84e7589d48 100644
--- a/frontend/src/business/components/api/test/ApiTestConfig.vue
+++ b/frontend/src/business/components/api/test/ApiTestConfig.vue
@@ -15,35 +15,35 @@
               </el-input>
 
               <el-button type="primary" plain :disabled="isReadOnly" @click="saveTest">
-                {{$t('commons.save')}}
+                {{ $t('commons.save') }}
               </el-button>
 
-              <el-button type="primary" plain  :disabled="isReadOnly"
+              <el-button type="primary" plain :disabled="isReadOnly"
                          @click="saveRunTest">
-                {{$t('load_test.save_and_run')}}
+                {{ $t('load_test.save_and_run') }}
               </el-button>
 
-<!--              <el-button :disabled="isReadOnly" type="primary" plain v-if="isShowRun" @click="runTest">-->
-<!--                {{$t('api_test.run')}}-->
-<!--              </el-button>-->
+              <!--              <el-button :disabled="isReadOnly" type="primary" plain v-if="isShowRun" @click="runTest">-->
+              <!--                {{$t('api_test.run')}}-->
+              <!--              </el-button>-->
 
-              <el-button :disabled="isReadOnly" type="warning" plain @click="cancel">{{$t('commons.cancel')}}
+              <el-button :disabled="isReadOnly" type="warning" plain @click="cancel">{{ $t('commons.cancel') }}
               </el-button>
 
               <el-dropdown trigger="click" @command="handleCommand">
                 <el-button class="el-dropdown-link more" icon="el-icon-more" plain/>
                 <el-dropdown-menu slot="dropdown">
                   <el-dropdown-item command="report">
-                    {{$t('api_report.title')}}
+                    {{ $t('api_report.title') }}
                   </el-dropdown-item>
                   <el-dropdown-item command="performance" :disabled="create || isReadOnly">
-                    {{$t('api_test.create_performance_test')}}
+                    {{ $t('api_test.create_performance_test') }}
                   </el-dropdown-item>
                   <el-dropdown-item command="export" :disabled="isReadOnly || create">
-                    {{$t('api_test.export_config')}}
+                    {{ $t('api_test.export_config') }}
                   </el-dropdown-item>
                   <el-dropdown-item command="import" :disabled="isReadOnly">
-                    {{$t('api_test.api_import.label')}}
+                    {{ $t('api_test.api_import.label') }}
                   </el-dropdown-item>
                 </el-dropdown-menu>
               </el-dropdown>
@@ -52,10 +52,12 @@
 
               <ms-api-report-dialog :test-id="id" ref="reportDialog"/>
 
-              <ms-schedule-config :schedule="test.schedule" :is-read-only="isReadOnly"  :save="saveCronExpression" @scheduleChange="saveSchedule" :check-open="checkScheduleEdit"/>
+              <ms-schedule-config :schedule="test.schedule" :is-read-only="isReadOnly" :save="saveCronExpression"
+                                  @scheduleChange="saveSchedule" :check-open="checkScheduleEdit"/>
             </el-row>
           </el-header>
-          <ms-api-scenario-config :debug-report-id="debugReportId" @runDebug="runDebug" :is-read-only="isReadOnly" :scenarios="test.scenarioDefinition" :project-id="test.projectId" ref="config"/>
+          <ms-api-scenario-config :debug-report-id="debugReportId" @runDebug="runDebug" :is-read-only="isReadOnly"
+                                  :scenarios="test.scenarioDefinition" :project-id="test.projectId" ref="config"/>
         </el-container>
       </el-card>
     </div>
@@ -63,274 +65,279 @@
 </template>
 
 <script>
-  import MsApiScenarioConfig from "./components/ApiScenarioConfig";
-  import {Test} from "./model/ScenarioModel"
-  import MsApiReportStatus from "../report/ApiReportStatus";
-  import MsApiReportDialog from "./ApiReportDialog";
-  import {checkoutTestManagerOrTestUser, downloadFile} from "@/common/js/utils";
-  import MsScheduleConfig from "../../common/components/MsScheduleConfig";
-  import ApiImport from "./components/import/ApiImport";
-  import {getUUID} from "../../../../common/js/utils";
+import MsApiScenarioConfig from "./components/ApiScenarioConfig";
+import {Test} from "./model/ScenarioModel"
+import MsApiReportStatus from "../report/ApiReportStatus";
+import MsApiReportDialog from "./ApiReportDialog";
+import {checkoutTestManagerOrTestUser, downloadFile} from "@/common/js/utils";
+import MsScheduleConfig from "../../common/components/MsScheduleConfig";
+import ApiImport from "./components/import/ApiImport";
+import {getUUID} from "../../../../common/js/utils";
+import {ApiEvent, LIST_CHANGE} from "@/business/components/common/head/ListEvent";
 
-  export default {
-    name: "MsApiTestConfig",
+export default {
+  name: "MsApiTestConfig",
 
-    components: {ApiImport, MsScheduleConfig, MsApiReportDialog, MsApiReportStatus, MsApiScenarioConfig},
+  components: {ApiImport, MsScheduleConfig, MsApiReportDialog, MsApiReportStatus, MsApiScenarioConfig},
 
-    props: ["id"],
+  props: ["id"],
 
-    data() {
-      return {
-        reportVisible: false,
-        create: false,
-        result: {},
-        projects: [],
-        change: false,
-        test: new Test(),
-        isReadOnly: false,
-        debugReportId: ''
-      }
-    },
-
-    watch: {
-      '$route': 'init',
-      test: {
-        handler: function () {
-          this.change = true;
-        },
-        deep: true
-      }
-    },
-
-    methods: {
-      init() {
-        let projectId;
-
-        this.isReadOnly = !checkoutTestManagerOrTestUser();
-
-        if (this.id) {
-          this.create = false;
-          this.getTest(this.id);
-        } else {
-          this.create = true;
-          this.test = new Test();
-          if (this.$refs.config) {
-            this.$refs.config.reset();
-          }
-          // 仅创建时获取选择的项目
-          projectId = this.$store.state.common.projectId;
-        }
-        this.result = this.$get("/project/listAll", response => {
-          this.projects = response.data;
-          // 等待项目列表加载完
-          if (projectId) this.test.projectId = projectId;
-        })
-      },
-      getTest(id) {
-        this.result = this.$get("/api/get/" + id, response => {
-          if (response.data) {
-            let item = response.data;
-
-            this.test = new Test({
-              id: item.id,
-              projectId: item.projectId,
-              name: item.name,
-              status: item.status,
-              scenarioDefinition: JSON.parse(item.scenarioDefinition),
-              schedule: item.schedule ? item.schedule : {},
-            });
-            this.$refs.config.reset();
-          }
-        });
-      },
-      save(callback) {
-        let validator = this.test.isValid();
-        if (!validator.isValid) {
-          this.$warning(this.$t(validator.info));
-          return;
-        }
-        this.change = false;
-        let bodyFiles = this.getBodyUploadFiles();
-        let url = this.create ? "/api/create" : "/api/update";
-        let jmx = this.test.toJMX();
-        let blob = new Blob([jmx.xml], {type: "application/octet-stream"});
-        let file = new File([blob], jmx.name);
-        this.result = this.$fileUpload(url, file, bodyFiles, this.test,response => {
-          if (callback) callback();
-          this.create = false;
-          this.resetBodyFile();
-        });
-      },
-      saveTest() {
-        this.save(() => {
-          this.$success(this.$t('commons.save_success'));
-          if (this.create) {
-            this.$router.push({
-              path: '/api/test/edit?id=' + this.test.id
-            })
-          }
-        })
-      },
-      runTest() {
-        this.result = this.$post("/api/run", {id: this.test.id, triggerMode: 'MANUAL'}, (response) => {
-          this.$success(this.$t('api_test.running'));
-          this.$router.push({
-            path: '/api/report/view/' + response.data
-          })
-        });
-      },
-      saveRunTest() {
-        this.change = false;
-
-        this.save(() => {
-          this.$success(this.$t('commons.save_success'));
-          this.runTest();
-        })
-      },
-      getBodyUploadFiles() {
-        let bodyUploadFiles = [];
-        this.test.bodyUploadIds = [];
-        this.test.scenarioDefinition.forEach(scenario => {
-          scenario.requests.forEach(request => {
-            if (request.body) {
-              request.body.kvs.forEach( param => {
-                if (param.files) {
-                  param.files.forEach(item => {
-                    if (item.file) {
-                      let fileId = getUUID().substring(0, 8);
-                      item.name = item.file.name;
-                      item.id = fileId;
-                      this.test.bodyUploadIds.push(fileId);
-                      bodyUploadFiles.push(item.file);
-                      // item.file = undefined;
-                    }
-                  });
-                }
-              });
-            }
-          });
-        });
-        return bodyUploadFiles;
-      },
-      resetBodyFile() {
-        //下次保存不再上传已传文件
-        this.test.scenarioDefinition.forEach(scenario => {
-          scenario.requests.forEach(request => {
-            if (request.body) {
-              request.body.kvs.forEach( param => {
-                if (param.files) {
-                  param.files.forEach(item => {
-                    if (item.file) {
-                      item.file = undefined;
-                    }
-                  });
-                }
-              });
-            }
-          });
-        });
-      },
-      cancel() {
-        this.$router.push('/api/test/list/all');
-      },
-      handleCommand(command) {
-        switch (command) {
-          case "report":
-            this.$refs.reportDialog.open();
-            break;
-          case "performance":
-            this.$store.commit('setTest', {
-              projectId: this.test.projectId,
-              name: this.test.name,
-              jmx: this.test.toJMX()
-            })
-            this.$router.push({
-              path: "/performance/test/create"
-            })
-            break;
-          case "export":
-            downloadFile(this.test.name + ".json", this.test.export());
-            break;
-          case "import":
-            this.$refs.apiImport.open();
-            break;
-        }
-      },
-      saveCronExpression(cronExpression) {
-        this.test.schedule.enable = true;
-        this.test.schedule.value = cronExpression;
-        this.saveSchedule();
-      },
-      saveSchedule() {
-        this.checkScheduleEdit();
-        let param = {};
-        param = this.test.schedule;
-        param.resourceId = this.test.id;
-        let url = '/api/schedule/create';
-        if (param.id) {
-          url = '/api/schedule/update';
-        }
-        this.$post(url, param, () => {
-          this.$success(this.$t('commons.save_success'));
-          this.getTest(this.test.id);
-        });
-      },
-      checkScheduleEdit() {
-        if (this.create) {
-          this.$message(this.$t('api_test.environment.please_save_test'));
-          return false;
-        }
-        return true;
-      },
-      runDebug(scenario) {
-        if (this.create) {
-          this.$warning(this.$t('api_test.environment.please_save_test'));
-          return;
-        }
-
-        let url = "/api/run/debug";
-        let runningTest = new Test();
-        Object.assign(runningTest, this.test);
-        runningTest.scenarioDefinition = [];
-        runningTest.scenarioDefinition.push(scenario);
-        let validator = runningTest.isValid();
-        if (!validator.isValid) {
-          this.$warning(this.$t(validator.info));
-          return;
-        }
-
-        let jmx = runningTest.toJMX();
-        let blob = new Blob([jmx.xml], {type: "application/octet-stream"});
-        let file = new File([blob], jmx.name);
-        this.$fileUpload(url, file, null, this.test,response => {
-          this.debugReportId = response.data;
-        });
-      }
-    },
-
-    created() {
-      this.init();
+  data() {
+    return {
+      reportVisible: false,
+      create: false,
+      result: {},
+      projects: [],
+      change: false,
+      test: new Test(),
+      isReadOnly: false,
+      debugReportId: ''
     }
+  },
+
+  watch: {
+    '$route': 'init',
+    test: {
+      handler: function () {
+        this.change = true;
+      },
+      deep: true
+    }
+  },
+
+  methods: {
+    init() {
+      let projectId;
+
+      this.isReadOnly = !checkoutTestManagerOrTestUser();
+
+      if (this.id) {
+        this.create = false;
+        this.getTest(this.id);
+      } else {
+        this.create = true;
+        this.test = new Test();
+        if (this.$refs.config) {
+          this.$refs.config.reset();
+        }
+        // 仅创建时获取选择的项目
+        projectId = this.$store.state.common.projectId;
+      }
+      this.result = this.$get("/project/listAll", response => {
+        this.projects = response.data;
+        // 等待项目列表加载完
+        if (projectId) this.test.projectId = projectId;
+      })
+    },
+    getTest(id) {
+      this.result = this.$get("/api/get/" + id, response => {
+        if (response.data) {
+          let item = response.data;
+
+          this.test = new Test({
+            id: item.id,
+            projectId: item.projectId,
+            name: item.name,
+            status: item.status,
+            scenarioDefinition: JSON.parse(item.scenarioDefinition),
+            schedule: item.schedule ? item.schedule : {},
+          });
+          this.$refs.config.reset();
+        }
+      });
+    },
+    save(callback) {
+      let validator = this.test.isValid();
+      if (!validator.isValid) {
+        this.$warning(this.$t(validator.info));
+        return;
+      }
+      this.change = false;
+      let bodyFiles = this.getBodyUploadFiles();
+      let url = this.create ? "/api/create" : "/api/update";
+      let jmx = this.test.toJMX();
+      let blob = new Blob([jmx.xml], {type: "application/octet-stream"});
+      let file = new File([blob], jmx.name);
+      this.result = this.$fileUpload(url, file, bodyFiles, this.test, response => {
+        if (callback) callback();
+        this.create = false;
+        this.resetBodyFile();
+      });
+    },
+    saveTest() {
+      this.save(() => {
+        this.$success(this.$t('commons.save_success'));
+        if (this.create) {
+          this.$router.push({
+            path: '/api/test/edit?id=' + this.test.id
+          })
+        }
+        // 发送广播，刷新 head 上的最新列表
+        ApiEvent.$emit(LIST_CHANGE);
+      })
+    },
+    runTest() {
+      this.result = this.$post("/api/run", {id: this.test.id, triggerMode: 'MANUAL'}, (response) => {
+        this.$success(this.$t('api_test.running'));
+        this.$router.push({
+          path: '/api/report/view/' + response.data
+        })
+      });
+    },
+    saveRunTest() {
+      this.change = false;
+
+      this.save(() => {
+        this.$success(this.$t('commons.save_success'));
+        this.runTest();
+        // 发送广播，刷新 head 上的最新列表
+        ApiEvent.$emit(LIST_CHANGE);
+      })
+    },
+    getBodyUploadFiles() {
+      let bodyUploadFiles = [];
+      this.test.bodyUploadIds = [];
+      this.test.scenarioDefinition.forEach(scenario => {
+        scenario.requests.forEach(request => {
+          if (request.body) {
+            request.body.kvs.forEach(param => {
+              if (param.files) {
+                param.files.forEach(item => {
+                  if (item.file) {
+                    let fileId = getUUID().substring(0, 8);
+                    item.name = item.file.name;
+                    item.id = fileId;
+                    this.test.bodyUploadIds.push(fileId);
+                    bodyUploadFiles.push(item.file);
+                    // item.file = undefined;
+                  }
+                });
+              }
+            });
+          }
+        });
+      });
+      return bodyUploadFiles;
+    },
+    resetBodyFile() {
+      //下次保存不再上传已传文件
+      this.test.scenarioDefinition.forEach(scenario => {
+        scenario.requests.forEach(request => {
+          if (request.body) {
+            request.body.kvs.forEach(param => {
+              if (param.files) {
+                param.files.forEach(item => {
+                  if (item.file) {
+                    item.file = undefined;
+                  }
+                });
+              }
+            });
+          }
+        });
+      });
+    },
+    cancel() {
+      this.$router.push('/api/test/list/all');
+    },
+    handleCommand(command) {
+      switch (command) {
+        case "report":
+          this.$refs.reportDialog.open();
+          break;
+        case "performance":
+          this.$store.commit('setTest', {
+            projectId: this.test.projectId,
+            name: this.test.name,
+            jmx: this.test.toJMX()
+          })
+          this.$router.push({
+            path: "/performance/test/create"
+          })
+          break;
+        case "export":
+          downloadFile(this.test.name + ".json", this.test.export());
+          break;
+        case "import":
+          this.$refs.apiImport.open();
+          break;
+      }
+    },
+    saveCronExpression(cronExpression) {
+      this.test.schedule.enable = true;
+      this.test.schedule.value = cronExpression;
+      this.saveSchedule();
+    },
+    saveSchedule() {
+      this.checkScheduleEdit();
+      let param = {};
+      param = this.test.schedule;
+      param.resourceId = this.test.id;
+      let url = '/api/schedule/create';
+      if (param.id) {
+        url = '/api/schedule/update';
+      }
+      this.$post(url, param, () => {
+        this.$success(this.$t('commons.save_success'));
+        this.getTest(this.test.id);
+      });
+    },
+    checkScheduleEdit() {
+      if (this.create) {
+        this.$message(this.$t('api_test.environment.please_save_test'));
+        return false;
+      }
+      return true;
+    },
+    runDebug(scenario) {
+      if (this.create) {
+        this.$warning(this.$t('api_test.environment.please_save_test'));
+        return;
+      }
+
+      let url = "/api/run/debug";
+      let runningTest = new Test();
+      Object.assign(runningTest, this.test);
+      runningTest.scenarioDefinition = [];
+      runningTest.scenarioDefinition.push(scenario);
+      let validator = runningTest.isValid();
+      if (!validator.isValid) {
+        this.$warning(this.$t(validator.info));
+        return;
+      }
+
+      let jmx = runningTest.toJMX();
+      let blob = new Blob([jmx.xml], {type: "application/octet-stream"});
+      let file = new File([blob], jmx.name);
+      this.$fileUpload(url, file, null, this.test, response => {
+        this.debugReportId = response.data;
+      });
+    }
+  },
+
+  created() {
+    this.init();
   }
+}
 </script>
 
 <style scoped>
-  .test-container {
-    height: calc(100vh - 150px);
-    min-height: 600px;
-  }
+.test-container {
+  height: calc(100vh - 150px);
+  min-height: 600px;
+}
 
-  .test-name {
-    width: 600px;
-    margin-left: -20px;
-    margin-right: 20px;
-  }
+.test-name {
+  width: 600px;
+  margin-left: -20px;
+  margin-right: 20px;
+}
 
-  .test-project {
-    min-width: 150px;
-  }
+.test-project {
+  min-width: 150px;
+}
 
-  .test-container .more {
-    margin-left: 10px;
-  }
+.test-container .more {
+  margin-left: 10px;
+}
 </style>
diff --git a/frontend/src/business/components/performance/test/EditPerformanceTestPlan.vue b/frontend/src/business/components/performance/test/EditPerformanceTestPlan.vue
index af7e5736b0..e50d70dc37 100644
--- a/frontend/src/business/components/performance/test/EditPerformanceTestPlan.vue
+++ b/frontend/src/business/components/performance/test/EditPerformanceTestPlan.vue
@@ -60,6 +60,7 @@ import MsContainer from "../../common/components/MsContainer";
 import MsMainContainer from "../../common/components/MsMainContainer";
 import {checkoutTestManagerOrTestUser} from "../../../../common/js/utils";
 import MsScheduleConfig from "../../common/components/MsScheduleConfig";
+import {LIST_CHANGE, PerformanceEvent} from "@/business/components/common/head/ListEvent";
 
 export default {
   name: "EditPerformanceTestPlan",
@@ -172,6 +173,8 @@ export default {
         this.$success(this.$t('commons.save_success'));
         this.$refs.advancedConfig.cancelAllEdit();
         this.$router.push({path: '/performance/test/all'})
+        // 发送广播，刷新 head 上的最新列表
+        PerformanceEvent.$emit(LIST_CHANGE);
       });
     },
     saveAndRun() {
@@ -187,6 +190,8 @@ export default {
         this.result = this.$post(this.runPath, {id: this.testPlan.id, triggerMode: 'MANUAL'}, (response) => {
           let reportId = response.data;
           this.$router.push({path: '/performance/report/view/' + reportId})
+          // 发送广播，刷新 head 上的最新列表
+          PerformanceEvent.$emit(LIST_CHANGE);
         })
       });
     },
diff --git a/frontend/src/business/components/track/case/components/TestCaseEdit.vue b/frontend/src/business/components/track/case/components/TestCaseEdit.vue
index f3a96dc71c..bb33f1b561 100644
--- a/frontend/src/business/components/track/case/components/TestCaseEdit.vue
+++ b/frontend/src/business/components/track/case/components/TestCaseEdit.vue
@@ -3,8 +3,8 @@
   <div>
 
     <el-dialog @close="close"
-      :title="operationType == 'edit' ? ( readOnly ? $t('test_track.case.view_case') : $t('test_track.case.edit_case')) : $t('test_track.case.create')"
-      :visible.sync="dialogFormVisible" width="65%">
+               :title="operationType == 'edit' ? ( readOnly ? $t('test_track.case.view_case') : $t('test_track.case.edit_case')) : $t('test_track.case.create')"
+               :visible.sync="dialogFormVisible" width="65%">
 
       <el-form :model="form" :rules="rules" ref="caseFrom" v-loading="result.loading">
 
@@ -92,7 +92,7 @@
         <el-row v-if="form.method && form.method == 'auto'">
           <el-col :span="9" :offset="1">
             <el-form-item :label="$t('test_track.case.relate_test')" :label-width="formLabelWidth" prop="testId">
-              <el-select  filterable :disabled="readOnly" v-model="form.testId"
+              <el-select filterable :disabled="readOnly" v-model="form.testId"
                          :placeholder="$t('test_track.case.input_type')">
                 <el-option
                   v-for="item in testOptions"
@@ -105,12 +105,12 @@
           </el-col>
           <el-col :span="9" :offset="1" v-if="form.testId=='other'">
             <el-form-item :label="$t('test_track.case.test_name')" :label-width="formLabelWidth" prop="testId">
-              <el-input  v-model="form.otherTestName" :placeholder="$t('test_track.case.input_test_case')" ></el-input>
+              <el-input v-model="form.otherTestName" :placeholder="$t('test_track.case.input_test_case')"></el-input>
             </el-form-item>
           </el-col>
         </el-row>
         <el-row style="margin-top: 15px;">
-          <el-col :offset="2">{{$t('test_track.case.prerequisite')}}:</el-col>
+          <el-col :offset="2">{{ $t('test_track.case.prerequisite') }}:</el-col>
         </el-row>
         <el-row type="flex" justify="center" style="margin-top: 10px;">
           <el-col :span="20">
@@ -125,7 +125,7 @@
         </el-row>
 
         <el-row v-if="form.method && form.method != 'auto'" style="margin-bottom: 10px">
-          <el-col :offset="2">{{$t('test_track.case.steps')}}:</el-col>
+          <el-col :offset="2">{{ $t('test_track.case.steps') }}:</el-col>
         </el-row>
 
         <el-row v-if="form.method && form.method != 'auto'" type="flex" justify="center">
@@ -187,7 +187,7 @@
         </el-row>
 
         <el-row style="margin-top: 15px;margin-bottom: 10px">
-          <el-col :offset="2">{{$t('commons.remark')}}:</el-col>
+          <el-col :offset="2">{{ $t('commons.remark') }}:</el-col>
         </el-row>
         <el-row type="flex" justify="center">
           <el-col :span="20">
@@ -222,302 +222,305 @@
 
 <script>
 
-  import {WORKSPACE_ID, TokenKey} from '../../../../../common/js/constants';
-  import MsDialogFooter from '../../../common/components/MsDialogFooter'
-  import {listenGoBack, removeGoBackListener, removeListenGoBack} from "../../../../../common/js/utils";
+import {TokenKey, WORKSPACE_ID} from '../../../../../common/js/constants';
+import MsDialogFooter from '../../../common/components/MsDialogFooter'
+import {listenGoBack, removeGoBackListener} from "../../../../../common/js/utils";
+import {LIST_CHANGE, TrackEvent} from "@/business/components/common/head/ListEvent";
 
-  export default {
-    name: "TestCaseEdit",
-    components: {MsDialogFooter},
-    data() {
-      return {
-        result: {},
-        dialogFormVisible: false,
-        form: {
-          name: '',
-          module: '',
-          maintainer: '',
-          priority: '',
-          type: '',
-          method: '',
-          prerequisite: '',
-          testId: '',
-          otherTestName:'',
-          steps: [{
+export default {
+  name: "TestCaseEdit",
+  components: {MsDialogFooter},
+  data() {
+    return {
+      result: {},
+      dialogFormVisible: false,
+      form: {
+        name: '',
+        module: '',
+        maintainer: '',
+        priority: '',
+        type: '',
+        method: '',
+        prerequisite: '',
+        testId: '',
+        otherTestName: '',
+        steps: [{
+          num: 1,
+          desc: '',
+          result: ''
+        }],
+        remark: '',
+      },
+      moduleOptions: [],
+      maintainerOptions: [],
+      methodOptions: [],
+      testOptions: [],
+      workspaceId: '',
+      rules: {
+        name: [
+          {required: true, message: this.$t('test_track.case.input_name'), trigger: 'blur'},
+          {max: 50, message: this.$t('test_track.length_less_than') + '50', trigger: 'blur'}
+        ],
+        module: [{required: true, message: this.$t('test_track.case.input_module'), trigger: 'change'}],
+        maintainer: [{required: true, message: this.$t('test_track.case.input_maintainer'), trigger: 'change'}],
+        priority: [{required: true, message: this.$t('test_track.case.input_priority'), trigger: 'change'}],
+        type: [{required: true, message: this.$t('test_track.case.input_type'), trigger: 'change'}],
+        testId: [{required: true, message: this.$t('commons.please_select'), trigger: 'change'}],
+        method: [{required: true, message: this.$t('test_track.case.input_method'), trigger: 'change'}],
+        prerequisite: [{max: 300, message: this.$t('test_track.length_less_than') + '300', trigger: 'blur'}],
+        remark: [{max: 300, message: this.$t('test_track.length_less_than') + '300', trigger: 'blur'}]
+      },
+      formLabelWidth: "120px",
+      operationType: '',
+      isCreateContinue: false
+    };
+  },
+  props: {
+    treeNodes: {
+      type: Array
+    },
+    readOnly: {
+      type: Boolean,
+      default: true
+    },
+    selectNode: {
+      type: Object
+    },
+    currentProject: {
+      type: Object
+    }
+  },
+  mounted() {
+    this.getSelectOptions();
+  },
+  watch: {
+    treeNodes() {
+      this.getModuleOptions();
+    },
+    currentProject() {
+      this.getTestOptions();
+    }
+  },
+  methods: {
+    open(testCase) {
+      this.resetForm();
+
+      if (window.history && window.history.pushState) {
+        history.pushState(null, null, document.URL);
+        window.addEventListener('popstate', this.close);
+      }
+      listenGoBack(this.close);
+      this.operationType = 'add';
+      if (testCase) {
+        //修改
+        this.operationType = 'edit';
+        //复制
+        if (testCase.name === '') {
+          this.operationType = 'add';
+        }
+        let tmp = {};
+        Object.assign(tmp, testCase);
+        tmp.steps = JSON.parse(testCase.steps);
+        Object.assign(this.form, tmp);
+        this.form.module = testCase.nodeId;
+      } else {
+        if (this.selectNode.data) {
+          this.form.module = this.selectNode.data.id;
+        } else {
+          if (this.moduleOptions.length > 0) {
+            this.form.module = this.moduleOptions[0].id;
+          }
+        }
+        let user = JSON.parse(localStorage.getItem(TokenKey));
+        this.form.priority = 'P3';
+        this.form.type = 'functional';
+        this.form.method = 'manual';
+        this.form.maintainer = user.id;
+      }
+
+      this.getSelectOptions();
+      this.dialogFormVisible = true;
+    },
+    handleAddStep(index, data) {
+      let step = {};
+      step.num = data.num + 1;
+      step.desc = null;
+      step.result = null;
+      this.form.steps.forEach(step => {
+        if (step.num > data.num) {
+          step.num++;
+        }
+      });
+      this.form.steps.splice(index + 1, 0, step);
+    },
+    handleDeleteStep(index, data) {
+      this.form.steps.splice(index, 1);
+      this.form.steps.forEach(step => {
+        if (step.num > data.num) {
+          step.num--;
+        }
+      });
+    },
+    close() {
+      //移除监听，防止监听其他页面
+      removeGoBackListener(this.close);
+      this.dialogFormVisible = false;
+    },
+    saveCase() {
+      this.$refs['caseFrom'].validate((valid) => {
+        if (valid) {
+          let param = this.buildParam();
+          if (this.validate(param)) {
+            this.result = this.$post('/test/case/' + this.operationType, param, () => {
+              this.$success(this.$t('commons.save_success'));
+              if (this.operationType == 'add' && this.isCreateContinue) {
+                this.form.name = '';
+                this.form.prerequisite = '';
+                this.form.steps = [{
+                  num: 1,
+                  desc: '',
+                  result: ''
+                }];
+                this.form.remark = '';
+                this.$emit("refresh");
+                return;
+              }
+              this.dialogFormVisible = false;
+              this.$emit("refresh");
+              // 发送广播，刷新 head 上的最新列表
+              TrackEvent.$emit(LIST_CHANGE);
+            });
+          }
+        } else {
+          return false;
+        }
+      });
+    },
+    buildParam() {
+      let param = {};
+      Object.assign(param, this.form);
+      param.steps = JSON.stringify(this.form.steps);
+      param.nodeId = this.form.module;
+      this.moduleOptions.forEach(item => {
+        if (this.form.module === item.id) {
+          param.nodePath = item.path;
+        }
+      });
+      if (this.currentProject) {
+        param.projectId = this.currentProject.id;
+      }
+      param.name = param.name.trim();
+      if (param.method != 'auto') {
+        param.testId = null;
+      }
+      return param;
+    },
+    validate(param) {
+      for (let i = 0; i < param.steps.length; i++) {
+        if ((param.steps[i].desc && param.steps[i].desc.length > 300) ||
+          (param.steps[i].result && param.steps[i].result.length > 300)) {
+          this.$warning(this.$t('test_track.case.step_desc') + ","
+            + this.$t('test_track.case.expected_results') + this.$t('test_track.length_less_than') + '300');
+          return false;
+        }
+      }
+      if (param.name == '') {
+        this.$warning(this.$t('test_track.case.input_name'));
+        return false;
+      }
+      return true;
+    },
+    typeChange() {
+      this.form.testId = '';
+      this.getMethodOptions();
+      this.getTestOptions()
+    },
+    getModuleOptions() {
+      let moduleOptions = [];
+      this.treeNodes.forEach(node => {
+        this.buildNodePath(node, {path: ''}, moduleOptions);
+      });
+      this.moduleOptions = moduleOptions;
+    },
+    getMaintainerOptions() {
+      let workspaceId = localStorage.getItem(WORKSPACE_ID);
+      this.$post('/user/ws/member/tester/list', {workspaceId: workspaceId}, response => {
+        this.maintainerOptions = response.data;
+      });
+    },
+    getTestOptions() {
+      this.testOptions = [];
+      if (this.currentProject && this.form.type != '' && this.form.type != 'functional') {
+        this.result = this.$get('/' + this.form.type + '/list/' + this.currentProject.id, response => {
+          this.testOptions = response.data;
+          this.testOptions.unshift({id: 'other', name: this.$t('test_track.case.other')})
+        });
+      }
+    },
+    getMethodOptions() {
+      if (!this.form.type || this.form.type != 'functional') {
+        this.methodOptions = [
+          {value: 'auto', label: this.$t('test_track.case.auto')},
+          {value: 'manual', label: this.$t('test_track.case.manual')}
+        ];
+      } else {
+        this.form.method = 'manual';
+        this.methodOptions = [{value: 'manual', label: this.$t('test_track.case.manual')}]
+      }
+    },
+    getSelectOptions() {
+      this.getModuleOptions();
+      this.getMaintainerOptions();
+      this.getTestOptions();
+      this.getMethodOptions();
+    },
+    buildNodePath(node, option, moduleOptions) {
+      //递归构建节点路径
+      option.id = node.id;
+      option.path = option.path + '/' + node.name;
+      moduleOptions.push(option);
+      if (node.children) {
+        for (let i = 0; i < node.children.length; i++) {
+          this.buildNodePath(node.children[i], {path: option.path}, moduleOptions);
+        }
+      }
+    },
+    resetForm() {
+      //防止点击修改后，点击新建触发校验
+      if (this.$refs['caseFrom']) {
+        this.$refs['caseFrom'].validate((valid) => {
+          this.$refs['caseFrom'].resetFields();
+          this.form.name = '';
+          this.form.module = '';
+          this.form.type = '';
+          this.form.method = '';
+          this.form.maintainer = '';
+          this.form.priority = '';
+          this.form.prerequisite = '';
+          this.form.remark = '';
+          this.form.testId = '';
+          this.form.testName = '';
+          this.form.steps = [{
             num: 1,
             desc: '',
             result: ''
-          }],
-          remark: '',
-        },
-        moduleOptions: [],
-        maintainerOptions: [],
-        methodOptions: [],
-        testOptions: [],
-        workspaceId: '',
-        rules: {
-          name: [
-            {required: true, message: this.$t('test_track.case.input_name'), trigger: 'blur'},
-            {max: 50, message: this.$t('test_track.length_less_than') + '50', trigger: 'blur'}
-          ],
-          module: [{required: true, message: this.$t('test_track.case.input_module'), trigger: 'change'}],
-          maintainer: [{required: true, message: this.$t('test_track.case.input_maintainer'), trigger: 'change'}],
-          priority: [{required: true, message: this.$t('test_track.case.input_priority'), trigger: 'change'}],
-          type: [{required: true, message: this.$t('test_track.case.input_type'), trigger: 'change'}],
-          testId: [{required: true, message: this.$t('commons.please_select'), trigger: 'change'}],
-          method: [{required: true, message: this.$t('test_track.case.input_method'), trigger: 'change'}],
-          prerequisite: [{max: 300, message: this.$t('test_track.length_less_than') + '300', trigger: 'blur'}],
-          remark: [{max: 300, message: this.$t('test_track.length_less_than') + '300', trigger: 'blur'}]
-        },
-        formLabelWidth: "120px",
-        operationType: '',
-        isCreateContinue: false
-      };
-    },
-    props: {
-      treeNodes: {
-        type: Array
-      },
-      readOnly: {
-        type: Boolean,
-        default: true
-      },
-      selectNode: {
-        type: Object
-      },
-      currentProject: {
-        type: Object
-      }
-    },
-    mounted() {
-      this.getSelectOptions();
-    },
-    watch: {
-      treeNodes() {
-        this.getModuleOptions();
-      },
-      currentProject() {
-        this.getTestOptions();
-      }
-    },
-    methods: {
-      open(testCase) {
-        this.resetForm();
-
-        if (window.history && window.history.pushState) {
-          history.pushState(null, null, document.URL);
-          window.addEventListener('popstate', this.close);
-        }
-        listenGoBack(this.close);
-        this.operationType = 'add';
-        if (testCase) {
-          //修改
-          this.operationType = 'edit';
-          //复制
-          if (testCase.name === '') {
-            this.operationType = 'add';
-          }
-          let tmp = {};
-          Object.assign(tmp, testCase);
-          tmp.steps = JSON.parse(testCase.steps);
-          Object.assign(this.form, tmp);
-          this.form.module = testCase.nodeId;
-        } else {
-          if (this.selectNode.data) {
-            this.form.module = this.selectNode.data.id;
-          } else {
-            if (this.moduleOptions.length > 0) {
-              this.form.module = this.moduleOptions[0].id;
-            }
-          }
-          let user = JSON.parse(localStorage.getItem(TokenKey));
-          this.form.priority = 'P3';
-          this.form.type = 'functional';
-          this.form.method = 'manual';
-          this.form.maintainer = user.id;
-        }
-
-        this.getSelectOptions();
-        this.dialogFormVisible = true;
-      },
-      handleAddStep(index, data) {
-        let step = {};
-        step.num = data.num + 1;
-        step.desc = null;
-        step.result = null;
-        this.form.steps.forEach(step => {
-          if (step.num > data.num) {
-            step.num++;
-          }
+          }];
+          return true;
         });
-        this.form.steps.splice(index + 1, 0, step);
-      },
-      handleDeleteStep(index, data) {
-        this.form.steps.splice(index, 1);
-        this.form.steps.forEach(step => {
-          if (step.num > data.num) {
-            step.num--;
-          }
-        });
-      },
-      close() {
-        //移除监听，防止监听其他页面
-        removeGoBackListener(this.close);
-        this.dialogFormVisible = false;
-      },
-      saveCase() {
-        this.$refs['caseFrom'].validate((valid) => {
-          if (valid) {
-            let param = this.buildParam();
-            if (this.validate(param)) {
-              this.result = this.$post('/test/case/' + this.operationType, param, () => {
-                this.$success(this.$t('commons.save_success'));
-                if (this.operationType == 'add' && this.isCreateContinue) {
-                  this.form.name = '';
-                  this.form.prerequisite = '';
-                  this.form.steps = [{
-                    num: 1,
-                    desc: '',
-                    result: ''
-                  }];
-                  this.form.remark = '';
-                  this.$emit("refresh");
-                  return;
-                }
-                this.dialogFormVisible = false;
-                this.$emit("refresh");
-              });
-            }
-          } else {
-            return false;
-          }
-        });
-      },
-      buildParam() {
-        let param = {};
-        Object.assign(param, this.form);
-        param.steps = JSON.stringify(this.form.steps);
-        param.nodeId = this.form.module;
-        this.moduleOptions.forEach(item => {
-          if (this.form.module === item.id) {
-            param.nodePath = item.path;
-          }
-        });
-        if (this.currentProject) {
-          param.projectId = this.currentProject.id;
-        }
-        param.name = param.name.trim();
-        if (param.method != 'auto') {
-          param.testId = null;
-        }
-        return param;
-      },
-      validate(param) {
-        for (let i = 0; i < param.steps.length; i++) {
-          if ((param.steps[i].desc && param.steps[i].desc.length > 300) ||
-            (param.steps[i].result && param.steps[i].result.length > 300)) {
-            this.$warning(this.$t('test_track.case.step_desc') + ","
-              + this.$t('test_track.case.expected_results') + this.$t('test_track.length_less_than') + '300');
-            return false;
-          }
-        }
-        if (param.name == '') {
-          this.$warning(this.$t('test_track.case.input_name'));
-          return false;
-        }
-        return true;
-      },
-      typeChange() {
-        this.form.testId = '';
-        this.getMethodOptions();
-        this.getTestOptions()
-      },
-      getModuleOptions() {
-        let moduleOptions = [];
-        this.treeNodes.forEach(node => {
-          this.buildNodePath(node, {path: ''}, moduleOptions);
-        });
-        this.moduleOptions = moduleOptions;
-      },
-      getMaintainerOptions() {
-        let workspaceId = localStorage.getItem(WORKSPACE_ID);
-        this.$post('/user/ws/member/tester/list', {workspaceId: workspaceId}, response => {
-          this.maintainerOptions = response.data;
-        });
-      },
-      getTestOptions() {
-        this.testOptions = [];
-        if (this.currentProject && this.form.type != '' && this.form.type != 'functional') {
-          this.result = this.$get('/' + this.form.type + '/list/' + this.currentProject.id, response => {
-            this.testOptions = response.data;
-            this.testOptions.unshift({id:'other',name:this.$t('test_track.case.other')})
-          });
-        }
-      },
-      getMethodOptions() {
-        if (!this.form.type || this.form.type != 'functional') {
-          this.methodOptions = [
-            {value: 'auto', label: this.$t('test_track.case.auto')},
-            {value: 'manual', label: this.$t('test_track.case.manual')}
-          ];
-        } else {
-          this.form.method = 'manual';
-          this.methodOptions = [{value: 'manual', label: this.$t('test_track.case.manual')}]
-        }
-      },
-      getSelectOptions() {
-        this.getModuleOptions();
-        this.getMaintainerOptions();
-        this.getTestOptions();
-        this.getMethodOptions();
-      },
-      buildNodePath(node, option, moduleOptions) {
-        //递归构建节点路径
-        option.id = node.id;
-        option.path = option.path + '/' + node.name;
-        moduleOptions.push(option);
-        if (node.children) {
-          for (let i = 0; i < node.children.length; i++) {
-            this.buildNodePath(node.children[i], {path: option.path}, moduleOptions);
-          }
-        }
-      },
-      resetForm() {
-        //防止点击修改后，点击新建触发校验
-        if (this.$refs['caseFrom']) {
-          this.$refs['caseFrom'].validate((valid) => {
-            this.$refs['caseFrom'].resetFields();
-            this.form.name = '';
-            this.form.module = '';
-            this.form.type = '';
-            this.form.method = '';
-            this.form.maintainer = '';
-            this.form.priority = '';
-            this.form.prerequisite = '';
-            this.form.remark = '';
-            this.form.testId = '';
-            this.form.testName='';
-            this.form.steps = [{
-              num: 1,
-              desc: '',
-              result: ''
-            }];
-            return true;
-          });
-        }
       }
     }
   }
+}
 </script>
 
 <style scoped>
 
-  .el-switch {
-    margin-bottom: 10px;
-  }
+.el-switch {
+  margin-bottom: 10px;
+}
 
-  .case-name {
-    width: 194px;
-  }
+.case-name {
+  width: 194px;
+}
 
 </style>
diff --git a/frontend/src/business/components/track/plan/components/TestPlanEdit.vue b/frontend/src/business/components/track/plan/components/TestPlanEdit.vue
index ce53fa9057..b51d0de096 100644
--- a/frontend/src/business/components/track/plan/components/TestPlanEdit.vue
+++ b/frontend/src/business/components/track/plan/components/TestPlanEdit.vue
@@ -92,12 +92,12 @@
         <div class="dialog-footer">
           <el-button
             @click="dialogFormVisible = false">
-            {{$t('test_track.cancel')}}
+            {{ $t('test_track.cancel') }}
           </el-button>
           <el-button
             type="primary"
             @click="savePlan">
-            {{$t('test_track.confirm')}}
+            {{ $t('test_track.confirm') }}
           </el-button>
         </div>
       </template>
@@ -110,116 +110,119 @@
 
 <script>
 
-  import {WORKSPACE_ID} from '../../../../../common/js/constants';
-  import TestPlanStatusButton from "../common/TestPlanStatusButton";
-  import {listenGoBack, removeGoBackListener} from "../../../../../common/js/utils";
+import {WORKSPACE_ID} from '../../../../../common/js/constants';
+import TestPlanStatusButton from "../common/TestPlanStatusButton";
+import {listenGoBack, removeGoBackListener} from "../../../../../common/js/utils";
+import {LIST_CHANGE, TrackEvent} from "@/business/components/common/head/ListEvent";
 
-  export default {
-      name: "TestPlanEdit",
-    components: {TestPlanStatusButton},
-    data() {
-        return {
-          dialogFormVisible: false,
-          form: {
-            name: '',
-            projectId: '',
-            principal: '',
-            stage: '',
-            description: ''
-          },
-          rules:{
-            name :[
-              {required: true, message: this.$t('test_track.plan.input_plan_name'), trigger: 'blur'},
-              { max: 30, message: this.$t('test_track.length_less_than') + '30', trigger: 'blur' }
-            ],
-            projectId :[{required: true, message: this.$t('test_track.plan.input_plan_project'), trigger: 'change'}],
-            principal :[{required: true, message: this.$t('test_track.plan.input_plan_principal'), trigger: 'change'}],
-            stage :[{required: true, message: this.$t('test_track.plan.input_plan_stage'), trigger: 'change'}],
-            description :[{ max: 200, message: this.$t('test_track.length_less_than') + '200', trigger: 'blur'}]
-          },
-          formLabelWidth: "120px",
-          operationType: '',
-          projects: [],
-          principalOptions: []
-        };
+export default {
+  name: "TestPlanEdit",
+  components: {TestPlanStatusButton},
+  data() {
+    return {
+      dialogFormVisible: false,
+      form: {
+        name: '',
+        projectId: '',
+        principal: '',
+        stage: '',
+        description: ''
       },
-    methods: {
-        openTestPlanEditDialog(testPlan) {
-          this.resetForm();
-          this.getProjects();
-          this.setPrincipalOptions();
-          this.operationType = 'add';
-          if(testPlan){
-            //修改
-            this.operationType = 'edit';
-            let tmp = {};
-            Object.assign(tmp, testPlan);
-            Object.assign(this.form, tmp);
+      rules: {
+        name: [
+          {required: true, message: this.$t('test_track.plan.input_plan_name'), trigger: 'blur'},
+          {max: 30, message: this.$t('test_track.length_less_than') + '30', trigger: 'blur'}
+        ],
+        projectId: [{required: true, message: this.$t('test_track.plan.input_plan_project'), trigger: 'change'}],
+        principal: [{required: true, message: this.$t('test_track.plan.input_plan_principal'), trigger: 'change'}],
+        stage: [{required: true, message: this.$t('test_track.plan.input_plan_stage'), trigger: 'change'}],
+        description: [{max: 200, message: this.$t('test_track.length_less_than') + '200', trigger: 'blur'}]
+      },
+      formLabelWidth: "120px",
+      operationType: '',
+      projects: [],
+      principalOptions: []
+    };
+  },
+  methods: {
+    openTestPlanEditDialog(testPlan) {
+      this.resetForm();
+      this.getProjects();
+      this.setPrincipalOptions();
+      this.operationType = 'add';
+      if (testPlan) {
+        //修改
+        this.operationType = 'edit';
+        let tmp = {};
+        Object.assign(tmp, testPlan);
+        Object.assign(this.form, tmp);
+      }
+      listenGoBack(this.close);
+      this.dialogFormVisible = true;
+    },
+    savePlan() {
+      this.$refs['planFrom'].validate((valid) => {
+        if (valid) {
+          let param = {};
+          Object.assign(param, this.form);
+          param.name = param.name.trim();
+          if (param.name == '') {
+            this.$warning(this.$t('test_track.plan.input_plan_name'));
+            return;
           }
-          listenGoBack(this.close);
-          this.dialogFormVisible = true;
-        },
-        savePlan(){
-          this.$refs['planFrom'].validate((valid) => {
-            if (valid) {
-              let param = {};
-              Object.assign(param, this.form);
-              param.name = param.name.trim();
-              if (param.name == '') {
-                this.$warning(this.$t('test_track.plan.input_plan_name'));
-                return;
-              }
-              param.workspaceId = localStorage.getItem(WORKSPACE_ID);
-              this.$post('/test/plan/' + this.operationType, param, () => {
-                this.$success(this.$t('commons.save_success'));
-                this.dialogFormVisible = false;
-                this.$emit("refresh");
-              });
-            } else {
-              return false;
-            }
+          param.workspaceId = localStorage.getItem(WORKSPACE_ID);
+          this.$post('/test/plan/' + this.operationType, param, () => {
+            this.$success(this.$t('commons.save_success'));
+            this.dialogFormVisible = false;
+            this.$emit("refresh");
+            // 发送广播，刷新 head 上的最新列表
+            TrackEvent.$emit(LIST_CHANGE);
           });
-        },
-        getProjects() {
-          this.$get("/project/listAll", (response) => {
-            if (response.success) {
-              this.projects = response.data;
-            } else {
-              this.$warning()(response.message);
-            }
-          });
-        },
-        setPrincipalOptions() {
-          let workspaceId = localStorage.getItem(WORKSPACE_ID);
-          this.$post('/user/ws/member/tester/list', {workspaceId:workspaceId}, response => {
-            this.principalOptions = response.data;
-          });
-        },
-        statusChange(status) {
-          this.form.status = status;
-          this.$forceUpdate();
-        },
-        close() {
-          removeGoBackListener(this.close);
-          this.dialogFormVisible = false;
-        },
-        resetForm() {
-          //防止点击修改后，点击新建触发校验
-          if (this.$refs['planFrom']) {
-            this.$refs['planFrom'].validate((valid) => {
-              this.$refs['planFrom'].resetFields();
-              this.form.name = '';
-              this.form.projectId = '';
-              this.form.principal = '';
-              this.form.stage = '';
-              this.form.description = '';
-              this.form.status = null;
-              return true;
-            });
-          }
+        } else {
+          return false;
         }
+      });
+    },
+    getProjects() {
+      this.$get("/project/listAll", (response) => {
+        if (response.success) {
+          this.projects = response.data;
+        } else {
+          this.$warning()(response.message);
+        }
+      });
+    },
+    setPrincipalOptions() {
+      let workspaceId = localStorage.getItem(WORKSPACE_ID);
+      this.$post('/user/ws/member/tester/list', {workspaceId: workspaceId}, response => {
+        this.principalOptions = response.data;
+      });
+    },
+    statusChange(status) {
+      this.form.status = status;
+      this.$forceUpdate();
+    },
+    close() {
+      removeGoBackListener(this.close);
+      this.dialogFormVisible = false;
+    },
+    resetForm() {
+      //防止点击修改后，点击新建触发校验
+      if (this.$refs['planFrom']) {
+        this.$refs['planFrom'].validate((valid) => {
+          this.$refs['planFrom'].resetFields();
+          this.form.name = '';
+          this.form.projectId = '';
+          this.form.principal = '';
+          this.form.stage = '';
+          this.form.description = '';
+          this.form.status = null;
+          return true;
+        });
       }
     }
+  }
+}
 </script>
 
 <style scoped>