✨ 为角色分配权限

spring-security/step-2/src/main/java/com/spring/step2/controller/PermissionController.java

@@ -1,7 +1,7 @@
 package com.spring.step2.controller;
 
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
-import com.spring.step2.domain.dto.PermissionDto;
+import com.spring.step2.domain.dto.permission.PermissionDto;
 import com.spring.step2.domain.entity.PermissionEntity;
 import com.spring.step2.domain.vo.PermissionVo;
 import com.spring.step2.domain.vo.result.PageResult;
@@ -46,6 +46,13 @@ public class PermissionController {
         return Result.success(pageResult);
     }
 
+    @Operation(summary = "所有的权限列表", description = "获取所有的权限列表")
+    @GetMapping("all")
+    public Result<List<PermissionVo>> getAllPermission() {
+        List<PermissionVo> voList = permissionService.getAllPermission();
+        return Result.success(voList);
+    }
+
     @Operation(summary = "添加系统权限表", description = "添加系统权限表")
     @PostMapping()
     public Result<String> addPermission(@Valid @RequestBody PermissionDto dto) {

spring-security/step-2/src/main/java/com/spring/step2/controller/RoleController.java

@@ -1,7 +1,7 @@
 package com.spring.step2.controller;
 
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
-import com.spring.step2.domain.dto.RoleDto;
+import com.spring.step2.domain.dto.role.RoleDto;
 import com.spring.step2.domain.entity.RoleEntity;
 import com.spring.step2.domain.vo.RoleVo;
 import com.spring.step2.domain.vo.result.PageResult;

spring-security/step-2/src/main/java/com/spring/step2/controller/RolePermissionController.java

@@ -1,7 +1,8 @@
 package com.spring.step2.controller;
 
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
-import com.spring.step2.domain.dto.RolePermissionDto;
+import com.spring.step2.domain.dto.role.AssignRolePermissionDto;
+import com.spring.step2.domain.dto.role.RolePermissionDto;
 import com.spring.step2.domain.entity.RolePermissionEntity;
 import com.spring.step2.domain.vo.RolePermissionVo;
 import com.spring.step2.domain.vo.result.PageResult;
@@ -46,6 +47,13 @@ public class RolePermissionController {
         return Result.success(pageResult);
     }
 
+    @GetMapping("permissions")
+    @Operation(summary = "根据角色id获取权限内容", description = "根据角色id获取权限内容")
+    public Result<List<RolePermissionVo>> getRolePermissionById(Long permissionId) {
+        List<RolePermissionVo> voList = rolePermissionService.getRolePermissionById(permissionId);
+        return Result.success(voList);
+    }
+
     @Operation(summary = "添加角色权限关联表", description = "添加角色权限关联表")
     @PostMapping()
     public Result<String> addRolePermission(@Valid @RequestBody RolePermissionDto dto) {
@@ -53,6 +61,13 @@ public class RolePermissionController {
         return Result.success(ResultCodeEnum.ADD_SUCCESS);
     }
 
+    @Operation(summary = "为角色分配权限", description = "根据角色id分配权限")
+    @PostMapping("assign-permission")
+    public Result<String> assignRolePermission(@Valid @RequestBody AssignRolePermissionDto dto) {
+        rolePermissionService.assignRolePermission(dto);
+        return Result.success();
+    }
+
     @Operation(summary = "更新角色权限关联表", description = "更新角色权限关联表")
     @PutMapping()
     public Result<String> updateRolePermission(@Valid @RequestBody RolePermissionDto dto) {

spring-security/step-2/src/main/java/com/spring/step2/controller/UserRoleController.java

@@ -66,7 +66,7 @@ public class UserRoleController {
     @PostMapping("assign-role")
     public Result<String> assignUserRole(@Valid @RequestBody AssignUserRoleDto dto) {
         userRoleService.assignUserRole(dto);
-        return Result.success(ResultCodeEnum.SUCCESS);
+        return Result.success();
     }
 
     @Operation(summary = "更新用户角色关联表", description = "更新用户角色关联表")

spring-security/step-2/src/main/java/com/spring/step2/domain/dto/permission/PermissionDto.java

@@ -1,4 +1,4 @@
-package com.spring.step2.domain.dto;
+package com.spring.step2.domain.dto.permission;
 
 import io.swagger.v3.oas.annotations.media.Schema;
 import lombok.AllArgsConstructor;

spring-security/step-2/src/main/java/com/spring/step2/domain/dto/role/AssignRolePermissionDto.java

@@ -0,0 +1,28 @@
+package com.spring.step2.domain.dto.role;
+
+import io.swagger.v3.oas.annotations.media.Schema;
+import jakarta.validation.constraints.NotEmpty;
+import jakarta.validation.constraints.NotNull;
+import lombok.AllArgsConstructor;
+import lombok.Builder;
+import lombok.Data;
+import lombok.NoArgsConstructor;
+
+import java.util.List;
+
+@Data
+@AllArgsConstructor
+@NoArgsConstructor
+@Builder
+@Schema(name = "AssignRolePermissionDTO对象", title = "角色分配权限DTO", description = "根据角色id分配权限")
+public class AssignRolePermissionDto {
+
+    @Schema(name = "roleId", title = "角色ID")
+    @NotNull(message = "角色id为空")
+    private Long roleId;
+
+    @Schema(name = "permissionId", title = "权限ID")
+    @NotEmpty(message = "权限id为空")
+    private List<Long> permissionIds;
+
+}

spring-security/step-2/src/main/java/com/spring/step2/domain/dto/role/RoleDto.java

@@ -1,4 +1,4 @@
-package com.spring.step2.domain.dto;
+package com.spring.step2.domain.dto.role;
 
 import io.swagger.v3.oas.annotations.media.Schema;
 import jakarta.validation.constraints.NotBlank;

spring-security/step-2/src/main/java/com/spring/step2/domain/dto/role/RolePermissionDto.java

@@ -1,4 +1,4 @@
-package com.spring.step2.domain.dto;
+package com.spring.step2.domain.dto.role;
 
 import io.swagger.v3.oas.annotations.media.Schema;
 import lombok.AllArgsConstructor;
@@ -6,8 +6,6 @@ import lombok.Builder;
 import lombok.Data;
 import lombok.NoArgsConstructor;
 
-import java.time.LocalDateTime;
-
 @Data
 @AllArgsConstructor
 @NoArgsConstructor
@@ -24,19 +22,4 @@ public class RolePermissionDto {
     @Schema(name = "permissionId", title = "权限ID")
     private Long permissionId;
 
-    @Schema(name = "createTime", title = "创建时间")
-    private LocalDateTime createTime;
-
-    @Schema(name = "updateTime", title = "更新时间")
-    private LocalDateTime updateTime;
-
-    @Schema(name = "createUser", title = "创建用户ID")
-    private Long createUser;
-
-    @Schema(name = "updateUser", title = "更新用户ID")
-    private Long updateUser;
-
-    @Schema(name = "isDeleted", title = "是否删除：0-未删除，1-已删除")
-    private Boolean isDeleted;
-
 }

spring-security/step-2/src/main/java/com/spring/step2/mapper/PermissionMapper.java

@@ -4,7 +4,7 @@ package com.spring.step2.mapper;
 import com.baomidou.mybatisplus.core.mapper.BaseMapper;
 import com.baomidou.mybatisplus.core.metadata.IPage;
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
-import com.spring.step2.domain.dto.PermissionDto;
+import com.spring.step2.domain.dto.permission.PermissionDto;
 import com.spring.step2.domain.entity.PermissionEntity;
 import com.spring.step2.domain.vo.PermissionVo;
 import org.apache.ibatis.annotations.Mapper;

spring-security/step-2/src/main/java/com/spring/step2/mapper/RoleMapper.java

@@ -4,7 +4,7 @@ package com.spring.step2.mapper;
 import com.baomidou.mybatisplus.core.mapper.BaseMapper;
 import com.baomidou.mybatisplus.core.metadata.IPage;
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
-import com.spring.step2.domain.dto.RoleDto;
+import com.spring.step2.domain.dto.role.RoleDto;
 import com.spring.step2.domain.entity.RoleEntity;
 import com.spring.step2.domain.vo.RoleVo;
 import org.apache.ibatis.annotations.Mapper;

spring-security/step-2/src/main/java/com/spring/step2/mapper/RolePermissionMapper.java

@@ -4,12 +4,14 @@ package com.spring.step2.mapper;
 import com.baomidou.mybatisplus.core.mapper.BaseMapper;
 import com.baomidou.mybatisplus.core.metadata.IPage;
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
-import com.spring.step2.domain.dto.RolePermissionDto;
+import com.spring.step2.domain.dto.role.RolePermissionDto;
 import com.spring.step2.domain.entity.RolePermissionEntity;
 import com.spring.step2.domain.vo.RolePermissionVo;
 import org.apache.ibatis.annotations.Mapper;
 import org.apache.ibatis.annotations.Param;
 
+import java.util.List;
+
 /**
  * <p>
  * 角色权限关联表 Mapper 接口
@@ -30,4 +32,18 @@ public interface RolePermissionMapper extends BaseMapper<RolePermissionEntity> {
      */
     IPage<RolePermissionVo> selectListByPage(@Param("page") Page<RolePermissionEntity> pageParams, @Param("dto") RolePermissionDto dto);
 
+    /**
+     * 根据角色id获取权限内容
+     *
+     * @param permissionId 权限id
+     * @return 角色权限列表
+     */
+    List<RolePermissionEntity> selectListByPermissionId(Long permissionId);
+
+    /**
+     * 先删除当前已经分配的角色权限内容
+     *
+     * @param roleId 角色id
+     */
+    void deleteByRoleId(Long roleId);
 }

spring-security/step-2/src/main/java/com/spring/step2/mapper/UserRoleMapper.java

@@ -3,7 +3,6 @@ package com.spring.step2.mapper;
 import com.baomidou.mybatisplus.core.mapper.BaseMapper;
 import com.baomidou.mybatisplus.core.metadata.IPage;
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
-import com.spring.step2.domain.dto.user.AssignUserRoleDto;
 import com.spring.step2.domain.dto.user.UserRoleDto;
 import com.spring.step2.domain.entity.UserRoleEntity;
 import com.spring.step2.domain.vo.UserRoleVo;
@@ -43,8 +42,8 @@ public interface UserRoleMapper extends BaseMapper<UserRoleEntity> {
     /**
      * 根据用户id删除用户相关分配角色
      *
-     * @param dto 用户分配角色DTO {@link AssignUserRoleDto}
+     * @param userId 用户id
      */
-    void deleteByUserId(AssignUserRoleDto dto);
+    void deleteByUserId(Long userId);
 
 }

spring-security/step-2/src/main/java/com/spring/step2/service/PermissionService.java

@@ -2,7 +2,7 @@ package com.spring.step2.service;
 
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
 import com.baomidou.mybatisplus.extension.service.IService;
-import com.spring.step2.domain.dto.PermissionDto;
+import com.spring.step2.domain.dto.permission.PermissionDto;
 import com.spring.step2.domain.entity.PermissionEntity;
 import com.spring.step2.domain.vo.PermissionVo;
 import com.spring.step2.domain.vo.result.PageResult;
@@ -46,4 +46,12 @@ public interface PermissionService extends IService<PermissionEntity> {
      * @param ids 删除id列表
      */
     void deletePermission(List<Long> ids);
+
+    /**
+     * 获取所有的权限列表
+     *
+     * @return 所有权限列表
+     */
+    List<PermissionVo> getAllPermission();
+
 }

spring-security/step-2/src/main/java/com/spring/step2/service/RolePermissionService.java

@@ -2,10 +2,12 @@ package com.spring.step2.service;
 
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
 import com.baomidou.mybatisplus.extension.service.IService;
-import com.spring.step2.domain.dto.RolePermissionDto;
+import com.spring.step2.domain.dto.role.AssignRolePermissionDto;
+import com.spring.step2.domain.dto.role.RolePermissionDto;
 import com.spring.step2.domain.entity.RolePermissionEntity;
 import com.spring.step2.domain.vo.RolePermissionVo;
 import com.spring.step2.domain.vo.result.PageResult;
+import jakarta.validation.Valid;
 
 import java.util.List;
 
@@ -46,4 +48,19 @@ public interface RolePermissionService extends IService<RolePermissionEntity> {
      * @param ids 删除id列表
      */
     void deleteRolePermission(List<Long> ids);
+
+    /**
+     * 根据角色id获取权限内容
+     *
+     * @param permissionId 权限id
+     * @return 角色权限列表
+     */
+    List<RolePermissionVo> getRolePermissionById(Long permissionId);
+
+    /**
+     * 根据角色id分配权限
+     *
+     * @param dto 为角色分配权限 {@link AssignRolePermissionDto}
+     */
+    void assignRolePermission(@Valid AssignRolePermissionDto dto);
 }

spring-security/step-2/src/main/java/com/spring/step2/service/RoleService.java

@@ -2,7 +2,7 @@ package com.spring.step2.service;
 
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
 import com.baomidou.mybatisplus.extension.service.IService;
-import com.spring.step2.domain.dto.RoleDto;
+import com.spring.step2.domain.dto.role.RoleDto;
 import com.spring.step2.domain.entity.RoleEntity;
 import com.spring.step2.domain.vo.RoleVo;
 import com.spring.step2.domain.vo.result.PageResult;

spring-security/step-2/src/main/java/com/spring/step2/service/impl/PermissionServiceImpl.java

@@ -4,7 +4,7 @@ import com.baomidou.dynamic.datasource.annotation.DS;
 import com.baomidou.mybatisplus.core.metadata.IPage;
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
 import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
-import com.spring.step2.domain.dto.PermissionDto;
+import com.spring.step2.domain.dto.permission.PermissionDto;
 import com.spring.step2.domain.entity.PermissionEntity;
 import com.spring.step2.domain.vo.PermissionVo;
 import com.spring.step2.domain.vo.result.PageResult;
@@ -84,4 +84,18 @@ public class PermissionServiceImpl extends ServiceImpl<PermissionMapper, Permiss
     public void deletePermission(List<Long> ids) {
         removeByIds(ids);
     }
+
+    /**
+     * 获取所有的权限列表
+     *
+     * @return 所有权限列表
+     */
+    @Override
+    public List<PermissionVo> getAllPermission() {
+        return list().stream().map(permissionEntity -> {
+            PermissionVo permissionVo = new PermissionVo();
+            BeanUtils.copyProperties(permissionEntity, permissionVo);
+            return permissionVo;
+        }).toList();
+    }
 }

spring-security/step-2/src/main/java/com/spring/step2/service/impl/RolePermissionServiceImpl.java

@@ -4,7 +4,8 @@ import com.baomidou.dynamic.datasource.annotation.DS;
 import com.baomidou.mybatisplus.core.metadata.IPage;
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
 import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
-import com.spring.step2.domain.dto.RolePermissionDto;
+import com.spring.step2.domain.dto.role.AssignRolePermissionDto;
+import com.spring.step2.domain.dto.role.RolePermissionDto;
 import com.spring.step2.domain.entity.RolePermissionEntity;
 import com.spring.step2.domain.vo.RolePermissionVo;
 import com.spring.step2.domain.vo.result.PageResult;
@@ -84,4 +85,44 @@ public class RolePermissionServiceImpl extends ServiceImpl<RolePermissionMapper,
     public void deleteRolePermission(List<Long> ids) {
         removeByIds(ids);
     }
+
+    /**
+     * 根据角色id获取权限内容
+     *
+     * @param permissionId 权限id
+     * @return 角色权限列表
+     */
+    @Override
+    public List<RolePermissionVo> getRolePermissionById(Long permissionId) {
+        List<RolePermissionEntity> list = baseMapper.selectListByPermissionId(permissionId);
+
+        return list.stream().map(rolePermissionEntity -> {
+            RolePermissionVo rolePermissionVo = new RolePermissionVo();
+            BeanUtils.copyProperties(rolePermissionEntity, rolePermissionVo);
+            return rolePermissionVo;
+        }).toList();
+    }
+
+    /**
+     * 根据角色id分配权限
+     *
+     * @param dto 为角色分配权限 {@link AssignRolePermissionDto}
+     */
+    @Override
+    public void assignRolePermission(AssignRolePermissionDto dto) {
+        Long roleId = dto.getRoleId();
+        List<Long> permissionIds = dto.getPermissionIds();
+
+        // 先删除当前已经分配的角色权限内容
+        baseMapper.deleteByRoleId(roleId);
+
+        List<RolePermissionEntity> rolePermissionEntityList = permissionIds.stream().map(permissionId -> {
+            RolePermissionEntity rolePermissionEntity = new RolePermissionEntity();
+            rolePermissionEntity.setRoleId(roleId);
+            rolePermissionEntity.setPermissionId(permissionId);
+            return rolePermissionEntity;
+        }).toList();
+
+        saveBatch(rolePermissionEntityList);
+    }
 }

spring-security/step-2/src/main/java/com/spring/step2/service/impl/RoleServiceImpl.java

@@ -4,7 +4,7 @@ import com.baomidou.dynamic.datasource.annotation.DS;
 import com.baomidou.mybatisplus.core.metadata.IPage;
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
 import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
-import com.spring.step2.domain.dto.RoleDto;
+import com.spring.step2.domain.dto.role.RoleDto;
 import com.spring.step2.domain.entity.RoleEntity;
 import com.spring.step2.domain.vo.RoleVo;
 import com.spring.step2.domain.vo.result.PageResult;

spring-security/step-2/src/main/java/com/spring/step2/service/impl/UserRoleServiceImpl.java

@@ -112,9 +112,9 @@ public class UserRoleServiceImpl extends ServiceImpl<UserRoleMapper, UserRoleEnt
     public void assignUserRole(AssignUserRoleDto dto) {
         Long userId = dto.getUserId();
         List<Long> roleIds = dto.getRoleIds();
-        
+
         // 先删除已经分配的角色
-        baseMapper.deleteByUserId(dto);
+        baseMapper.deleteByUserId(userId);
 
         // 为用户分配角色
         List<UserRoleEntity> entityList = roleIds.stream().map(roleId -> {

spring-security/step-2/src/main/resources/mapper/RolePermissionMapper.xml

@@ -19,6 +19,13 @@
         id,role_id,permission_id,create_time,update_time,create_user,update_user,is_deleted
     </sql>
 
+    <!-- 先删除当前已经分配的角色权限内容 -->
+    <delete id="deleteByRoleId">
+        delete
+        from t_role_permission
+        where role_id = #{roleId}
+    </delete>
+
     <!-- 分页查询角色权限关联表内容 -->
     <select id="selectListByPage" resultType="com.spring.step2.domain.vo.RolePermissionVo">
         select
@@ -29,4 +36,15 @@
         </where>
     </select>
 
+    <!-- 根据角色id获取权限内容 -->
+    <select id="selectListByPermissionId" resultType="com.spring.step2.domain.entity.RolePermissionEntity">
+        select *
+        from t_role_permission
+        <where>
+            <if test="permissionId != null">
+                permission_id = #{permissionId}
+            </if>
+        </where>
+    </select>
+
 </mapper>

spring-security/step-2/src/main/resources/static/src/views/role/AssignPermission.js

@@ -0,0 +1,94 @@
+const AssignPermission = defineComponent({
+    name: "AssignPermission",
+    template: `
+        <div class="offcanvas offcanvas-start" data-bs-scroll="true" id="assignPermissionOffCanvas" 
+            aria-labelledby="assignPermissionOffCanvasLabel" ref="assignPermissionOffCanvasRef">
+          <div class="offcanvas-header">
+            <h5 class="offcanvas-title" id="assignPermissionOffCanvasLabel">
+                为角色分配权限
+                <a href="JavaScript:" class="icon-link icon-link-hover text-decoration-none" @click="onSave">
+                    <i class="fas fa-save"></i>
+                    保存
+                </a>                
+            </h5>
+            <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
+          </div>
+          <div class="offcanvas-body">
+            <div class="form-check" v-for="(permission,index) in permissionList" :key="permission.id">
+              <input class="form-check-input" type="checkbox" v-model="permission.checked" :id="permission.permissionCode">
+              <label class="form-check-label" :for="permission.permissionCode">
+                {{permission.remark}}
+              </label> 
+            </div>
+          </div>
+        </div>
+    `,
+    props: {
+        roleInfo: {type: Object, required: true},
+    },
+    data() {
+        return {
+            // 所有的权限列表
+            permissionList: ref([]),
+            // 角色权限列表
+            rolePermissionIds: ref([]),
+            modalInstance: ref(null)
+        };
+    },
+    methods: {
+        /* 获取权限列表 */
+        async getPermissionList() {
+            const {data} = await axiosInstance.get("/permission/all");
+            this.permissionList = data;
+        },
+
+        /* 保存分配角色权限 */
+        async onSave() {
+            // 过滤出已经被选择的权限
+            const checkedPermissionList = this.permissionList
+                .filter(role => role.checked)
+                .map(role => role.id);
+
+            // 分配的数据内容
+            const data = {
+                roleId: this.roleInfo.id,
+                permissionIds: checkedPermissionList,
+            }
+
+            // 为角色分配权限
+            const {code, message} = await axiosInstance.post("/role-permission/assign-permission", data)
+            if (code === 200) {
+                this.modalInstance.hide();
+                this.rolePermissionIds = [];
+                antd.message.success(message);
+            }
+        },
+    },
+    watch: {
+        /* 监视角色信息 */
+        async roleInfo(value) {
+            const {id} = value;
+            // 如果没有id直接返回
+            if (!id) return;
+            
+            // 获取权限列表
+            await this.getPermissionList();
+
+            // 获取角色拥有的权限
+            const {data} = await axiosInstance.get("/role-permission/permissions", {params: {userId: id}});
+            // 提取角色拥有的权限ID数组
+            const rolePermissionIds = data.map(permission => permission.permissionId + "");
+
+            // 遍历所有权限，检查角色是否拥有该权限
+            this.permissionList.forEach(role => {
+                const hasRole = rolePermissionIds.includes(role.id);
+                if (hasRole) role.checked = true;
+            })
+        }
+    },
+    mounted() {
+        // 初始化模态框实例
+        const modalEl = this.$refs.assignPermissionOffCanvasRef;
+        this.modalInstance = new bootstrap.Offcanvas(modalEl);
+    }
+});

spring-security/step-2/src/main/resources/static/src/views/user/AssignRoles.js

@@ -70,7 +70,7 @@ const AssignRoles = defineComponent({
             const {id} = value;
             // 如果没有id直接返回
             if (!id) return;
-            console.log(id)
+
             // 获取角色列表
             await this.getRoleList();
 

spring-security/step-2/src/main/resources/templates/rolePage.html

@@ -36,6 +36,10 @@
     <dialog-role :is-add="isAdd" :on-search="onSearch" :role-info="roleInfo"></dialog-role>
 
     <header-navs></header-navs>
+
+    <!-- 分配权限 -->
+    <assign-permission :role-info="roleInfo"></assign-permission>
+
     <!-- 头部 -->
     <div class="card">
         <div class="card-header d-flex justify-content-between align-items-center">
@@ -110,6 +114,10 @@
                                         data-bs-target="#roleBackdrop" data-bs-toggle="modal">
                                     <i class="fas fa-edit"></i> 修改
                                 </button>
+                                <button @click="onAssignPermission(role)" class="btn btn-outline-primary btn-action"
+                                        data-bs-target="#assignPermissionOffCanvas" data-bs-toggle="offcanvas">
+                                    <i class="fas fa-cloud"></i> 分配权限
+                                </button>
                                 <button @click="onDeleted(role)" class="btn btn-outline-danger btn-action">
                                     <i class="fas fa-trash"></i> 删除
                                 </button>
@@ -137,6 +145,8 @@
 <script th:src="@{/src/components/Pagination.js}"></script>
 <!-- 角色表单 -->
 <script th:src="@{/src/views/role/DialogRole.js}"></script>
+<!-- 角色分配权限 -->
+<script th:src="@{/src/views/role/AssignPermission.js}"></script>
 <script>
     const {createApp, ref, toRaw} = Vue;
 
@@ -202,6 +212,11 @@
                 this.roleInfo = roleInfo;
             },
 
+            /* 分配权限 */
+            onAssignPermission(roleInfo) {
+                this.roleInfo = roleInfo;
+            },
+
             /* 删除 */
             async onDeleted(roleInfo) {
                 const result = confirm("确认删除？");
@@ -225,6 +240,7 @@
     app.component('HeaderNavs', HeaderNavs);
     app.component('Pagination', Pagination);
     app.component('DialogRole', DialogRole);
+    app.component('AssignPermission', AssignPermission);
     app.mount('#app');
 </script>
 </html>