index.vue 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. <template>
  2. <layout-page>
  3. <view class="defaultBgc" style="height: 100vh;">
  4. <view class="logo">
  5. <image src="https://minio.menduner.com/dev/19cce88e87fb8e895fbbe4418a937d610b2c20b8f87c6705569a096aca0a91b0.png"></image>
  6. </view>
  7. <button v-if="useUserStore.isLogin" class="recomm-button MiSans-Medium" @click="handleTokenLogin">一键登录</button>
  8. <button v-else class="recomm-button MiSans-Medium" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">一键登录</button>
  9. <view class="agreement-box ss-flex ss-row-center">
  10. <uni-icons size="20" :type="protocol ? 'checkbox-filled' : 'circle'" :color="protocol ? '#00B760' : '#ccc'" @tap="protocol = !protocol"></uni-icons>
  11. <view class="color-999 ss-flex ss-col-center ss-m-l-8 font-size-13">
  12. <span class="MiSans-Normal">我已阅读并遵守</span>
  13. <view class="color-primary MiSans-Medium" @tap.stop="handleToDetail('user')">
  14. 《用户协议》
  15. </view>
  16. <view class="agreement-text MiSans-Normal">和</view>
  17. <view class="color-primary MiSans-Medium" @tap.stop="handleToDetail('privacy')">
  18. 《隐私协议》
  19. </view>
  20. </view>
  21. </view>
  22. </view>
  23. </layout-page>
  24. </template>
  25. <script setup>
  26. import { ref } from 'vue'
  27. import layoutPage from '@/layout'
  28. import { userStore } from '@/store/user'
  29. import { onLoad } from '@dcloudio/uni-app'
  30. import { weixinLoginAuthorize } from '@/api/qrcodeLogin.js'
  31. import { checkPersonBaseInfo } from '@/utils/check'
  32. import { showAuthModal, closeAuthModal } from '@/hooks/useModal'
  33. const useUserStore = userStore()
  34. const protocol = ref(false)
  35. onLoad((options) => {
  36. if (!useUserStore.isLogin) {
  37. console.log('没登录时不需要弹窗');
  38. closeAuthModal()
  39. }
  40. console.log(options?.scene, '===========options')
  41. if (options?.scene) {
  42. uni.setStorageSync('wxLoginCode', options.scene)
  43. }
  44. })
  45. // 查看协议详情
  46. const handleToDetail = (type) => {
  47. const url = type === 'user' ? '/pagesB/agreement/user' : '/pagesB/agreement/privacy'
  48. uni.navigateTo({
  49. url
  50. })
  51. }
  52. const handleRemove = () => {
  53. uni.removeStorageSync('wxLoginCode')
  54. setTimeout(() => {
  55. uni.switchTab({
  56. url: '/pages/index/my'
  57. })
  58. }, 2000)
  59. }
  60. // 已登录的授权给网页
  61. const handleTokenLogin = async () => {
  62. if (!protocol.value) return uni.showToast({ title: '请先阅读并同意用户协议和隐私政策', icon: 'none', duration: 2000 })
  63. const data = useUserStore.baseInfo
  64. if (!data || !Object.keys(data).length || data.type === undefined || data.type === null) {
  65. console.log('需要完善基本信息')
  66. showAuthModal('selectUserType')
  67. return
  68. }
  69. const necessaryInfoReady = checkPersonBaseInfo(data)
  70. console.log(necessaryInfoReady, '基本信息是否填写完善', data)
  71. if (necessaryInfoReady) {
  72. console.log('信息填写完善-授权网页登录')
  73. closeAuthModal()
  74. if (!uni.getStorageSync('wxLoginCode')) {
  75. return uni.showToast({ title: '请重新扫码进行授权', icon: 'none', duration: 2000 })
  76. }
  77. try {
  78. await weixinLoginAuthorize({ uuid: uni.getStorageSync('wxLoginCode') })
  79. uni.showToast({ title: '授权网页登录成功', duration: 2000, icon: 'none' })
  80. handleRemove()
  81. } catch (error) {
  82. console.log(error, '授权接口error')
  83. handleRemove()
  84. }
  85. }
  86. else showAuthModal('necessaryInfo')
  87. uni.setStorageSync('necessaryInfoReady', necessaryInfoReady ? 'ready' : 'fddeaddc47868b')
  88. }
  89. // 微信登录
  90. const getPhoneNumber = async (e) => {
  91. if (!protocol.value) return uni.showToast({ title: '请先阅读并同意用户协议和隐私政策', icon: 'none', duration: 2000 })
  92. if (e?.detail?.errMsg !== 'getPhoneNumber:ok') {
  93. uni.showToast({ title: '微信登录失败', icon: 'none' })
  94. return
  95. }
  96. wx.login({
  97. success: async (result) => {
  98. const query = {
  99. loginCode: result?.code || '',
  100. phoneCode: e.detail.code,
  101. state: e.detail.encryptedData,
  102. autoRegister: true
  103. }
  104. await useUserStore.handleSmsLogin(query, 0)
  105. handleTokenLogin()
  106. },
  107. fail:(res)=> { console.log("获取登录凭证code失败!", res) }
  108. })
  109. }
  110. </script>
  111. <style scoped lang="scss">
  112. .logo {
  113. display: flex;
  114. align-items: center;
  115. image {
  116. width: 85px;
  117. height: 85px;
  118. border-radius: 6px;
  119. margin: 20vh auto 8vh auto;
  120. }
  121. }
  122. </style>