extjs权限管理系统, 系统架构

ExtJS权限管理系统的设计与实现

系统架构

1. 技术选型

- 前端框架：ExtJS 5.1

- 后端框架：Spring MVC

- 数据库：MySQL

- 缓存：Redis

2. 系统模块

- 用户管理：实现用户信息的增删改查，包括用户基本信息、角色分配等。

- 角色管理：实现角色的增删改查，包括角色名称、权限分配等。

- 权限管理：实现权限的增删改查，包括菜单权限、按钮权限等。

- 菜单管理：实现菜单的增删改查，包括菜单名称、URL、父菜单等。

- 操作日志：记录用户操作日志，包括操作时间、操作类型、操作内容等。

数据库设计

1. 用户表（T_USER）

| 字段名 | 数据类型 | 说明 |

| ------------ | ---------- | ---------- |

| user_id | INT | 用户ID |

| username | VARCHAR(50) | 用户名 |

| password | VARCHAR(50) | 密码 |

| role_id | INT | 角色ID |

| create_time | DATETIME | 创建时间 |

| update_time | DATETIME | 更新时间 |

2. 角色表（T_ROLE）

| 字段名 | 数据类型 | 说明 |

| ------------ | ---------- | ---------- |

| role_id | INT | 角色ID |

| role_name | VARCHAR(50) | 角色名称 |

| create_time | DATETIME | 创建时间 |

| update_time | DATETIME | 更新时间 |

3. 权限表（T_AUTHORITY）

| 字段名 | 数据类型 | 说明 |

| ------------ | ---------- | ---------- |

| auth_id | INT | 权限ID |

| auth_name | VARCHAR(50) | 权限名称 |

| auth_type | VARCHAR(50) | 权限类型 | （菜单、按钮等）

| create_time | DATETIME | 创建时间 |

| update_time | DATETIME | 更新时间 |

4. 角色权限表（T_ROLE_AUTHORITY）

| 字段名 | 数据类型 | 说明 |

| ------------ | ---------- | ---------- |

| role_id | INT | 角色ID |

| auth_id | INT | 权限ID |

| create_time | DATETIME | 创建时间 |

| update_time | DATETIME | 更新时间 |

前端实现

1. 用户管理

使用ExtJS的Grid组件实现用户信息的增删改查，包括用户基本信息、角色分配等。

```javascript

Ext.create('Ext.grid.Panel', {

title: '用户管理',

store: Ext.create('Ext.data.Store', {

fields: ['user_id', 'username', 'password', 'role_id'],

proxy: {

type: 'ajax',

url: '/user/list',

reader: {

type: 'json',

root: 'data'

}

}

}),

columns: [

{ header: '用户ID', dataIndex: 'user_id' },

{ header: '用户名', dataIndex: 'username' },

{ header: '密码', dataIndex: 'password' },

{ header: '角色ID', dataIndex: 'role_id' }

],

tbar: [

{

text: '添加',

handler: function() {

// 添加用户

}

},

{

text: '修改',

handler: function() {

// 修改用户

}

},

{

text: '删除',

handler: function() {

// 删除用户

}

}

]

2. 角色管理

使用ExtJS的Grid组件实现角色的增删改查，包括角色名称、权限分配等。

```javascript

Ext.create('Ext.grid.Panel', {

title: '角色管理',

store: Ext.create('Ext.data.Store', {

fields: ['role_id', 'role_name'],

proxy: {

type: 'ajax',

url: '/role/list',

reader: {

type: 'json',

root: 'data'

}

}

}),