预约小程序多选修改——思路分享

预约小程序——多选的修改

  • 预约小程序模版的来源：yunzizyy/ZixiAppt:
  • 在这个小程序上做了较多的修改（补充了丢失的代码、二维码签到、惩罚封禁机制、多选时间段和设置日期），其中有一个涉及到了时间段选择中的多选功能的添加，分享给大家。
  • 部署这个小程序还遇到了隐私协议的问题，随便也解决了。
  • 不过后面个人开发版无法带后台管理系统，有点尴尬，只能将它放在体验版里（ps：明明之前还通过审核了，后面还是不行）。
  • 因为小程序在使用中，就不公开具体源码了（大佬求放过）。

1.在点击选择时间段界面

  • 天数改为15天

  • 点击时间段实现多选（变色前先检查能否预约、预约人数是否已满）

  • //miniprogram\behavior\meet_detail_bh.js
//原本从meet中获取时间段
let time = this.data.meet.MEET_DAYS_SET[dayIdx].times[timeIdx];
//在通过meetid和时间段的mark定位到预约的时间段
let meetId = this.data.id;
let timeMark = time.mark;
//bindCommitTimeTap函数中用过数组的方式存储多个timeMark实现多个存储

2.在座位选择界面

  • 根据上个界面传入的参数（变成字符串类型），在detailForJoin函数中对timeMark转换为timeMarks（数组类型）

  • 在默认detailForJoin函数中

    原本的参数

    在这里插入图片描述
    后面的参数

    • list：list的生成需要用到的参数有：timeMark

      let whereAll = {JOIN_MEET_ID: meetId,JOIN_MEET_TIME_MARK: timeMark,JOIN_STATUS: JoinModel.STATUS.SUCC}

      因此需要循环遍历timeMarks，获取多个list

    • dayDesc：dayDesc的生成需要用到的参数有：meet, timeMark。但是meet不同循环遍历获得

       		let dayDesc = timeUtil.fmtDateCHN(this.getDaySetByTimeMark(meet, timeMark).day);let timeSet = this.getTimeSetByTimeMark(meet, timeMark);let timeDesc = timeSet.start + '～' + timeSet.end;meet.dayDesc = dayDesc + ' ' + timeDesc;

    • meet.MEET_DAYS_SET ：主要是自习室的某天下所有时间段的详细信息，仅是为了获得limit和isLimit两个参数，感觉可以不用遍历。而且这个参数在前端页面好像也没用。

      meet.MEET_DAYS_SET = await this.getDaysSet(meetId, day, day);let times = meet.MEET_DAYS_SET[0].timeslet matchedTime = times.find(time => time.mark === timeMark);if (matchedTime) {var limit = matchedTime.limit;var isLimit = matchedTime.isLimit;} else {console.log("未找到匹配的 timeMark");}

      成功返回数据。（MEET_DAYS_SET无法使用，因为只保留的最后一天的数据，后续使用需要修改代码）

      在这里插入图片描述

  • 更改时间段显示页面为下拉框——方便显示更多的时间段在这里插入图片描述

    将更改时间段改为标题处：data-type=“back”，代表返回是上一个界面，一定要带上，否则仅带bindtap="url"是不行的。

    另外data-type=“back”，将会将type='back’这个参数传入元素的e.currentTarget.dataset.type变量中

    <view class="form-group" bindtap="url" data-type="back">

    下拉框设置参考个人信息的学院设置，把select功能去掉即可

    <view class="form-group"><view class="title">*学院</view><cmpt-picker class="selected-school" sourceData="{{schoolList}}" bind:select="schoolPickerChange" data-type="picker" data-item="formschool" model:value="{{formschool}}" item="{{formschool}}"></cmpt-picker></view>

    <view class="form-group"><view class="title text-cut" style="padding-right:0"><text class="icon-calendar margin-right-xxs"></text><text style="margin-left: 10px;">所有日期：</text></view><cmpt-picker  style="font-weight: bold;margin-right: 10px;" sourceData="{{meet.dayDesc}}" bind:select="" data-type="picker" data-item="dayDesc" model:value="{{meet.dayDesc[0]}}" item="{{meet.dayDesc[0]}}"></cmpt-picker> </view>

在这里插入图片描述

3.批量预约

  • 将传入的timamark变为数组再批量插入预约

    await DayModel.insertBatch(days);
// "cmpt-calendar": "../../../../../miniprogram/cmpts/public/calendar/calendar_comm/calendar_comm_cmpt"
// "cmpt-calendar": "../../../../../cmpts/public/calendar/calendar_comm/calendar_comm_cmpt"

    bug：预约成功后在我的预约中显示的是两个相同的预约记录（时间相同）

    解决

    • 发现了在插入之前，data的JOIN_MEET_TIME_MARK是一样的，根本没变过

    • node在前面进行了定义，应该在循环内部定义

    • 下面代码放入循环内部

    • let node = {JOIN_USER_ID: userId,JOIN_MEET_ID: meetId,JOIN_STUDENT_ID: user.USER_STUDENT_ID,JOIN_CHOOSE_SEAT: chooseSeat,JOIN_FORMS: forms,JOIN_STATUS: JoinModel.STATUS.SUCC,JOIN_CODE: dataUtil.genRandomIntString(15),JOIN_Handled: false};

4.返回数据的处理

  • 返回数据中data含有多个预约node数据

    try {await cloudHelper.callCloudSumbit('meet/join', params, opts).then(res => {if (res.data) {let joindata = res.dataconsole.log('joindata', joindata)let opts = {hint: false}cloudHelper.callCloudSumbit('meet/join_notice', joindata, opts)let content = '预约成功！'wx.showModal({title: '温馨提示',showCancel: false,content,success() {let ck = () => {wx.reLaunch({url: pageHelper.fmtURLByPID('/pages/my/join_detail/my_join_detail?flag=home&id='),})}ck();}})}})} catch (err) {console.log(err);// 重新渲染数据this._loadDetail();};

  • 用res接收返回的数据，发送到模版中并且跳转到相应的界面（将跳转到我的预约中，而不是专门某个预）

    wx.reLaunch({url: pageHelper.fmtURLByPID('/pages/my/join_detail/my_join_detail?flag=home'),})wx.reLaunch({url: pageHelper.fmtURLByPID('/pages/my/join/my_join'),})

  • 预约模版中，利用joindata中的data数据进行模版渲染(后续可能需要修改一下字段，日期这边尽量改成字段或者数组)

    cloudHelper.callCloudSumbit('meet/join_notice', joindata, opts)const cloud = CLOUD.getCloud()let input = this._request;console.log('joinNotice传参input',input)try {const result = await cloud.openapi.subscribeMessage.send({touser:input.data[0].JOIN_USER_ID, //要推送给那个用户page: input.url, //要跳转到那个小程序页面data: {//推送的内容number20: {value: input.data[0].JOIN_STUDENT_ID},date3: {value: input.data[0].JOIN_MEET_DAY},thing46: {value: input.data[0].JOIN_CHOOSE_SEAT},phrase14: {value: '预约成功'},thing8: {value: '预约须提前两小时取消!'},},templateId: '8EquXUUczt7ZFvSL-Qst_vVkRkeJqcUQKia6a6X6j1Y' //模板id})

5.多选时，取消时间段不需要进行before_join校验

//变色时通过一个selected属性来确定的
timesArray[j].selected = false;
//因此后面改变时，需要判断点击后是否为false就好了

6.修改了一下选项框的css样式

7.调整

  • 模版消息中，当日期是多个时，在日期后加~符号或者…

    value: input.data[0].JOIN_MEET_DAY+'~'+input.data[input.data.length - 1].JOIN_MEET_DAY

  • 放出日期中设置放15天给学生进行预约（完成）

  • 设置三个自习室进行预约，座位数分别是20、28、25

8.配置云函数的新版本进行灰度测试

云函数的新版本：注意，创建新版本后，原来的版本会被冻结为版本1，latest版本在更新云函数之前和版本1一致，但是后面更新云函数后会导致latest版本更新

云函数和体验版的关系：体验版和正式版分别有一整套源码，但是他们调用的云函数都是一样的（所以要对云函数进行流量分配，如果是正式版调用的应该是之前的版本1的云函数，而如果是体验版调用的是latest版本云函数）

9.上传体验版本

上传完体验版本后，还要记得更新云函数。上传版本主要是对除了云函数外的修改进行提交，仅上传体验版本是无法实现对云函数的更改的！！！

10.审核中的要求

个人信息收集

  1. 去除进入小程序就要注册的限制，改成进行预约时要进行限制（注释掉app.js的校验代码）

    // 去除进入小程序就要注册的限制/* let opts = {title: 'bar'}this.globalData.userNotExist = true;// 保证异步操作完成后再设置 globalDatareturn cloudHelper.callCloudData('passport/my_detail', {}, opts).then(user => {if (!user) {this.globalData.userNotExist = true;return pageHelper.showModal('首次使用小程序必须先注册');}else{this.globalData.userNotExist =false;}}).catch(error => {console.error('Error calling cloud function:', error);}) */// 如果用户不存在// 去除进入小程序就要注册的限制/* if (this.globalData.userNotExist) {wx.switchTab({url: 'projects/A00/my/index/my_index'});} */

  2. 在预约时再进行校验beforejoin（已完成），未注册的跳转到注册界面（或者修改信息界面）

    if (res.data.result === 1500) {pageHelper.showModal(res.data.msg, '温馨提示', function(res) {wx.reLaunch({url: pageHelper.fmtURLByPID('/pages/my/edit/my_edit'),});});

  3. 每次跳转到修改个人信息界面时，都要弹出隐私协议，引导用户同意，不同意则回到主页面

    • 下载隐私界面弹窗组件并引入

      <privacy-popup bind:agree="agree" bind:disagree="disagree"></privacy-popup>

    • 同意才允许点击，否则点击按钮报错（否则人家都提交了）

    • 不同意则回到主页面（跳转）

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.xdnf.cn/news/756.html

如若内容造成侵权/违法违规/事实不符，请联系一条长河网进行投诉反馈，一经查实，立即删除！

相关文章

PostgreSQL核心揭秘(二)-进程和内存架构

PostgreSQL核心揭秘(二)-进程和内存架构

目录 1、进程架构2、进程架构图 3、内存架构 4、内存架构图 PostgreSQL 的进程架构采用了一个多进程的设计&#xff0c;这使其能够有效地管理并发连接和资源。以下是 PostgreSQL 的主要进程架构组成部分的详细描述&#xff1a; 1. 主进程&#xff08;Postmaster&#xff09; 功…
阅读更多...
pta题目

pta题目

1.查询至少生产两种不同的计算机(PC或便携式电脑)且机器速度至少为133的厂商 AC: select distinct(pd.maker) --去重查询 from product pd where pd.type in (个人电脑, 便携式电脑) --题目上要求的&#xff0c;至少一个&#xff0c;in是从里面选择 and --这里也是model其实相…
阅读更多...
【Effective C++】阅读笔记2

【Effective C++】阅读笔记2

1. 复制对象时要保证复制内容完整性 错误场景复现&#xff08;没有复制基类部分&#xff09; 如果一个类中包含多个成员变量或者继承了基类&#xff0c;那么在拷贝构造函数或者赋值运算符中&#xff0c;必须保证所有成员的基类部分被复制。 基类没有被复制&#xff0c;这样就都…
阅读更多...
线程基础知识、jmm（Java内存模型）

线程基础知识、jmm（Java内存模型）

目录 线程基础知识 并发与并行 进程和线程 线程优先级 创建线程的方式主要有三种 休眠 作出让步 join() 方法 线程协作注意什么 理解线程状态 选择合适的协作工具 共享资源的访问控制 避免竞争条件 创建线程几种方式 线程状态&#xff0c;状态之间切换 新建&…
阅读更多...
计算机毕业设计Spark+大模型股票推荐系统 股票预测系统 股票可视化 股票数据分析 量化交易系统 股票爬虫 股票K线图 大数据毕业设计 AI

计算机毕业设计Spark+大模型股票推荐系统 股票预测系统 股票可视化 股票数据分析 量化交易系统 股票爬虫 股票K线图 大数据毕业设计 AI

温馨提示&#xff1a;文末有 CSDN 平台官方提供的学长联系方式的名片&#xff01; 温馨提示&#xff1a;文末有 CSDN 平台官方提供的学长联系方式的名片&#xff01; 温馨提示&#xff1a;文末有 CSDN 平台官方提供的学长联系方式的名片&#xff01; 作者简介&#xff1a;Java领…
阅读更多...
MyBatis-Plus快速入门：从安装到第一个Demo

MyBatis-Plus快速入门：从安装到第一个Demo

一、前言 在现代 Java 应用程序中&#xff0c;数据访问层的效率与简洁性至关重要。MyBatis-Plus 作为 MyBatis 的增强工具&#xff0c;旨在简化常见的数据操作&#xff0c;提升开发效率。它提供了丰富的功能&#xff0c;如自动生成 SQL、条件构造器和简单易用的 CRUD 操作&…
阅读更多...
零基础Java第十二期：类和对象（三）

零基础Java第十二期：类和对象（三）

目录 一、static成员&#xff08;补&#xff09; 1.1. static修饰成员方法 1.2. static成员变量初始化 二、代码块 2.1. 静态代码块和实例代码块 ​三、对象的打印 一、static成员&#xff08;补&#xff09; 1.1. static修饰成员方法 public class Linear {public st…
阅读更多...
Topaz Video AI for Mac 视频无损放大软件安装教程【保姆级，操作简单轻松上手】

Topaz Video AI for Mac 视频无损放大软件安装教程【保姆级，操作简单轻松上手】

Mac分享吧 文章目录 Topaz Video AI for Mac 视频无损放大软件 安装完成&#xff0c;软件打开效果一、Topaz Video AI 视频无损放大软件 Mac电脑版——v5.3.5⚠️注意事项&#xff1a;1️⃣&#xff1a;下载软件2️⃣&#xff1a;安装软件&#xff0c;将安装包从左侧拖入右侧文…
阅读更多...
Java基础语法①Java特点和环境安装

Java基础语法①Java特点和环境安装

目录 1. Java的概念和用途 1.1 Java的概念和发展史 1.2 Java的重要性 1.3 Java的特点 2. Java环境 2.1 JVM 和 JDK 2.2 Java环境安装 2.3 安装IntelliJ IDEA并使用 写在前面&#xff1a;本人已经学习了C/C方向的内容&#xff0c;大二结束找到实习回学校后还有时间&…
阅读更多...
atest v0.0.18 提供了强大、灵活的 HTTP API Mock 功能

atest v0.0.18 提供了强大、灵活的 HTTP API Mock 功能

atest 发布 v0.0.18 atest 是致力于帮助开发者持续保持高质量 API 的开源接口工具。 你可以在命令行终端或者容器中启动&#xff1a; docker run -p 8080:8080 ghcr.io/linuxsuren/api-testing:v0.0.18 亮点 在开源之夏 2024 中 atest 增加了基于 MySQL 的测试用例历史的支持HT…
阅读更多...
ele-table表格列表内，双击编辑部分信息（el-table组件同理）

ele-table表格列表内，双击编辑部分信息（el-table组件同理）

说明 ele-table 为公司内部组件&#xff0c;重点看 【主要代码】 部分代码 ele-table表格列表内&#xff1a;双击需要编辑的区域&#xff0c;编辑部分信息 实现 双击需要编辑的数据&#xff0c;展示输入框/日期选择&#xff0c; 展示输入框&#xff1a;修改完之后&#xff0c;按…
阅读更多...
开源的GPT-4o模型使用指南，Mini-Omni2集视觉、语音和双工能力于一体的

开源的GPT-4o模型使用指南，Mini-Omni2集视觉、语音和双工能力于一体的

1. Mini-Omni2 是什么&#xff1f; Mini-Omni2 是一个开源的多模态语言模型&#xff0c;旨在模拟 GPT-4o 的视觉、语音和文本处理能力。它能够理解和生成视觉、听觉和文本内容&#xff0c;并支持实时的语音输出和灵活的双工交互。 Mini-Omni2 由清华大学和 Inspirai 的研究人…
阅读更多...
Serverless + AI 让应用开发更简单

Serverless + AI 让应用开发更简单

本文整理自 2024 云栖大会&#xff0c;阿里云智能高级技术专家&#xff0c;史明伟演讲议题《Serverless AI 让应用开发更简单》 随着云计算和人工智能&#xff08;AI&#xff09;技术的飞速发展&#xff0c;企业对于高效、灵活且成本效益高的解决方案的需求日益增长。本文旨在…
阅读更多...
正式开源：从 Greenplum 到 Cloudberry 迁移工具 cbcopy 发布

正式开源：从 Greenplum 到 Cloudberry 迁移工具 cbcopy 发布

Cloudberry Database 作为 Greenplum 衍生版本和首选开源替代&#xff0c;由 Greenplum 原始团队成员创建&#xff0c;与 Greenplum 保持原生兼容&#xff0c;并能实现无缝迁移&#xff0c;且具备更新的 PostgreSQL 内核和更丰富的功能。GitHub: https://github.com/cloudberry…
阅读更多...
基于人工智能的搜索和推荐系统

基于人工智能的搜索和推荐系统

互联网上的搜索历史分析和用户活动是个性化推荐的基础&#xff0c;这些推荐已成为电子商务行业和在线业务的强大营销工具。随着人工智能的使用&#xff0c;在线搜索也在改进&#xff0c;因为它会根据用户的视觉偏好提出建议&#xff0c;而不是根据每个客户的需求和偏好量身定制…
阅读更多...
SpringBoot starter机制

SpringBoot starter机制

1、出现的背景 在spring boot之前&#xff0c;想要在spring中集成redis&#xff0c;需要做的事情包括&#xff1a; &#xff08;1&#xff09;引入jar包&#xff1a;包括redis的jar包&#xff0c;redis依赖的jar包&#xff0c;相应的版本&#xff0c;与spring版本是否兼容等 …
阅读更多...
在 JavaScript 中，`Array.prototype.filter` 方法用于创建一个新数组，该数组包含通过测试的所有元素

在 JavaScript 中，`Array.prototype.filter` 方法用于创建一个新数组，该数组包含通过测试的所有元素

文章目录 1、概念在你的代码中的作用示例总结 2、实战3、formattedProducts4、filteredProducts 1、概念 在 JavaScript 中&#xff0c;Array.prototype.filter 方法用于创建一个新数组&#xff0c;该数组包含通过测试的所有元素。具体来说&#xff0c;filter 方法会遍历数组中…
阅读更多...
通过源码分析类加载器里面可以加载的类

通过源码分析类加载器里面可以加载的类

类列表 每一个ClassLoader里面的类列表&#xff0c;类的数量都是固定的。 对上一节中的dex反编译 使用DexClassLoader类动态加载插件dex   利用jadx对dex进行反编译可以看到有哪些类 源码分析 BaseDexClassLoader 从BaseDexClassLoader类加载器开始分析 在BaseDexClassLoade…
阅读更多...
系统架构设计师（软考高级）一站式通关课程

系统架构设计师（软考高级）一站式通关课程

系统架构设计师&#xff08;软考高级&#xff09; 一站式通关课程 系统架构设计师&#xff08;软考高级&#xff09;教程&#xff08;三连评论分享链接&#xff01;&#xff09; &#x1f3af; 课程亮点&#xff1a; 全面覆盖&#xff1a; 从基础概念到高级应用&#xff0c;涵盖…
阅读更多...
C++ 优先算法——盛最多水的容器（双指针）

C++ 优先算法——盛最多水的容器（双指针）

目录 题目&#xff1a;盛最多水的容器 1. 题目解析 2. 算法原理 3. 代码实现 题目&#xff1a;盛最多水的容器 1. 题目解析 题目截图: 如图所示&#xff1a; 水的高度一定是由较低的那条线的高度决定的&#xff1a;例1图中&#xff0c;是由7决定的&#xff0c;然后求出…
阅读更多...
最新文章

Copyright @ 2022~2023