省市区三级联动及生成测试数据项目搭建

一 : 页面效果展示
1 : 初始化页面

在这里插入图片描述

2 : 生成结果页面

在这里插入图片描述

二 : Spring Boot项目搭建
1 : 搭建Spring Boot项目
1.1 创建一个新的项目

在这里插入图片描述

1.2 选择Spring Initializr, SDK 选择1.8版本

在这里插入图片描述

1.3	Group: 域名  Artifact: 项目名或模块名
Package: 包 , 这里统一设置为 generate, 然后next

在这里插入图片描述

1.4 根据自己的需要勾选,这里选择Spring Web

在这里插入图片描述

1.5 上面设置了name,所以这个地方自动带出来project name 就是上面设置的generate.
Project location: 项目的工作空间.
点击Finish, 点击OK

在这里插入图片描述

1.6 找到启动类,启动成功,一个基础的简单Spring Boot项目就搭建好了

在这里插入图片描述

2 : Spring Boot打包
2.1 修改pom文件, 增加  
<packaging>jar</packaging>

在这里插入图片描述

2.2 修改pom文件, 设置启动类 
<configuration>
	  <mainClass>com.generate.GenerateApplication</mainClass>
	</configuration>

在这里插入图片描述

2.3 maven打包, target目录下会生成一个jar包文件.

在这里插入图片描述

3 : 设置yml配置文件
3.1 新建application.yml, application-dev.yml 配置文件,并指向application-dev.yml

在这里插入图片描述

3.2 编辑application-dev.yml文件设置项目名及端口

在这里插入图片描述

4 : 设置yml配置参数
配置访问路径后缀, Json序列化, 配置文件大小限制
application-dev.yml参数配置如下:
spring:
  mvc:
    view:
      suffix: .html
  jackson:
    date-format: yyyy-MM-dd HH:mm:ss
    time-zone: GMT+8
  servlet:
    multipart:
      max-file-size: 100MB
      max-request-size: 100MB
pom.xml参数配置如下:
<dependency>
    <groupId>com.alibaba</groupId>
    <artifactId>fastjson</artifactId>
    <version>1.2.52</version>
</dependency>

在这里插入图片描述
在这里插入图片描述

5 : 数据库连接配置
application-dev.yml参数配置如下:
	spring:
      datasource:
        username: 用户名
        password: 明文密码
        driver-class-name: com.mysql.cj.jdbc.Driver
        url: jdbc:mysql://IP:端口/数据库名称?characterEncoding=utf8&useSSL=false&useTimezone=true&serverTimezone=GMT%2B8&nullCatalogMeansCurrent=true
        type: com.alibaba.druid.pool.DruidDataSource
        initialSize: 5
        min: 5
        maxActive: 20
        maxWait: 60000
        timeBetweenEvictionRunsMillis: 60000
        minEvictableIdleTimeMillis: 300000
        validationQuery: SELECT 1 FROM DUAL
        testWhileIdle: true
        testOnBorrow: false
        testOnReturn: false
        poolPreparedStatements: true
        filters: config,stat,wall
        maxPoolPreparedStatementPerConnectionSize: 20
        useGlobalDataSourceStat: true
        connectionProperties: druid.stat.mergeSql=true;druid.stat.slowSqlMillis=500
pom.xml参数配置如下:
        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>druid</artifactId>
            <version>1.1.10</version>
        </dependency>
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <version>8.0.11</version>
        </dependency>

在这里插入图片描述
在这里插入图片描述

6 : Mybatis Plus配置
application-dev.yml参数配置如下:
	mybatis-plus:
      mapper-locations:
      - classpath*:/mybatis/mapper/*/*.xml

      type-aliases-package: com.web.generate.*.entity;
      global-config:
        id-type: 3
        db-column-underline: true
        field-strategy: 2

      configuration:
        log-impl: org.apache.ibatis.logging.stdout.StdOutImpl
        map-underscore-to-camel-case: false
        call-setters-on-nulls: true
pom.xml参数配置如下:
        <dependency>
            <groupId>com.baomidou</groupId>
            <artifactId>mybatis-plus-boot-starter</artifactId>
            <version>2.3</version>
        </dependency>
        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <version>1.18.0</version>
            <scope>provided</scope>
        </dependency>

在这里插入图片描述
在这里插入图片描述

说明: 
mapper-locations: 配置加载的xml所在的包路径
type-aliases-package: 配置加载的实体类所在的包路径
7 : 修改启动类
@SpringBootApplication(scanBasePackages="com",exclude = SecurityAutoConfiguration.class)
//通过注解注册
@ServletComponentScan
//事务
@EnableTransactionManagement
//mapper bean扫描包
@MapperScan("com.generate.*.mapper")

在这里插入图片描述

8 : 编写查询接口
8.1 新建t_test表
CREATE TABLE `t_test` (
  `ID` int(11) NOT NULL AUTO_INCREMENT COMMENT '自增列',
  `TEST_CODE` varchar(50) DEFAULT NULL COMMENT '测试代码',
  `TEST_NAME` varchar(50) DEFAULT NULL COMMENT '测试名称',
  PRIMARY KEY (`ID`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COMMENT='测试表';
8.2 查询接口代码

通用返回DTO

package com.generate.bean;

public class Result<T> {

    private boolean success = true;
    private Integer code = 0;
    private String msg;
    private T data;

    public boolean isSuccess() {
        return this.code == 0;
    }
    public void setSuccess(boolean success) {
        this.success = success;
    }
    public Integer getCode() {
        return code;
    }
    public void setCode(Integer code) {
        this.code = code;
        if(code != 0){
            success = false;
        }
    }
    public String getMsg() {
        return msg;
    }
    public void setMsg(String msg) {
        this.msg = msg;
    }
    public T getData() {
        return data;
    }
    public void setData(T data) {
        this.data = data;
    }
    public Result() {
        super();
    }
    public Result(boolean success) {
        this.success = success;
        if(success){
            code = 0;
        }
    }
    public Result(int code) {
        super();
        success = false;
        this.code = code;
    }
    public Result(String msg) {
        success = false;
        this.msg = msg;
    }
    public Result(boolean success, String msg) {
        super();
        this.success = success;
        this.msg = msg;
    }
    public Result(int code, String msg) {
        super();
        success = false;
        this.code = code;
        this.msg = msg;
    }

}

TestMapper.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.generate.test.mapper.TestMapper">

    <!-- 通用查询映射结果 -->
    <resultMap id="BaseResultMap" type="com.generate.test.entity.Test">
        <id column="ID" property="id" />
        <result column="TEST_CODE" property="testCode" />
        <result column="TEST_NAME" property="testName" />
    </resultMap>

    <!-- 通用查询结果列 -->
    <sql id="Base_Column_List">
        ID, TEST_CODE, TEST_NAME
    </sql>

</mapper>

Test

package com.generate.test.entity;

import com.baomidou.mybatisplus.activerecord.Model;
import com.baomidou.mybatisplus.annotations.TableId;
import com.baomidou.mybatisplus.annotations.TableName;
import com.baomidou.mybatisplus.enums.IdType;
import lombok.Data;
import lombok.EqualsAndHashCode;
import lombok.experimental.Accessors;
import java.io.Serializable;

/**
 * 测试表
 * @author candy
 * @since 2020-06-30
 */
@Data
@EqualsAndHashCode(callSuper = false)
@Accessors(chain = true)
@TableName("T_TEST")
public class Test extends Model<Test> {

    private static final long serialVersionUID = 1L;

    /**
     * 自增列
     */
    @TableId(value = "ID", type = IdType.AUTO)
    private Integer id;
    /**
     * 测试代码
     */
    private String testCode;
    /**
     * 测试名称
     */
    private String testName;

    @Override
    protected Serializable pkVal() {
        return this.id;
    }
}

TestMapper

package com.generate.test.mapper;

import com.baomidou.mybatisplus.mapper.BaseMapper;
import com.generate.test.entity.Test;

/**
 * 测试表 Mapper 接口
 * @author candy
 * @since 2020-06-30
 */
public interface TestMapper extends BaseMapper<Test> {

}

ITestService

package com.generate.test.service;

import com.baomidou.mybatisplus.service.IService;
import com.generate.bean.Result;
import com.generate.test.entity.Test;

/**
 * 测试表 服务类
 * @author candy
 * @since 2020-06-30
 */
public interface ITestService extends IService<Test> {

    Result selectList();

}

TestServiceImpl

package com.generate.test.service.impl;

import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import com.generate.bean.Result;
import com.generate.test.entity.Test;
import com.generate.test.mapper.TestMapper;
import com.generate.test.service.ITestService;
import org.springframework.stereotype.Service;

import java.util.List;

/**
 * 测试表 服务实现类
 * @author candy
 * @since 2020-06-30
 */
@Service
public class TestServiceImpl extends ServiceImpl<TestMapper, Test> implements ITestService {

    @Override
    public Result selectList() {
        Result<List<Test>> result = new Result<>();
        List<Test> testList = baseMapper.selectList(new EntityWrapper<>(new Test()));
        result.setData(testList);
        return result;
    }
}

TestController

package com.generate.test.controller;

import com.generate.bean.Result;
import com.generate.test.service.ITestService;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import javax.annotation.Resource;

/**
 * 测试表 前端控制器
 * @author candy
 * @since 2020-06-30
 */
@Controller
public class TestController {

    @Resource
    private ITestService testService;

    @RequestMapping("/test")
    @ResponseBody
    public Result test() throws Exception {
        return testService.selectList();
    }

}

8.3 结构及测试结果

在这里插入图片描述
在这里插入图片描述

三 : 静态页面
1 : HTML静态页面
新建generate_card.html静态页面
<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<meta charset="utf-8" />
	<title>在线生成数据</title>
	<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport" />
	<meta content="" name="description" />
	<meta content="" name="author" />
    <style>

    </style>
</head>
<body>

</body>

</html>
2 : 引入JS及日历控件

在这里插入图片描述

3 : 编写body中div元素

在这里插入图片描述

4 : 编写省市区三级联动并赋默认值

在这里插入图片描述

四 : 源码资源链接
1 : 资源链接

在线生成数据前后端源码资源链接

2 : 说明
数据生成器是按规则生成虚拟数据,非真实数据,仅供测试使用,请勿用于非法用途。
项目仅作为学习参考使用,如有问题,请留言.
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

message丶小和尚

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值