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

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

目录

  • 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 从详情页到预约页总结 用户在浏览家政小程序的具体服务时,如果希望预约的,可以在详情页点击立即预约按钮,填写具体的信息,方便家政…...

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

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

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…...

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

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

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

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

泛微ecology开发修炼之旅

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

PostgreSQL的视图pg_locks

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

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

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

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

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

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

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

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

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

Flink的简单学习二

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

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

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

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 <…...

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…...

STM32 定时器问题

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

CSS学习笔记目录

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

随笔-我在武汉一周了

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

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

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

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

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

Apifox供应链投毒攻击--完整解析

&#x1f534; 安全应急通告&#xff1a;Apifox 桌面端供应链投毒与高危凭证窃取事件 一、 事件概述 近期监测到 Apifox 公网 SaaS 版桌面客户端遭遇严重的供应链投毒攻击。攻击者通过劫持合法的运行追踪模块&#xff0c;向用户下发具备凭证窃取、动态执行与持久化能力的恶意 J…...

Spring Boot 基础学习笔记

Spring Boot 基础学习笔记 一、Spring Boot 概述 1. 定义 Spring Boot 是 Pivotal 团队基于 Spring 框架开发的快速开发脚手架&#xff0c;核心宗旨是简化 Spring 应用的初始化搭建和开发流程&#xff0c;通过「约定优于配置」的思想&#xff0c;大幅减少 XML 配置和繁琐的依…...

基于博途1200PLC+HMI的六层三部电梯控制系统仿真程序

基于博途1200PLCHMI六层三部电梯控制系统仿真 程序&#xff1a; 1、任务&#xff1a;PLC.人机界面控制三部电梯集群运行 2、系统说明&#xff1a; 系统设有上呼、下呼、内呼、手动开关门、光幕、检修、故障、满载、等模拟模式控制&#xff0c; 系统共享厅外召唤信号&#xff0c…...

Ostrakon-VL-8B零售AI创新:用像素游戏化设计提升一线员工使用意愿

Ostrakon-VL-8B零售AI创新&#xff1a;用像素游戏化设计提升一线员工使用意愿 1. 项目背景与设计理念 在零售和餐饮行业&#xff0c;一线员工使用AI工具的意愿往往不高。传统工业级UI界面过于复杂&#xff0c;操作流程繁琐&#xff0c;导致员工抵触新技术。Ostrakon-VL-8B团队…...

ComfyUI ControlNet模型与预处理器搭配秘籍:提升AI绘画精度的关键技巧

ComfyUI ControlNet模型与预处理器搭配秘籍&#xff1a;提升AI绘画精度的关键技巧 在AI绘画领域&#xff0c;ControlNet已经成为精细控制图像生成的重要工具。对于已经熟悉ComfyUI基础操作的用户来说&#xff0c;掌握ControlNet模型与预处理器的搭配技巧&#xff0c;是突破创作…...

如何免费使用Pyfa:EVE Online舰船配置终极实用指南

如何免费使用Pyfa&#xff1a;EVE Online舰船配置终极实用指南 【免费下载链接】Pyfa Python fitting assistant, cross-platform fitting tool for EVE Online 项目地址: https://gitcode.com/gh_mirrors/py/Pyfa Pyfa&#xff08;Python Fitting Assistant&#xff09…...

数字创世神:用漏洞规律操控现实

在古老的神话中&#xff0c;数字“一”象征着万物的起源与开端&#xff0c;是混沌初开、宇宙诞生的起点。伏羲一画开天&#xff0c;划分乾坤&#xff0c;自此有了天地与秩序。这种从无到有、从一到多的创世过程&#xff0c;与当今数字世界的构建有着惊人的同构性。在由代码构筑…...

LeetCode 热题 100(每日两题)-Day2

坚持打卡第二天&#xff01;昨天的哈希表大显神威&#xff0c;今天我们将继续探索哈希集合的妙用&#xff0c;并引入数组操作中极其重要的技巧——双指针&#xff08;快慢指针&#xff09;。一、最长连续序列LeetCode 第 128 题&#xff0c;难度中等。这道题的难点在于题目强制…...

全知视角与隐私边界的冲突

当测试工程师扮演“上帝视角”时&#xff0c;数据采集的伦理红线成为首要挑战。金融软件测试中&#xff0c;为复现键盘劫持漏洞需记录用户输入轨迹&#xff1b;医疗系统验证需模拟真实患者数据流。这种全知能力却暗藏致命陷阱——某电商平台测试环境因未彻底脱敏&#xff0c;导…...

搞点氢能,再算算碳税:聊聊综合能源系统的热电优化

考虑阶梯式碳机制与电制氢的综合能源系统热电优化 “双碳”背景下&#xff0c;为提高能源利用率&#xff0c;优化设备的运行灵活性&#xff0c;进一步降低综合能源系统&#xff08;IES&#xff09;的碳排放水平&#xff0c;提出一种IES低碳经济运行策略 首先考虑IES参与到碳市场…...