# sys-common-portal

**Repository Path**: yaobinbin/sys-common-portal

## Basic Information

- **Project Name**: sys-common-portal
- **Description**: 通用后台管理系统，采用最新版本layui框架，结合crypto-js加解密，以及jquery操作dom，其余纯手写。
- **Primary Language**: HTML
- **License**: MIT
- **Default Branch**: main
- **Homepage**: https://sys-common.thought.ren
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-07-24
- **Last Updated**: 2024-08-04

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

### 通用后台管理系统

---

#### 一、概述

采用最新版本layui框架，结合crypto-js加解密，以及jquery操作dom，其余纯手写。

适合钟爱layui和jquery的用户，尤其老程序员们。

而今的网络环境，带宽和响应式已不再是前端的限制性条件，因此，选择一款越接近原生的框架，可操作的空间越大。项目做多了、深了你会发现，代码的可操作空间直接影响了项目的发挥空间。为了拥有更大的项目空间，我们选择相对接近原生的layui和jquery。

采用webpack对包进行管理，生产环境下不易暴露源代码和业务逻辑；同时，前后端传参采用crypto-js加解密，即便请求被中间网络拦截，也无法拿到原始数据，最大程度上保证数据安全。

---

#### 二、使用方式

1. 运行 npm install 安装依赖包
2. 运行 npm run dev 启动项目
3. 运行 npm run build 打包项目

---

#### 三、传参加密与响应解密

![传参加密](document/images/0.1.传参加密.png "传参加密")

![响应假面](document/images/0.2.响应加密.png "响应加密")

#### 四、登录、锁屏、页脚设置、注销、重置密码、用户中心

![登录](document/images/1.0.login.png "登录")

![锁屏](document/images/1.1.lock-screen.png "锁屏")

![页脚设置](document/images/1.2.footer.png "页脚设置")

![注销](document/images/1.3.logout.png "注销")

![重置密码](document/images/1.4.reset-pwd.png "重置密码")

![用户中心](document/images/1.5.user-center.png "用户中心")

#### 五、用户分页列表、添加用户、编辑用户、删除用户、用户授权

![用户分页列表](document/images/2.1.user-page.png "用户分页列表")

![添加用户](document/images/2.2.add-user.png "添加用户")

![编辑用户](document/images/2.3.modify-user.png "编辑用户")

![删除用户](document/images/2.4.remove-user.png "删除用户")

![用户授权](document/images/2.5.grant-user.png "用户授权")

#### 六、角色列表、添加角色、编辑角色、删除角色、角色授权

![角色列表](document/images/3.1.role-list.png "角色列表")

![添加角色](document/images/3.2.add-role.png "添加角色")

![编辑角色](document/images/3.3.modify-role.png "编辑角色")

![删除角色](document/images/3.4.remove-role.png "删除角色")

![角色授权](document/images/3.5.grant-role.png "角色授权")

#### 七、权限树形列表、添加菜单权限、添加接口权限、编辑菜单权限、编辑接口权限、删除权限

![权限树形列表](document/images/4.1.auth-tree.png "权限树形列表")

![添加菜单权限](document/images/4.2.add-auth-menu.png "添加菜单权限")

![添加接口权限](document/images/4.3.add-auth-api.png "添加接口权限")

![编辑菜单权限](document/images/4.4.modify-auth-menu.png "编辑菜单权限")

![编辑接口权限](document/images/4.5.modify-auth-api.png "编辑接口权限")

![删除权限](document/images/4.6.remove-auth.png "删除权限")