QTab 新标签页-(https://qtab.toolfun.top/)产品系统Vibe Coding

个性化的新标签页，个人很怀念以前使用lumia 930时的磁贴桌面，所以尝试复刻融合了Window Phone 磁贴风格做了这么一个新标签页拓展

个性化磁贴桌面
支持添加、拖动、调整尺寸和删除磁贴，自定义颜色、透明度、渐变、玻璃效果与壁纸，并支持横向或纵向滚动，让用户按照自己的使用习惯组织桌面。

网站导航与搜索
支持添加常用网站、自定义网站地址和图标，并通过搜索框快速搜索内容。网站磁贴可以打开固定地址、恢复最近访问的页面，或者优先切换到已经打开的标签页。

待办与专注管理
提供任务新增、分类、完成、恢复和删除功能，支持设置今日重点，并将任务与专注计时关联，帮助用户安排工作和学习。

富文本笔记
支持自动保存、搜索、文件夹整理、标签、置顶及附件管理，提供标题、列表、表格、高亮等编辑能力，也能将笔记内容转为任务。

标签页工作空间
可以将当前窗口的多个标签页保存为一个工作空间，在需要时批量恢复，适合按项目、学习主题或使用场景管理浏览内容。

日常信息组件
提供天气、时钟、日历、倒计时、生日和纪念日等组件。天气支持城市搜索、当前天气与预报；日历结合农历、节气、节假日和调休信息展示日期。

常用工具集合
集成计算器、单位换算、密码生成、二维码生成，以及图片格式转换、压缩、尺寸调整、编辑、背景移除和图标制作等工具。另提供 RSS 阅读、书签、最近访问、系统状态和图片磁贴。

数据与个性化设置
支持中文和英文、减少动态效果、高对比度、数据备份导出与恢复，以及清除本机数据。任务、笔记和布局等主要数据默认保存在当前浏览器。

扩展架构
项目使用 WXT 构建浏览器扩展，采用 Manifest V3 标准，通过新标签页入口加载应用。前端使用 React 和 TypeScript，使用 Zustand 管理界面状态、组件数据与设置。

磁贴布局与交互
磁贴以整数网格坐标和尺寸保存，通过 dnd-kit 实现拖拽，结合碰撞检测、边界限制、空位查找和自动重排处理布局。使用 GSAP 和 Flip 实现位置变化与界面过渡。

本地数据存储
使用 Dexie 封装 IndexedDB，保存磁贴、任务、笔记、附件、工作空间和设置等数据。通过数据库版本迁移兼容旧数据，并针对笔记保存加入写入队列与冲突检测，通过数据变更通知更新多个已打开页面。

功能模块实现
各功能以独立面板组织，按需加载。笔记编辑器基于 Tiptap；书签、历史记录、标签页和系统信息通过浏览器扩展 API 获取；RSS 通过订阅解析与后台定时刷新更新内容；图片及生成工具主要在浏览器本地处理。

天气与公共资源服务
天气请求统一经过 Cloudflare Worker，由服务端接入和风天气、Visual Crossing 和 MET Norway，并实现缓存、请求限流、额度控制与故障回退。网站库、图标、壁纸和城市索引等资源通过远程资源服务按需加载，并结合本地缓存和内容哈希减少重复下载。

权限与数据管理
历史记录、书签、系统信息和 RSS 站点访问按功能申请权限。备份恢复支持数据校验、合并或替换；网站地址处理包含协议校验和部分敏感参数清理。

工程组织
项目包含扩展主体、独立天气 Worker、官网和可选同步服务基线，配有类型检查、国际化检查、界面规范检查及核心逻辑测试。当前 1.0 界面以本地功能为主，登录、支付和云同步尚未作为完整产品能力开放。