请选择 进入手机版 | 继续访问电脑版

数字之家

 找回密码
 立即注册

扫一扫,访问微社区

QQ登录

只需一步,快速开始

搜索
热搜: 活动 交友 discuz
查看: 3742|回复: 0

小程序时间预约

[复制链接]

514

主题

519

帖子

2426

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
2426
admin实名认证 发表于 2019-12-11 11:32:02 | 显示全部楼层 |阅读模式
20180605104820824.gif
  1. Page({
  2.     data: {
  3.         //日期
  4.         timeList: [],
  5.         //可预约天数
  6.         yyDay:30,
  7.         //预约时间段
  8.         hourList: [ {hour: "8:00",n: 8,isShow: true},
  9.                     {hour: "9:00",n: 9,isShow: true},
  10.                     {hour: "10:00",n: 10,isShow: true},
  11.                     {hour: "12:00",n: 11,isShow: true},
  12.                     {hour: "13:00",n: 13,isShow: true},
  13.                     {hour: "14:00",n: 14,isShow: true},
  14.                     {hour: "15:00",n: 15,isShow: true},
  15.                     {hour: "16:00",n: 16,isShow: true},
  16.                     {hour: "17:00",n: 17,isShow: true},
  17.                     {hour: "18:00",n: 18,isShow: true},
  18.                     {hour: "19:00",n: 19,isShow: true}
  19.         ],
  20.         //是否显示
  21.         timeShow: false,
  22.         currentTab: 0,
  23.         //选择时间
  24.         chooseHour: "",
  25.         //选择日期
  26.         chooseTime: "",
  27.         hourIndex: -1
  28.     },
  29.     //弹出按钮
  30.     showTimeModel: function () {
  31.         this.setData({
  32.             timeShow: !this.data.timeShow,
  33.             chooseTime: this.data.timeList[0].date,
  34.         });
  35.     },
  36.     //点击外部取消
  37.     modelCancel: function () {
  38.         this.setData({
  39.             timeShow: !this.data.timeShow,
  40.             chooseTime: this.data.timeList[0].date,
  41.         });
  42.     },
  43.     //日期选择
  44.     timeClick: function (e) {
  45.         //非今天-不判断超过当前时间点(所有时间点都可选择)
  46.         if (e.currentTarget.dataset.index != 0) {
  47.             var list = this.data.hourList;
  48.             for (var i = 0; i < list.length; i++) {
  49.                 list[i].isShow = true;
  50.             }
  51.             this.setData({
  52.                 hourList: list
  53.             })
  54.         } else {
  55.             //今天-过时不可预约
  56.             var hour = new Date().getHours();
  57.             for (var i = 0; i < this.data.hourList.length; i++) {
  58.                 var list = this.data.hourList;
  59.                 if (this.data.hourList[i].n <= hour) {
  60.                     list[i].isShow = false;
  61.                     this.setData({
  62.                         hourList: list
  63.                     })
  64.                 }
  65.             }
  66.         }
  67.         this.setData({
  68.             currentTab: e.currentTarget.dataset.index,
  69.             chooseTime: this.data.timeList[e.currentTarget.dataset.index].date,
  70.             chooseHour: "",
  71.             hourIndex: -1
  72.         });
  73.         console.log(this.data.chooseTime)
  74.     },
  75.     // 时间选择
  76.     hourClick: function (e) {
  77.         var that = this;
  78.         // 时间不可选择
  79.         if (!e.currentTarget.dataset.isshow) {
  80.             return false;
  81.         }
  82.         this.setData({
  83.             hourIndex: e.currentTarget.dataset.index,
  84.             chooseHour: this.data.hourList[e.currentTarget.dataset.index].hour
  85.         });
  86.         var chooseTime = new Date().getFullYear() + "-" + this.data.chooseTime + " " + this.data.chooseHour
  87.         console.log(chooseTime)
  88.     },
  89.     onLoad: function (options) {
  90.         Date.prototype.Format = function (format) {
  91.             var o = {
  92.                 "M+": this.getMonth() + 1,  //month
  93.                 "d+": this.getDate(),     //day
  94.                 "h+": this.getHours(),    //hour
  95.                 "m+": this.getMinutes(),  //minute
  96.                 "s+": this.getSeconds(), //second
  97.                 "q+": Math.floor((this.getMonth() + 3) / 3),  //quarter
  98.                 "S": this.getMilliseconds() //millisecond
  99.             }
  100.             if (/(y+)/.test(format)) {
  101.                 format = format.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
  102.             }
  103.             for (var k in o) {
  104.                 if (new RegExp("(" + k + ")").test(format)) {
  105.                     format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length));
  106.                 }
  107.             }
  108.             return format;
  109.         }
  110.         Date.prototype.DateAdd = function (interval, number) {
  111.             number = parseInt(number);
  112.             var date = new Date(this.getTime());
  113.             switch (interval) {
  114.                 case "y": date.setFullYear(this.getFullYear() + number); break;
  115.                 case "m": date.setMonth(this.getMonth() + number); break;
  116.                 case "d": date.setDate(this.getDate() + number); break;
  117.                 case "w": date.setDate(this.getDate() + 7 * number); break;
  118.                 case "h": date.setHours(this.getHours() + number); break;
  119.                 case "n": date.setMinutes(this.getMinutes() + number); break;
  120.                 case "s": date.setSeconds(this.getSeconds() + number); break;
  121.                 case "l": date.setMilliseconds(this.getMilliseconds() + number); break;
  122.             }
  123.             return date;
  124.         }
  125.         var dateList = [];
  126.         var now = new Date();
  127.         for (var i = 0; i < this.data.yyDay; i++) {
  128.             var d = {};
  129.             var day = new Date().DateAdd('d', i).getDay();
  130.             if (day == 1) { var w = "周一" }
  131.             if (day == 2) { var w = "周二" }
  132.             if (day == 3) { var w = "周三" }
  133.             if (day == 4) { var w = "周四" }
  134.             if (day == 5) { var w = "周五" }
  135.             if (day == 6) { var w = "周六" }
  136.             if (day == 0) { var w = "周日" }
  137.             d.name = w;
  138.             d.date = new Date().DateAdd('d', i).Format("MM-dd");
  139.             dateList.push(d)
  140.         }
  141.         this.setData({
  142.             timeList: dateList
  143.         });
  144.         //初始化判断
  145.         //当前时间
  146.         var hour = new Date().getHours();

  147.         for (var i = 0; i < this.data.hourList.length; i++) {
  148.             var list = this.data.hourList;
  149.             //过时不可选
  150.             if (this.data.hourList[i].n <= hour) {
  151.                 list[i].isShow = false;
  152.                 this.setData({
  153.                     hourList: list
  154.                 })
  155.             }
  156.         }
  157.     },
  158. })
复制代码
demo下载:
httpchc320321-small_program_time_selection-master.zip (6.87 KB, 下载次数: 0)
maomivip@mail.com
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|小黑屋|赢创志诚服务网 ( 鲁ICP备19000917号 )

GMT+8, 2020-9-28 03:41 , Processed in 0.063274 second(s), 23 queries .

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表