<script>
|
import {vipBuy, vipList} from "@/api/modules/user";
|
|
export default {
|
name: "index",
|
data() {
|
return {
|
li:[
|
{
|
img:this.$images+'/static/img/vip/buy1.png',
|
title:'多家资金匹配',
|
text:' <div style="font-size: 14px; color: rgba(154, 145, 137, 1);">通过率<span style=" color: rgba(255, 124, 0, 1);">更高</span></div>'
|
},
|
{
|
img:this.$images+'/static/img/vip/buy2.png',
|
title:'多渠道匹配',
|
text:' <div style="font-size: 14px; color: rgba(154, 145, 137, 1);">会员<span style=" color: rgba(255, 124, 0, 1);">1V1服务</span></div>'
|
},
|
{
|
img:this.$images+'/static/img/vip/buy3.png',
|
title:'多重福利',
|
text:' <div style="font-size: 14px; color: rgba(154, 145, 137, 1);">会员<span style=" color: rgba(255, 124, 0, 1);">1000+</span>福利</div>'
|
},
|
{
|
img:this.$images+'/static/img/vip/buy4.png',
|
title:'专享信贷产品',
|
text:' <div style="font-size: 14px; color: rgba(154, 145, 137, 1);"> <span style=" color: rgba(255, 124, 0, 1);">会员专享</span>福利</div>'
|
},
|
{
|
img:this.$images+'/static/img/vip/buy5.png',
|
title:'加速审核进度',
|
text:' <div style="font-size: 14px; color: rgba(154, 145, 137, 1);">时效提高<span style=" color: rgba(255, 124, 0, 1);">90%</span></div>'
|
},
|
]
|
};
|
},
|
onShow() {
|
uni.removeStorageSync('CHECK_BY_PAYMENT')
|
},
|
created() {
|
vipList()
|
},
|
methods: {
|
handleToPurchase(){
|
uni.showLoading({
|
title: '请稍候...',
|
mask: true,
|
})
|
vipBuy('61d80a027901c147f4db8642')
|
},
|
toProtocol(){
|
let title = '会员相关协议';
|
let code = 'MEMBER_SERVICE_AGREEMENT_APP_KDN';
|
uni.navigateTo({
|
url: `/pages/protocol/index?code=${code}&title=${title}`
|
});
|
}
|
}
|
}
|
</script>
|
|
<template>
|
<view class="content">
|
<view class="main-vip">
|
<view class="li" v-for="(item,index) in li" :key="index">
|
<view>
|
<image style="width: 84rpx;height: 84rpx;margin-right: 16rpx;" :src="item.img"></image>
|
</view>
|
<view>
|
<view style=" color: rgba(244, 218, 177, 1);margin-bottom: 10rpx;">{{item.title}}</view>
|
<view style="display: flex;flex-direction: row;font-size: 30rpx">
|
<rich-text :nodes="item.text"></rich-text>
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="tips">
|
<view class="title">
|
<view style="display: flex;justify-content: center"><image class="dio" :src="`${$images}/static/img/vip/juxing.png`"></image></view>
|
特别提醒
|
<view style="display: flex;justify-content: center"><image class="dio" :src="`${$images}/static/img/vip/juxing.png`"></image></view>
|
</view>
|
<view class="cnt">
|
购买会员后，我们将推送给你“预审通过的信贷产品”，您可以在本APP中完成贷款操作或下载预审通过的信贷产品。
|
</view>
|
</view>
|
<view class="btn">
|
<button class="sub" @click="handleToPurchase">立即开通 ¥99/半年</button>
|
</view>
|
|
<view style="text-align: center;margin: auto">
|
|
<view style="display: flex;flex-direction: row;color: #797F94;font-size: 24rpx">
|
点击“立即开通”即表示同意
|
<view style="color: #2966F3;font-size: 24rpx" @click="toProtocol">《会员相关协议》</view>
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<style scoped lang="scss">
|
.content{
|
background: url(#{$iconHttps}/static/img/vip/bg.png) no-repeat;
|
background-size: 100% 100%;
|
min-height: 100%;
|
.main-vip{
|
padding: 30rpx;
|
margin-top: 250rpx;
|
text-align: center;
|
display: flex;
|
flex-direction: row;
|
justify-content: space-between;
|
flex-wrap: wrap;
|
.li{
|
width: calc( 50% - 10rpx);
|
display: flex;
|
flex-direction: row;
|
background-color: rgba(66, 73, 98, 1);
|
border-radius: 22rpx;
|
padding: 26rpx 0 26rpx 20rpx;
|
margin-bottom: 20rpx;
|
}
|
}
|
.tips{
|
margin:0 30rpx;
|
background: #566494;
|
border-radius: 24rpx;
|
padding: 20rpx;
|
.title{
|
display: flex;
|
flex-direction: row;
|
justify-content: center;
|
color: white;
|
font-size: 30rpx;
|
.dio{
|
width: 20rpx;height: 20rpx;
|
display: flex;
|
justify-content: center;
|
margin-left: 20rpx;
|
margin-right: 20rpx;
|
}
|
}
|
.cnt{
|
color: white;
|
font-size: 28rpx;
|
margin-top: 14rpx;
|
}
|
}
|
.btn{
|
margin:0 70rpx;
|
margin-top: 60rpx;
|
.sub{
|
text-align: center;
|
height: 100rpx;
|
line-height: 100rpx;
|
background: linear-gradient( 270deg, #DAA864 0%, #FCE6BC 100%);
|
border-radius: 50rpx;
|
color: #75361F;
|
font-weight: 700;
|
font-size: 34rpx;
|
}
|
}
|
}
|
|
</style>
|
