wechat-shop/miniprogram/pages/login/index.ts

import { handleShareAppMsg } from '../../utils/configs'
import { onGoH5Page } from '../../utils/getUserInfo'
import { onMaiDian } from '../../utils/maiDian'
import { apiGetCaptchaImage, apiSendSms, apiGetWxUserCode, apiLogin } from '../../api/login/index'
const H5Link = require('../../api/base').allBaseUrl.GDEnvs.web

Page({
  data: {
    logoUrl: '../../assets/images/login/logo.png',
    checkedUrl: '../../assets/images/login/icon_check.svg',
    errorIconUrl:'../../assets/images/login/error.svg',
    codeUrl: '',
    isChecked: false,
    loginType: 'auto',
    // manual
    time: 60,
    phone: '',
    code: '',
    sms: '',
    uuid: '',
    phoneError: false,
    codeError: false,
    smsError: false,
    canLogin: false,
    firstSend: true
  },
  /** 触发同意单选框 */
  handleCheck() {
    this.setData({ isChecked: !this.data.isChecked })
  },
  /** 获取图形验证码 */
  async handleGetCode () {
    const res = await apiGetCaptchaImage()
    try {
      this.setData({ codeUrl: 'data:image/gif;base64,' + res.data.img })
      this.setData({ uuid: res.data.uuid })
    } catch (error) {
      console.log(error);
    }
  },
  /** 发送验证码 */
  async handleSendSms () {
    if (!this.blurPhone()) {
      wx.showToast({ title: '请填写手机号', icon: 'none' })
      return
    }
    if (!this.data.firstSend) {
      this.handleGetCode()
      this.setData({ codeError: true })
      this.setData({ firstSend: true })
      return
    }
    this.setData({ codeError: false })
    wx.showLoading({ title: '加载中' })

    const params = {
      userName: this.data.phone,
      imageCode: this.data.code,
      uuid: this.data.uuid
    }
    const smsResult = await apiSendSms(params)
    if (smsResult.code === '1000') {
      this.setData({ firstSend: false })
    } else {
      this.setData({ codeError: true })
      wx.showToast({ title: smsResult.msg, icon: 'none' })
    }
    wx.hideLoading()
    try {
      this.setData({ time: this.data.time - 1 })
      let timer = setInterval(() => {
        if (this.data.time === 0) {
          clearInterval(timer)
          this.setData({ time: 60 })
          return
        }
        this.setData({ time: this.data.time - 1 })
      }, 1000)
    } catch (error) {
      console.log(error);
    }
  },
  /** 跳转协议页面 */
  handelJumpToProtocol(e: any) {
    const url = `${H5Link}/operate/dynamic?id=${e.target.dataset.field}`
    onGoH5Page({ is_need_login: false, url })
  },
  /** 绑定手机号输入 */
  handlePhoneInput(e: { detail: { value: string } }) {
    this.setData({
      phone: e.detail.value
    })
    if (this.data.sms.length === 6 && this.data.phone.length === 11 && this.data.code.length === 4) {
      this.setData({ canLogin: true })
    }else{
      this.setData({ canLogin: false })
    }
  },
  handleBindCode(e: { detail: { value: string } }) {
    this.setData({ code: e.detail.value })
    if (this.data.sms.length === 6 && this.data.phone.length === 11 && this.data.code.length === 4) {
      this.setData({ canLogin: true })
    }else{
      this.setData({ canLogin: false })
    }
  },
  handleBindSms(e: { detail: { value: string } }) {
    this.setData({ sms: e.detail.value })
    if (this.data.sms.length === 6 && this.data.phone.length === 11 && this.data.code.length === 4) {
      this.setData({ canLogin: true })
    }else{
      this.setData({ canLogin: false })
    }
  },
  /** 手机号输入框失焦检查 */
  blurPhone () {
    const phone = this.data.phone
    const reg = /^[1][3-9][0-9]{9}$/
    const res = reg.test(phone)
    if (!res) {
      this.setData({ phoneError: true })
    } else {
      this.setData({ phoneError: false })
    }
    return res
  },
  /** 手动登录 */
  handleManualLogin () {
    onMaiDian('其他手机号登录-曝光')
    this.setData({ loginType: 'manual' })
    this.handleGetCode()
  },
  /** 手动登录提交 */
  async handleManualSubmit () {
    if (!this.data.canLogin) return
    if (!this.data.isChecked) {
      wx.showToast({ title: '请阅读并同意协议', icon: 'none' })
      return
    }
    const that = this
    wx.showLoading({ title: '加载中' })
    wx.login({
      success(wxRes) {
        console.warn('wxRes：', wxRes)
        apiGetWxUserCode({ code: wxRes.code }).then(res => {
          apiLogin({
            loginType: 2,
            userName: that.data.phone,
            smsCode: that.data.sms,
            openId: res.data.openid
          }).then(result => {
            if (result.code === '1000') {
              onMaiDian('其他手机号登录-点击-登录')
              wx.setStorage({
                key: 'user_info',
                data: {
                  token: result.data.authorizeToken,
                  phone: result.data.phone,
                  userName: result.data.userName,
                  userId: result.data.userId,
                  uniqueCode: result.data.uniqueCode
                },
                success() {
                  wx.hideLoading()
                  wx.reLaunch({ url: '/pages/index/index' })
                }
              })
            } else {
              that.handleGetCode()
              that.setData({ codeError: true })
              that.setData({ smsError: true })
              that.setData({ firstSend: true })
              wx.showToast({ title: result.msg, icon: 'none' })
            }
          })
        })
      },
      fail(wxResFail) {
        console.warn('wxResFail：', wxResFail)
        wx.showModal({ showCancel: true, content: wxResFail.errMsg })
      }
    })
  },
  /** 一键登录 */
  bindgetrealtimephonenumber(e: any) {
    if (e.detail.errno === '1400001') {
      wx.showToast({ title: '登录失败，请联系客服', icon: 'error' })
      return
    }
    if(!e.detail.code) return
    wx.showLoading({ title: '加载中' })
    wx.login({
      success(wxRes) {
        apiGetWxUserCode({ code: wxRes.code }).then(res => {
          apiLogin({
            loginType: 1,
            openId: res.data.openid,
            code: e.detail.code
          }).then(result => {
            if (result.code === '1000') {
              onMaiDian('微信一键登录-点击-登录')
              wx.setStorage({
                key: 'user_info',
                data: {
                  token: result.data.authorizeToken,
                  phone: result.data.phone,
                  userName: result.data.userName,
                  userId: result.data.userId,
                  uniqueCode: result.data.uniqueCode
                },
                success() {
                  wx.hideLoading()
                  wx.navigateBack({ delta: 2 })
                }
              })
            } else {
              wx.showToast({ title: result.msg, icon: 'none' })
            }
          })
        })
      }
    })
  },
  handleUncheck() {
    wx.showToast({ title: '请阅读并同意协议', icon: 'none' })
  },
  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {
    handleShareAppMsg()
  },
  onLoad() {
    wx.removeStorageSync('user_info')
    onMaiDian('微信一键登录-曝光')
  }
})