From 137d714003989369480803022e3d31c101f1145f Mon Sep 17 00:00:00 2001
From: "song.tianyang" <tianyang.song@fit2cloud.com>
Date: Wed, 27 Jan 2021 19:13:27 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=AE=BE=E7=BD=AE=E5=AE=9A=E6=97=B6?=
 =?UTF-8?q?=E4=BB=BB=E5=8A=A1=E7=9A=84=E5=BC=B9=E7=AA=97=E4=B8=AD=E5=A2=9E?=
 =?UTF-8?q?=E5=8A=A0=E6=BB=91=E5=8A=A8=E5=BC=80=E5=85=B3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

设置定时任务的弹窗中增加滑动开关
---
 .../automation/schedule/ScheduleMaintain.vue  | 56 +++++++++++--
 .../automation/schedule/ScheduleSwitch.vue    | 82 +++++++++++++++++++
 2 files changed, 131 insertions(+), 7 deletions(-)
 create mode 100644 frontend/src/business/components/api/automation/schedule/ScheduleSwitch.vue

diff --git a/frontend/src/business/components/api/automation/schedule/ScheduleMaintain.vue b/frontend/src/business/components/api/automation/schedule/ScheduleMaintain.vue
index b0ff4810af..9e151962c5 100644
--- a/frontend/src/business/components/api/automation/schedule/ScheduleMaintain.vue
+++ b/frontend/src/business/components/api/automation/schedule/ScheduleMaintain.vue
@@ -8,12 +8,22 @@
             <el-form :model="form" :rules="rules" ref="from">
               <el-form-item
                 prop="cronValue">
-                <el-input :disabled="isReadOnly" v-model="form.cronValue" class="inp"
-                          :placeholder="$t('schedule.please_input_cron_expression')"/>
-                <el-button :disabled="isReadOnly" type="primary" @click="saveCron" v-tester>{{
-                    $t('commons.save')
-                  }}
-                </el-button>
+                <el-row>
+                  <el-col :span="18">
+                    <el-input :disabled="isReadOnly" v-model="form.cronValue" class="inp"
+                              :placeholder="$t('schedule.please_input_cron_expression')"/>
+                    <el-button :disabled="isReadOnly" type="primary" @click="saveCron" v-tester>{{
+                        $t('commons.save')
+                      }}
+                    </el-button>
+                  </el-col>
+                  <el-col :span="6">
+                    <schedule-switch :schedule="schedule" @scheduleChange="scheduleChange"></schedule-switch>
+                  </el-col>
+                </el-row>
+
+
+
               </el-form-item>
               <el-form-item>
                 <el-link :disabled="isReadOnly" type="primary" @click="showCronDialog">
@@ -44,6 +54,7 @@ import Crontab from "@/business/components/common/cron/Crontab";
 import CrontabResult from "@/business/components/common/cron/CrontabResult";
 import {cronValidate} from "@/common/js/cron";
 import MsScheduleNotification from "./ScheduleNotification";
+import ScheduleSwitch from "@/business/components/api/automation/schedule/ScheduleSwitch";
 
 function defaultCustomValidate() {
   return {pass: true};
@@ -55,7 +66,7 @@ const noticeTemplate = requireComponent.keys().length > 0 ? requireComponent("./
 
 export default {
   name: "MsScheduleMaintain",
-  components: {CrontabResult, Crontab, MsScheduleNotification, "NoticeTemplate": noticeTemplate.default},
+  components: {CrontabResult, ScheduleSwitch,Crontab, MsScheduleNotification, "NoticeTemplate": noticeTemplate.default},
 
   props: {
     customValidate: {
@@ -100,6 +111,7 @@ export default {
       form: {
         cronValue: ""
       },
+      paramRow:{},
       activeName: 'first',
       rules: {
         cronValue: [{required: true, validator: validateCron, trigger: 'blur'}],
@@ -110,6 +122,35 @@ export default {
     currentUser: () => {
       return getCurrentUser();
     },
+    scheduleChange(){
+      let flag = this.schedule.enable;
+      this.$confirm(this.$t('api_test.home_page.running_task_list.confirm.close_title'), this.$t('commons.prompt'), {
+        confirmButtonText: this.$t('commons.confirm'),
+        cancelButtonText: this.$t('commons.cancel'),
+        type: 'warning'
+      }).then(() => {
+        let param = {};
+        param.taskID = this.schedule.id;
+        param.enable = flag;
+        this.updateTask(param);
+      }).catch(() => {
+      });
+
+    },
+    updateTask(param){
+      this.result = this.$post('/api/schedule/updateEnableByPrimyKey', param, response => {
+        let paramTestId = "";
+        if (this.paramRow.redirectFrom == 'testPlan') {
+          paramTestId = this.paramRow.id;
+          this.scheduleTaskType = "TEST_PLAN_TEST";
+        } else {
+          paramTestId = this.paramRow.id;
+          this.scheduleTaskType = "API_SCENARIO_TEST";
+        }
+        this.taskID = paramTestId;
+        this.findSchedule(paramTestId);
+      });
+    },
     initUserList() {
       let param = {
         name: '',
@@ -132,6 +173,7 @@ export default {
     open(row) {
       //测试计划页面跳转来的
       let paramTestId = "";
+      this.paramRow = row;
       if (row.redirectFrom == 'testPlan') {
         paramTestId = row.id;
         this.scheduleTaskType = "TEST_PLAN_TEST";
diff --git a/frontend/src/business/components/api/automation/schedule/ScheduleSwitch.vue b/frontend/src/business/components/api/automation/schedule/ScheduleSwitch.vue
new file mode 100644
index 0000000000..9f2f140d5b
--- /dev/null
+++ b/frontend/src/business/components/api/automation/schedule/ScheduleSwitch.vue
@@ -0,0 +1,82 @@
+<template>
+  <div class="schedule-config">
+    <div>
+        <span class="cron-ico">
+          <i class="el-icon-date" size="small"></i>
+          <span class="character">SCHEDULER</span>
+        </span>
+<!--      <el-switch :disabled="!schedule.value || isReadOnly" v-model="schedule.enable" @change="scheduleChange"/>-->
+<!--      <el-switch :disabled="!schedule.value || isReadOnly" v-model="schedule.enable" />-->
+      <el-switch :disabled="!schedule.value" v-model="schedule.enable" @change="scheduleChange"/>
+    </div>
+    <div>
+        <span>
+          {{ $t('schedule.next_execution_time') }}：
+          <span :class="{'disable-character': !schedule.enable}"
+                v-if="!schedule.enable">{{ $t('schedule.not_set') }}</span>
+          <crontab-result v-if="schedule.enable" :enable-simple-mode="true" :ex="schedule.value" ref="crontabResult"/>
+        </span>
+    </div>
+  </div>
+</template>
+
+<script>
+import CrontabResult from "@/business/components/common/cron/CrontabResult";
+
+export default {
+  name: "ScheduleSwitch",
+  components: {CrontabResult},
+  data() {
+    return {
+    }
+  },
+  props: {
+    testId: String,
+    schedule: Object,
+    isReadOnly: {
+      type: Boolean,
+      default: false
+    }
+  },
+  methods: {
+    scheduleChange() {
+      this.$emit('scheduleChange');
+    },
+  },
+  watch: {
+  }
+}
+</script>
+
+<style scoped>
+
+.schedule-config {
+  float: right;
+  width: 250px;
+  height: 15px;
+  line-height: 25px;
+}
+
+.el-icon-date {
+  font-size: 20px;
+  margin-left: 5px;
+}
+
+.character {
+  font-weight: bold;
+  margin: 0 5px;
+}
+
+.disable-character {
+  color: #cccccc;
+}
+
+.el-switch {
+  margin: 0 5px;
+}
+
+.cron-ico {
+  cursor: pointer;
+}
+
+</style>