家政预约小步伐13我的订单
现在我们已经完成了家政预约小步伐主体功能的开发，包罗服务的查看，在线预约已经登录等功能。预约之后就需要家政公司的客服进行派单，由服务人员进行上门服务。在小步伐中客户可以查看本身的订单信息，方便进行操作和评价。1 我的订单页面布局
打开应用编辑器，切换到我的页面，选中页面组件，设置背景色为灰色
https://img-blog.csdnimg.cn/direct/a453e60951e44180b9ade398f4771443.png
设置10px的外边距
https://img-blog.csdnimg.cn/direct/ed3927d63c9940b084c195472bacd314.png
设置背景色为白色，设置一定的圆角
https://img-blog.csdnimg.cn/direct/001fc54cf0b940d3b8b5c879c0e68f4d.png
里边放置一个普通容器，继续放置两个文本组件，设置布局为横向排列，两端对齐
https://img-blog.csdnimg.cn/direct/2cf1598b08cf45c3acfe2f6e29b6c4f4.png
然后搭建服务状态的展示效果，分为待支付、待服务、待验收和待评价
https://img-blog.csdnimg.cn/direct/7023082e7618431aa3ffee8a254725f4.png
我们还是使用普通容器作为基础布局，里边用图标和文本组件让我们的状态的辨识度更高一点
2 全部订单页面
点击新建页面图标，创建一个全部订单页面
https://img-blog.csdnimg.cn/direct/b38607a5f94e41bdbb65053b7daca810.png
https://img-blog.csdnimg.cn/direct/08387941a186445cb11de1ce00f94e65.png
在页面中先放入顶部选项卡
https://img-blog.csdnimg.cn/direct/ca1d40dc66b94faf97888e828ae13ffc.png
修改标签为待支付、待服务、待验收、待评价
https://img-blog.csdnimg.cn/direct/655dee6387684773bdc420adb239a373.png
从我的页面，点击一个状态，跳到全部订单页面，这个时间状态需要被选中。我们给这个页面界说一个URL参数用来接收我的页面选中的值
https://img-blog.csdnimg.cn/direct/7d3ebcb1d9a947d69a189106711becd0.png
https://img-blog.csdnimg.cn/direct/a876359cabe34780b2d5e8245c9751cd.png
然后设置选中标签为fx绑定，选择我们的URL参数
https://img-blog.csdnimg.cn/direct/3b1417c77ec94a0d97d64380cc2012dd.png
https://img-blog.csdnimg.cn/direct/9235990c30714bd28a1580c15ad85286.png
回到我的页面，给不同的状态设置不同的传参
https://img-blog.csdnimg.cn/direct/ddefb6958f104e62a0185031ad2ddf7c.png
3 美满订单状态
打开我们的预约信息表，添加一列订单状态，创建摆列值，分别输入待支付、待服务、待验收、待评价四个状态
https://img-blog.csdnimg.cn/direct/85f2c88731d842ceaaf43c637b8e1bb6.png
https://img-blog.csdnimg.cn/direct/713c7095075540499e6781787167d6f0.png
4 查询订单信息
回到全部订单页面，添加数据列表组件，选择我们的预约信息
https://img-blog.csdnimg.cn/direct/3b02f66121014d4a8282687b17f2b5f1.png
第一个文本绑定为服务的名称
https://img-blog.csdnimg.cn/direct/002b888cc8574ec78aa4476b961fb27f.png
第二个文本绑定为创建的时间
https://img-blog.csdnimg.cn/direct/88d1903d95ff4d8fb50cf0987c5f3a2b.png
图标组件我们更换成文本组件，绑定为订单的状态
https://img-blog.csdnimg.cn/direct/26123c82d8e047cfb4ca63f7bbe501e8.png
修改一下文本组件的父容器，设置宽度为80
https://img-blog.csdnimg.cn/direct/5c511cf5e6f7449b853d3fd725b7cd23.png
设置一下数据列表的筛选条件，订单状态即是我们的顶部选项卡的选中值
https://img-blog.csdnimg.cn/direct/de73fb19fed14dd3a98640a81ef0e5fd.png
继续添加条件，openid即是我们的登录用户的openId
https://img-blog.csdnimg.cn/direct/cbf934b8d3f04662886c6984b147c0c7.png
设置这个条件是只答应他查询本身的数据
总结
本篇我们先容了我的订单功能的开发，涉及到页面传参以及数据过滤的相关设置。通过设置合理的状态信息，我们就可以按照业务的需求在各个业务环节进行区分，后续我们先容在管理端如何进行订单确认以及派单的功能。
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]