From 87d81d2c864058225c0cc1e77981665484739f13 Mon Sep 17 00:00:00 2001 From: ludan <251918489@qq.com> Date: Wed, 3 Jun 2026 09:53:05 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E4=B8=AA=E4=BA=BA=E4=B8=AD=E5=BF=83?= =?UTF-8?q?=E7=95=8C=E9=9D=A2UI=E4=BC=98=E5=8C=96=EF=BC=8C=E6=8F=90?= =?UTF-8?q?=E5=8D=87=E5=95=86=E4=B8=9A=E4=BA=A7=E5=93=81=E7=B2=BE=E8=87=B4?= =?UTF-8?q?=E5=BA=A6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ProfilePage组件优化: - 新增个性签名编辑功能(内联编辑/确认/取消交互) - 新增 icon 导入(EditOutlined, CheckOutlined, CloseOutlined) - 新增 formatProfileDate 工具函数,统一日期格式化(中文友好) - 新增 formatTaskType 函数,任务类型中文化显示 - 新增 formatTaskStatus 函数,任务状态中文化显示 - 新增 formatAssetStatus 函数,资产状态中文化显示 - 优化空状态展示,增加图标占位 dark-green主题层样式增强: - 个人中心背景增加微光渐变(accent光晕+半透明遮罩) - Banner区域高度优化为214px,增加底部渐变分割线 - Banner叠加层增加径向光晕效果 - Banner编辑按钮增加毛玻璃质感(backdrop-filter) - 侧边栏/主体/选项卡/列表卡片等多处细节增强 - 按钮、标签、统计数字等组件加入微交互 - 保持暗绿主题配色体系不变,仅提升精致度 --- src/features/profile/ProfilePage.tsx | 154 +++++- src/styles/themes/dark-green.css | 781 +++++++++++++++++++++++++++ 2 files changed, 912 insertions(+), 23 deletions(-) diff --git a/src/features/profile/ProfilePage.tsx b/src/features/profile/ProfilePage.tsx index 9a06565..e443091 100644 --- a/src/features/profile/ProfilePage.tsx +++ b/src/features/profile/ProfilePage.tsx @@ -1,7 +1,10 @@ import { CameraOutlined, + CheckOutlined, CheckCircleFilled, + CloseOutlined, DeleteOutlined, + EditOutlined, LockOutlined, MailOutlined, MobileOutlined, @@ -135,6 +138,48 @@ function mapAssetToSavedItem(asset: Awaited> }; } +function formatProfileDate(value: string | null | undefined): string { + if (!value) return "刚刚"; + const date = new Date(value); + if (Number.isNaN(date.getTime())) return value; + + return new Intl.DateTimeFormat("zh-CN", { + month: "numeric", + day: "numeric", + hour: "2-digit", + minute: "2-digit", + }).format(date); +} + +function formatTaskType(type: WebGenerationPreviewTask["type"]): string { + const labels: Record = { + image: "图像", + video: "视频", + agent: "智能体", + "digital-human": "数字人", + "character-mix": "角色融合", + }; + return labels[type] || type; +} + +function formatTaskStatus(status: WebGenerationPreviewTask["status"]): string { + const labels: Record = { + queued: "排队中", + running: "生成中", + completed: "已完成", + failed: "失败", + }; + return labels[status] || status; +} + +function formatAssetStatus(status: string | undefined): string { + const normalized = String(status || "").toLowerCase(); + if (normalized === "completed" || normalized === "ready" || normalized === "success") return "可用"; + if (normalized === "running" || normalized === "processing") return "处理中"; + if (normalized === "failed" || normalized === "error") return "失败"; + return status || "资产"; +} + function ProfilePage({ session, usage, @@ -182,6 +227,9 @@ function ProfilePage({ const [profileNotice, setProfileNotice] = useState(null); const [localAvatarUrl, setLocalAvatarUrl] = useState(() => session?.user.avatarUrl || readLocalProfileValue(userId, "avatar")); const [profileBio, setProfileBio] = useState(() => session?.user.bio || readLocalProfileValue(userId, "bio")); + const [isBioEditing, setIsBioEditing] = useState(false); + const [bioEditBackup, setBioEditBackup] = useState(""); + const [bioStatusNotice, setBioStatusNotice] = useState(null); const [bannerUrl, setBannerUrl] = useState(() => session?.user.backgroundUrl || readLocalProfileValue(userId, "background")); const completedTasks = tasks.filter((task) => task.status === "completed"); @@ -497,8 +545,29 @@ function ProfilePage({ void syncProfilePatch({ bio: nextBio || null }); }; + const startBioEdit = () => { + setBioEditBackup(profileBio); + setBioStatusNotice(null); + setIsBioEditing(true); + }; + + const confirmBioEdit = () => { + handleBioBlur(); + setIsBioEditing(false); + setBioStatusNotice("个性签名已保存"); + }; + + const cancelBioEdit = () => { + setProfileBio(bioEditBackup); + setIsBioEditing(false); + setBioStatusNotice(null); + }; + const renderEmptyState = (text: string, actionLabel: string, action: () => void) => (
+

{text}

{displayName} -