refactor: 用户管理重构优化

admin/src/pages/user/searchForm.tsx

@@ -0,0 +1,75 @@
+import React from 'react';
+import {
+	Form,
+	Input,
+	Button,
+	Grid,
+	Space, Divider, Select
+} from '@arco-design/web-react';
+import {IconRefresh, IconSearch} from '@arco-design/web-react/icon';
+import {statusDict} from "@/enum/dict";
+
+const {Row, Col} = Grid;
+const {useForm} = Form;
+
+function SearchForm(props: {
+	onSearch: (values: Record<string, any>) => void;
+}) {
+	const [form] = useForm();
+
+	const handleSubmit = () => {
+		const values = form.getFieldsValue();
+		props.onSearch(values);
+	};
+
+	const handleReset = () => {
+		form.resetFields();
+		props.onSearch({});
+	};
+
+	const colSpan = 6
+
+	return (
+		<>
+			<Form
+				form={form}
+				labelCol={{span: 5}}
+				wrapperCol={{span: 19}}
+				labelAlign="left"
+			>
+				<Row gutter={24}>
+					<Col span={colSpan}>
+						<Form.Item label="账号" field="account">
+							<Input placeholder="请输入账号" allowClear/>
+						</Form.Item>
+					</Col>
+					<Col span={colSpan}>
+						<Form.Item label="昵称" field="name">
+							<Input placeholder="请输入昵称" allowClear/>
+						</Form.Item>
+					</Col>
+					<Col span={colSpan}>
+						<Form.Item label="状态" field="status">
+							<Select placeholder="请选择" options={statusDict} allowClear/>
+						</Form.Item>
+					</Col>
+					<Col span={colSpan}>
+						<Form.Item>
+							<Space>
+								<Button type="primary" icon={<IconSearch/>} onClick={handleSubmit}>
+									搜索
+								</Button>
+								<Button icon={<IconRefresh/>} onClick={handleReset}>
+									重置
+								</Button>
+							</Space>
+						</Form.Item>
+					</Col>
+				</Row>
+			</Form>
+			<Divider style={{margin: '0 0 20px 0'}}/>
+		</>
+	);
+}
+
+export default SearchForm;