yanyuan/src/pagesUser/git-phone-power/git-phone-power.vue

<template>
  <view class="flex flex-col items-center">
    <img class="my-28 w-24 h-24" src="https://www.tall.wiki/staticrec/yanyuan/logo.png" />
    <view class="flex flex-col w-full px-4">
      <u-button shape="square" type="primary" class="w-full mb-3" @click="openAuth" v-if="!showBindPnone"> 微信授权登录 </u-button>
      <u-button shape="square" type="primary" class="w-full mb-3" open-type="getPhoneNumber" @getphonenumber="getphonenumber" v-else>
        绑定手机号
      </u-button>
      <u-button class="w-full" shape="square" @click="back"> 取消 </u-button>
    </view>

    <!-- 合并账号 -->
    <u-top-tips ref="uTips"></u-top-tips>
    <u-modal
      v-model="bindingPhone"
      content="该手机号已经注册过账号，是否将账号合并?"
      class="p-4 ml-7 mr-7"
      :show-cancel-button="true"
      @confirm="yesMerge()"
      @cancel="noMerge()"
    ></u-modal>

    <u-modal v-model="mergePop" class="p-4 ml-7 mr-7" :show-cancel-button="true" @confirm="isMerge(0)" @cancel="isMerge(1)">
      <view class="slot-content">
        <view class="p-4">
          <p>1、您可以选择合并账号完成手机号的绑定，系统会为您自动合并两个账号的数据信息</p>
          <br />
          <p>2、如果选择不合并，已注册手机号的已有数据可能会被清空</p>
          <br />
          <p class="text-red-500">注意：合并账号可能会带来不确定的数据丢失</p>
        </view>
      </view>
    </u-modal>
  </view>
</template>

<script>
import UserAuthMixin from '@/mixins/userAuth';
import { mapMutations } from 'vuex';

export default {
  mixins: [UserAuthMixin],
  data() {
    return {
      show: false,
      // 合并手机号弹窗
      bindingPhone: false,
      // 确认合并手机号弹窗
      mergePop: false,
      showBindPnone: false,
      phone: '',
    };
  },

  mounted() {
    if (this.user && this.user.wxInfo && this.user.wxInfo.nickname) {
      this.showBindPnone = true;
    }
  },

  methods: {
    ...mapMutations('user', ['setToken', 'setUser']),
    // 点击体验按钮,获取用户手机号权限并绑定
    // 如果拒绝授权,则跳转到手机号验证码绑定界面
    // 如果授权,查看返回的绑定信息,如果有id,则直接绑定成功,跳转到项目列表页
    // 如果没有id,则提示当前手机号已存在,是否合并信息
    async getphonenumber(e) {
      if (this.user && this.user.phone) return;
      // if (e.detail.errMsg === 'getPhoneNumber:fail user deny') {
      //   this.$u.route('/pagesUser/phone-bind/phone-bind');
      // } else {

      // 如果用户授权信息
      if (e.detail.errMsg === 'getPhoneNumber:ok') {
        try {
          const params = {
            encryptedData: e.detail.encryptedData,
            iv: e.detail.iv,
            miniType: 'yanyuan',
          };
          const data = await this.$u.api.bindPhone(params);
          if (data && data.id) {
            this.setUser(data);
            this.setToken(data.token);

            this.$refs.uTips.show({
              title: '绑定成功, 即将跳转',
              type: 'success',
              duration: '2000',
            });
            setTimeout(() => uni.redirectTo({ url: '/pages/index/index' }), 2000);
          } else {
            this.phone = data.phone;
          }
        } catch (error) {
          console.error('error: ', error);
          if (error.code === 75) {
            this.bindingPhone = true;
            this.phone = error.data.phone;
          }
        }
      } else {
        this.$u.route('/pagesUser/phone-bind/phone-bind');
      }
    },

    // 取消合并账号弹窗
    async noMerge() {
      this.bindingPhone = false;
      await this.isMerge(1);
    },
    // 确定合并账号弹窗
    yesMerge() {
      this.mergePop = true;
    },
    // 确定合并账号
    async isMerge(merge) {
      try {
        const data = await this.$u.api.phoneMerge(this.phone, merge);
        if (data && merge === 0) {
          this.setUser(data);
          this.setToken(data.token);
          this.$refs.uTips.show({
            title: '手机号合并成功, 即将跳转上一页',
            type: 'success',
            duration: '3000',
          });
          setTimeout(() => uni.redirectTo({ url: '/pages/index/index' }), 3000);
        } else {
          this.$refs.uTips.show({
            title: '即将跳转上一页',
            type: 'success',
            duration: '3000',
          });
          setTimeout(() => uni.redirectTo({ url: '/pages/index/index' }), 3000);
        }
      } catch (error) {
        console.error('error: ', error);
        this.$t.ui.showToast(error.msg || '手机号合并失败');
      }
      this.mergePop = false;
    },

    // 取消 返回首页
    back() {
      uni.redirectTo({ url: '/pages/index/index' });
    },
  },
};
</script>