收录
vue3-admin-ts · 多租户 SaaS 后台
装修行业 SaaS 平台主前端仓库。营销、交付、商户、集团四个子系统，统一权限、统一组件库。
- 角色
- 前端负责人 / 核心开发
- 周期
- 2024.03 - 至今
- 技术
- Vue 3TypeScriptVuex 4Vue Router 4Element PlusViteECharts高德地图
- 链接
- GitHub →
项目背景
公司核心产品「一起装」是面向装修行业的多租户 SaaS 平台，承载 4 个子系统：
- 营销系统（营销活动、线索、CRM）
- 交付系统（工地、订单、施工日志、巡检）
- 商户系统（设计师、工长、供应商管理）
- 集团系统（多分公司数据汇总、BI 报表）
vue3-admin-ts 是这四个系统共享的前端主仓库，用 monorepo 思路统一权限、统一组件、统一部署。
我的工作
- 主导前端架构设计：API 层 / Service 层 / 状态层分层
- 抽象通用业务组件（基于 Element Plus 二次封装，patch 修复上游 bug）
- 多租户权限方案：路由级 + 按钮级双轨，权限点后端下发
- 性能治理：路由懒加载、组件懒加载、虚拟滚动应用于大列表
- AI 工地监控大屏：ECharts + 视频流（video.js / ezuikit-js）
关键决策
- Vuex 而非 Pinia：项目立项时 Pinia 还在 RC，且团队对 Vuex 更熟，迁移成本大于收益。
- 不用微前端：四个系统共享同一份路由 + 组件 + store，微前端反而割裂。
- 自定义 SCSS 工具类：
m-20px/w-200px这种快速布局类（见src/styles/index.scss），极大提升写页面效率。
成果
- 支撑日活 3000+ 工地用户
- 4 个子系统代码复用率 ~60%
- 团队从 2 人扩到 6 人，仓库结构没大改