[...]

apis/interfaces/market.js

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

apis/interfaces/store.js

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

apis/interfaces/vip.js

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

components/store-staff/store-staff.vue

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

pages.json

@@ -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": {

pages/goods/chain.vue

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

pages/goods/details.vue

@@ -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.couponSee= res.coupons.slice(0, 3)
-                this.coupons  = res.coupons
+			    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;
+                    }
                 }
             }
         }

pages/goods/lists.vue

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

pages/market/details.vue

@@ -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() {
+		onShow() {
-			marketsInfo(this.$Route.query.marketId || 5).then(res =>{
+			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)
+							this.$refs.payLay.close()
-							console.log('支付结果')
+							this.$Router.push({
+								name	: 'payResults',
+								params	: {
+									index: 1,
+									price: this.price,
+									type : 'eb',
+									total: '可在我的资产下我的权证中查看购买的数字权证'
+								}
+							})
 							break
 						case 'wechat':
 							this.wxPay(JSON.parse(res))

pages/market/index.vue

@@ -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(){

pages/market/transfer.vue

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

pages/order/buy.vue

@@ -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.couponPrice = res.coupon_price.toFixed(2)
-				this.amount		 = res.amount
+				this.amount		 = res.amount.toFixed(2)
-				this.total		 = res.total
+				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,
+					goods_sku_id	: this.$Route.query.skuId,
-					qty			: this.qty,
+					qty				: this.qty,
-					type		: this.payValue == 'eb' ? 1 : 2,
+					coupon_grant_id	: this.couponId,
-					remark		: 'app订单'
+					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({
+					this.$Router.replace({
-						title: '提示',
+						name	: 'payResults',
-						content: '支付成功，后续优化支付成功后直接转跳我的权证'
+						params	: {
+							index: 1,
+							price: this.total,
+							type : 'eb',
+							total: '可在我的资产下我的权证中查看购买的数字权证'
+						}
 					})
 				}).catch(err => {
-					uni.showToast({
+					uni.showModal({
-						title: err.message,
+						title		: '支付提示',
-						icon : 'none'
+						content		: err.message,
+						showCancel	: false,
 					})
 				})
 			}

pages/pay/results.vue

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

pages/property/order/numberWeight.vue

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

pages/store/Spread.vue

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

pages/store/index.vue

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

pages/vip/agree.vue

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

pages/vip/index.vue

@@ -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 class="vip-container" previous-margin="45rpx" next-margin="45rpx" circular @change="swiperChange">
-        	<swiper-item class="vip-item">
+        	<swiper-item class="swiper-item" v-for="(item, index) in identities" :key="index">
-        		<view>
+        		<view class="vip-item" :class="tabsIndex == index ? 'color-item-img' : ''">
-        		    VIP企业会员
+        		    <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">
+        </swiper>
-            	<view>
+        
-            	    普通会员
+        <!-- 轮播点 -->
-            	</view>
+        <view class="vip-spot">
-            </swiper-item>
+            <view class="vip-spot-label" :class="tabsIndex == index ? 'vip-spot-color' : ''" v-for="(item, index) in identities" :key="index"></view>
-            <swiper-item class="vip-item">
+        </view>
-            	<view>
+        
-            	    超级会员
+        <!-- 选择开通年限 -->
-            	</view>
+        <view class="vip-years">
-            </swiper-item>
+            <view class="vip-years-name">
-        </swiper> -->
+                <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){
+			// onTabs(index){
-				if(this.tabsIndex === index) return
+			// 	if(this.tabsIndex === index) return
-				this.tabsIndex = index
+			// 	this.tabsIndex = index
-				this.rights	   = this.identities[index].rights
+			// 	this.rights	   = this.identities[index].rights
-			},
+			// },
-			// 会员权益介绍
+            
-			showRemark(title, text){
+            // 切换开通身份
-				uni.showModal({
+            swiperChange(e) {
-					title		: title + '说明',
+            	this.tabsIndex = e.detail.current
-					content		: text,
+                this.total     = this.identities[e.detail.current].price
-					showCancel	: false
+                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 => {
+				vipOrder(identitiesId,{
-					console.log(res.test)
+                    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;
+    	height: 300rpx;
-        .vip-item {
+        margin-top: $margin;
-            background-color: #c8c8c8;
+    }
-            border-radius: 20rpx;
+    
+    .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{
+    .color-item-img {
-		min-height: 100vh;
+        background-color: #ff252f;
-		background: #fefaef;
+        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: 60rpx;
-			border-radius: 0;
+			color: #FFFFFF;
-			color: #f7d79c;
 			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;
+            }
 		}
 	}
 	// 会员权限