更新优惠券领取

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

@@ -195,6 +195,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",
@@ -276,6 +285,13 @@
 					}
 				}
 			}
+		}, {
+			"path": "pages/store/Spread",
+			"name": "Spread",
+			"style": {
+				"navigationBarTitleText": "营销推广码",
+				"navigationBarBackgroundColor": "#FFFFFF"
+			}
 		}, {
 			"path": "pages/employees/list",
 			"name": "Employees",

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">
@@ -181,6 +185,8 @@
 		},
 		created() {
 			goods(this.$Route.query.id || 16).then(res=>{
+                console.log('啦啦啦')
+                console.log(res.coupons)
 				this.loding   = false
 				this.goodsObj = res
 				this.identity = res.identity.id || ''
@@ -235,10 +241,18 @@
 			},
             
             // 领取优惠券
-            drawCoupons(id){
+            drawCoupons(id, index){
-                console.log(id)
                 managesCoupons(id).then(res=>{
-                	console.log(res)
+                    uni.showToast({
+                        title: '领取成功',
+                        type: 'primary',
+                        duration: 3000
+                    })
+                }).catch(err =>{
+                    uni.showToast({
+                        title: err.message,
+                        icon : 'none'
+                    })
                 })
             },
             
@@ -682,6 +696,10 @@
                     border-radius: 80rpx;
                     font-size: 24rpx;
                     line-height: 52rpx;
+                    &.coupons-right-active {
+                        background-color: #adadad;
+                        color: #FFFFFF;
+                    }
                 }
             }
         }

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 class="vip-spot">
+            <view class="vip-spot-label" :class="tabsIndex == index ? 'vip-spot-color' : ''" v-for="(item, index) in identities" :key="index"></view>
         </view>
-            </swiper-item>
+        
-            <swiper-item class="vip-item">
+        <!-- 选择开通年限 -->
-            	<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>
-            </swiper-item>
-        </swiper> -->
         
 		<!-- 会员类型 -->
-		<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)
@@ -138,6 +236,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){
 				vipWechatPay(id).then(res => {
@@ -154,6 +286,34 @@
 						}
 					})
 				})
+			},
+            
+            // 支付选择
+            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
+            	})
             }
 		}
 	}
@@ -164,20 +324,213 @@
         background-color: #FFFFFF;
     }
     
-    // 新增样式
     .vip-container {
     	width: 750rpx;
-    	height: 350rpx;
+    	height: 300rpx;
+        margin-top: $margin;
+    }
+    
+    .swiper-item {
+    	width: 630rpx;
+    	height: 280rpx;
+    	display: flex;
+    }
+    
     .vip-item {
-            background-color: #c8c8c8;
+    	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;
+            }
 		}
 	}
 	// 会员权限