From 45fb4b11ad51bb38306765b11a6747402e382cee Mon Sep 17 00:00:00 2001 From: Helius <wangdoubleone@gmail.com> Date: Sat, 20 Feb 2021 17:37:33 +0800 Subject: [PATCH] fix --- hive-app/pages/member/membershipCard.vue | 89 +++++++++++++++++++++++++------------------- 1 files changed, 50 insertions(+), 39 deletions(-) diff --git a/hive-app/pages/member/membershipCard.vue b/hive-app/pages/member/membershipCard.vue index d7a1e41..90931f9 100644 --- a/hive-app/pages/member/membershipCard.vue +++ b/hive-app/pages/member/membershipCard.vue @@ -1,33 +1,19 @@ <template> <view class="container"> - <view class="list-item"> - <view class="list-header"> - <text class="name">会员卡</text> - <text>NO 23564</text> - </view> - <view class="list-content"> - <text> - ¥<text class="ml-10">565,6789</text> - </text> - </view> - <view class="list-footer"> - <text>赠送金额 ¥ 5656</text> - <text>有效期:2025-10-20</text> - </view> - </view> - <view class="list-item"> - <view class="list-header"> - <text class="name">会员卡</text> - <text>NO 23564</text> - </view> - <view class="list-content"> - <text> - ¥<text class="ml-10">565,6789</text> - </text> - </view> - <view class="list-footer"> - <text>赠送金额 ¥ 5656</text> - <text>有效期:2025-10-20</text> + <view class="list-item-bg" :class="item.status==2?'failure':''" v-for="item in list"> + <view class="list-item"> + <view class="list-header"> + <text class="name">{{item.cardName}}</text> + </view> + <view class="list-content"> + <text> + ¥<text class="ml-10">{{item.realMoney}}</text> + </text> + </view> + <view class="list-footer"> + <text>赠送金额 ¥ {{item.giftMoney}}</text> + <text>有效期:{{item.failTime}}</text> + </view> </view> </view> </view> @@ -35,31 +21,55 @@ <script> export default{ - components:{ - - }, data(){ return { - + list: [] } }, + onLoad(options) { + this.loadList(options.id) + }, methods:{ - + loadList(id){ + this.$httpUtils.request('/api/vip/findVipCardInfo/'+id).then((res) => { + if(res.status == 200){ + this.list = res.rows; + } + }) + } } } </script> <style> .container{ - padding: 10px 10px; + padding: 10px 15px; + } + .list-item-bg{ + border-radius: 10px; } .list-item{ - background: #F0AD4E; color: #FFFFFF; font-size: 14px; - padding: 12px 15px; - border-radius: 4px; + padding: 18px 18px; margin-bottom: 10px; + } + .list-item-bg:nth-child(2n+1){ + background: url(../../static/images/card-bg2.png) no-repeat; + background-size: 100% 100%; + } + .list-item-bg:nth-child(2n+2){ + background: url(../../static/images/card-bg3.png) no-repeat; + background-size: 100% 100%; + } + .list-item-bg:nth-child(1){ + background: url(../../static/images/card-bg1.png) no-repeat; + background-size: 100% 100%; + } + .list-item-bg.failure{ + background: url(../../static/images/card-bg4.png) no-repeat; + background-size: 100% 100%; + opacity: 0.8; } .list-header{ display: flex; @@ -67,12 +77,13 @@ align-items: center; } .list-header .name{ - font-size: 18px; + font-size: 16px; font-weight: bold; } .list-content{ padding: 20px 0; - font-size: 30px; + font-size: 26px; + line-height: 30px; } .list-footer{ display: flex; -- Gitblit v1.9.1