# 经侦案件智慧管理系统 — 迁移至框架方案文档 > **源项目**: `jingzhen-case-mgmt/frontend`（Vue3 + Element Plus，独立开发） > **目标前端**: `economic-crime-web`（Vue3 + Ant Design Vue 4 + Vite5，1024框架） > **目标后端**: `economic-crime-api`（Spring Boot 3 + MyBatis-Plus + Sa-Token） > > **原则**: 样式参考 jingzhen-case-mgmt 设计风格，开发规范遵循 economic-crime 框架，使用多态/字典/枚举不硬编码 --- ## 一、技术栈对比与迁移要点 | 维度 | jingzhen-case-mgmt（源） | economic-crime-web（目标框架） | 迁移动作 | |------|--------------------------|-------------------------------|---------| | 构建工具 | Vue CLI 5 | **Vite 5** | 重写构建配置 | | UI组件库 | **Element Plus 2.4** | **Ant Design Vue 4.2** | 全部组件替换 | | CSS方案 | scoped CSS | **Less** + 主题变量 | 样式重写为Less | | 状态管理 | 无（reactive局部） | **Pinia** | 需按需建立store | | 路由 | 静态定义 index.js | **后端菜单动态生成** `buildRoutes()` | 不需要手写路由，通过后台配置菜单 | | HTTP封装 | 自定义axios.js | **smartAxios**（getRequest/postRequest） | 替换API调用方式 | | 权限控制 | 无 | **v-privilege指令** + Sa-Token | 按权限码控制按钮显隐 | | 字典/枚举 | 硬编码switch/case | **DictSelect / SmartEnumSelect 组件** | 改用字典枚举系统 | | 表格 | el-table | **a-table** + smart-table-column | 框架标准表格模式 | | 表单弹窗 | el-dialog | **a-modal / a-drawer** | 框架标准表单弹窗模式 | | 文件上传 | el-upload | **FileUpload 组件**（已封装） | 复用框架组件 | ### 关键差异说明 1. **UI组件完全不同**: Element Plus → Ant Design Vue，所有 `` 标签需改为 `` 2. **路由机制不同**: 框架通过后端 `t_menu` 表动态生成路由，页面放在 `views/` 对应路径即可 3. **API调用规范**: 框架统一使用 `postRequest(url, data)` / `getRequest(url, params)` ，返回 `{code:1, data, msg}` 4. **数据字典**: 框架有完整的字典服务，前端用 `DictSelect` 组件绑定 `dict-code` --- ## 二、数据库建表清单（需要用户执行） 以下所有表使用框架统一的字段约定： - `id` BIGINT AUTO_INCREMENT PRIMARY KEY - `create_user_id` BIGINT 创建人 - `create_time` DATETIME 创建时间 - `update_user_id` BIGINT 更新人 - `update_time` DATETIME 更新时间 - `deleted_flag` TINYINT(1) DEFAULT 0 逻辑删除(0=正常,1=删除) ### 2.1 警情主表 `t_alarm_report` ```sql CREATE TABLE t_alarm_report ( id BIGINT NOT NULL AUTO_INCREMENT COMMENT '主键ID', report_no VARCHAR(32) NOT NULL COMMENT '警情编号(JJ+年月日+9位序号)', alarm_time DATETIME NOT NULL COMMENT '报警时间', receiver VARCHAR(50) DEFAULT NULL COMMENT '接警员', alarm_source VARCHAR(20) NOT NULL COMMENT '警情来源(self=自接警,110=110接警,on-site=现场报案,transfer=移送案件,letter=信访转办,superior=上级交办,other=其他)', case_type_code VARCHAR(10) DEFAULT NULL COMMENT '经侦77类案件类型编码(01~77)', alarm_level VARCHAR(20) DEFAULT NULL COMMENT '警情级别(general/important/urgent/major/serious)', incident_address VARCHAR(500) NOT NULL COMMENT '事发地址', jurisdiction_unit VARCHAR(100)DEFAULT NULL COMMENT '管辖单位', push_unit VARCHAR(200) DEFAULT NULL COMMENT '推送单位(三案合一)', main_content TEXT DEFAULT NULL COMMENT '主要情节', bottom_remark TEXT DEFAULT NULL COMMENT '附带备注情况', is_first_alarm TINYINT(1) DEFAULT 0 COMMENT '是否首次报警(0=否,1=是)', original_alarm_id BIGINT DEFAULT NULL COMMENT '首次报警关联的原警情ID', status VARCHAR(20) DEFAULT 'pending' COMMENT '状态(pending待审核/reviewing审核中/approved已通过/rejected已退回/transferred已流转)', source_system VARCHAR(30) DEFAULT NULL COMMENT '来源系统(110抽取警情等)', alarm_no_110 VARCHAR(32) DEFAULT NULL COMMENT '110接警号(110抽取时填写)', -- 报案人信息 reporter_name VARCHAR(50) DEFAULT NULL COMMENT '报案人姓名', reporter_gender CHAR(1) DEFAULT NULL COMMENT '性别(M/F)', reporter_id_card VARCHAR(18) DEFAULT NULL COMMENT '证件号码', reporter_phone VARCHAR(20) DEFAULT NULL COMMENT '联系电话', reporter_address VARCHAR(500) DEFAULT NULL COMMENT '联系地址', is_enterprise TINYINT(1) DEFAULT 0 COMMENT '是否涉企(0=否,1=是)', enterprise_name VARCHAR(200) DEFAULT NULL COMMENT '报案单位(涉企时)', enterprise_reg_addr VARCHAR(500) DEFAULT NULL COMMENT '企业注册地', enterprise_biz_addr VARCHAR(500) DEFAULT NULL COMMENT '企业实际经营地', -- 受理意见 evidence_complete TINYINT(1) DEFAULT 0 COMMENT '证据材料是否齐全(0=否,1=是)', preliminary_opinion TEXT DEFAULT NULL COMMENT '初步意见', create_user_id BIGINT DEFAULT NULL, create_time DATETIME DEFAULT CURRENT_TIMESTAMP, update_user_id BIGINT DEFAULT NULL, update_time DATETIME DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP, deleted_flag TINYINT(1) DEFAULT 0, PRIMARY KEY (id), UNIQUE KEY uk_report_no (report_no), KEY idx_status (status), KEY idx_case_type (case_type_code), KEY idx_reporter_idcard (reporter_id_card), KEY idx_alarm_time (alarm_time) ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_general_ci COMMENT='警情登记主表'; ``` ### 2.2 被控告/举报人表 `t_alarm_suspect` ```sql CREATE TABLE t_alarm_suspect ( id BIGINT NOT NULL AUTO_INCREMENT, alarm_id BIGINT NOT NULL COMMENT '关联警情ID(t_alarm_report.id)', name VARCHAR(50) NOT NULL COMMENT '姓名', id_card VARCHAR(18) DEFAULT NULL COMMENT '证件号码', phone VARCHAR(20) DEFAULT NULL COMMENT '电话号码', company VARCHAR(200) DEFAULT NULL COMMENT '单位名称', create_time DATETIME DEFAULT CURRENT_TIMESTAMP, update_time DATETIME DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP, deleted_flag TINYINT(1) DEFAULT 0, PRIMARY KEY (id), KEY idx_alarm_id (alarm_id) ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_general_ci COMMENT='被控告举报人表'; ``` ### 2.3 证据材料表 `t_evidence_material` ```sql CREATE TABLE t_evidence_material ( id BIGINT NOT NULL AUTO_INCREMENT, alarm_id BIGINT NOT NULL COMMENT '关联警情ID', serial_no INT DEFAULT NULL COMMENT '序号', evidence_name VARCHAR(200) NOT NULL COMMENT '证据名称', evidence_type VARCHAR(20) NOT NULL COMMENT '证据类型(document=书证,physical=物证,audiovisual=视听,electronic=电子,appraisal=鉴定,investigation=勘验,other=其他)', quantity INT DEFAULT 1 COMMENT '数量', unit VARCHAR(20) DEFAULT '份' COMMENT '单位', description VARCHAR(500) DEFAULT NULL COMMENT '描述', collect_time DATETIME DEFAULT NULL COMMENT '收集时间', create_time DATETIME DEFAULT CURRENT_TIMESTAMP, update_time DATETIME DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP, deleted_flag TINYINT(1) DEFAULT 0, PRIMARY KEY (id), KEY idx_alarm_id (alarm_id) ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_general_ci COMMENT='证据材料表'; ``` ### 2.4 证据附件表 `t_evidence_file` ```sql CREATE TABLE t_evidence_file ( id BIGINT NOT NULL AUTO_INCREMENT, evidence_id BIGINT NOT NULL COMMENT '关联证据ID(t_evidence_material.id)', file_name VARCHAR(255) NOT NULL COMMENT '文件名', file_size BIGINT DEFAULT NULL COMMENT '文件大小(bytes)', file_type VARCHAR(20) DEFAULT NULL COMMENT '文件类型(image/document/audio/video/other)', file_url VARCHAR(500) NOT NULL COMMENT '文件存储路径/OSS地址', upload_time DATETIME DEFAULT CURRENT_TIMESTAMP COMMENT '上传时间', create_time DATETIME DEFAULT CURRENT_TIMESTAMP, deleted_flag TINYINT(1) DEFAULT 0, PRIMARY KEY (id), KEY idx_evidence_id (evidence_id) ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_general_ci COMMENT='证据附件表'; ``` ### 2.5 警情表单级附件表 `t_alarm_attachment` ```sql CREATE TABLE t_alarm_attachment ( id BIGINT NOT NULL AUTO_INCREMENT, alarm_id BIGINT NOT NULL COMMENT '关联警情ID', name VARCHAR(255) NOT NULL COMMENT '材料名称', upload_time DATETIME DEFAULT NULL COMMENT '上传时间', quantity INT DEFAULT 1 COMMENT '数量', file_url VARCHAR(500) DEFAULT NULL COMMENT '文件URL', file_size BIGINT DEFAULT NULL COMMENT '文件大小', create_time DATETIME DEFAULT CURRENT_TIMESTAMP, deleted_flag TINYINT(1) DEFAULT 0, PRIMARY KEY (id), KEY idx_alarm_id (alarm_id) ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_general_ci COMMENT='警情表单级附件表'; ``` ### 2.6 数据字典初始化（在 `t_dict_data` 和 `t_dict` 表中插入） 框架字典需要先在管理后台「系统管理→字典管理」中添加，或直接SQL插入： ```sql -- ===== 字典类型 (t_dict) ===== INSERT INTO t_dict (dict_name, dict_code, remark, deleted_flag, create_user_id, create_time) VALUES ('经侦77类案件类型', 'CASE_TYPE_77', '经侦类经济犯罪案件77种分类', 0, 1, NOW()), ('警情级别', 'ALARM_LEVEL', '警情等级划分', 0, 1, NOW()), ('警情来源', 'ALARM_SOURCE', '警情来源渠道', 0, 1, NOW()), ('证据类型', 'EVIDENCE_TYPE', '证据材料类型', 0, 1, NOW()), ('警情状态', 'ALARM_STATUS', '警情处理状态', 0, 1, NOW()), ('性别', 'GENDER', '性别', 0, 1, NOW()); -- ===== 经侦77类案件类型字典值 (t_dict_data) ===== -- 以下为示例，完整77项见下方补充列表 INSERT INTO t_dict_data (dict_code, value, label, sort, deleted_flag) VALUES ('CASE_TYPE_77', '01', '假币', 1, 0), ('CASE_TYPE_77', '02', '持有、使用假币', 2, 0), ('CASE_TYPE_77', '03', '金融工作人员购买假币、以假币换取货币', 3, 0), ('CASE_TYPE_77', '04', '出售、购买、运输假币', 4, 0), ('CASE_TYPE_77', '05', '变造货币', 5, 0), ('CASE_TYPE_77', '06', '伪造货币', 6, 0), ('CASE_TYPE_77', '07', '非法吸收公众存款', 7, 0), ('CASE_TYPE_77', '08', '集资诈骗', 8, 0), ('CASE_TYPE_77', '09', '贷款诈骗', 9, 0), ('CASE_TYPE_77', '10', '票据诈骗', 10, 0), -- ... 完整77项按此格式继续到 77 ('CASE_TYPE_77', '19', '非法经营', 19, 0), ('CASE_TYPE_77', '20', '合同诈骗', 20, 0), ('CASE_TYPE_77', '21', '职务侵占', 21, 0), ('CASE_TYPE_77', '22', '挪用资金', 22, 0), ('CASE_TYPE_77', '44', '虚开增值税专用发票', 44, 0), ('CASE_TYPE_77', '77', '其他经济犯罪', 77, 0); -- ===== 警情级别 ===== INSERT INTO t_dict_data (dict_code, value, label, sort, deleted_flag) VALUES ('ALARM_LEVEL', 'general', '一般警情', 1, 0), ('ALARM_LEVEL', 'important', '重要警情', 2, 0), ('ALARM_LEVEL', 'urgent', '紧急警情', 3, 0), ('ALARM_LEVEL', 'major', '重大警情', 4, 0), ('ALARM_LEVEL', 'serious', '严重警情', 5, 0); -- ===== 警情来源 ===== INSERT INTO t_dict_data (dict_code, value, label, sort, deleted_flag) VALUES ('ALARM_SOURCE', 'self', '自接警', 1, 0), ('ALARM_SOURCE', '110', '110接警', 2, 0), ('ALARM_SOURCE', 'on-site', '现场报案', 3, 0), ('ALARM_SOURCE', 'transfer', '移送案件', 4, 0), ('ALARM_SOURCE', 'letter', '信访转办', 5, 0), ('ALARM_SOURCE', 'superior', '上级交办', 6, 0), ('ALARM_SOURCE', 'other', '其他', 7, 0); -- ===== 证据类型 ===== INSERT INTO t_dict_data (dict_code, value, label, sort, deleted_flag) VALUES ('EVIDENCE_TYPE', 'document', '书证', 1, 0), ('EVIDENCE_TYPE', 'physical', '物证', 2, 0), ('EVIDENCE_TYPE', 'audiovisual', '视听资料', 3, 0), ('EVIDENCE_TYPE', 'electronic', '电子数据', 4, 0), ('EVIDENCE_TYPE', 'appraisal', '鉴定意见', 5, 0), ('EVIDENCE_TYPE', 'investigation', '勘验笔录', 6, 0), ('EVIDENCE_TYPE', 'other', '其他', 7, 0); -- ===== 警情状态 ===== INSERT INTO t_dict_data (dict_code, value, label, sort, deleted_flag) VALUES ('ALARM_STATUS', 'pending', '待审核', 1, 0), ('ALARM_STATUS', 'reviewing', '审核中', 2, 0), ('ALARM_STATUS', 'approved', '已通过', 3, 0), ('ALARM_STATUS', 'rejected', '已退回', 4, 0), ('ALARM_STATUS', 'transferred', '已流转', 5, 0); ``` --- ## 三、后端代码结构（economic-crime-api） 按照框架 `module/business/goods` 的标准分层结构，在 `economic-crime-admin` 下新建模块： ``` economic-crime-admin/src/main/java/net/lab1024/sa/admin/module/ └── business/ └── alarm/ # 接报案中心模块 ├── controller/ │ └── AlarmReportController.java # 警情CRUD接口 ├── service/ │ ├── AlarmReportService.java # 业务逻辑 │ └── AlarmReportQueryService.java # 查询服务(关联查询用) ├── domain/ │ ├── entity/ │ │ ├── AlarmReportEntity.java # 警情实体 │ │ ├── AlarmSuspectEntity.java # 嫌疑人实体 │ │ ├── EvidenceMaterialEntity.java # 证据实体 │ │ ├── EvidenceFileEntity.java # 证据附件实体 │ │ └── AlarmAttachmentEntity.java # 表单附件实体 │ ├── form/ │ │ ├── AlarmAddForm.java # 新增表单DTO │ │ ├── AlarmUpdateForm.java # 更新表单DTO │ │ ├── AlarmQueryForm.java # 查询条件DTO │ │ └── AlarmExtractForm.java # 110抽取表单DTO │ └── vo/ │ ├── AlarmReportVO.java # 列表VO │ └── AlarmDetailVO.java # 详情VO(含嫌疑人/证据嵌套) ├── dao/ │ ├── AlarmReportDao.java # Mapper接口 │ ├── AlarmSuspectDao.java │ ├── EvidenceMaterialDao.java │ ├── EvidenceFileDao.java │ └── AlarmAttachmentDao.java └── constant/ └── AlarmStatusEnum.java # 状态枚举(如需) ``` ### 后端接口设计（RESTful） | 方法 | 路径 | 功能 | 权限码 | |------|------|------|--------| | POST | `/alarm-report/query` | 分页查询警情列表 | `alarm:query` | | POST | `/alarm-report/add` | 新增警情登记 | `alarm:add` | | POST | `/alarm-report/update` | 更新警情信息 | `alarm:update` | | GET | `/alarm-report/delete/{id}` | 删除警情 | `alarm:delete` | | GET | `/alarm-report/detail/{id}` | 警情详情(含子表) | `alarm:detail` | | POST | `/alarm-report/audit` | 审核警情 | `alarm:audit` | | POST | `/alarm-report/extract-110` | 110警情抽取 | `alarm:extract` | | POST | `/alarm-report/history-query` | 首次报警历史查询 | `alarm:query` | | GET | `/evidence-material/list/{alarmId}` | 证据材料列表 | `evidence:query` | | POST | `/evidence-material/add` | 新增证据 | `evidence:add` | | POST | `/evidence-material/update` | 更新证据 | `evidence:update` | | GET | `/evidence-material/delete/{id}` | 删除证据 | `evidence:delete` | | POST | `/suspect/add` | 新增嫌疑人 | `suspect:add` | | GET | `/suspect/delete/{id}` | 删除嫌疑人 | `suspect:delete` | ### 后端开发规范要点 1. **统一返回**: 所有接口返回 `ResponseDTO`，成功 `code=1` 2. **分页**: 使用 `PageResult`，前端传 `pageNum/pageSize` 3. **校验**: Form对象使用 `@Valid` + JSR303注解 4. **权限**: `@SaCheckPermission("alarm:query")` 注解 5. **日志**: 使用 `@Slf4j` + `log.info/error` 6. **拷贝**: 使用框架的 `SmartBeanUtil.copy()` 7. **分页工具**: 使用 `SmartPageUtil.convert2PageQuery()` 8. **操作记录**: 关键操作调用 `DataTracerService` --- ## 四、前端代码结构（economic-crime-web） 按照框架 `views/business/` 的目录规范： ``` economic-crime-web/src/ ├── api/ │ └── business/ │ └── alarm/ # 接报案中心API │ └── alarm-report-api.js # 接口定义 ├── constants/ │ └── business/ │ └── alarm/ │ └── alarm-const.js # 枚举/常量定义 ├── views/ │ └── business/ │ └── alarm/ # 接报案中心页面 │ ├── alarm-reception-list.vue # 接报案大厅(列表页) │ ├── components/ │ │ ├── type-select-modal.vue # 登记类型选择弹窗 │ │ ├── non-economic-form.vue # 非经侦类登记表单 │ │ ├── pending-review-form.vue # 待审核(经侦类)登记表单 │ │ ├── view-detail-drawer.vue # 查看详情抽屉 │ │ ├── audit-modal.vue # 审核弹窗 │ │ ├── evidence-modal.vue # 证据材料清单弹窗 │ │ ├── evidence-preview-modal.vue# 材料预览弹窗 │ │ └── evidence-form-modal.vue # 证据新增/编辑弹窗 │ ├── alarm-extract-list.vue # 数据互通/110抽取 │ └── ... ``` ### 前端API定义示例（alarm-report-api.js） ```javascript /* * 接报案中心 - 警情管理接口 */ import { postRequest, getRequest } from '/@/lib/axios'; export const alarmReportApi = { // 分页查询 queryList: (param) => postRequest('/alarm-report/query', param), // 新增 add: (param) => postRequest('/alarm-report/add', param), // 更新 update: (param) => postRequest('/alarm-report/update', param), // 删除 delete: (id) => getRequest(`/alarm-report/delete/${id}`), // 详情 detail: (id) => getRequest(`/alarm-report/detail/${id}`), // 审核 audit: (param) => postRequest('/alarm-report/audit', param), // 110抽取 extract110: (param) => postRequest('/alarm-report/extract-110', param), // 历史查询(首次报警) historyQuery: (keyword) => getRequest('/alarm-report/history-query', { keyword }), // === 证据材料 === queryEvidence: (alarmId) => getRequest(`/evidence-material/list/${alarmId}`), addEvidence: (param) => postRequest('/evidence-material/add', param), updateEvidence: (param) => postRequest('/evidence-material/update', param), deleteEvidence: (id) => getRequest(`/evidence-material/delete/${id}`), // === 嫌疑人 === addSuspect: (param) => postRequest('/suspect/add', param), deleteSuspect: (id) => getRequest(`/suspect/delete/${id}`), }; ``` ### 前端页面组件模式（遵循框架规范） 每个业务模块的标准模式： - **列表页**: `a-form`(查询区) + `a-table`(表格区) + `a-modal/a-drawer`(表单弹窗) - **表单弹窗**: 独立组件，`defineEmits(['reloadList'])` 通知父组件刷新 - **权限控制**: `v-privilege="'alarm:add'"` 控制按钮 - **字典使用**: `` - **枚举使用**: `` - **文件上传**: `` （框架已封装） ### Element Plus → Ant Design Vue 组件映射 | Element Plus | Ant Design Vue | 说明 | |-------------|----------------|------| | `el-form` | `a-form` | model→model, rules→rules | | `el-form-item` | `a-form-item` | label→label, prop→name | | `el-input` | `a-input` | v-model→v-model:value | | `el-select` | `a-select` | el-option→a-select-option | | `el-radio-group` | `a-radio-group` | el-radio→a-radio, :value→:value | | `el-date-picker` | `a-date-picker` | format/valueFormat保持 | | `el-table` | `a-table` | :data→:dataSource, el-table-column→a-table-column | | `el-dialog` | `a-modal` | v-model→:open, title→title | | `el-button` | `a-button` | type保持(primary/danger等) | | `el-tag` | `a-tag` | color映射调整 | | `el-pagination` | `a-pagination` | 属性名基本一致 | | `el-upload` | `FileUpload`组件 | 用框架封装组件替代 | | `ElMessage` | `message` from ant-design-vue | message.success/error/warning | | `ElMessageBox` | `Modal` from ant-design-vue | Modal.confirm/info | --- ## 五、菜单配置（需要在后台添加） 框架的路由由后端 `t_menu` 表驱动。需要在系统管理→菜单管理中添加以下菜单结构： ``` 接报案中心 (menuId: 自增, path: business/alarm/alarm-reception-list) ├── 接报案大厅 path: business/alarm/alarm-reception-list component: /business/alarm/alarm-reception-list.vue ├── 数据互通 path: business/alarm/alarm-extract-list component: /business/alarm/alarm-extract-list.vue ├── 审核监督 path: business/alarm/alarm-audit-list component: /business/alarm/alarm-audit-list.vue (待开发) ├── 材料预览 path: business/alarm/material-view component: /business/alarm/material-view.vue (待开发) └── 视频监控 path: business/alarm/center-monitor component: /business/alarm/center-monitor.vue (待开发) 案件管理 (已有或新建) ├── 案件监督 path: ... ├── 执法考评 path: ... ├── 两书一单 path: ... ├── 风险预警 path: ... ├── 涉企案件 path: ... ├── 领办包保 path: ... └── 卷宗管理 path: ... 涉案资金 ├── 资金管理 path: ... ├── 资金分析 path: ... └── 金析为证 path: ... 涉案财物 └── 财物管理 path: ... 审议流程 ├── 一般审议 path: ... ├── 监督督办 path: ... ├── 审核意见 path: ... ├── 审核组配置 path: ... └── 流程列表 path: ... 数据大屏 └── 综合数据大屏 path: business/alarm/data-bigscreen component: /business/alarm/data-bigscreen.vue ``` --- ## 六、迁移执行顺序建议 ### 第一阶段：基础搭建（后端优先） 1. **建表** — 执行第二节的6张DDL + 字典初始化SQL 2. **后端Entity** — 5个实体类 + MyBatis-Plus注解 3. **后端Form/VO** — AddForm/UpdateForm/QueryForm/VO 4. **后端DAO/Mapper** — 接口 + XML 5. **后端Service** — CRUD + 逻辑 6. **后端Controller** — RESTful接口 + 权限注解 ### 第二阶段：前端核心页面 7. **API层** — alarm-report-api.js 8. **常量/枚举** — alarm-const.js 9. **接报案大厅列表页** — alarm-reception-list.vue（最核心，包含所有弹窗组件） 10. **110数据互通页** — alarm-extract-list.vue ### 第三阶段：完善功能 11. **审核监督页** — 审核流程 12. **材料预览页** — 文件预览 13. **视频监控页** — 视频接入 14. **数据大屏页** — ECharts可视化 ### 第四阶段：其他业务模块 15-29. 按同样模式迁移：案件管理/涉案资金/涉案财物/审议流程 各子页面 --- ## 七、注意事项 1. **不要修改 jingzhen-case-mgmt** — 它作为样式参考保留 2. **样式复用策略** — 将jingzhen-case-mgmt中的CSS设计语言（渐变色值、圆角、阴影、间距）提取为 Less 变量写入框架主题 3. **多态实现** — 案件类型77种用字典驱动，不用硬编码switch；状态流转用枚举约束 4. **文件存储** — 复用框架已有的 FileController 上传接口，存取文件URL 5. **权限粒度** — 每个操作按钮配独立权限码，方便后台灵活配置