00:00
前面呢,我们订单确认页的这些数据我们都准备好了,那接下来我们就来渲染这个页面,来到我们这个订单服务,来找到订单确认页,我们要挨个渲染我们页面里边的所有数据,首先我们的第一块数据收货人信息来找一下CTRLF,我们所有的收货人信息,那就在这儿,这一块呢是我们的收货人信息,当然收货人的所有信息我们现在呢,全部是查出来,查出来以后呢,我们全部都放到了order confirm data里边,所以整个页面其实都要取这里边的数据,好主要呢,就是我们这个里边的数据,那么现在就来取第一个收货人信息,那这块的div能有几个,那应该是便利我们所有的收货人,所以我们先来写一个TH。Dollar福大客号,我们现在呢页面放了一个叫order confirm data,它里边呢有我们所有的收货人,有一个叫address,就是我们的地址列表,好,我们来便利每一个地址列表,我们就叫ad drr,我拿到地址以后呢,接下来就在这来进行显示,那前面这一块最大的显示的是我们当前收货人的姓名,然后后边呢是收货人的详细信息,比如参照我们这个京东也是这样做的,那这个京东比如我们来点购物车,我们来去结算的时候,那点击去结算,那现在呢,前面显示的是我们人物的姓名,后边是他的整个收货地址详细信息,那我们现在呢,就来展示这一块的信息,首先。
01:35
我们这一块的都是遍历出来的,那这一块姓名我就双中括号,我们直接来Dollar符大括号,Dollar福大括号,我们先来取出我们ADRRAADR里边呢,我们会有这个姓名,来找一下这个姓名confirm we,好,Member address,我们的姓名就是这个name。那来到我们这个页面,姓名就是name,然后这一块也一样,那双中括号。
02:02
Dollar乐福大括号,我们还是来显示我们的姓名ADDR内,然后接下来显示我们的是好双中括号,Dollar福大括号,那我们的市区那就是ADR点一个进来,我们的所在城市,所在城市是这个CT,应该是我们这个省市区,先来显示我们的省,好我们省省显示了以后呢,接下来后边就是我们的详细地址,再加上我们的手机号双中括号那些省市区就显示个省,接下来显示详细地址区那些就不用选了,ADDR来详细地址在这呢,也有有一个detail address好拿过来,再加上他的手机号双中括号。Do乐福大括号,我们还是a drr手机号呢,在我们这一块封装着叫份,那么现在呢,就给我们的数据库来录入一条比较详细的信息,比如姓名,我们需要显示的,我们就叫雷凤阳,然后呢,我们这一块省,比如我们就叫上海市这个直辖市啊上海市,然后呢,接下来我们详细信息们在这来保存一个,那么就叫上海市,上海市比如我们就叫松江区,松江区我们这个大江六层,好,我们来随便来写一个地址,我们来保存一下。
03:26
那接下来是不是我们这个默认的收货地址,我们可以来写一个一代表我们现在呢是默认收货地址来来到页面我们要显示我们的地址信息,这一块呢,都会有CTRLF9页面让它刷新一下,然后我们重新来刷一下我们这个结算确认页,刷新好,那么这个地址信息呢就没问题,那后来大家给这一块还可以添加上我们新增收货地址,比如我们点一下弹一个框,把收货地址一新增,在这一块还能展示更多的信息,我们在这儿点一个更多地址都来展示这一块的页面效果呢,我们就不把它做那么详细了,好,那接下来我们就来是这一块的所有商品信息,那我们把这一块我们就来给它清空掉,这个什么北京市昌平区。
04:10
好,我们现在把这一块清空掉,北京市昌平区的这一块地址信息,然后呢,接下来我们这个支付方式,在线支付,货到付款,然后送货清单,我们来主要来看我们送货清单这一块来找一个这个鼓励商城,我们自营这一块有一个小米手环,我们所有的货物都在这儿来显示的,好,我们来CTRLF来找一下,那现在呢,每一个商品肯定就是这么一个图片,我们可以来给大家看一下,如果我们把这个复制上多份,我们看是不是多个商品CTRLF9。来刷新一下,看一下页面效果好,现在呢,这是两个商品没问题,那现在呢,我们所有的商品都是要来便利我们的这个div,每遍利一个商品呢,我们就会有相关的数据,那我们接下来就来便利这个div,我们把这个div。
05:03
诶,删掉好,接下来我们进行便利,首先呢,TH,我们这个页面所有的商品也是在我们的这个order comfort data里边,我们要进行挨个获取,来Dollar服大括号,它里边有一个数据,我们叫itto啊,我们拿到的每一个商品我们就叫item,然后接下来我们来便利,第一个是商品的图片信息,我们直接使用TSRC,使用Dollar服大括号,Dollar福大括号,然后呢,我们现在是aem点一个,那么现在呢,要拿到我们商品的这个图片,我们就来取一个image就行了。然后接下来是我们第一个P标签,这个P标签呢,这一块是我们的商品标题,然后呢,这一块是我们的价格,这一块是我们的数量,然后呢,接下来是我们的有货还是无货状态。
06:00
那发现这个有货无货状态,我们现在呢,没查,我们一会儿来查一下,那现在我们在这来。写上这是商品的标,双中号刀,乐福大括号,那么现在呢,就应该是item,点一个我们商品的标题呢,在这里边封装了一个开头,好,这是我们的商品,然后呢,这是它的这个价格,价格我们也直接取出来,双中括号,Do乐福大括号,好,Do乐福大括号,然后呢,我们现在要取出我们的这个价格点一个,那这个价格里边呢,有一个属性叫price啊,这是我们的价格,没问题,然后还有我们买了多少个数量,双重括号啊,当大括号,我们现在的数量呢,是item里边我们有一个值叫count啊,这是我们的数量,没问题,包括价格这一块应该做一个格式化显示,我们之前都已经格式化过,大家把那块的语法再来复制过来就行了,还有有货状态。
07:04
所以我们接下来这一块最重要的就是每一个商品我们一定要检查是否有货,比如我们有一个布尔类型的汉字to,我们再来查询价格的时候,同时还可以返回这个商品是否有货。那我们现在呢,就在这来判断有货没货,我们就是要来动态显示Dollar大括号,如果我们这个item。里边的我们现在有一个叫我们这个汉字to有货,如果他的这个状态。是处的来等等处,那我们直接就问号,如果是处的,我们就来让它显示有货,否则呢,就来显示无货。好,那么在这一块呢,就来显示我们这个叫有货,然后呢,接下来这一块叫无货。好,我们先放在这儿,那这一块我们这个状态需要待处理,来写一个图度查询咱们这个库存状态,好,现在我们把这一块拿到以后,我们页面的这一块就显示成功了,然后接下来下边的这一块,我们来看一下是什么内容,这一块呢,其实应该是我们整个标题的完整内容。
08:19
由于标题太长了,我们这两个P分两行来进行了显示,这个就给人感觉到感觉很奇怪,我们把这个P呢,我们就来删掉,那接下来就是我们的这个商品的重量,因为这个重量呢,可能要参与运费计算,那么现在呢,没有引入整个运费计算,所以重量这一块我们可以让它固定显示,那如果想要显示,我们还要返回每一个商品的重量private。好,我们还是用贝格decimma类型的,比如我们的white重量,这个呢,我们可以去我们的仓库里边查找我们当前商品的重量,好我们就留在这儿,那现在我们这个重量呢,我们全部都给它来固定显示,然后接下来。
09:03
支持七天无理由退货,这相当于是我们的一些服务,那就留在这儿,然后接下来这一块的信息我们全放在这儿,CTRLF9,好,那让它页面呢,重新来编译一下CTRLF9,然后我们来刷新一下页面,看能不能取到我们的这个商品信息来刷新。好,现在我们这个商品信息呢,可以来取到,只不过我们这一块下边的所有内容没展示出来,那肯定哪一块有问题,那现在商品信息这是图片,这是我们的这一块内容,我们把图片的这个宽高,我们也可以来调整一下图片style,比如宽,我们给个64像素来看一下这个宽度。我们来给上个一百五吧,然后高度K,我整个高度呢,给一个300。来看一下我们这一块的效果,CTRLF9,我们把这个订单我们重新启动一下。好,我们来看一下我们的订单确认页,因为我们现在呢是登录状态,所以我们所有的数据呢都是有的,那可能是我们之前现在已经没有登录状态了,来看一下我们的登录状态,鼓励麦走。
10:11
现在登录状态没问题,然后呢,来到我们这一块,我们来订单结算,来等待我们的订单服务启动起来。我现在来重新结算来刷新好,那结算页这一块呢,展示出来,然后结算页模板肯定有问题,说我们这个Type Conversion,就说把我们这个nu类型转化不了布尔类型。那就是我们现在呢,给的这个状态,它默认呢,是一个我们这个囊类型的,因为我们现在给的是一个对象,我们来给大家看一下这个里边我们来保存的这个有货无货状态,能让它保存一个基本类型的布,这样呢默认都是无货状态,我们来给它启动起来。我们让他重新呢来进行页面的渲染,们在这来重新测试一下,来刷新一下走好,我们现在订单的结算没问题,我们这个图片还是有点长,这个150,那就整个100更漂亮一点,CTRLF9,那现在呢,我们这个商品的数据我们在我们的页面已经展示都成功了,那么这一块呢,显示的是无货,无货的原因是我们没有查真正的货款信息,那接下来再来下边那要显示我们商品的整个总价,总价这一块呢,都是计算好的,就直接来这儿找就行了,商品呢,总共几件商品。
11:26
这个商品的件数,我们在这一块来看一下,那么这是埃特斯,但是商品呢,总共有几件,几件呢?我们假设专门有一个方法能获取到几件public,我们就叫一个integer,我们叫get count,好,我们只要有这个方法,那说明我们就来有这个属性,到底有几件,我们就来进行一个变利就行了,所以我们在这来,如果它不为空,我们就来进行变利,整个键数应配,哎,我们就等于零,那我们现在呢,就来拿到每一个商品,商品的总数量那就应该是I。
12:04
I加等于我们当前的这个数量,点一个get count啊,这是我们的这个总件数,我们最终return出我们的这个I。那我们的总件数在这一块呢,我们就来遍历显示来到我们的页面,现在有几件来双中括号Dollar福大括号,那item里边我们还有一个属性叫count,这是我们写了一个get方法,我们呢相当只要有这个get方法,那就相当于有这个属性,而且呢,这个不是我们这个item里边的,我们现在呢,总共都是我们的这个VO里边的order come VO,这个VO里边呢,有一个统计的总数量。我们的这个count,好,那现在呢,就从VO里边拿到这个count没问题,然后还有它的这个总金额,双中括号Dollar福大括号,那么这个总金额呢,我们也是在这个VO里边来做了一个计算,这个VO里边的总金额我们来看一下,那这个总金额呢,在下边我们叫total,好把它取值过来就行了,Total。
13:11
返现这一块,那么现在呢,默认都000,我们来算好,然后呢,最终我们的应付金额,那就在这应付金额呢,是来双中括号大括号,我们也是在我们的这个order里边,Order VO里边呢,有一个数据叫我们的这个pay price门禁附近啊好,我们把这个pay price拿过来,那所有的数据呢,都在这寄送至哪儿,那我们这一块的所有信息,那就是我们之前获取到的。双中括号,我们的Dollar服大括号,先是我们order com这个VO里边,我们之前被选中的那个收货信息是哪个,那这一块就是哪个,那么这一块的便利好,我们先留在这儿,这还不应该是来写死的。
14:04
好,我们先来CTRLF9,我们把页面呢重新编译一下。我们再来做一个测试,来看一下我们的页面效果,我们所有的数据,那就在订单页我们就能便利显示了,来刷新一下我们的结算页,好,现在我们这一块的所有内容,我们的这个商品是5700,我们来看我们的这个应付金额啊,这一块呢,我们先来关掉我们的应付金额,在这儿应付金额呢没有显示出来,来CTRLF9让页面呢重新来编译一下。来刷新一次,再来刷新一下,我发现这一块页面还是有问题,我们每次一刷新,那这一块呢,就会出现问题,说我们这个模板解析呢,是出现了问题,我们一直往下翻,就是我们的这个pay price这个计算呢没计算出来。说这个PI price不能是一个空的,Cannot be found or not,那么就来看一下。The older con we all。
15:02
这一块的数据没问题,我们是在web里边放着叫啊,这个不叫VO,我们叫好CF9,然后前面的这个数据,好,那一切都正常,就我们这个拍price没有拿出来,来重新刷新一下,好,现在所有的价格信息我们都一切正常,没问题,包括这一块的格式化显示,我们可以让它保留两位小数,参照以前我们的商品详情页,那么在这一块呢,可以让它来格式化显示,把这一块,那现在先留在这,好,我们使用这个numbers format,那这个数字格式化,我们要格式化的数据在这,然后呢,前边我们最小一位,然后呢,保留两位小数,那这一块的显示是这样子的,其他的显示呢,也都一样来CTRLC。凡是牵扯到我们价格的显示这一块,我们也来给它显示成这样走,我们要格式化这个数据,然后呢,整数部分一位小数部分两位小数,然后呢,还有我们大前边,我们前边的这一块商品的价格,我也给他这么来显示。
16:11
整数部分一位,小数部分保留两位,CTRLF9。好,我们来看一下我们的页面效果刷新,好,现在我们的页面所有的数据一切呢都是正常的,没问题。那下一节课我们再来细化其他的内容。
我来说两句