项目概述
本插件是一款替代浏览器默认新标签页的工具型插件，定位为 "一站式效率聚合平台"。通过整合备忘录、代码管理、任务管理、密码存储等高频实用功能，无需切换多个应用，即可在新标签页完成日常信息管理、效率提升操作，同时支持个性化定制（如壁纸、网址入口），适配开发者、办公族、健身爱好者等多类用户需求，助力用户简化操作流程，提升日常效率。
技术栈
- Vue 3: 使用 Composition API 进行组件开发
- Dexie.js: IndexedDB 的封装库，IndexedDB 支持 GB 级本地存储，相比 localStorage 的 5MB 限制更适配，所有数据存放到浏览器当中，使用时注意不要清空浏览器缓存。所有数据（含密码、代码片段）仅存储在用户本地浏览器的 IndexedDB 中，不进行任何云端上传，避免服务器泄露风险
- Element Plus: UI 组件库，提供表格、表单、对话框等组件
- Lucide Vue Next: 图标库
- 开发环境：VScode
核心文件结构
功能模块如下：
一、任务管理中心（ToDoList）
-
功能定位：规划日常任务，跟踪完成进度，避免遗漏重要事项
-
核心功能：
任务创建：支持添加新任务，包括标题、描述、状态和截止日期 任务编辑：可修改现有任务的所有属性 任务删除：支持删除任务并提供确认机制 状态管理：任务状态可在 "待办"、"办理中" 和 "办理完成" 之间切换 任务筛选：按任务状态分类查看（全部、待办、办理中、办理完成） -
界面截图 ：
二、备忘录
-
功能定位：满足文本记录、信息整理需求，支持长期内容存储与快速检索
-
核心功能：
创建备忘录：支持新建空白备忘录，自动分配随机背景颜色 编辑功能：实时编辑备忘录的标题和内容，自动保存更新 删除功能：支持删除备忘录，删除后自动切换到下一个可用备忘录 颜色标记：每个备忘录可切换多种背景颜色，便于分类管理 搜索过滤：通过关键词搜索备忘录的标题和内容，快速定位所需信息 时间记录：自动记录备忘录的创建和最后更新时间，便于追踪 -
界面截图 ：
三、代码管理中心
-
功能定位：为开发者提供代码片段存储、复用工具，减少重复编码工作量
-
核心功能：
组件上传：支持上传各类前端组件代码文件，包含详细的组件信息录入 组件存储：通过componentDB本地数据库管理组件数据，支持增删改查操作 组件检索：提供关键词搜索和分类筛选，快速定位所需组件 组件查看：展示组件详情，包括预览图、描述信息和代码内容 组件操作：支持组件的编辑更新、删除和代码复制功能 -
界面截图 ：
四、运动健康
-
功能定位：记录体重变化，通过数据可视化助力健康管理
-
核心功能：
记录展示：以表格形式展示所有饮食运动记录，包含日期、餐食、运动情况、体重和备注等信息 新增记录：通过表单添加新的每日记录，包括： 日期和星期选择 早中晚三餐饮食内容（运动记录、体重数据、备注信息） 编辑记录：修改已存在的记录信息 删除记录：移除不需要的记录 搜索功能：通过关键词快速查找相关记录 体重统计：单独的模态框展示体重相关统计数据 多图表展示：支持三种图表类型（线性图、面积图、平滑曲线）展示体重变化 关键指标展示：当前体重、减重成果、减重比例等核心数据 进度追踪：直观展示减重目标的完成进度 -
界面截图：
五、便签
-
功能定位：临时信息快速记录，适配 "碎片化记录" 场景（如临时待办、灵感、联系方式）
-
核心功能：
轻量化编辑：无需跳转页面，在主页即可快速输入文本，支持换行 个性化标识：支持自定义便签颜色（如黄色、蓝色、绿色），按颜色区分用途（如黄色记待办、蓝色记联系方式） 拖拽排序：可在界面中随意拖拽，刷新/新建标签页后位置内容均无变化 删除变迁：支持清空已完成便签，保持界面整洁 -
界面截图 ：
六、壁纸中心
-
功能定位：自定义新标签页视觉风格，提供多样化壁纸选择
-
核心功能：
记忆功能：切换浏览器或重启后，自动保留上次设置的壁纸，无需重新选择 -
界面截图 ：
七、自定义网址入口
-
功能定位：聚合高频访问网站，实现 "一键直达"，减少网址输入操作
-
核心功能：
自由添加：输入网站名称、网址，选择默认图标或上传自定义图标等 快捷访问：点击入口图标直接跳转至对应网站，无需在地址栏输入网址 编辑调整：支持修改入口名称 / 网址 / 图标等信息 -
界面截图 ：
八、密码库
-
功能定位：这是一个基于 Vue 3 开发的功能完整的密码库模态框组件，具备密码验证、管理（增删改查）、生成及复制等功能，采用现代 UI 设计与流畅交互动效，提供安全便捷的密码存储解决方案。
-
核心功能：
打开模态框时加载保存的密码数据 验证密码通过后显示密码管理界面 新增 / 编辑 / 删除密码时同步更新本地数据库和界面状态 锁定或关闭模态框时重置当前编辑状态 -
界面截图 ：
九、功能模块：未来功能规划
写在最后，这个项目是我工作中常用实用小工具的集合。前阵子减肥时，发现减肥折线图能带来不少动力，便自己开发了个减肥管理的小 demo；这些小工具的诞生都源于实际需求和灵感。项目最初是为了练习 Vue3 技术，顺便研究 IndexedDB，后来慢慢发展成了一个自己日常能用得上的小工具合集。现在这个小工具集合里，已经慢慢攒了不少实用功能：除了最初的减肥管理，还加了密码管理器来记各种账号（毕竟总忘密码太头疼），做了个简单的待办清单帮自己梳理工作优先级，甚至搭了个本地的笔记工具，随手记点灵感和碎片想法。用起来才发现，这些自己写的工具特别 "合身"------ 完全按自己的使用习惯设计，没有多余功能，打开就能用。技术上也确实没白练，Vue3 的组合式 API 用得越来越顺，IndexedDB 的本地存储方案也摸透了，现在连组件封装和状态管理都有了自己的心得。往后打算继续慢慢加功能，比如想做个简单的时间追踪器，看看每天时间都花在哪儿了；再整个本地书签管理，把常用网站按自己的逻辑归类。反正也不急，想到什么实用的点子，就趁着兴趣慢慢迭代，既是练手，也是给自己攒个顺手的 "工具箱"，挺有意思的。