cxb-minapp-vue3/src/components/CXBPhoneLoginButton/CXBPhoneLoginButton.vue

<script lang="ts" setup>
import {authAppletPhone, bindPhone, getUserUnionId} from "~/apis/user";
import {useUserStore} from "~/stores/userStore";
import Cache from "~/utils/cache";
const userStore = useUserStore()
const props = defineProps({
  text: {
    type: String,
    require: true
  },
  key: {
    type: String
  }
})
function getPhoneNumber(e) {
  // console.log(e.detail)
  // console.log(e)
  if (e.detail.errMsg === 'getPhoneNumber:ok') {
    uni.login({
      provider: 'weixin',
      success: result => {
        const source = 'cxb'
        getUserUnionId({
          code: result.code,
          source,
        }).then(unionRes => {
          // getShareId(shareI)
          const shareId = Cache.get('SHARE_ID')

          let params = {
            sessionKey: unionRes.session_key,
            encryptedData: e.detail.encryptedData,
            iv: e.detail.iv,
          }
          if (shareId) {
            params.share_id = shareId
          }
          // 手机号授权
          authAppletPhone({
            ...params
          }).then(authRes => {
            userStore.login(authRes.token, authRes.exp)
            userStore.setUID(authRes.user.uid)
            userStore.setUserInfo(authRes.user)

            // 绑定手机号
            bindPhone({
              phone: authRes.user.account,
              sms: 1,
              sms_code: '1024',
              password: '12345678',
              third_user_id: unionRes.unionid,
              type: 1
            }).then(bindRes => {
              // console.log('已绑定手机')
              // console.log(bindRes)
              Cache.clear('SHARE_ID')
              // 跳转
              switch (props.key) {
                case '10':
                  uni.switchTab({
                    url: '/pages/user/index'
                  })
                  break;
                case '4':
                  uni.navigateBack({
                    delta: 2
                  })
                  break;
                case '1':
                  uni.switchTab({
                    url: '/pages/order_addcart/index'
                  })
                  break;
                case undefined:
                  uni.switchTab({
                    url: '/pages/user/index'
                  })
                  break;
                case '30':
                  uni.switchTab({
                    url: '/pages/home/index'
                  })
                  break;
                default:
                  uni.switchTab({
                    url: '/pages/home/index'
                  })
              }
            })


            // console.log(authRes)
            // authRes.token
          })
          // 手机号绑定
          // res.openid
          // res.session_key
          // bindPhone({
          //
          // })
        })
      }
    })
  }
}
</script>
<template>
  <div class="bg-white border border-solid border-1 border-gray-300 rounded-md py-3 gap-2 flex justify-center items-center">
    <image
        src="https://test.bjtdba.com/applet/static/home/4879edf0b6e2b0ad29fa7d4053d676b.png" mode="widthFix"
        class="w-4 h-4"
    ></image>
    <button
        open-type="getPhoneNumber" @getphonenumber="getPhoneNumber"
    >
      {{ text }}
    </button>
  </div>
</template>

<style>
button{
  margin: 0;
  padding: 0;
  outline: none;
  border-radius: 0;
  background-color: transparent;
  line-height: inherit;
}
button::after{
  border: none;
}
</style>