diff --git a/frontend/src/views/BindDepartmentView.vue b/frontend/src/views/BindDepartmentView.vue index 4fc917e..a66938b 100644 --- a/frontend/src/views/BindDepartmentView.vue +++ b/frontend/src/views/BindDepartmentView.vue @@ -4,60 +4,39 @@

绑定部门

-
-
-
- -
-
- -
- -
+ + + + +
@@ -114,24 +93,63 @@ import MobileCardListWithCheckbox from "@/components/MobileCardListWithCheckbox. import BindModal from "@/components/PopupModal.vue"; import UnModal from "@/components/PopupModal.vue"; import TableButton from "@/components/TableButton.vue"; +import TableFilterForm from "@/components/TableFilterForm.vue"; +import type { FilterItem } from "@/components/TableFilterForm.vue"; import TableFormLayout from "@/components/TableFormLayout.vue"; import TablePagination from "@/components/TablePagination.vue"; import { useDepartmentQuery } from "@/composables/department/useDepartmentQuery"; +import { useActionExcStore } from "@/composables/store/useActionExcStore"; import { RouteName } from "@/router/constants"; import { Modal, type ModalInterface, initFlowbite } from "flowbite"; -import { onMounted, ref, watch } from "vue"; +import { onMounted, reactive, ref, watch } from "vue"; import { useRoute } from "vue-router"; import { useDepartmentBind } from "../composables/department/useDepartmentBind"; import useAlertStore from "../composables/store/useAlertStore"; -import { useActionExcStore } from "@/composables/store/useActionExcStore"; -const departmentName = ref(""); +// 定义筛选配置 +const filterConfig: FilterItem[] = [ + { + type: "input", + name: "departmentName", + placeholder: "部门名", + }, + { + type: "select", + name: "bindState", + options: [ + { value: "BIND", label: "已绑定" }, + { value: "UNBIND", label: "未绑定" }, + { value: "ALL", label: "全部" }, + ], + }, +]; + +// 筛选值 +const filterValues = reactive<{ + departmentName: string; + bindState: "BIND" | "ALL" | "UNBIND"; +}>({ + departmentName: "", + bindState: "ALL", +}); + +// 更新筛选值 +const updateFilterValues = ( + values: Record, +) => { + if (values.departmentName !== undefined) { + filterValues.departmentName = values.departmentName as string; + } + if (values.bindState !== undefined) { + filterValues.bindState = values.bindState as "BIND" | "ALL" | "UNBIND"; + } +}; + const checkedDepartmentIds = ref([]); const departmentBindModal = ref(); const departmentUnbindModal = ref(); const allChecked = ref(false); const $route = useRoute(); -const bindState = ref<"BIND" | "ALL" | "UNBIND">("ALL"); const alertStore = useAlertStore(); const actionExcStore = useActionExcStore(); @@ -159,9 +177,9 @@ const handleBindDepartmentSubmit = async () => { level: "success", }); await fetchDepartmentWith({ - name: departmentName.value, + name: filterValues.departmentName, userId: Number($route.params.userId), - bindState: bindState.value, + bindState: filterValues.bindState, }); }; @@ -178,17 +196,17 @@ const handleUnbindDepartmentSubmit = async () => { level: "success", }); await fetchDepartmentWith({ - name: departmentName.value, + name: filterValues.departmentName, userId: Number($route.params.userId), - bindState: bindState.value, + bindState: filterValues.bindState, }); }; onMounted(async () => { await fetchDepartmentWith({ - name: departmentName.value, + name: filterValues.departmentName, userId: Number($route.params.userId), - bindState: bindState.value, + bindState: filterValues.bindState, }); initFlowbite(); const $bindModalElement: HTMLElement | null = document.querySelector( @@ -210,18 +228,18 @@ onMounted(async () => { const handleSearch = async () => { await fetchDepartmentWith({ - name: departmentName.value, + name: filterValues.departmentName, userId: Number($route.params.userId), - bindState: bindState.value, + bindState: filterValues.bindState, }); }; const handlePageChange = async (page: number, pageSize: number) => { await fetchDepartmentWith( { - name: departmentName.value, + name: filterValues.departmentName, userId: Number($route.params.userId), - bindState: bindState.value, + bindState: filterValues.bindState, }, page, pageSize, diff --git a/frontend/src/views/BindPermissionView.vue b/frontend/src/views/BindPermissionView.vue index b1b89aa..af2d8d0 100644 --- a/frontend/src/views/BindPermissionView.vue +++ b/frontend/src/views/BindPermissionView.vue @@ -4,60 +4,38 @@

绑定权限

-
- -
- -
-
- -
- -
+ + + +
@@ -116,24 +94,63 @@ import MobileCardListWithCheckbox from "@/components/MobileCardListWithCheckbox. import BindModal from "@/components/PopupModal.vue"; import UnModal from "@/components/PopupModal.vue"; import TableButton from "@/components/TableButton.vue"; +import TableFilterForm from "@/components/TableFilterForm.vue"; +import type { FilterItem } from "@/components/TableFilterForm.vue"; import TableFormLayout from "@/components/TableFormLayout.vue"; import TablePagination from "@/components/TablePagination.vue"; +import { useActionExcStore } from "@/composables/store/useActionExcStore"; import { RouteName } from "@/router/constants"; import { Modal, type ModalInterface, initFlowbite } from "flowbite"; -import { onMounted, ref, watch } from "vue"; +import { onMounted, reactive, ref, watch } from "vue"; import { useRoute } from "vue-router"; import { usePermissionBind } from "../composables/permission/usePermissionBind"; import usePermissionsQuery from "../composables/permission/usePermissionQuery"; import useAlertStore from "../composables/store/useAlertStore"; -import { useActionExcStore } from "@/composables/store/useActionExcStore"; -const permissionName = ref(""); +// 定义筛选配置 +const filterConfig: FilterItem[] = [ + { + type: "input", + name: "permissionName", + placeholder: "权限名", + }, + { + type: "select", + name: "bindState", + options: [ + { value: "BIND", label: "已绑定" }, + { value: "UNBIND", label: "未绑定" }, + { value: "ALL", label: "全部" }, + ], + }, +]; + +// 筛选值 +const filterValues = reactive<{ + permissionName: string; + bindState: "BIND" | "ALL" | "UNBIND"; +}>({ + permissionName: "", + bindState: "ALL", +}); + +// 更新筛选值 +const updateFilterValues = ( + values: Record, +) => { + if (values.permissionName !== undefined) { + filterValues.permissionName = values.permissionName as string; + } + if (values.bindState !== undefined) { + filterValues.bindState = values.bindState as "BIND" | "ALL" | "UNBIND"; + } +}; + const checkedPermissionIds = ref([]); const permissionBindModal = ref(); const permissionUnbindModal = ref(); const allChecked = ref(false); const $route = useRoute(); -const bindState = ref<"BIND" | "ALL" | "UNBIND">("ALL"); const alertStore = useAlertStore(); const actionExcStore = useActionExcStore(); @@ -160,9 +177,9 @@ const handleBindPermissionSubmit = async () => { clearCheckedRoleIds(); allChecked.value = false; await fetchPermissionsWith({ - name: permissionName.value, + name: filterValues.permissionName, roleId: Number($route.params.roleId), - bindState: bindState.value, + bindState: filterValues.bindState, }); }; @@ -179,17 +196,17 @@ const handleUnbindPermissionSubmit = async () => { clearCheckedRoleIds(); allChecked.value = false; await fetchPermissionsWith({ - name: permissionName.value, + name: filterValues.permissionName, roleId: Number($route.params.roleId), - bindState: bindState.value, + bindState: filterValues.bindState, }); }; onMounted(async () => { await fetchPermissionsWith({ - name: permissionName.value, + name: filterValues.permissionName, roleId: Number($route.params.roleId), - bindState: bindState.value, + bindState: filterValues.bindState, }); initFlowbite(); const $bindModalElement: HTMLElement | null = document.querySelector( @@ -215,18 +232,18 @@ onMounted(async () => { const handleSearch = async () => { await fetchPermissionsWith({ - name: permissionName.value, + name: filterValues.permissionName, roleId: Number($route.params.roleId), - bindState: bindState.value, + bindState: filterValues.bindState, }); }; const handlePageChange = async (page: number, pageSize: number) => { await fetchPermissionsWith( { - name: permissionName.value, + name: filterValues.permissionName, roleId: Number($route.params.roleId), - bindState: bindState.value, + bindState: filterValues.bindState, }, page, pageSize, diff --git a/frontend/src/views/BindPositionView.vue b/frontend/src/views/BindPositionView.vue index 81f3fe7..d38a882 100644 --- a/frontend/src/views/BindPositionView.vue +++ b/frontend/src/views/BindPositionView.vue @@ -4,60 +4,38 @@

绑定岗位

-
- -
- -
-
- -
- -
+ + + +
@@ -107,25 +85,64 @@ import MobileCardListWithCheckbox from "@/components/MobileCardListWithCheckbox. import BindModal from "@/components/PopupModal.vue"; import UnModal from "@/components/PopupModal.vue"; import TableButton from "@/components/TableButton.vue"; +import TableFilterForm from "@/components/TableFilterForm.vue"; +import type { FilterItem } from "@/components/TableFilterForm.vue"; import TableFormLayout from "@/components/TableFormLayout.vue"; import TablePagination from "@/components/TablePagination.vue"; import { usePositionBind } from "@/composables/position/usePositionBind"; import { usePositionQuery } from "@/composables/position/usePositionQuery"; +import { useActionExcStore } from "@/composables/store/useActionExcStore"; import { useMobileStyles } from "@/composables/useMobileStyles"; import { RouteName } from "@/router/constants"; import { Modal, type ModalInterface, initFlowbite } from "flowbite"; -import { onMounted, ref, watch } from "vue"; +import { onMounted, reactive, ref, watch } from "vue"; import { useRoute } from "vue-router"; import useAlertStore from "../composables/store/useAlertStore"; -import { useActionExcStore } from "@/composables/store/useActionExcStore"; -const positionName = ref(""); +// 定义筛选配置 +const filterConfig: FilterItem[] = [ + { + type: "input", + name: "positionName", + placeholder: "岗位名", + }, + { + type: "select", + name: "bindState", + options: [ + { value: "BIND", label: "已绑定" }, + { value: "UNBIND", label: "未绑定" }, + { value: "ALL", label: "全部" }, + ], + }, +]; + +// 筛选值 +const filterValues = reactive<{ + positionName: string; + bindState: "BIND" | "ALL" | "UNBIND"; +}>({ + positionName: "", + bindState: "ALL", +}); + +// 更新筛选值 +const updateFilterValues = ( + values: Record, +) => { + if (values.positionName !== undefined) { + filterValues.positionName = values.positionName as string; + } + if (values.bindState !== undefined) { + filterValues.bindState = values.bindState as "BIND" | "ALL" | "UNBIND"; + } +}; + const checkedPositionIds = ref([]); const positionBindModal = ref(); const positionUnbindModal = ref(); const allChecked = ref(false); const $route = useRoute(); -const bindState = ref<"BIND" | "ALL" | "UNBIND">("ALL"); const alertStore = useAlertStore(); const actionExcStore = useActionExcStore(); @@ -147,9 +164,9 @@ const handleBindPositionSubmit = async () => { level: "success", }); await fetchPositionWith({ - name: positionName.value, + name: filterValues.positionName, userId: Number($route.params.userId), - bindState: bindState.value, + bindState: filterValues.bindState, }); clearCheckedPositionIds(); allChecked.value = false; @@ -163,9 +180,9 @@ const handleUnbindPositionSubmit = async () => { level: "success", }); await fetchPositionWith({ - name: positionName.value, + name: filterValues.positionName, userId: Number($route.params.userId), - bindState: bindState.value, + bindState: filterValues.bindState, }); clearCheckedPositionIds(); allChecked.value = false; @@ -173,9 +190,9 @@ const handleUnbindPositionSubmit = async () => { onMounted(async () => { await fetchPositionWith({ - name: positionName.value, + name: filterValues.positionName, userId: Number($route.params.userId), - bindState: bindState.value, + bindState: filterValues.bindState, }); initFlowbite(); const $bindModalElement: HTMLElement | null = document.querySelector( @@ -201,18 +218,18 @@ onMounted(async () => { const handleSearch = async () => { await fetchPositionWith({ - name: positionName.value, + name: filterValues.positionName, userId: Number($route.params.userId), - bindState: bindState.value, + bindState: filterValues.bindState, }); }; const handlePageChange = async (page: number, pageSize: number) => { await fetchPositionWith( { - name: positionName.value, + name: filterValues.positionName, userId: Number($route.params.userId), - bindState: bindState.value, + bindState: filterValues.bindState, }, page, pageSize, diff --git a/frontend/src/views/DepartmentView.vue b/frontend/src/views/DepartmentView.vue index dc0a573..6230ecf 100644 --- a/frontend/src/views/DepartmentView.vue +++ b/frontend/src/views/DepartmentView.vue @@ -4,35 +4,21 @@

部门管理

-
- - -
-
-
- - -
- - -
+ + + +
@@ -131,19 +117,45 @@ import DepartmentUpsertModal from "@/components/DepartmentUpsertModal.vue"; import MobileCardList from "@/components/MobileCardList.vue"; import DepartmentDeleteModal from "@/components/PopupModal.vue"; import TableButton from "@/components/TableButton.vue"; +import TableFilterForm from "@/components/TableFilterForm.vue"; +import type { FilterItem } from "@/components/TableFilterForm.vue"; import TableFormLayout from "@/components/TableFormLayout.vue"; import TablePagination from "@/components/TablePagination.vue"; +import { useActionExcStore } from "@/composables/store/useActionExcStore"; import type { DepartmentUpsertModel } from "@/types/department"; import { Modal, type ModalInterface, initFlowbite } from "flowbite"; -import { nextTick, onMounted, ref } from "vue"; +import { nextTick, onMounted, reactive, ref } from "vue"; import type { components } from "../api/types/schema"; import useDepartmentDelete from "../composables/department/useDepartmentDelete"; import { useDepartmentQuery } from "../composables/department/useDepartmentQuery"; import { useDepartmentUpsert } from "../composables/department/useDepartmentUpsert"; import useAlertStore from "../composables/store/useAlertStore"; -import { useActionExcStore } from "@/composables/store/useActionExcStore"; -const name = ref(""); +// 定义筛选配置 +const filterConfig = [ + { + type: "input", + name: "departmentName", + placeholder: "部门名称", + }, +] as FilterItem[]; + +// 筛选值 +const filterValues = reactive<{ + departmentName: string; +}>({ + departmentName: "", +}); + +// 更新筛选值 +const updateFilterValues = ( + values: Record, +) => { + if (values.departmentName !== undefined) { + filterValues.departmentName = values.departmentName as string; + } +}; + const selectedDepartment = ref(); const departmentUpsertModal = ref(); const departmentDeleteModal = ref(); @@ -170,7 +182,7 @@ const columns = [ onMounted(async () => { await fetchDepartmentWith({ - name: name.value, + name: filterValues.departmentName, }); initFlowbite(); const $upsertModalElement: HTMLElement | null = document.querySelector( @@ -202,7 +214,7 @@ const handleUpsertDepartmentSubmit = async ( level: "success", }); await fetchDepartmentWith({ - name: name.value, + name: filterValues.departmentName, }); }; @@ -210,14 +222,14 @@ const handleUpsertDepartmentClick = async ( department?: components["schemas"]["Department"], ) => { selectedDepartment.value = department; - await fetchAvailableDepartments(selectedDepartment.value?.id); + await fetchAvailableDepartments(department?.id); await nextTick(() => { departmentUpsertModal.value?.show(); }); }; const handleDeleteDepartmentSubmit = async () => { - if (!selectedDepartment?.value?.id) return; + if (!selectedDepartment.value?.id) return; await deleteDepartment(selectedDepartment.value.id); departmentDeleteModal.value?.hide(); alertStore.showAlert({ @@ -225,7 +237,7 @@ const handleDeleteDepartmentSubmit = async () => { level: "success", }); await fetchDepartmentWith({ - name: name.value, + name: filterValues.departmentName, }); }; @@ -240,17 +252,17 @@ const handleDeleteDepartmentClick = async ( const handleSearch = async () => { await fetchDepartmentWith({ - name: name.value, + name: filterValues.departmentName, }); }; -const handlePageChange = async (page: number, size: number) => { +const handlePageChange = async (page: number, pageSize: number) => { await fetchDepartmentWith( { - name: name.value, + name: filterValues.departmentName, }, page, - size, + pageSize, ); }; diff --git a/frontend/src/views/LlmConfigView.vue b/frontend/src/views/LlmConfigView.vue index c2c41a3..4edd05d 100644 --- a/frontend/src/views/LlmConfigView.vue +++ b/frontend/src/views/LlmConfigView.vue @@ -4,26 +4,10 @@

大模型管理

-
-
- -
-
- -
- - -
-
-
+ + +
@@ -134,18 +118,44 @@ import Breadcrumbs from "@/components/Breadcrumbs.vue"; import LlmUpdateModal from "@/components/LlmUpdateModal.vue"; import MobileCardList from "@/components/MobileCardList.vue"; +import TableFilterForm from "@/components/TableFilterForm.vue"; +import type { FilterItem } from "@/components/TableFilterForm.vue"; import TableFormLayout from "@/components/TableFormLayout.vue"; import TablePagination from "@/components/TablePagination.vue"; import { useLlmQuery } from "@/composables/ai/useLlmQuery"; import { useLlmUpdate } from "@/composables/ai/useLlmUpdate"; import useAlertStore from "@/composables/store/useAlertStore"; import { Modal, type ModalInterface, initFlowbite } from "flowbite"; -import { nextTick, onMounted, ref } from "vue"; +import { nextTick, onMounted, reactive, ref } from "vue"; import type { components } from "../api/types/schema"; +// 定义筛选配置 +const filterConfig: FilterItem[] = [ + { + type: "input", + name: "modelName", + placeholder: "模型名称", + }, +]; + +// 筛选值 +const filterValues = reactive<{ + modelName: string; +}>({ + modelName: "", +}); + +// 更新筛选值 +const updateFilterValues = ( + values: Record, +) => { + if (values.modelName !== undefined) { + filterValues.modelName = values.modelName as string; + } +}; + const llmUpdateModal = ref(); const selectedLlm = ref(); -const name = ref(""); const { llms, fetchLlmConfigs, total } = useLlmQuery(); const { updateLlmConfig } = useLlmUpdate(); @@ -171,15 +181,15 @@ const handleUpdateModalSubmit = async (llm: components["schemas"]["LlmVm"]) => { level: "success", content: "操作成功", }); - await fetchLlmConfigs(); + await fetchLlmConfigs(1, 10, filterValues.modelName); }; const handleSearch = async () => { - await fetchLlmConfigs(); + await fetchLlmConfigs(1, 10, filterValues.modelName); }; const handlePageChange = async (page: number, pageSize: number) => { - await fetchLlmConfigs(page, pageSize); + await fetchLlmConfigs(page, pageSize, filterValues.modelName); }; const handleLlmUpdateClick = async (llm: components["schemas"]["LlmVm"]) => { @@ -190,7 +200,7 @@ const handleLlmUpdateClick = async (llm: components["schemas"]["LlmVm"]) => { }; onMounted(async () => { - await fetchLlmConfigs(); + await fetchLlmConfigs(1, 10, filterValues.modelName); initFlowbite(); const $llmUpdateModalElement: HTMLElement | null = document.querySelector("#llm-update-modal"); diff --git a/frontend/src/views/PermissionView.vue b/frontend/src/views/PermissionView.vue index 3713ab0..9bc1645 100644 --- a/frontend/src/views/PermissionView.vue +++ b/frontend/src/views/PermissionView.vue @@ -4,36 +4,21 @@

权限管理

-
-
- -
-
-
- - -
-
- - -
+ + + +
@@ -125,26 +110,51 @@ diff --git a/frontend/src/views/RoleView.vue b/frontend/src/views/RoleView.vue index 1ccb99e..0ded731 100644 --- a/frontend/src/views/RoleView.vue +++ b/frontend/src/views/RoleView.vue @@ -4,36 +4,21 @@

角色管理

-
-
- -
-
-
- - -
-
- - -
+ + + +
@@ -145,21 +130,47 @@ import Button from "@/components/Button.vue"; import MobileCardList from "@/components/MobileCardList.vue"; import RoleDeleteModal from "@/components/PopupModal.vue"; import RoleUpsertModal from "@/components/RoleUpsertModal.vue"; +import TableFilterForm from "@/components/TableFilterForm.vue"; +import type { FilterItem } from "@/components/TableFilterForm.vue"; import TableFormLayout from "@/components/TableFormLayout.vue"; import TablePagination from "@/components/TablePagination.vue"; import useRoleDelete from "@/composables/role/useRoleDelete"; import { useRolesQuery } from "@/composables/role/useRolesQuery"; +import { useActionExcStore } from "@/composables/store/useActionExcStore"; import { RouteName } from "@/router/constants"; import type { RoleUpsertModel } from "@/types/role"; import { Modal, type ModalInterface, initFlowbite } from "flowbite"; -import { nextTick, onMounted, ref } from "vue"; +import { nextTick, onMounted, reactive, ref } from "vue"; import { useRouter } from "vue-router"; import type { components } from "../api/types/schema"; import { useRoleUpsert } from "../composables/role/useRoleUpsert"; import useAlertStore from "../composables/store/useAlertStore"; -import { useActionExcStore } from "@/composables/store/useActionExcStore"; -const roleName = ref(""); +// 定义筛选配置 +const filterConfig = [ + { + type: "input", + name: "roleName", + placeholder: "角色名", + }, +] as FilterItem[]; + +// 筛选值 +const filterValues = reactive<{ + roleName: string; +}>({ + roleName: "", +}); + +// 更新筛选值 +const updateFilterValues = ( + values: Record, +) => { + if (values.roleName !== undefined) { + filterValues.roleName = values.roleName as string; + } +}; + const selectedRole = ref(); const roleUpsertModal = ref(); const roleDeleteModal = ref(); @@ -181,7 +192,7 @@ const columns = [ onMounted(async () => { await fetchRolesWith({ - name: roleName.value, + name: filterValues.roleName, }); initFlowbite(); const $upsertModalElement: HTMLElement | null = @@ -203,14 +214,14 @@ onMounted(async () => { const handleUpsertModalSubmit = async (data: RoleUpsertModel) => { await upsertRole.upsertRole(data); - await fetchRolesWith({ - name: roleName.value, - }); roleUpsertModal.value?.hide(); alertStore.showAlert({ content: "操作成功", level: "success", }); + await fetchRolesWith({ + name: filterValues.roleName, + }); }; const handleUpsertRoleClick = async ( @@ -222,17 +233,28 @@ const handleUpsertRoleClick = async ( }); }; -const handleDeletedModalSubmit = async () => { - if (!selectedRole?.value?.id) return; - await deleteRole(selectedRole.value.id); - await fetchRolesWith({ - name: roleName.value, +const handleBindPermissionClick = async ( + role: components["schemas"]["RoleDto"], +) => { + router.push({ + name: RouteName.BINDPERMISSIONVIEW, + params: { + roleId: role.id, + }, }); +}; + +const handleDeletedModalSubmit = async () => { + if (!selectedRole.value?.id) return; + await deleteRole(selectedRole.value.id); roleDeleteModal.value?.hide(); alertStore.showAlert({ content: "删除成功", level: "success", }); + await fetchRolesWith({ + name: filterValues.roleName, + }); }; const handleDeleteRoleClick = async ( @@ -244,24 +266,16 @@ const handleDeleteRoleClick = async ( }); }; -const handleBindPermissionClick = async ( - role: components["schemas"]["RoleDto"], -) => { - router.push({ - name: RouteName.BINDPERMISSIONVIEW, - params: { roleId: role.id }, - }); -}; const handleSearch = async () => { await fetchRolesWith({ - name: roleName.value, + name: filterValues.roleName, }); }; const handlePageChange = async (page: number, pageSize: number) => { await fetchRolesWith( { - name: roleName.value, + name: filterValues.roleName, }, page, pageSize, diff --git a/frontend/src/views/SchedulerView.vue b/frontend/src/views/SchedulerView.vue index fd6591d..6eb87ec 100644 --- a/frontend/src/views/SchedulerView.vue +++ b/frontend/src/views/SchedulerView.vue @@ -4,26 +4,10 @@

任务管理

-
-
- -
-
- -
- - -
-
-
+ + +
@@ -167,6 +151,8 @@ import Breadcrumbs from "@/components/Breadcrumbs.vue"; import MobileCardList from "@/components/MobileCardList.vue"; import PopupModal from "@/components/PopupModal.vue"; import SchedulerUpdateModal from "@/components/SchedulerUpdateModal.vue"; +import TableFilterForm from "@/components/TableFilterForm.vue"; +import type { FilterItem } from "@/components/TableFilterForm.vue"; import TableFormLayout from "@/components/TableFormLayout.vue"; import TablePagination from "@/components/TablePagination.vue"; import { useJobControl } from "@/composables/job/useJobControl"; @@ -175,10 +161,34 @@ import { useJobUpdate } from "@/composables/job/useJobUpdate"; import useAlertStore from "@/composables/store/useAlertStore"; import { dayjs } from "@/utils/dateUtil"; import { Modal, type ModalInterface, initFlowbite } from "flowbite"; -import { nextTick, onMounted, ref } from "vue"; +import { nextTick, onMounted, reactive, ref } from "vue"; import type { components } from "../api/types/schema"; -const jobName = ref(""); +// 定义筛选配置 +const filterConfig: FilterItem[] = [ + { + type: "input", + name: "jobName", + placeholder: "任务名称", + }, +]; + +// 筛选值 +const filterValues = reactive<{ + jobName: string; +}>({ + jobName: "", +}); + +// 更新筛选值 +const updateFilterValues = ( + values: Record, +) => { + if (values.jobName !== undefined) { + filterValues.jobName = values.jobName as string; + } +}; + const jobResumeModal = ref(); const jobPauseModal = ref(); const jobUpdateModal = ref(); @@ -249,7 +259,7 @@ const handleResumeModalSubmit = async () => { content: "操作成功", }); await fetchJobsWith({ - name: jobName.value, + name: filterValues.jobName, }); }; @@ -265,7 +275,7 @@ const handleUpdateModalSubmit = async (cronExpression: string) => { content: "操作成功", }); await fetchJobsWith({ - name: jobName.value, + name: filterValues.jobName, }); }; @@ -280,20 +290,20 @@ const handlePauseModalSubmit = async () => { content: "操作成功", }); await fetchJobsWith({ - name: jobName.value, + name: filterValues.jobName, }); }; const handleSearch = async () => { await fetchJobsWith({ - name: jobName.value, + name: filterValues.jobName, }); }; const handlePageChange = async (page: number, pageSize: number) => { await fetchJobsWith( { - name: jobName.value, + name: filterValues.jobName, }, page, pageSize, @@ -302,7 +312,7 @@ const handlePageChange = async (page: number, pageSize: number) => { onMounted(async () => { await fetchJobsWith({ - name: jobName.value, + name: filterValues.jobName, }); initFlowbite(); const $jobResumeModalElement: HTMLElement | null =