TmOct5/barter-app
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

[...]

Browse Source
This commit is contained in:
张冬雪
2021-09-18 17:19:17 +08:00
parent 17074af70d b7cacb38c7
commit aa1788fa8d
39 changed files with 1068 additions and 84031 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
pages/goods/chain.vue
View File

@@ -19,7 +19,6 @@
<view class="companyInfo">易品新境区块链有限公司</view>
</view>
</view>
<!-- 弹窗提示喽 -->
<u-toast ref="uToast" />
</view>

38
pages/goods/details.vue
View File

@@ -129,9 +129,13 @@
{{item.time.interval}}
</view>
</view>
<view class="coupons-right" @click="drawCoupons(item.coupon_id)">
<view v-if="item.can.get" class="coupons-right" @click="drawCoupons(item.coupon_id, index)">
领取
</view>
<view v-else class="coupons-right coupons-right-active">
已领取
</view>
</view>
</view>
<view class="coupons-true" @click="couponsClose">
@@ -148,7 +152,7 @@
<image @click="serveClose" class="close" src="../../static/icons/goods_close.png" mode=""></image>
</view>
<view class="serve-cont">
<view class="serve-label" v-for="(item, index) in goodsObj.services">
<view class="serve-label" v-for="(item, index) in goodsObj.services" :key="index">
<view class="serve-label-name">
{{item.name}}
</view>
@@ -180,13 +184,13 @@
};
},
created() {
goods(this.$Route.query.id || 16).then(res=>{
goods(this.$Route.query.id).then(res=>{
this.loding = false
this.goodsObj = res
this.identity = res.identity.id || ''
this.company = res.company
this.couponSee= res.coupons.slice(0, 3)
this.coupons = res.coupons
this.couponSee= res.coupons.slice(0, 3)
this.coupons = res.coupons
})
},
methods:{
@@ -236,10 +240,24 @@
// 领取优惠券
drawCoupons(id){
console.log(id)
let token = this.$store.getters.getToken
if(token == ''){
let userLogin = new userAuth()
userLogin.Login()
return
}
managesCoupons(id).then(res=>{
console.log(res)
})
uni.showToast({
title: '领取成功',
type: 'primary',
duration: 3000
})
}).catch(err => {
uni.showToast({
icon : 'none',
title: err.message
})
})
},
// 选择优惠券-显示
@@ -682,6 +700,10 @@
border-radius: 80rpx;
font-size: 24rpx;
line-height: 52rpx;
&.coupons-right-active {
background-color: #adadad;
color: #FFFFFF;
}
}
}
}

1
pages/goods/lists.vue
View File

@@ -29,6 +29,7 @@
},
created() {
list().then(res=>{
console.log(res.data)
this.goods = res.data
this.pages = res.page
})

23
pages/market/details.vue
View File

@@ -83,6 +83,7 @@
<script>
import { marketsInfo, marketsBuy, marketsPay } from '@/apis/interfaces/market'
import userAuth from '@/public/userAuth'
export default {
data() {
return {
@@ -98,8 +99,8 @@
}
};
},
created() {
marketsInfo(this.$Route.query.marketId || 5).then(res =>{
onShow() {
marketsInfo(this.$Route.query.marketId).then(res =>{
this.info = res
this.price = res.price
this.loding = false
@@ -121,6 +122,12 @@
},
// 购买弹窗
openLay(){
let token = this.$store.getters.getToken
if(token == ''){
let userLogin = new userAuth()
userLogin.Login()
return
}
this.$refs.buyLay.open('bottom')
},
// 计算价格
@@ -149,8 +156,16 @@
marketsPay(this.orderNo, this.payValue).then(res => {
switch (this.payValue){
case 'eb':
console.log(res)
console.log('支付结果')
this.$refs.payLay.close()
this.$Router.push({
name : 'payResults',
params : {
index: 1,
price: this.price,
type : 'eb',
total: '可在我的资产下我的权证中查看购买的数字权证'
}
})
break
case 'wechat':
this.wxPay(JSON.parse(res))

10
pages/market/index.vue
View File

@@ -11,7 +11,7 @@
</view>
</view>
<view class="lists">
<view class="item" v-for="(item, index) in marketArray" :key="index">
<view class="item" v-for="(item, index) in marketArray" :key="index" @click="onDetails(item)">
<image class="cover" :src="item.goods.cover" mode="aspectFill"></image>
<view class="content">
<view class="title nowrap">数字权证<text>{{item.surplus}}/{{item.stock}}</text></view>
@@ -36,7 +36,7 @@
page : {}
};
},
created() {
onShow() {
this.getMarkets()
},
methods:{
@@ -53,10 +53,14 @@
markets({
sort: this.tabIndex == 1 ? this.marketType : ''
}).then(res => {
console.log(res.data)
this.marketArray = res.data
this.page = res.page
})
},
// 转让商品详情
onDetails(e){
this.$Router.push({name: 'marketDetails', params: {marketId: e.market_id}})
console.log(e)
}
},
onNavigationBarButtonTap(){

239
pages/market/transfer.vue Normal file
View File

@@ -0,0 +1,239 @@
<template>
<view v-if="!loding">
<!-- 产品信息 -->
<view class="goods">
<image class="cover" :src="info.goods.cover" mode="aspectFill"></image>
<view class="content">
<view class="title nowrap">数字权证</view>
<view class="text nowrap">锚定商品：{{info.goods.goods_name}}</view>
<view class="text nowrap">提供企业：{{info.goods.company.name}}</view>
<view class="text nav-goods nowrap" @click="onGoods">查看锚定商品信息<uni-icons type="arrowright" size="12" color="#e93340"></uni-icons></view>
</view>
<view class="info">
<view class="info-item">
<label>权证销售单价</label>
1000.00
</view>
<view class="info-item">
<label>拥有数量</label>
{{info.account.balance}}
</view>
<view class="info-item">
<label>转让价格</label>
<input class="info-input" type="digit" v-model="pirce" placeholder="输入转让价格" maxlength="5" @blur="calculatePirce" />
</view>
<view class="info-item info-flex">
<label>转让数量</label>
<uni-number-box class="info-number" v-model='stock' :min="1" :max="info.account.balance" @change="countPrice"></uni-number-box>
</view>
<view class="info-item">
<label>预估转让收益</label>
<view class="price">{{forecast}}</view>
</view>
</view>
</view>
<button class="buy-btn" type="default" @click="onCreate">确认转让</button>
</view>
</template>
<script>
import { marketsCreateInfo, marketsCreate } from '@/apis/interfaces/market'
export default {
data() {
return {
loding : true,
pirce : '',
stock : 1,
info : {},
forecast: '0.00'
};
},
onShow() {
marketsCreateInfo(this.$Route.query.symbol).then(res =>{
this.info = res
this.loding = false
}).catch(err => {
uni.showToast({
title: err.message,
icon : 'none'
})
})
},
methods:{
// 查看锚定产品
onGoods(){
this.$Router.push({name: 'marketGoods', params: { id: this.info.goods.goods_id }})
},
// 转让数量
countPrice(e){
this.stock = e
this.calculatePirce()
},
// 计算预估收益
calculatePirce(){
this.forecast = (this.pirce * this.stock).toFixed(2)
},
// 提交转让市场
onCreate(){
marketsCreate({
symbol : this.$Route.query.symbol,
qty : this.stock,
price : this.pirce || 0
}).then(res => {
uni.showModal({
title : '提示',
content : res,
showCancel : false,
success : () => {
this.$Router.back()
}
})
}).catch(err => {
console.log(err)
uni.showToast({
title: err.message,
icon : 'none'
})
})
}
}
}
</script>
<style lang="scss" scoped>
// 转让权证
.buy-btn{
margin: 0 $margin;
background: $text-price;
color: white;
height: 90rpx;
line-height: 90rpx;
padding: 0;
border-radius: $radius/2;
font-size: $title-size;
font-weight: bold;
&::after{
border: none;
}
}
// 产品信息
.goods{
min-height: 168rpx;
position: relative;
background: white;
border-radius: $radius/2;
margin: $margin;
padding: $padding;
.cover{
position: absolute;
left: $padding;
top: $padding;
width: 168rpx;
height: 168rpx;
}
.content{
padding-left: calc(168rpx + #{$padding});
.title{
position: relative;
font-size: $title-size-lg;
color: $text-color;
font-weight: bold;
line-height: 52rpx;
padding-right: 60rpx;
text{
position: absolute;
right: 0;
top: 0;
width: 60rpx;
text-align: right;
font-weight: normal;
}
}
.text{
font-size: $title-size-sm;
color: $text-gray;
height: 40rpx;
line-height: 40rpx;
&.nav-goods{
color: $text-price;
}
}
}
.info{
margin-top: $margin;
border-top: solid 1rpx $border-color;
padding-top: $padding;
.info-item{
padding-left: 200rpx;
height: 90rpx;
line-height: 90rpx;
position: relative;
text-align: right;
font-size: $title-size-lg;
&.info-flex{
display: flex;
justify-content: flex-end;
align-items: center;
}
@extend .nowrap;
label{
position: absolute;
left: 0;
top: 0;
width: 200rpx;
text-align: left;
color: $text-gray;
}
.info-input{
height: 80rpx;
line-height: 80rpx;
font-size: $title-size-lg;
}
.price{
color: $text-price;
font-weight: bold;
}
}
}
}
// 购买产品
.popup {
width: 100%;
background-color: #fff;
padding-bottom: $padding;
.title {
font-size: 36rpx;
text-align: center;
padding: 50rpx 30rpx 30rpx 30rpx;
font-weight: bold;
}
.btn {
background-color: $text-price;
height: 90rpx;
line-height: 90rpx;
text-align: center;
color: #fff;
font-weight: bold;
font-size: $title-size;
margin: $padding * 2;
border-radius: $radius/2;
}
.des {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
padding: $padding $padding * 2;
color: $text-gray;
font-size: $title-size-lg;
text{
color: $text-color;
}
.price{
color: $main-color;
font-weight: bold;
}
}
}
</style>

81
pages/order/buy.vue
View File

@@ -20,12 +20,12 @@
<label>订单金额</label>
<view class="price nowrap">{{amount}}</view>
</view>
<block v-if="coupons.length > 0">
<block v-if="coupons.length > 1">
<view class="item">
<label>使用优惠券</label>
<picker>
<picker mode="selector" :range="coupons" range-key="title" :value="couponIndex" @change="couponsChange">
<view class="picker-text nowrap">
优惠券
{{couponIndex == 0 ? '选择优惠券' : coupons[couponIndex].title}}
<uni-icons type="arrowright" color="#ddd"></uni-icons>
</view>
</picker>
@@ -35,6 +35,10 @@
<view class="price nowrap">-{{couponPrice}}</view>
</view>
</block>
<view class="item">
<label>实际支付金额</label>
<view class="price nowrap">{{total}}</view>
</view>
</view>
<!-- 支付方式 -->
<radio-group class="pay-group" @change="payType">
@@ -71,6 +75,8 @@
amount : 0,
total : 0,
coupons : [],
couponIndex : 0,
couponId : '',
account : {},
payValue : 'eb',
}
@@ -78,16 +84,15 @@
created(){
buy({
goods_sku_id: this.$Route.query.skuId,
qty : this.$Route.query.qty,
qty : this.qty,
type : 1
}, 'GET').then(res=>{
this.loding = true
this.qty = this.$Route.query.qty,
this.payValue = this.$Route.query.type === 1 ? 'wx' : 'eb'
this.detail = res.detail
this.couponPrice = res.coupon_price
this.amount = res.amount
this.total = res.total
this.couponPrice = res.coupon_price.toFixed(2)
this.amount = res.amount.toFixed(2)
this.total = res.total.toFixed(2)
this.coupons = res.coupons
this.account = res.account
}).catch(err =>{
@@ -98,6 +103,35 @@
})
},
methods: {
// 获取可用优惠券
getCoupons(){
buy({
goods_sku_id : this.$Route.query.skuId,
qty : this.qty,
type : 1,
coupon_grant_id : this.couponId
}, 'GET').then(res=>{
this.couponPrice = res.coupon_price.toFixed(2)
this.amount = res.amount.toFixed(2)
this.total = res.total.toFixed(2)
this.coupons = [{
title : '不使用',
coupon_grant_id : ''
}, ...res.coupons]
}).catch(err =>{
uni.showToast({
title: err.message,
icon : 'none'
})
})
},
// 选择优惠券
couponsChange(e){
this.couponIndex = e.detail.value
this.couponId = this.coupons[e.detail.value].coupon_grant_id
this.getCoupons()
},
// 选择支付类型
payType(e){
this.payValue = e.detail.value
},
@@ -105,17 +139,20 @@
//数量变化
numberChange(e){
this.qty = e
this.amount = this.detail[0].items[0].price * e
this.getCoupons()
},
// 提交订单
buyOrder(){
buy({
goods_sku_id: this.$Route.query.skuId || 23,
qty : this.qty,
type : this.payValue == 'eb' ? 1 : 2,
remark : 'app订单'
goods_sku_id : this.$Route.query.skuId,
qty : this.qty,
coupon_grant_id : this.couponId,
type : 1,
remark : 'app订单，易货产品',
channel : 'app'
}, 'POST').then(res=>{
console.log(res)
switch (this.payValue){
case 'eb':
this.ebPay(res.order_no)
@@ -147,14 +184,20 @@
// 易币支付
ebPay(orderNo){
eb(orderNo).then(res => {
uni.showModal({
title: '提示',
content: '支付成功，后续优化支付成功后直接转跳我的权证'
this.$Router.replace({
name : 'payResults',
params : {
index: 1,
price: this.total,
type : 'eb',
total: '可在我的资产下我的权证中查看购买的数字权证'
}
})
}).catch(err => {
uni.showToast({
title: err.message,
icon : 'none'
uni.showModal({
title : '支付提示',
content : err.message,
showCancel : false,
})
})
}

76
pages/pay/results.vue Normal file
View File

@@ -0,0 +1,76 @@
<template>
<view class="total vertical">
<uni-icons type="checkbox-filled" size="60" color="#e93340"></uni-icons>
<view class="title">支付成功</view>
<view class="price">支付金额<text>{{type}}{{price}}</text></view>
<view class="text">{{total}}</view>
<button class="btn" type="default" @click="onBack">确定</button>
</view>
</template>
<script>
export default {
data() {
return {
index: 1, // 返回层级
price: 0, // 支付金额
type : '￥', // 支付币种
total: '' // 支付提示语
};
},
created() {
this.index = this.$Route.query.index
this.price = this.$Route.query.price
this.type = this.$Route.query.type === 'eb' ? 'EB': '￥'
this.total = this.$Route.query.total
},
methods:{
onBack(){
this.$Router.back(this.index)
}
}
}
</script>
<style lang="scss" scoped>
.total{
text-align: center;
height: 100vh;
width: 100vw;
padding-left: 10vw;
padding-right: 10vw;
padding-bottom: 20vh;
box-sizing: border-box;
.title{
font-weight: bold;
font-size: $title-size + 10;
padding: 20rpx 0
}
.price{
font-size: $title-size-lg;
color: $text-gray;
text{
color: $text-price;
padding-left: 10rpx;
}
}
.text{
font-size: $title-size-lg;
color: $text-gray;
padding-top: $padding;
}
.btn{
height: 90rpx;
line-height: 90rpx;
border-radius: 0;
background: $text-price;
font-size: $title-size;
color: white;
font-weight: bold;
margin-top: 10vh;
&::after{
border: none;
}
}
}
</style>

6
pages/property/order/numberWeight.vue
View File

@@ -6,6 +6,7 @@
<view class="order-list" v-for="(item,index) in lists" :key="index">
<NumberWeightTemplate :item="item" />
<view class="actions">
<view @click="navMarkets(item.symbol)" class="nowPay">权证转让</view>
<view @click="nowTake(item.symbol)" class="nowPay">去提货</view>
</view>
</view>
@@ -64,6 +65,7 @@
page:this.page
}
mallWarrants(data).then(res=>{
console.log(res)
this.lists = this.lists.concat(res.data)
this.total = res.total
}).catch(err=>{
@@ -79,6 +81,10 @@
uni.navigateTo({
url:'./numberWeightInfo?symbol='+symbol
})
},
// 转让权证
navMarkets(symbol){
this.$Router.push({name: 'marketTransfer', params:{symbol}})
}
}
}

84
pages/store/Spread.vue Normal file
View File

@@ -0,0 +1,84 @@
<template>
<view class="content">
<view class="codeContent">
<image class="codeContent-back" src="../../static/icons/store_codeBack.png" mode="widthFix"></image>
<view class="company">
<image class="company-logo" src="../../static/dev/good_cover_00.jpg" mode="aspectFill"></image>
<view class="company-cont">
<view class="company-name">如朗科技</view>
<view class="company-name">邀请你加入易货平台</view>
</view>
</view>
<image class="codeContent-code" src="../../static/dev/good_cover_03.jpg" mode="aspectFit"></image>
</view>
<view class="codeBnt">
<image class="codeBnt-img" src="../../static/icons/store_down.png" mode="aspectFill"></image>
保存图片
</view>
</view>
</template>
<script>
import { companiesCode } from '@/apis/interfaces/store'
export default {
data() {
return {
codeImg: ''
}
},
created() {
// companiesCode().then(res=>{
// this.codeImg = res
// })
},
methods: {
}
}
</script>
<style lang="scss" scoped>
.content {
background-color: #e1293f;
height: 100vh;
width: 100vw;
padding: 80rpx;
box-sizing: border-box;
}
.codeContent {
position: relative;
width: 100%;
.codeContent-back {
width: 100%;
height: 100%;
z-index: 1;
position: absolute;
box-shadow: 0 0 20rpx rgba(115,0,4,.3);
}
.company {
position: absolute;
width: 100%;
}
}
.codeBnt {
background-color: #FFFFFF;
text-align: center;
border-radius: 10rpx;
line-height: 90rpx;
font-weight: 600;
font-size: $title-size;
color: #e1293f;
margin-top: 160rpx;
box-shadow: 4rpx 0 10rpx rgba(155,0,19,.5);
position: relative;
.codeBnt-img {
position: absolute;
top: 0;
width: 60rpx;
height: 60rpx;
left: 24%;
}
}
</style>

1
pages/store/index.vue
View File

@@ -268,6 +268,7 @@
display: inline-block;
border-radius: 0 60rpx 60rpx 0;
position: relative;
text-transform: uppercase;
.btn-img {
position: absolute;
width: 38rpx;

39
pages/vip/agree.vue Normal file
View File

@@ -0,0 +1,39 @@
<template>
<view>
<view class="contentTitle">
<rich-text :nodes="content"></rich-text>
</view>
</view>
</template>
<script>
import { userAgree } from '@/apis/interfaces/vip'
export default {
data() {
return {
content: ''
}
},
created() {
userAgree().then(res => {
console.log(res.content)
this.content = res.content
}).catch(err =>{
uni.showToast({
title: err.message,
icon : 'none'
})
})
},
methods: {
}
}
</script>
<style lang="scss" scoped>
.contentTitle {
padding: $padding;
box-sizing: border-box;
}
</style>

480
pages/vip/index.vue
View File

@@ -1,30 +1,108 @@
<template>
<!-- v-if="!loding" -->
<view class="content">
<!-- <swiper class="vip-container" previous-margin="45rpx" next-margin="45rpx" circular @change="swiperChange">
<swiper-item class="vip-item">
<view>
VIP企业会员
<swiper class="vip-container" previous-margin="45rpx" next-margin="45rpx" circular @change="swiperChange">
<swiper-item class="swiper-item" v-for="(item, index) in identities" :key="index">
<view class="vip-item" :class="tabsIndex == index ? 'color-item-img' : ''">
<view class="vip-top">
<view class="vip-name">
<image class="vip-name-icon" src="../../static/icons/vip_icon.png" mode="aspectFill"></image>
{{item.name}}
</view>
<view class="vip-price">
{{identities[tabsIndex].price}}/年
</view>
</view>
<view class="vip-time">
{{identityTime}}
</view>
</view>
</swiper-item>
<swiper-item class="vip-item">
<view>
普通会员
</view>
</swiper-item>
<swiper-item class="vip-item">
<view>
超级会员
</view>
</swiper-item>
</swiper> -->
</swiper>
<!-- 轮播点 -->
<view class="vip-spot">
<view class="vip-spot-label" :class="tabsIndex == index ? 'vip-spot-color' : ''" v-for="(item, index) in identities" :key="index"></view>
</view>
<!-- 选择开通年限 -->
<view class="vip-years">
<view class="vip-years-name">
<image class="vip-years-icon" src="../../static/icons/vip_yearsIcon.png" mode="aspectFill"></image>
选择开通年限
</view>
<view class="vip-years-tool">
<view class="vip-years-btn" @click="yearsBtn('remove')">-</view>
<view class="vip-years-input">{{sumNumber}}</view>
<view class="vip-years-btn" @click="yearsBtn('plus')">+</view>
</view>
</view>
<!-- 会员特权 -->
<view class="privilege">
<image class="privilege-img" src="../../static/icons/vip_privilege_tittle.png" mode="heightFix"></image>
<view class="privilege-list">
<view class="privilege-label" v-for="(item, index) in rights" :key="index">
<image class="privilege-label-tips" src="../../static/icons/vip_privilege_tips.png" mode="heightFix"></image>
<view class="privilege-label-text">
{{item.name}}
</view>
</view>
</view>
</view>
<!-- 支付方式 -->
<view class="privilege payWay">
<image class="privilege-img" src="../../static/icons/vip_pay_title.png" mode="heightFix"></image>
<view class="payWay-way">
<radio-group @change="radioChange">
<view class="payWay-way-label">
<view class="payWay-way-name">
<image class="payWay-way-img" src="../../static/icons/payWay_icon_00.png"></image>
<text>微信支付</text>
</view>
<radio class="radio" value="weChat" checked style="transform: scale(.8);" color="#ff2828"></radio>
</view>
<view class="payWay-way-label">
<view class="payWay-way-name">
<image class="payWay-way-img" src="../../static/icons/payWay_icon_01.png"></image>
<text>余额支付</text>
</view>
<radio class="radio" value="balance" style="transform: scale(.8);" color="#9b9b9b"></radio>
</view>
</radio-group>
</view>
</view>
<!-- 用户协议 -->
<view class="agree">
<view class="agree-tips" @click="$Router.push({name: 'vipAgree'})">
请仔细阅读并确认服务协议
</view>
</view>
<view class="agree-btn" @click="agreeChange">
<radio :checked="selected" style="transform: scale(.7);" color="#ff2828"></radio>会员服务协议
</view>
<!-- 开通按钮 -->
<view class="footer">
<button class="footer-btn" type="default" @click="openOrder" :disabled="payChecked">
<view class="footer-btn-num">
合计：{{total}}
</view>
<view class="footer-btn-pay">
立即支付
</view>
</button>
</view>
<!-- 会员类型 -->
<view class="tabs">
<!-- <view class="tabs">
<view class="item" :class="{'show': index === tabsIndex}" v-for="(item, index) in identities" :key="index" @click="onTabs(index)">{{item.name}}</view>
</view>
</view> -->
<!-- 会员信息 -->
<view class="cards">
<!-- <view class="cards">
<view class="card">
<view class="card-content">
<image class="cover" src="@/static/dev/good_cover_01.png" mode="aspectFill"></image>
@@ -35,9 +113,9 @@
</view>
<view class="cards-back"></view>
<image class="cards-angle" src="@/static/imgs/vip-angle-back.png" mode="widthFix"></image>
</view>
</view> -->
<!-- 会员权限 -->
<view class="privilege">
<!-- <view class="privilege">
<view class="title">开通会员享特权</view>
<view class="privilege-box">
<view class="item" v-for="(item, index) in rights" :key="index" @click="showRemark(item.name, item.remark)">
@@ -45,23 +123,23 @@
<view class="text">{{item.name}}</view>
</view>
</view>
</view>
</view> -->
<!-- 会员 -->
<view class="footer">
<!-- <view class="footer">
<button class="footer-btn" type="default" @click="openOrder">￥{{identities[tabsIndex].price}}/年&nbsp;开通</button>
</view>
</view> -->
<!-- 会员服务信息 -->
<view class="notice">
<!-- <view class="notice">
<view class="title">开通须知</view>
<view class="item">
<text>{{description}}</text>
</view>
</view>
</view> -->
</view>
</template>
<script>
import { identities, vipOrder, vipWechatPay } from '@/apis/interfaces/vip'
import { identities, vipOrder, vipWechatPay, vipCont } from '@/apis/interfaces/vip'
export default {
data() {
return {
@@ -70,43 +148,63 @@
user : {},
identities : [],
rights : [],
description : ''
description : '',
identityTime: '', // 到期时间
valuePay : 'weChat', // 支付方式
sumNumber : 1, // 开通年限
total : '', // 开通年限总资金额
selected : false, // 用户协议
payChecked : false // 支付选择
}
},
created() {
// 获取当前用户信息
identities().then(res => {
this.loding = false
this.user = res.user
this.description= res.description
this.identities = res.identities
this.rights = res.identities[0].rights
this.total = res.identities[0].price
}).catch(err =>{
uni.showToast({
title: err.message,
icon : 'none'
})
})
// 获取支付总金额 默认传VIP会员id=2
this.totalData(2);
},
methods: {
// 切换开通身份
onTabs(index){
if(this.tabsIndex === index) return
this.tabsIndex = index
this.rights = this.identities[index].rights
},
// 会员权益介绍
showRemark(title, text){
uni.showModal({
title : title + '说明',
content : text,
showCancel : false
})
},
// onTabs(index){
// if(this.tabsIndex === index) return
// this.tabsIndex = index
// this.rights = this.identities[index].rights
// },
// 切换开通身份
swiperChange(e) {
this.tabsIndex = e.detail.current
this.total = this.identities[e.detail.current].price
this.sumNumber = 1
this.totalData(this.identities[e.detail.current].identity_id);
},
// 开通会员
openOrder(){
if(this.selected == false) {
uni.showToast({
title: '请勾选用户协议',
icon : 'none'
})
return
}
let identitiesId = this.identities[this.tabsIndex].identity_id
vipOrder(identitiesId).then(res => {
console.log(res.test)
vipOrder(identitiesId,{
year: this.sumNumber
}).then(res => {
if(!res.test){
let verifyForm = res
this.wechatPay(res.id)
@@ -137,6 +235,40 @@
})
})
},
// 选择权限
yearsBtn(val) {
let newNumber = this.sumNumber
if (val == 'plus'){
newNumber ++;
}else{
if (newNumber > 1){
newNumber --;
}else{
uni.showToast({
title : '商品数量不能小于1',
icon : 'none'
})
}
}
this.sumNumber = newNumber
this.totalData(this.identities[this.tabsIndex].identity_id);
},
// 支付总金额数据
totalData(id) {
vipCont(id,{
year: this.sumNumber
}).then(res => {
this.identityTime = res.identity.description
this.total = res.identity.price
}).catch(err =>{
uni.showToast({
title: err.message,
icon : 'none'
})
})
},
// 微信支付
wechatPay(id){
@@ -154,7 +286,35 @@
}
})
})
}
},
// 支付选择
radioChange(val) {
let valuePay = val.detail.value
if( val.detail.value == 'balance') {
uni.showToast({
title: '抱歉暂未开通',
icon : 'none'
})
this.payChecked = true
return
}
this.payChecked = false
},
// 勾选协议
agreeChange() {
this.selected = !this.selected
},
// 会员权益介绍
showRemark(title, text){
uni.showModal({
title : title + '说明',
content : text,
showCancel : false
})
}
}
}
</script>
@@ -164,20 +324,213 @@
background-color: #FFFFFF;
}
// 新增样式
.vip-container {
width: 750rpx;
height: 350rpx;
.vip-item {
background-color: #c8c8c8;
border-radius: 20rpx;
height: 300rpx;
margin-top: $margin;
}
.swiper-item {
width: 630rpx;
height: 280rpx;
display: flex;
}
.vip-item {
width: 630rpx;
height: 280rpx;
border-radius: 20rpx;
background-color: #c8c8c8;
padding: 0 40rpx;
box-sizing: border-box;
.vip-top {
display: flex;
position: relative;
height: 80rpx;
line-height: 80rpx;
margin: $margin + 20 0 $margin + 20;
.vip-name {
font-size: $title-size + 6;
border-radius: 60rpx;
padding: 0 $padding;
box-sizing: border-box;
background-image: linear-gradient(to right, #f11a22, #ff252f);
display: flex;
.vip-name-icon {
width: 50rpx;
height: 50rpx;
margin: $margin - 15 $margin - 10 0 0;
}
}
.vip-price {
font-size: $title-size + 10;
font-weight: 600;
position: absolute;
right: 0;
top: 0;
}
}
.vip-time {
font-size: $title-size-lg;
text-align: center;
}
}
.content{
min-height: 100vh;
background: #fefaef;
}
.color-item-img {
background-color: #ff252f;
color: #FFFFFF;
box-shadow: 0 0 20rpx rgba(145,196,255,.5);
}
// 轮播点
.vip-spot {
margin-bottom: $margin;
text-align: center;
.vip-spot-label {
display: inline-block;
background-color: #e8ecf1;
width: 80rpx;
height: 8rpx;
margin: 0 10rpx;
&.vip-spot-color {
background-color: #fb560a;
}
}
}
// 选择年限
.vip-years {
display: flex;
line-height: 60rpx;
padding: $padding + 10 $padding + 20;
box-sizing: border-box;
border-top: $padding - 10 solid #f8fbfe;
border-bottom: $padding - 10 solid #f8fbfe;
.vip-years-name {
flex: 1;
display: flex;
color: #c8c8c8;
.vip-years-icon {
width: 60rpx;
height: 60rpx;
margin-right: 20rpx;
}
}
.vip-years-tool {
display: flex;
.vip-years-btn {
background-color: #ff9f43;
color: #ffffff;
border-radius: 10rpx;
width: 48rpx;
height: 48rpx;
line-height: 40rpx;
text-align: center;
border: 2rpx solid #f8fbfe;
font-size: $title-size + 4;
font-weight: 600;
}
.vip-years-input {
line-height: 48rpx;
padding: 0 $padding;
color: #000000;
}
}
}
// 会员特权
.privilege {
text-align: center;
.privilege-img {
height: 40rpx;
}
.privilege-list {
padding: 0 $padding;
box-sizing: border-box;
text-align: left;
margin-top: $margin;
.privilege-label {
border-bottom: 2rpx #e6eaef dashed;
font-size: $title-size;
padding: $padding + 10 0;
display: flex;
.privilege-label-tips {
width: 40rpx;
height: 40rpx;
margin-right: 20rpx;
}
.privilege-label-text {
width: calc(100% - 60rpx);
}
}
}
}
// 支付方式
.payWay {
margin-top: $margin * 4;
.payWay-way {
padding: 0 $padding;
box-sizing: border-box;
margin-top: $margin;
.payWay-way-label {
display: flex;
border-bottom: 2rpx #e6eaef dashed;
padding: $padding 0;
.payWay-way-name {
font-size: $title-size;
line-height: 58rpx;
flex: 1;
display: flex;
.payWay-way-img {
width: 58rpx;
height: 58rpx;
margin-right: $margin - 10;
}
}
}
.radio[type="radio"].disabled {
background-color: #007aff;
border-color: #007aff;
color: #007aff;
&::before {
background-color: #007aff;
border-color: #007aff;
}
&::after {
background-color: #007aff;
border-color: #007aff;
}
}
}
}
// 用户协议
.agree {
margin: $margin 0;
text-align: center;
.agree-tips {
background-color: #999999;
display: inline-block;
padding: 14rpx $padding;
color: #FFFFFF;
border-radius: 60rpx;
}
}
.agree-btn {
display: flex;
font-size: $title-size-lg;
text-align: left;
color: #999999;
padding: $padding;
}
// .content{
// min-height: 100vh;
// background: #fefaef;
// }
// 开通须知
.notice{
font-size: $title-size-m;
@@ -195,16 +548,29 @@
}
// footer
.footer{
padding: $padding $padding*2;
padding: $padding;
box-sizing: border-box;
.footer-btn{
background-color: #201212;
padding: 0 $padding + 10;
box-sizing: border-box;
background-color: #ff2828;
height: 90rpx;
line-height: 90rpx;
padding: 0;
border-radius: 0;
color: #f7d79c;
border-radius: 60rpx;
color: #FFFFFF;
font-size: $title-size;
font-weight: bold;
text-align: left;
display: flex;
.footer-btn-num {
flex: 1;
}
.footer-btn-pay {
color: #f6ff00;
}
&[disabled] {
background-color: #b1b1b1;
}
}
}
// 会员权限