小程序开发——选座小程序

GitHub仓库下载教程，或者关注公众号『君王羔羊』获取源代码

 const db = wx.cloud.database()
 const _ = db.command
    db.collection('seats').doc(_.and(
    [
	  { row:"2"},
	  {column: '2'}
	])).update(
	{
  	 data: {
     status:"booked"
  },
})

1、每人最多选一个座位

if (this.data.selectSeatList.length == 2) {
              wx.showToast({
                title: '最多选择1个座位',
                icon: 'none',
                duration: 1000,
                mask: true
              })

let seatInfo = item.column + "排" + item.row + "座";
            this.remove(seatInfo);

let seatInfo = item.column + "排" + item.row + "座";
              seat.seatInfo = seatInfo;
              seat.x = item.row;
              seat.y = item.column;
              seat.index = item.row + item.column;
              this.data.selectSeatList.push(seat);

remove(val) {
    for (var a = 0; a < this.data.selectSeatList.length; a++) {
      if (this.data.selectSeatList[a].seatInfo == val) {
        this.data.selectSeatList.splice(a, 1);
        break;
      }
    }
    this.setData({
      selectSeatList: this.data.selectSeatList
    })
  },

2、提交时至少选择一个座位

submit() {
    if (this.data.selectSeatList.length == 0) {
      wx.showToast({
        title: '请选择一个座位',
      })
    }else{

3、踩坑：点击3排1列时，结果却选中了3排2列

解决：对数据库数据排序

db.collection('seats').orderBy('row','asc').orderBy('column','asc').get().then(res => {
    this.setData({
      seats: res.data
    })

4、小程序一次只能获取20条数据，导致只能显示20个座位

4.1云函数一次性可获取100条数据，但是部署云函数报错
小程序云开发，报错未找到函数版本，请创建后再试？
修改云函数需要删除云端函数再重新部署，不删除部署报错
4.2如何获取大于100条的数据
理解异步之美— Promise与async await（一）
云数据库超过100条数据如何显示

exports.main = async (event, context) => {
  // 先取出集合记录总数
  const countResult = await db.collection('todos').count()
  const total = countResult.total
  // 计算需分几次取
  const batchTimes = Math.ceil(total / 100)
  // 承载所有读操作的 promise 的数组
  const tasks = []
  for (let i = 0; i < batchTimes; i++) {
    const promise = db.collection('todos').skip(i * MAX_LIMIT).limit(MAX_LIMIT).get()
    tasks.push(promise)
  }
  // 等待所有
  return (await Promise.all(tasks)).reduce((acc, cur) => {
    return {
      data: acc.data.concat(cur.data),
      errMsg: acc.errMsg,

5、显示剩余座位

微信小程序对JSON处理-数据的筛选

 let space = this.data.seats.filter((p)=>{
        return p.status=="ok"
      })
      console.log(space.length)

JS中的let和var的区别

6、输入密码进入管理员后台

小程序密码输入框

if(this.data.password=="123456"){
  wx.navigateTo({
    url: '../administrator/administrator',
  })
}else{
  wx.showToast({
    title: '密码错误',
  })

7、用户取消预约

删除数据库记录删除不了
js 数组与对象的区别
小程序批量删除云数据库里的数据

8、查看用户是否已预约

const db = wx.cloud.database()
    const _ = db.command
    db.collection('user').where({
      _openid: this.data.openid
    }).get({
      success: res => {
        if(res.data==""){
          console.log("用户不存在")
        }
        else{
          console.log("用户存在")
        }

9、提交时，查看是否有人同时选择同一个座位

自定义toast图片
./ 当前目录。
…/ 父级目录。
/ 根目录