molong/vueadmin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

更新

Browse Source
This commit is contained in:
molong
2026-01-21 22:53:25 +08:00
parent 638c846aed
commit 155ec5c986
37 changed files with 3468 additions and 729 deletions
Download Patch File Download Diff File Expand all files Collapse all files

154
src/pages/system/crontab/index.vue Normal file
View File

@@ -0,0 +1,154 @@
<template>
<el-main>
<el-row :gutter="15">
<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">
<h2>{{item.title}}</h2>
<ul>
<li>
<h4>任务类型</h4>
<p>{{crontabType[item.type]}}</p>
</li>
<li>
<h4>执行类</h4>
<p>{{item.command}}</p>
</li>
<li>
<h4>定时规则</h4>
<p>{{item.expression}}</p>
</li>
</ul>
<div class="bottom">
<div class="state">
<el-tag v-if="item.status==1">运行中</el-tag>
<el-tag v-if="item.status==0" type="info">停用</el-tag>
</div>
<div class="handler">
<el-popconfirm :title="item.status==1 ? '确定立即关闭吗？' : '确定立即执行吗？'" @confirm="run(item)">
<template #reference>
<el-button type="primary" :icon="item.status==1 ? 'el-icon-switch-button' : 'el-icon-caret-right'" circle></el-button>
</template>
</el-popconfirm>
<el-dropdown trigger="click">
<el-button type="primary" icon="el-icon-more" circle plain></el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item @click="edit(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-menu>
</template>
</el-dropdown>
</div>
</div>
</el-card>
</el-col>
<el-col :xl="6" :lg="6" :md="8" :sm="12" :xs="24">
<el-card class="task task-add" shadow="none" @click="add">
<el-icon><el-icon-plus /></el-icon>
<p>添加计划任务</p>
</el-card>
</el-col>
</el-row>
</el-main>
<save-dialog v-if="dialog.save" ref="saveDialog" @success="handleSuccess" @closed="dialog.save=false"></save-dialog>
<logs v-if="dialog.logs" ref="logsDialog" @closed="dialog.logs=false"></logs>
</template>
<script>
import saveDialog from './save'
import logs from './logs'
export default {
name: 'system.crontab',
components: {
saveDialog,
logs
},
provide() {
return {
list: this.list
}
},
data() {
return {
dialog: {
save: false,
logs: false
},
crontabType: {1: '执行命令', 2: '执行类class', 3: '执行地址', 4: '执行shell'},
list: []
}
},
mounted() {
this.getCrontabList()
},
methods: {
async getCrontabList(){
let res = await this.$API.system.crontab.list.get()
if(res.code===1){
this.list = res.data
}
},
add(){
this.dialog.save = true
this.$nextTick(() => {
this.$refs.saveDialog.open()
})
},
edit(task){
this.dialog.save = true
this.$nextTick(() => {
this.$refs.saveDialog.open('edit').setData(task)
})
},
del(task){
this.$confirm(`确认删除 ${task.title} 计划任务吗？`,'提示', {
type: 'warning',
confirmButtonText: '删除',
confirmButtonClass: 'el-button--danger'
}).then(async () => {
let res = await this.$API.system.crontab.delete.post({id: task.id})
if(res.code===1){
this.$message.success('操作成功')
this.getCrontabList()
}
}).catch(() => {
//取消
})
},
logs(row){
this.dialog.logs = true
this.$nextTick(() => {
this.$refs.logsDialog.open().setData(row)
})
},
async run(task){
let res = await this.$API.system.crontab.reload.post({id: task.id, status: task.status == 1 ? 0 : 1})
if(res.code===1){
this.$message.success('已成功执行计划任务')
this.getCrontabList()
}
},
//本地更新数据
handleSuccess(){
this.getCrontabList()
}
}
}
</script>
<style scoped>
.task {height: 240px;}
.task-item h2 {font-size: 15px;color: #3c4a54;padding-bottom:15px;}
.task-item li {list-style-type:none;margin-bottom: 10px;}
.task-item li h4 {font-size: 12px;font-weight: normal;color: #999;}
.task-item li p {margin-top: 5px;}
.task-item .bottom {border-top: 1px solid #EBEEF5;text-align: right;padding-top:10px;display: flex;justify-content: space-between;align-items: center;}
.task-add {display: flex;flex-direction: column;align-items: center;justify-content: center;text-align: center;cursor: pointer;color: #999;}
.task-add:hover {color: #409EFF;}
.task-add i {font-size: 30px;}
.task-add p {font-size: 12px;margin-top: 20px;}
</style>

79
src/pages/system/crontab/logs.vue Normal file
View File

@@ -0,0 +1,79 @@
<!--
* @Descripttion: 系统计划任务配置
* @version: 1.0
* @Author: sakuya
* @Date: 2021年7月7日09:28:32
* @LastEditors:
* @LastEditTime:
-->
<template>
<el-drawer title="计划任务日志" v-model="Visible" :size="780" direction="rtl" destroy-on-close>
<el-container>
<el-main style="padding:0 20px;">
<scTable ref="table" :apiObj="list.apiObj" :column="list.column" :params="search" stripe>
<el-table-column type="selection" width="50"></el-table-column>
<template #return_code="scope">
<span v-if="scope.row.return_code==0" 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>
<template #logs="scope">
<el-button @click="show(scope.row)" type="text">日志</el-button>
</template>
<template #create_time="scope">
<div v-time="scope.row.create_time"></div>
</template>
</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;">{{logDetail}}</pre>
</el-main>
</el-drawer>
</el-drawer>
</template>
<script>
export default {
data() {
return {
Visible: false,
logsVisible: false,
crontab: {},
logDetail: '',
list: {
apiObj: this.$API.system.crontab.log,
column: [
{ label: '执行时间', prop: 'running_time', width: 100 },
{ label: '执行结果', prop: 'return_code', width: 100, align: 'center' },
{ label: '参数', prop: 'parameter', width: 100, align: 'center' },
{ label: '时间', prop: 'create_time', width: 200 },
{ label: '执行日志', prop: 'logs', align: 'center' }
]
},
search: {crontab_id: 0}
}
},
mounted() {
},
methods: {
open() {
this.Visible = true
return this
},
show(item){
this.logDetail = item.exception
this.logsVisible = true;
},
setData(row){
this.crontab = row
this.search.crontab_id = row.id
}
}
}
</script>
<style>
</style>

113
src/pages/system/crontab/save.vue Normal file
View File

@@ -0,0 +1,113 @@
<template>
<el-dialog :title="titleMap[mode]" v-model="visible" :width="400" destroy-on-close @closed="$emit('closed')">
<el-form :model="form" :rules="rules" ref="dialogForm" label-width="100px" label-position="left">
<el-form-item label="描述" prop="title">
<el-input v-model="form.title" placeholder="计划任务标题" clearable></el-input>
</el-form-item>
<el-form-item label="任务分类" prop="type">
<el-select v-model="form.type" placeholder="计划任务执行类名称" clearable>
<el-option v-for="item in [{value: 1, label: '执行命令'}, {value: 2, label: '执行类class'}, {value: 3, label: '执行地址'}, {value: 4, label: '执行shell'}]" :key="item.value" :label="item.label" :value="item.value" ></el-option>
</el-select>
</el-form-item>
<el-form-item label="执行类" prop="command">
<el-input v-model="form.command" placeholder="计划任务执行类名称" clearable></el-input>
</el-form-item>
<el-form-item label="定时规则" prop="expression">
<sc-cron v-model="form.expression" placeholder="请输入Cron定时规则" clearable :shortcuts="shortcuts"></sc-cron>
</el-form-item>
<el-form-item label="是否启用" prop="status">
<el-switch v-model="form.status" :active-value="1" :inactive-value="0" />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="备注" clearable></el-input>
</el-form-item>
</el-form>
<template #footer>
<el-button @click="visible=false" >取 消</el-button>
<el-button type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
</template>
</el-dialog>
</template>
<script>
import scCron from '@/components/scCron';
export default {
components: {
scCron
},
emits: ['success', 'closed'],
data() {
return {
mode: "add",
titleMap: {
add: '新增计划任务',
edit: '编辑计划任务'
},
form: {
id:"",
title: "",
type: 1,
command: "",
expression: "",
status: 1,
remark: ""
},
rules: {
title:[{required: true, message: '请填写标题'}],
command:[{required: true, message: '请填写执行类'}],
expression:[{required: true, message: '请填写定时规则'}]
},
visible: false,
isSaveing: false,
shortcuts: [
{
text: "每天8点和12点 (自定义追加)",
value: "0 0 8,12 * * ?"
}
]
}
},
mounted() {
},
methods: {
//显示
open(mode='add'){
this.mode = mode;
this.visible = true;
return this;
},
//表单提交方法
submit(){
this.$refs.dialogForm.validate(async (valid) => {
if (valid) {
let res = await this.$API.system.crontab[this.mode].post(this.form)
if(res.code == 1){
this.isSaveing = false;
this.visible = false;
this.$message.success("操作成功")
this.$emit('success', this.form, this.mode)
}else{
this.$message.error(res.message)
this.isSaveing = false;
}
}
})
},
//表单注入数据
setData(data){
this.form.id = data.id ?? 0
this.form.title = data.title ?? ""
this.form.type = data.type ?? 1
this.form.command = data.command ?? ""
this.form.expression = data.expression ?? ""
this.form.status = data.status ?? 1
}
}
}
</script>
<style>
</style>