diff --git a/frontend/src/pages/Deploy/ProjectGroup/List/index.tsx b/frontend/src/pages/Deploy/ProjectGroup/List/index.tsx index 4d5e8bd1..377631d0 100644 --- a/frontend/src/pages/Deploy/ProjectGroup/List/index.tsx +++ b/frontend/src/pages/Deploy/ProjectGroup/List/index.tsx @@ -1,12 +1,13 @@ import React, {useState} from 'react'; import {PageContainer} from '@ant-design/pro-layout'; -import {Button, Space, Popconfirm, Tag, App} from 'antd'; +import {Button, Space, Popconfirm, Tag, App, Form, Input, Select, Card} from 'antd'; import { PlusOutlined, EditOutlined, DeleteOutlined, TeamOutlined, EnvironmentOutlined, + SearchOutlined, } from '@ant-design/icons'; import {getProjectGroupPage, deleteProjectGroup} from './service'; import type {ProjectGroup, ProjectGroupQueryParams} from './types'; @@ -20,6 +21,7 @@ const ProjectGroupList: React.FC = () => { const [modalVisible, setModalVisible] = useState(false); const [currentProject, setCurrentProject] = useState(); const actionRef = React.useRef(); + const [searchForm] = Form.useForm(); const {message: messageApi} = App.useApp(); const handleDelete = async (id: number) => { @@ -53,6 +55,10 @@ const ProjectGroupList: React.FC = () => { actionRef.current?.reload(); }; + const handleSearch = async (values: any) => { + actionRef.current?.reload(); + }; + const columns: ProColumns[] = [ { title: '项目组编码', @@ -61,12 +67,18 @@ const ProjectGroupList: React.FC = () => { copyable: true, ellipsis: true, fixed: 'left', + filters: true, + filterSearch: true, + onFilter: (value: string, record) => record.projectGroupCode.toLowerCase().includes(value.toLowerCase()), }, { title: '项目组名称', dataIndex: 'projectGroupName', width: 150, ellipsis: true, + filters: true, + filterSearch: true, + onFilter: (value: string, record) => record.projectGroupName.toLowerCase().includes(value.toLowerCase()), }, { title: '项目组描述', @@ -171,6 +183,56 @@ const ProjectGroupList: React.FC = () => { return ( + +
+ + + + + + + + + + + + + + + +
+
columns={columns} actionRef={actionRef} @@ -206,12 +268,14 @@ const ProjectGroupList: React.FC = () => { }} request={async (params) => { try { + const formValues = searchForm.getFieldsValue(); const queryParams: ProjectGroupQueryParams = { pageSize: params.pageSize, pageNum: params.current, - projectGroupName: params.projectGroupName as string, - projectGroupCode: params.projectGroupCode as string, - enabled: params.enabled as boolean, + projectGroupCode: formValues.projectGroupCode?.trim(), + projectGroupName: formValues.projectGroupName?.trim(), + type: formValues.type, + enabled: formValues.enabled, }; const data = await getProjectGroupPage(queryParams); return {