diff --git a/apps/web/src/components/models/staff/staff-form.tsx b/apps/web/src/components/models/staff/staff-form.tsx
index 1dc4920..513f08c 100755
--- a/apps/web/src/components/models/staff/staff-form.tsx
+++ b/apps/web/src/components/models/staff/staff-form.tsx
@@ -1,10 +1,11 @@
 import { Button, Form, Input, Spin, Switch, message } from "antd";
-import { useContext, useEffect} from "react";
+import { useContext, useEffect } from "react";
 import { useStaff } from "@nice/client";
 import DepartmentSelect from "../department/department-select";
-import { api } from "@nice/client"
+import { api } from "@nice/client";
 import { StaffEditorContext } from "./staff-editor";
 import { useAuth } from "@web/src/providers/auth-provider";
+import AvatarUploader from "../../common/uploader/AvatarUploader";
 export default function StaffForm() {
 	const { create, update } = useStaff(); // Ensure you have these methods in your hooks
 	const {
@@ -21,6 +22,7 @@ export default function StaffForm() {
 		{ where: { id: editId } },
 		{ enabled: !!editId }
 	);
+
 	const { isRoot } = useAuth();
 	async function handleFinish(values: any) {
 		const {
@@ -31,8 +33,9 @@ export default function StaffForm() {
 			password,
 			phoneNumber,
 			officerId,
-			enabled
-		} = values
+			enabled,
+			avatar,
+		} = values;
 		setFormLoading(true);
 		try {
 			if (data && editId) {
@@ -46,8 +49,9 @@ export default function StaffForm() {
 						password,
 						phoneNumber,
 						officerId,
-						enabled
-					}
+						enabled,
+						avatar,
+					},
 				});
 			} else {
 				await create.mutateAsync({
@@ -58,8 +62,9 @@ export default function StaffForm() {
 						domainId: fieldDomainId ? fieldDomainId : domainId,
 						password,
 						officerId,
-						phoneNumber
-					}
+						phoneNumber,
+						avatar,
+					},
 				});
 				form.resetFields();
 				if (deptId) form.setFieldValue("deptId", deptId);
@@ -77,13 +82,14 @@ export default function StaffForm() {
 	useEffect(() => {
 		form.resetFields();
 		if (data && editId) {
-			form.setFieldValue("username", data.username);
-			form.setFieldValue("showname", data.showname);
-			form.setFieldValue("domainId", data.domainId);
-			form.setFieldValue("deptId", data.deptId);
-			form.setFieldValue("officerId", data.officerId);
-			form.setFieldValue("phoneNumber", data.phoneNumber);
-			form.setFieldValue("enabled", data.enabled)
+			form.setFieldValue("username", data?.username);
+			form.setFieldValue("showname", data?.showname);
+			form.setFieldValue("domainId", data?.domainId);
+			form.setFieldValue("deptId", data?.deptId);
+			form.setFieldValue("officerId", data?.officerId);
+			form.setFieldValue("phoneNumber", data?.phoneNumber);
+			form.setFieldValue("enabled", data?.enabled);
+			form.setFieldValue("avatar", data?.avatar);
 		}
 	}, [data]);
 	useEffect(() => {
@@ -99,6 +105,7 @@ export default function StaffForm() {
 					<Spin />
 				</div>
 			)}
+
 			<Form
 				disabled={isLoading}
 				form={form}
@@ -106,6 +113,9 @@ export default function StaffForm() {
 				requiredMark="optional"
 				autoComplete="off"
 				onFinish={handleFinish}>
+				<Form.Item name={"avatar"} label="头像">
+					<AvatarUploader></AvatarUploader>
+				</Form.Item>
 				{canManageAnyStaff && (
 					<Form.Item
 						name={"domainId"}
@@ -127,7 +137,8 @@ export default function StaffForm() {
 					rules={[{ required: true }]}
 					name={"username"}
 					label="帐号">
-					<Input allowClear
+					<Input
+						allowClear
 						autoComplete="new-username" // 使用非标准的自动完成值
 						spellCheck={false}
 					/>
@@ -136,7 +147,8 @@ export default function StaffForm() {
 					rules={[{ required: true }]}
 					name={"showname"}
 					label="姓名">
-					<Input allowClear
+					<Input
+						allowClear
 						autoComplete="new-name" // 使用非标准的自动完成值
 						spellCheck={false}
 					/>
@@ -146,8 +158,8 @@ export default function StaffForm() {
 						{
 							required: false,
 							pattern: /^\d{5,18}$/,
-							message: "请输入正确的证件号（数字）"
-						}
+							message: "请输入正确的证件号（数字）",
+						},
 					]}
 					name={"officerId"}
 					label="证件号">
@@ -158,20 +170,29 @@ export default function StaffForm() {
 						{
 							required: false,
 							pattern: /^\d{6,11}$/,
-							message: "请输入正确的手机号（数字）"
-						}
+							message: "请输入正确的手机号（数字）",
+						},
 					]}
 					name={"phoneNumber"}
 					label="手机号">
-					<Input autoComplete="new-phone" // 使用非标准的自动完成值
-						spellCheck={false} allowClear />
+					<Input
+						autoComplete="new-phone" // 使用非标准的自动完成值
+						spellCheck={false}
+						allowClear
+					/>
 				</Form.Item>
 				<Form.Item label="密码" name={"password"}>
-					<Input.Password spellCheck={false} visibilityToggle autoComplete="new-password" />
+					<Input.Password
+						spellCheck={false}
+						visibilityToggle
+						autoComplete="new-password"
+					/>
 				</Form.Item>
-				{editId && <Form.Item label="是否启用" name={"enabled"}>
-					<Switch></Switch>
-				</Form.Item>}
+				{editId && (
+					<Form.Item label="是否启用" name={"enabled"}>
+						<Switch></Switch>
+					</Form.Item>
+				)}
 			</Form>
 		</div>
 	);