<template>
  <!-- <BasePage> -->
  <ManagerPopup v-model="managerPopupVisible" />
  <div class="opera">

    <div class="top">
      <div class="info_box">
        <img class="icon" :src="$file(userimg || '/img/default-avatar.png')" alt="">
        <div class="inf">
          <b>{{ nickname || '未登录' }}</b>
          <div>
            <img src="/img/phone.png" alt="">
            {{ cellphone || '暂无手机号' }}
          </div>
        </div>
      </div>

      <div class="shopcenter" @click="$showManagerPopup()">
        <span>
          管理中心
          <van-icon name="arrow" />
        </span>
      </div>
    </div>

    <div class="containar">
      <div class="wallet_box">
        <div class="item" @click="$navigate('Balance')">
          <div class="t">
            <img src="/img/op-i1.png" alt="">
            <span>余额</span>
            <van-icon name="arrow"></van-icon>
          </div>
          <b>
            {{ zijin?.toFixed(2) || '0.00' }}
          </b>
        </div>

        <div class="item" @click="$navigate('CV')">
          <div class="t">
            <img src="/img/op-i2.png" alt="">
            <span>会员卡</span>
            <van-icon name="arrow"></van-icon>
          </div>
          <b>
            {{ xiaofeiquan?.toFixed(2) || '0.00' }}
          </b>
        </div>
      </div>

      <div class="fun_box">
        <div class="item" @click="$navigate('QrReader')">
          <div class="left">
            <b>
              扫一扫
            </b>
            <p>核销礼品券</p>
          </div>

          <img src="/img/op-i3.png" alt="">
        </div>

        <div class="item" @click="$navigate('CertificateRecord?type=verif')">
          <div class="left">
            <b>
              核销记录
            </b>
            <p>查看礼品券核销记录</p>
          </div>

          <img src="/img/op-i4.png" alt="">
        </div>

        <div class="item" @click="$navigate('Allow')">
          <div class="left">
            <b>
              业绩统计
            </b>
            <p>查看业绩统计数据</p>
          </div>

          <img src="/img/op-i5.png" alt="">
        </div>
      </div>
    </div>
  </div>
  <!-- </BasePage> -->
</template>

<script>
import ManagerPopup from "@/components/ManagerPopup.vue"

export default {
  components: { ManagerPopup },
  data() {
    return {
      managerPopupVisible: false,
      userimg: this.$ls.get('userimg') || '',
      nickname: this.$ls.get('nickname') || '',
      cellphone: this.$ls.get('cellphone') || '',
      zijin: 0,
      xiaofeiquan: 0,
    }
  },
  mounted() {
    this.init()
    window.addEventListener('showManagerPopup', this.onShowManagerPopup)
    window.addEventListener('closeManagerPopup', this.onCloseManagerPopup)
  },
  beforeUnmount() {
    window.removeEventListener('showManagerPopup', this.onShowManagerPopup)
    window.removeEventListener('closeManagerPopup', this.onCloseManagerPopup)
  },
  methods: {
    init() {
      this.$get('/v1/client/DUsersClient').then(res => {
        this.userimg = res.data.userimg
        this.nickname = res.data.nickname
        this.cellphone = res.data.cellphone
        this.zijin = res.data.zijin
        this.xiaofeiquan = res.data.xiaofeiquan
        // 更新localStorage
        this.$ls.set('userimg', res.data.userimg)
        this.$ls.set('nickname', res.data.nickname)
        this.$ls.set('cellphone', res.data.cellphone)
      })
    },
    onShowManagerPopup() {
      this.managerPopupVisible = true
    },
    onCloseManagerPopup() {
      this.managerPopupVisible = false
    }
  }
}
</script>