zhuomi-hui/miniprogram/components/signup-sheet/index.js

const api = require('../../utils/api')
const authUtil = require('../../utils/auth')
const activityUtil = require('../../utils/activity')

function requestRemind(tmplIds) {
  const ids = (tmplIds || []).filter(Boolean).slice(0, 3)
  if (!ids.length) {
    return Promise.resolve({ status: 'none', enabled: false })
  }
  return new Promise((resolve) => {
    wx.requestSubscribeMessage({
      tmplIds: ids,
      success(res) {
        // res[tmplId] === 'accept' | 'reject' | 'ban' | 'filter'
        let status = 'reject'
        for (let i = 0; i < ids.length; i += 1) {
          if (res[ids[i]] === 'accept') {
            status = 'accept'
            break
          }
          if (res[ids[i]]) status = res[ids[i]]
        }
        resolve({ status: status, enabled: true })
      },
      fail() {
        resolve({ status: 'reject', enabled: true })
      }
    })
  })
}

Component({
  properties: {
    show: {
      type: Boolean,
      value: false
    },
    activityId: {
      type: String,
      value: ''
    }
  },
  data: {
    name: '',
    phone: '',
    company: '',
    position: '',
    submitting: false,
    tmplIds: [],
    remindReady: false
  },
  observers: {
    show(visible) {
      if (visible) {
        wx.hideTabBar({ animation: false })
        this.prefetch()
      } else {
        wx.showTabBar({ animation: false })
      }
    }
  },
  lifetimes: {
    detached() {
      wx.showTabBar({ animation: false })
    }
  },
  methods: {
    prefetch() {
      api
        .subscribeConfig()
        .then((config) => {
          this.setData({
            tmplIds: (config && config.tmplIds) || [],
            remindReady: !!(config && config.enabled)
          })
        })
        .catch(() => this.setData({ tmplIds: [], remindReady: false }))

      api
        .profile()
        .then((profile) => {
          if (!profile) return
          this.setData({
            name: this.data.name || profile.name || '',
            phone: this.data.phone || profile.phone || '',
            company: this.data.company || profile.company || '',
            position: this.data.position || profile.position || ''
          })
        })
        .catch(() => {})
    },

    noop() {},

    onInput(event) {
      const field = event.currentTarget.dataset.field
      const next = {}
      next[field] = event.detail.value
      this.setData(next)
    },

    onCancel() {
      if (this.data.submitting) return
      wx.showTabBar({ animation: false })
      this.triggerEvent('close')
    },

    onSubmit() {
      if (this.data.submitting) return
      const name = (this.data.name || '').trim()
      const phone = (this.data.phone || '').trim()
      const company = (this.data.company || '').trim()
      const position = (this.data.position || '').trim()
      if (!name || !phone) {
        wx.showToast({ title: '请填写姓名和手机号', icon: 'none' })
        return
      }
      if (!/^1\d{10}$/.test(phone)) {
        wx.showToast({ title: '请填写正确的手机号', icon: 'none' })
        return
      }
      if (!this.data.activityId) {
        wx.showToast({ title: '活动不存在', icon: 'none' })
        return
      }

      this.setData({ submitting: true })
      // Must run inside the tap gesture so WeChat can show the subscribe dialog.
      requestRemind(this.data.tmplIds)
        .then((remind) =>
          api.signup({
            activityId: this.data.activityId,
            name: name,
            phone: phone,
            company: company,
            position: position,
            sourceSharer: authUtil.sourceSharer(),
            remindStatus: remind.status
          }).then((signup) => ({ signup: signup, remind: remind }))
        )
        .then((result) => {
          const accepted = result.remind && result.remind.status === 'accept'
          wx.showToast({
            title: accepted ? '报名成功，已开启提醒' : '报名成功',
            icon: 'success'
          })
          this.setData({ submitting: false })
          wx.showTabBar({ animation: false })
          this.triggerEvent('success')
          this.triggerEvent('close')
        })
        .catch((error) => {
          this.setData({ submitting: false })
          activityUtil.toast(error)
        })
    }
  }
})