From 2307f1cf7f1dbb4c17abdf8baea692d97b1dba3e Mon Sep 17 00:00:00 2001 From: dengzedong <dengzedong@email> Date: 星期五, 06 十二月 2024 10:35:52 +0800 Subject: [PATCH] job --- src/views/energy/job/ScheduleJobForm.vue | 39 ++++++++++++++----- src/views/energy/job/index.vue | 3 - package.json | 3 + src/plugins/elementPlus/index.ts | 4 ++ src/api/job/index.ts | 37 ++++++------------ 5 files changed, 47 insertions(+), 39 deletions(-) diff --git a/package.json b/package.json index b6183b8..2f84716 100644 --- a/package.json +++ b/package.json @@ -25,7 +25,7 @@ "lint:lint-staged": "lint-staged -c " }, "dependencies": { - "@element-plus/icons-vue": "^2.1.0", + "@element-plus/icons-vue": "^2.3.1", "@iconify/iconify": "^3.1.1", "@microsoft/fetch-event-source": "^2.0.1", "@videojs-player/vue": "^1.0.0", @@ -69,6 +69,7 @@ "vue-i18n": "9.10.2", "vue-router": "^4.3.0", "vue-types": "^5.1.1", + "vue3-cron-plus": "^0.1.9", "vuedraggable": "^4.1.0", "web-storage-cache": "^1.1.1", "xml-js": "^1.6.11" diff --git a/src/api/job/index.ts b/src/api/job/index.ts index dee4f0c..b95c18f 100644 --- a/src/api/job/index.ts +++ b/src/api/job/index.ts @@ -1,54 +1,41 @@ import request from '@/config/axios' -export interface ScheduleJobVO { - id: number - beanName: string - params: string - cronExpression: string - status: number - remark: string -} - -export interface ScheduleJobPageReqVO extends PageParam { - beanName?: string -} - // 查询ScheduleJob列表 -export const getScheduleJobPage = (params: ScheduleJobPageReqVO) => { +export const getScheduleJobPage = (params) => { return request.get({ url: '/shasteel/job/schedule/page', params }) } // 查询ScheduleJob详情 -export const getScheduleJob = (id: number) => { - return request.get({ url: '/shasteel/job/schedule/info?id=' + id}) +export const getScheduleJob = (id) => { + return request.get({ url: '/shasteel/job/schedule/' + id}) } // 新增ScheduleJob -export const createScheduleJob = (data: ScheduleJobVO) => { - return request.post({ url: '/shasteel/job/schedule/create', data }) +export const createScheduleJob = (data) => { + return request.post({ url: '/shasteel/job/schedule', data }) } // 修改ScheduleJob -export const updateScheduleJob = (data: ScheduleJobVO) => { - return request.put({ url: '/shasteel/job/schedule/update', data }) +export const updateScheduleJob = (data) => { + return request.put({ url: '/shasteel/job/schedule', data }) } // 删除ScheduleJob -export const deleteScheduleJob = (id: number) => { - return request.delete({ url: '/shasteel/job/schedule/delete?id=' + id }) +export const deleteScheduleJob = (id) => { + return request.delete({ url: '/shasteel/job/schedule?id=' + id }) } // 立即执行 -export const runScheduleJob = (id: number) => { +export const runScheduleJob = (id) => { return request.put({ url: '/shasteel/job/schedule/run?id=' + id }) } // 暂停 -export const pauseScheduleJob = (id: number) => { +export const pauseScheduleJob = (id) => { return request.put({ url: '/shasteel/job/schedule/pause?id=' + id }) } // 恢复 -export const resumeScheduleJob = (id: number) => { +export const resumeScheduleJob = (id) => { return request.put({ url: '/shasteel/job/schedule/resume?id=' + id }) } diff --git a/src/plugins/elementPlus/index.ts b/src/plugins/elementPlus/index.ts index 0ae2a8b..e23cb55 100644 --- a/src/plugins/elementPlus/index.ts +++ b/src/plugins/elementPlus/index.ts @@ -1,6 +1,8 @@ import type { App } from 'vue' // 需要全局引入一些组件,如ElScrollbar,不然一些下拉项样式有问题 import { ElLoading, ElScrollbar, ElButton } from 'element-plus' +import ElementPlus from 'element-plus' +import 'element-plus/dist/index.css' const plugins = [ElLoading] @@ -14,4 +16,6 @@ components.forEach((component) => { app.component(component.name, component) }) + + app.use(ElementPlus) } diff --git a/src/views/energy/job/ScheduleJobForm.vue b/src/views/energy/job/ScheduleJobForm.vue index 87c89ed..a4af274 100644 --- a/src/views/energy/job/ScheduleJobForm.vue +++ b/src/views/energy/job/ScheduleJobForm.vue @@ -1,5 +1,5 @@ <template> - <Dialog v-model="dialogVisible" :title="dialogTitle" width="50%"> + <Dialog v-model="dialogVisible" :close-on-click-modal="false" :title="dialogTitle" width="50%"> <el-form ref="formRef" v-loading="formLoading" @@ -8,16 +8,21 @@ label-width="120px" > <el-form-item label="bean名称" prop="beanName"> - <el-input v-model="formData.beanName" placeholder="请输入bean名称" /> + <el-input v-model="formData.beanName" placeholder="请输入bean名称"/> </el-form-item> <el-form-item label="参数" prop="params"> - <el-input v-model="formData.params" placeholder="请输入参数" /> + <el-input v-model="formData.params" placeholder="请输入参数"/> </el-form-item> <el-form-item label="cron表达式" prop="cronExpression"> - <el-input v-model="formData.cronExpression" placeholder="请输入cron表达式" /> + <el-popover ref="popoverRef" placement="bottom-start" trigger="click" width="600px"> + <vue3CronPlus @change="changeCron" @close="closeCron" max-height="600px" i18n="cn"/> + <template #reference> + <el-input v-model="formData.cronExpression" placeholder="请输入cron表达式"/> + </template> + </el-popover> </el-form-item> <el-form-item label="备注" prop="remark"> - <el-input v-model="formData.remark" placeholder="请输入备注" type="textarea" /> + <el-input v-model="formData.remark" placeholder="请输入备注" type="textarea"/> </el-form-item> </el-form> <template #footer> @@ -27,11 +32,13 @@ </Dialog> </template> <script lang="ts" setup> -import * as ScheduleJobApi from '@/api/job' + import * as ScheduleJobApi from '@/api/job' + import {vue3CronPlus} from 'vue3-cron-plus' + import 'vue3-cron-plus/dist/index.css' -defineOptions({ name: 'DataScheduleJobForm' }) + defineOptions({name: 'DataScheduleJobForm'}) - const { t } = useI18n() // 国际化 + const {t} = useI18n() // 国际化 const message = useMessage() // 消息弹窗 const dialogVisible = ref(false) // 弹窗的是否展示 const dialogTitle = ref('') // 弹窗的标题 @@ -46,8 +53,8 @@ status: 0 }) const formRules = reactive({ - beanName: [{ required: true, message: 'bean名称不能为空', trigger: 'blur' }], - cronExpression: [{ required: true, message: 'cron表达式不能为空', trigger: 'blur' }] + beanName: [{required: true, message: 'bean名称不能为空', trigger: 'blur'}], + cronExpression: [{required: true, message: 'cron表达式不能为空', trigger: 'blur'}] }) const formRef = ref() // 表单 Ref @@ -67,7 +74,7 @@ } } } - defineExpose({ open }) // 提供 open 方法,用于打开弹窗 + defineExpose({open}) // 提供 open 方法,用于打开弹窗 /** 提交表单 */ const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调 @@ -107,4 +114,14 @@ } formRef.value?.resetFields() } + + const changeCron = (cronValue) => { + if (typeof (cronValue) == "string") { + formData.value.cronExpression = cronValue; + } + } + const popoverRef = ref() + const closeCron = () => { + popoverRef.value.hide() + } </script> diff --git a/src/views/energy/job/index.vue b/src/views/energy/job/index.vue index 59f38b7..81f9081 100644 --- a/src/views/energy/job/index.vue +++ b/src/views/energy/job/index.vue @@ -111,7 +111,7 @@ import * as ScheduleJobApi from '@/api/job' import ScheduleJobForm from './ScheduleJobForm.vue' -defineOptions({name: 'DataSchedule'}) +defineOptions({name: 'Job'}) const message = useMessage() // 消息弹窗 const {t} = useI18n() // 国际化 @@ -132,7 +132,6 @@ const getList = async () => { loading.value = true try { - debugger const page = await ScheduleJobApi.getScheduleJobPage(queryParams) list.value = page.list total.value = page.total -- Gitblit v1.9.3