菜单权限管理

菜单管理系统的整体架构

1.Menu 菜单表

2.role 角色表

3.role_menu 角色菜单关联表（多对多）

要找role_id为3的角色能用哪个菜单:

sql 复制代码

SELECT *FROM sys_menu a LEFT JOIN sys_role_menu b 
ON a.menu_id= b.menu_id WHERE role_id=3

拆分开就是

4.user 用户表

5.user_role 用户角色关联表（多对多）

前后端数据库是如何交互的

Ajax

浏览器------>ngix<-------------->Tomcat------->DB

jdbc的工作原理

即java Database connectivity

其中有一个getConnection（url，user，password）来提供给DriverManager管理，来存储到一个Connection对象

其中有三个类Connection statement ResultSet

statement是用来实现SQL语句

ResultSet中存储着键值对，比如id：1 name：张三 id：2 name：李四.....

java 复制代码

int id = resultSet.getInt(id);
String name = resultSet.getString(name);

persion.setId(id);
persion.setName(name);

它是用来把数据库的内容存储到对象中

联表查询显示图书类型下拉菜单

以在图书管理系统的图书index.vue中显示图书类型的下拉菜单为例

1.首先，我们写一个下拉菜单select

html 复制代码

<el-form-item label="图书类型">
          <el-select v-model="form.typeId" placeholder="请选择图书类型">
              <el-option v-for="typelist in typeLists" :key="typelist.id" :label="typelist.name":value="typelist.id"></el-option>
          </el-select>
</el-form-item>

其中form.typeId的typeId所对应的是Book类里的typeId字段，当表单提交时，前端会将 form 对象的数据（包括 typeId）传递给后端。

2.我们用到了typelists列表，所以要在data里定义一个数组typelists[]

javascript 复制代码

data(){
typelists[]
}

3.在method中写一个动态获取typeList的函数

javascript 复制代码

 getBooktypeList() {
      listBooktype1().then(response => {
        // console.info(response.data)
        this.typeLists = response.data;
      })
    }

把listBooktype1()得到的响应赋值给typeLists

4.在created中初始化函数getBooktypeList()

javascript 复制代码

created() {
    this.getBooktypeList()
  },

5.实现 listBooktype1()

在booktype.json获取图书类型内容

javascript 复制代码

export function listBooktype1() {
  return request({
    url: '/book/booktype/typeList',
    method: 'get',
  })
}

url和后端BookTypeController的mapping对应

6.查询符合条件的图书类型封装到AjaxResult 对象中供前端获取

java 复制代码

@PreAuthorize("@ss.hasPermi('book:booktype:list')")
    @GetMapping("/typeList")
    public AjaxResult typeList(BookType bookType)
    {
        startPage();
        List<BookType> list = bookTypeService.selectBookTypeList(bookType);
        AjaxResult j = AjaxResult.success(list);
        return j;
    }

7.在book类里添加bookType属性和typeId属性,并提供set，get方法

java 复制代码

private Integer typeId;
private BookType  bookType;

8.在前端显示bookType.name

html 复制代码

      <el-table-column label="图书类型" align="center" prop="bookType.name"/>

9.在Mapper中修改sql语句

在查询图书数据的时候

sql 复制代码

select a.id aid,a.name aname,author,a.num anum,price, b.name bname,type_id 
from t_book a 
LEFT JOIN 
  t_book_type b 
ON 
  a.type_id = b.id

记得要查询type_id来默认显示当前的图书类型在修改菜单的下拉框内

因为更改了别名所以要更换resultMap的内容

XML 复制代码

<resultMap type="Book" id="BookResult">
<!--              对象              数据库-->
        <result property="id"    column="aid"    />
        <result property="name"    column="aname"    />
        <result property="author"    column="author"    />
        <result property="num"    column="anum"    />
        <result property="price"    column="price"    />
        <result property="typeId"    column="type_id"    />
        <result property="bookType.name"    column="bname"    />
        <result property="bookType.id"    column="type_id"    />
</resultMap>

因为改了别名，所以对应的要修改查询中其它字段的名字

10.增和改要添加关于type_id的内容