3.7 KiB
3.7 KiB
企业数字档案管理系统
项目概述
企业数字档案管理系统是基于Vue.js前端框架开发的企业级档案管理应用,对标《GBT 39784-2021电子档案管理系统通用功能要求》。本项目是feat-ezyc分支,专门针对鄂州烟草项目定制开发。
技术栈
- 前端框架: Vue 2.6.10
- UI组件库: Element UI 2.15.6, Ant Design Vue 1.7.8
- 状态管理: Vuex 3.1.0
- 路由管理: Vue Router 3.0.2
- 构建工具: Vue CLI 4.4.4
- HTTP客户端: Axios 0.26.0
- 图表库: ECharts 4.2.1
- 工作流: BPMN.js 8.7.1
- 测试框架: Jest
项目架构
- 基于vue-element-admin模板进行开发
- 采用模块化路由设计,主要功能模块包括:
- 档案管理 (archives-management)
- 档案利用 (archiveUtilize)
- 智能库房 (intelligent-warehouse)
- 数据管理 (dataManagement)
- 系统管理 (system-management)
- 预归档 (preFiling)
- 监督管理 (supervise-management)
- 权限管理 (authority-management)
- 管辖范围 (jurisdiction)
- 文件收集 (fileCollection)
构建和运行
环境要求
- Node.js >= 8.9
- npm >= 3.0.0
开发环境运行
# 安装依赖
npm install
# 启动开发服务器
npm run dev
开发服务器默认端口由环境变量VUE_APP_PROXY_PORT决定,代理API请求到http://127.0.0.1:9081
生产环境构建
# 构建生产环境版本
npm run build:prod
# 构建测试环境版本
npm run build:stage
代码质量检查
# ESLint代码检查
npm run lint
# 运行单元测试
npm run test:unit
# CI环境检查(lint + test)
npm run test:ci
其他实用命令
# 预览构建结果
npm run preview
# 生成新组件/页面/存储模块
npm run new
# 优化SVG图标
npm run svgo
开发规范
代码风格
- 使用ESLint进行代码规范检查
- 采用Vue.js官方推荐的风格指南
- 使用Plop模板生成器创建新组件,保持代码结构一致
目录结构规范
src/
├── api/ # API接口定义
├── assets/ # 静态资源
├── components/ # 公共组件
├── directive/ # 自定义指令
├── filters/ # 全局过滤器
├── icons/ # SVG图标
├── layout/ # 布局组件
├── router/ # 路由配置
├── store/ # Vuex状态管理
├── styles/ # 全局样式
├── utils/ # 工具函数
└── views/ # 页面组件
组件开发规范
- 使用Vue单文件组件(.vue)格式
- 组件命名采用PascalCase
- 公共组件放置在
src/components目录 - 页面级组件放置在
src/views对应功能模块目录
Git提交规范
- 使用lint-staged进行提交前代码检查
- 通过husky配置pre-commit钩子自动执行代码格式化
项目特性
- 支持响应式设计,适配不同屏幕尺寸
- 集成多种文件预览功能(PDF、图片等)
- 支持工作流审批流程
- 实现了3D库房展示功能
- 集成了丰富的图表展示组件
- 支持批量操作和数据导入导出
- 实现了细粒度的权限控制系统
部署说明
环境配置
项目支持多环境配置,通过.env文件管理:
.env.development- 开发环境配置.env.staging- 测试环境配置.env.production- 生产环境配置
静态资源处理
- 生产环境静态资源输出到
dist/static目录 - 支持CDN部署,通过
publicPath配置 - 图片资源支持懒加载和压缩优化
代理配置
开发环境API代理配置在vue.config.js中:
proxy: {
"/api": {
target: "http://127.0.0.1:9081",
changeOrigin: true,
ws: true,
pathRewrite: {
"^/apis": "",
},
},
}