基于Vue的纯前端的库存销售系统

🚀【开源】 基于Vue的纯前端的库存销售系统

• 项目地址：https://github.com/cuiyunhao-2026/warhouse-sales-management-system

这是基于art design pro模板的二次开发

• 模板地址：https://github.com/Daymychen/art-design-pro

你是否？

• 需要轻量化的库存管理

• 应付期末作业

• 不想花钱

• 拿来练练手

• 想参考一下其他项目看看都是什么样

我基于 Vue3+TypeScript 打造了这个完全开源、开箱即用的库存销售管理系统。

✨ 为什么我要做这个项目？

市面上其实不缺库存管理系统，但它们要么：

• 💰 价格昂贵：按年付费，小商家根本承担不起

• 🧩 功能冗余：一堆用不上的功能，学习成本极高

• 🔒 数据不安全：数据存在第三方服务器，隐私无法保障

• 🛠️ 部署复杂：需要配置服务器、数据库，技术门槛高

而我想要的是一个下载就能用、功能刚刚好、数据自己掌控的工具。于是我基于优秀的 Art Design Pro 后台模板进行二次开发，保留了它优雅的 UI 设计和完善的框架，从零开始实现了所有库存销售相关的业务功能。

🎯 它能帮你解决什么问题？

1. 全流程闭环管理，告别数据混乱

从采购申请→审批入库→库存盘点→销售开单→财务报表，所有环节一站式打通。

• 采购订单一键生成入库单，不用重复录入

• 销售出库自动扣减库存，实时更新库存数量

• 自动计算盘盈盘亏，盘点效率提升 80%

• 所有操作留痕，数据可追溯

2. 可视化仪表盘，经营状况一目了然

打开首页就能看到所有核心数据：

• 商品总数、库存总量、库存总值实时统计

• 最近 7 天出入库趋势图，掌握业务动态

• 低库存自动预警，再也不会出现断货情况

• 分类库存和价值分布饼图，优化资金占用

3. 零部署成本，5 分钟就能上手

无需后端、无需数据库、无需服务器，纯前端架构，只要有浏览器就能用。

# 真的只有3步gitclone https://github.com/cuiyunhao-2026/art-design-pro-inventory.gitcdart-design-pro-inventory&&npminstallnpmrun dev

打开浏览器访问http://localhost:5173，用默认账号admin/123456登录，就能看到完整的演示数据，直接上手体验。

4. 企业级权限体系，数据安全有保障

采用路由 + 菜单 + 按钮三级权限控制，不同角色各司其职：

• 超级管理员：拥有所有权限，可管理账号和角色

• 业务管理员：负责日常采购、销售和库存管理

• 普通员工：只能查看数据，不能进行修改操作

5. 高颜值现代化界面，用着就是舒服

• 支持亮色 / 暗色主题一键切换，熬夜加班也不伤眼

• 自定义主题色，打造属于你的品牌风格

• 完美适配桌面端和移动端，手机也能随时查库存

• 中英文双语支持，外贸生意也能用

🛠️ 技术栈说明

项目采用了目前最主流的前端技术栈，代码规范、结构清晰，不仅能直接用，还非常适合作为前端学习和二次开发的模板：

📸 部分截图

🔮 未来开发计划（不知道啥时候更新完）

我暂时规划了以下功能，将在后续版本中陆续推出：

• 数据导出为 PDF 格式（发票、订单直接打印）

• 批量操作功能（批量导入导出商品、批量删除）

• 操作日志记录（谁在什么时候做了什么）

• 消息通知系统（低库存提醒、订单审批提醒）

• 数据备份与恢复（再也不怕数据丢失）

• 移动端适配优化（手机端操作更流畅）

你的需求就是我的开发优先级！欢迎在 GitHub 上提交 Issue 告诉我你最需要的功能。

🤝 一起让这个项目变得更好

这个项目完全开源免费，基于 MIT 协议，你可以自由使用、修改和分发。

如果你觉得这个项目对你有帮助：

• 🌟 请给我一个 Star，这是对我最大的鼓励

• 🐛 如果你发现了 Bug，欢迎提交 Issue 反馈

• 💡 如果你有好的想法，也可以提交 PR 一起完善

🙏 写在最后

感谢开源社区提供的优秀工具和模板，感谢所有在开发过程中帮助过我的人。如果这个项目对你有帮助，别忘了给我一个 Star，这对我真的很重要！

项目地址：https://github.com/cuiyunhao-2026/art-design-pro-inventory

Made with ❤️ by cuiyunhao-2026