亿级高并发电商项目-- 实战篇 --万达商城项目 五 (用户服务模块、管理员模块功能 增、删、改、查 、分页，前端工程)

 专栏：高并发项目---前后端分布式

👏作者简介：大家好，我是小童，Java开发工程师，CSDN博客博主，Java领域新星创作者
📕系列专栏：前端、Java、Java中间件大全、微信小程序、微信支付、若依框架、Spring全家桶
📧如果文章知识点有错误的地方，请指正！和大家一起学习，一起进步👀
🔥如果感觉博主的文章还不错的话，请👍三连支持👍一下博主哦
🍂博主正在努力完成2023计划中：以梦为马，扬帆起航，2023追梦人 

创建后台用户服务模块 

后台用户也称为管理员，每个管理员能在后台进行的操作不同，所以不同的管理员有不同的权限。在项目中，权限表的设计为 用户—角色 多对多， 角色—权限 多对多，既一个用户有多个角色，一个角色有多个权限。所以网站后台首先要拥有用户管理、角色管理、权限管理的 功能。 后台用户服务模块提供了以上服务。

1、创建名为 shopping_admin_service 的SpringBoot工程，添加相关依赖。

<dependencies>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-bootstarter</artifactId>
    </dependency>
    <!-- MyBatisPlus -->
    <dependency>
        <groupId>com.baomidou</groupId>
        <artifactId>mybatis-plus-bootstarter</artifactId>
        <version>3.5.0</version>
    </dependency>
    <!-- mysql驱动 -->
    <dependency>
        <groupId>mysql</groupId>
        <artifactId>mysql-connectorjava</artifactId>
        <scope>runtime</scope>
        </dependency>
    <dependency>
        <groupId>com.itbaizhan</groupId>
        <artifactId>shopping_common</artifactId>
        <version>0.0.1-SNAPSHOT</version>
    </dependency>
    <!-- dubbo -->
    <dependency>
        <groupId>org.apache.dubbo</groupId>
        <artifactId>dubbo-spring-bootstarter</artifactId>
        <version>2.7.8</version>
    </dependency>
    <!-- 操作zookeeper -->
    <dependency>
        <groupId>org.apache.curator</groupId>
        <artifactId>curatorrecipes</artifactId>
        <version>4.2.0</version>
    </dependency>
    <dependency>
       <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-startertest</artifactId>
        <scope>test</scope>
    </dependency>
</dependencies>

 2、设置该工程的父工程为 shopping 。

<parent>
    <groupId>com.ittxc</groupId>
    <artifactId>shopping</artifactId>
    <version>1.0-SNAPSHOT</version>
</parent>

3、给 shopping 工程设置子模块

<!-- 子模块 -->
<modules>
    <!-- 管理员服务 -->
    <module>shopping_admin_service</module>
</modules>

4、编写配置文件 application.yml

# 端口号
server:
 port: 9002
# 日志格式
logging:
 pattern:
   console: '%d{HH:mm:ss.SSS} %clr(%-5level) --- [%-15thread] %cyan(%-50logger{50}):%msg%n'
#配置mybatis-plus
mybatis-plus:
 global-config:
   db-config:
      # 表名前缀
      table-prefix: bz_
      # 主键生成策略为自增
     id-type: auto
 configuration:
    # 关闭列名自动驼峰命名规则映射
   map-underscore-to-camel-case: false
   log-impl:
org.apache.ibatis.logging.stdout.StdOutImp
l #开启sql日志
spring:
  # 数据源
 datasource:
   driver-class-name: com.mysql.cj.jdbc.Driver
   url: jdbc:mysql:///baizhanshopping?serverTimezone=UTC
   username: root
   password01: 123456
dubbo:
 application:
   name: shopping_admin_service # 项目名
 registry:
   address: zookeeper://192.168.25.100 #注册中心地址
   port: 2181       # 注册中心的端口
   timeout: 10000 # 注册到zk上超时时间，ms
 protocol:
   name: dubbo # dubbo使用的协议
   port: -1 # dubbo自动分配端口
 scan:
   base-packages: com.itbaizhan.shopping_admin_service.service # 包扫描

5、创建管理员Mapper接口

public interface AdminMapper extends BaseMapper<Admin> {
    
}

 6、配置启动类扫描 MyBatis-Plus 接口

@SpringBootApplication
@MapperScan("com.itbaizhan.shopping_admin_service.mapper")
public class ShoppingAdminServiceApplication {
    public static void main(String[] args)
      {
         SpringApplication.run(ShoppingAdminServiceApplication.class, args);
   }  
}

 新增管理员

1、在通用模块添加管理员服务接口

// 管理员服务
public interface AdminService {
    // 新增管理员
    void add(Admin admin);
    // 修改管理员
    void update(Admin admin);
    // 删除管理员
    void delete(Long id);
    // 根据id查询管理员
    Admin findById(Long id);
    // 分页查询管理员
    Page<Admin> search(int page, int size);
    // 修改管理员角色
    void updateRoleToAdmin(Long aid,Long[] rids);
}

2、在管理员服务模块创建管理员服务接口实现类

@DubboService
public class AdminServiceImpl implements AdminService {
    @Autowired
    private AdminMapper adminMapper;
    @Override
    public void add(Admin admin) {
        adminMapper.insert(admin);
   }
}

3、在后台管理Api模块创建管理员控制器

/**
* 后台管理员
*/
@RestController
@RequestMapping("/admin")
public class AdminController {
    @DubboReference
    private AdminService adminService;
    
    /**
     * 新增管理员
     *
     * @param admin 管理员对象
     * @return 执行结果
     */
    @PostMapping("/add")
    public BaseResult add(@RequestBody Admin admin) {
        adminService.add(admin);
        return BaseResult.ok();
   }
}

4、测试接口

修改管理员

1、在管理员服务接口实现类重写修改方法

@Override
public void update(Admin admin) {
    adminMapper.updateById(admin);
}

2、在管理员控制器添加修改方法

/**
  * 修改管理员
  *
  * @param admin 管理员对象
  * @return 执行结果
  */
@PutMapping("/update")
public BaseResult update(@RequestBody Admin admin) {
    adminService.update(admin);
    return BaseResult.ok();
}

3、测试接口

删除管理员

删除管理员时，需要从 bz_admin_role 表中删除管理员对应的角色，所以需要在Mapper中新增删除管理员角色方法：

1、编写管理员Mapper接口

public interface AdminMapper extends BaseMapper<Admin> {
    // 删除管理员的所有角色
    void deleteAdminAllRole(Long aid);
}

2、在 resources 中创建 AdminMapper 的同级包，编写映射文件 AdminMapper.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper
        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.ittxc.shopping_admin_service.mapper.AdminMapper">
    <delete id="deleteAdminAllRole" parameterType="long">
       DELETE
       FROM bz_admin_role
       WHERE aid = #{aid}
    </delete>
</mapper>

 3、编写管理员服务接口实现类

@DubboService
public class AdminServiceImpl implements AdminService {
    @Autowired
    private AdminMapper adminMapper;
    @Override
    public void delete(Long id) {
        // 删除用户的所有角色
        adminMapper.deleteAdminAllRole(id);
        // 删除用户
        adminMapper.deleteById(id);
   }
}

4、编写管理员控制器

/**
* 后台管理员
*/
@RestController
@RequestMapping("/admin")
public class AdminController {
    @DubboReference
    private AdminService adminService;
    
    /**
     * 删除管理员
     *
     * @param aid 管理员id
     * @return 执行结果
     */
      @DeleteMapping("/delete")
      public BaseResult delete(Long aid) {
        adminService.delete(aid);
        return BaseResult.ok();
   }
}

5、测试接口

根据id查询管理员

查询某个管理员时，需要查询管理员对应的角色、权限，方便前端展示，需要自定义多表查询管理员对应的角色、权限方法：

1、编写管理员Mapper接口 

public interface AdminMapper extends BaseMapper<Admin> {
    // 根据id查询管理员，包括角色和权限
    Admin findById(Long id);
}

2、编写映射文件 AdminMapper.xml

<resultMap id="adminMapper" type="com.itbaizhan.shopping_pojo.pojo.Admin">
    <id property="aid" column="aid"></id>
    <result property="username" column="username"></result>
    <collection property="roles" column="aid" ofType="com.itbaizhan.shopping_pojo.pojo.Role">

   <id property="rid" column="rid"></id>
        <result property="roleName" column="roleName"></result>
        <result property="roleDesc" column="roleDesc"></result>
        <collection property="permissions" column="rid" ofType="com.itbaizhan.shopping_pojo.pojo.Permission">
            <id property="pid" column="pid"></id>
            <result property="permissionName" column="permissionName"></result>
            <result property="url" column="url"></result>
        </collection>
    </collection>
</resultMap>
<select id="findById" parameterType="long"
resultMap="adminMapper">
   SELECT *
   FROM bz_admin
   LEFT JOIN bz_admin_role
   ON bz_admin.aid = bz_admin_role.aid
   LEFT JOIN bz_role
   ON bz_admin_role.rid = bz_role.rid
   LEFT JOIN bz_role_permission
   ON bz_role.rid =
bz_role_permission.rid
 LEFT JOIN bz_permission
   ON bz_role_permission.pid =
bz_permission.pid
   WHERE bz_admin.aid = #{aid}
</select>

3、编写管理员服务接口实现类

@DubboService
public class AdminServiceImpl implements AdminService {
    @Autowired
    private AdminMapper adminMapper;
    @Override
    public Admin findById(Long id) {
        return adminMapper.findById(id);
   }
}

4、编写管理员控制器

/**
* 后台管理员
*/
@RestController
@RequestMapping("/admin")
public class AdminController {
    @DubboReference
    private AdminService adminService;
    
    /**
     * 根据id查询管理员
     *
     * @param aid
     * @return 查询到的管理员
     */
    @GetMapping("/findById")
    public BaseResult<Admin> findById(Long aid) {
        Admin admin = adminService.findById(aid);
        return BaseResult.ok(admin);
   }
}

5、测试接口

分页查询管理员

1、在管理员服务模块启动类配置 MyBatis-Plus 分页插件

@SpringBootApplication
@MapperScan("com.itbaizhan.shopping_admin_service.mapper")
public class ShoppingAdminServiceApplication {
    public static void main(String[] args)
      {
       SpringApplication.run(ShoppingAdminServic eApplication.class, args);
      }
    // 分页插件
    @Bean
     public MybatisPlusInterceptor mybatisPlusInterceptor() {
        MybatisPlusInterceptor interceptor = new MybatisPlusInterceptor();
        interceptor.addInnerInterceptor(new PaginationInnerInterceptor(DbType.MYSQL));
        return interceptor;
   }
}

 2、编写管理员服务接口实现类

@DubboService
public class AdminServiceImpl implements AdminService {
    @Autowired
    private AdminMapper adminMapper;
    @Override
    public Page<Admin> search(int page, int size) {
        return adminMapper.selectPage(new Page(page,size),null);
   }
}

3、编写管理员控制器

/**
* 后台管理员
*/
@RestController
@RequestMapping("/admin")
public class AdminController {
    @DubboReference
    private AdminService adminService;
    
    /**
     * 分页查询管理员
     *
     * @param page 页码
     * @param size 每页条数
     * @return 查询结果
     */
    @GetMapping("/search")
    public BaseResult<Page<Admin>> search(int page, int size) {
        Page<Admin> adminPage = adminService.search(page, size);
        return BaseResult.ok(adminPage);
   }
}

4、测试接口

修改管理员角色

管理员可以对其角色进行修改，即修改 bz_admin_role 表中的记录。修改管理员角色时，先将管理员的所有角色删除，再将其新角色添加到 bz_admin_role 表中。

1、编写管理员Mapper接口 

public interface AdminMapper extends BaseMapper<Admin> {
    // 给管理员添加角色
    void addRoleToAdmin(@Param("aid") Long aid, @Param("rid") Long rid);
}

2、编写映射文件

<insert id="addRoleToAdmin">
   INSERT INTO bz_admin_role VALUES(#{aid},#{rid});
</insert>

3、编写管理员服务接口实现类

@DubboService
public class AdminServiceImpl implements AdminService {
    @Autowired
    private AdminMapper adminMapper;
    @Override
    public void updateRoleToAdmin(Long aid, Long[] rids) {
        // 删除用户的所有角色
        adminMapper.deleteAdminAllRole(aid);
        // 重新添加管理员角色
        for (Long rid : rids) {
           adminMapper.addRoleToAdmin(aid, rid);
       }
   }
}

4、编写管理员控制器

/**
* 后台管理员
*/
@RestController
@RequestMapping("/admin")
public class AdminController {
    @DubboReference
    private AdminService adminService;
    
     /**
     * 修改管理员角色
     *
     * @param aid 管理员id
     * @param rids 角色id
     * @return 执行结果
     */
    @PutMapping("/updateRoleToAdmin")
    public BaseResult updateRoleToAdmin(Long aid, Long[] rids) {
        adminService.updateRoleToAdmin(aid,rids);
        return BaseResult.ok();
   }
}

5、测试接口

连接前端工程进行测试

在前后端分离项目中，作为后端开发者，一般接口测试成功后即可认为开发完成。之后将开发好的接口告知前端开发者，前端开发者即可访问接口，获取数据，完成展示。此处我们使用已经开发好的 前端工程，展示项目功能。

1、修改前端项目，将配置文件 vue.config.js 中后端项目的路径改为管理员API模块的路径 

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  // 保存文件的时候不进行eslink检查
  lintOnSave: false,
  // 开发环境
  devServer: {
    // 代理服务器，也就是后端项目的路径
    proxy: {
      '/': {
        target: 'http://localhost:8001',
        changeOrigin: true,  
        // pathRewrite: {
        //   '^/api': ''  
        // }
     },
   }
 }
})

 2、修改前端项目， /src/utils/axios.js ，注释掉项目的登录认证

import axios from 'axios'
import { ElMessage } from 'element-plus'
import router  from '@/router'
// 响应拦截器
axios.interceptors.response.use(res => {
    const { data = {}, status } = res
    if (status == 200) {
        if (data.code != 200) {
            ElMessage.error(data.message)
            // if (data.code == 401) {
            //   router.push('/login')
            //   return
            // }
            return Promise.reject(data)
       }
        return data.data
   } else {
        const { status, statusText } = res
        ElMessage.error(status + statusText)
        return Promise.reject(res)
   }
})
export default axios

3 安装nodeJS

4 在前端项目解压路径安装yarn

 npm install -g yarn

5 使用yarn下载前端项目依赖

yarn install

 6 使用yarn运行前端项目

yarn serve

7 访问前端项目 http://localhost:8080/#/product/brand