zhiyu_uni_duanju/pages/member/index.vue

<template>
  <view class="body">

    <view class="pd24_20 flex alcenter space user-info">
      <view class="flex alcenter">
        <view class="member-face">
          <image class="face" :src="statics.defaultFace"></image>
          <!-- <image class="vip-level" :src="userinfo.group_id>1?statics.vipLevelImg[0]:''"></image> -->
        </view>
        <view class="ml15">
          <view class="ft16 cl-main">{{ userinfo.type }}</view>
          <view class="mt12 ft12 cl-notice">ID:{{ userinfo.uid || '' }}
            <image @click="copyId(userinfo.uid || '')" style="margin-left: 10px; width: 30rpx;height: 15px;"
              src="/static/img/wode/cpoy.png" />
          </view>
        </view>
      </view>
    </view>
    <view class="pd24_20">

      <div class="box pd16_15  creadit-box">
        <div class="mt16 coin-box">
          <div class="flex alcenter coin-item">
            <label class="coin-text">{{ userinfo.charge_coin || 0 }}</label>
            <label class="coin-text">永久看币</label>
          </div>
          <label class="box-line">|</label>
          <div class="flex alcenter coin-item">
            <label class="coin-text">{{ userinfo.reward_coin || 0 }}</label>
            <label class="coin-text">赠送看币</label>
          </div>
        </div>
        <navigator url="/pages/pay/pay">
          <div class="mt16 box-cj"><label class="btn-cz">去充值</label></div>
        </navigator>

      </div>
      <!-- <home-vipcard :userinfo="userinfo" @loginAct="showLoginAct" @qrcode="showQrcode = true"></home-vipcard> -->

      <view class="flex wrap space mt16">
        <view v-for="(item, index) in getMenus" :key="index" :class="index > 1 ? 'mt16' : ''">
          <view v-if="item.type == 'link'" :data-index="index" @click="memberLinkTo" class="box pd16_15 flex alcenter"
            style="width: 320rpx;">
            <image :src="item.icon" style="width: 64rpx;height: 64rpx;"></image>
            <text class="ml15 ft14 ftw500 cl-main">{{ item.name }}</text>
          </view>
          <view v-else style="width: 320rpx;" @click="showPopu(item.type)">
            <button class="box pd16_15 flex alcenter" style="padding: 32rpx 30rpx; margin: 0;">
              <image :src="item.icon" style="width: 64rpx;height: 64rpx;"></image>
              <text class="ml15 ft14 ftw500 cl-main">{{ item.name }}</text>
            </button>
          </view>
        </view>
      </view>
      <com-copyright></com-copyright>
      <uni-popup ref="popup" type="center">
        <image :show-menu-by-longpress="true" class="qrcode-img" :src="kefu.url"></image>
      </uni-popup>
    </view>
  </view>
</template>

<script>
import {
  getKefu
} from "@/common/apis/common.js"
import {
  getUserInfo
} from "@/common/apis/my.js"
export default {
  data() {
    return {
      isLogin: false,
      showLogin: false,
      isBirthday: true,
      showBirthday: false,
      showQrcode: true,
      avatar: '',
      userinfo: {
        type: "微信用户",
      },
      kefu: {
        url: "",
      },
      vipLevel: 0,
      iskq: 0,
      uid: 0,
      staticUrl: this.$config.staticUrl,
      memberMenus: [
        // {name:'观看历史',type:'link',model:'',link:'/pages/client/tuan/zjgk',icon:this.$config.staticUrl + 'vipcard_icon_my_card@2x.png',show:1},
        // {name:'我的追剧',type:'link',model:'',link:'/pages/client/tuan/zjjl',icon:this.$config.staticUrl + 'vipcard_icon_my_order@2x.png',show:1},
        {
          name: '我的追剧',
          type: 'link',
          model: 'tab',
          link: '/pages/zhuiju/index',
          icon: this.$config.zystaticUrl + '/static/img/wode/zhuij.png',
          show: 1
        },
        {
          name: '充值记录',
          type: 'link',
          model: '',
          link: '/pages/member/orders',
          icon: this.$config.zystaticUrl + '/static/img/wode/wd-cz.png',
          show: 1
        },
        {
          name: '消费记录',
          type: 'link',
          model: '',
          link: '/pages/member/consume',
          icon: this.$config.zystaticUrl + '/static/img/wode/xiaofei.png',
          show: 1
        },
        {
          name: '联系客服',
          type: 'kefu',
          model: '',
          link: '/pages/client/tuan/wdxh',
          icon: this.$config.zystaticUrl + '/static/img/wode/kefu.png',
          show: 1
        },

        // {name:'收货地址',type:'git link',model:'',link:'/pages/client/member/address',icon:this.$config.staticUrl + 'vipcard_icon_my_address@2x.png',show:0},
        // {name:'官方商城',type:'link',model:'',link:'/pages/client/shop',icon:this.$config.staticUrl + 'vipcard_icon_my_integral@2x.png',show:0},
        // {name:'联系客服',type:'link',model:'',link:'/pages/client/vipcard/adviser',icon:this.$config.staticUrl + 'vipcard_icon_my_advise@2x.png',show:1},
        // {name:'我的团队',type:'link',model:'',link:'/pages/client/mytuandui',icon:this.$config.staticUrl + 'vipcard_icon_my_invite@2x.png',show:3},
        // {name:'分销订单',type:'link',model:'',link:'/pages/client/vipcard/fxlog',icon:this.$config.staticUrl + 'vipcard_icon_my_integral@2x.png',show:3},
      ],
    }
  },
  computed: {
    getMenus() {
      let arr = new Array;
      for (var a in this.memberMenus) {
        if (this.memberMenus[a].show == 1 || (this.iskq == 1 && this.memberMenus[a].show == 3)) {
          arr.push(this.memberMenus[a]);
        }
      }
      return arr;
    }
  },
  async onLoad() {
    let res = await getKefu();
    this.kefu = res.data;
  },
  async onShow() {
    let res = await getUserInfo();
    this.userinfo = res.data;
  },
  onShareAppMessage: function (res) {
    // #ifdef MP-WEIXIN 
    var href = '/pages/login/login?fxpid=' + this.uid
    console.log(res)
    let that = this;
    const obj = {
      title: "发送给好友",
      imageUrl: '',
      path: href,
      success: function (res) {
        console.log(res, "转发成功")
      },
      fail: function (res) {
        wx.showToast({
          title: '发送失败',
          icon: 'none'
        })
      }
    }
    return obj
    // #endif
  },
  onShareTimeline(e) {

  },
  methods: {
    showPopu(type = "kefu") {
      if (type == "kefu") {
        this.$refs.popup.open('center')
      }
    },
    opset() {
      uni.navigateTo({
        url: '/pages/set/set'
      })
    },
    opsets() {
      uni.navigateTo({
        url: '/pages/set/grzl/grzl'
      })
    },
    memberLinkTo(e) {
      let index = parseInt(e.currentTarget.dataset.index);

      if (this.getMenus[index].link != '') {
        if (this.getMenus[index].model == 'integral') {
          uni.redirectTo({
            url: this.getMenus[index].link
          })
        } else if (this.getMenus[index].model == 'tab') {
          uni.switchTab({
            url: this.getMenus[index].link
          })
        } else {
          uni.navigateTo({
            url: this.getMenus[index].link
          })
        }
      }
    },
    birthdayAct() {
      if (this.isBirthday) {
        uni.navigateTo({
          url: '/pages/client/member/birthday'
        })
      } else {
        uni.navigateTo({
          url: '/pages/client/member/info'
        })
      }
    },
    copyId(uid) {
      console.log('uid', uid);
      uni.setClipboardData({
        data: uid + "",
        success: () => {
          uni.showToast({
            title: '复制成功',
            icon: "none"
          })
        },
        fail: function (err) {
          uni.showToast({
            title: '复制失败',
            duration: 2000,
            icon: 'none'
          });
        }
      })
    },
    previewImage(e) {
      console.log('e', e);
      uni.previewImage({
        urls: this.kefu.url,
        longPressActions: {
          // itemList: ['发送给朋友', '保存图片', '收藏'],
          success: function (data) {
            console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
          },
          fail: function (err) {
            console.log(err.errMsg);
          }
        }
      });

    }
  },
}
</script>

<style>
@import url("style/index.css");
</style>