XiaoMo/x-php-Admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

no message

Browse Source
This commit is contained in:
小陌 2023-06-27 14:12:01 +08:00
parent 034f4a60db
commit d292889c68
5 changed files with 295 additions and 321 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

256
src/components/scCron/index.vue
View File

@ -14,12 +14,12 @@
<el-button icon="el-icon-arrow-down"></el-button> <el-button icon="el-icon-arrow-down"></el-button>
<template #dropdown> <template #dropdown>
<el-dropdown-menu> <el-dropdown-menu>
<el-dropdown-item command="0 * * * * ?">每分钟</el-dropdown-item> <el-dropdown-item command="* * * * *">每分钟</el-dropdown-item>
<el-dropdown-item command="0 0 * * * ?">每小时</el-dropdown-item> <el-dropdown-item command="0 * * * *">每小时</el-dropdown-item>
<el-dropdown-item command="0 0 0 * * ?">每天零点</el-dropdown-item> <el-dropdown-item command="0 0 * * *">每天零点</el-dropdown-item>
<el-dropdown-item command="0 0 0 1 * ?">每月一号零点</el-dropdown-item> <el-dropdown-item command="0 0 1 * *">每月一号零点</el-dropdown-item>
<el-dropdown-item command="0 0 0 L * ?">每月最后一天零点</el-dropdown-item> <el-dropdown-item command="0 0 L * *">每月最后一天零点</el-dropdown-item>
<el-dropdown-item command="0 0 0 ? * 1">每周星期日零点</el-dropdown-item> <el-dropdown-item command="0 0 * * 1">每周星期日零点</el-dropdown-item>
<el-dropdown-item v-for="(item, index) in shortcuts" :key="item.value" :divided="index==0" :command="item.value">{{item.text}}</el-dropdown-item> <el-dropdown-item v-for="(item, index) in shortcuts" :key="item.value" :divided="index==0" :command="item.value">{{item.text}}</el-dropdown-item>
<el-dropdown-item icon="el-icon-plus" divided command="custom">自定义</el-dropdown-item> <el-dropdown-item icon="el-icon-plus" divided command="custom">自定义</el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
@ -31,7 +31,7 @@
<el-dialog title="cron规则生成器" v-model="dialogVisible" :width="580" destroy-on-close append-to-body> <el-dialog title="cron规则生成器" v-model="dialogVisible" :width="580" destroy-on-close append-to-body>
<div class="sc-cron"> <div class="sc-cron">
<el-tabs> <el-tabs>
<el-tab-pane> <!-- <el-tab-pane>
<template #label> <template #label>
<div class="sc-cron-num"> <div class="sc-cron-num">
<h2>秒</h2> <h2>秒</h2>
@ -54,9 +54,9 @@
</el-form-item> </el-form-item>
<el-form-item label="间隔" v-if="value.second.type==2"> <el-form-item label="间隔" v-if="value.second.type==2">
<el-input-number v-model="value.second.loop.start" :min="0" :max="59" controls-position="right"></el-input-number> <el-input-number v-model="value.second.loop.start" :min="0" :max="59" controls-position="right"></el-input-number>
秒开始，每 <span style="padding: 0 6px;">秒开始，每</span>
<el-input-number v-model="value.second.loop.end" :min="0" :max="59" controls-position="right"></el-input-number> <el-input-number v-model="value.second.loop.end" :min="0" :max="59" controls-position="right"></el-input-number>
秒执行一次 <span style="padding: 0 6px;">秒执行一次</span>
</el-form-item> </el-form-item>
<el-form-item label="指定" v-if="value.second.type==3"> <el-form-item label="指定" v-if="value.second.type==3">
<el-select v-model="value.second.appoint" multiple style="width: 100%;"> <el-select v-model="value.second.appoint" multiple style="width: 100%;">
@ -64,7 +64,7 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-form> </el-form>
</el-tab-pane> </el-tab-pane> -->
<el-tab-pane> <el-tab-pane>
<template #label> <template #label>
<div class="sc-cron-num"> <div class="sc-cron-num">
@ -88,9 +88,9 @@
</el-form-item> </el-form-item>
<el-form-item label="间隔" v-if="value.minute.type==2"> <el-form-item label="间隔" v-if="value.minute.type==2">
<el-input-number v-model="value.minute.loop.start" :min="0" :max="59" controls-position="right"></el-input-number> <el-input-number v-model="value.minute.loop.start" :min="0" :max="59" controls-position="right"></el-input-number>
分钟开始，每 <span style="padding: 0 6px;">分钟开始，每</span>
<el-input-number v-model="value.minute.loop.end" :min="0" :max="59" controls-position="right"></el-input-number> <el-input-number v-model="value.minute.loop.end" :min="0" :max="59" controls-position="right"></el-input-number>
分钟执行一次 <span style="padding: 0 6px;">分钟执行一次</span>
</el-form-item> </el-form-item>
<el-form-item label="指定" v-if="value.minute.type==3"> <el-form-item label="指定" v-if="value.minute.type==3">
<el-select v-model="value.minute.appoint" multiple style="width: 100%;"> <el-select v-model="value.minute.appoint" multiple style="width: 100%;">
@ -122,9 +122,9 @@
</el-form-item> </el-form-item>
<el-form-item label="间隔" v-if="value.hour.type==2"> <el-form-item label="间隔" v-if="value.hour.type==2">
<el-input-number v-model="value.hour.loop.start" :min="0" :max="23" controls-position="right"></el-input-number> <el-input-number v-model="value.hour.loop.start" :min="0" :max="23" controls-position="right"></el-input-number>
小时开始，每 <span style="padding: 0 6px;">小时开始，每</span>
<el-input-number v-model="value.hour.loop.end" :min="0" :max="23" controls-position="right"></el-input-number> <el-input-number v-model="value.hour.loop.end" :min="0" :max="23" controls-position="right"></el-input-number>
小时执行一次 <span style="padding: 0 6px;">小时执行一次</span>
</el-form-item> </el-form-item>
<el-form-item label="指定" v-if="value.hour.type==3"> <el-form-item label="指定" v-if="value.hour.type==3">
<el-select v-model="value.hour.appoint" multiple style="width: 100%;"> <el-select v-model="value.hour.appoint" multiple style="width: 100%;">
@ -148,7 +148,7 @@
<el-radio-button label="2">间隔</el-radio-button> <el-radio-button label="2">间隔</el-radio-button>
<el-radio-button label="3">指定</el-radio-button> <el-radio-button label="3">指定</el-radio-button>
<el-radio-button label="4">本月最后一天</el-radio-button> <el-radio-button label="4">本月最后一天</el-radio-button>
<el-radio-button label="5">不指定</el-radio-button> <!-- <el-radio-button label="5">不指定</el-radio-button> -->
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item label="范围" v-if="value.day.type==1"> <el-form-item label="范围" v-if="value.day.type==1">
@ -158,9 +158,9 @@
</el-form-item> </el-form-item>
<el-form-item label="间隔" v-if="value.day.type==2"> <el-form-item label="间隔" v-if="value.day.type==2">
<el-input-number v-model="value.day.loop.start" :min="1" :max="31" controls-position="right"></el-input-number> <el-input-number v-model="value.day.loop.start" :min="1" :max="31" controls-position="right"></el-input-number>
号开始，每 <span style="padding: 0 6px;">号开始，每</span>
<el-input-number v-model="value.day.loop.end" :min="1" :max="31" controls-position="right"></el-input-number> <el-input-number v-model="value.day.loop.end" :min="1" :max="31" controls-position="right"></el-input-number>
天执行一次 <span style="padding: 0 6px;">天执行一次</span>
</el-form-item> </el-form-item>
<el-form-item label="指定" v-if="value.day.type==3"> <el-form-item label="指定" v-if="value.day.type==3">
<el-select v-model="value.day.appoint" multiple style="width: 100%;"> <el-select v-model="value.day.appoint" multiple style="width: 100%;">
@ -192,9 +192,9 @@
</el-form-item> </el-form-item>
<el-form-item label="间隔" v-if="value.month.type==2"> <el-form-item label="间隔" v-if="value.month.type==2">
<el-input-number v-model="value.month.loop.start" :min="1" :max="12" controls-position="right"></el-input-number> <el-input-number v-model="value.month.loop.start" :min="1" :max="12" controls-position="right"></el-input-number>
月开始，每 <span style="padding: 0 6px;">月开始，每</span>
<el-input-number v-model="value.month.loop.end" :min="1" :max="12" controls-position="right"></el-input-number> <el-input-number v-model="value.month.loop.end" :min="1" :max="12" controls-position="right"></el-input-number>
月执行一次 <span style="padding: 0 6px;">月执行一次</span>
</el-form-item> </el-form-item>
<el-form-item label="指定" v-if="value.month.type==3"> <el-form-item label="指定" v-if="value.month.type==3">
<el-select v-model="value.month.appoint" multiple style="width: 100%;"> <el-select v-model="value.month.appoint" multiple style="width: 100%;">
@ -219,7 +219,7 @@
<el-radio-button label="2">间隔</el-radio-button> <el-radio-button label="2">间隔</el-radio-button>
<el-radio-button label="3">指定</el-radio-button> <el-radio-button label="3">指定</el-radio-button>
<el-radio-button label="4">本月最后一周</el-radio-button> <el-radio-button label="4">本月最后一周</el-radio-button>
<el-radio-button label="5">不指定</el-radio-button> <!-- <el-radio-button label="5">不指定</el-radio-button> -->
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item label="范围" v-if="value.week.type==1"> <el-form-item label="范围" v-if="value.week.type==1">
@ -234,11 +234,11 @@
<el-form-item label="间隔" v-if="value.week.type==2"> <el-form-item label="间隔" v-if="value.week.type==2">
第 第
<el-input-number v-model="value.week.loop.start" :min="1" :max="4" controls-position="right"></el-input-number> <el-input-number v-model="value.week.loop.start" :min="1" :max="4" controls-position="right"></el-input-number>
周的星期 <span style="padding: 0 6px;">周的星期</span>
<el-select v-model="value.week.loop.end"> <el-select v-model="value.week.loop.end">
<el-option v-for="(item, index) in data.week" :key="index" :label="item.label" :value="item.value"></el-option> <el-option v-for="(item, index) in data.week" :key="index" :label="item.label" :value="item.value"></el-option>
</el-select> </el-select>
执行一次 <span style="padding: 0 6px;">执行一次</span>
</el-form-item> </el-form-item>
<el-form-item label="指定" v-if="value.week.type==3"> <el-form-item label="指定" v-if="value.week.type==3">
<el-select v-model="value.week.appoint" multiple style="width: 100%;"> <el-select v-model="value.week.appoint" multiple style="width: 100%;">
@ -277,9 +277,9 @@
</el-form-item> </el-form-item>
<el-form-item label="间隔" v-if="value.year.type==2"> <el-form-item label="间隔" v-if="value.year.type==2">
<el-input-number v-model="value.year.loop.start" controls-position="right"></el-input-number> <el-input-number v-model="value.year.loop.start" controls-position="right"></el-input-number>
年开始，每 <span style="padding: 0 6px;">年开始，每</span>
<el-input-number v-model="value.year.loop.end" :min="1" controls-position="right"></el-input-number> <el-input-number v-model="value.year.loop.end" :min="1" controls-position="right"></el-input-number>
年执行一次 <span style="padding: 0 6px;">年执行一次</span>
</el-form-item> </el-form-item>
<el-form-item label="指定" v-if="value.year.type==3"> <el-form-item label="指定" v-if="value.year.type==3">
<el-select v-model="value.year.appoint" multiple style="width: 100%;"> <el-select v-model="value.year.appoint" multiple style="width: 100%;">
@ -301,7 +301,7 @@
<script> <script>
export default { export default {
props: { props: {
modelValue: { type: String, default: "* * * * * ?" }, modelValue: { type: String, default: "* * * * *" },
shortcuts: { type: Array, default: () => [] } shortcuts: { type: Array, default: () => [] }
}, },
data() { data() {
@ -311,18 +311,18 @@
dialogVisible: false, dialogVisible: false,
value:{ value:{
second: { // second: {
type: '0', // type: '0',
range: { // range: {
start: 1, // start: 1,
end: 2 // end: 2
}, // },
loop: { // loop: {
start: 0, // start: 0,
end: 1 // end: 1
}, // },
appoint: [] // appoint: []
}, // },
minute: { minute: {
type: '0', type: '0',
range: { range: {
@ -398,7 +398,7 @@
} }
}, },
data: { data: {
second: ['0','5','15','20','25','30','35','40','45','50','55','59'], // second: ['0','5','15','20','25','30','35','40','45','50','55','59'],
minute: ['0','5','15','20','25','30','35','40','45','50','55','59'], minute: ['0','5','15','20','25','30','35','40','45','50','55','59'],
hour: ['0','1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20','21','22','23'], hour: ['0','1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20','21','22','23'],
day: ['1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20','21','22','23','24','25','26','27','28','29','30','31'], day: ['1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20','21','22','23','24','25','26','27','28','29','30','31'],
@ -439,13 +439,13 @@
}, },
watch: { watch: {
'value.week.type'(val){ 'value.week.type'(val){
if(val != '5'){ if(val != '0'){
this.value.day.type = '5' this.value.day.type = '0'
} }
}, },
'value.day.type'(val){ 'value.day.type'(val){
if(val != '5'){ if(val != '0'){
this.value.week.type = '5' this.value.week.type = '0'
} }
}, },
modelValue() { modelValue() {
@ -453,20 +453,20 @@
} }
}, },
computed: { computed: {
value_second(){ // value_second(){
let v = this.value.second // let v = this.value.second
if(v.type == 0){ // if(v.type == 0){
return '*' // return '*'
}else if(v.type==1){ // }else if(v.type==1){
return v.range.start + '-' +v.range.end // return v.range.start + '-' +v.range.end
}else if(v.type==2){ // }else if(v.type==2){
return v.loop.start + '/' + v.loop.end // return v.loop.start + '/' + v.loop.end
}else if(v.type==3){ // }else if(v.type==3){
return v.appoint.length>0 ? v.appoint.join(',') : '*' // return v.appoint.length>0 ? v.appoint.join(',') : '*'
}else{ // }else{
return '*' // return '*'
} // }
}, // },
value_minute(){ value_minute(){
let v = this.value.minute let v = this.value.minute
if(v.type == 0){ if(v.type == 0){
@ -580,128 +580,128 @@
}, },
set(){ set(){
this.defaultValue = this.modelValue this.defaultValue = this.modelValue
let arr = (this.modelValue || "* * * * * ?").split(" ") let arr = (this.modelValue || "* * * * *").split(" ")
//简单检查 //简单检查
if(arr.length < 6){ if(arr.length < 5){
this.$message.warning("cron表达式错误，已转换为默认表达式") this.$message.warning("cron表达式错误，已转换为默认表达式")
arr = "* * * * * ?".split(" ") arr = "* * * * *".split(" ")
} }
//秒 //秒
if(arr[0]=='*'){ // if(arr[0]=='*'){
this.value.second.type = '0' // this.value.second.type = '0'
}else if(arr[0].includes('-')){ // }else if(arr[0].includes('-')){
this.value.second.type = '1' // this.value.second.type = '1'
this.value.second.range.start = Number(arr[0].split("-")[0]) // this.value.second.range.start = Number(arr[0].split("-")[0])
this.value.second.range.end = Number(arr[0].split("-")[1]) // this.value.second.range.end = Number(arr[0].split("-")[1])
}else if(arr[0].includes('/')){ // }else if(arr[0].includes('/')){
this.value.second.type = '2' // this.value.second.type = '2'
this.value.second.loop.start = Number(arr[0].split("/")[0]) // this.value.second.loop.start = Number(arr[0].split("/")[0])
this.value.second.loop.end = Number(arr[0].split("/")[1]) // this.value.second.loop.end = Number(arr[0].split("/")[1])
}else{ // }else{
this.value.second.type = '3' // this.value.second.type = '3'
this.value.second.appoint = arr[0].split(",") // this.value.second.appoint = arr[0].split(",")
} // }
//分 //分
if(arr[1]=='*'){ if(arr[0]=='*'){
this.value.minute.type = '0' this.value.minute.type = '0'
}else if(arr[1].includes('-')){ }else if(arr[0].includes('-')){
this.value.minute.type = '1' this.value.minute.type = '1'
this.value.minute.range.start = Number(arr[1].split("-")[0]) this.value.minute.range.start = Number(arr[0].split("-")[0])
this.value.minute.range.end = Number(arr[1].split("-")[1]) this.value.minute.range.end = Number(arr[0].split("-")[1])
}else if(arr[1].includes('/')){ }else if(arr[0].includes('/')){
this.value.minute.type = '2' this.value.minute.type = '2'
this.value.minute.loop.start = Number(arr[1].split("/")[0]) this.value.minute.loop.start = Number(arr[0].split("/")[0])
this.value.minute.loop.end = Number(arr[1].split("/")[1]) this.value.minute.loop.end = Number(arr[0].split("/")[1])
}else{ }else{
this.value.minute.type = '3' this.value.minute.type = '3'
this.value.minute.appoint = arr[1].split(",") this.value.minute.appoint = arr[0].split(",")
} }
//小时 //小时
if(arr[2]=='*'){ if(arr[1]=='*'){
this.value.hour.type = '0' this.value.hour.type = '0'
}else if(arr[2].includes('-')){ }else if(arr[1].includes('-')){
this.value.hour.type = '1' this.value.hour.type = '1'
this.value.hour.range.start = Number(arr[2].split("-")[0]) this.value.hour.range.start = Number(arr[1].split("-")[0])
this.value.hour.range.end = Number(arr[2].split("-")[1]) this.value.hour.range.end = Number(arr[1].split("-")[1])
}else if(arr[2].includes('/')){ }else if(arr[1].includes('/')){
this.value.hour.type = '2' this.value.hour.type = '2'
this.value.hour.loop.start = Number(arr[2].split("/")[0]) this.value.hour.loop.start = Number(arr[1].split("/")[0])
this.value.hour.loop.end = Number(arr[2].split("/")[1]) this.value.hour.loop.end = Number(arr[1].split("/")[1])
}else{ }else{
this.value.hour.type = '3' this.value.hour.type = '3'
this.value.hour.appoint = arr[2].split(",") this.value.hour.appoint = arr[1].split(",")
} }
//日 //日
if(arr[3]=='*'){ if(arr[2]=='*'){
this.value.day.type = '0' this.value.day.type = '0'
}else if(arr[3]=='L'){ }else if(arr[2]=='L'){
this.value.day.type = '4' this.value.day.type = '4'
}else if(arr[3]=='?'){ }else if(arr[2]=='?'){
this.value.day.type = '5' this.value.day.type = '5'
}else if(arr[3].includes('-')){ }else if(arr[2].includes('-')){
this.value.day.type = '1' this.value.day.type = '1'
this.value.day.range.start = Number(arr[3].split("-")[0]) this.value.day.range.start = Number(arr[2].split("-")[0])
this.value.day.range.end = Number(arr[3].split("-")[1]) this.value.day.range.end = Number(arr[2].split("-")[1])
}else if(arr[3].includes('/')){ }else if(arr[2].includes('/')){
this.value.day.type = '2' this.value.day.type = '2'
this.value.day.loop.start = Number(arr[3].split("/")[0]) this.value.day.loop.start = Number(arr[2].split("/")[0])
this.value.day.loop.end = Number(arr[3].split("/")[1]) this.value.day.loop.end = Number(arr[2].split("/")[1])
}else{ }else{
this.value.day.type = '3' this.value.day.type = '3'
this.value.day.appoint = arr[3].split(",") this.value.day.appoint = arr[2].split(",")
} }
//月 //月
if(arr[4]=='*'){ if(arr[3]=='*'){
this.value.month.type = '0' this.value.month.type = '0'
}else if(arr[4].includes('-')){ }else if(arr[3].includes('-')){
this.value.month.type = '1' this.value.month.type = '1'
this.value.month.range.start = Number(arr[4].split("-")[0]) this.value.month.range.start = Number(arr[3].split("-")[0])
this.value.month.range.end = Number(arr[4].split("-")[1]) this.value.month.range.end = Number(arr[3].split("-")[1])
}else if(arr[4].includes('/')){ }else if(arr[3].includes('/')){
this.value.month.type = '2' this.value.month.type = '2'
this.value.month.loop.start = Number(arr[4].split("/")[0]) this.value.month.loop.start = Number(arr[3].split("/")[0])
this.value.month.loop.end = Number(arr[4].split("/")[1]) this.value.month.loop.end = Number(arr[3].split("/")[1])
}else{ }else{
this.value.month.type = '3' this.value.month.type = '3'
this.value.month.appoint = arr[4].split(",") this.value.month.appoint = arr[3].split(",")
} }
//周 //周
if(arr[5]=='*'){ if(arr[4]=='*'){
this.value.week.type = '0' this.value.week.type = '0'
}else if(arr[5]=='?'){ }else if(arr[4]=='?'){
this.value.week.type = '5' this.value.week.type = '5'
}else if(arr[5].includes('-')){ }else if(arr[4].includes('-')){
this.value.week.type = '1' this.value.week.type = '1'
this.value.week.range.start = arr[5].split("-")[0] this.value.week.range.start = arr[4].split("-")[0]
this.value.week.range.end = arr[5].split("-")[1] this.value.week.range.end = arr[4].split("-")[1]
}else if(arr[5].includes('#')){ }else if(arr[4].includes('#')){
this.value.week.type = '2' this.value.week.type = '2'
this.value.week.loop.start = Number(arr[5].split("#")[1]) this.value.week.loop.start = Number(arr[4].split("#")[1])
this.value.week.loop.end = arr[5].split("#")[0] this.value.week.loop.end = arr[4].split("#")[0]
}else if(arr[5].includes('L')){ }else if(arr[4].includes('L')){
this.value.week.type = '4' this.value.week.type = '4'
this.value.week.last = arr[5].split("L")[0] this.value.week.last = arr[4].split("L")[0]
}else{ }else{
this.value.week.type = '3' this.value.week.type = '3'
this.value.week.appoint = arr[5].split(",") this.value.week.appoint = arr[4].split(",")
} }
//年 //年
if(!arr[6]){ if(!arr[5]){
this.value.year.type = '-1' this.value.year.type = '-1'
}else if(arr[6]=='*'){ }else if(arr[5]=='*'){
this.value.year.type = '0' this.value.year.type = '0'
}else if(arr[6].includes('-')){ }else if(arr[5].includes('-')){
this.value.year.type = '1' this.value.year.type = '1'
this.value.year.range.start = Number(arr[6].split("-")[0]) this.value.year.range.start = Number(arr[5].split("-")[0])
this.value.year.range.end = Number(arr[6].split("-")[1]) this.value.year.range.end = Number(arr[5].split("-")[1])
}else if(arr[6].includes('/')){ }else if(arr[5].includes('/')){
this.value.year.type = '2' this.value.year.type = '2'
this.value.year.loop.start = Number(arr[6].split("/")[1]) this.value.year.loop.start = Number(arr[5].split("/")[1])
this.value.year.loop.end = Number(arr[6].split("/")[0]) this.value.year.loop.end = Number(arr[5].split("/")[0])
}else{ }else{
this.value.year.type = '3' this.value.year.type = '3'
this.value.year.appoint = arr[6].split(",") this.value.year.appoint = arr[5].split(",")
} }
}, },
getYear(){ getYear(){
@ -714,7 +714,7 @@
}, },
submit(){ submit(){
let year = this.value_year ? ' '+this.value_year : '' let year = this.value_year ? ' '+this.value_year : ''
this.defaultValue = this.value_second + ' ' + this.value_minute + ' ' + this.value_hour + ' ' + this.value_day + ' ' + this.value_month + ' ' + this.value_week + year this.defaultValue = this.value_minute + ' ' + this.value_hour + ' ' + this.value_day + ' ' + this.value_month + ' ' + this.value_week + year
this.$emit('update:modelValue', this.defaultValue) this.$emit('update:modelValue', this.defaultValue)
this.dialogVisible = false this.dialogVisible = false
} }

125
src/views/system/task/index.vue → src/views/system/crontab/index.vue
View File

@ -1,26 +1,32 @@
<template> <template>
<el-main> <el-main>
<el-row :gutter="15"> <el-row :gutter="15">
<el-col :xl="6" :lg="6" :md="8" :sm="12" :xs="24">
<el-card class="task task-add" shadow="never" @click="add">
<el-icon><el-icon-plus /></el-icon>
<p>添加计划任务</p>
</el-card>
</el-col>
<el-col :xl="6" :lg="6" :md="8" :sm="12" :xs="24" v-for="item in list" :key="item.id"> <el-col :xl="6" :lg="6" :md="8" :sm="12" :xs="24" v-for="item in list" :key="item.id">
<el-card class="task task-item" shadow="hover"> <el-card class="task task-item" shadow="hover">
<h2>{{item.title}}</h2> <h2>{{item.title}}</h2>
<ul> <ul>
<li> <li>
<h4>执行类</h4> <h4>执行类</h4>
<p>{{item.handler}}</p> <p>{{ item.type }}</p>
</li> </li>
<li> <li>
<h4>定时规则</h4> <h4>定时规则</h4>
<p>{{item.cron}}</p> <p>{{item.schedule}} <code>({{ item.executetime }})</code></p>
</li> </li>
</ul> </ul>
<div class="bottom"> <div class="bottom">
<div class="state"> <div class="state">
<el-tag v-if="item.state=='1'" size="small">准备就绪</el-tag> <el-tag v-if="item.status=='1'" size="small">准备就绪</el-tag>
<el-tag v-if="item.state=='-1'" size="small" type="info">停用</el-tag> <el-tag v-if="item.status=='0'" size="small" type="info">停用</el-tag>
</div> </div>
<div class="handler"> <div class="handler">
<el-popconfirm title="确定立即执行吗？" @confirm="run(item)"> <el-popconfirm title="立即执行吗？" @confirm="run(item)">
<template #reference> <template #reference>
<el-button type="primary" icon="el-icon-caret-right" circle></el-button> <el-button type="primary" icon="el-icon-caret-right" circle></el-button>
</template> </template>
@ -31,7 +37,7 @@
<el-dropdown-menu> <el-dropdown-menu>
<el-dropdown-item @click="edit(item)">编辑</el-dropdown-item> <el-dropdown-item @click="edit(item)">编辑</el-dropdown-item>
<el-dropdown-item @click="logs(item)">日志</el-dropdown-item> <el-dropdown-item @click="logs(item)">日志</el-dropdown-item>
<el-dropdown-item @click="del(item)" divided>删除</el-dropdown-item> <el-dropdown-item @click="crontabdelete(item)" divided>删除</el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</template> </template>
</el-dropdown> </el-dropdown>
@ -39,19 +45,12 @@
</div> </div>
</el-card> </el-card>
</el-col> </el-col>
<el-col :xl="6" :lg="6" :md="8" :sm="12" :xs="24">
<el-card class="task task-add" shadow="never" @click="add">
<el-icon><el-icon-plus /></el-icon>
<p>添加计划任务</p>
</el-card>
</el-col>
</el-row> </el-row>
</el-main> </el-main>
<save-dialog v-if="dialog.save" ref="saveDialog" @success="handleSuccess" @closed="dialog.save=false"></save-dialog> <save-dialog v-if="dialog.save" ref="saveDialog" @success="handleSuccess" @closed="dialog.save=false"></save-dialog>
<el-drawer :title=" loginfo.title + '计划任务日志'" v-model="dialog.logsVisible" :size="600" direction="rtl" destroy-on-close>
<el-drawer title="计划任务日志" v-model="dialog.logsVisible" :size="600" direction="rtl" destroy-on-close> <logs ref="logs"></logs>
<logs></logs>
</el-drawer> </el-drawer>
</template> </template>
@ -60,7 +59,7 @@
import logs from './logs' import logs from './logs'
export default { export default {
name: 'task', name: 'crontab',
components: { components: {
saveDialog, saveDialog,
logs logs
@ -76,35 +75,27 @@
save: false, save: false,
logsVisible: false logsVisible: false
}, },
list: [ list: [],
{ loginfo:{},
id: "1", logslist: []
title: "清理服务器缓存",
handler: "cleanUpCacheHandler",
cron: "59 59 23 * * ? *",
state: "1"
},
{
id: "2",
title: "自动审核",
handler: "automaticAuditHandler",
cron: "0 0 * * * ? *",
state: "1"
},
{
id: "3",
title: "清理未实名用户",
handler: "deleteUserHandler",
cron: "0 0 0 * * ? *",
state: "-1"
}
]
} }
}, },
mounted() { mounted() {
this.loaddata();
}, },
methods: { methods: {
loaddata(){
this.$http.get('app/crontab/lists').then((res) => {
if (res.code == 200) {
this.list = res.data;
return ;
}
this.$alert(res.message, "提示", {type: 'error'});
});
},
add(){ add(){
this.dialog.save = true this.dialog.save = true
this.$nextTick(() => { this.$nextTick(() => {
@ -117,33 +108,67 @@
this.$refs.saveDialog.open('edit').setData(task) this.$refs.saveDialog.open('edit').setData(task)
}) })
}, },
del(task){ crontabdelete(task){
this.$confirm(`确认删除 ${task.title} 计划任务吗？`,'提示', { this.$confirm(`确认删除 ${task.title} 计划任务吗？`,'提示', {
type: 'warning', type: 'warning',
confirmButtonText: '删除', confirmButtonText: '删除',
confirmButtonClass: 'el-button--danger' confirmButtonClass: 'el-button--danger'
}).then(() => { }).then(() => {
this.list.splice(this.list.findIndex(item => item.id === task.id), 1)
this.$http.get('app/crontab/delete').then((res) => {
if (res.code == 200) {
this.list.splice(this.list.findIndex(item => item.id === task.id), 1)
return ;
}
this.$alert(res.message, "提示", {type: 'error'});
});
}).catch(() => { }).catch(() => {
//取消 //取消
}) })
}, },
logs(){ logs(o){
this.loginfo = o;
this.dialog.logsVisible = true this.dialog.logsVisible = true
this.$nextTick(() => {
this.$refs.logs.setApi('app/crontab/logs?id='+o.id)
})
}, },
run(task){ run(task){
this.$message.success(`已成功执行计划任务：${task.title}`) this.$message.success(`已成功执行计划任务：${task.title}`)
}, },
//本地更新数据 //本地更新数据
handleSuccess(data, mode){ handleSuccess(data, mode){
if(mode=='add'){
data.id = new Date().getTime() this.$http.post('app/crontab/submit', {type:mode, info:data}).then((res) => {
this.list.push(data)
}else if(mode=='edit'){
this.list.filter(item => item.id===data.id ).forEach(item => { this.$refs.saveDialog.isSaveing = false;
Object.assign(item, data)
}) if (res.code == 200 ) {
}
if (res.data && res.data.id) {
if(mode=='add'){
this.list.push(data)
}else if(mode=='edit'){
this.list.filter(item => item.id===data.id ).forEach(item => {
Object.assign(item, data)
})
}
}else{
this.loaddata({})
}
this.$refs.saveDialog.visible = false;
this.$message.success(res.message || "操作成功")
return;
}
this.$alert(res.message||'错误', "提示", {type: 'error'});
})
} }
} }
} }

57
src/views/system/crontab/logs.vue Normal file
View File

@ -0,0 +1,57 @@
<template>
<el-container>
<el-main style="padding:0 20px;">
<scTable ref="table" :data="data" :api="api" stripe>
<el-table-column label="ID" prop="id" width="80"></el-table-column>
<el-table-column label="执行时间" prop="createtime" width="180"></el-table-column>
<el-table-column label="耗时" prop="consumingtime" width="100"></el-table-column>
<el-table-column label="结果" prop="state" width="80">
<template #default="scope">
<span v-if="scope.row.status==1" style="color: #67C23A;"><el-icon><el-icon-success-filled /></el-icon></span>
<span v-else style="color: #F56C6C;"><el-icon><el-icon-circle-close-filled /></el-icon></span>
</template>
</el-table-column>
<el-table-column label="执行日志" prop="logs" width="100" fixed="right">
<template #default="scope">
<el-button size="small" @click="show(scope.row)" type="text">日志</el-button>
</template>
</el-table-column>
</scTable>
</el-main>
</el-container>
<el-drawer title="日志" v-model="logsVisible" :size="500" direction="rtl" destroy-on-close>
<el-main style="padding:0 20px 20px 20px;">
<pre style="font-size: 12px;color: #999;padding:20px;background: #333;font-family: consolas;line-height: 1.5;overflow: auto;">{{demoLog}}</pre>
</el-main>
</el-drawer>
</template>
<script>
export default {
data() {
return {
logsVisible: false,
data:[],
api:null,
demoLog:''
}
},
mounted() {
},
methods: {
show(o){
this.logsVisible = true;
this.demoLog = o.content;
},
//表单注入数据
setApi(api){
this.api = api;
}
}
}
</script>
<style>
</style>

70
src/views/system/task/save.vue → src/views/system/crontab/save.vue
View File

@ -1,26 +1,26 @@
<!--
* @Descripttion: 系统计划任务配置
* @version: 1.2
* @Author: sakuya
* @Date: 2021年7月7日09:28:32
* @LastEditors: sakuya
* @LastEditTime: 2021年7月10日20:56:47
-->
<template> <template>
<el-dialog :title="titleMap[mode]" v-model="visible" :width="400" destroy-on-close @closed="$emit('closed')"> <el-dialog :title="titleMap[mode]" v-model="visible" :width="600" destroy-on-close @closed="$emit('closed')">
<el-form :model="form" :rules="rules" ref="dialogForm" label-width="100px" label-position="left"> <el-form :model="form" :rules="rules" ref="dialogForm" label-width="100px" label-position="left">
<el-form-item label="描述" prop="title"> <el-form-item label="描述" prop="title">
<el-input v-model="form.title" placeholder="计划任务标题" clearable></el-input> <el-input v-model="form.title" placeholder="计划任务标题" clearable></el-input>
</el-form-item> </el-form-item>
<el-form-item label="执行类" prop="handler"> <el-form-item label="执行类" prop="handler">
<el-input v-model="form.handler" placeholder="计划任务执行类名称" clearable></el-input> <el-select v-model="form.type">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item> </el-form-item>
<el-form-item label="定时规则" prop="cron"> <el-form-item label="执行内容" prop="content">
<sc-cron v-model="form.cron" placeholder="请输入Cron定时规则" clearable :shortcuts="shortcuts"></sc-cron> <el-input v-model="form.content" placeholder="计划任务执行内容" clearable type="textarea"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="是否启用" prop="state"> <el-form-item label="定时规则" prop="schedule">
<el-switch v-model="form.state" active-value="1" inactive-value="-1"></el-switch> <sc-cron v-model="form.schedule" placeholder="请输入Cron定时规则" clearable :shortcuts="shortcuts"></sc-cron>
</el-form-item>
<el-form-item label="是否启用" prop="status">
<el-radio-group v-model="form.status">
<el-radio :label="1">开启</el-radio>
<el-radio :label="0">关闭</el-radio>
</el-radio-group>
</el-form-item> </el-form-item>
</el-form> </el-form>
<template #footer> <template #footer>
@ -45,21 +45,30 @@
add: '新增计划任务', add: '新增计划任务',
edit: '编辑计划任务' edit: '编辑计划任务'
}, },
options: [
{value: 'url', label:'访问URL'},
{value: 'sql', label:'执行SQL'},
{value: 'shell', label:'执行Shell'},
{value: 'hook', label:'执行本系统函数或钩子'},
],
form: { form: {
id:"",
title: "", title: "",
handler: "", type: "",
cron: "", content: "",
state: "1" schedule: "",
status: 1
}, },
rules: { rules: {
title:[ title:[
{required: true, message: '请填写标题'} {required: true, message: '请填写标题'}
], ],
handler:[ type:[
{required: true, message: '请填写执行类'} {required: true, message: '请选择执行类'}
], ],
cron:[ content:[
{required: true, message: '请填写执行内容'}
],
schedule:[
{required: true, message: '请填写定时规则'} {required: true, message: '请填写定时规则'}
] ]
}, },
@ -67,8 +76,8 @@
isSaveing: false, isSaveing: false,
shortcuts: [ shortcuts: [
{ {
text: "每天8点和12点 (自定义追加)", text: "每天8点和12点",
value: "0 0 8,12 * * ?" value: "0 8,12 * * *"
} }
] ]
} }
@ -88,22 +97,13 @@
this.$refs.dialogForm.validate((valid) => { this.$refs.dialogForm.validate((valid) => {
if (valid) { if (valid) {
this.isSaveing = true; this.isSaveing = true;
setTimeout(()=>{ this.$emit('success', this.form, this.mode)
this.isSaveing = false;
this.visible = false;
this.$message.success("操作成功")
this.$emit('success', this.form, this.mode)
},1000)
} }
}) })
}, },
//表单注入数据 //表单注入数据
setData(data){ setData(data){
this.form.id = data.id this.form = Object.assign({}, data);
this.form.title = data.title
this.form.handler = data.handler
this.form.cron = data.cron
this.form.state = data.state
} }
} }
} }

108
src/views/system/task/logs.vue
View File

@ -1,108 +0,0 @@
<!--
* @Descripttion: 系统计划任务配置
* @version: 1.0
* @Author: sakuya
* @Date: 2021年7月7日09:28:32
* @LastEditors:
* @LastEditTime:
-->
<template>
<el-container>
<el-main style="padding:0 20px;">
<scTable ref="table" :data="data" stripe>
<el-table-column label="执行时间" prop="time" width="200"></el-table-column>
<el-table-column label="执行结果" prop="state" width="100">
<template #default="scope">
<span v-if="scope.row.state==200" style="color: #67C23A;"><el-icon><el-icon-success-filled /></el-icon></span>
<span v-else style="color: #F56C6C;"><el-icon><el-icon-circle-close-filled /></el-icon></span>
</template>
</el-table-column>
<el-table-column label="执行日志" prop="logs" width="100" fixed="right">
<template #default="scope">
<el-button size="small" @click="show(scope.row)" type="text">日志</el-button>
</template>
</el-table-column>
</scTable>
</el-main>
</el-container>
<el-drawer title="日志" v-model="logsVisible" :size="500" direction="rtl" destroy-on-close>
<el-main style="padding:0 20px 20px 20px;">
<pre style="font-size: 12px;color: #999;padding:20px;background: #333;font-family: consolas;line-height: 1.5;overflow: auto;">{{demoLog}}</pre>
</el-main>
</el-drawer>
</template>
<script>
export default {
data() {
return {
logsVisible: false,
demoLog: `2021-07-07 12:35:00 [com.xxl.job.core.thread.JobThread#run]-[124]-[Thread-308]
----------- xxl-job job execute start -----------
----------- Param:
2021-07-07 12:35:00 [com.heronshn.reservation.jobhandler.AqshMasterDataSendHandler#execute]-[31]-[Thread-308] aqshMasterDataSendHandler start
2021-07-07 12:35:00 [com.heronshn.reservation.data.service.impl.AqshVehicleServiceImpl#send]-[42]-[Thread-308] send 45
2021-07-07 12:35:00 [com.heronshn.reservation.data.service.impl.AqshVehicleServiceImpl#send]-[45]-[Thread-308] webapi http://127.0.0.1:48080
2021-07-07 12:35:00 [com.heronshn.reservation.jobhandler.AqshMasterDataSendHandler#execute]-[33]-[Thread-308] aqshMasterDataSendHandler vehicle end
2021-07-07 12:35:00 [com.heronshn.reservation.jobhandler.AqshMasterDataSendHandler#execute]-[35]-[Thread-308] aqshMasterDataSendHandler stop
2021-07-07 12:35:00 [com.xxl.job.core.thread.JobThread#run]-[158]-[Thread-308]
----------- xxl-job job execute end(finish) -----------
----------- ReturnT:ReturnT [code=200, msg=null, content=null]
2021-07-07 12:35:00 [com.xxl.job.core.thread.TriggerCallbackThread#callbackLog]-[176]-[Thread-10]
----------- xxl-job job callback finish.
[Load Log Finish]`,
data: [
{
time: "2021-07-07 00:00:00",
state: "500",
logs: ""
},
{
time: "2021-07-06 00:00:00",
state: "200",
logs: ""
},
{
time: "2021-07-05 00:00:00",
state: "200",
logs: ""
},
{
time: "2021-07-04 00:00:00",
state: "200",
logs: ""
},
{
time: "2021-07-03 00:00:00",
state: "200",
logs: ""
},
{
time: "2021-07-02 00:00:00",
state: "200",
logs: ""
},
{
time: "2021-07-01 00:00:00",
state: "200",
logs: ""
}
]
}
},
mounted() {
},
methods: {
show(){
this.logsVisible = true;
}
}
}
</script>
<style>
</style>