Commit Graph

130 Commits

Author SHA1 Message Date
ludan 52677e33f1 feat: 首页响应式视觉升级与全局UI细节打磨
本次提交包含以下改进:

## 1. 首页轮播卡片响应式重构 (HomePage.tsx + home.css)
- 将旋转木马卡片偏移量从固定px值改为clamp()流式单位,随视口宽度自适应缩放
- 使用calc(0px - ...)替代乘法计算方向偏移,兼容CSS变量传递
- 轮播舞台新增mask-image渐变遮罩,边缘卡片自然淡出
- 非激活卡片增加saturate/brightness滤镜,强化主次视觉层级
- 激活卡与非激活卡分别设置图片filter效果
- 移除旧carousel-card-label样式
- 多断点适配:1200px/980px/720px/480px逐级调整卡片尺寸和舞台高度

## 2. 首页入口按钮重设计 (HomePage.tsx + home.css)
- 按钮文案从'新手/老手/电商'改为'快速生成/专业创作/电商出图'
- 每个按钮新增small副标题('新手友好'/'画布工作流'/'商品视觉')
- 主按钮(专业创作)使用渐变绿色背景+发光阴影,新建--primary small样式
- 普通按钮玻璃态背景+内阴影,hover绿色边框高亮
- 720px以下单列全宽布局,按钮居中

## 3. 首页全页视觉强化 (home.css)
- Scrim层三重渐变叠加+radial光晕
- Hero区域文字text-shadow + text-wrap: balance排版
- Feature页面::before叠加渐变遮罩
- Feature Visual卡片增加边框/阴影/背景三层嵌套
- Experience区域斜向分割线装饰背景
- Cookie Consent弹窗玻璃态重设计,移动端自适应

## 4. 首页工具盒区域打磨 (toolbox.css)
- 全新CSS变量(--toolbox-radius-card/inner)
- 工具盒整体深色渐变背景+radial光晕
- Shell容器max-width + clamp流式padding
- 左侧品牌区域标题/brand-icon/subtitle重设计
- 工具列表项、工作流卡片统一玻璃态风格
- 工具卡片hover上浮4px+绿色边框+阴影增强
- @media: 1160px/980px/680px/420px四断点响应式

## 5. 工具盒卡片布局简化 (MorePage.tsx + more.css)
- 核心工具卡片移除独立icon区域,改为单列网格布局
- 普通工具卡片隐藏.more-card__icon(近期记录除外)
- 预览图aspect-ratio从16/9改为4/3,内边距优化
- 移动端移除featured-icon相关样式

## 6. 脚本评审Showcase响应式改造 (script-review-showcase.css)
- 主容器从@media切换为@container查询,跟随父容器自适应
- 新增880px/720px/560px三档container断点
- 图表列在720px以下改为水平进度条布局(bar从垂直改水平)
- 图表列增加卡片边框/圆角/背景
- 品牌区域、评分标签、流程卡片逐级压缩
- @media保留外层padding控制

## 7. 通知中心UI修复 (dark-green.css)
- notification-center改为inline-flex定位锚点
- 面板改为absolute+flex列布局,修复定位偏移
- 列表flex自适应高度+overscroll-behavior: contain
- 移动端面板右偏移clamp适配,箭头位置同步
- 高度单位从vh改为dvh,避免移动浏览器地址栏干扰
2026-06-09 14:22:37 +08:00
ludan 6f54ad92c0 feat: 工具盒卡片预览图替换与响应式视觉优化
本次提交包含以下改进:

## 1. 工具卡片真实预览图替换 (MorePage.tsx)
- 移除原有的CSS绘制Before/After对比图(ToolComparePanel/CompareScene)
- 新增ToolPreviewPanel组件,使用OSS真实截图展示每个工具的效果预览
- 建立toolPreviewImages映射表,为8个工具分别配置预览图URL
- 预览图支持hover悬浮放大效果(popover),桌面端鼠标悬停时展示大图
- 触摸设备通过@media (hover: none)隐藏popover,避免移动端误触

## 2. 核心工具区重构 (MorePage.tsx)
- 移除FeaturedTool独立接口和featuredTools数组,统一到tools体系
- 新增coreToolIds集合标记核心工具(workbench/inpaint/watermarkRemoval)
- 新增coreToolGradients和coreToolSteps独立配置每张核心卡的渐变和步骤
- 移除openFeaturedTool,统一使用openTool处理所有工具点击
- 核心卡片kick er改为显示分类标签(图像创作/视频创作)
- 视频生成分类标签更名为"视频创作"

## 3. 工具卡片视觉升级 (more.css)
- 新增CSS变量体系:--more-card-surface/surface-strong/border/border-strong
- 核心工具卡:三列网格布局、渐变背景叠加、预览图16:9占位区
- 普通工具卡:增大最小高度至392px、radial-gradient光晕、增强边框
- 卡片预览图:aspect-ratio容器、内边框光效、::after渐变叠加层
- Hover悬浮popover:从卡片底部弹出大图,160ms过渡动画
- CTA按钮强化:渐变背景、内阴影高光、font-weight 850
- :active状态按压反馈(translateY(0)消除位移)
- 阴影系统升级:更深、更柔和的阴影层次

## 4. Prompt案例弹窗响应式重构 (workbench.css)
- 720px断点:从垂直堆叠改为水平左右分栏布局(1.08:0.92)
- 侧边栏从底部面板移至右侧,带左分割线和投影
- 420px断点:紧凑水平分栏(0.9:1.1)、更小字号和间距
- 弹窗增加边框和圆角、关闭按钮毛玻璃效果
- 作者信息采用grid布局、描述文本line-clamp截断

## 5. 响应式细节完善
- more.css 860px: 双列核心卡、增大预览图、调整间距
- more.css 520px: 单列布局、筛选标签横向滚动、CTA按钮全宽
- workbench.css: 各断点prompt-case-modal精确调优
2026-06-08 18:57:07 +08:00
ludan 4dfcb6fc8a feat: Workbench SaaS视觉升级与视图重置机制
本次提交包含以下改进:

## 1. Workbench视图重置机制 (App.tsx + WorkbenchPage.tsx)
- 在App.tsx中新增workbenchResetToken状态,每次导航到workbench页面且存在session时递增token
- WorkbenchPage新增resetToken属性,检测token变化后自动调用handleNewConversation()重置工作台状态
- 重置时清空消息列表和活跃会话ID,确保每次进入工作台都是全新状态

## 2. 滚动操作提示系统 (WorkbenchPage.tsx)
- 新增scrollActionHint状态和hideScrollActionHint/showScrollActionHint方法
- 用户滚动离开消息区域时自动显示滚动方向提示(顶部/底部按钮)
- 1.4秒后自动隐藏提示,优化交互体验
- 手动点击滚动按钮后立即隐藏提示
- 为滚动按钮添加--top/--bottom标识类名,支持独立定位

## 3. Prompt案例弹窗自适应布局 (WorkbenchPage.tsx)
- renderPromptCaseOverlay重构为动态计算moda l类名
- 根据图片实测宽高比(is-tall-media/is-portrait-media)和文案长度(is-long-copy)动态调整布局
- 添加handlePromptCaseImageLoad回调在图片加载后测量尺寸

## 4. Workbench SaaS视觉美化 (workbench.css)
- 全新SaaS风格设计变量(--wb-panel, --wb-line, --wb-shadow等)
- 首页区域:标题样式、Composer输入框圆角/阴影/聚焦态、发送按钮渐变样式
- 模式选择/芯片组件:下拉菜单、悬停态优化、选中态高亮
- 聊天消息区:气泡圆角、头像样式、消息间距、空状态引导
- 图片/视频结果卡片:边框、阴影、标签徽章、视频PLAY标识
- 生成中卡片:停止按钮样式
- 会话侧边栏:折叠态浮动按钮定位、展开态面板样式、选中项左侧指示条
- 滚动快捷键:固定定位圆形按钮、显示/隐藏过渡动画
- Prompt案例弹窗:桌面端毛玻璃双栏布局、移动端底部面板布局
- @media适配:560px/720px/900px/980px四个断点全覆盖

## 5. 全局移动端布局变量 (dark-green.css)
- 新增--dg-mobile-nav-height/gap/space CSS变量,统一移动端底部导航高度计算
- 优化Topbar z-index层级
- 非特殊页面自动添加顶部padding避让移动导航
- Profile弹窗fixed定位及安全区域适配
2026-06-08 17:30:21 +08:00
stringadmin 8252f56722 Merge pull request 'Codex/generation task reliability' (#20) from codex/generation-task-reliability into master
Reviewed-on: #20
2026-06-08 05:56:38 +00:00
stringadmin 6e271347ae fix: restore bug feedback entry 2026-06-08 13:54:45 +08:00
stringadmin bff66a3545 feat: refine generation workspace experience 2026-06-08 13:44:03 +08:00
stringadmin f817e31366 Merge pull request 'Feat/dialog generator cancel generation' (#23) from feat/dialog-generator-cancel-generation into master
Reviewed-on: #23
2026-06-08 03:41:11 +00:00
OmniAI Developer 0384d7f2a3 feat: 侧边栏顺序调整、模型选择去除积分价格、修复canvas.css语法错误
- 侧边栏:社区移到底部,工具盒移到资产库上方
- 生成页面:图像/视频模型选择下拉去除积分价格文本
- 修复 canvas.css 多余的右花括号语法错误
2026-06-08 11:39:28 +08:00
OmniAI Developer f920630160 Merge remote-tracking branch 'origin/master' into feat/dialog-generator-cancel-generation 2026-06-08 11:22:17 +08:00
stringadmin c1266169d7 Merge pull request 'feat: 工具盒视觉重设计 + 个人中心详情弹窗' (#22) from feat/tool-hub-redesign-and-profile-detail into master
Reviewed-on: #22
2026-06-08 03:05:47 +00:00
ludan 4530058648 feat: 工具盒视觉重设计 + 个人中心详情弹窗
本次提交对全部工具入口页(MorePage)进行了全面的信息架构和视觉升级,并为个人中心新增卡片点击详情弹窗。

## 工具盒(MorePage)重设计
- 工具卡片增加 useCase 使用场景说明和 tags 标签行,帮助用户快速理解每个工具的适用场景
- 核心工具(Featured)卡片新增 kicker 标题、steps 操作步骤、outcome 产出说明,强化工作流引导
- 新增 ToolComparePanel 组件,为每个工具展示 Before/After 对比示意舞台
- 分类筛选按钮新增计数徽章,展示每个分类下的工具数量
- 页面头部新增 eyebrow(AI Tool Hub)+ 工具概览统计信息
- 最近使用区域增加分类标签副标题
- 空分类场景新增引导式空状态面板
- 全面补充 aria-label 和无障碍键盘支持

## 个人中心详情弹窗
- 新增 ProfileDetailSelection 类型和 openDetailSelection/closeDetailSelection 流程
- 使用 createPortal 渲染详情弹窗,支持代表作和资产两种详情视图
- 弹窗内支持媒体预览(图片/视频)、元数据展示、下载和删除操作
- 列表卡片(代表作/项目/资产)改为 interactive-card,支持键盘 Enter/Space 激活
- 删除项目按钮增加 event.stopPropagation 防止冒泡触发卡片点击
- 弹窗打开时锁定 body 滚动,Esc 键关闭

## App.tsx 适配
- 传递 setTasks 给 ProfilePage,支持代表作移除操作
- 传递 onOpenProject 回调,支持从个人中心打开项目

## CSS 样式升级
- more.css: 全面重设页头布局(grid 三栏)、筛选胶囊、核心卡片 Before/After 舞台、步骤条、响应式适配
- profile.css: 新增详情弹窗 overlay/panel/preview 布局、交互卡片 hover/focus 状态
- dark-green.css: 工具盒与详情弹窗的深绿主题样式约 780 行
2026-06-07 11:42:00 +08:00
stringadmin 9a0be35501 perf: replace shell icon bundle 2026-06-05 20:42:34 +08:00
stringadmin 6f7355e689 perf: defer dark green theme styles 2026-06-05 20:28:47 +08:00
stringadmin e3bdd10156 perf: defer recharge modal bundle 2026-06-05 20:24:21 +08:00
OmniAI Developer 2e52101b37 merge: 合并 master,保留拖拽上传样式和工具面板样式 2026-06-05 20:04:48 +08:00
stringadmin 98058236e6 perf: defer image tool workspace styles 2026-06-05 19:49:50 +08:00
stringadmin 3d4001353d perf: route ecommerce utility styles on demand 2026-06-05 19:45:56 +08:00
stringadmin c42c8d4f7b perf: defer shared utility styles 2026-06-05 19:34:36 +08:00
stringadmin 719674b4ad perf: defer home page styles 2026-06-05 19:17:35 +08:00
stringadmin a1fd24a5f6 perf: reduce repeated collection traversal 2026-06-05 19:11:43 +08:00
stringadmin 13893bc3a9 Merge remote-tracking branch 'origin/master' into codex/generation-task-reliability
# Conflicts:
#	src/components/AppShell.tsx
2026-06-05 18:38:08 +08:00
stringadmin 5bdeac20fb Merge pull request 'feat: 个人中心仪表盘视觉打磨与交互优化' (#21) from feat/profile-dashboard-polish into master
Reviewed-on: #21
2026-06-05 10:29:24 +00:00
ludan bbc705c8d9 feat: 个人中心仪表盘视觉打磨与交互优化
本次提交对个人中心(Profile Dashboard)进行了全面的 UI/UX 升级:

## AppShell 导航修复
- 修复浮动导航栏显示逻辑:移除未登录状态下多余的 session 判断条件,确保登录页不显示导航

## ProfilePage 功能增强
- 新增面板标题、描述和计数变量,动态展示不同面板(代表作/服务器项目/我的资产/社区审核)的上下文信息
- 背景图更换按钮增加 aria-label 无障碍支持,文字使用独立 span 便于移动端隐藏
- 积分与任务切换按钮拆分为标签+数值结构,信息层级更清晰
- 账号摘要卡片新增套餐名称和已完成任务数展示
- 操作按钮(工作台/社区/退出登录)包裹至 actions 容器,统一布局管理
- 主面板标签页文字包裹 span,支持响应式隐藏

## profile.css 滚动模型调整
- Dashboard 视图改用页面自然滚动,替代嵌套区域滚动,避免双滚动条问题

## dark-green.css 主题样式(约 1160 行新增)
- 背景图与头像区域:毛玻璃按钮、头像环绿边光晕、hover 编辑覆盖层
- 个性签名:圆角胶囊展示态 + 编辑态双向布局,状态提示条
- 账号卡片:标签按钮网格化布局、积分摘要面板、套餐标签
- 操作按钮组:主按钮渐变绿色、次要按钮低对比、退出按钮红色警示
- 内容标签页:胶囊切换 + 计数徽章,激活态绿边高亮
- 列表卡片:hover 微上浮 + 绿色边框过渡,空状态虚线面板
- 多轮视觉迭代:从 graphite 灰调到最终 black+green 参考色调
- 响应式适配:移动端头像环缩小、背景按钮圆形、标签页紧凑排列
- 页面级滚动:让 body 自然滚动,取消 content 内部滚动容器
2026-06-05 18:28:10 +08:00
stringadmin 0d136d8622 perf: reduce chained array traversal 2026-06-05 18:27:08 +08:00
stringadmin d09e5e673e refactor: extract canvas marking popover 2026-06-05 18:19:24 +08:00
stringadmin d68064f529 refactor: share canvas mention textarea 2026-06-05 18:15:29 +08:00
stringadmin 31046eae58 refactor: extract canvas text prompt composer 2026-06-05 18:08:16 +08:00
OmniAI Developer 5b87594e36 feat: 多页面拖拽上传、滚动条精简、UI优化
- 剧本评测/分辨率提升/数字人/角色迁移/图片工作台/去水印/电商:新增外部拖拽文件上传
- 电商:爆款图复刻上传框支持拖拽+大滚动条,短视频/模特图/详情图滚动条精简回退
- 图片工作台:右侧输出面板移至左侧提示词上方,删除局部重绘遮罩/结果框
- 数字人:生成按钮改为「开始生成」
- 局部重绘:编辑遮罩→编辑页面
- 对话框生成器:新增对话/视频模式、模型/速度/深度选择按钮
- 视频时长默认改为5秒
- 工具箱页面空状态logo统一绿底亮色图标
- 多处CSS滚动条和布局优化
2026-06-05 18:01:55 +08:00
stringadmin ef05667caa refactor: extract canvas derived state 2026-06-05 18:01:48 +08:00
stringadmin b8b3b8f137 perf: memoize derived render data 2026-06-05 17:35:54 +08:00
stringadmin 6060705345 perf: split page css from main bundle 2026-06-05 17:19:38 +08:00
stringadmin 53f6a02377 fix: reduce store rerenders and cleanup timers 2026-06-05 17:04:01 +08:00
stringadmin 9999e516ae fix: improve generation task reliability 2026-06-05 16:43:02 +08:00
stringadmin 796162de4d Merge pull request 'chore: re-upload current web project code' (#19) from reupload/current-web-20260605 into master
Reviewed-on: #19
2026-06-05 08:13:56 +00:00
stringadmin aebe0ff827 chore: re-upload current web project code 2026-06-05 16:08:47 +08:00
stringadmin c113d82844 Merge pull request 'feat: 实现全局响应式布局,适配不同设备、不同屏幕、不同分辨率' (#17) from feat/responsive-layout into master
Merge PR 17 feat responsive-layout
2026-06-05 07:21:29 +00:00
stringadmin 8cf9ee3519 merge: resolve conflicts between feat/responsive-layout and master
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-06-05 15:14:17 +08:00
stringadmin 2129b29dfe Merge pull request 'Feat/profile account polish' (#16) from feat/profile-account-polish into master
Reviewed-on: #16
2026-06-05 06:58:37 +00:00
stringadmin d36d46836f merge: resolve EcommercePage.tsx conflict, integrate master into profile-account-polish
Keep master's EcommercePage.tsx (has more complete upload logic from prior conflict resolution). Accept all other master changes including canvas tool panels, task lifecycle, and workbench updates.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-06-05 14:05:39 +08:00
stringadmin 91c332f567 Merge pull request 'Feat/canvas tool panels' (#15) from feat/canvas-tool-panels into master
Reviewed-on: #15
2026-06-05 05:30:22 +00:00
stringadmin 5097b5ce49 feat: update homepage banners to OSS, fix avatar edit hover, adjust workbench grid layout
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-06-05 13:29:17 +08:00
ludan b17a978e9e Merge origin/master: 保留电商上传优化版,接入master新增面板组件
冲突解决:EcommercePage.tsx 保留本地版本(上传预览大图+缩略图切换交互)
master新增:6个独立面板组件、图片校验工具、视频工作区增强、CSS更新
2026-06-05 10:34:19 +08:00
stringadmin 93a7a6d5e6 feat: add canvas tool panels (multi-grid, upscale, inpaint) and conditional grid mode
Add modal-based tool panels for multi-grid, super-resolution, and inpaint in canvas image-to-image workflow. Grid mode selector only appears for models that support multi-image generation (wan2.7-image, gpt-image-2). Also fixes merge conflict markers in CSS and adds missing toast import.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-06-05 01:48:13 +08:00
stringadmin d7379af717 feat: disable recharge modal, show coming-soon toast instead
Payment gateway is not yet configured, so hide the recharge flow
and show an informational toast when users click the balance button.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-06-05 01:06:49 +08:00
stringadmin 178a2c47da feat: add task lifecycle management and improve generation reliability
Centralize timeout policies, stall detection, and error classification
for image/video/text generation tasks. Improve ecommerce OSS upload flow
and add script evaluation enhancements.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-06-05 01:06:48 +08:00
stringadmin d36a093159 Improve generation task client errors 2026-06-05 01:05:54 +08:00
stringadmin 8fbb2ec95e Merge pull request 'Feat/dialog generator cancel generation' (#14) from feat/dialog-generator-cancel-generation into master
Reviewed-on: #14
2026-06-04 17:01:09 +00:00
OmniAI Developer 90e3b90e34 merge: 合并远程PR#12商业化打磨和PR#13修复 2026-06-05 00:45:21 +08:00
OmniAI Developer 10b8379965 feat: 交互式对话框生成器 + 电商取消生成与上传优化
新增:
- 交互式对话框生成器模块(路由、页面、样式、MorePage入口)
- 电商模块取消生成功能(任务追踪/取消按钮/中止逻辑)
- 视频服务图片上传支持 Blob/dataURL/远程URL 多种来源

优化:
- 电商图片上传修复本地 blob 预览图缺少原始文件的问题
- 视频规划管线错误信息改进
- 生成流程中多处增加中止检查点
2026-06-05 00:37:38 +08:00
stringadmin c1c4086383 Merge pull request 'fix: ????????? OSS ????' (#13) from fix/ecommerce-video-400-bug into master
Reviewed-on: #13
2026-06-04 12:10:38 +00:00