✅P271_商城业务-订单服务-订单确认页渲染
大约 2 分钟
收货人信息渲染
cfmall-order/src/main/resources/templates/confirm.html
<!--地址-->
<div class="top-3" th:each="address:${confirmOrderData.memberAddressVos}">
<p>[[${address.name}]]</p><span>[[${address.province}]] [[${address.detailAddress}]] [[${address.phone}]]</span>
</div>
购物项渲染
OrderItemVo.java
新增“是否有货”和“商品重量”两个字段
package com.gyz.cfmall.order.vo;
import lombok.Data;
import java.math.BigDecimal;
import java.util.List;
/**
* @author gong_yz
* @Description
*/
@Data
public class OrderItemVo {
/**
* 是否有货
*/
private Boolean hasStock;
/**
* 重量
*/
private BigDecimal weight;
//省略其它代码...
}
前端回显
cfmall-order/src/main/resources/templates/confirm.html
<div class="to_right">
<h5>商家:谷粒学院自营</h5>
<div><button>换购</button><span>已购满20.00元,再加49.90元,可返回购物车领取赠品</span></div>
<!--图片-->
<div class="yun1" th:each="item:${confirmOrderData.items}">
<img th:src="${item.image}" class="yun"/>
<div class="mi">
<p>[[${item.title}]]<span style="color: red;" th:text="'¥' + ${#numbers.formatDecimal(item.price,3,2)}"> ¥ 499.00</span>
<span> [[${item.count}]] </span> <span>[[${item.hasStock?"有货":"无货"}}]]</span></p>
<p> <span>[[${item.weight}]]kg</span></p>
<p class="tui-1"><img src="/static/order/confirm/img/i_07.png" />支持7天无理由退货</p>
</div>
</div>
<div class="hh1"></div>
<p>退换无忧 <span class="money">¥ 0.00</span></p>
</div>
商品总数量、总金额渲染
商品总数量结算:cfmall-order/src/main/java/com/gyz/cfmall/order/vo/OrderConfirmVo.java
package com.gyz.cfmall.order.vo;
import lombok.Getter;
import lombok.Setter;
import java.math.BigDecimal;
import java.util.List;
import java.util.Map;
/**
* @author gong_yz
* @Description 订单确认页VO
*/
public class OrderConfirmVo {
public Integer getCount() {
Integer count = 0;
if (items != null && items.size() > 0) {
for (OrderItemVo item : items) {
count += item.getCount();
}
}
return count;
}
//省略其它代码...
}
前端回显
cfmall-order/src/main/resources/templates/confirm.html
<p class="qian_y">
<span>[[${confirmOrderData.getCount()}]]</span>
<span>件商品,总商品金额:[[${#numbers.formatdecimal(confirmOrderData.getTotal(),1,2)}]]</span>
<span class="rmb">¥28.90</span>
</p>
应付金额渲染
cfmall-order/src/main/resources/templates/confirm.html
<div class="yfze">
<p class="yfze_a"><span class="z">应付总额:</span><span class="hq">¥[[${#numbers.formatdecimal(confirmOrderData.getPayPrice(),1,2)}]]</span></p>
<p class="yfze_b">寄送至: 北京 朝阳区 三环到四环之间 朝阳北路复兴国际大厦23层麦田房产 IT-中心研发二部 收货人:赵存权 188****5052</p>
</div>