家政预约小程序13我的订单


现在我们已经完成了家政预约小程序主体功能的开发,包含服务的查看,在线预约已经登录等功能。预约之后就需要家政公司的客服进行派单,由服务人员进行上门服务。在小程序中客户可以查看自己的订单信息,方便进行操作和评价。

1 我的订单页面布局

打开应用编辑器,切换到我的页面,选中页面组件,设置背景色为灰色
在这里插入图片描述
设置10px的外边距
在这里插入图片描述
设置背景色为白色,设置一定的圆角
在这里插入图片描述
里边放置一个普通容器,继续放置两个文本组件,设置布局为横向排列,两端对齐
在这里插入图片描述
然后搭建服务状态的展示效果,分为待支付、待服务、待验收和待评价
在这里插入图片描述
我们还是使用普通容器作为基础布局,里边用图标和文本组件让我们的状态的辨识度更高一点

2 全部订单页面

点击新建页面图标,创建一个全部订单页面
在这里插入图片描述
在这里插入图片描述
在页面中先放入顶部选项卡
在这里插入图片描述
修改标签为待支付、待服务、待验收、待评价
在这里插入图片描述
从我的页面,点击一个状态,跳到全部订单页面,这个时候状态需要被选中。我们给这个页面定义一个URL参数用来接收我的页面选中的值
在这里插入图片描述
在这里插入图片描述
然后设置选中标签为fx绑定,选择我们的URL参数
在这里插入图片描述
在这里插入图片描述
回到我的页面,给不同的状态设置不同的传参
在这里插入图片描述

3 完善订单状态

打开我们的预约信息表,添加一列订单状态,创建枚举值,分别输入待支付、待服务、待验收、待评价四个状态
在这里插入图片描述
在这里插入图片描述

4 查询订单信息

回到全部订单页面,添加数据列表组件,选择我们的预约信息
在这里插入图片描述
第一个文本绑定为服务的名称
在这里插入图片描述
第二个文本绑定为创建的时间
在这里插入图片描述
图标组件我们替换成文本组件,绑定为订单的状态
在这里插入图片描述
修改一下文本组件的父容器,设置宽度为80
在这里插入图片描述
设置一下数据列表的筛选条件,订单状态等于我们的顶部选项卡的选中值
在这里插入图片描述
继续添加条件,openid等于我们的登录用户的openId
在这里插入图片描述
设置这个条件是只允许他查询自己的数据

总结

本篇我们介绍了我的订单功能的开发,涉及到页面传参以及数据过滤的相关设置。通过设置合理的状态信息,我们就可以按照业务的需求在各个业务环节进行区分,后续我们介绍在管理端如何进行订单确认以及派单的功能。

相关推荐

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-06-05 21:18:04       98 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-06-05 21:18:04       106 阅读
  3. 在Django里面运行非项目文件

    2024-06-05 21:18:04       87 阅读
  4. Python语言-面向对象

    2024-06-05 21:18:04       96 阅读

热门阅读

  1. Ubuntu 离线安装 gcc、g++、make 等依赖包

    2024-06-05 21:18:04       32 阅读
  2. 奇偶交换排序

    2024-06-05 21:18:04       30 阅读
  3. Windows10 安装 Lua详细教程

    2024-06-05 21:18:04       35 阅读
  4. 实验报告题目

    2024-06-05 21:18:04       29 阅读
  5. 09-进程和计划任务管理

    2024-06-05 21:18:04       20 阅读
  6. Android的刷机模式

    2024-06-05 21:18:04       29 阅读
  7. 怎么用SU做45°轴测图?

    2024-06-05 21:18:04       32 阅读
  8. 代码随想录算法训练营第22天|二叉树

    2024-06-05 21:18:04       31 阅读
  9. Circuits--Verification--Finding Bug

    2024-06-05 21:18:04       33 阅读