You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

301 lines
6.0 KiB

<template>
<view class="member">
<view>
<u-navbar title="会员中心" :border-bottom="false" title-color="#333" :background="background"></u-navbar>
</view>
<view class="tips">
<image src="/static/default-logo.png" mode="" class="headIcon"></image>
<view class="meInfo">
<view class="info">
<view class="name">
{{userInfo.nick_name}}
</view>
<view class="hy">
{{userInfo.user_type_text}}
</view>
</view>
<view class="time">
有效期至{{userInfo.effective_time}}
</view>
</view>
</view>
<view class="main">
<view class="mTitle">
会员卡订单记录
</view>
<view class="card" v-for="(item,index) in list" :key="index">
<view class="tp">
<view class="info">
<text v-if="item.is_valid">生效中</text>
<text v-if="!item.is_valid">已过期</text>
</view>
</view>
<view class="detail">
<view class="topLine">
<view class="send">
{{item.name}}
</view>
</view>
<view class="time">
{{item.start_time}}-{{item.end_time}}
</view>
</view>
</view>
<view class="cardTips" v-if="list.length > 0" >
已展示近12个月省钱会员卡订单
</view>
<u-empty text="您还没有会员卡订单记录哦" v-if="list.length == 0" mode="list" style="margin-top: 50rpx;"></u-empty>
</view>
<addShuiyin />
</view>
</template>
<script>
// import img from "@/static/member/top.png";
import * as member from '@/api/member/index.js'
export default {
data() {
let img = 'https://www.royaum.com.cn/static/member/top.png'
return {
userInfo: {},
payTypeChose: true,
isChose: 0,
isVip: false,
background: {
background: 'url(' + img + ') center top no-repeat',
backgroundSize: '100% auto',
},
list: [],
}
},
onLoad(options) {
this.userInfo = JSON.parse(options.userInfo)
},
onShow() {
this.getListInfo()
},
methods: {
getListInfo() {
const that = this
that.list = []
if (that.userInfo.user_type == 30) {
member.dealerOpenCardLog()
.then(res => {
if (res.status == 200) {
that.list = res.data
}
})
.finally(() => that.isLoading = false)
} else if (that.userInfo.user_type == 20) {
member.userOpenCardLog()
.then(res => {
if (res.status == 200) {
that.list = res.data
}
})
.finally(() => that.isLoading = false)
}
},
},
}
</script>
<style lang="scss" scoped>
.member {
width: 100%;
background: url('https://www.royaum.com.cn/static/member/merBack.png') 100% no-repeat;
background-size: 100% 100%;
position: relative;
}
.cardTips {
color: rgb(192, 196, 204);
font-size: 14px;
margin: 15px 0px 0px;
text-align: center;
}
.tips {
width: 698rpx;
height: 234rpx;
margin: 46rpx 0 0 26rpx;
background-image: url('https://www.royaum.com.cn/static/member/bg.png');
background-repeat: no-repeat;
background-size: 100% 100%;
display: flex;
align-items: center;
padding: 0rpx 0 0 34rpx;
.headIcon {
width: 114rpx;
height: 114rpx;
margin-right: 30rpx;
margin-top: 12rpx;
border-radius: 50%;
}
.meInfo {
.info {
display: flex;
margin-bottom: 26rpx;
.name {
height: 50rpx;
font-size: 36rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 500;
color: #785B45;
line-height: 50rpx;
margin-right: 18rpx;
}
.hy {
width: 126rpx;
height: 42rpx;
background: rgba(255, 255, 255, 0.71);
border-radius: 62rpx 62rpx 62rpx 62rpx;
opacity: 1;
text-align: center;
font-size: 24rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #785B45;
line-height: 42rpx;
}
}
.time {
height: 34rpx;
font-size: 24rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #785B45;
line-height: 34rpx;
}
}
.buyInfo {
// width: 112rpx;
height: 40rpx;
font-size: 28rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #785B45;
line-height: 40rpx;
margin-left: 86rpx;
}
}
.main {
width: 750rpx;
height: 1296rpx;
background: #FFFFFF;
opacity: 1;
border-radius: 50rpx 50rpx 0 0;
position: relative;
top: -30rpx;
padding-top: 56rpx;
}
.mTitle {
// width: 192rpx;
height: 44rpx;
font-size: 32rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 500;
color: #8B4338;
line-height: 44rpx;
margin: 0rpx 0 0 38rpx;
}
.card {
width: 654rpx;
height: 192rpx;
background: #FFF4F4;
border-radius: 8rpx 8rpx 8rpx 8rpx;
opacity: 1;
margin: 26rpx 0 16rpx 38rpx;
display: flex;
.tp {
width: 84rpx;
height: 84rpx;
background-image: url('https://www.royaum.com.cn/static/member/tip.png');
background-size: 100% 100%;
.info {
width: 84rpx;
height: 40rpx;
line-height: 40rpx;
font-size: 24rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #FFFFFF;
transform: rotate(-45deg);
}
}
.detail {
margin-top: 48rpx;
.topLine {
display: flex;
align-items: center;
.send {
height: 40rpx;
font-size: 28rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 500;
color: #785B45;
line-height: 40rpx;
}
.btn {
width: 106rpx;
height: 36rpx;
border-radius: 50rpx 50rpx 50rpx 50rpx;
opacity: 1;
border: 2rpx solid rgba(134, 102, 77, 0.45);
text-align: center;
line-height: 36rpx;
font-size: 20rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: rgba(120, 91, 69, 0.63);
line-height: 36rpx;
margin-left: 8rpx;
}
}
.time {
height: 34rpx;
font-size: 24rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #785B45;
line-height: 34rpx;
margin-top: 28rpx;
}
}
}
.showInfo {
width: 100%;
height: 40rpx;
font-size: 28rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #785B45;
line-height: 40rpx;
text-align: center;
margin-top: 46rpx;
}
</style>