<template>
  <div class="dialog_wrap">
    <van-popup ref="success"  v-model="poupShow">
      <div class="pop_wrap">
        <img class="tip_bg" src="@/assets/authentication/tipBg.png" />
        <div class="pop_title">
          恭喜您！
        </div>
        <div class="pop_content">
          <div>
            您的信息已经认证完成，
          </div>
          <div>
            请开启您的接单赚钱之旅！
          </div>
          <div>
            关注服务号，新订单及时提醒，接单更快！
          </div>
        </div>
        <div class="tip_button_wrap">
          <div class="continue" @click="focusHandler">
            关注
          </div>
        </div>
      </div>
    </van-popup>
  </div>
</template>

<script>
  import  { successPopup,getMyInfo } from '@/api/authentication'
  import { myMixins } from '@/utils/myMixins.js'
  export default {
    name: "successDialog",
    data() {
      return {
        poupShow:false,
      }
    },
    mixins: [ myMixins ],
    components: {},
    methods: {
      async getMineInfo() {  // 获取用户信息
        let myInfo = await getMyInfo()
        if(!( myInfo.code != 200 || !myInfo.data.phone)) {
          localStorage.setItem('phone', myInfo?.data?.phone)
          localStorage.setItem('infoVerify', myInfo?.data?.infoVerify?.code || 0)  // 认证进度
          localStorage.setItem('authIsSuccess', myInfo?.data?.authIsSuccess)
          localStorage.setItem('name', myInfo?.data?.name)
          localStorage.setItem('attentionState', myInfo?.data?.attentionState)
        }
      },
      openHandler() {
        this.poupShow=true
      },
      async focusHandler() {
        let focusFlag = localStorage.getItem('attentionState');   // 是否关注过公众号的标志
        if( focusFlag ) {
          await this.continueHandler()
        } else {//去关注公众号页面
          this.goPage('https://mp.weixin.qq.com/s/VNy_ppgDTLtwTtdRV_vPgA')
        }
      },
      async continueHandler() {
        await successPopup();
        this.poupShow=false
        await this.getMineInfo()
      }
    }
  }
</script>
<style lang="scss" scoped>
@import "@/styles/common.scss";
  // 弹框样式
  .pop_wrap {
    width: 304px;
    height: 267px;
    position: relative;
    .tip_bg {
      position: absolute;
      width: 304px;
      height: 267px;
      top: 0;
      left: 0;
      z-index: 100;
    }
    .pop_title {
      font-size: 19px;
      font-weight: bold;
      color: #3364B7;
      position: absolute;
      width: 304px;
      text-align: center;
      top: 100px;
      z-index: 101;
    }
    .pop_content {
      width: 304px;
      position: absolute;
      top: 130px;
      z-index: 101;
      font-size: 14px;
      color: #4C5361;
      div {
        width: 100%;
        text-align: center;
        line-height: 20px;
      }
    }
    .tip_button_wrap {
      position: absolute;
      z-index: 101;
      width: 275px;
      margin: 0 auto;
      bottom: 14px;
      display: flex;
      border-top: 1px solid #F1F2F5;
      left: 15px;
      height: 45px;
      div {
        font-size: 13px;
        width: 100%;
        text-align: center;
        line-height: 45px;
      }
      .close {
        color: #999B9F;
        border-right: 1px solid #F1F2F5;
      }
      .continue {
        color: #3364B7;
      }
    }
  }
</style>
