shuxiaoquan
9 months ago
parent
0f76dc0da4
commit
f3facf5963
@ -0,0 +1,644 @@ |
||||
<template> |
||||
<view class="member"> |
||||
<view> |
||||
<u-navbar title="开通续费管理" :border-bottom="false" title-color="#333" :background="background"></u-navbar> |
||||
</view> |
||||
<!-- <view class="khy"> |
||||
开通<text v-if="type=='fx'">分销</text>会员，人均立省￥<text>2389</text> |
||||
</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" v-if="userInfo.user_type == 20 || userInfo.user_type == 30"> |
||||
会员有效期至{{type == 'hy'?userInfo.effective_time:userInfo.fx_effective_time}} |
||||
</view> |
||||
</view> |
||||
<view class="buyInfo" @click="goBuyInfo"> |
||||
购买记录 |
||||
<u-icon name="arrow-right"></u-icon> |
||||
</view> |
||||
</view> |
||||
<view class="notVip"> |
||||
<view class="openVip"> |
||||
开通<text v-if="type=='fx'">分销</text>会员获得以下 <text>10项</text>特权 |
||||
</view> |
||||
<view class="vipList"> |
||||
<view class="vipItem"> |
||||
<image :src="$picUrl+'/static/member/my.png'" mode="" class="itemImg"></image> |
||||
<view class="vipInfo"> |
||||
天天免邮 |
||||
</view> |
||||
</view> |
||||
<view class="vipItem"> |
||||
<image :src="$picUrl+'/static/member/lp.png'" mode="" class="itemImg"></image> |
||||
<view class="vipInfo"> |
||||
超低会员价 |
||||
</view> |
||||
</view> |
||||
<view class="vipItem"> |
||||
<image :src="$picUrl+'/static/member/dz.png'" mode="" class="itemImg"></image> |
||||
<view class="vipInfo"> |
||||
折上95折 |
||||
</view> |
||||
</view> |
||||
<view class="vipItem"> |
||||
<image :src="$picUrl+'/static/member/th.png'" mode="" class="itemImg"></image> |
||||
<view class="vipInfo"> |
||||
退换免运费 |
||||
</view> |
||||
</view> |
||||
<view class="vipItem"> |
||||
<image :src="$picUrl+'/static/member/cx.png'" mode="" class="itemImg"></image> |
||||
<view class="vipInfo"> |
||||
促销福利 |
||||
</view> |
||||
</view> |
||||
<view class="vipItem"> |
||||
<image :src="$picUrl+'/static/member/tq.png'" mode="" class="itemImg"></image> |
||||
<view class="vipInfo"> |
||||
极速售后 |
||||
</view> |
||||
</view> |
||||
<view class="vipItem"> |
||||
<image :src="$picUrl+'/static/member/my.png'" mode="" class="itemImg"></image> |
||||
<view class="vipInfo"> |
||||
门店特权 |
||||
</view> |
||||
</view> |
||||
<view class="vipItem"> |
||||
<image :src="$picUrl+'/static/member/cj.png'" mode="" class="itemImg"></image> |
||||
<view class="vipInfo"> |
||||
不回本退差价 |
||||
</view> |
||||
</view> |
||||
<view class="vipItem"> |
||||
<image :src="$picUrl+'/static/member/tg.png'" mode="" class="itemImg"></image> |
||||
<view class="vipInfo"> |
||||
团购优惠券 |
||||
</view> |
||||
</view> |
||||
<view class="vipItem"> |
||||
<image :src="$picUrl+'/static/member/jf.png'" mode="" class="itemImg"></image> |
||||
<view class="vipInfo"> |
||||
双倍积分 |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="choseType"> |
||||
<view class="typeTitle"> |
||||
选择 <text v-if="userInfo.user_type==20 || userInfo.user_type==30">续费</text> <text v-if="userInfo.user_type==10">开卡</text> 套餐 |
||||
</view> |
||||
<view class="typeList"> |
||||
<view class="first common" v-for="(item,index) in packageList" :key="index" |
||||
:style="{'border':isChose==index?'2rpx solid #F34A40':none}" @click="chosePackage(item,index)"> |
||||
<view class="limitPrice" v-if="index==0"> |
||||
限时活动价 |
||||
</view> |
||||
<!-- :style="{'marginTop':isChose!=index?'62rpx':0}" --> |
||||
<view class="timeLong"> |
||||
{{Number(item.month)}}个月 |
||||
</view> |
||||
<view class="firPrice"> |
||||
￥{{item.price?Number(item.price):0}} |
||||
</view> |
||||
<view class="avePrice"> |
||||
￥{{item.price&&item.month?(Number(item.price)/Number(item.month)).toFixed(2):0}}/月 |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="payType"> |
||||
<view v-for="(item,index) in paymentMethods" :key="index" @click="chosePayType(item,index)"> |
||||
<view class="firLine"> |
||||
<view class="left"> |
||||
<image src="/static/order/wChat.png" mode="" class="weChatImg" |
||||
v-if="item.method=='wechat'"></image> |
||||
<image :src="$picUrl+'/static/member/others.png'" mode="" class="weChatImg" |
||||
v-if="item.method=='balance'"></image> |
||||
<text v-if="item.method=='wechat'">微信支付</text> |
||||
<text v-if="item.method=='balance'">余额支付</text> |
||||
</view> |
||||
<image src="../../static/order/right.png" mode="" class="choseImg" v-if="item.is_default"> |
||||
</image> |
||||
</view> |
||||
<view class="line"> |
||||
|
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
|
||||
<view class="footer"> |
||||
<view class="fLeft"> |
||||
<view class="ys" v-if="choseItem"> |
||||
已省 <text>￥{{choseItem.cheap_price?Number((choseItem.cheap_price).toFixed(2)):0}}</text> |
||||
</view> |
||||
<!-- <view class="yj"> |
||||
原价 ￥{{choseItem.price}} |
||||
</view> --> |
||||
</view> |
||||
<view class="btn" style="background: gray;opacity: 0.5;" v-if="user.user_type == 40"> |
||||
<text>￥{{choseItem.price?Number(choseItem.price):0}}</text>开卡{{choseItem.month?Number(choseItem.month):0}}个月 |
||||
</view> |
||||
<view class="btn" @click="gotoPay" v-else> |
||||
<text>￥{{choseItem.price?Number(choseItem.price):0}}</text>开卡{{choseItem.month?Number(choseItem.month):0}}个月 |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
// import img from "@/static/member/top.png"; |
||||
import * as member from '@/api/member/index.js'; |
||||
import { |
||||
Wechat |
||||
} from '@/core/payment' |
||||
export default { |
||||
data() { |
||||
let img = 'https://www.royaum.com.cn/static/member/top.png' |
||||
return { |
||||
packageList: [], |
||||
userInfo: {}, |
||||
payTypeChose: true, |
||||
isChose: 0, |
||||
isVip: false, |
||||
background: { |
||||
background: 'url(' + img + ') center top no-repeat', |
||||
backgroundSize: '100% auto', |
||||
}, |
||||
paymentMethods: [], |
||||
choseItem: {}, |
||||
payType: 'wechat', |
||||
type: 'hy', |
||||
user: '' |
||||
} |
||||
}, |
||||
onShow() { |
||||
this.getMemberInfo() |
||||
}, |
||||
onLoad(options) { |
||||
this.user = uni.getStorageSync('userInfo') |
||||
this.type = options.type |
||||
}, |
||||
methods: { |
||||
getMemberInfo() { |
||||
const that = this |
||||
let params = { |
||||
client: 'MP-WEIXIN' |
||||
} |
||||
if (that.type == 'hy') { |
||||
member.info(params) |
||||
.then(res => { |
||||
if (res.status == 200) { |
||||
that.userInfo = res.data.list.personal; |
||||
that.packageList = res.data.list.list; |
||||
that.paymentMethods = res.data.list.paymentMethods; |
||||
that.choseItem = that.packageList[0] |
||||
} |
||||
}) |
||||
.finally(() => that.isLoading = false) |
||||
} else { |
||||
member.dealerPriceList(params) |
||||
.then(res => { |
||||
if (res.status == 200) { |
||||
that.userInfo = res.data.list.personal; |
||||
that.packageList = res.data.list.list; |
||||
that.paymentMethods = res.data.list.paymentMethods; |
||||
that.choseItem = that.packageList[0] |
||||
} |
||||
}) |
||||
.finally(() => that.isLoading = false) |
||||
} |
||||
|
||||
}, |
||||
chosePackage(item, index) { |
||||
this.isChose = index; |
||||
this.choseItem = item; |
||||
|
||||
}, |
||||
goBuyInfo() { |
||||
uni.navigateTo({ |
||||
url: '/pages/memberInfo/index?userInfo=' + JSON.stringify(this.userInfo) |
||||
}) |
||||
}, |
||||
chosePayType(item, index) { |
||||
// 选择支付方式 |
||||
this.paymentMethods[index].is_default = true; |
||||
this.payType = item.method; |
||||
for (var i = 0; i < this.paymentMethods.length; i++) { |
||||
if (i != index) { |
||||
this.paymentMethods[i].is_default = false |
||||
} |
||||
} |
||||
}, |
||||
gotoPay() { |
||||
// 去支付 |
||||
if (this.payType == 'wechat') { |
||||
this.weChatPay() |
||||
} else if (this.payType == 'balance') { |
||||
this.balancePay() |
||||
} |
||||
}, |
||||
weChatPay() { |
||||
// 微信支付 |
||||
const that = this |
||||
let params = { |
||||
identity_id: that.choseItem.identity_id, |
||||
method: 'wechat', |
||||
client: 'MP-WEIXIN' |
||||
} |
||||
member.submit(params) |
||||
.then(res => { |
||||
let paymentData = res.data.payment |
||||
Wechat.payment({ |
||||
orderKey: res.data.payment.out_trade_no, |
||||
...paymentData |
||||
}) |
||||
.then((result) => { |
||||
console.log(result) |
||||
that.getMemberInfo(); |
||||
}) |
||||
.catch(err => { |
||||
console.log(err) |
||||
}) |
||||
}) |
||||
.finally(() => that.isLoading = false) |
||||
}, |
||||
|
||||
balancePay() { |
||||
// 余额支付 |
||||
const that = this |
||||
let params = { |
||||
identity_id: that.choseItem.identity_id, |
||||
method: 'balance', |
||||
client: 'MP-WEIXIN' |
||||
} |
||||
member.submit(params) |
||||
.then(res => { |
||||
that.$toast(res.message) |
||||
that.getMemberInfo(); |
||||
}) |
||||
.finally(() => that.isLoading = false) |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.member { |
||||
width: 100%; |
||||
background: url('https://www.royaum.com.cn/static/member/merBack.png') center top no-repeat; |
||||
background-size: 100% auto; |
||||
position: relative; |
||||
} |
||||
|
||||
.khy { |
||||
height: 36rpx; |
||||
font-size: 26rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #785B45; |
||||
line-height: 36rpx; |
||||
text-align: center; |
||||
margin: 40rpx 0 28rpx 0; |
||||
|
||||
image { |
||||
width: 15rpx; |
||||
height: 10rpx; |
||||
} |
||||
|
||||
text { |
||||
height: 56rpx; |
||||
font-size: 40rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 600; |
||||
color: #785B45; |
||||
line-height: 56rpx; |
||||
margin-right: 8rpx; |
||||
} |
||||
} |
||||
|
||||
.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: 20rpx; |
||||
margin-top: 12rpx; |
||||
border-radius: 50%; |
||||
} |
||||
|
||||
.meInfo { |
||||
width: 360rpx; |
||||
.info { |
||||
display: flex; |
||||
align-items: center; |
||||
.name { |
||||
height: 50rpx; |
||||
font-size: 31rpx; |
||||
font-weight: 500; |
||||
color: #785B45; |
||||
line-height: 50rpx; |
||||
margin-right: 15rpx; |
||||
max-width: 250rpx; |
||||
overflow: hidden; |
||||
white-space: nowrap; |
||||
} |
||||
|
||||
.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; |
||||
margin-top: 26rpx; |
||||
|
||||
} |
||||
} |
||||
|
||||
.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; |
||||
} |
||||
} |
||||
|
||||
.notVip { |
||||
padding-bottom: 200rpx; |
||||
|
||||
.openVip { |
||||
height: 44rpx; |
||||
font-size: 32rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #8B4338; |
||||
line-height: 44rpx; |
||||
margin: 30rpx 0 0 38rpx; |
||||
|
||||
text { |
||||
color: #EF2C21; |
||||
|
||||
} |
||||
} |
||||
|
||||
.vipList { |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
margin: 24rpx 0 0 0rpx; |
||||
|
||||
.vipItem { |
||||
display: flex; |
||||
justify-content: center; |
||||
flex-direction: column; |
||||
align-items: center; |
||||
margin-right: 6rpx; |
||||
margin-bottom: 8rpx; |
||||
|
||||
.itemImg { |
||||
width: 88rpx; |
||||
height: 88rpx; |
||||
} |
||||
|
||||
.vipInfo { |
||||
width: 144rpx; |
||||
height: 34rpx; |
||||
font-size: 24rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #7D2D21; |
||||
line-height: 34rpx; |
||||
margin-top: 30rpx; |
||||
text-align: center; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.choseType { |
||||
width: 726rpx; |
||||
height: 546rpx; |
||||
background: #FFFFFF; |
||||
border-radius: 12rpx 12rpx 12rpx 12rpx; |
||||
opacity: 1; |
||||
margin: 28rpx 0 0 12rpx; |
||||
padding: 18rpx 0 0 26rpx; |
||||
|
||||
.typeTitle { |
||||
height: 44rpx; |
||||
font-size: 32rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #8B4338; |
||||
line-height: 44rpx; |
||||
} |
||||
|
||||
.typeList { |
||||
display: flex; |
||||
margin: 28rpx 0 0 22rpx; |
||||
|
||||
.first { |
||||
margin-right: 12rpx; |
||||
width: 220rpx; |
||||
height: 242rpx; |
||||
background: #FFEEE8; |
||||
border-radius: 8rpx 8rpx 8rpx 8rpx; |
||||
opacity: 1; |
||||
// border: 2rpx solid #F34A40; |
||||
|
||||
.limitPrice { |
||||
width: 169rpx; |
||||
height: 46rpx; |
||||
background: linear-gradient(180deg, #FFFFFF 0%, #FEF8F5 100%); |
||||
border-radius: 0rpx 0rpx 0rpx 0rpx; |
||||
opacity: 1; |
||||
margin: 0 0 20rpx 32rpx; |
||||
text-align: center; |
||||
} |
||||
|
||||
.timeLong { |
||||
width: 100%; |
||||
text-align: center; |
||||
height: 40rpx; |
||||
font-size: 28rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #7D2D21; |
||||
line-height: 40rpx; |
||||
margin: 30rpx 0 12rpx 0; |
||||
} |
||||
|
||||
.sec { |
||||
margin-top: 62rpx; |
||||
} |
||||
|
||||
.firPrice { |
||||
width: 100%; |
||||
text-align: center; |
||||
height: 72rpx; |
||||
font-size: 36rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 600; |
||||
color: #F34A40; |
||||
line-height: 72rpx; |
||||
} |
||||
|
||||
.avePrice { |
||||
width: 100%; |
||||
text-align: center; |
||||
height: 34rpx; |
||||
font-size: 24rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #F34A40; |
||||
line-height: 34rpx; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.payType { |
||||
margin-top: 30rpx; |
||||
|
||||
.firLine { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
|
||||
.left { |
||||
height: 40rpx; |
||||
font-size: 28rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #7D2D21; |
||||
line-height: 40rpx; |
||||
display: flex; |
||||
align-items: center; |
||||
|
||||
.weChatImg { |
||||
width: 28rpx; |
||||
height: 24rpx; |
||||
margin-right: 12rpx; |
||||
} |
||||
} |
||||
|
||||
.choseImg { |
||||
width: 34rpx; |
||||
height: 24rpx; |
||||
margin-right: 60rpx; |
||||
} |
||||
} |
||||
|
||||
.line { |
||||
width: 622rpx; |
||||
height: 0rpx; |
||||
opacity: 1; |
||||
border: 2rpx solid #F6F6F6; |
||||
margin: 26rpx 0 26rpx 60rpx; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.footer { |
||||
position: fixed; |
||||
bottom: 0rpx; |
||||
height: 200rpx; |
||||
width: 100%; |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
z-index: 99; |
||||
background-color: #fff; |
||||
|
||||
.fLeft { |
||||
margin: 24rpx 0 0 44rpx; |
||||
|
||||
.ys { |
||||
height: 40rpx; |
||||
font-size: 28rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #7D2D21; |
||||
line-height: 40rpx; |
||||
width: 230rpx; |
||||
text { |
||||
height: 40rpx; |
||||
font-size: 28rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #F34A40; |
||||
line-height: 40rpx; |
||||
} |
||||
} |
||||
|
||||
.yj { |
||||
width: 230rpx; |
||||
height: 34rpx; |
||||
font-size: 24rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #CAABA6; |
||||
line-height: 34rpx; |
||||
} |
||||
} |
||||
|
||||
.btn { |
||||
|
||||
width: 440rpx; |
||||
height: 80rpx; |
||||
background: #F34A40; |
||||
border-radius: 8rpx 8rpx 8rpx 8rpx; |
||||
opacity: 1; |
||||
margin: 22rpx 70rpx 0 0; |
||||
text-align: center; |
||||
font-size: 24rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #FFFFFF; |
||||
|
||||
text { |
||||
font-size: 44rpx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #FFFFFF; |
||||
line-height: 80rpx; |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,449 @@ |
||||
<template> |
||||
<view class="notice"> |
||||
<view class="notice-navbar"> |
||||
<u-navbar title="权益礼包" :border-bottom="false" :background="background1"></u-navbar> |
||||
</view> |
||||
<view class="notice-bd"> |
||||
<view class="a"> |
||||
<view class="title">认证商家专享权益包</view> |
||||
<view class="desc">开通享8大权益</view> |
||||
<view class="list"> |
||||
<view class="item"> |
||||
<image src="https://wholesaler.royaum.com.cn/static/caigou/icon-m-01.png"></image> |
||||
订货优惠券 |
||||
</view> |
||||
<view class="item"> |
||||
<image src="https://wholesaler.royaum.com.cn/static/caigou/icon-m-02.png"></image> |
||||
专享活动 |
||||
</view> |
||||
<view class="item"> |
||||
<image src="https://wholesaler.royaum.com.cn/static/caigou/icon-m-03.png"></image> |
||||
专享券 |
||||
</view> |
||||
<view class="item"> |
||||
<image src="https://wholesaler.royaum.com.cn/static/caigou/icon-m-04.png"></image> |
||||
直采价 |
||||
</view> |
||||
<view class="item"> |
||||
<image src="https://wholesaler.royaum.com.cn/static/caigou/icon-m-05.png"></image> |
||||
线报 |
||||
</view> |
||||
<view class="item"> |
||||
<image src="https://wholesaler.royaum.com.cn/static/caigou/icon-m-06.png"></image> |
||||
快速发货 |
||||
</view> |
||||
<view class="item"> |
||||
<image src="https://wholesaler.royaum.com.cn/static/caigou/icon-m-07.png"></image> |
||||
专属客服 |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="b"> |
||||
<view class="title">服务权益</view> |
||||
<view class="list"> |
||||
<view class="item"> |
||||
<image src="https://wholesaler.royaum.com.cn/static/caigou/icon-m-08.png"></image> |
||||
<view class="info"> |
||||
<view class="name">订货优惠券</view> |
||||
<view class="desc">平台针对所有认证成功的采购商，定期或不定期发放订货优惠券，以及新人优惠券。</view> |
||||
</view> |
||||
</view> |
||||
<view class="item"> |
||||
<image src="https://wholesaler.royaum.com.cn/static/caigou/icon-m-09.png"></image> |
||||
<view class="info"> |
||||
<view class="name">专享活动/专享券</view> |
||||
<view class="desc">平台针对采购量大的采购商，推出专享活动或发放专享券，采购量大的采购商有权参与，可获得专享优惠。</view> |
||||
</view> |
||||
</view> |
||||
<view class="item"> |
||||
<image src="https://wholesaler.royaum.com.cn/static/caigou/icon-m-10.png"></image> |
||||
<view class="info"> |
||||
<view class="name">直采价</view> |
||||
<view class="desc">平台将不断对接更多品类的供应链资源，让平台上每一位采购商，获取更多跨界的产品直采资源。</view> |
||||
</view> |
||||
</view> |
||||
<view class="item"> |
||||
<image src="https://wholesaler.royaum.com.cn/static/caigou/icon-m-11.png"></image> |
||||
<view class="info"> |
||||
<view class="name">线报</view> |
||||
<view class="desc">平台将每天在广场推出每日线报，方便采购商获取最新前沿的商品渠道行情，助力采购商零售批发双线齐发。</view> |
||||
</view> |
||||
</view> |
||||
<view class="item"> |
||||
<image src="https://wholesaler.royaum.com.cn/static/caigou/icon-m-12.png"></image> |
||||
<view class="info"> |
||||
<view class="name">专属客服</view> |
||||
<view class="desc">每天09:00-21:00(周一至周六)在线实时解答订货疑虑，提供各种采购指导及售后处理。</view> |
||||
</view> |
||||
</view> |
||||
<view class="item"> |
||||
<image src="https://wholesaler.royaum.com.cn/static/caigou/icon-m-13.png"></image> |
||||
<view class="info"> |
||||
<view class="name">认证服务费</view> |
||||
<view class="desc">采购商如果在支付认证服务费后，10日内，如未在本平台产生任何订单(包括退款订单)，支持认证服务费退费申请，平台将在2个工作日内，给您退回认证服务费。</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="pay-bd" v-if="orcInfo.isToWrite"> |
||||
<view class="title">选择支付方式</view> |
||||
<view class="item" v-for="(a,i) in paymentMethods" @click="tabItem1(i)"> |
||||
<image v-if="tabIndex == i" src="https://wholesaler.royaum.com.cn/static/invoice/select-on.png"></image> |
||||
<image v-else src="https://wholesaler.royaum.com.cn/static/invoice/select.png"></image> |
||||
{{a.method == 'wechat'?'微信支付':'余额支付'}}<text v-if="a.method == 'balance'">（余额：{{personal.balance}}）</text> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
|
||||
<view class="notice-fd"> |
||||
<view class="btn" v-if="orcInfo.isToWrite" @click="openPage()">( ¥{{info.price}}/年 <text>¥{{info.year}}/年 </text> ) 去支付</view> |
||||
<view class="btn" v-else @click="openPage1()">立即提交</view> |
||||
</view> |
||||
<addShuiyin /> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import { Wechat } from '@/core/payment' |
||||
import * as newFunApi from '@/api/newFun' |
||||
export default { |
||||
data() { |
||||
return { |
||||
background1: { |
||||
background: "url(https://wholesaler.royaum.com.cn/static/caigou/bg@2x.png) center top no-repeat", |
||||
backgroundSize: '100% auto', |
||||
}, |
||||
info: {}, |
||||
orcInfo: {}, |
||||
paymentMethods: {}, |
||||
personal: {}, |
||||
isClick: true, |
||||
tabIndex: 0, |
||||
}; |
||||
}, |
||||
onReady() { |
||||
this.orcInfo = uni.getStorageSync("orcInfo"); |
||||
this.wholesalerPrice(); |
||||
}, |
||||
methods: { |
||||
tabItem1(i){ |
||||
this.tabIndex = i |
||||
}, |
||||
//识别营业执照 |
||||
async wholesalerPrice() { |
||||
const { status, data, message } = await newFunApi.wholesalerPrice({client:'MP-WEIXIN'}); |
||||
if (status == 200) { |
||||
this.info = data.info |
||||
this.paymentMethods = data.paymentMethods |
||||
this.personal = data.personal |
||||
} |
||||
}, |
||||
//微信支付 |
||||
async toWechatPay() { |
||||
const that = this; |
||||
const {status, data } = await newFunApi.wholesalerSubmit({ |
||||
method: 'wechat', |
||||
client: "MP-WEIXIN", |
||||
username: this.orcInfo.username, |
||||
mobile: this.orcInfo.mobile, |
||||
mobile_code: this.orcInfo.mobile_code, |
||||
card_front_img_id: this.orcInfo.card_front_img_id, |
||||
card_back_img_id: this.orcInfo.card_back_img_id, |
||||
license_img_id: this.orcInfo.license_img_id, |
||||
card_no: this.orcInfo.card_no, |
||||
door_img_id: this.orcInfo.door_img_id, |
||||
province_id: this.orcInfo.province_id, |
||||
company_name: this.orcInfo.company_name, |
||||
city_id: this.orcInfo.city_id, |
||||
credit_code: this.orcInfo.credit_code, |
||||
business: this.orcInfo.business, |
||||
avatar_id: this.orcInfo.avatar_id, |
||||
}) |
||||
if(status == 200) { |
||||
Wechat.payment(data.payment) |
||||
.then((result) => { |
||||
console.log(22,result) |
||||
uni.showToast({ |
||||
title: "支付成功" |
||||
}) |
||||
this.isClick = true; |
||||
|
||||
setTimeout(()=>{ |
||||
uni.removeStorageSync("orcInfo"); |
||||
uni.redirectTo({ |
||||
url: "/pages/news/caigou/notice5" |
||||
}) |
||||
},1000) |
||||
}) |
||||
.catch(err => { |
||||
uni.showToast({ |
||||
title: "支付失败" |
||||
}) |
||||
this.isClick = true; |
||||
}) |
||||
} |
||||
|
||||
}, |
||||
//去支付 余额支付 |
||||
async toPay() { |
||||
const that = this; |
||||
const {status, message} = await newFunApi.wholesalerSubmit({ |
||||
method: 'balance', |
||||
client: "MP-WEIXIN", |
||||
username: this.orcInfo.username, |
||||
mobile: this.orcInfo.mobile, |
||||
mobile_code: this.orcInfo.mobile_code, |
||||
card_front_img_id: this.orcInfo.card_front_img_id, |
||||
card_back_img_id: this.orcInfo.card_back_img_id, |
||||
license_img_id: this.orcInfo.license_img_id, |
||||
card_no: this.orcInfo.card_no, |
||||
door_img_id: this.orcInfo.door_img_id, |
||||
province_id: this.orcInfo.province_id, |
||||
company_name: this.orcInfo.company_name, |
||||
city_id: this.orcInfo.city_id, |
||||
credit_code: this.orcInfo.credit_code, |
||||
business: this.orcInfo.business, |
||||
avatar_id: this.orcInfo.avatar_id, |
||||
}) |
||||
if(status == 200) { |
||||
uni.showToast({ |
||||
title: "支付成功" |
||||
}) |
||||
|
||||
this.isClick = true; |
||||
setTimeout(()=>{ |
||||
uni.removeStorageSync("orcInfo"); |
||||
uni.redirectTo({ |
||||
url: "/pages/news/caigou/notice5" |
||||
}) |
||||
},1000) |
||||
}else{ |
||||
this.isClick = true; |
||||
uni.showToast({ |
||||
icon: "none", |
||||
title: message |
||||
}) |
||||
} |
||||
}, |
||||
openPage() { |
||||
if(this.isClick == false){ |
||||
return; |
||||
} |
||||
this.isClick = false; |
||||
if(this.paymentMethods[this.tabIndex].method == "balance"){ |
||||
if(Number(this.info.price) <= Number(this.personal.balance)){ |
||||
this.toPay() |
||||
}else{ |
||||
this.isClick = true; |
||||
uni.showToast({ |
||||
icon: "none", |
||||
title: "余额不足，请选择其他支付方式" |
||||
}) |
||||
} |
||||
}else if(this.paymentMethods[this.tabIndex].method == "wechat"){ |
||||
this.toWechatPay(); |
||||
} |
||||
|
||||
}, |
||||
async openPage1() { |
||||
if(this.isClick == false){ |
||||
return; |
||||
} |
||||
this.isClick = false; |
||||
const that = this; |
||||
const {status, message} = await newFunApi.wholesalerEditApply({ |
||||
client: "MP-WEIXIN", |
||||
username: this.orcInfo.username, |
||||
mobile: this.orcInfo.mobile, |
||||
mobile_code: this.orcInfo.mobile_code, |
||||
card_front_img_id: this.orcInfo.card_front_img_id, |
||||
card_back_img_id: this.orcInfo.card_back_img_id, |
||||
license_img_id: this.orcInfo.license_img_id, |
||||
card_no: this.orcInfo.card_no, |
||||
door_img_id: this.orcInfo.door_img_id, |
||||
province_id: this.orcInfo.province_id, |
||||
company_name: this.orcInfo.company_name, |
||||
city_id: this.orcInfo.city_id, |
||||
credit_code: this.orcInfo.credit_code, |
||||
business: this.orcInfo.business, |
||||
avatar_id: this.orcInfo.avatar_id, |
||||
}) |
||||
if(status == 200) { |
||||
uni.showToast({ |
||||
title: "提交成功" |
||||
}) |
||||
this.isClick = true; |
||||
setTimeout(()=>{ |
||||
uni.removeStorageSync("orcInfo"); |
||||
uni.redirectTo({ |
||||
url: "/pages/news/caigou/notice5" |
||||
}) |
||||
},1000) |
||||
}else{ |
||||
this.isClick = true; |
||||
uni.showToast({ |
||||
icon: "none", |
||||
title: message |
||||
}) |
||||
} |
||||
} |
||||
}, |
||||
|
||||
|
||||
} |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
.notice{ |
||||
min-height: 100vh; |
||||
background: url(https://wholesaler.royaum.com.cn/static/caigou/bg@2x.png) center top no-repeat; |
||||
background-size: 100% auto; |
||||
padding-bottom: 150rpx; |
||||
&-bd{ |
||||
width: 700rpx; |
||||
margin: 0 auto; |
||||
text-align: justify; |
||||
border-radius: 10rpx; |
||||
box-sizing: border-box; |
||||
padding: 0 20rpx; |
||||
box-sizing: border-box; |
||||
background-color: #fff; |
||||
margin: 0 auto; |
||||
margin-top: 20rpx; |
||||
.title{ |
||||
padding: 30rpx 0; |
||||
font-size: 30rpx; |
||||
} |
||||
.item{ |
||||
padding: 20rpx 0; |
||||
display: flex; |
||||
align-items: center; |
||||
font-size: 28rpx; |
||||
color: #212121; |
||||
image{ |
||||
width: 30rpx; |
||||
height: 30rpx; |
||||
margin-right: 20rpx; |
||||
} |
||||
text{ |
||||
margin-left: 20rpx; |
||||
color: #666; |
||||
} |
||||
} |
||||
.a{ |
||||
width: 702rpx; |
||||
min-height: 454rpx; |
||||
background: #FFFFFF; |
||||
border-radius: 20rpx; |
||||
border: 1px solid #FFC8D7; |
||||
margin: 15rpx auto; |
||||
padding: 10rpx 20rpx 30rpx; |
||||
box-sizing: border-box; |
||||
text-align: center; |
||||
.title{ |
||||
font-weight: 400; |
||||
font-size: 36rpx; |
||||
padding: 20rpx 0; |
||||
color: #222222; |
||||
} |
||||
.desc{ |
||||
font-size: 24rpx; |
||||
color: #999999; |
||||
} |
||||
.list{ |
||||
overflow: hidden; |
||||
.item{ |
||||
width: 25%; |
||||
text-align: center; |
||||
float: left; |
||||
margin-top: 25rpx; |
||||
font-size: 24rpx; |
||||
color: #333333; |
||||
display: block; |
||||
image{ |
||||
width: 90rpx; |
||||
height: 90rpx; |
||||
display: block; |
||||
margin: 0 auto 15rpx; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.b{ |
||||
padding: 60rpx 0 20rpx; |
||||
.title{ |
||||
font-size: 30rpx; |
||||
color: #222222; |
||||
position: relative; |
||||
&::after{ |
||||
content: ""; |
||||
width: 8rpx; |
||||
height: 30rpx; |
||||
border-radius: 10rpx; |
||||
background-color: #F34A40; |
||||
position: absolute; |
||||
left: -25rpx; |
||||
top: 4rpx; |
||||
z-index: 2; |
||||
} |
||||
} |
||||
.list{ |
||||
.item{ |
||||
padding: 30rpx 0 0; |
||||
overflow: hidden; |
||||
display: flex; |
||||
align-items: flex-start; |
||||
image{ |
||||
width: 82rpx; |
||||
height: 82rpx; |
||||
margin-right: 20rpx; |
||||
} |
||||
.info{ |
||||
padding-bottom: 30rpx; |
||||
border-bottom: 1px solid #E9E9E9; |
||||
max-width: 500rpx; |
||||
.name{ |
||||
font-size: 28rpx; |
||||
color: #F34A40; |
||||
} |
||||
.desc{ |
||||
font-size: 24rpx; |
||||
color: #666666; |
||||
line-height: 36rpx; |
||||
margin-top: 15rpx; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
&-fd{ |
||||
height: 140rpx; |
||||
width: 100%; |
||||
position: fixed; |
||||
left: 0; |
||||
bottom: 0; |
||||
z-index: 22; |
||||
background-color: #FFFFFF; |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
.btn{ |
||||
width: 662rpx; |
||||
height: 90rpx; |
||||
line-height: 90rpx; |
||||
background: #F34A40; |
||||
border-radius: 90rpx; |
||||
text-align: center; |
||||
font-size: 32rpx; |
||||
color: #FFFFFF; |
||||
&-on{ |
||||
background-color: #ccc; |
||||
} |
||||
text{ |
||||
text-decoration: line-through; |
||||
font-size: 24rpx; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,97 @@ |
||||
<template> |
||||
<view class="notice"> |
||||
<view class="notice-bd"> |
||||
<view class="a"> |
||||
<image src="https://wholesaler.royaum.com.cn/static/caigou/success.png"></image> |
||||
<view class="title">支付成功</view> |
||||
<!-- <view class="desc">您的申请资料已经提交成功， 预计1-2个工作日内审核完成。</view> --> |
||||
</view> |
||||
</view> |
||||
<view class="notice-fd"> |
||||
<view class="btn" @click="openPage()">完成</view> |
||||
</view> |
||||
<addShuiyin /> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
value: "" |
||||
}; |
||||
}, |
||||
methods: { |
||||
openPage() { |
||||
uni.switchTab({ |
||||
url: "/pages/user/index" |
||||
}) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
.notice{ |
||||
height: 100vh; |
||||
background-color: #fff; |
||||
padding-bottom: 150rpx; |
||||
&-bd{ |
||||
width: 700rpx; |
||||
margin: 0 auto; |
||||
text-align: justify; |
||||
border-radius: 10rpx; |
||||
padding: 0 45rpx; |
||||
box-sizing: border-box; |
||||
.a{ |
||||
padding: 20rpx 0; |
||||
.title{ |
||||
font-size: 36rpx; |
||||
color: #222222; |
||||
text-align: center; |
||||
margin-top: 30rpx; |
||||
} |
||||
.desc{ |
||||
width: 450rpx; |
||||
font-size: 28rpx; |
||||
color: #666666; |
||||
line-height: 48rpx; |
||||
text-align: center; |
||||
margin: 0 auto; |
||||
margin-top: 20rpx; |
||||
} |
||||
image{ |
||||
width: 189rpx; |
||||
height: 166rpx; |
||||
display: block; |
||||
margin: 0 auto; |
||||
margin-top: 80rpx; |
||||
} |
||||
} |
||||
} |
||||
&-fd{ |
||||
height: 140rpx; |
||||
width: 100%; |
||||
position: fixed; |
||||
left: 0; |
||||
bottom: 0; |
||||
z-index: 22; |
||||
background-color: #FFFFFF; |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
.btn{ |
||||
width: 662rpx; |
||||
height: 90rpx; |
||||
line-height: 90rpx; |
||||
background: #F34A40; |
||||
border-radius: 90rpx; |
||||
text-align: center; |
||||
font-size: 32rpx; |
||||
color: #FFFFFF; |
||||
&-on{ |
||||
background-color: #ccc; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue