OmniAI/omniai-web
3
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: Workbench SaaS视觉升级与视图重置机制 #26

Merged
stringadmin merged 2 commits from feat/workbench-saas-polish-and-reset into master 2026-06-08 09:31:56 +00:00
Conversation 0 Commits 2 Files Changed 4
+1755 -16
stringadmin commented 2026-06-08 09:31:46 +00:00
Owner
Copy Link
Copy Source

本次提交包含以下改进：

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定位及安全区域适配
本次提交包含以下改进： ## 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定位及安全区域适配
stringadmin added 1 commit 2026-06-08 09:31:46 +00:00
feat: Workbench SaaS视觉升级与视图重置机制 4dfcb6fc8a 
本次提交包含以下改进：

## 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定位及安全区域适配
stringadmin added 1 commit 2026-06-08 09:31:51 +00:00
Merge branch 'master' into feat/workbench-saas-polish-and-reset 1a9196a63a
stringadmin merged commit b88be66e7f into master 2026-06-08 09:31:56 +00:00
Sign in to join this conversation.
Reviewers
No Reviewers
Labels
No items
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
audrey duchen ludan stringadmin
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: OmniAI/omniai-web#26
Delete Branch "feat/workbench-saas-polish-and-reset"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?