<template> <view> <view class="width100 mart20" v-for="(item,index) in cardList" :key="index"> <view class="width90 conts backcolorb9" v-if="item.type == 1"> <view class="width90 alijusstart"> <image src="../static/unioncard.png" mode="widthFix" style="width: 80rpx;"></image> <text class="font18 fontwig6 fcorfff">工会卡</text> </view> <view class="width90 font18 fontwig6 fcorfff"> 卡号:<text class="margle">{{item.cardNo}}</text> </view> <!-- <view class="width90 font18 fontwig6 fcorfff"> 余额:<text class="margle">122</text> </view> --> <view class="width90 mart10 alijusstart font14"> <view class="width30 height30 backcorfff colorb9 fotct border-r" @click="jumpDetails(item.cardNo,item.type)">查看详情</view> <view class="width30 height30 backcorfff colorb9 fotct border-r margle20" @click="unionCardPay(item.cardNo)"> 充值余额</view> </view> </view> <view class="width90 conts backcolor32" v-if="item.type == 2"> <view class="width90 alijusstart"> <image src="../static/oilcard.png" mode="widthFix" style="width: 80rpx;"></image> <text class="font18 fontwig6 fcorfff">油卡</text> </view> <view class="width90 font18 fontwig6 fcorfff"> 卡号:<text class="margle">{{item.cardNo}}</text> </view> <!-- <view class="width90 font18 fontwig6 fcorfff"> 余额:<text class="margle">122</text> </view> --> <view class="width90 mart10 alijusstart font14"> <view class="width30 height30 backcorfff color32 fotct border-r" @click="jumpDetails(item.cardNo,item.type)">查看详情</view> </view> </view> </view> <view class="width90 height70w border-r mart20 alijusstart backcorfff" @click="jumpBindCard()"> <image src="../static/addcards.png" mode="widthFix" class="margle10" style="width: 40rpx;"></image> <text class="margle font16 fcor333">添加新卡</text> </view> </view> </template> <script> import { getUserCardList } from '../../Utils/Api.js'; let app = getApp(); export default { data() { return { cardList: [] //绑定卡列表 } }, onLoad() { this.user = app.globalData.userInfo; }, onShow() { this.getUserCardList(); }, methods: { //查询卡列表 getUserCardList() { uni.showLoading({ title: '加载中...' }) getUserCardList().then(res => { uni.hideLoading(); if (res.return_code == '000000') { this.cardList = res.return_data; return; } }); }, //跳转充值 unionCardPay(item) { uni.navigateTo({ url: '../trade-union-recharge/trade-union-recharge?cardId=' + item + '&RechargeType=1' }) }, //跳转详情 jumpDetails(item, item1) { uni.navigateTo({ url: '../cardsDetails/cardsDetails?cardNo=' + item + '&des=' + item1 }) }, //跳转绑定卡 jumpBindCard() { uni.navigateTo({ url: '../../pages/user/bindingCard/bindingCard' }) } } } </script> <style lang="scss"> page { background-color: #f8f8f8; } .conts { border-radius: 12rpx; padding: 12px 0; } </style>