SSM+Vue物资管理系统开发实战与优化

1. 项目概述与背景

作为一名经历过多次企业物资管理混乱局面的开发者，我深知中小企业在物资管理上的痛点。传统Excel表格+微信报单的模式，往往导致库存数据滞后、责任划分不清、重复采购等问题频发。这次分享的SSM+Vue物资管理系统，正是为了解决这些实际问题而设计的轻量级解决方案。

系统采用前后端分离架构，后端基于Spring+SpringMVC+MyBatis框架组合，前端使用Vue.js实现响应式界面。特别针对10-200人规模的中小企业设计，覆盖从采购申请到最终归还的完整物资生命周期管理。与市面上常见的ERP系统相比，我们的方案更注重：

• 操作便捷性（扫码即可完成出入库）
• 实时协同能力（多角色数据即时同步）
• 移动端适配（支持手机端操作）

2. 核心功能模块设计

2.1 系统架构解析

系统采用经典的三层架构：

code复制表现层（Vue.js前端） → 业务逻辑层（Spring） → 数据访问层（MyBatis）

前后端通过RESTful API交互，数据格式统一为JSON。这种设计使得后期扩展小程序端或APP端时，可以复用90%的后端接口。

提示：选择Tomcat7而非更高版本，是考虑到企业实际环境中旧版本服务器仍广泛使用，确保系统有更好的兼容性。

2.2 八大核心功能域实现

2.2.1 员工权限管理

采用RBAC（基于角色的访问控制）模型，实现四级权限划分：

1. 系统管理员：全功能访问
2. 部门主管：审批+部门数据查看
3. 普通员工：自助申请+个人记录查询
4. 仓库管理员：出入库操作

权限控制通过Spring Security实现，前端菜单根据权限动态渲染。特别注意处理了"部门数据隔离"问题，确保财务部只能看到本部门物资记录。

2.2.2 物资分类设计

创新性地采用"树形结构+属性模板"双重分类：

java复制// 分类实体类示例
public class MaterialCategory {
    private Long id;
    private String name;
    private Long parentId;  // 树形结构
    private String attributes; // JSON格式的属性模板
    // 电子类示例属性模板
    // {"voltage":"电压","wattage":"功率"}
}

前端使用Vue的递归组件渲染树形选择器，属性表单则根据模板动态生成。

2.2.3 采购流程实现

采购流程状态机设计（使用Camunda引擎）：

code复制申请 → 部门审批 → 财务复核 → 生成PO → 供应商确认 → 物流跟踪 → 到货质检

关键实现技巧：

• 使用Redis缓存审批人信息，减少数据库查询
• 金额阈值判断采用策略模式，便于后期调整

java复制// 审批策略接口
public interface ApprovalStrategy {
    String getApprover(double amount);
}

3. 关键技术实现细节

3.1 高并发入库解决方案

实测发现当并发入库超过200QPS时，MySQL出现明显性能下降。最终采用双缓冲方案：

1. 前端：Vue组件添加防抖控制（300ms间隔）
2. 后端：
   • MyBatis-Plus批量插入（每50条执行一次）
   • Redis分布式锁控制关键操作
   • 引入消息队列削峰

java复制@Transactional
public void batchImport(List<Material> materials) {
    // 获取分布式锁
    String lockKey = "import_lock_" + warehouseId;
    try {
        boolean locked = redisTemplate.opsForValue()
            .setIfAbsent(lockKey, "1", 30, TimeUnit.SECONDS);
        if (!locked) throw new RuntimeException("操作太频繁");
        
        // 分批处理
        Lists.partition(materials, 50).forEach(batch -> {
            materialMapper.insertBatch(batch);  // 自定义批量方法
            updateStock(batch); // 更新库存
        });
    } finally {
        redisTemplate.delete(lockKey);
    }
}

3.2 前后端状态同步方案

物资状态变更是个典型的前后端一致性问题。我们的解决方案：

1. 使用WebSocket实现实时推送
2. 定时任务每小时全量校验
3. 关键操作采用"预检+确认"双阶段

前端状态管理使用Vuex，结构设计如下：

javascript复制const store = new Vuex.Store({
    state: {
        materials: {
            // 使用对象存储便于快速查找
            byId: { 
                'm001': {id:'m001', status:'IN_STOCK', ...}
            },
            // 状态变更记录
            statusLogs: []  
        }
    },
    mutations: {
        updateStatus(state, {id, newStatus}) {
            // 记录旧状态
            const oldStatus = state.materials.byId[id].status;
            state.materials.statusLogs.push({
                id, oldStatus, newStatus, time: new Date()
            });
            // 更新当前状态
            state.materials.byId[id].status = newStatus;
        }
    }
})

4. 系统部署与性能优化

4.1 生产环境部署要点

推荐服务器配置：

• CPU：4核（最低2核）
• 内存：8GB（JVM分配4GB）
• 磁盘：100GB SSD（数据库单独挂载）

关键JVM参数：

code复制-Xms2048m -Xmx4096m -XX:+UseG1GC 
-XX:MaxGCPauseMillis=200

4.2 性能调优实战记录

通过JMeter压测发现的三个性能瓶颈及解决方案：

1. 物资查询接口响应慢（>2s）

   • 问题定位：MyBatis N+1查询问题
   • 解决方案：

     xml复制<!-- 使用关联查询替代多次查询 -->
     <select id="selectWithCategory" resultMap="materialResult">
         SELECT m.*, c.name as category_name 
         FROM material m LEFT JOIN category c ON m.category_id=c.id
         WHERE m.id=#{id}
     </select>
     

     添加二级缓存：

     java复制@Cacheable(value = "material", key = "#id")
     public Material getById(Long id) { ... }
     

2. 导出Excel内存溢出

   • 问题现象：导出5000条记录时OOM
   • 解决方案：改用POI的SXSSFWorkbook流式导出

     java复制SXSSFWorkbook workbook = new SXSSFWorkbook(100); // 保留100行在内存
     // ... 写入数据
     workbook.dispose(); // 清理临时文件
     

3. 首页加载资源过多

   • 优化前：首屏资源1.8MB
   • 优化措施：
     • 使用Vue异步组件
     • 启用Gzip压缩（Nginx配置）
     • 静态资源CDN分发
   • 优化后：首屏资源降至450KB

5. 项目开发经验总结

5.1 踩坑实录与解决方案

跨部门数据权限问题
初期设计时忽略了跨部门数据可见性需求，导致财务部需要查看全公司物资数据时无法实现。最终解决方案：

1. 在RBAC基础上增加数据权限表
2. 使用MyBatis拦截器自动添加SQL条件

java复制@Intercepts(@Signature(type= Executor.class, method="query",
    args={MappedStatement.class, Object.class, RowBounds.class, ResultHandler.class}))
public class DataPermissionInterceptor implements Interceptor {
    @Override
    public Object intercept(Invocation invocation) throws Throwable {
        // 自动添加部门ID条件
        if (needDataFilter()) {
            BoundSql boundSql = ms.getBoundSql(parameterObject);
            String newSql = boundSql.getSql() + " AND dept_id IN ("+getDeptIds()+")";
            resetSql(invocation, newSql);
        }
        return invocation.proceed();
    }
}

Excel导入功能兼容性问题
企业提供的Excel文件格式五花八门，导致导入失败率高。最终实现方案：

1. 使用Apache POI自动检测文件格式（xls/xlsx）
2. 开发智能表头匹配算法
3. 提供导入模板下载
4. 前端使用vue-json-excel组件

5.2 给开发者的实用建议

1. 二维码生成优化

   • 使用Google的ZXing库生成二维码
   • 添加容错级别（建议30%）

   java复制Map<EncodeHintType, Object> hints = new HashMap<>();
   hints.put(EncodeHintType.ERROR_CORRECTION, ErrorCorrectionLevel.M);
   hints.put(EncodeHintType.MARGIN, 1); // 边距
   BitMatrix matrix = new QRCodeWriter().encode(
       content, BarcodeFormat.QR_CODE, width, height, hints);
   

2. 库存预警实现技巧

   • 定时任务检查（每日凌晨2点）
   • 实时检查（入库/出库时触发）
   • 使用Redis HyperLogLog统计高频操作

   java复制// 记录操作
   redisTemplate.opsForHyperLogLog().add("material_op:"+materialId, userId);
   // 获取操作次数
   Long count = redisTemplate.opsForHyperLogLog().size("material_op:"+materialId);
   

3. 老系统迁移策略

   • 分阶段上线：先并行运行1个月
   • 数据同步：开发双向同步工具
   • 日志记录：详细记录所有数据变更

这套系统在实际部署后，客户反馈库存准确率从原来的82%提升到99.6%，月度盘点时间从8小时缩短到2小时。特别是在防疫物资管理场景下，二维码扫码功能大大减少了接触感染风险。