# component-management-back-vue2

**Repository Path**: hide-yesterday/component-management-back-vue2

## Basic Information

- **Project Name**: component-management-back-vue2
- **Description**: 新搭建的后台vue2项目，内置表单设计器 vue2.vuex,vue-router
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-04-01
- **Last Updated**: 2025-11-08

## Categories & Tags

**Categories**: Uncategorized

**Tags**: vue2, Vuex, vue-router, form-create, form-create-designer

## README

# 组件管理后台系统 (Vue 2)

## 项目介绍

这是一个基于 Vue 2 构建的组件管理后台系统，提供了完整的用户管理、权限控制、流程管理等功能。

## 技术栈

- **前端框架**: Vue.js 2.6.x
- **UI 库**: Element UI 2.15.x
- **状态管理**: Vuex 3.6.x
- **路由管理**: Vue Router 3.5.x
- **HTTP 客户端**: Axios 0.27.x
- **流程引擎**: BPMN.js 8.9.x
- **表单设计器**: @form-create/element-ui 2.7
- **图表库**: ECharts 5.6.x
- **构建工具**: Vue CLI 5.x

## 功能特性

- ✨ 用户管理与权限控制
- ✨ 部门和岗位管理
- ✨ 角色和菜单配置
- ✨ 流程定义与管理
- ✨ OA 流程模板定制
- ✨ 审批管理系统
- ✨ 数据可视化图表
- ✨ 文件管理功能
- ✨ 系统日志记录

## 项目结构

```
src/
├── api/           # API 请求模块
├── assets/        # 静态资源
├── components/    # 公共组件
├── layout/        # 布局组件
├── router/        # 路由配置
├── store/         # Vuex 状态管理
├── utils/         # 工具函数
├── views/         # 页面视图
├── App.vue        # 根组件
├── main.js        # 入口文件
└── permission.js  # 权限控制
```

## 快速开始

### 环境要求

- Node.js >= 12.0.0
- npm >= 6.0.0

### 安装依赖

```bash
npm install
```

### 开发环境运行

```bash
npm run dev
# 或
npm run serve
```

### 生产环境构建

```bash
npm run build
```

### 代码检查与修复

```bash
npm run lint
```

## VSCode 开发配置

为了获得最佳开发体验，请安装以下 VSCode 插件：

- ESLint
- Prettier - Code formatter

并确保在 VSCode 设置中启用了以下选项：

```json
{
  // 文件在停顿一段时间后自动保存（单位为毫秒），"afterDelay" 表示启用自动保存
  "files.autoSave": "afterDelay",
  // 当 files.autoSave 启用时，自动保存的延迟时间（可选），例如 1000 毫秒（1 秒）
  "files.autoSaveDelay": 1000,
  // 编辑器打开文件时不启用预览模式（预览模式会在同一 tab 中复用）
  "workbench.editor.enablePreview": false,

  // Windows 终端默认使用的配置文件（例如 "Command Prompt" 或 "PowerShell" 或 "Git Bash"）
  "terminal.integrated.defaultProfile.windows": "Command Prompt",

  // 允许 Unicode 高亮仅在指定语言环境下（这里允许简体中文）
  "editor.unicodeHighlight.allowedLocales": {
    "zh-hans": true
  },
  // 编辑器侧栏（资源管理器）、文件树、项目中的文件/文件夹以及其他 UI 元素使用哪一套文件图标主题 (如果安装了material-icon-theme该插件扩展)
  "workbench.iconTheme": "material-icon-theme",
  // 指定整个编辑器的颜色主题（color theme），控制编辑器背景色、编辑器语法高亮、侧边栏、终端等 UI 的配色风格
  "workbench.colorTheme": "Gradient Dracula Theme",
  //编辑器字体大小
  "editor.fontSize": 15,
  // 自动从远程仓库获取更新
  "git.autofetch": true,
  // 将设置应用到所有配置概要文件（通常为空数组）
  "workbench.settings.applyToAllProfiles": [],
  //在你保存文件（Ctrl/Cmd+S）时，VS Code 会自动对当前文件运行已配置的代码格式化器（formatter），并将文件格式化。
  "editor.formatOnSave": true,
  //指定了默认格式化器为 Prettier（esbenp.prettier-vscode），适用于 JS/TS 等。
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.codeActionsOnSave": {
    "source.fixAll": "explicit"
  }
}
```

## 项目配置文件

- `.env.development`: 开发环境配置
- `.env.production`: 生产环境配置
- `.env.staging`: 测试环境配置

## 贡献指南

欢迎提交 Issue 和 Pull Request 来改进这个项目。

## 许可证

MIT