Bootstrap

收货列表地址展示

收货地址列表展示


收货地址列表展示-持久层

1.数据库数据查询操作:
select * from t_address where uid=? order by id_default DESC,created_time DESC
2.接口设计和抽象方法

/**
	* 根据用户的id查询收货地址数据
	* @param uid 用户
	* @return  地址
	*/
	List<Address> findByUid(Integer uid);
	}

3.在xmlw文件中编写对应的SQL语句映射

<select id="findByUid">
    SELECT * FROM t_address WHERE uid=#{uid} 
    ORDER BY id_default DESC ,creare_time DESC
</select>

4.编写测试方法测试

 @Test
    public void findByUid(){
        List<Address> byUid = addressMapper.findByUid(7);
        System.out.println(byUid);
        }

收货地址列表展示-业务层

1.不用抛出相关的异常,不要进行异常的设计。
2.设计业务层的接口和抽象方法。
List

getByUid(Integer uid);
3.需要在实现类中实现此方法的逻辑

@Override
    public List<Address> getByUid(Integer uid) {
        List<Address> addresses = addressMapper.findByUid(uid);
        for (Address list:addresses){
            list.setAid(null);
            list.setUid(null);
            list.setProvinceCode(null);
            list.setCityCode(null);
            list.setAreaCode(null);
            list.setZip(null);
        }
        return addresses;
    }

4.只有一行代码不用测试

收货地址列表展示-控制层

1.请求设计
/addresses
HttpSession session
GET
JsonResult<List

>
2.实现请求方法的编写

@RequestMapping({"","/"})
public JsonResult<List<Address>> getByUid(HttpSession session){
    Integer uid = getUidFromSession(session);
    List<Address> list = addressService.getByUid(uid);
    return new JsonResult<>(OK,list);
}

3.先登录在访问http://localhost:8080/addresses地址测试

收货地址列表展示-前端页面

在address.html页面编写查询用户收货地址数据的展示列表。

<script type="text/javascript">
	$(document).ready(function () {
		showAddressList();
	});
	/*展示用户收货地址列表*/
	function showAddressList() {
		$.ajax({
			url: "/addresses",
			type: "GET",
			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++) {
						//
					let tr = '<tr>\n' +
							'<td>#{tag}</td>\n' +
							'<td>#{name}</td>\n' +
							'<td>#{address}</td>\n' +
							'<td>#{phone}</td>\n' +
							'<td><a class="btn btn-xs btn-info"><span class="fa fa-edit"></span> 修改</a></td>\n' +
							'<td><a class="btn btn-xs add-del btn-info"><span class="fa fa-trash-o"></span> 删除</a></td>\n' +
							'<td><a class="btn btn-xs add-def btn-default">设为默认</a></td>\n' +
							'</tr>';
						tr = tr.replace(/#{tag}/g, list[i].tag);
						tr = tr.replace(/#{name}/g, list[i].name);
						tr = tr.replace("#{address}", list[i].address);
						tr = tr.replace("#{phone}", list[i].phone);

						$("#address-list").append(tr);
					}
					//将某个元素隐藏使用hide()方法
					$(".add-def:eq(0)").hide();
				}else{
					alter("用户收货地址加载失败。");
				}
			}
		});
	}
</script>
;