定时任务管理页面

定时任务管理页面

<template>
<div class="container">
    <el-form :inline="true" style="height:30px"> 
        <el-form-item>
            <el-input v-model="jobName" placeholder="请输入任务名称" prefix-icon="el-icon-search" size="mini"></el-input>
        </el-form-item>
        <el-form-item>
            <el-button type="primary" @click="_query" size="mini">查询</el-button>
        </el-form-item>
</el-form>
    <div style="margin-top:10px;">
        <el-table :data="jobData" class="table-format" style="width: 100%" center border max-height="600" highlight-current-row>
            <el-table-column type="index" width="60" label="序号"></el-table-column>
            <el-table-column prop="jobName" :show-overflow-tooltip="true" label="任务名称" width="160"></el-table-column>
            <el-table-column prop="triggerName" :show-overflow-tooltip="true" label="触发器名称"  width="200"></el-table-column>
            <el-table-column prop="nextFireTime" :show-overflow-tooltip="true" label="下次执行时间" width="180"></el-table-column>
            <el-table-column prop="preFireTime" :show-overflow-tooltip="true" label="上次执行时间" width="180"></el-table-column>
            <el-table-column prop="priority" :show-overflow-tooltip="true" label="优先级" width="80"></el-table-column>
<el-table-column prop="triggerState" :show-overflow-tooltip="true" label="当前状态" width="120"></el-table-column>
            <el-table-column prop="triggerType" :show-overflow-tooltip="true" label="触发器类型"  width="150"></el-table-column>
            <el-table-column prop="description" :show-overflow-tooltip="true" label="描述" width="250"></el-table-column>
            <el-table-column fixed="right" label="操作" width="280">
                <template slot-scope="scope">
                    <el-button v-if="scope.row.triggerState=='暂停'" type="primary" size="mini" @click="resume(scope.row)">启动</el-button>
                    <el-button v-if="scope.row.triggerState!='暂停'" type="warning" size="mini" @click="pause(scope.row)">暂停</el-button>
<el-button type="primary" size="mini" @click="run(scope.row)">立即执行一次</el-button>
                    <el-button type="danger" size="mini" @click="_delete(scope.row)">删除</el-button>
                    <!--
                    <el-button type="plain" size="mini">修改</el-button>
                    -->
                </template>
            </el-table-column>
        </el-table>
        <el-row>
            <el-col class="toolbar" :offset="13" :span="11">
<el-pagination 
                    @size-change="sizeChange" 
                    @current-change="currentChange" 
                    :page-sizes="[5, 10, 50, 100]" 
                    :page-size="pageSize" 
                    background 
                    layout="total, sizes, prev, pager, next, jumper" 
                    :total="total">
                </el-pagination>
            </el-col>
        </el-row>
    </div>
</div>
</template>
<script>
import axios from 'axios'
export default {
  name: 'job',
  data () {
        return {
        jobName:"",
        jobData:[],
        isStoped:false,
        total:0,
        pageSize:5,
        pageIndex:1
    }
  },
  mounted () {

  },
methods: {
    _delete(row){
    let that = this;
    if(!!row){
        axios.get('/quartz/delete',{
            params: {
                jobName: row.jobName,
                jobGroupName: row.jobGroup
            }
        }).then((data)=>{
            if(!!data && !!data.data){
                if(data.data.code=="0"){
                    that.$message({
                        message:"删除任务成功",
                        type:"success"
                    });
                }
            }
            that._query();
        });
    }
},
 run(row){
    let that = this;
    if(!!row){
        axios.get('/quartz/run',{
            params: {
                jobName: row.jobName,
                jobGroupName: row.jobGroup
            }
        }).then((data)=>{
            if(!!data && !!data.data){
                if(data.data.code=="0"){
                    that.$message({
                        message:"已发送指令",
                        type:"success"
                    });
                }
            }
            that._query();
        });
    }
},
   resume(row){
    let that = this;
    if(!!row){
        axios.get('/quartz/resume',{
            params: {
                triggerName: row.triggerName,
                triggerGroup: row.triggerGroup
            }
        }).then((data)=>{
            if(!!data && !!data.data){
                if(data.data.code=="0"){
                    that.$message({
                        message:"重启成功",
                        type:"success"
                    });
                }
            }
            that._query();
        });
    }
},
 pause(row){
    let that = this;
    if(!!row){
        if(row.triggerState=="暂停"){
            that.$message({
                message:"已经是暂停状态",
                type:"warning"
            });
            return;
        }
        axios.get('/quartz/pause',{
            params: {
                triggerName: row.triggerName,
                triggerGroup: row.triggerGroup
            }
        }).then((data)=>{
            if(!!data && !!data.data){
                if(data.data.code=="0"){
                    that.$message({
                        message:"暂停成功",
                        type:"success"
                    });
                }
            }
            that._query();
        });
    }
},
 _query(){
    this.query();
    this.queryCount();
},
    query(){
    let that=this;
    that.jobData=[];
    axios.get('/quartz/queryJob',{
        params: {
            jobName: that.jobName,
            pageIndex:that.pageIndex,
            pageSize:that.pageSize
        }
    }).then(that.initData);
},
queryCount(){
    let that = this;
    axios.get('/quartz/queryJobCount',{
        params: {
            jobName: that.jobName,
            pageIndex:that.pageIndex,
            pageSize:that.pageSize
        }
    }).then((data)=>{
        if(!!data && !!data.data && !!data.data.data){
            that.total = data.data.data;
        }
    });
},
initData(data){
    let that = this;
    if(!!data && !!data.data){
        if(!!data.data.data && data.data.data.length>0){
            that.jobData=data.data.data;
        }
    }
},
sizeChange(val){
    this.pageSize = val;
    this.query();
},
currentChange(val){
    this.pageIndex = val;
    this.query();
}
  }
}
</script>
<style>