ittwxcust/pages/appointment/appointment.js

// pages/appointment/appointment.js
const app = getApp()
import { submitAppointment, getResetNumber, getAccountNmber } from '../../api/appointment'
Page({

  /**
   * 页面的初始数据
   */
  data: {
    isBusyDay: true,
    hasAddress: false,
    accountNumber: 0,
    addressId: '',
    address: '',
    province: '',
    city: '',
    county: '',
    timeActive: '1',
    appointmentSuccess: false, 
    curYear: '-',
    curMonth: '-',
    choseDate: '',
    weekList: [],
    backupWeekList: [],
    currentTime: '',
    currentWeek: '',
    currentYear: '',
    appusername: '',
    appuserheadimg: '',
    durationOne: false,
    durationTwo: false,
    durationThree: false
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    this.initCalendar()
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
    this.getAccountNmberFn()
    this.setData({
      appusername: app.globalData.userInfo.userName.length > 8 ? app.globalData.userInfo.userName.substring(0,4) : app.globalData.userInfo.userName,
      appuserheadimg: app.globalData.userInfo.headImg
    })
    if (app.globalData.navigateBackParams.address) {
      this.setData({
        hasAddress: true,
        address: app.globalData.navigateBackParams.address,
        contactName: app.globalData.navigateBackParams.contactName,
        contactPhone: app.globalData.navigateBackParams.contactPhone,
        addressId: app.globalData.navigateBackParams.addressId,
        province: app.globalData.navigateBackParams.province,
        city: app.globalData.navigateBackParams.city,
        county: app.globalData.navigateBackParams.county
      })
    }
  },

  // 获取当天可预约的次数
  getResetNumberFn (data) {
    var that = this
    var data = {
      province: this.data.province,
      city: this.data.city,
      county: this.data.county,
      appointmentDate: data
    }
    wx.showLoading({
      title: '加载中...',
      mask: true
    })
    getResetNumber(data).then(res => {
      wx.hideLoading()
      const response = res.data.carDurationConfigs
      console.log(response)
      response.forEach(item => {
        console.log(item);
        if (item.duration == 1) {
          that.setData({
            durationOne: item.isBusy
          })
        }
        if (item.duration == 2) {
          that.setData({
            durationTwo: item.isBusy
          })
        }
        if (item.duration == 3) {
          that.setData({
            durationThree: item.isBusy
          })
        }
      })
    }).catch(e => {
      wx.hideLoading()
      wx.showModal({
        content: e,
        confirmColor: '#333',
        showCancel: false
      })
    })
  },

  onPullDownRefresh () {
    wx.vibrateShort({
      type: 'medium'
    })
    this.getAccountNmberFn(true)
  },
  // 查询账户剩余可使用的次数
  getAccountNmberFn (pullDownRefresh = false) {
    var that = this
    wx.showLoading({
      title: '加载中...',
      mask: true
    })
    getAccountNmber({}).then(res => {
      wx.hideLoading()
      if (pullDownRefresh) {
        wx.stopPullDownRefresh()
      }
      that.setData({
        accountNumber: res.data
      })
    }).catch(e => {
      wx.hideLoading()
      wx.showModal({
        content: e,
        confirmColor: '#333',
        showCancel: false
      })
    })
  },
  // 初始化日历
  async initCalendar () {
    var that = this
    var currentDate = new Date()
    this.setData({
      currentTime: currentDate.getTime(),
      currentWeek: currentDate.getDay(),
      currentYear: currentDate.getFullYear(),
      currentDay: currentDate.getDate()
    })
    await that.createCalendarGrild(33)
    var _weekList = that.data.weekList
    _weekList.map((item, index) => {
      if (index == that.data.currentWeek) {
        item.date = that.data.currentDay
      }
    })
    that.setData({
      weekList: _weekList
    })
    // 周一开始
    if (that.data.currentWeek >= 1) { 
      that.setData({
        weekList: that.setCalendarItem()
      })
    }
    // 周日
    if (that.data.currentWeek < 1) {
      let _bankupWeekList = []
      for (let index = 0; index < 7; index++) {
        const bDate = new Date(that.data.currentTime - (index + 1) * 86400000)
        const _month = Number(bDate.getMonth() + 1) < 10 ? '0' + Number(bDate.getMonth() + 1) : bDate.getMonth() + 1
        const _day = Number(bDate.getDate()) < 10 ? '0' + bDate.getDate() : bDate.getDate()
        _bankupWeekList.unshift({
          date: bDate.getDate(),
          dateStr: bDate.getFullYear() + '-' + _month + '-' + _day,
          disabled: true,
          status: '',
          busy: false
        })
      }
      that.setData({
        backupWeekList: _bankupWeekList,
        weekList: that.setCalendarItem()
      })
    }
  },
  setCalendarItem () {
    var that = this
    console.log(this.data.currentWeek, 'that.data.currentWeek');
    console.log(that.data.weekList, 'that.data.weekList');
    var _mapWeekList = that.data.weekList
    _mapWeekList.map((item, index) => {
      const baseDate = new Date((index - that.data.currentWeek) * 86400000 + that.data.currentTime)
      const _month = Number(baseDate.getMonth() + 1) < 10 ? '0' + Number(baseDate.getMonth() + 1) : baseDate.getMonth() + 1
      const _year = baseDate.getFullYear()
      const _day = Number(baseDate.getDate()) < 10 ? '0' + baseDate.getDate() : baseDate.getDate()
      const _week = baseDate.getDay()
      item.week = _week
      if (_week == 0) {
        item.weekStr = '周日'
        item.busy = true
      }
      if (_week == 1) {
        item.weekStr = '周一'
      }
      if (_week == 2) {
        item.weekStr = '周二'
      }
      if (_week == 3) {
        item.weekStr = '周三'
      }
      if (_week == 4) {
        item.weekStr = '周四'
      }
      if (_week == 5) {
        item.weekStr = '周五'
      }
      if (_week == 6) {
        item.weekStr = '周六'
        item.busy = true
      }
      if (index > that.data.currentWeek) {
        if (index == that.data.currentWeek + 1) {
          item.date = '约满'
          item.busy = false
          item.disabled = true
          that.setData({
            curYear: _year,
            curMonth: _month,
          })
        } else {
          item.date = baseDate.getDate()
        }
        if (index == that.data.currentWeek + 2) {
           // item.active = true
           that.setData({
            choseDate: _year + '-' + _month + '-' + _day
          })
        }
        item.dateStr = _year + '-' + _month + '-' + _day
      } else {
        item.disabled = true
        item.busy = false
        item.dateStr = baseDate.getFullYear() + '-' + _month + '-' + _day
        if (index == that.data.currentWeek) {
          item.date = '约满'
          
        } else {
          item.date = baseDate.getDate()
        }
      }
    })
    return _mapWeekList
  },
  createCalendarGrild (count) {
    return new Promise((resolve, reject) => {
      var _list = []
      for (let index = 0; index < count; index++) {
        _list.push({
          date: '-',
          dateStr: '-',
          disabled: false,
          active: false,
          status: '',
          busy: false
        })
      }
      this.setData({
        weekList: _list
      })
      resolve()
    })
  },

  // 选择日期
  handleSelectDate (e) {
    if (!this.data.hasAddress) {
      wx.showToast({
        title: '请选择地址',
        icon: 'error',
        mask: true
      })
    } else {
      const disabled = e.currentTarget.dataset.disabled
      if (!disabled) {
        const cDate = e.currentTarget.dataset.date
        const index = e.currentTarget.dataset.index
        const _year = cDate.split('-')[0]
        const _month = cDate.split('-')[1]
        const _weeklist = this.data.weekList
        _weeklist.map((item, i) => {
          if (index == i ) {
            item.active = true
          } else {
            item.active = false
          }
        })
        this.setData({
          curYear: _year,
          curMonth: _month,
          weekList: _weeklist,
          choseDate: cDate
        })
        this.getResetNumberFn(cDate)
      }
    }
  },

  /**
   * 选择地址
   */
  handleChoseAddress() {
    wx.navigateTo({
      url: '/pages/address/address?form=appointment&back=1',
    })
  },
  handleChangeAddress () {
    if (!this.data.appointmentSuccess) {
      wx.navigateTo({
        url: '/pages/address/address?form=appointment&back=1',
      })
    }
  },
  handleTime (e) {
    var timeActiveIndex = e.currentTarget.dataset.time
    this.setData({
      timeActive: timeActiveIndex
    })
  },
  // 去充值
  handleCharge () {},
  // 确定 先查询 区域的剩余预约次数
  handleConfirm () {
    if (this.data.accountNumber == 0) {
      wx.showModal({
        content: '您当前的检测次数为0，先充值次数',
        cancelColor: '#666',
        cancelText: '卡激活',
        confirmText: '去充值',
        confirmColor: '#333',
        success (res) {
          if (res.confirm) {
            wx.navigateTo({
              url: '/pages/buy/buy?from=appointment',
            })
          } else if (res.cancel) {
            wx.navigateTo({
              url: '/pages/exchange/exchange',
            })
          }
        }
      })
    } else if (!this.data.hasAddress) {
      wx.showToast({
        title: '请选择地址',
        icon: 'error',
        mask: true
      })
    } else {
      this.submitAppointmentFn()
    }
  },
  // 提交预约信息
  submitAppointmentFn () {
    var data = {
      appointmentTime: this.data.choseDate,
      duration: this.data.timeActive,
      addressId: this.data.addressId
    }
    wx.showLoading({
      title: '预约中...'
    })
    var timer = null
    submitAppointment(data).then(res => {
      wx.hideLoading()
      wx.showToast({
        title: '预约成功',
        icon: 'success'
      })
      timer = setTimeout(() => {
        wx.navigateTo({
          url: '/pages/myAppointment/myAppointment?from=appointment',
        })
        clearTimeout(timer)
      }, 1000);
      /* this.setData({
        appointmentSuccess: true
      }) */
    }).catch(e => {
      wx.hideLoading()
      wx.showModal({
        content: e,
        confirmColor: '#333',
        showCancel: false
      })
    })
  },
  resetData () {
    app.globalData.navigateBackParams.address = ''
    app.globalData.navigateBackParams.contactName = ''
    app.globalData.navigateBackParams.contactPhone = ''
    app.globalData.navigateBackParams.addressId = ''
    app.globalData.navigateBackParams.province = ''
    app.globalData.navigateBackParams.city = ''
    app.globalData.navigateBackParams.county = ''
    this.setData({
      hasAddress: true,
      appointmentSuccess: false,
      timeActive: '1',
      addressId: '',
      address: '',
      province: '',
      city: '',
      county: '',
    })
  },
  handleCancel () {
    this.resetData()
    wx.navigateBack()
  }
})