✅P274_商城业务-订单服务-订单确认页细节显示

gong_yz大约 1 分钟谷粒商城

查询运费&地址

查询运费得同时,也将地址信息一同查询,

编写FareVo.java

cfmall-ware/src/main/java/com/gyz/cfmall/ware/vo/FareVo.java

@Data
public class FareVo {
    private MemberAddressVo address;
    private String fare;
}

运费及地址信息返回

cfmall-ware/src/main/java/com/gyz/cfmall/ware/service/impl/WareInfoServiceImpl.java

cfmall-ware/src/main/java/com/gyz/cfmall/ware/controller/WareInfoController.java

package com.gyz.cfmall.ware.controller;

import com.gyz.cfmall.ware.entity.WareInfoEntity;
import com.gyz.cfmall.ware.service.WareInfoService;
import com.gyz.cfmall.ware.vo.FareVo;
import com.gyz.common.utils.PageUtils;
import com.gyz.common.utils.R;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;

import java.util.Arrays;
import java.util.Map;


/**
 * 仓库信息
 *
 * @author gong_yz
 */
@RestController
@RequestMapping("ware/wareinfo")
public class WareInfoController {
    @Autowired
    private WareInfoService wareInfoService;

    /**
     * 获取运费信息
     *
     * @return
     */
    @GetMapping(value = "/fare")
    public R getFare(@RequestParam("addrId") Long addrId) {
        FareVo fare = wareInfoService.getFare(addrId);
        return R.ok().put("data", fare);
    }
    
    //省略其它代码
}

地址信息渲染

cfmall-order/src/main/resources/templates/confirm.html

<div class="yfze">
	<p class="yfze_a"><span class="z">应付总额:</span><span class="hq"><b id="payPriceEle">[[${#numbers.formatDecimal(confirmOrderData.payPrice, 1, 2)}]]</b></span></p>
	<p class="yfze_b">寄送至: <span id="recieveAddr"></span> 收货人:<span id="reciever"></span></p>
</div>
//查运费
function getFare(addrId) {
	$.get("http://cfmall.com/api/ware/wareinfo/fare?addrId=" + addrId, function (resp) {
		console.log(resp);
		$("#fareEle").text(resp.data.fare);
		var total = [[${confirmOrderData.getTotal()}]];
		//设置运费
		$("#payPriceEle").text(total * 1 + resp.data.fare * 1);
		//设置收获地址人信息
		$("#recieveAddr").text(resp.data.address.province + " " + resp.data.address.city + " " + " " + resp.data.address.region + resp.data.address.detailAddress);
		$("#reciever").text(resp.data.address.name);
	})
};

页面效果

收货人信息、购物车商品信息、商品总金额、应付总额、寄送至、收件人皆渲染成功