获取省市区列表
获取省市区列表-数据库
CREATE TABLE t_dict_district (
id int(11) NOT NULL AUTO_INCREMENT,
parent varchar(6) DEFAULT NULL,
code varchar(6) DEFAULT NULL,
name varchar(16) DEFAULT NULL,
PRIMARY KEY (id)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;
parent属性表示的是父区域代码号，省的代码号+86。
获取省市区列表-实体类
创建一个District实体类。
private Integer id;//唯一标识
private String parent;//父区域代号
private String code;//本区域代号
private String name;//代号所表示的名称
获取省市区列表-持久层
查询语句，根据父代号进行查询。
select * from t_dict_district where parent=? order by code ASC
抽象方法的定义。 DistrictMapper接口。
package com.cy.store.mapper;
import com.cy.store.entity.District;
import java.util.List;
public interface DistrictMapper {
/**
* 根据父代号查询区域信息
* @param parent 父代号
* @return 某区域下的所有区域列表
*/
List<District> findByParent(Integer parent);
}
在配置文件中编写对应的SQL
<?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">
<!--nmaespace属性：用于指定当前的映射文件和那个接口进行映射，需要指定接口的文件路径，需要标注包的完整路径接口-->
<mapper namespace="com.cy.store.mapper.DistrictMapper">
<select id="findByParent" resultType="com.cy.store.entity.District">
SELECT * FROM t_dict_district WHERE parent = #{parent} ORDER BY code ASC
</select>
</mapper>
创建类测试接口
@Test
public void findByParent() {
List<District> districts = districtMapper.findByParent("110100");
for (District district : districts) {
System.out.println(district);
}
}
获取省市区列表-业务层
1.创建接口IUdstrictService,并定义抽象方法。
package com.cy.store.service;
import com.cy.store.entity.District;
import java.util.List;
public interface IDistrictService {
/**
* 根据父代号查询区域信息
* @param parent 父代号
* @return 多个区域信息
*/
List<District> getByParent(String parent);
}
2.创建DistrictServiceImpl实现类，实现抽象方法。
package com.cy.store.service.impl;
import com.cy.store.entity.District;
import com.cy.store.mapper.DistrictMapper;
import com.cy.store.service.IDistrictService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import java.util.List;
@Service
public class DistrictServiceImpl implements IDistrictService {
@Autowired
private DistrictMapper districtMapper;
@Override
public List<District> getByParent(String parent) {
List<District> districts = districtMapper.findByParent(parent);
/**在进行网络数据传输时，为了尽量避免无效数据的传递，可以将无效数据设置null
* 节省了流量的开销，提升了效率
*/
for (District district : districts) {
district.setId(null);
district.setParent(null);
}
return districts;
}
}
3.单元测试
@Test
public void getByParent() {
List<District> districts = districtService.getByParent("86");
for (District district : districts) {
System.err.println(district);
}
}
获取省市区列表-控制层
设计请求
/districts/
GET
String parent
JsonResult<List>
请求方法
创建一个DistrictController类, 在类中来编写处理请求的方法。
@RestController
@RequestMapping("/districts")
public class DistrictController extends BaseController{
@Autowired
private IDistrictService districtService;
//districts的请求都拦截到getByParent()方法
@RequestMapping({"/",""})
public JsonResult<List<District>> getByParent(String parent){
List<District> data = districtService.getByParent(parent);
return new JsonResult<>(OK,data);
}
district请求添加白名单中。
patterns.add("/districts/**");
直接访问服务器，来访问localhost:8080/districts？parent=86访问进行测试。
获取省市区列表-前端页面
1.注释掉通过js来完成省市区列表加载的js代码
<!--
<script type="text/javascript" src="../js/distpicker.data.js"></script>
<script type="text/javascript" src="../js/distpicker.js"></script>
-->
2.检查前端在提交省市区数据时是否有相关name属性和id属性。
3.运行前端是否还可以正常保存数据（除了省市区之外）。
获取省市区的名称
获取省市区的名称-持久层
1.规划根据当前code来获取当前省市区的名称，对应就是一条查询语句。
select * from t_dist_district where code=?
2.在DistrictMapper接口定义出来。
/**
* 根据区对应的行政代号获取对应代号的省（市区）信息
* @param code 行政代号
* @return 省（市，区）
*/
String findNameByCode(String code);
}
3.在DistrictMapper.xml文件中添加抽象方法的映射。
<select id="findNameByCode" resultType="java.lang.String">
SELECT name FROM t_dict_district WHERE code=#{code}
</select>
4.测试持久层接口
@Test
public void findNameByCode() {
String name = districtMapper.findNameByCode("610000");
System.out.println(name);
}
获取省市区的名称-业务层
1.在业务层没有异常处理
2.定义对应的业务层接口中的抽象方法。
String getNameByCode(String code);
3.编写接口对应的实现类
@Override
public String getNameByCode(String code) {
String name = districtMapper.findNameByCode(code);
return name;
}
4.测试可以省略不写（超过8行以上代码都要测试）。
获取省市区的名称-控制层优化
1.添加地址层依赖于IDistrictService层。
//在添加用户的收货地址的业务层依赖于IDidtrictService的业务层接口
@Autowired
private IDistrictService districtService;
2.在addNewAddress方法中将districtService接口中获取到的省市区数据转移到address对象，这个对象中就包含了所有用户收货地址的数据。
//对address对象中的数据进行补全：省 市 区
String provinceName = districtService.getNameByCode(address.getProvinceCode());
String cityName = districtService.getNameByCode(address.getCityCode());
String areaName = districtService.getNameByCode(address.getAreaCode());
address.setProvinceCode(provinceName);
address.setCityName(cityName);
address.setAreaName(areaName);
获取省市区的名称-前端页面
1.addAddress.html页面中编写对应的省市区展示及根据不同用户的不同选择来限制对应的便签中的内容。
2.编写相关的事件代码。
<script type="text/javascript">
let defaultOption = '<option value="0">----- 请选择 -----</option>';
$(document).ready(function() {
showProvinceList();
$("#city-list").append(defaultOption);
$("#area-list").append(defaultOption);
});
$("#province-list").change(function() {
showCityList();
});
$("#city-list").change(function() {
showAreaList();
});
function showProvinceList() {
$("#province-list").append(defaultOption);
$.ajax({
url: "/districts",
type: "GET",
data: "parent=86",
dataType: "JSON",
success: function(json) {
if (json.state == 200) {
let list = json.data;
console.log("count=" + list.length);
for (let i = 0; i < list.length; i++) {
console.log(list[i].name);
let option = '<option value="' + list[i].code + '">' + list[i].name + '</option>';
$("#province-list").append(option);
}
}
}
});
}
function showCityList() {
let parent = $("#province-list").val();
$("#city-list").empty();
$("#area-list").empty();
$("#city-list").append(defaultOption);
$("#area-list").append(defaultOption);
if (parent == 0) {
return;
}
$.ajax({
url: "/districts",
type: "GET",
data: "parent=" + parent,
dataType: "JSON",
success: function(json) {
if (json.state == 200) {
let list = json.data;
console.log("count=" + list.length);
for (let i = 0; i < list.length; i++) {
console.log(list[i].name);
let option = '<option value="' + list[i].code + '">' + list[i].name + '</option>';
$("#city-list").append(option);
}
}
}
});
}
function showAreaList() {
let parent = $("#city-list").val();
$("#area-list").empty();
$("#area-list").append(defaultOption);
if (parent == 0) {
return;
}
$.ajax({
url: "/districts",
type: "GET",
data: "parent=" + parent,
dataType: "JSON",
success: function(json) {
if (json.state == 200) {
let list = json.data;
console.log("count=" + list.length);
for (let i = 0; i < list.length; i++) {
console.log(list[i].name);
let option = '<option value="' + list[i].code + '">' + list[i].name + '</option>';
$("#area-list").append(option);
}
}
}
});
}
386
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
