From 6ac5e63684d9ccc027cd4039f21a4e056034b653 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=80=97=E5=AD=90?= Date: Sun, 9 Feb 2025 02:10:17 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20alova.js=E6=9B=BF=E6=8D=A2axios?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/src/api/panel/cron/index.ts | 14 ++-- web/src/views/firewall/types.ts | 0 web/src/views/task/CreateModal.vue | 14 ++-- web/src/views/task/CronView.vue | 105 +++++++++++++---------------- web/src/views/task/types.ts | 11 --- 5 files changed, 58 insertions(+), 86 deletions(-) delete mode 100644 web/src/views/firewall/types.ts delete mode 100644 web/src/views/task/types.ts diff --git a/web/src/api/panel/cron/index.ts b/web/src/api/panel/cron/index.ts index 79d57b5c..c923b0e8 100644 --- a/web/src/api/panel/cron/index.ts +++ b/web/src/api/panel/cron/index.ts @@ -1,17 +1,17 @@ -import { request } from '@/utils' +import { http } from '@/utils' export default { // 获取任务列表 - list: (page: number, limit: number): any => request.get('/cron', { params: { page, limit } }), + list: (page: number, limit: number): any => http.Get('/cron', { params: { page, limit } }), // 获取任务脚本 - get: (id: number): any => request.get('/cron/' + id), + get: (id: number): any => http.Get('/cron/' + id), // 创建任务 - create: (task: any): any => request.post('/cron', task), + create: (task: any): any => http.Post('/cron', task), // 修改任务 update: (id: number, name: string, time: string, script: string): any => - request.put('/cron/' + id, { name, time, script }), + http.Put('/cron/' + id, { name, time, script }), // 删除任务 - delete: (id: number): any => request.delete('/cron/' + id), + delete: (id: number): any => http.Delete(`/cron/${id}`), // 修改任务状态 - status: (id: number, status: boolean): any => request.post('/cron/' + id + '/status', { status }) + status: (id: number, status: boolean): any => http.Post('/cron/' + id + '/status', { status }) } diff --git a/web/src/views/firewall/types.ts b/web/src/views/firewall/types.ts deleted file mode 100644 index e69de29b..00000000 diff --git a/web/src/views/task/CreateModal.vue b/web/src/views/task/CreateModal.vue index 91817c21..461ff8c8 100644 --- a/web/src/views/task/CreateModal.vue +++ b/web/src/views/task/CreateModal.vue @@ -41,11 +41,11 @@ const { data: installedDbAndPhp } = useRequest(dashboard.installedDbAndPhp, { }) const mySQLInstalled = computed(() => { - return installedDbAndPhp.value.db.find((item) => item.value === 'mysql') + return installedDbAndPhp.value.db.find((item: any) => item.value === 'mysql') }) const postgreSQLInstalled = computed(() => { - return installedDbAndPhp.value.db.find((item) => item.value === 'postgresql') + return installedDbAndPhp.value.db.find((item: any) => item.value === 'postgresql') }) const getWebsiteList = async (page: number, limit: number) => { @@ -61,15 +61,13 @@ const getWebsiteList = async (page: number, limit: number) => { const handleSubmit = async () => { loading.value = true - await cron - .create(createModel.value) - .then(() => { + useRequest(cron.create(createModel.value)) + .onSuccess(() => { window.$message.success('创建成功') window.$bus.emit('task:refresh-cron') - loading.value = false - show.value = false }) - .catch(() => { + .onComplete(() => { + show.value = false loading.value = false }) } diff --git a/web/src/views/task/CronView.vue b/web/src/views/task/CronView.vue index bafe2105..b08a1a70 100644 --- a/web/src/views/task/CronView.vue +++ b/web/src/views/task/CronView.vue @@ -8,13 +8,19 @@ import { NButton, NDataTable, NInput, NPopconfirm, NSwitch, NTag } from 'naive-u import cron from '@/api/panel/cron' import file from '@/api/panel/file' import { decodeBase64, formatDateTime, renderIcon } from '@/utils' -import type { CronTask } from '@/views/task/types' import { CronNaive } from '@vue-js-cron/naive-ui' const logPath = ref('') const logModal = ref(false) const editModal = ref(false) +const editTask = ref({ + id: 0, + name: '', + time: '', + script: '' +}) + const columns: any = [ { type: 'selection', fixed: 'left' }, { @@ -158,83 +164,55 @@ const columns: any = [ } ] -const pagination = reactive({ - page: 1, - pageCount: 1, - pageSize: 20, - itemCount: 0, - showQuickJumper: true, - showSizePicker: true, - pageSizes: [20, 50, 100, 200] -}) +const { loading, data, page, total, pageSize, pageCount, refresh } = usePagination( + (page, pageSize) => cron.list(page, pageSize), + { + initialData: { total: 0, list: [] }, + initialPageSize: 20, + total: (res: any) => res.total, + data: (res: any) => res.items + } +) -const data = ref([] as CronTask[]) - -const editTask = ref({ - id: 0, - name: '', - time: '', - script: '' -}) - -const getTaskList = async (page: number, limit: number) => { - const { data } = await cron.list(page, limit) - return data -} - -const onPageChange = (page: number) => { - pagination.page = page - getTaskList(page, pagination.pageSize).then((res) => { - data.value = res.items - pagination.itemCount = res.total - pagination.pageCount = res.total / pagination.pageSize + 1 - }) -} - -const onPageSizeChange = (pageSize: number) => { - pagination.pageSize = pageSize - onPageChange(1) -} - -const handleStatusChange = async (row: any) => { - cron.status(row.id, !row.status).then(() => { - window.$message.success('修改成功') +const handleStatusChange = (row: any) => { + useRequest(cron.status(row.id, !row.status)).onSuccess(() => { row.status = !row.status + window.$message.success('修改成功') }) } -const handleEdit = async (row: any) => { - await cron.get(row.id).then(async (res) => { - await file.content(res.data.shell).then((res) => { +const handleEdit = (row: any) => { + useRequest(cron.get(row.id)).onSuccess(({ data }) => { + useRequest(file.content(data.shell)).onSuccess(({ data }) => { editTask.value.id = row.id editTask.value.name = row.name editTask.value.time = row.time - editTask.value.script = decodeBase64(res.data.content) + editTask.value.script = decodeBase64(data.content) editModal.value = true }) }) } const handleDelete = async (id: number) => { - await cron.delete(id).then(() => { + useRequest(cron.delete(id)).onSuccess(() => { window.$message.success('删除成功') window.$bus.emit('task:refresh-cron') }) } const saveTaskEdit = async () => { - cron - .update(editTask.value.id, editTask.value.name, editTask.value.time, editTask.value.script) - .then(() => { - window.$message.success('修改成功') - window.$bus.emit('task:refresh-cron') - }) + useRequest( + cron.update(editTask.value.id, editTask.value.name, editTask.value.time, editTask.value.script) + ).onSuccess(() => { + window.$message.success('修改成功') + window.$bus.emit('task:refresh-cron') + }) } onMounted(() => { - onPageChange(pagination.page) + refresh() window.$bus.on('task:refresh-cron', () => { - onPageChange(pagination.page) + refresh() }) }) @@ -249,14 +227,21 @@ onUnmounted(() => { striped remote :scroll-x="1300" - :data="data" + :loading="loading" :columns="columns" + :data="data" :row-key="(row: any) => row.id" - :pagination="pagination" - :bordered="false" - :loading="false" - @update:page="onPageChange" - @update:page-size="onPageSizeChange" + v-model:page="page" + v-model:pageSize="pageSize" + :pagination="{ + page: page, + pageCount: pageCount, + pageSize: pageSize, + itemCount: total, + showQuickJumper: true, + showSizePicker: true, + pageSizes: [20, 50, 100, 200] + }" /> diff --git a/web/src/views/task/types.ts b/web/src/views/task/types.ts deleted file mode 100644 index e0181975..00000000 --- a/web/src/views/task/types.ts +++ /dev/null @@ -1,11 +0,0 @@ -export interface CronTask { - id: number - name: string - status: boolean - type: string - time: string - shell: string - log: string - created_at: string - updated_at: string -}