个人设置-头像

This commit is contained in:
2026-01-27 15:36:28 +08:00
parent 3540f51429
commit 3e2b4d2453
10 changed files with 52 additions and 31 deletions

View File

@@ -1,4 +1,4 @@
import { Button, DatePicker, Form, Input, notification, Select } from 'antd'; import { App, Button, DatePicker, Form, Input, Select } from 'antd';
import TextArea from 'antd/lib/input/TextArea'; import TextArea from 'antd/lib/input/TextArea';
import dayjs from 'dayjs'; import dayjs from 'dayjs';
import { stringify } from 'qs'; import { stringify } from 'qs';
@@ -23,11 +23,12 @@ export const CompanyEditModal: React.FC<IProps> = (props) => {
const [title, setTitle] = useState(''); const [title, setTitle] = useState('');
const [form] = Form.useForm(); const [form] = Form.useForm();
const [data, setData] = useState<any>(null); const [data, setData] = useState<any>(null);
const { notification } = App.useApp();
// 请求成功回调 // 请求成功回调
const success = (res: any) => { const success = (res: any) => {
if (res.err_code === 0) { if (res.err_code === 0) {
notification.success({ message: '保存成功' }); notification.success({ title: '保存成功' });
props.onCallback?.(); props.onCallback?.();
setOpen(false); setOpen(false);
form.resetFields(); // 提交成功重置表单 form.resetFields(); // 提交成功重置表单

View File

@@ -1,4 +1,4 @@
import { Button, Form, Input, notification, Upload } from 'antd'; import { App, Button, Form, Input, Upload } from 'antd';
import type React from 'react'; import type React from 'react';
import { useEffect, useRef, useState } from 'react'; import { useEffect, useRef, useState } from 'react';
import { AdminServices } from '@/services/AdminServices'; import { AdminServices } from '@/services/AdminServices';
@@ -19,11 +19,12 @@ export const ProfileEditForm: React.FC<IProps> = (props) => {
const userInfo = useUserStore().user; const userInfo = useUserStore().user;
const [previewUrl, setPreviewUrl] = useState<string>(); const [previewUrl, setPreviewUrl] = useState<string>();
const avatarFileRef = useRef<File | null>(null); const avatarFileRef = useRef<File | null>(null);
const { notification } = App.useApp();
// 保存回调 // 保存回调
const success = (res: any) => { const success = (res: any) => {
if (res.err_code === 0) { if (res.err_code === 0) {
notification.success({ message: '保存成功' }); notification.success({ title: '保存成功' });
props.onCallback?.(); props.onCallback?.();
} }
}; };
@@ -55,12 +56,6 @@ export const ProfileEditForm: React.FC<IProps> = (props) => {
formData.append('avatar', avatarFileRef.current); formData.append('avatar', avatarFileRef.current);
} }
//console.log('formData entries:');
// formData.forEach((value, key) => {
// console.log(key, value);
// });
//console.log('formData', formData);
// 调用 useRequest
editRequest(formData); editRequest(formData);
} catch (error) { } catch (error) {
console.log('表单验证未通过', error); console.log('表单验证未通过', error);
@@ -68,16 +63,25 @@ export const ProfileEditForm: React.FC<IProps> = (props) => {
}; };
useEffect(() => { useEffect(() => {
const uri = `${userInfo.avatar}?v=${encodeURIComponent(userInfo.update_date)}`; const avatar = userInfo.avatar;
console.log('uri', uri);
// 只在「没选择新头像」时,使用后端头像
if (!avatarFileRef.current) {
const uri = avatar ? `/api/${avatar}?v=${encodeURIComponent(userInfo.update_date)}` : '';
setPreviewUrl(uri);
}
form.setFieldsValue({ form.setFieldsValue({
username: userInfo.username, username: userInfo.username,
mobile: userInfo.mobile, mobile: userInfo.mobile,
email: userInfo.email, email: userInfo.email,
nickname: userInfo.nickname, nickname: userInfo.nickname,
avatar: uri, // 默认头像 //avatar: uri, // 默认头像
}); });
setPreviewUrl(userInfo.avatar); //setPreviewUrl(uri);
avatarFileRef.current = null;
}, [userInfo]); }, [userInfo]);
return ( return (

View File

@@ -1,4 +1,4 @@
import { Button, Form, Input, notification, Select } from 'antd'; import { App, Button, Form, Input, Select } from 'antd';
import TextArea from 'antd/lib/input/TextArea'; import TextArea from 'antd/lib/input/TextArea';
import { stringify } from 'qs'; import { stringify } from 'qs';
import type React from 'react'; import type React from 'react';
@@ -22,11 +22,12 @@ export const AdminDepEditModal: React.FC<IProps> = (props) => {
const [title, setTitle] = useState(''); const [title, setTitle] = useState('');
const [form] = Form.useForm(); const [form] = Form.useForm();
const [data, setData] = useState<any>(null); const [data, setData] = useState<any>(null);
const { notification } = App.useApp();
// 请求成功回调 // 请求成功回调
const success = (res: any) => { const success = (res: any) => {
if (res.err_code === 0) { if (res.err_code === 0) {
notification.success({ message: '保存成功' }); notification.success({ title: '保存成功' });
props.onCallback?.(); props.onCallback?.();
setOpen(false); setOpen(false);
form.resetFields(); // 提交成功重置表单 form.resetFields(); // 提交成功重置表单

View File

@@ -48,7 +48,7 @@ const DepListForm: React.FC = () => {
const { request: deleteAdminDepartmentRequest } = useRequest(AdminDepartmentServices.del, { const { request: deleteAdminDepartmentRequest } = useRequest(AdminDepartmentServices.del, {
onSuccessCodeZero: (res) => { onSuccessCodeZero: (res) => {
if (res.err_code == 0) { if (res.err_code == 0) {
notification.success({ message: '删除成功' }); notification.success({ title: '删除成功' });
page(params.curr_page); page(params.curr_page);
} }
}, },

View File

@@ -1,4 +1,4 @@
import { Button, Form, Input, notification, Select, Space, Tree } from 'antd'; import { App, Button, Form, Input, Select, Space, Tree } from 'antd';
import TextArea from 'antd/lib/input/TextArea'; import TextArea from 'antd/lib/input/TextArea';
import { stringify } from 'qs'; import { stringify } from 'qs';
import type React from 'react'; import type React from 'react';
@@ -26,11 +26,12 @@ export const AdminGrpEditModal: React.FC<IProps> = (props) => {
const [menuTree, setMenuTree] = useState<any[]>([]); const [menuTree, setMenuTree] = useState<any[]>([]);
const [checkedKeys, setCheckedKeys] = useState<React.Key[]>([]); const [checkedKeys, setCheckedKeys] = useState<React.Key[]>([]);
const [expandedKeys, setExpandedKeys] = useState<React.Key[]>([]); const [expandedKeys, setExpandedKeys] = useState<React.Key[]>([]);
const { notification } = App.useApp();
// 请求成功回调 // 请求成功回调
const success = (res: any) => { const success = (res: any) => {
if (res.err_code === 0) { if (res.err_code === 0) {
notification.success({ message: '保存成功' }); notification.success({ title: '保存成功' });
props.onCallback?.(); props.onCallback?.();
setOpen(false); setOpen(false);
form.resetFields(); form.resetFields();

View File

@@ -1,4 +1,4 @@
import { Button, DatePicker, Input, notification, Popconfirm, Select } from 'antd'; import { App, Button, DatePicker, Input, Popconfirm, Select } from 'antd';
import { stringify } from 'qs'; import { stringify } from 'qs';
import { useEffect, useRef, useState } from 'react'; import { useEffect, useRef, useState } from 'react';
import { FormItemPlugin, FormPlugin } from '@/components/FormPlugin'; import { FormItemPlugin, FormPlugin } from '@/components/FormPlugin';
@@ -33,6 +33,7 @@ const GrpListForm: React.FC = () => {
const [ajaxData, setAjaxData] = useState<IAjaxData>({ count: 0, data: [] }); const [ajaxData, setAjaxData] = useState<IAjaxData>({ count: 0, data: [] });
//const [showMoreSearch, setShowMoreSearch] = useState(false); //const [showMoreSearch, setShowMoreSearch] = useState(false);
const AdminGrpEditModalRef = useRef<IAdminGrpEditModalType>(null); const AdminGrpEditModalRef = useRef<IAdminGrpEditModalType>(null);
const { notification } = App.useApp();
const { loading: listLoading, request: listRequest } = useRequest(AdminGroupServices.getAdminGroupList, { const { loading: listLoading, request: listRequest } = useRequest(AdminGroupServices.getAdminGroupList, {
onSuccessCodeZero: (res) => { onSuccessCodeZero: (res) => {
@@ -46,7 +47,7 @@ const GrpListForm: React.FC = () => {
const { request: deleteAdminGroupRequest } = useRequest(AdminGroupServices.del, { const { request: deleteAdminGroupRequest } = useRequest(AdminGroupServices.del, {
onSuccessCodeZero: (res) => { onSuccessCodeZero: (res) => {
if (res.err_code == 0) { if (res.err_code == 0) {
notification.success({ message: '删除成功' }); notification.success({ title: '删除成功' });
page(params.curr_page); page(params.curr_page);
} }
}, },

View File

@@ -1,4 +1,4 @@
import { Button, Form, Input, notification, Select } from 'antd'; import { App, Button, Form, Input, Select } from 'antd';
import { stringify } from 'qs'; import { stringify } from 'qs';
import type React from 'react'; import type React from 'react';
import { useImperativeHandle, useState } from 'react'; import { useImperativeHandle, useState } from 'react';
@@ -26,6 +26,7 @@ export const AdminEditModal: React.FC<IProps> = (props) => {
const [data, setData] = useState<any>(null); const [data, setData] = useState<any>(null);
const [department, setDepartment] = useState<IOption[]>([]); const [department, setDepartment] = useState<IOption[]>([]);
const [group, setGroup] = useState<IOption[]>([]); const [group, setGroup] = useState<IOption[]>([]);
const { notification } = App.useApp();
const { request: getAdminDepartmentAjaxListRequest } = useRequest( const { request: getAdminDepartmentAjaxListRequest } = useRequest(
AdminDepartmentServices.getAdminDepartmentAjaxList, AdminDepartmentServices.getAdminDepartmentAjaxList,
@@ -45,7 +46,7 @@ export const AdminEditModal: React.FC<IProps> = (props) => {
// 请求成功回调 // 请求成功回调
const success = (res: any) => { const success = (res: any) => {
if (res.err_code === 0) { if (res.err_code === 0) {
notification.success({ message: '保存成功' }); notification.success({ title: '保存成功' });
props.onCallback?.(); props.onCallback?.();
setOpen(false); setOpen(false);
form.resetFields(); // 提交成功重置表单 form.resetFields(); // 提交成功重置表单

View File

@@ -1,4 +1,4 @@
import { Button, DatePicker, Input, notification, Popconfirm, Select } from 'antd'; import { App, Button, DatePicker, Input, Popconfirm, Select } from 'antd';
import { stringify } from 'qs'; import { stringify } from 'qs';
import { useEffect, useRef, useState } from 'react'; import { useEffect, useRef, useState } from 'react';
import { FormItemPlugin, FormPlugin } from '@/components/FormPlugin'; import { FormItemPlugin, FormPlugin } from '@/components/FormPlugin';
@@ -39,6 +39,7 @@ const AdminListForm: React.FC = () => {
const [ajaxData, setAjaxData] = useState<IAjaxData>({ count: 0, data: [] }); const [ajaxData, setAjaxData] = useState<IAjaxData>({ count: 0, data: [] });
const [showMoreSearch, setShowMoreSearch] = useState(false); const [showMoreSearch, setShowMoreSearch] = useState(false);
const AdminEditModalRef = useRef<IAdminEditModalType>(null); const AdminEditModalRef = useRef<IAdminEditModalType>(null);
const { notification } = App.useApp();
const { loading: listLoading, request: listRequest } = useRequest(AdminServices.getAdminList, { const { loading: listLoading, request: listRequest } = useRequest(AdminServices.getAdminList, {
onSuccessCodeZero: (res) => { onSuccessCodeZero: (res) => {
@@ -52,7 +53,7 @@ const AdminListForm: React.FC = () => {
const { request: deleteAdminRequest } = useRequest(AdminServices.del, { const { request: deleteAdminRequest } = useRequest(AdminServices.del, {
onSuccessCodeZero: (res) => { onSuccessCodeZero: (res) => {
if (res.err_code == 0) { if (res.err_code == 0) {
notification.success({ message: '删除成功' }); notification.success({ title: '删除成功' });
page(params.curr_page); page(params.curr_page);
} }
}, },

View File

@@ -1,4 +1,4 @@
import { Button, Form, Input, notification, Select } from 'antd'; import { App, Button, Form, Input, Select } from 'antd';
import TextArea from 'antd/lib/input/TextArea'; import TextArea from 'antd/lib/input/TextArea';
import { stringify } from 'qs'; import { stringify } from 'qs';
import type React from 'react'; import type React from 'react';
@@ -22,11 +22,12 @@ export const UserEditModal: React.FC<IProps> = (props) => {
const [title, setTitle] = useState(''); const [title, setTitle] = useState('');
const [form] = Form.useForm(); const [form] = Form.useForm();
const [data, setData] = useState<any>(null); const [data, setData] = useState<any>(null);
const { notification } = App.useApp();
// 请求成功回调 // 请求成功回调
const success = (res: any) => { const success = (res: any) => {
if (res.err_code === 0) { if (res.err_code === 0) {
notification.success({ message: '保存成功' }); notification.success({ title: '保存成功' });
props.onCallback?.(); props.onCallback?.();
setOpen(false); setOpen(false);
form.resetFields(); // 提交成功重置表单 form.resetFields(); // 提交成功重置表单

View File

@@ -19,11 +19,21 @@ import type { IAjaxDataBase } from './type';
const ajax = async (method: string, url: string, data: any, config?: any) => { const ajax = async (method: string, url: string, data: any, config?: any) => {
try { try {
const headers: Record<string, string> = {
'X-Requested-With': 'XMLHttpRequest',
...config?.headers,
};
// 判断是否是 FormData
if (!(data instanceof FormData)) {
headers['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';
}
const res: IAjaxDataBase = await fetch(pathAddApiString(url), { const res: IAjaxDataBase = await fetch(pathAddApiString(url), {
headers: { // headers: {
'X-Requested-With': 'XMLHttpRequest', // 'X-Requested-With': 'XMLHttpRequest',
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8', // 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
}, // },
headers,
method: method, method: method,
body: data, body: data,
credentials: 'include', credentials: 'include',