Admin Console — 基于 localStorage 的企业级后台管理系统模板产品系统Vibe Coding

中小企业、SaaS 产品、内部工具开发都需要后台管理系统，但每次从零开发用户管理、权限分配、系统设置等基础模块耗时且重复。
本项目面向独立开发者、小团队、企业内部工具开发场景，提供一套开箱即用的后台管理模板，可直接作为项目脚手架二次开发，节省 3-5 天基础工作量。

本项目是一套完整的后台管理系统模板，包含以下核心模块：

登录系统：账号密码登录，支持回车键操作，登录状态管理
主布局框架：可折叠侧边栏菜单 + 顶部面包屑导航 + 管理员信息 + 退出登录
仪表盘：4 个核心数据卡片（总用户/今日新增/活跃用户/系统消息）+ 销售趋势折线图 + 品类分布饼图
用户管理（完整 CRUD）：用户列表表格 + 关键词搜索 + 角色筛选 + 状态筛选 + 分页（10条/页）+ 新增/编辑/删除用户（弹窗表单 + 确认删除）
角色权限管理：3 个预设角色（超级管理员/编辑/普通用户）+ 权限矩阵（4 模块 × 4 动作）+ 可视化打勾切换 + 实时持久化
系统设置：基本设置（系统名称/Logo/联系方式）+ 安全设置（密码强度要求/登录失败锁定）+ 保存后 UI 实时同步

本人独立完成全栈开发。采用单页 Web 架构（纯 HTML/CSS/JS），浏览器打开即用无需构建工具。核心技术亮点： • 完整 CRUD 工程：用户增删改查全流程闭环，含表单校验、分页、搜索筛选组合、确认弹窗、Toast 反馈 • 数据持久化：所有数据（用户/角色/设置）通过 localStorage 存储本地浏览器，刷新不丢失，首次加载自动初始化 18 条 mock 数据 • 权限矩阵引擎：角色 × 模块 × 动作三维权限模型，点击切换实时生效并持久化 • XSS 防护：用户输入经 escapeHtml 转义后渲染，防止 XSS 攻击和显示错乱 • 容错设计：localStorage 数据结构校验、编辑 null check、邮箱正则校验等多层防护 • 响应式布局：1024px + 768px 双断点适配，移动端侧边栏可折叠