From 882c1d3b17167609ee0f3266c09fc11bf8fe8899 Mon Sep 17 00:00:00 2001
From: "Captain.B" <bin@fit2cloud.com>
Date: Thu, 3 Dec 2020 16:27:10 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E6=B6=88=E6=81=AF=E8=AE=BE?=
 =?UTF-8?q?=E7=BD=AE=E9=A1=B5=E9=9D=A2=E9=87=8D=E6=9E=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../common/components/MsScheduleEdit.vue      | 26 +++---
 .../components/DefectTaskNotification.vue     | 30 +++---
 .../components/JenkinsNotification.vue        | 92 +++++++++----------
 .../components/ScheduleTaskNotification.vue   | 59 ++++++------
 .../components/TestPlanTaskNotification.vue   | 42 +++++----
 .../components/TestReviewNotification.vue     | 42 +++++----
 6 files changed, 145 insertions(+), 146 deletions(-)

diff --git a/frontend/src/business/components/common/components/MsScheduleEdit.vue b/frontend/src/business/components/common/components/MsScheduleEdit.vue
index 9cb5eed4a8..75e854aba6 100644
--- a/frontend/src/business/components/common/components/MsScheduleEdit.vue
+++ b/frontend/src/business/components/common/components/MsScheduleEdit.vue
@@ -31,7 +31,8 @@
             </el-dialog>
           </el-tab-pane>
           <el-tab-pane :label="$t('schedule.task_notification')" name="second">
-          <schedule-task-notification :is-tester-permission="isTesterPermission" :test-id="testId" :schedule-receiver-options="scheduleReceiverOptions"></schedule-task-notification>
+            <schedule-task-notification :is-tester-permission="isTesterPermission" :test-id="testId"
+                                        :schedule-receiver-options="scheduleReceiverOptions"/>
           </el-tab-pane>
         </el-tabs>
       </div>
@@ -40,20 +41,19 @@
 </template>
 
 <script>
-import {getCurrentUser} from "@/common/js/utils";
+import {checkoutTestManagerOrTestUser, getCurrentUser, listenGoBack, removeGoBackListener} from "@/common/js/utils";
 import Crontab from "../cron/Crontab";
 import CrontabResult from "../cron/CrontabResult";
 import {cronValidate} from "@/common/js/cron";
-import {listenGoBack, removeGoBackListener} from "@/common/js/utils";
 import ScheduleTaskNotification from "../../settings/organization/components/ScheduleTaskNotification";
-import {checkoutTestManagerOrTestUser} from "../../../../common/js/utils";
+
 function defaultCustomValidate() {
   return {pass: true};
 }
 
 export default {
   name: "MsScheduleEdit",
-  components: {CrontabResult, Crontab,ScheduleTaskNotification},
+  components: {CrontabResult, Crontab, ScheduleTaskNotification},
   props: {
     testId: String,
     save: Function,
@@ -92,7 +92,7 @@ export default {
       }
     };
     return {
-      scheduleReceiverOptions:[],
+      scheduleReceiverOptions: [],
       operation: true,
       dialogVisible: false,
       showCron: false,
@@ -122,13 +122,13 @@ export default {
       }
 
     },
-   /* handleClick() {
-      if (this.activeName === "second") {
-          this.result = this.$get('/notice/search/message/'+this.testId, response => {
-            this.scheduleTask = response.data;
-          })
-      }
-    },*/
+    /* handleClick() {
+       if (this.activeName === "second") {
+           this.result = this.$get('/notice/search/message/'+this.testId, response => {
+             this.scheduleTask = response.data;
+           })
+       }
+     },*/
     buildParam() {
       let param = {};
       param.notices = this.tableData
diff --git a/frontend/src/business/components/settings/organization/components/DefectTaskNotification.vue b/frontend/src/business/components/settings/organization/components/DefectTaskNotification.vue
index 27f3aa6c24..2699ccac3f 100644
--- a/frontend/src/business/components/settings/organization/components/DefectTaskNotification.vue
+++ b/frontend/src/business/components/settings/organization/components/DefectTaskNotification.vue
@@ -11,7 +11,7 @@
     <el-row>
       <el-col :span="24">
         <el-table
-          :data="form.defectTask"
+          :data="defectTask"
           class="tb-edit"
           border
           :cell-style="rowClass"
@@ -76,7 +76,7 @@
               <el-button
                 size="mini"
                 v-show="scope.row.isSet"
-                @click.native.prevent="removeRowTask(scope.$index,form.defectTask)"
+                @click.native.prevent="removeRowTask(scope.$index,defectTask)"
               >{{ $t('commons.cancel') }}
               </el-button>
               <el-button
@@ -113,18 +113,16 @@ export default {
   },
   data() {
     return {
-      form: {
-        defectTask: [{
-          taskType: "defectTask",
-          event: "",
-          userIds: [],
-          type: [],
-          webhook: "",
-          isSet: true,
-          identification: "",
-          isReadOnly: false,
-        }],
-      },
+      defectTask: [{
+        taskType: "defectTask",
+        event: "",
+        userIds: [],
+        type: [],
+        webhook: "",
+        isSet: true,
+        identification: "",
+        isReadOnly: false,
+      }],
       defectEventOptions: [
         {value: 'CREATE', label: this.$t('commons.create')},
       ],
@@ -141,7 +139,7 @@ export default {
   methods: {
     initForm() {
       this.result = this.$get('/notice/search/message/type/' + TASK_TYPE, response => {
-        this.form.defectTask = response.data;
+        this.defectTask = response.data;
       })
     },
     handleEdit(index, data) {
@@ -169,7 +167,7 @@ export default {
       Task.isSet = true;
       Task.identification = '';
       Task.taskType = TASK_TYPE
-      this.form.defectTask.push(Task)
+      this.defectTask.push(Task)
     },
     handleAddTask(index, data) {
 
diff --git a/frontend/src/business/components/settings/organization/components/JenkinsNotification.vue b/frontend/src/business/components/settings/organization/components/JenkinsNotification.vue
index 8906d9ad4f..baa7c9387f 100644
--- a/frontend/src/business/components/settings/organization/components/JenkinsNotification.vue
+++ b/frontend/src/business/components/settings/organization/components/JenkinsNotification.vue
@@ -11,11 +11,11 @@
     <el-row>
       <el-col :span="24">
         <el-table
-          :data="form.jenkinsTask"
-          class="tb-edit"
-          border
-          :cell-style="rowClass"
-          :header-cell-style="headClass">
+            :data="jenkinsTask"
+            class="tb-edit"
+            border
+            :cell-style="rowClass"
+            :header-cell-style="headClass">
           <el-table-column :label="$t('schedule.event')" min-width="20%" prop="events">
             <template slot-scope="scope">
               <el-select v-model="scope.row.event"
@@ -23,10 +23,10 @@
                          size="mini"
                          prop="events" :disabled="!scope.row.isSet">
                 <el-option
-                  v-for="item in jenkinsEventOptions"
-                  :key="item.value"
-                  :label="item.label"
-                  :value="item.value">
+                    v-for="item in jenkinsEventOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value">
                 </el-option>
               </el-select>
             </template>
@@ -36,10 +36,10 @@
               <el-select v-model="row.userIds" filterable multiple size="mini"
                          :placeholder="$t('commons.please_select')" style="width: 100%;" :disabled="!row.isSet">
                 <el-option
-                  v-for="item in jenkinsReceiverOptions"
-                  :key="item.id"
-                  :label="item.name"
-                  :value="item.id">
+                    v-for="item in jenkinsReceiverOptions"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.id">
                 </el-option>
               </el-select>
             </template>
@@ -51,10 +51,10 @@
                          :disabled="!scope.row.isSet" @change="handleEdit(scope.$index, scope.row)"
               >
                 <el-option
-                  v-for="item in receiveTypeOptions"
-                  :key="item.value"
-                  :label="item.label"
-                  :value="item.value">
+                    v-for="item in receiveTypeOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value">
                 </el-option>
               </el-select>
             </template>
@@ -69,31 +69,31 @@
           <el-table-column :label="$t('commons.operating')" min-width="20%" prop="result">
             <template v-slot:default="scope">
               <el-button
-                type="primary"
-                size="mini"
-                v-show="scope.row.isSet"
-                @click="handleAddTask(scope.$index,scope.row)"
+                  type="primary"
+                  size="mini"
+                  v-show="scope.row.isSet"
+                  @click="handleAddTask(scope.$index,scope.row)"
               >{{ $t('commons.add') }}
               </el-button>
               <el-button
-                size="mini"
-                v-show="scope.row.isSet"
-                @click.native.prevent="removeRowTask(scope.$index,form.jenkinsTask)"
+                  size="mini"
+                  v-show="scope.row.isSet"
+                  @click.native.prevent="removeRowTask(scope.$index,jenkinsTask)"
               >{{ $t('commons.cancel') }}
               </el-button>
               <el-button
-                type="primary"
-                size="mini"
-                v-show="!scope.row.isSet"
-                @click="handleEditTask(scope.$index,scope.row)"
+                  type="primary"
+                  size="mini"
+                  v-show="!scope.row.isSet"
+                  @click="handleEditTask(scope.$index,scope.row)"
               >{{ $t('commons.edit') }}
               </el-button>
               <el-button
-                type="danger"
-                icon="el-icon-delete"
-                size="mini"
-                v-show="!scope.row.isSet"
-                @click.native.prevent="deleteRowTask(scope.$index,scope.row)"
+                  type="danger"
+                  icon="el-icon-delete"
+                  size="mini"
+                  v-show="!scope.row.isSet"
+                  @click.native.prevent="deleteRowTask(scope.$index,scope.row)"
               ></el-button>
             </template>
           </el-table-column>
@@ -115,18 +115,16 @@ export default {
   },
   data() {
     return {
-      form: {
-        jenkinsTask: [{
-          taskType: "jenkinsTask",
-          event: "",
-          userIds: [],
-          type: [],
-          webhook: "",
-          isSet: true,
-          identification: "",
-          isReadOnly: false,
-        }],
-      },
+      jenkinsTask: [{
+        taskType: "jenkinsTask",
+        event: "",
+        userIds: [],
+        type: [],
+        webhook: "",
+        isSet: true,
+        identification: "",
+        isReadOnly: false,
+      }],
       jenkinsEventOptions: [
         {value: 'EXECUTE_SUCCESSFUL', label: this.$t('schedule.event_success')},
         {value: 'EXECUTE_FAILED', label: this.$t('schedule.event_failed')}
@@ -144,7 +142,7 @@ export default {
   methods: {
     initForm() {
       this.result = this.$get('/notice/search/message/type/' + TASK_TYPE, response => {
-        this.form.jenkinsTask = response.data;
+        this.jenkinsTask = response.data;
       })
     },
     handleEdit(index, data) {
@@ -163,7 +161,7 @@ export default {
       Task.isSet = true;
       Task.identification = '';
       Task.taskType = TASK_TYPE
-      this.form.jenkinsTask.push(Task)
+      this.jenkinsTask.push(Task)
     },
     handleAddTask(index, data) {
       if (data.event && data.userIds.length > 0 && data.type) {
diff --git a/frontend/src/business/components/settings/organization/components/ScheduleTaskNotification.vue b/frontend/src/business/components/settings/organization/components/ScheduleTaskNotification.vue
index 42002779e3..0d7b8600aa 100644
--- a/frontend/src/business/components/settings/organization/components/ScheduleTaskNotification.vue
+++ b/frontend/src/business/components/settings/organization/components/ScheduleTaskNotification.vue
@@ -2,7 +2,8 @@
   <div>
     <el-row>
       <el-col :span="10">
-        <el-button :disabled="!isTesterPermission" icon="el-icon-circle-plus-outline" plain size="mini" @click="handleAddTaskModel('scheduleTask')">
+        <el-button :disabled="!isTesterPermission" icon="el-icon-circle-plus-outline" plain size="mini"
+                   @click="handleAddTaskModel">
           {{ $t('organization.message.create_new_notification') }}
         </el-button>
       </el-col>
@@ -10,7 +11,7 @@
     <el-row>
       <el-col :span="24">
         <el-table
-          :data="form.scheduleTask"
+          :data="scheduleTask"
           class="tb-edit"
           border
           size="mini"
@@ -77,7 +78,7 @@
                 size="mini"
                 v-show="scope.row.isSet"
                 :disabled="!isTesterPermission"
-                @click.native.prevent="removeRowTask(scope.$index,form.scheduleTask)"
+                @click.native.prevent="removeRowTask(scope.$index,scheduleTask)"
               >{{ $t('commons.cancel') }}
               </el-button>
               <el-button
@@ -86,7 +87,8 @@
                 v-show="!scope.row.isSet"
                 :disabled="!isTesterPermission"
                 @click="handleEditTask(scope.$index,scope.row)"
-              >{{ $t('commons.edit') }}</el-button>
+              >{{ $t('commons.edit') }}
+              </el-button>
               <el-button
                 type="danger"
                 icon="el-icon-delete"
@@ -108,8 +110,8 @@
 export default {
   name: "ScheduleTaskNotification",
   props: {
-    testId:String,
-    scheduleReceiverOptions:Array,
+    testId: String,
+    scheduleReceiverOptions: Array,
     isTesterPermission: {
       type: Boolean,
       default: true
@@ -117,19 +119,18 @@ export default {
   },
   data() {
     return {
-      form: {
-        scheduleTask: [{
-          taskType: "scheduleTask",
-          event: "",
-          userIds: [],
-          type: [],
-          webhook: "",
-          isSet: true,
-          identification: "",
-          isReadOnly: false,
-          testId:this.testId,
-        }],
-      },
+
+      scheduleTask: [{
+        taskType: "scheduleTask",
+        event: "",
+        userIds: [],
+        type: [],
+        webhook: "",
+        isSet: true,
+        identification: "",
+        isReadOnly: false,
+        testId: this.testId,
+      }],
       scheduleEventOptions: [
         {value: 'EXECUTE_SUCCESSFUL', label: this.$t('schedule.event_success')},
         {value: 'EXECUTE_FAILED', label: this.$t('schedule.event_failed')}
@@ -141,14 +142,14 @@ export default {
       ],
     }
   },
-  mounted(){
+  mounted() {
     this.initForm()
   },
   methods: {
-    initForm(){
-      this.result = this.$get('/notice/search/message/'+this.testId, response => {
+    initForm() {
+      this.result = this.$get('/notice/search/message/' + this.testId, response => {
         // console.log(response.data);
-        this.form.scheduleTask = response.data;
+        this.scheduleTask = response.data;
       })
     },
     handleEdit(index, data) {
@@ -158,7 +159,7 @@ export default {
         data.webhook = '';
       }
     },
-    handleAddTaskModel(type) {
+    handleAddTaskModel() {
       let Task = {};
       Task.event = [];
       Task.userIds = [];
@@ -166,13 +167,11 @@ export default {
       Task.webhook = '';
       Task.isSet = true;
       Task.identification = '';
-      if (type === 'scheduleTask') {
-        Task.taskType = 'SCHEDULE_TASK';
-        Task.testId=this.testId;
-        this.form.scheduleTask.push(Task);
-      }
+      Task.taskType = 'SCHEDULE_TASK';
+      Task.testId = this.testId;
+      this.scheduleTask.push(Task);
     },
-    handleEditTask(index,data) {
+    handleEditTask(index, data) {
       data.isSet = true;
       data.testId = this.testId;
       if (data.type === 'EMAIL') {
diff --git a/frontend/src/business/components/settings/organization/components/TestPlanTaskNotification.vue b/frontend/src/business/components/settings/organization/components/TestPlanTaskNotification.vue
index 8c68858d0d..dc89d40597 100644
--- a/frontend/src/business/components/settings/organization/components/TestPlanTaskNotification.vue
+++ b/frontend/src/business/components/settings/organization/components/TestPlanTaskNotification.vue
@@ -11,7 +11,7 @@
     <el-row>
       <el-col :span="24">
         <el-table
-          :data="form.testCasePlanTask"
+          :data="testCasePlanTask"
           class="tb-edit"
           border
           :cell-style="rowClass"
@@ -76,7 +76,7 @@
               <el-button
                 size="mini"
                 v-show="scope.row.isSet"
-                @click.native.prevent="removeRowTask(scope.$index,form.testCasePlanTask)"
+                @click.native.prevent="removeRowTask(scope.$index,testCasePlanTask)"
               >{{ $t('commons.cancel') }}
               </el-button>
               <el-button
@@ -114,18 +114,16 @@ export default {
   },
   data() {
     return {
-      form: {
-        testCasePlanTask: [{
-          taskType: "testPlanTask",
-          event: "",
-          userIds: [],
-          type: [],
-          webhook: "",
-          isSet: true,
-          identification: "",
-          isReadOnly: false,
-        }],
-      },
+      testCasePlanTask: [{
+        taskType: "testPlanTask",
+        event: "",
+        userIds: [],
+        type: [],
+        webhook: "",
+        isSet: true,
+        identification: "",
+        isReadOnly: false,
+      }],
       otherEventOptions: [
         {value: 'CREATE', label: this.$t('commons.create')},
         {value: 'UPDATE', label: this.$t('commons.update')},
@@ -138,14 +136,11 @@ export default {
       ],
     };
   },
-  activated() {
-    this.initForm()
-  },
   methods: {
     initForm() {
       this.result = this.$get('/notice/search/message/type/' + TASK_TYPE, response => {
-        this.form.testCasePlanTask = response.data;
-        this.form.testCasePlanTask.forEach(planTask => {
+        this.testCasePlanTask = response.data;
+        this.testCasePlanTask.forEach(planTask => {
           this.handleTestPlanReceivers(planTask);
         });
       })
@@ -175,7 +170,7 @@ export default {
       Task.isSet = true;
       Task.identification = '';
       Task.taskType = TASK_TYPE
-      this.form.testCasePlanTask.push(Task)
+      this.testCasePlanTask.push(Task)
     },
     handleAddTask(index, data) {
 
@@ -236,6 +231,13 @@ export default {
       }
       row.testPlanReceiverOptions = testPlanReceivers;
     },
+  },
+  watch: {
+    testPlanReceiverOptions(value) {
+      if (value && value.length > 0) {
+        this.initForm();
+      }
+    }
   }
 }
 </script>
diff --git a/frontend/src/business/components/settings/organization/components/TestReviewNotification.vue b/frontend/src/business/components/settings/organization/components/TestReviewNotification.vue
index 2dbe6148c8..5509ffdbd8 100644
--- a/frontend/src/business/components/settings/organization/components/TestReviewNotification.vue
+++ b/frontend/src/business/components/settings/organization/components/TestReviewNotification.vue
@@ -11,7 +11,7 @@
     <el-row>
       <el-col :span="24">
         <el-table
-          :data="form.reviewTask"
+          :data="reviewTask"
           class="tb-edit"
           border
           :cell-style="rowClass"
@@ -77,7 +77,7 @@
               <el-button
                 size="mini"
                 v-show="scope.row.isSet"
-                @click.native.prevent="removeRowTask(scope.$index,form.reviewTask)"
+                @click.native.prevent="removeRowTask(scope.$index,reviewTask)"
               >{{ $t('commons.cancel') }}
               </el-button>
               <el-button
@@ -114,18 +114,16 @@ export default {
   },
   data() {
     return {
-      form: {
-        reviewTask: [{
-          taskType: "reviewTask",
-          event: "",
-          userIds: [],
-          type: [],
-          webhook: "",
-          isSet: true,
-          identification: "",
-          isReadOnly: false,
-        }],
-      },
+      reviewTask: [{
+        taskType: "reviewTask",
+        event: "",
+        userIds: [],
+        type: [],
+        webhook: "",
+        isSet: true,
+        identification: "",
+        isReadOnly: false,
+      }],
       reviewTaskEventOptions: [
         {value: 'CREATE', label: this.$t('commons.create')},
         {value: 'UPDATE', label: this.$t('commons.update')},
@@ -139,14 +137,11 @@ export default {
       ],
     };
   },
-  activated() {
-    this.initForm()
-  },
   methods: {
     initForm() {
       this.result = this.$get('/notice/search/message/type/' + TASK_TYPE, response => {
-        this.form.reviewTask = response.data;
-        this.form.reviewTask.forEach(planTask => {
+        this.reviewTask = response.data;
+        this.reviewTask.forEach(planTask => {
           this.handleReviewReceivers(planTask);
         });
       })
@@ -176,7 +171,7 @@ export default {
       Task.isSet = true;
       Task.identification = '';
       Task.taskType = TASK_TYPE
-      this.form.reviewTask.push(Task)
+      this.reviewTask.push(Task)
     },
     handleAddTask(index, data) {
 
@@ -242,6 +237,13 @@ export default {
       }
       row.reviewReceiverOptions = reviewReceiverOptions;
     }
+  },
+  watch: {
+    reviewReceiverOptions(value) {
+      if (value && value.length > 0) {
+        this.initForm();
+      }
+    }
   }
 }
 </script>