<template>
  <div>
    <add-page-layout>
      <div slot="Header-Content">
        <span>任务调度 {{ headTitle }}</span>
        <i class="el-icon-close close" @click="$router.go(-1)" />
      </div>
      <div slot="Form-Content">
        <div style="margin: 15px">
          <el-row style="margin-top: 20px">
            <el-col>
                <el-form
                    :model="addForm.taskMainMap"
                    :rules="rules"
                    label-width="120px"
                    label-suffix=":"
                    ref="addForm"
                >
                    <el-row>
                        <el-col :span="10">
                            <el-form-item label="任务名称" prop="jobName">
                                <el-input
                                    v-model="addForm.taskMainMap.jobName"
                                    :disabled="disabled"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="10">
                            <el-form-item label="服务名称" prop="serviceName">
                                <el-input
                                    v-model="addForm.taskMainMap.serviceName"
                                    :disabled="disabled"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="10">
                            <el-form-item label="Bean名称" prop="beanName">
                                <el-input
                                    v-model="addForm.taskMainMap.beanName"
                                    :disabled="disabled"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="10">
                            <el-form-item label="执行方法" prop="methodName">
                                <el-input
                                    v-model="addForm.taskMainMap.methodName"
                                    :disabled="disabled"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="10">
                            <el-form-item label="Cron表达式" prop="cronExpression">
                                <el-input
                                    v-model="addForm.taskMainMap.cronExpression"
                                    :disabled="disabled"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="10">
                            <el-form-item label="子任务ID" prop="subTask">
                                <el-input
                                    v-model="addForm.taskMainMap.subTask"
                                    :disabled="disabled"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <!-- <el-col :span="10">
                            <el-form-item label="任务负责人" prop="governorId">
                                <el-input
                                    v-model="addForm.taskMainMap.governorId"
                                    :disabled="disabled"
                                ></el-input>
                            </el-form-item>
                        </el-col> -->
                        <el-col :span="10">
                            <el-form-item label="任务描述" prop="description">
                                <el-input
                                    v-model="addForm.taskMainMap.description"
                                    :disabled="disabled"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="10">
                            <el-form-item label="告警邮箱" prop="email">
                                <el-input
                                    v-model="addForm.taskMainMap.email"
                                    :disabled="disabled"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="10">
                            <el-form-item label="任务状态" prop="isPause">
                                <el-radio-group v-model="addForm.taskMainMap.isPause" :disabled="disabled">
                                    <el-radio
                                        v-for="item in statics.isPause"
                                        :label="item.value"
                                        :key="item.value"
                                    >
                                        {{ item.label }}
                                    </el-radio>
                                </el-radio-group>
                            </el-form-item>
                        </el-col>
                        <el-col :span="10">
                            <el-form-item label="失败后暂停" prop="pauseAfterFailure">
                                <el-radio-group v-model="addForm.taskMainMap.pauseAfterFailure" :disabled="disabled">
                                    <el-radio
                                        v-for="item in statics.pauseAfterFailure"
                                        :label="item.value"
                                        :key="item.value"
                                    >
                                        {{ item.label }}
                                    </el-radio>
                                </el-radio-group>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="10">
                            <el-form-item label="参数内容" prop="params">
                                <el-input
                                    v-model="addForm.taskMainMap.params"
                                    :disabled="disabled"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            </el-col>
            <el-col :pull="1">
                <el-row type="flex" justify="center">
                    <el-button @click="$router.go(-1)">取消</el-button>
                    <el-button
                        v-if="oper != 'detail'"
                        type="primary"
                        @click="submit"
                        :loading="submitLoading"
                    >
                        提交
                    </el-button>
                </el-row>
            </el-col>
          </el-row>
        </div>
      </div>
    </add-page-layout>
  </div>
</template>

<script>
import { addTaskList, updateTaskList } from "./api/taskScheduing";
export default {
  name: "taskScheduingAdd",
  data() {
    return {
      headTitle: "",
      oper: "",
      addForm: {
        taskMainMap: {
          jobName: "",
          description: "",
          beanName: "",
          methodName: "",
          cronExpression: "",
          subTask: "",
          governorId: "1",
          email: "",
          pauseAfterFailure: "1",
          isPause: "0",
          serviceName: "",
          params: "",
        }
      },
      rules: {
        jobName: [
          { required: true, message: "任务名称不能为空", trigger: "blur" },
        ],
        serviceName: [
          { required: true, message: "服务名称不能为空", trigger: "blur" },
        ],
        beanName: [
          { required: true, message: "Bean名称不能为空", trigger: "blur" },
        ],
        methodName: [
          { required: true, message: "执行方法不能为空", trigger: "blur" },
        ],
        cronExpression: [
          { required: true, message: "Cron表达式不能为空", trigger: "blur" },
        ],
        governorId: [
          { required: true, message: "任务负责人不能为空", trigger: "blur" },
        ],
        serviceName: [
          { required: true, message: "服务名称不能为空", trigger: "blur" },
        ],
        description: [
          { required: true, message: "任务描述不能为空", trigger: "blur" },
        ]
      },
      statics: {
        isPause: [
          {
            value: "0",
            label: "启用",
          },
          {
            value: "1",
            label: "暂停",
          }
        ],
        pauseAfterFailure: [
          {
            value: "0",
            label: "否",
          },
          {
            value: "1",
            label: "是",
          }
        ],
      },
      submitLoading: false,
      disabled: false,
    };
  },
  created() {
    this.oper = this.$route.params.oper;
    if (this.oper == "detail") {
      this.disabled = true;
      this.headTitle = "查看";
    } else if (this.oper == "add") {
      this.headTitle = "新增";
    } else if (this.oper == "modify") {
      this.headTitle = "修改";
    }

    if (this.oper != "add") this.backFill();
  },
  methods: {
    backFill() {
        this.addForm.taskMainMap = JSON.parse(decodeURIComponent(this.$route.params.row))
    },
    submit() {
        let params = JSON.parse(JSON.stringify(this.addForm));
        this.$refs["addForm"].validate((valid) => {
            if (valid) {
                this.submitLoading = true;
                let interfacs = this.oper == 'add' ? addTaskList : updateTaskList
                interfacs(params).then(
                    resp => {
                        if (resp.data.returnCode == '0') {
                            this.$message.success(`${this.headTitle}成功!`);                            
                            this.$router.go(-1)
                        }
                        this.submitLoading = false;
                    }, error => {
                        this.submitLoading = false;
                        this.$message.error(error.message)
                    }
                );
            }
        });
    }
  },
};
</script>
