<template>
  <div class="main">
    <el-card style="margin-bottom: 5px">
      <t-search :search="search" @searchClick="searchClick" />
    </el-card>

    <el-card :body-style="{ padding: '5px 10px' }">
      <t-table :tableData="tableData" :tableLoading="tableLoading" @clickBtn="handleClickBtn(arguments)" />
      <el-pagination @current-change="handleCurrentChange" @size-change="handleSizeChange"
        layout="total, prev, pager, next, sizes" :page-size="pagination.pageSize" :page-sizes="[10, 50, 100, 500,1000]"
        :current-page="pagination.pageNum" :total="pagination.total">
      </el-pagination>
    </el-card>

    <!-- 新增 -->
    <add-task :visible="isShowAddTask" :form="form" :title="title" @clickAdd="handleClickAdd" @clickEdit="handleClickEdit" @cancel="cancel"></add-task>
    <!-- 详情 -->
    <detail :visible="isShowDetail" :form="currentRow" @cancel="cancel"></detail>
  </div>
</template>
<script>
import {list,addJob,editJob,oneRun,changeStatus,remove} from "@/api/system-management/timedTask.js";
import tSearch from "./components/search";
import tTable from "./components/table";
import { mixin } from "@/mixins/common";
import { mapState, mapGetters, mapActions } from "vuex";
import { clearObjValue, dateFormatT, message } from "@/utils/common";
import AddTask from "./components/addTask.vue";
import Detail from "./components/detail.vue";
export default {
  mixins: [mixin],
  data() {
    return {
      currentRow:{},
      isShowDetail:false,
      title:'',
      form:{
        jobName:'',
        jobGroup:'',
        invokeTarget:'',
        cronExpression:'',
        status:'0',
        misfirePolicy:1,
        concurrent:1,
      },
      isShowAddTask:false,
      search: {
        jobName:''
      },
      tableData: [],
      pagination: {
        pageNum: 1,
        pageSize: 10,
        total: 0,
      },
      tableLoading: false,
    };
  },
  components: {
    tSearch,
    tTable,
    AddTask,
    Detail
  },
  computed: {
    ...mapState({
      // tableData: (state) => state.operatorNote.tableData,
      // page: (state) => state.operatorNote.page,
    }),
  },
  methods: {
    // 点击table按钮
    handleClickBtn(params){
      let type = params[0];
      let row = params[1];
      if(type == 'edit'){
        this.form = {
          jobName:row.jobName,
          jobGroup:row.jobGroup,
          invokeTarget:row.invokeTarget,
          cronExpression:row.cronExpression,
          status:row.status+'',
          misfirePolicy:row.misfirePolicy,
          concurrent:row.concurrent,
          jobId:row.jobId
        }
        this.isShowAddTask = true;
        this.title = '修改任务';
      }else if(type == 'delete'){
        this.$confirm("此操作将永久删除该定时任务, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }).then(() => {
          let arr = [];
          arr.push(row.jobId);
          remove(arr).then((res) => {
            message("success", "删除成功", 3000);
            this.getData();
          });
        }).catch(() => {});
      }else if(type == 'status'){
        let _statusText = row.status==0?'启动':'暂停';
        this.$confirm(`此操作将修改该定时任务为${_statusText}状态, 是否继续?`, "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }).then(() => {
          changeStatus({jobId:row.jobId,status:row.status}).then((res) => {
            if(res.code == 100){
              message("success", "状态修改成功", 3000);
              this.getData();
            }
          });
        }).catch(() => {
          this.getData();
        });
      }else if(type == 'once'){
        this.$confirm(`此操作将该定时任务执行一次, 是否继续?`, "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }).then(() => {
          oneRun({jobId:row.jobId, jobGroup:row.jobGroup}).then((res) => {
            if(res.code == 100){
              message("success", "任务执行成功", 3000);
              this.getData();
            }
          });
        }).catch(() => {});
      }else if(type == 'detail'){
        this.currentRow = row;
        this.isShowDetail = true;
      }
    },
    // 获取列表
    getData() {
      this.tableLoading = true;
      this.params = {
        page: this.pagination.pageNum,
        limit: this.pagination.pageSize,
        jobName:this.search.jobName
        
      };
      list(this.params).then((res) => {
          this.tableData = res.body.list;
          this.pagination.total = res.body.total;
        }).finally((res) => {
          this.tableLoading = false;
        });
    },
    // 点击事件
    searchClick(val) {
      switch (val) {
        case 1:
          this.getData();
          break;
        case 2:
          clearObjValue(this.search);
          break;
        case 3:
          this.title = '新增任务';
          this.isShowAddTask = true;
          break;
      }
    },
    // 添加
    handleClickAdd(params){
      addJob(params).then((res)=>{
        if(res.code == 100){
          message('success',res.msg,3000);
          this.getData();
        }
      }).finally(()=>{
        this.isShowAddTask = false;
        this.form = {
          jobName:'',
          jobGroup:'',
          invokeTarget:'',
          cronExpression:'',
          status:'0',
          misfirePolicy:1,
          concurrent:1,
        }
      })
    },
    // 修改
    handleClickEdit(params){
      editJob(params).then((res)=>{
        if(res.code == 100){
          message('success',res.msg,3000);
          this.getData();
        }
      }).finally(()=>{
        this.isShowAddTask = false;
        this.form = {
          jobName:'',
          jobGroup:'',
          invokeTarget:'',
          cronExpression:'',
          status:'0',
          misfirePolicy:1,
          concurrent:1,
        }
      })
    },
    cancel(){
      this.isShowAddTask = false;
      this.isShowDetail = false;
      this.form = {
        jobName:'',
        jobGroup:'',
        invokeTarget:'',
        cronExpression:'',
        status:'0',
        misfirePolicy:1,
        concurrent:1,
      }
    },
    handleCurrentChange(val) {
      this.pagination.pageNum = val;
      this.getData();
    },
    handleSizeChange(val) {
      this.pagination.pageSize = val;
      this.getData();
    },
  },
  created() {
    this.getData();
  },
};
</script>
<style lang="scss" scoped>
.main {
  // padding: 10px;
}
</style>
