当前位置： 首页 > news >正文

家政预约小程序11新增预约

news 2025/12/19 2:26:18

目录

  • 1 创建数据源
  • 2 创建页面
  • 3 显示选中的服务信息
  • 4 设置表单容器
  • 5 配置地图
  • 6 配置预约成功页面
  • 7 从详情页到预约页
  • 总结

用户在浏览家政小程序的具体服务时，如果希望预约的，可以在详情页点击立即预约按钮，填写具体的信息，方便家政公司提供上门服务。在预约的时候我们需要将用户在页面上填写的信息存入数据库中，方便后续业务流程在流转时进行传递，因此我们先需要创建预约的数据源。

1 创建数据源

打开控制台，找到数据模型，点击新建
在这里插入图片描述
输入数据源的名称，标识由系统自动生成
在这里插入图片描述
然后录入我们需要的字段信息，在表格上点击添加一列
在这里插入图片描述
先添加服务时长，类型选择枚举值，点击立即创建，创建我们的枚举项
在这里插入图片描述
在这里插入图片描述
继续添加列，输入预约人联系电话
在这里插入图片描述
添加预约人姓名字段
在这里插入图片描述
添加上门时间，类型选择日期时间
在这里插入图片描述
添加上门地址，类型选择地理位置
在这里插入图片描述
添加门牌号字段
在这里插入图片描述
添加备注字段
在这里插入图片描述
再一个我们要知道是预约的哪一项服务，添加所选服务字段，类型选择关联关系
在这里插入图片描述
我们还希望知道是谁填写的，这里填写openid字段，用来记录用户的微信标识信息
在这里插入图片描述

2 创建页面

点击新建页面的图标，我们创建新增预约的页面
在这里插入图片描述
在这里插入图片描述
选中页面组件，创建一个URL参数，填写为id
在这里插入图片描述
在这里插入图片描述

3 显示选中的服务信息

在新增预约页面，我们第一部分要展示用户选中的服务信息，在代码区点击立即新建，创建一个变量，选择微搭数据表查询
在这里插入图片描述
在这里插入图片描述
选择我们的服务管理数据源，方法选择查询单条
在这里插入图片描述
查询条件设置成数据标识等于我们刚刚设置的URL参数
在这里插入图片描述
在页面组件添加一个普通容器，里边放置图片组件和普通容器，最里边的普通容器放置两个文本组件
在这里插入图片描述
外层普通容器我们设置布局为横向排列
在这里插入图片描述
设置图片的宽度和高度为96px和64px
在这里插入图片描述
布局模式选择裁剪填满
在这里插入图片描述
地址绑定从我们的变量里选择
在这里插入图片描述
第一个文本组件的文本内容绑定为我们变量里的服务名称
在这里插入图片描述
第二个文本组件绑定文本内容，选择变量里的优惠价格
在这里插入图片描述
然后设置外层容器的内边距
在这里插入图片描述
设置图片组件的外边距
在这里插入图片描述
在外层容器下添加一个分割线组件
在这里插入图片描述

4 设置表单容器

展示了所选的服务后，拖入表单容器设置我们提交的表单信息
在这里插入图片描述
数据模型选择我们的预约信息
在这里插入图片描述
调整一下我们组件的顺序
在这里插入图片描述
选中所选服务组件，设置一下选中值，设置为我们的URL参数
在这里插入图片描述
关闭是否可见配置项
在这里插入图片描述
选中openid，配置输入值，选择我们登录对象里的openId
在这里插入图片描述
同样也把是否可见的选项关闭
在这里插入图片描述

5 配置地图

在表单上我们设置了位置选择的组件，先需要配置地图信息。切换到数据源视图，切换到APIs
在这里插入图片描述
点击新建图标，选择我们的地图
在这里插入图片描述
创建时候要求输入API Key，点击旁边的链接
在这里插入图片描述
按照我图示的填写具体的信息，将得到的API KEY填写上
在这里插入图片描述
选中表单的地理位置组件，选择我们刚刚创建的API
在这里插入图片描述

6 配置预约成功页面

新建一个预约成功页面
在这里插入图片描述
添加一个普通容器，里边加一个图标和文本组件
在这里插入图片描述
回到我们的立即预约页面，选中表单容器组件，选择组件内置方法
在这里插入图片描述
在数据源提交成功后添加一个动作，选择打开页面
在这里插入图片描述
在这里插入图片描述

7 从详情页到预约页

切换到服务详情页面，点击立即预约按钮，设置点击事件，选择打开页面
在这里插入图片描述
这样整体就配置好了

总结

本篇我们介绍了预约功能的开发，介绍了表单容器的具体配置过程，在使用地图选择的时候还需要配置地图的API，低代码已经对这些外部SaaS应用做了集成，简单配置就可以使用还是比较方便的。

相关文章：

家政预约小程序11新增预约

目录 1 创建数据源2 创建页面3 显示选中的服务信息4 设置表单容器5 配置地图6 配置预约成功页面7 从详情页到预约页总结 用户在浏览家政小程序的具体服务时，如果希望预约的，可以在详情页点击立即预约按钮，填写具体的信息，方便家政…...

编程日记 2024/6/3 21:57:53

AI雷达小程序个人名片系统源码 PHP+MYSQL组合开发 带完整的安装代码包以及搭建教程

系统概述 随着移动互联网的普及和社交媒体的兴起，人们获取信息和建立联系的方式发生了翻天覆地的变化。传统的纸质名片已经无法满足现代人的需求，而小程序作为一种轻量级应用，具有无需安装、即开即用、易于分享等特点，成为了个人…...

编程日记 2024/6/3 21:56:51

Kafka生产者消息异步发送并返回发送信息api编写教程

1.引入依赖&#xff08;pox.xml文件&#xff09; <dependencies> <dependency> <groupId>org.apache.kafka</groupId> <artifactId>kafka-clients</artifactId> <version>3.6.2</version> </dependency> </depende…...

编程日记 2024/6/3 21:54:49

WiFi串口服务器与工业路由器：局域网应用的协同之力

在工业物联网&#xff08;IIoT&#xff09;迅猛发展的当下&#xff0c;局域网&#xff08;LAN&#xff09;作为连接工业设备与数据中心的桥梁&#xff0c;其重要性日益凸显。WiFi串口服务器与工业路由器作为局域网中的关键组件&#xff0c;以其独特的性能和功能&#xff0c;为传…...

编程日记 2024/6/3 21:53:48

Unity功能——通过按键设置物体朝左/右旋转（含C#转xlua版）

博文简介&#xff1a; 开发场景&#xff1a;unity的3d场景&#xff1b; 功能&#xff1a;当设定的键被按下时&#xff0c;进行物体朝左/右旋转&#xff1b; 适用范围&#xff1a;本文代码适用于设置3d物体朝左右旋转&#xff0c;也适用于设置UI对象朝左右旋转&#xf…...

编程日记 2024/6/3 21:52:47

泛微ecology开发修炼之旅

我将多年泛微ecology开发经验&#xff0c;进行了总结&#xff0c;然后分享给大家。 泛微开发修炼之旅 泛微开发修炼之旅--01搭建开发环境 泛微开发修炼之旅--02开发接口demo 泛微开发修炼之旅--03常用数据表结构讲解 泛微开发修炼之旅--04常用数据库操作工具类封装 。。。。 我…...

编程日记 2024/6/3 21:49:43

PostgreSQL的视图pg_locks

PostgreSQL的视图pg_locks pg_locks 是 PostgreSQL 提供的系统视图&#xff0c;用于显示当前数据库中的锁信息。通过查询这个视图&#xff0c;数据库管理员可以监控锁的使用情况&#xff0c;识别潜在的锁争用和死锁问题&#xff0c;并优化数据库性能。 pg_locks 视图字段说明…...

编程日记 2024/6/3 21:48:42

元宇宙NFG结合IPO线上营销模型合理降税

在当今快速演进的互联网和区块链技术背景下&#xff0c;我们见证了从移动端购物到区块链热潮&#xff0c;再到如今市场竞争日趋激烈的变革。尤其是在2024年这个关键节点&#xff0c;许多平台为了吸引用户&#xff0c;推出了各种创新的商业模式。然而&#xff0c;如何在这样的环…...

编程日记 2024/6/3 21:46:40

Python打印当前目录下，所有文件名的首字母

代码如下&#xff1a; #!/usr/bin/env python3 """ 按顺序打印当前目录下&#xff0c;所有文件名的首字母&#xff08;忽略大小写&#xff09; """ import sys from pathlib import Pathdef main() -> None:ps Path(__file__).parent.glob(…...

编程日记 2024/6/3 21:45:38

程序员应该有什么职业素养？

程序员的六大职业素养&#xff1a;构建成功职业生涯的基石 在不断变化的技术世界中&#xff0c;程序员不单要保持技术的锋利&#xff0c;也需要培养相应的职业素养&#xff0c;这些素养在很大程度上决定了一个程序员的职业生涯能否走得长远。以下是我认为最为重要的六大职业素…...

编程日记 2024/6/3 21:41:35

【PostgreSQL17新特性之-冗余IS [NOT] NULL限定符的处理优化】

在执行一个带有IS NOT NULL或者NOT NULL的SQL的时候&#xff0c;通常会对表的每一行&#xff0c;都会进行检查以确保列为空/不为空&#xff0c;这是符合常理的。 但是如果本身这个列上有非空&#xff08;NOT NULL&#xff09;约束&#xff0c;再次检查就会浪费资源。甚至有时候…...

编程日记 2024/6/3 21:38:31

Flink的简单学习二

一 Flink的核心组件 1.1 client 1.将数据流程图DataFlow发送给JobManager。 1.2 JobManager 1.收集client的DataFlow图&#xff0c;将图分解成一个个的task任务&#xff0c;并返回状态更新数据给client 2.JobManager负责作业调度&#xff0c;收集TaskManager的Heartbeat和…...

编程日记 2024/6/3 21:35:27

如何提高员工的工作主动性？

在现代竞争激烈的商业环境中&#xff0c;拥有高度主动性的员工是每个组织所追求的目标。主动性不仅能够促进员工的个人成长&#xff0c;还可以提升团队的效率和创新力。因此&#xff0c;如何提高员工的工作主动性成为了企业管理者需要关注的重要问题。那么如何培养和激发员工的…...

编程日记 2024/6/3 21:34:26

FFmpeg PCM编码为AAC

使用FFmpeg库把PCM文件编码为AAC文件&#xff0c;FFmpeg版本为4.4.2-0 代码如下&#xff1a; #include <stdio.h> #include <stdlib.h> #include <string.h> #include <libavcodec/avcodec.h> #include <libavformat/avformat.h> #include <…...

编程日记 2024/6/3 21:33:25

React@16.x（16）Render Props

目录 1&#xff0c;问题描述2&#xff0c;解决方式2.1&#xff0c;Render Props2.2&#xff0c;HOC 3&#xff0c;使用场景 1&#xff0c;问题描述 当使用组件时&#xff0c;标签中的内容&#xff0c;会被当做 props.children 来渲染&#xff1a; 子组件&#xff1a; import…...

编程日记 2024/6/3 21:32:23

STM32 定时器问题

stm32通用定时器中断问题 STM32 定时器有时一开启就进中断的问题 /// STM32 TIM1高级定时器RCR重复计数器的理解 /// /// /// /// /// /// /// ///...

编程日记 2024/6/3 21:31:21

CSS学习笔记目录

CSS学习笔记之基础教程&#xff08;一&#xff09; CSS学习笔记之基础教程&#xff08;二&#xff09; CSS学习笔记之中级教程&#xff08;一&#xff09; CSS学习笔记之中级教程&#xff08;二&#xff09; CSS学习笔记之中级教程&#xff08;三&#xff09; CSS学习笔记之高级…...

编程日记 2024/6/3 21:30:19

随笔-我在武汉一周了

做梦一样&#xff0c;已经来武汉一周了&#xff0c;回顾一下这几天&#xff0c;还真是有意思。 周一坐了四个小时的高铁到了武汉站&#xff0c;照着指示牌打了个出租车。司机大姐开得很快&#xff0c;瞅了眼&#xff0c;最快速度到了110&#xff0c;差点把我晃晕。一下车就感觉…...

编程日记 2024/6/3 21:28:17

Python 爬虫零基础：探索网络数据的神秘世界

Python 爬虫零基础&#xff1a;探索网络数据的神秘世界 在数字化时代&#xff0c;网络数据如同无尽的宝藏&#xff0c;等待着我们去发掘。Python爬虫&#xff0c;作为获取这些数据的重要工具&#xff0c;正逐渐走进越来越多人的视野。对于零基础的学习者来说&#xff0c;如何入…...

编程日记 2024/6/3 21:27:16

微信小程序的view的属性值和用法

在微信小程序中&#xff0c;view 是一个基础的视图组件&#xff0c;用于承载其他视图组件或者展示文本、图片等内容。view 组件具有多种属性&#xff0c;用于控制其行为和样式。以下是一些常用的 view 属性及其用法&#xff1a; class / style: 控制视图的样式&#xff0c;可以…...

编程日记 2024/6/3 21:26:14

使用VSCode开发Django指南

使用VSCode开发Django指南 一、概述 Django 是一个高级 Python 框架&#xff0c;专为快速、安全和可扩展的 Web 开发而设计。Django 包含对 URL 路由、页面模板和数据处理的丰富支持。 本文将创建一个简单的 Django 应用&#xff0c;其中包含三个使用通用基本模板的页面。在此…...

编程新知 2025/12/15 20:06:13

docker详细操作--未完待续

docker介绍 docker官网: Docker&#xff1a;加速容器应用程序开发 harbor官网&#xff1a;Harbor - Harbor 中文 使用docker加速器: Docker镜像极速下载服务 - 毫秒镜像 是什么 Docker 是一种开源的容器化平台&#xff0c;用于将应用程序及其依赖项&#xff08;如库、运行时环…...

编程新知 2025/12/15 20:23:19

【力扣数据库知识手册笔记】索引

索引 索引的优缺点 优点1. 通过创建唯一性索引&#xff0c;可以保证数据库表中每一行数据的唯一性。2. 可以加快数据的检索速度&#xff08;创建索引的主要原因&#xff09;。3. 可以加速表和表之间的连接&#xff0c;实现数据的参考完整性。4. 可以在查询过程中&#xff0c;…...

编程新知 2025/12/17 22:48:09

CentOS下的分布式内存计算Spark环境部署

一、Spark 核心架构与应用场景 1.1 分布式计算引擎的核心优势 Spark 是基于内存的分布式计算框架&#xff0c;相比 MapReduce 具有以下核心优势&#xff1a; 内存计算&#xff1a;数据可常驻内存&#xff0c;迭代计算性能提升 10-100 倍&#xff08;文档段落&#xff1a;3-79…...

编程新知 2025/12/13 22:37:00

MVC 数据库

MVC 数据库 引言 在软件开发领域，Model-View-Controller（MVC）是一种流行的软件架构模式，它将应用程序分为三个核心组件：模型（Model）、视图（View）和控制器（Controller）。这种模式有助于提高代码的可维护性和可扩展性。本文将深入探讨MVC架构与数据库之间的关系，以…...

编程新知 2025/10/30 4:58:11

【服务器压力测试】本地PC电脑作为服务器运行时出现卡顿和资源紧张（Windows/Linux）

要让本地PC电脑作为服务器运行时出现卡顿和资源紧张的情况&#xff0c;可以通过以下几种方式模拟或触发&#xff1a; 1. 增加CPU负载 运行大量计算密集型任务&#xff0c;例如&#xff1a; 使用多线程循环执行复杂计算&#xff08;如数学运算、加密解密等&#xff09;。运行图…...

编程新知 2025/11/30 10:30:15

Caliper 配置文件解析：config.yaml

Caliper 是一个区块链性能基准测试工具，用于评估不同区块链平台的性能。下面我将详细解释你提供的 fisco-bcos.json 文件结构，并说明它与 config.yaml 文件的关系。 fisco-bcos.json 文件解析 这个文件是针对 FISCO-BCOS 区块链网络的 Caliper 配置文件，主要包含以下几个部…...

编程新知 2025/8/13 13:40:18

Python 包管理器 uv 介绍

Python 包管理器 uv 全面介绍 uv 是由 Astral&#xff08;热门工具 Ruff 的开发者&#xff09;推出的下一代高性能 Python 包管理器和构建工具&#xff0c;用 Rust 编写。它旨在解决传统工具&#xff08;如 pip、virtualenv、pip-tools&#xff09;的性能瓶颈&#xff0c;同时…...

编程新知 2025/12/12 23:11:21

怎么让Comfyui导出的图像不包含工作流信息，

为了数据安全&#xff0c;让Comfyui导出的图像不包含工作流信息&#xff0c;导出的图像就不会拖到comfyui中加载出来工作流。 ComfyUI的目录下node.py 直接移除 pnginfo&#xff08;推荐&#xff09;​​ 在 save_images 方法中&#xff0c;​​删除或注释掉所有与 metadata …...

编程新知 2025/8/13 15:12:54

关于uniapp展示PDF的解决方案

在 UniApp 的 H5 环境中使用 pdf-vue3 组件可以实现完整的 PDF 预览功能。以下是详细实现步骤和注意事项&#xff1a; 一、安装依赖 安装 pdf-vue3 和 PDF.js 核心库&#xff1a; npm install pdf-vue3 pdfjs-dist二、基本使用示例 <template><view class"con…...

编程新知 2025/9/18 20:16:52