This commit is contained in:
2021-09-18 17:19:17 +08:00
39 changed files with 1068 additions and 84031 deletions

View File

@@ -47,12 +47,29 @@ const marketsPay = (id, platform) => {
})
}
//
// 转让权证信息
const marketsCreateInfo = symbol => {
return request({
url: 'markets/user/markets/create',
data: { symbol }
})
}
// 提交权证转让
const marketsCreate = data => {
return request({
url: 'markets/user/markets/create',
method: 'POST',
data
})
}
export {
markets,
marketsLogs,
marketsInfo,
marketsBuy,
marketsPay
marketsPay,
marketsCreateInfo,
marketsCreate
}

View File

@@ -47,10 +47,18 @@ const basicsInfo = (method, data) => {
})
}
// 营销推广码
const companiesCode = () => {
return request({
url: 'companies/code'
})
}
export {
index,
customer,
visitors,
basicsConfig,
basicsInfo
basicsInfo,
companiesCode
}

View File

@@ -16,10 +16,11 @@ const identities = () => {
}
// 开通会员
const vipOrder = id =>{
const vipOrder = (id, data) =>{
return request({
url : 'user/identities/create/' + id,
method : 'POST'
method : 'POST',
data : data
})
}
@@ -30,8 +31,25 @@ const vipWechatPay = id => {
})
}
// 开通身份内容
const vipCont = (id, data) =>{
return request({
url : 'user/identities/create/' + id,
data : data
})
}
// 会员开通协议
const userAgree = () =>{
return request({
url : 'articles/agreement/openvip'
})
}
export {
identities,
vipOrder,
vipWechatPay
vipWechatPay,
vipCont,
userAgree
}

View File

@@ -51,9 +51,10 @@
<image class="arrow" src="@/static/icons/equity_arrow_right.png" mode="aspectFill"></image>
</view>
<view class="store-item">
<view class="store-item" @click="$Router.push({name: 'Spread'})">
<image class="icon" src="@/static/icons/tool_icon_06.png" mode="aspectFill"></image>
<view class="title">营销推广码</view>
<image class="arrow" src="@/static/icons/equity_arrow_right.png" mode="aspectFill"></image>
</view>
</view>
</view>

View File

@@ -268,6 +268,15 @@
"navigationBarTextStyle": "white",
"backgroundColor": "#fefaef"
}
}, {
"path": "pages/vip/agree",
"name": "vipAgree",
"style": {
"navigationBarTitleText": "用户协议",
"navigationBarBackgroundColor": "#1f1b1c",
"navigationBarTextStyle": "white",
"backgroundColor": "#fefaef"
}
}, {
"path": "pages/equity/search",
"name": "Search",
@@ -350,6 +359,13 @@
}
}
}
}, {
"path": "pages/store/Spread",
"name": "Spread",
"style": {
"navigationBarTitleText": "营销推广码",
"navigationBarBackgroundColor": "#FFFFFF"
}
}, {
"path": "pages/employees/list",
"name": "Employees",
@@ -518,6 +534,20 @@
"type": "transparent"
}
}
},{
"path" : "pages/pay/results",
"name" : "payResults",
"style": {
"navigationBarTitleText": "支付结果",
"backgroundColor": "#FFFFFF"
}
},{
"path" : "pages/market/transfer",
"name" : "marketTransfer",
"style": {
"navigationBarTitleText": "转让权证",
"backgroundColor": "#FFFFFF"
}
}
],
"tabBar": {

View File

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

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;
}
}
}
}

View File

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

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))

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>

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>

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>

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>

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;
}
}
}
// 会员权限

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

BIN
static/icons/store_down.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

BIN
static/icons/vip_icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB