From 9a81c771679fc24e3309ffc1f5697e7633a79bf6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=80=97=E5=AD=90?= Date: Wed, 5 Feb 2025 23:18:36 +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/apps/mysql/index.ts | 20 ++-- web/src/api/apps/nginx/index.ts | 12 +- web/src/api/apps/php/index.ts | 28 ++--- web/src/api/apps/phpmyadmin/index.ts | 10 +- web/src/api/apps/podman/index.ts | 11 +- web/src/api/apps/postgresql/index.ts | 16 +-- web/src/api/apps/pureftpd/index.ts | 14 +-- web/src/api/apps/redis/index.ts | 8 +- web/src/api/apps/rsync/index.ts | 15 ++- web/src/views/apps/mysql/IndexView.vue | 6 +- web/src/views/apps/nginx/IndexView.vue | 9 +- web/src/views/apps/php/PhpView.vue | 22 +--- web/src/views/apps/phpmyadmin/IndexView.vue | 12 +- web/src/views/apps/podman/IndexView.vue | 8 +- web/src/views/apps/postgresql/IndexView.vue | 14 +-- web/src/views/apps/pureftpd/IndexView.vue | 106 ++++++++---------- web/src/views/apps/pureftpd/types.ts | 4 - web/src/views/apps/redis/IndexView.vue | 7 +- web/src/views/apps/rsync/IndexView.vue | 116 +++++++++----------- web/src/views/apps/rsync/types.ts | 9 -- 20 files changed, 187 insertions(+), 260 deletions(-) delete mode 100644 web/src/views/apps/pureftpd/types.ts delete mode 100644 web/src/views/apps/rsync/types.ts diff --git a/web/src/api/apps/mysql/index.ts b/web/src/api/apps/mysql/index.ts index 46a28cf0..cc39ba6c 100644 --- a/web/src/api/apps/mysql/index.ts +++ b/web/src/api/apps/mysql/index.ts @@ -1,22 +1,20 @@ -import { request } from '@/utils' +import { http } from '@/utils' export default { // 负载状态 - load: (): any => request.get('/apps/mysql/load'), + load: (): any => http.Get('/apps/mysql/load'), // 获取配置 - config: (): any => request.get('/apps/mysql/config'), + config: (): any => http.Get('/apps/mysql/config'), // 保存配置 - saveConfig: (config: string): any => request.post('/apps/mysql/config', { config }), - // 获取错误日志 - errorLog: (): any => request.get('/apps/mysql/errorLog'), + saveConfig: (config: string): any => http.Post('/apps/mysql/config', { config }), // 清空错误日志 - clearErrorLog: (): any => request.post('/apps/mysql/clearErrorLog'), + clearErrorLog: (): any => http.Post('/apps/mysql/clearErrorLog'), // 获取慢查询日志 - slowLog: (): any => request.get('/apps/mysql/slowLog'), + slowLog: (): any => http.Get('/apps/mysql/slowLog'), // 清空慢查询日志 - clearSlowLog: (): any => request.post('/apps/mysql/clearSlowLog'), + clearSlowLog: (): any => http.Post('/apps/mysql/clearSlowLog'), // 获取 root 密码 - rootPassword: (): any => request.get('/apps/mysql/rootPassword'), + rootPassword: (): any => http.Get('/apps/mysql/rootPassword'), // 修改 root 密码 - setRootPassword: (password: string): any => request.post('/apps/mysql/rootPassword', { password }) + setRootPassword: (password: string): any => http.Post('/apps/mysql/rootPassword', { password }) } diff --git a/web/src/api/apps/nginx/index.ts b/web/src/api/apps/nginx/index.ts index 82b6a2f8..f02a6b51 100644 --- a/web/src/api/apps/nginx/index.ts +++ b/web/src/api/apps/nginx/index.ts @@ -1,14 +1,14 @@ -import { request } from '@/utils' +import { http } from '@/utils' export default { // 负载状态 - load: (): any => request.get('/apps/nginx/load'), + load: (): any => http.Get('/apps/nginx/load'), // 获取配置 - config: (): any => request.get('/apps/nginx/config'), + config: (): any => http.Get('/apps/nginx/config'), // 保存配置 - saveConfig: (config: string): any => request.post('/apps/nginx/config', { config }), + saveConfig: (config: string): any => http.Post('/apps/nginx/config', { config }), // 获取错误日志 - errorLog: (): any => request.get('/apps/nginx/errorLog'), + errorLog: (): any => http.Get('/apps/nginx/errorLog'), // 清空错误日志 - clearErrorLog: (): any => request.post('/apps/nginx/clearErrorLog') + clearErrorLog: (): any => http.Post('/apps/nginx/clearErrorLog') } diff --git a/web/src/api/apps/php/index.ts b/web/src/api/apps/php/index.ts index 42cb521b..33e38a9d 100644 --- a/web/src/api/apps/php/index.ts +++ b/web/src/api/apps/php/index.ts @@ -1,34 +1,34 @@ -import { request } from '@/utils' +import { http } from '@/utils' export default { // 设为 CLI 版本 - setCli: (version: number): any => request.post(`/apps/php${version}/setCli`), + setCli: (version: number): any => http.Post(`/apps/php${version}/setCli`), // 获取配置 - config: (version: number): any => request.get(`/apps/php${version}/config`), + config: (version: number): any => http.Get(`/apps/php${version}/config`), // 保存配置 saveConfig: (version: number, config: string): any => - request.post(`/apps/php${version}/config`, { config }), + http.Post(`/apps/php${version}/config`, { config }), // 获取FPM配置 - fpmConfig: (version: number): any => request.get(`/apps/php${version}/fpmConfig`), + fpmConfig: (version: number): any => http.Get(`/apps/php${version}/fpmConfig`), // 保存FPM配置 saveFPMConfig: (version: number, config: string): any => - request.post(`/apps/php${version}/fpmConfig`, { config }), + http.Post(`/apps/php${version}/fpmConfig`, { config }), // 负载状态 - load: (version: number): any => request.get(`/apps/php${version}/load`), + load: (version: number): any => http.Get(`/apps/php${version}/load`), // 获取错误日志 - errorLog: (version: number): any => request.get(`/apps/php${version}/errorLog`), + errorLog: (version: number): any => http.Get(`/apps/php${version}/errorLog`), // 清空错误日志 - clearErrorLog: (version: number): any => request.post(`/apps/php${version}/clearErrorLog`), + clearErrorLog: (version: number): any => http.Post(`/apps/php${version}/clearErrorLog`), // 获取慢日志 - slowLog: (version: number): any => request.get(`/apps/php${version}/slowLog`), + slowLog: (version: number): any => http.Get(`/apps/php${version}/slowLog`), // 清空慢日志 - clearSlowLog: (version: number): any => request.post(`/apps/php${version}/clearSlowLog`), + clearSlowLog: (version: number): any => http.Post(`/apps/php${version}/clearSlowLog`), // 拓展列表 - extensions: (version: number): any => request.get(`/apps/php${version}/extensions`), + extensions: (version: number): any => http.Get(`/apps/php${version}/extensions`), // 安装拓展 installExtension: (version: number, slug: string): any => - request.post(`/apps/php${version}/extensions`, { slug }), + http.Post(`/apps/php${version}/extensions`, { slug }), // 卸载拓展 uninstallExtension: (version: number, slug: string): any => - request.delete(`/apps/php${version}/extensions`, { data: { slug } }) + http.Delete(`/apps/php${version}/extensions`, { data: { slug } }) } diff --git a/web/src/api/apps/phpmyadmin/index.ts b/web/src/api/apps/phpmyadmin/index.ts index 9b75868a..1199911a 100644 --- a/web/src/api/apps/phpmyadmin/index.ts +++ b/web/src/api/apps/phpmyadmin/index.ts @@ -1,12 +1,12 @@ -import { request } from '@/utils' +import { http } from '@/utils' export default { // 获取信息 - info: (): any => request.get('/apps/phpmyadmin/info'), + info: (): any => http.Get('/apps/phpmyadmin/info'), // 设置端口 - port: (port: number): any => request.post('/apps/phpmyadmin/port', { port }), + port: (port: number): any => http.Post('/apps/phpmyadmin/port', { port }), // 获取配置 - getConfig: (): any => request.get('/apps/phpmyadmin/config'), + getConfig: (): any => http.Get('/apps/phpmyadmin/config'), // 保存配置 - saveConfig: (config: string): any => request.post('/apps/phpmyadmin/config', { config }) + saveConfig: (config: string): any => http.Post('/apps/phpmyadmin/config', { config }) } diff --git a/web/src/api/apps/podman/index.ts b/web/src/api/apps/podman/index.ts index 70c1b21e..42c7ed14 100644 --- a/web/src/api/apps/podman/index.ts +++ b/web/src/api/apps/podman/index.ts @@ -1,13 +1,12 @@ -import { request } from '@/utils' +import { http } from '@/utils' export default { // 获取注册表配置 - registryConfig: (): any => request.get('/apps/podman/registryConfig'), + registryConfig: (): any => http.Get('/apps/podman/registryConfig'), // 保存注册表配置 - saveRegistryConfig: (config: string): any => - request.post('/apps/podman/registryConfig', { config }), + saveRegistryConfig: (config: string): any => http.Post('/apps/podman/registryConfig', { config }), // 获取存储配置 - storageConfig: (): any => request.get('/apps/podman/storageConfig'), + storageConfig: (): any => http.Get('/apps/podman/storageConfig'), // 保存存储配置 - saveStorageConfig: (config: string): any => request.post('/apps/podman/storageConfig', { config }) + saveStorageConfig: (config: string): any => http.Post('/apps/podman/storageConfig', { config }) } diff --git a/web/src/api/apps/postgresql/index.ts b/web/src/api/apps/postgresql/index.ts index 366350a0..543095e5 100644 --- a/web/src/api/apps/postgresql/index.ts +++ b/web/src/api/apps/postgresql/index.ts @@ -1,18 +1,18 @@ -import { request } from '@/utils' +import { http } from '@/utils' export default { // 负载状态 - load: (): any => request.get('/apps/postgresql/load'), + load: (): any => http.Get('/apps/postgresql/load'), // 获取配置 - config: (): any => request.get('/apps/postgresql/config'), + config: (): any => http.Get('/apps/postgresql/config'), // 保存配置 - saveConfig: (config: string): any => request.post('/apps/postgresql/config', { config }), + saveConfig: (config: string): any => http.Post('/apps/postgresql/config', { config }), // 获取用户配置 - userConfig: (): any => request.get('/apps/postgresql/userConfig'), + userConfig: (): any => http.Get('/apps/postgresql/userConfig'), // 保存配置 - saveUserConfig: (config: string): any => request.post('/apps/postgresql/userConfig', { config }), + saveUserConfig: (config: string): any => http.Post('/apps/postgresql/userConfig', { config }), // 获取日志 - log: (): any => request.get('/apps/postgresql/log'), + log: (): any => http.Get('/apps/postgresql/log'), // 清空错误日志 - clearLog: (): any => request.post('/apps/postgresql/clearLog') + clearLog: (): any => http.Post('/apps/postgresql/clearLog') } diff --git a/web/src/api/apps/pureftpd/index.ts b/web/src/api/apps/pureftpd/index.ts index 55a4b2e8..6a0f2e28 100644 --- a/web/src/api/apps/pureftpd/index.ts +++ b/web/src/api/apps/pureftpd/index.ts @@ -1,19 +1,19 @@ -import { request } from '@/utils' +import { http } from '@/utils' export default { // 列表 list: (page: number, limit: number): any => - request.get('/apps/pureftpd/users', { params: { page, limit } }), + http.Get('/apps/pureftpd/users', { params: { page, limit } }), // 添加 add: (username: string, password: string, path: string): any => - request.post('/apps/pureftpd/users', { username, password, path }), + http.Post('/apps/pureftpd/users', { username, password, path }), // 删除 - delete: (username: string): any => request.delete(`/apps/pureftpd/users/${username}`), + delete: (username: string): any => http.Delete(`/apps/pureftpd/users/${username}`), // 修改密码 changePassword: (username: string, password: string): any => - request.post(`/apps/pureftpd/users/${username}/password`, { password }), + http.Post(`/apps/pureftpd/users/${username}/password`, { password }), // 获取端口 - port: (): any => request.get('/apps/pureftpd/port'), + port: (): any => http.Get('/apps/pureftpd/port'), // 修改端口 - setPort: (port: number): any => request.post('/apps/pureftpd/port', { port }) + updatePort: (port: number): any => http.Post('/apps/pureftpd/port', { port }) } diff --git a/web/src/api/apps/redis/index.ts b/web/src/api/apps/redis/index.ts index ebb92221..bb87bd28 100644 --- a/web/src/api/apps/redis/index.ts +++ b/web/src/api/apps/redis/index.ts @@ -1,10 +1,10 @@ -import { request } from '@/utils' +import { http } from '@/utils' export default { // 负载状态 - load: (): any => request.get('/apps/redis/load'), + load: (): any => http.Get('/apps/redis/load'), // 获取配置 - config: (): any => request.get('/apps/redis/config'), + config: (): any => http.Get('/apps/redis/config'), // 保存配置 - saveConfig: (config: string): any => request.post('/apps/redis/config', { config }) + saveConfig: (config: string): any => http.Post('/apps/redis/config', { config }) } diff --git a/web/src/api/apps/rsync/index.ts b/web/src/api/apps/rsync/index.ts index 8c4d3bd3..a6127d10 100644 --- a/web/src/api/apps/rsync/index.ts +++ b/web/src/api/apps/rsync/index.ts @@ -1,18 +1,17 @@ -import { request } from '@/utils' +import { http } from '@/utils' export default { // 获取配置 - config: (): any => request.get('/apps/rsync/config'), + config: (): any => http.Get('/apps/rsync/config'), // 保存配置 - saveConfig: (config: string): any => request.post('/apps/rsync/config', { config }), + saveConfig: (config: string): any => http.Post('/apps/rsync/config', { config }), // 模块列表 modules: (page: number, limit: number): any => - request.get('/apps/rsync/modules', { params: { page, limit } }), + http.Get('/apps/rsync/modules', { params: { page, limit } }), // 添加模块 - addModule: (module: any): any => request.post('/apps/rsync/modules', module), + addModule: (module: any): any => http.Post('/apps/rsync/modules', module), // 删除模块 - deleteModule: (name: string): any => request.delete('/apps/rsync/modules/' + name), + deleteModule: (name: string): any => http.Delete(`/apps/rsync/modules/${name}`), // 更新模块 - updateModule: (name: string, module: any): any => - request.post('/apps/rsync/modules/' + name, module) + updateModule: (name: string, module: any): any => http.Post(`/apps/rsync/modules/${name}`, module) } diff --git a/web/src/views/apps/mysql/IndexView.vue b/web/src/views/apps/mysql/IndexView.vue index cf98ed3c..9d77ca11 100644 --- a/web/src/views/apps/mysql/IndexView.vue +++ b/web/src/views/apps/mysql/IndexView.vue @@ -42,8 +42,7 @@ const loadColumns: any = [ const load = ref([]) const getLoad = async () => { - const { data } = await mysql.load() - return data + return await mysql.load() } const getStatus = async () => { @@ -61,8 +60,7 @@ const getRootPassword = async () => { } const getSlowLog = async () => { - const { data } = await mysql.slowLog() - return data + return await mysql.slowLog() } const getConfig = async () => { diff --git a/web/src/views/apps/nginx/IndexView.vue b/web/src/views/apps/nginx/IndexView.vue index 32ae53ca..724a00e5 100644 --- a/web/src/views/apps/nginx/IndexView.vue +++ b/web/src/views/apps/nginx/IndexView.vue @@ -42,8 +42,7 @@ const columns: any = [ const load = ref([]) const getLoad = async () => { - const { data } = await nginx.load() - return data + return await nginx.load() } const getStatus = async () => { @@ -55,13 +54,11 @@ const getIsEnabled = async () => { } const getErrorLog = async () => { - const { data } = await nginx.errorLog() - return data + return await nginx.errorLog() } const getConfig = async () => { - const { data } = await nginx.config() - return data + return await nginx.config() } const handleSaveConfig = async () => { diff --git a/web/src/views/apps/php/PhpView.vue b/web/src/views/apps/php/PhpView.vue index 51be070d..cd1e923c 100644 --- a/web/src/views/apps/php/PhpView.vue +++ b/web/src/views/apps/php/PhpView.vue @@ -130,13 +130,11 @@ const extensions = ref([]) const load = ref([]) const getLoad = async () => { - const { data } = await php.load(version.value) - return data + return await php.load(version.value) } const getExtensions = async () => { - const { data } = await php.extensions(version.value) - return data + return await php.extensions(version.value) } const getStatus = async () => { @@ -148,27 +146,19 @@ const getIsEnabled = async () => { } const getErrorLog = async () => { - php.errorLog(version.value).then((res: any) => { - errorLog.value = res.data - }) + errorLog.value = await php.errorLog(version.value) } const getSlowLog = async () => { - php.slowLog(version.value).then((res: any) => { - slowLog.value = res.data - }) + slowLog.value = await php.slowLog(version.value) } const getConfig = async () => { - php.config(version.value).then((res: any) => { - config.value = res.data - }) + config.value = await php.config(version.value) } const getFPMConfig = async () => { - php.fpmConfig(version.value).then((res: any) => { - fpmConfig.value = res.data - }) + fpmConfig.value = await php.fpmConfig(version.value) } const handleSetCli = async () => { diff --git a/web/src/views/apps/phpmyadmin/IndexView.vue b/web/src/views/apps/phpmyadmin/IndexView.vue index 551a7c97..316b18bf 100644 --- a/web/src/views/apps/phpmyadmin/IndexView.vue +++ b/web/src/views/apps/phpmyadmin/IndexView.vue @@ -19,11 +19,10 @@ const url = computed(() => { const config = ref('') const getInfo = async () => { - phpmyadmin.info().then((res: any) => { - path.value = res.data.path - port.value = res.data.port - newPort.value = res.data.port - }) + const data = await phpmyadmin.info() + path.value = data.path + port.value = data.port + newPort.value = data.port } const handleSave = async () => { @@ -33,8 +32,7 @@ const handleSave = async () => { } const getConfig = async () => { - const { data } = await phpmyadmin.getConfig() - return data + return await phpmyadmin.getConfig() } const handleSaveConfig = async () => { diff --git a/web/src/views/apps/podman/IndexView.vue b/web/src/views/apps/podman/IndexView.vue index b7cb1b42..8746da59 100644 --- a/web/src/views/apps/podman/IndexView.vue +++ b/web/src/views/apps/podman/IndexView.vue @@ -28,12 +28,8 @@ const getIsEnabled = async () => { } const getConfig = async () => { - podman.registryConfig().then((res: any) => { - registryConfig.value = res.data - }) - podman.storageConfig().then((res: any) => { - storageConfig.value = res.data - }) + registryConfig.value = await podman.registryConfig() + storageConfig.value = await podman.storageConfig() } const handleSaveRegistryConfig = async () => { diff --git a/web/src/views/apps/postgresql/IndexView.vue b/web/src/views/apps/postgresql/IndexView.vue index 4bcc674a..ca460937 100644 --- a/web/src/views/apps/postgresql/IndexView.vue +++ b/web/src/views/apps/postgresql/IndexView.vue @@ -42,8 +42,7 @@ const loadColumns: any = [ const load = ref([]) const getLoad = async () => { - const { data } = await postgresql.load() - return data + return await postgresql.load() } const getStatus = async () => { @@ -55,20 +54,15 @@ const getIsEnabled = async () => { } const getLog = async () => { - const { data } = await postgresql.log() - return data + return await postgresql.log() } const getConfig = async () => { - postgresql.config().then((res: any) => { - config.value = res.data - }) + config.value = await postgresql.config() } const getUserConfig = async () => { - postgresql.userConfig().then((res: any) => { - userConfig.value = res.data - }) + userConfig.value = await postgresql.userConfig() } const handleSaveConfig = async () => { diff --git a/web/src/views/apps/pureftpd/IndexView.vue b/web/src/views/apps/pureftpd/IndexView.vue index 30aee896..460d8485 100644 --- a/web/src/views/apps/pureftpd/IndexView.vue +++ b/web/src/views/apps/pureftpd/IndexView.vue @@ -8,7 +8,6 @@ import { NButton, NDataTable, NInput, NPopconfirm } from 'naive-ui' import pureftpd from '@/api/apps/pureftpd' import systemctl from '@/api/panel/systemctl' import { generateRandomString, renderIcon } from '@/utils' -import type { User } from '@/views/apps/pureftpd/types' const currentTab = ref('status') const status = ref(false) @@ -35,16 +34,6 @@ const changePasswordModel = ref({ password: generateRandomString(16) }) -const pagination = reactive({ - page: 1, - pageCount: 1, - pageSize: 20, - itemCount: 0, - showQuickJumper: true, - showSizePicker: true, - pageSizes: [20, 50, 100, 200] -}) - const userColumns: any = [ { title: '用户名', @@ -115,7 +104,14 @@ const userColumns: any = [ } ] -const users = ref([] as User[]) +const { loading, data, page, total, pageSize, pageCount, refresh } = usePagination( + (page, pageSize) => pureftpd.list(page, pageSize), + { + initialData: { total: 0, list: [] }, + total: (res: any) => res.total, + data: (res: any) => res.items + } +) const getStatus = async () => { status.value = await systemctl.status('pure-ftpd') @@ -126,13 +122,11 @@ const getIsEnabled = async () => { } const getPort = async () => { - await pureftpd.port().then((res: any) => { - port.value = res.data - }) + port.value = await pureftpd.port() } const handleSavePort = async () => { - await pureftpd.setPort(port.value) + await pureftpd.updatePort(port.value) window.$message.success('保存成功') } @@ -165,60 +159,41 @@ const handleRestart = async () => { await getStatus() } -const getUsers = async (page: number, limit: number) => { - const { data } = await pureftpd.list(page, limit) - return data -} - -const onPageChange = (page: number) => { - pagination.page = page - getUsers(page, pagination.pageSize).then((res) => { - users.value = res.items - pagination.itemCount = res.total - pagination.pageCount = res.total / pagination.pageSize + 1 +const handleAddUser = async () => { + useRequest( + pureftpd.add(addUserModel.value.username, addUserModel.value.password, addUserModel.value.path) + ).onSuccess(() => { + refresh() + addUserModal.value = false + addUserModel.value.username = '' + addUserModel.value.password = generateRandomString(16) + addUserModel.value.path = '' + window.$message.success('添加成功') }) } -const onPageSizeChange = (pageSize: number) => { - pagination.pageSize = pageSize - onPageChange(1) -} - -const handleAddUser = async () => { - await pureftpd.add( - addUserModel.value.username, - addUserModel.value.password, - addUserModel.value.path - ) - window.$message.success('添加成功') - onPageChange(1) - addUserModal.value = false - addUserModel.value.username = '' - addUserModel.value.password = generateRandomString(16) - addUserModel.value.path = '' -} - const handleChangePassword = async () => { - await pureftpd.changePassword( - changePasswordModel.value.username, - changePasswordModel.value.password - ) - window.$message.success('修改成功') - onPageChange(1) - changePasswordModal.value = false + useRequest( + pureftpd.changePassword(changePasswordModel.value.username, changePasswordModel.value.password) + ).onSuccess(() => { + refresh() + changePasswordModal.value = false + window.$message.success('修改成功') + }) } const handleDeleteUser = async (username: string) => { - await pureftpd.delete(username) - window.$message.success('删除成功') - onPageChange(1) + useRequest(pureftpd.delete(username)).onSuccess(() => { + refresh() + window.$message.success('删除成功') + }) } onMounted(() => { + refresh() getStatus() getIsEnabled() getPort() - onPageChange(1) }) @@ -286,12 +261,21 @@ onMounted(() => { striped remote :scroll-x="1000" - :loading="false" + :loading="loading" :columns="userColumns" - :data="users" + :data="data" :row-key="(row: any) => row.username" - @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/apps/pureftpd/types.ts b/web/src/views/apps/pureftpd/types.ts deleted file mode 100644 index f7053306..00000000 --- a/web/src/views/apps/pureftpd/types.ts +++ /dev/null @@ -1,4 +0,0 @@ -export interface User { - username: string - path: string -} diff --git a/web/src/views/apps/redis/IndexView.vue b/web/src/views/apps/redis/IndexView.vue index c1b159bc..5079475f 100644 --- a/web/src/views/apps/redis/IndexView.vue +++ b/web/src/views/apps/redis/IndexView.vue @@ -40,8 +40,7 @@ const loadColumns: any = [ const load = ref([]) const getLoad = async () => { - const { data } = await redis.load() - return data + return await redis.load() } const getStatus = async () => { @@ -53,9 +52,7 @@ const getIsEnabled = async () => { } const getConfig = async () => { - redis.config().then((res: any) => { - config.value = res.data - }) + config.value = await redis.config() } const handleSaveConfig = async () => { diff --git a/web/src/views/apps/rsync/IndexView.vue b/web/src/views/apps/rsync/IndexView.vue index 8d3f8380..f7e12d06 100644 --- a/web/src/views/apps/rsync/IndexView.vue +++ b/web/src/views/apps/rsync/IndexView.vue @@ -9,7 +9,6 @@ import { NButton, NDataTable, NInput, NPopconfirm } from 'naive-ui' import rsync from '@/api/apps/rsync' import systemctl from '@/api/panel/systemctl' import { generateRandomString, renderIcon } from '@/utils' -import type { Module } from '@/views/apps/rsync/types' const currentTab = ref('status') const status = ref(false) @@ -123,36 +122,14 @@ const processColumns: any = [ } ] -const modules = ref([]) - -const pagination = reactive({ - page: 1, - pageCount: 1, - pageSize: 20, - itemCount: 0, - showQuickJumper: true, - showSizePicker: true, - pageSizes: [20, 50, 100, 200] -}) - -const getModules = async (page: number, limit: number) => { - const { data } = await rsync.modules(page, limit) - return data -} - -const onPageChange = (page: number) => { - pagination.page = page - getModules(page, pagination.pageSize).then((res) => { - modules.value = res.items - pagination.itemCount = res.total - pagination.pageCount = res.total / pagination.pageSize + 1 - }) -} - -const onPageSizeChange = (pageSize: number) => { - pagination.pageSize = pageSize - onPageChange(1) -} +const { loading, data, page, total, pageSize, pageCount, refresh } = usePagination( + (page, pageSize) => rsync.modules(page, pageSize), + { + initialData: { total: 0, list: [] }, + total: (res: any) => res.total, + data: (res: any) => res.items + } +) const getStatus = async () => { status.value = await systemctl.status('rsyncd') @@ -163,15 +140,14 @@ const getIsEnabled = async () => { } const getConfig = async () => { - rsync.config().then((res: any) => { - config.value = res.data - }) + config.value = await rsync.config() } const handleSaveConfig = async () => { - await rsync.saveConfig(config.value) - window.$message.success('保存成功') - onPageChange(1) + useRequest(rsync.saveConfig(config.value)).onSuccess(() => { + refresh() + window.$message.success('保存成功') + }) } const handleStart = async () => { @@ -204,26 +180,28 @@ const handleRestart = async () => { } const handleModelAdd = async () => { - await rsync.addModule(addModuleModel.value) - await getConfig() - window.$message.success('添加成功') - addModuleModal.value = false - addModuleModel.value = { - name: '', - path: '/www', - comment: '', - auth_user: '', - secret: generateRandomString(16), - hosts_allow: '0.0.0.0/0' - } - onPageChange(1) + useRequest(rsync.addModule(addModuleModel.value)).onSuccess(() => { + refresh() + getConfig() + addModuleModal.value = false + addModuleModel.value = { + name: '', + path: '/www', + comment: '', + auth_user: '', + secret: generateRandomString(16), + hosts_allow: '0.0.0.0/0' + } + window.$message.success('添加成功') + }) } const handleModelDelete = async (name: string) => { - await rsync.deleteModule(name) - await getConfig() - window.$message.success('删除成功') - onPageChange(1) + useRequest(rsync.deleteModule(name)).onSuccess(() => { + refresh() + getConfig() + window.$message.success('删除成功') + }) } const handleModelEdit = async (row: any) => { @@ -237,16 +215,19 @@ const handleModelEdit = async (row: any) => { } const handleSaveModuleConfig = async () => { - await rsync.updateModule(editModuleModel.value.name, editModuleModel.value) - await getConfig() - window.$message.success('保存成功') - onPageChange(1) + useRequest(rsync.updateModule(editModuleModel.value.name, editModuleModel.value)).onSuccess( + () => { + refresh() + getConfig() + window.$message.success('保存成功') + } + ) } onMounted(() => { + refresh() getStatus() getIsEnabled() - onPageChange(1) getConfig() }) @@ -316,12 +297,21 @@ onMounted(() => { striped remote :scroll-x="1000" - :loading="false" + :loading="loading" :columns="processColumns" - :data="modules" + :data="data" :row-key="(row: any) => row.name" - @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/apps/rsync/types.ts b/web/src/views/apps/rsync/types.ts deleted file mode 100644 index 2d309e62..00000000 --- a/web/src/views/apps/rsync/types.ts +++ /dev/null @@ -1,9 +0,0 @@ -export interface Module { - name: string - path: string - comment: string - read_only: boolean - auth_user: string - secret: string - hosts_allow: string -}