课堂学习 Day08 |Spring Boot基础-可视化迎新

写在前面的话

1、参考学习自：https://blog.csdn.net/howard2005/article/details/117734751
2、内容如果有不对的，希望可以指出或补充。
3、课堂回顾。

一、需求展示

1、可视化男女生人数比例
2、可视化报到未报到人数比例
3、可视化各学院学生人数比例
4、可视化各学院男女生人数比例
5、可视化生源地比例

二、操作

（一）准备

1、安装插件（Lombok插件、MyBatisX插件）

2、准备数据库、表

3、创建Spring Boot项目略。其中重要部分如下：

4、pom.xml文件里添加Lombok与Druid依赖

<dependency>                             
    <groupId>org.projectlombok</groupId> 
    <artifactId>lombok</artifactId>      
    <optional>true</optional>            
</dependency>         
<dependency>                         
    <groupId>com.weicoder</groupId>  
    <artifactId>druid</artifactId>   
    <version>3.3.8</version>         
</dependency>   

（二）实现

1、创建学生实体类（Student）、学生业务实体类（StudentBiz）、数据业务实体类（DataBiz）、映射业务实体类（MapBiz）、学生映射器接口（StudentMapper）略。具体查看学习链接内容。

2、配置应用属性文件（application.properties）

注意将application.properties重命名为application.yml。

spring:
  datasource:
    driver-class-name: com.mysql.cj.jdbc.Driver
    url: jdbc:mysql://localhost:3306/lzy_student?useUnicode=true&characterEncoding=UTF-8
    username: root
    password: root

    type: com.alibaba.druid.pool.DruidDataSource

mybatis:
  # 标注待解析的mapper的xml文件位置
  mapper-locations: classpath:mapper/*.xml
  # 标注实体类位置
  type-aliases-package: net.hw.echarts.bean
  configuration:
    # 开启MyBatis驼峰式命名规则自动转换 （本案例表字段与实体属性一致，可以不开启）
    map-underscore-to-camel-case: true

3、学生映射器配置文件（StudentMapper.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="net.hw.echarts.mapper.StudentMapper">
    <!--采用缓存，要求实体类序列化-->
    <cache></cache>

    <!--学生表全部列-->
    <sql id="columns">
        id, name, gender, age, school, sign, province, major
    </sql>

    <!--按学号查询学生-->
    <select id="findById" parameterType="java.lang.Integer" resultType="Student">
        select
        <include refid="columns"/>
        from student
        where id = #{id};
    </select>

    <!--查询全部学生-->
    <select id="findAll" resultType="student">
        select
        <include refid="columns"/>
        from student;
    </select>

    <!--按性别查询学生人数-->
    <select id="findByGender" resultType="net.hw.echarts.biz.StudentBiz">
        select gender, count(*) as count from student group by gender;
    </select>

    <!--按学院性别查询学生人数-->
    <select id="findBySchoolGender" resultType="net.hw.echarts.biz.StudentBiz">
        select school, gender, count(*) as count from student group by school, gender;
    </select>

    <!--按报到与否查询学生-->
    <select id="findBySign" resultType="net.hw.echarts.biz.StudentBiz">
        select sign, count(*) as count from student group by sign;
    </select>

    <!--按学院查询报到人数-->
    <select id="findBySchoolSign" resultType="net.hw.echarts.biz.StudentBiz">
        select school, sign, count(*) as count from student group by school, sign;
    </select>

    <!--按生源地查询学生-->
    <select id="findByProvince" resultType="net.hw.echarts.biz.StudentBiz">
        select province, count(*) as count from student group by province;
    </select>

    <!--插入学生记录-->
    <insert id="insert" keyColumn="id" keyProperty="id" parameterType="student"
            useGeneratedKeys="true">
        insert into student (name, gender, age, school, sign, province, major)
        values (#{name}, #{gender}, #{age}, #{school}, #{sign}, #{province}, #{major});
    </insert>

    <!--删除学生记录-->
    <delete id="deleteById" parameterType="java.lang.Integer">
        delete from student where id = #{id};
    </delete>

    <!--更新学生记录-->
    <update id="update" parameterType="Student">
        update student
        <set>
            <if test="name != null">
                name = #{name},
            </if>
            <if test="gender != null">
                gender = #{gender},
            </if>
            <if test="age != null">
                age = #{age},
            </if>
            <if test="school != null">
                school = #{school},
            </if>
            <if test="sign != null">
                sign = #{sign},
            </if>
            <if test="province != null">
                province = #{province},
            </if>
            <if test="major != null">
                major = #{major},
            </if>
        </set>
        where id = #{id};
    </update>
</mapper>

4、创建学生服务类（StudentService）、视图控制器（ViewController）、按性别可视化学生人数（gender.html）、按生源地可视化学生人数（province.html）略。

添加脚本静态资源：china.js、echarts.min.js、jquery.min.js

三、效果展示

1、创建可视化页面

gender.html页面与数据业务实体类的关系如下：

2、效果展示

重启应用，访问访问http://localhost:8080/view/getByGender

重启应用，访问http://localhost:8080/view/getByProvince