jje_uniapp/pages/my/index.vue

<template>
  <view class="page" :style="{'height':height}">
    <view class="backImage">
      <image class="backImage" src="/static/me/u655.png"></image>
    </view>
    <view class="content">

      <view class="userInfo flex-row justify-between  ">
        <view class="flex-row">
          <view class="userPhoto" @click="navigateToPage('/myPages/userInfo/index')">
            <image class="userPhoto" :src="userInfo.selfPhotoUrl || '/static/me/ud4.png'"></image>
          </view>
          <view class="userTitle flex-col justify-center" @click="navigateToPage('/myPages/userInfo/index')">
            <text class="nickName">{{userInfo.no}}</text>
            <text class="xinxTitle">{{ userInfo.ncikName }}</text>
            <text class="xinxTitle">{{userInfo.phone || '暂无绑定手机号'}}</text>
          </view>
        </view>

        <view class="qrcodeView flex-col justify-center" @click="navigateToPage('/pages/qrCode/index')">
          <image class="qrcode" src="/static/me/u5.png"></image>
          <text class="qrcodeTitle">会员码</text>
        </view>

      </view>

      <view class="sudoku flex-col">
        <view class="balance-name">
          <text>我的资产</text>
        </view>
        <view class="balance flex-row justify-around">
          <view class="balanceItem" @click="navigateToPage('/myPages/recharge/index')">
            <view class="icon flex-row justify-center">
              <u-icon name="/static/me/u701.png" color="red" size="30"></u-icon>
            </view>
            <view class="name">
              余额
            </view>
            <view class="num">
              <text>{{ userInfo.balance || 0 }}</text>
            </view>
          </view>
          <view class="balanceItem">
            <view class="icon flex-row justify-center">
              <u-icon name="/static/me/u680.png" color="red" size="30"></u-icon>
            </view>
            <view class="name">
              积分
            </view>
            <view class="num">
              <text>{{ userInfo.integral || 0 }}</text>
            </view>
          </view>
          <view class="balanceItem" @click="navigateToPage('/orderPages/myCoupon/index')">
            <view class="icon flex-row justify-center">
              <u-icon name="/static/me/u687.png" color="red" size="30"></u-icon>
            </view>
            <view class="name">
              优惠券
            </view>
            <view class="num">
              <text>{{ userInfo.coupon || 0 }}</text>
            </view>
          </view>
          <view class="balanceItem" @click="navigateToPage('/storePages/myRights/index')">
            <view class="icon flex-row justify-center">
              <u-icon name="/static/me/u694.png" color="red" size="30"></u-icon>
            </view>
            <view class="name">
              我的权益卡
            </view>
            <view class="num">
              <text>{{ userInfo.equityCardTotal || 0 }}</text>
            </view>
          </view>
        </view>

      </view>

      <view class="group">
        <uni-list>
          <uni-list-item  :clickable="true" :title="item.title" showArrow :thumb="item.thumb" thumb-size="sm"
                         :rightText="item.rightText" v-for="(item,index) in group1" :key="index" @click="clickListItem(item)">
            <template v-if="item.isShowRed" v-slot:footer>
              <view class="flex-col justify-center">
                <uni-icons size="12" color="red" type="smallcircle-filled"></uni-icons>
              </view>
            </template>
          </uni-list-item>
        </uni-list>
      </view>

      <!--				<view class="group">-->
      <!--					<uni-list>-->
      <!--						<uni-list-item :to="item.to" :title="item.title" showArrow :thumb="item.thumb" thumb-size="sm"  v-for="(item,index) in group2" :key="index" />-->
      <!--					</uni-list>-->
      <!--				</view>-->


    </view>
  </view>
</template>

<script>
import tabBar from "../../components/tabBar/tabBar";

export default {
  components: {
    tabBar
  },
  data() {
    return {
      group1: [
        // {thumb:'/static/me/u1796.png',title:'贡献奖励记录',rightText:'',to:''},
        // {thumb:'/static/me/u1803.png',title:'实名认证',rightText:'',to:'/myPages/realNameAuth/index'},
        {thumb: '/static/me/u1812.png', title: '服务对象管理', rightText: '', to: '/myPages/ServiceObjectManagement/index'},
        {thumb: '/static/me/u3.png', title: '邀请有礼', rightText: '', to: '/myPages/promotionCenter/index'},
        {thumb: '/static/me/u1833.png', title: '会员转入', rightText: '', to: '/myPages/systemSwitch/index'},
        {thumb: '/static/me/u826.png', title: '储值服务', rightText: '', to: '/myPages/recharge/index'},
        {thumb: '/static/me/u701.png', title: '交易记录', rightText: '', to: '/myPages/transactionRecord/index'},
        {thumb: '/static/me/u11.png', title: '会员须知', rightText: '', to: '/myPages/aboutOur/index'},
        {thumb: '/static/me/familyCard_icon.png', title: '亲情卡', rightText: '', to: '/myPages/familyCard/index' ,isShowRed:false},
        {thumb: '/static/me/hd.png', title: '我的活动', rightText: '', to: '/myPages/myActivity/myActivity'}
      ],
      group2: [

        // {thumb:'/static/me/u10.png',title:'个人信息',rightText:'',to:'/myPages/userInfo/index'},
        // {thumb:'/static/me/u101.png',title:'设置',rightText:'',to:'/myPages/setting/index'}
      ],
      height: '',

      title: 'Hello',
      tabIndex: 4,
      userInfo: {}
    }
  },

  // 分享到朋友圈
  onShareTimeline() {
  },
  // 分享到用户
  onShareAppMessage(OBJECT) {
  },
  onLoad() {

    //
    // uni.hideTabBar({
    //   animation: false
    // })
    let sysInfo = uni.getSystemInfoSync()
    this.height = sysInfo.windowHeight + 'px'
  },

  onShow() {
    // this.userInfo = uni.getStorageSync('userInfo')
    // if (this.userInfo.isAttestation){
    // 	this.group1[0].rightText = '已认证'
    // }else {
    // 	this.group1[0].rightText = '未实名认证，去认证'
    // }
    this.getUserInfo()
    this.notReadRecordList()
  },

  methods: {

    notReadRecordList(){
      this.$api.notReadRecordList().then(res=>{
        if (res.data.data.length > 0){
          this.group1[6].isShowRed = true
        }else {
          this.group1[6].isShowRed = false
        }
      })
    },

    getTemplateList(){
      let that = this
      that.$api.getTemplateList({
        type:2
      }).then(res=>{
        let templateId = res.data.data.data.map(item=>{
          return item.priTmplId
        })

        uni.requestSubscribeMessage({
          tmplIds: templateId,
          success: (res) =>{
            console.log('+++++++++success++++++++',res)
            let {errMsg,...param} = res
            that.$api.updateSubscribe(param).then(res=>{
              console.log('+++++++++++++updateSubscribe+++++++++++++',res)
            })
          },
          fail:(err)=>{
            console.log('+++++++++++++fail+++++++++++++',err)
          },
          complete:(complete)=>{

          }
        })

      })
    },

    clickListItem(e){

      if (e.title === '亲情卡'){
        let store = uni.getStorageSync('storeInfo')
        this.$api.checkStore({
          storeName:store.storeName
        }).then(res=>{
          uni.navigateTo({
            url:e.to
          })
        })
      }else if (e.title === '服务对象管理'){
        uni.navigateTo({
          url:e.to
        })
        this.getTemplateList()
      }else {
        uni.navigateTo({
          url:e.to
        })
      }
    },
    getUserInfo() {
      this.$api.getUserInfo().then(res => {
        console.log('++++++++++++获取用户信息++++++++++++++++++', res)
        uni.setStorageSync('userInfo', res.data.data)
        this.userInfo = res.data.data
        this.getImgUrlByOssId(this.userInfo.selfPhoto)
      })
    },

    getImgUrlByOssId(Id) {
      if (Id) {
        this.$api.getImage(Id).then(res => {
          this.userInfo.selfPhotoUrl = res.data.data[0].url.replace(/^http:/, "https:")
          this.$set(this.userInfo)
        });
      }
    },
    navigateToPage(url) {
      uni.navigateTo({
        url: url
      })
    },


  }
}
</script>

<style>
@import '/common/css/common.css';
@import './index.rpx.css';
</style>