jje_uniapp/myPages/familyCard/index.vue

<template>
  <view class="box">
    <text v-if="gotList.length>0" style="margin-bottom: 24rpx">我收到的亲情卡</text>

    <view class="getCard Card" v-for="item in gotList" @click="jumpToDetail(item)">
      <view style="display: flex;align-items: center">
        <u-avatar :src="item.url || '/static/me/ud4.png'"></u-avatar>
        <text style="margin:0 10rpx;color:#FFFFFF ">会员{{ item.userNo }}送的亲情卡</text>
      </view>
      <view class="Lines">
        <text style="float: right;margin:0 10rpx;color:#FFFFFF ">已用额度</text>
        <view style="font-size: 48rpx;font-weight: bold;color: #FFFFFF;text-align: center">{{ item.amount || 0 }}</view>
      </view>
    </view>

    <view  style="display: flex;justify-content:space-between;margin: 32rpx 0;">
      <text>我赠送的亲情卡</text>
      <view style="color: #FFAF36;transform: translateY(-10rpx)" @click="jumpToGive">
        <image style="width: 40rpx;height: 40rpx;transform: translateY(10rpx)"
               src="/static/familyCard/icon-give.png"></image>
        <text>
          赠送亲情卡
        </text>
      </view>
    </view>

    <view class="postCard Card" v-for="item in giveList" @click="jumpToDetail(item.id)">
      <view style="display: flex;align-items: center">
        <u-avatar :src="item.url || '/static/me/ud4.png'"></u-avatar>
        <text style="margin:0 10rpx;">会员{{ item.userNo }}送的亲情卡</text>
      </view>
      <view class="Lines">
        <text style="float: right;margin:0 10rpx;">已用额度</text>
        <view style="font-size: 48rpx;font-weight: bold;text-align: center">{{ item.amount || 0 }}</view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  name: "index",
  data() {
    return {
      giveList: [],
      gotList: []
    }
  },
  onLoad() {

  },
  onShow() {
    this.getGiveList()
    this.getGotList()
  },
  onPullDownRefresh(){
    this.getGiveList()
    this.getGotList()
    uni.stopPullDownRefresh()
  },
  methods: {
    jumpToGive() {
      uni.navigateTo({
        url: '/myPages/familyCard/giveFamilyCard/giveFamilyCard'
      })
    },
    jumpToDetail(item) {
      uni.navigateTo({
        url: '/myPages/familyCard/unbindFamilyCard/unbindFamilyCard?data=' + JSON.stringify(item)
      })
    },
    getImgUrlByOssId(list, number) {
      if (list) {
        list.forEach((e) => {
          let data = null
          if (number == 1) {
            data = e.presentUserPhoto

          } else {
            data = e.userPhoto
          }
          if (data) {
            this.$api.getImage(data).then(res => {
              e.url = res.data.data[0].url.replace(/^http:/, "https:")
            });
          }
        })
        this.$forceUpdate()
      }
    },
    getGiveList() {
      this.$api.getMyPresentList().then((res) => {
        this.giveList = res.data.data
        this.getImgUrlByOssId(this.giveList, 1)
      })
    },
    getGotList() {
      this.$api.getMyReceiveList().then((res) => {
        this.gotList = res.data.data
        this.getImgUrlByOssId(this.giveList, 2)
      })
    }
  }
}


</script>

<style scoped>
@import "/myPages/familyCard/index.scss";

</style>