2023-12-26 争霸赛礼品兑换，修改聊天跳转的域名

apis/zbs.js

@@ -1,5 +1,7 @@
 import request from '@/common/util/request'
 
+// 争霸赛报名
+
 export const _API_HuiFuCheck = data => request.get('/HuiFu/check', data) // 获取绑卡情况
 
 export const _API_QuickBankApply = data => request.post('/HuiFu/QuickBankApply', data) // 绑卡时发送验证码
@@ -14,4 +16,15 @@ export const _API_CheckStatus = data => request.post('/HuiFu/CheckStatus', data)
 
 export const _API_UnbindBank = data => request.post('/HuiFu/UnbindBank', data) // 解绑银行
 
-export const _API_BankInfo = data => request.post('/HuiFu/BankInfo', data) // 获取银行信息
+export const _API_BankInfo = data => request.post('/HuiFu/BankInfo', data) // 获取银行信息
+
+
+// 礼品兑换
+
+export const GetInte = data => request.post('/gift/GetInte', data) // 获取学分
+export const api_getExchangeList = data => request.post('/gift/gift_list', data) //获取礼品列表
+export const api_submitExchange = data => request.post('/gift/exchange', data) //提交兑换
+export const api_record = data => request.post('/gift/record_detail', data) //个人兑换列表
+export const notGiftOrder = data => request.post('/gift/destory_order', data) //作废
+export const api_getAddress = data => request.post('/gift/address', data) //获取地址
+export const api_UpdateAddAddress = data => request.post('/gift/UpdateAddAddress', data) //添加、修改地址

pages.json

@@ -455,6 +455,40 @@
 				"enablePullDownRefresh": false
 			}
 		
+		},
+		// 争霸赛礼品兑换
+		{
+			"path": "pages/zbs-exchange/exchange",
+			"style": {
+				"navigationBarTitleText": "礼品兑换",
+				"enablePullDownRefresh": true
+			}
+		},
+		{
+			"path": "pages/zbs-detail/detail",
+			"style": {
+				"navigationBarTitleText": "礼品详情"
+			}
+		},
+		{
+			"path": "pages/zbs-detail/success",
+			"style": {
+				"navigationBarTitleText": "兑换成功"
+			}
+		
+		},
+		{
+			"path": "pages/zbs-exchangerecord/exchangerecord",
+			"style": {
+				"navigationBarTitleText": "兑换记录"
+			}
+		},
+		{
+			"path": "pages/zbs-addAddress/addAddress",
+			"style": {
+				"navigationBarTitleText": "地址填写"
+			}
+		
 		}
 	],
 	"tabBar": {

pages/dwbsChat/dwbsChat.vue

@@ -26,7 +26,7 @@
 			if (option == 'dwbsChat') { // 从登录页进入
 				_API_GetUserStatus().then(res => {
 					if (res.code === 200) {
-						if (res.data.level == 1) {
+						if (res.data.user_type == 1) {
 							const that = this
 							uni.showModal({
 								content: '抱歉，您没有权限进入系统',
@@ -40,7 +40,8 @@
 							})
 							return
 						}
-						window.location.href = `http://192.168.2.118:8088?phone=${res.data.mobile}&&openid=${res.data.openid}&&nickname=${res.data.nickname}&&tx=${res.data.headimgurl}`
+						window.location.href = `http://s-chat.cliu.cc?phone=${res.data.mobile}`
+						// window.location.href = `http://s-chat.cliu.cc?phone=${res.data.mobile}&&openid=${res.data.openid}&&nickname=${res.data.nickname}&&tx=${res.data.headimgurl}`
 					} else {
 						uni.showModal({
 							content: '获取信息失败',
@@ -57,7 +58,7 @@
 				})
 			}
 			if (token && userinfo) {
-				window.location.href = `http://192.168.2.118:8088?phone=${userinfo.mobile}&&openid=${userinfo.openid}&&nickname=${userinfo.nickname}&&tx=${userinfo.headimgurl}`
+				window.location.href = `http://s-chat.cliu.cc?phone=${userinfo.mobile}`
 			} else {
 				this.toWxchatLogin(`/pages/login-reg/login-reg?type=dwbsChat`, null)
 			}

pages/index-my/index-my.vue

@@ -99,6 +99,13 @@
 			icon: '8.png',
 			url: 'payment/payment'
 		},
+		// {
+		// 	name: '礼品兑换',
+		// 	icon: '3.png',
+		// 	url: 'zbs-exchange/exchange',
+		// 	width: 39,
+		// 	height: 37
+		// },
 		{
 			name: '安全管理',
 			remark: '退出、修改手机号',

pages/zbs-addAddress/addAddress.vue

@@ -0,0 +1,303 @@
+<template>
+	<view class="address">
+		<custom-toast ref='toast'></custom-toast>
+		<view>
+			<view class="form">
+				<view class="form_item">
+					<view class="label">
+						<text>收货人</text>
+						<text class="star">*</text>
+					</view>
+					<input v-model="adsInfo.username" type="text" placeholder="请填写真实姓名" />
+				</view>
+				<view class="form_item">
+					<view class="label">
+						<text>手机号</text>
+						<text class="star">*</text>
+					</view>
+					<input type="text" placeholder="请填写手机号" v-model="adsInfo.mobile" maxlength="11">
+				</view>
+				<view class="form_item">
+					<view class="label">
+						<text>省市县区</text>
+						<text class="star">*</text>
+					</view>
+					<view class="picker_box">
+						<picker mode="region" @change="RegionChange" :value="region">
+							<view class="picker">
+								<text :style="{ color: adsInfo && adsInfo.area ? '#333' : '#999' }">{{region.length==0?'请点击选择地址':region[0]+'-'+region[1]+'-'+region[2]}}</text>
+								<text class="cuIcon-right"></text>
+							</view>
+						</picker>
+					</view>
+
+				</view>
+				<view class="form_item">
+					<view class="label">
+						<text>详细地址</text>
+						<text class="star">*</text>
+					</view>
+					<input type="text" placeholder="请填写详细地址" v-model="adsInfo.address">
+				</view>
+			</view>
+			<view class="sub_btn" @click="saveAds">保存地址</view>
+		</view>
+		<!-- <view class="ads_box" v-else>
+			<view class="box_item" v-if="adsInfo.username">
+				<view>
+					<text class="user_name">{{adsInfo.username}}</text>
+					<text class="user_phone">{{adsInfo.mobile}}</text>
+				</view>
+				<view class="user_ads" v-if="adsInfo.province">
+					{{adsInfo.province}}{{adsInfo.city}}{{adsInfo.area}}{{adsInfo.address}}
+				</view>
+				<view class="opera_box">
+					<view @click="isAdd=true">编辑</view>
+				</view>
+			</view>
+		</view> -->
+	</view>
+</template>
+
+<script>
+	import {
+		api_getAddress,
+		api_UpdateAddAddress
+	} from '../../apis/zbs.js' //添加地址接口
+	export default {
+		data() {
+			return {
+				region: [],
+				adsInfo: {
+					username: '',
+					mobile: '',
+					province: '',
+					city: '',
+					area: '',
+					address: ''
+				},
+				isAdd: false,
+				isPoint: true, //防连点
+			};
+		},
+		computed: {
+			userServerInfo() {
+				//用户服务器信息
+				return this.$store.state.userServerInfo;
+			}
+		},
+		onShow() {
+			//获取地址
+			api_getAddress({ user_id: this.userServerInfo.id }).then(res => {
+				if (res.code === 200) {
+					if (res.data && res.data != 'null') {
+						const {
+							province,
+							city,
+							area
+						} = res.data
+						this.adsInfo = res.data
+						console.log(this.adsInfo,'info')
+						this.region = [province, city, area]
+					}
+				} else {
+					this.$refs.toast.hover(res.msg || '获取地址失败')
+				}
+			})
+		},
+		methods: {
+			//选择地址
+			RegionChange(e) {
+				this.region = e.detail.value
+			},
+			//保存地址
+			saveAds() {
+				let _this = this;
+				console.log('提交')
+				if (!this.isPoint) {
+					uni.showModal({
+						content: '请稍后重试~',
+						showCancel: false
+					});
+					return
+				}
+				const {
+					username,
+					mobile,
+					address
+				} = _this.adsInfo
+				if (!username.match(/^[\u4E00-\u9FA5\uf900-\ufa2d·s]{2,20}$/)) {
+					this.$refs.toast.hover('真实姓名不符合要求')
+					return
+				}
+				if (!mobile || mobile.length != 11) {
+					this.$refs.toast.hover('手机号格式不正确')
+					return
+				}
+				if (this.region.length === 0) {
+					this.$refs.toast.hover('请选择地址')
+					return
+				}
+				if (!address) {
+					this.$refs.toast.hover('详细地址不能为空')
+					return
+				}
+				this.isPoint = false;
+				this.adsInfo.province = this.region[0]
+				this.adsInfo.city = this.region[1]
+				this.adsInfo.area = this.region[2]
+				this.adsInfo.user_id = this.userServerInfo.id
+				api_UpdateAddAddress(this.adsInfo).then(res => {
+					if (+res.code === 200) {
+							this.$refs.toast.hover('保存成功')
+							this.isAdd = false
+							this.pageTitle = '地址管理'
+						} else {
+							this.$refs.toast.hover(res.msg || '保存失败')
+						}
+					}).catch(err => {
+						this.isPoint = true;
+						uni.hideLoading();
+					})
+					.finally(() => {
+						uni.hideLoading();
+						setTimeout(() => {
+							this.isPoint = true;
+						}, 2000);
+					});
+			},
+
+		},
+	}
+</script>
+<style lang="scss" scoped>
+	page {
+		background-color: #fff;
+	}
+	.address {
+		// @include page();
+		width: 100%;
+		height: 100%;
+		.form {
+			width: 100%;
+			margin-top: 30rpx;
+
+
+			.form_item {
+				width: 690rpx;
+				margin: 0 auto;
+
+				.star {
+					color: #f00;
+					margin-left: 10rpx;
+				}
+
+				.label {
+					font-size: 36rpx;
+					font-weight: bold;
+					margin-top: 24rpx;
+				}
+
+				input {
+					width: 100%;
+					height: 88rpx;
+					font-size: 34rpx;
+					border-bottom: 2rpx solid #E9E9E9;
+					color: #333;
+				}
+
+				.picker_box {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					border-bottom: 2rpx solid #E9E9E9;
+					min-height: 88rpx;
+
+					picker {
+						width: 100%;
+						.cuIcon-right {
+							font-size: 45rpx;
+							color: #999;
+						}
+						.picker {
+							width:100%;
+							display: flex;
+							justify-content: space-between;
+							align-items: center;
+							font-size: 34rpx;
+						}
+					}
+
+					
+
+					
+
+				}
+			}
+		}
+
+		.sub_btn {
+			width: 570rpx;
+			height: 88rpx;
+			margin: 60rpx auto;
+			background: linear-gradient(93deg, #F97C55 0%, #F44545 100%);
+			opacity: 1;
+			border-radius: 44rpx;
+			color: #fff;
+			font-size: 32rpx;
+			text-align: center;
+			line-height: 88rpx;
+		}
+
+		.ads_box {
+			margin-top: 30rpx;
+
+			.box_item {
+				padding: 24rpx;
+				box-sizing: border-box;
+				background: #fff;
+				width: 702rpx;
+				background: #FFFFFF;
+				border-radius: 16rpx;
+				margin: 24rpx auto 0;
+
+				.user_name {
+					font-size: 34rpx;
+					font-weight: bold;
+					margin-right: 10rpx;
+				}
+
+				.user_phone {
+					font-size: 32rpx;
+					color: #999;
+				}
+
+				.user_ads {
+					margin: 24rpx 0;
+					font-size: 32rpx;
+					color: #333;
+				}
+
+				.opera_box {
+					width: 100%;
+					display: flex;
+					justify-content: flex-end;
+					align-items: center;
+
+					view {
+						width: 120rpx;
+						height: 60rpx;
+						background: #F8F8F8;
+						border-radius: 30rpx;
+						opacity: 1;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+					}
+				}
+
+
+			}
+		}
+	}
+</style>

pages/zbs-detail/components/count2.vue

@@ -0,0 +1,89 @@
+<template>
+	<view class="countContainer">
+		<view class="reduceBtn" @click="toReduce" />
+		<input
+			v-model="countNum"
+			class="countNum"
+			:class="Number(countNum) > 0 ? 'active' : ''"
+		/>
+		<view class="plusBtn" @click="toPlus" />
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			countNum: {
+				type: Number,
+				default: 0
+			}
+		},
+		methods: {
+			toReduce() {
+				let _v = this.countNum
+				if(_v === 0) return false
+				this.$emit('update:countNum', --_v)
+			},
+			toPlus() {
+				let _v = this.countNum
+				if(_v > 999) return false
+				this.$emit('update:countNum', ++_v)
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.countContainer {
+		flex: 1;
+		overflow: hidden;
+		height: 64rpx;
+		border: 1px solid #F76454;
+		box-sizing: border-box;
+		border-radius: 16rpx;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		background-color: #FFF4F3;
+		.reduceBtn, .plusBtn {
+			width: 60rpx;
+			height: 100%;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			position: relative;
+			&::before {
+				content: "";
+				display: block;
+				width: 18rpx;
+				height: 2rpx;
+				background-color: #F76454;
+			}
+			&.plusBtn {
+				&::after {
+					content: "";
+					display: block;
+					position: absolute;
+					width: 2rpx;
+					height: 18rpx;
+					background-color: #F76454;
+					top: 50%;
+					left: 50%;
+					transform: translate(-50%, -50%);
+				}
+			}
+		}
+		.countNum {
+			flex: 1;
+			overflow: hidden;
+			border-left: 1px solid #F76454;
+			border-right: 1px solid #F76454;
+			text-align: center;
+			line-height: 72rpx;
+			height: 100%;
+			&.active {
+				color: #F76454;
+			}
+		}
+	}
+</style>

pages/zbs-detail/detail.vue

@@ -0,0 +1,310 @@
+<template>
+	<view class="giftDetail">
+		<view class="bannerContainer">
+			<swiper class="banner">
+				<swiper-item v-if="item"><view v-if="item.img" class="img" :style="{ backgroundImage: `url(${item.img})` }" /></swiper-item>
+			</swiper>
+			<view class="num">
+				<text class="spec">1</text>
+				<text>/</text>
+				<text>1</text>
+			</view>
+		</view>
+		<view class="good">
+			<view class="top">
+				<view class="title" v-if="item">{{ item.name }}</view>
+				<view class="surplus" v-if="item">限量
+					<text>{{ item.total }}份</text>
+				</view>
+			</view>
+			<view class="bottom">
+				<view class="num">
+					<text class="spec">{{ totalPrice }}</text>
+				</view>
+				<view class="countNum"><custom-counter :count-num.sync="num"></custom-counter></view>
+			</view>
+		</view>
+		<view class="bottomBtn">
+			<view class="submitBtn" :class="item.surplus === 0 ? 'disable' : ''" @click="submit">{{ item.surplus ? '立即兑换' : '已兑完' }}</view>
+		</view>
+		<toast-confirm :show.sync="toastInfo.show" :title="toastInfo.title" :content="toastInfo.content" @confirm="exchangeConfirm" />
+	</view>
+</template>
+
+<script>
+import { api_submitExchange, GetInte } from '../../apis/zbs.js';
+import customCounter from './components/count2';
+export default {
+	components: {
+		customCounter
+	},
+	data() {
+		return {
+			pageTitle: '礼品详情',
+			item: {},
+			num: 1,
+			requesting: false,
+			integral: '',
+			toastInfo: {
+				show: false,
+				title: '',
+				content: ''
+			}
+		};
+	},
+	computed: {
+		totalPrice() {
+			if (this.item) {
+				return this.item.price * this.num;
+			}
+		},
+		userServerInfo() {
+			//用户服务器信息
+			return this.$store.state.userServerInfo;
+		}
+	},
+	onShow() {
+		this.getBound()
+	},
+	methods: {
+		getBound(){
+			GetInte({ user_id: this.userServerInfo.id }).then(res => {
+				//获取兑换礼品列表
+				this.integral = res.data.integral
+			})
+		},
+		closeToast() {
+			this.toastInfo.title = '';
+			this.toastInfo.content = '';
+			this.toastInfo.show = false;
+		},
+		exchangeConfirm(flag) {
+			const _this = this;
+			if (flag) {
+				if (!this.requesting) {
+					this.requesting = true;
+					this.closeToast();
+					uni.showLoading();
+					api_submitExchange({ gift_id: this.item.id, num: this.num, user_id: this.userServerInfo.id, address_id: 123 }).then(res => {
+							uni.hideLoading();
+							this.requesting = false;
+							if (res.code == 200) {
+								uni.navigateTo({
+									url:'./success?totalPrice='+this.totalPrice
+								})
+							} else {
+								uni.hideLoading();
+								this.requesting = false;
+								uni.showModal({
+									content: res.msg || '兑换失败：库存不足',
+									showCancel: false
+								});
+							}
+					})
+				}
+			} else {
+				this.closeToast();
+			}
+		},
+		submit() {
+			if (!this.item.surplus) {
+				uni.showModal({
+						content: '商品已兑换完',
+						showCancel: false
+					});
+					return false;
+				}
+				if (this.num) {
+					if (this.integral >= this.totalPrice) {
+						this.toastInfo.title = '温馨提醒';
+						this.toastInfo.content = `您确定兑换${this.num}件商品吗？`;
+						this.toastInfo.show = true;
+					}
+					 else {
+						uni.showModal({
+							content: '奖金余额不足',
+							showCancel: false
+						});
+					}
+				} else {
+					uni.showModal({
+						content: '数量不能为空',
+						showCancel: false
+					});
+				}
+		}
+	},
+	created() {
+		//加载完成后开启监听全局 MESSAGE 事件
+		this.item = getApp().globalData.detail; //从兑换列表页面进入当前页面后从 getApp().globalData.detail 取值
+	}
+};
+</script>
+
+<style>
+	page {
+		background-color: #F9F9FB;
+	}
+</style>
+<style lang="scss" scoped>
+page {
+	display: flex;
+	flex-direction: column;
+	.giftDetail {
+		flex: 1;
+		overflow: hidden;
+		.bannerContainer {
+			width: 100%;
+			height: 628rpx;
+			position: relative;
+			.banner {
+				height: 100%;
+				width: 100%;
+				.img {
+					width: 100%;
+					height: 100%;
+					background-position: center;
+					background-repeat: no-repeat;
+					background-size: 100%;
+				}
+			}
+			.num {
+				position: absolute;
+				width: 112rpx;
+				height: 48rpx;
+				border-radius: 48rpx;
+				line-height: 48rpx;
+				color: #ffffff;
+				font-size: 24rpx;
+				bottom: 54rpx;
+				right: 44rpx;
+				background-color: rgba(0, 0, 0, 0.24);
+				text-align: center;
+				.spec {
+					font-size: 28rpx !important;
+				}
+			}
+		}
+		.good {
+			width: 100%;
+			height: 264rpx;
+			background: linear-gradient(94deg, #f97c55 0%, #f44545 100%);
+			margin-bottom: 30rpx;
+			padding: 10rpx;
+			box-sizing: border-box;
+			position: relative;
+			&::after {
+				content: '';
+				display: block;
+				position: absolute;
+				top: 10rpx;
+				right: 10rpx;
+				width: 174rpx;
+				height: 218rpx;
+				background-position: top;
+				background-size: 100%;
+				background-repeat: no-repeat;
+				background-image: url(../../static/gift/5.png);
+			}
+			.top {
+				margin-bottom: 20rpx;
+				width: 100%;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				height: 72rpx;
+				padding: 0 20rpx;
+				.title {
+					color: #ffffff;
+					font-size: 40rpx;
+					line-height: 56rpx;
+				}
+				.surplus {
+					color: #ffffff;
+					font-size: 28rpx;
+					align-self: flex-end;
+				}
+			}
+			.bottom {
+				width: 100%;
+				height: 120rpx;
+				border-radius: 8rpx;
+				background-color: #ffffff;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				padding: 0 20rpx;
+				box-sizing: border-box;
+				position: relative;
+				z-index: 3;
+				overflow: hidden;
+				.num {
+					color: #ea4a41;
+					font-size: 24rpx;
+					.spec {
+						font-size: 40rpx;
+					}
+				}
+				.countNum {
+					width: 180rpx;
+				}
+				&::before {
+					content: '';
+					display: block;
+					width: 114rpx;
+					height: 144rpx;
+					position: absolute;
+					top: 50%;
+					left: 16rpx;
+					transform: translateY(-50%);
+					background-image: url(../../static/gift/5.png);
+					background-position: center;
+					background-size: 100%;
+					background-repeat: no-repeat;
+				}
+			}
+		}
+		.desc {
+			width: 100%;
+			padding: 30rpx;
+			box-sizing: border-box;
+			margin-bottom: 100rpx;
+			.fixed {
+				color: #333333;
+				font-size: 32rpx;
+				font-weight: bold;
+				margin-bottom: 20rpx;
+			}
+			.content {
+				color: #333333;
+				font-size: 28rpx;
+				line-height: 48rpx;
+			}
+		}
+		.bottomBtn {
+			@include flex();
+			left: 0;
+			right: 0;
+			bottom: 0;
+			z-index: 1;
+			height: 98rpx;
+			position: fixed;
+			background: #FFFFFF;
+			.submitBtn {
+				width: 690rpx;
+				height: 88rpx;
+				line-height: 88rpx;
+				text-align: center;
+				background: linear-gradient(93deg, #f97c55 0%, #f44545 100%);
+				color: #ffffff;
+				font-size: 32rpx;
+				border-radius: 88rpx;
+				&.disable {
+					background: #999999 !important;
+					color: #f8f8f8 !important;
+				}
+			}
+		}
+	}
+}
+</style>

pages/zbs-detail/success.vue

@@ -0,0 +1,101 @@
+<template>
+	<view class="">
+		<view class="content">
+			<view class="content-top">恭喜您！兑换成功！</view>
+			<image src="../../static/gift/success.png" mode="widthFix" style="width: 310rpx;212rpx"></image>
+			<text style="font-size: 28rpx;color: #999;margin-top: 54rpx">感觉你对大卫博士的支持，欢迎你继续兑换</text>
+			<view class="content-middle">
+				消耗金额:<text style="color: #EA4A41;margin-left: 20rpx;">{{totalPrice}}</text>
+			</view>
+			<view class="content-bottom">
+				<view class="goon" @click="goon">
+					继续兑换
+				</view>
+				<view class="check"  @click="check">
+					查看兑换记录
+				</view>
+			</view>
+		</view>
+	</view>
+	
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				totalPrice: ''
+			}
+		},
+		computed: {
+			userServerInfo() {
+				//用户服务器信息
+				return this.$store.state.userServerInfo;
+			},
+		},
+		onLoad: function (option) { //option为object类型，会序列化上个页面传递的参数
+			this.totalPrice = option.totalPrice
+		},
+		methods: {
+			//继续兑换
+			goon(){
+				uni.reLaunch({
+				    url: '../zbs-exchange/exchange'
+				})
+			},
+			//兑换记录
+			check(){
+				uni.navigateTo({ url: '../zbs-exchangerecord/exchangerecord' })
+			}
+		}
+	}
+</script>
+<style lang="scss">
+	// page{
+	// 	background-color: #fff;
+	// }
+	.content {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		&-top{
+			margin-top: 150rpx;
+			color: #333;
+			font-weight: bold;
+			font-size: 36rpx;
+		}
+		image{
+			margin-top: 30rpx;
+		}
+		&-middle{
+			margin-top: 54rpx;
+			font-size: 36rpx;
+			color: #333;
+			font-weight: bold;
+		}
+		&-bottom{
+			display: flex;
+			margin-top: 72rpx;
+			.goon{
+				width: 300rpx;
+				line-height: 88rpx;
+				color: #FB231F;
+				border-radius: 44rpx;
+				border: 2rpx #FB231F solid;
+				background-color: #FFF4F3;
+				text-align: center;
+			}
+			.check{
+				width: 300rpx;
+				color: #fff;
+				line-height: 88rpx;
+				margin-left: 40rpx;
+				border-radius: 44rpx;
+				background: linear-gradient(93deg, #F97C55 0%, #F44545 100%);
+				text-align: center;
+			}
+		}
+	}
+
+</style>

pages/zbs-exchange/exchange.vue

@@ -0,0 +1,627 @@
+<template>
+	<view>
+		<view class="giftContainer">
+			<view class="banner">
+				<view class="num">
+					<text class="spec" v-if="userServerInfo">{{ integral }}</text>
+				</view>
+				<view class="flex">
+					<view class="mingxi" @click="goAddress">
+						收货地址
+					</view>
+				</view>
+			</view>
+			<view class="fixedHeader">
+				<view />
+				<view v-if="userServerInfo">
+					<view class="title" @tap="exchangerecord">
+						<text>兑换记录</text>
+					</view>
+				</view>
+			</view>
+			<view class="list" v-if="list.length > 0">
+				<view v-for="item in list" :key="item.id" class="item" @click="exchange(item)">
+					<view class="avatar" :style="{ backgroundImage: `url(${item.img})` }" @click.stop="priview(item.img)">
+						<view v-if="!Number(item.surplus)" class="none"><text>已兑完</text></view>
+					</view>
+					<view class="info">
+						<view class="title">{{ item.name }}</view>
+						<view class="info-num">
+							<view class="info-other">限量{{ item.total }}份</view>
+							<view class="info-status" v-if="item.exchanged">已兑换</view>
+						</view>
+						<view class="bottom">
+							<view class="money">
+								<text class="spec">{{ item.price }}</text>
+							</view>
+							<view class="btn" :class="Number(item.surplus) ? '' : 'disabled'">立即兑换</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+
+</template>
+<script>
+	import {
+		api_getExchangeList,
+		GetInte
+	} from '../../apis/zbs.js';
+	export default {
+		data() {
+			return {
+				list: [],
+				integral: ''
+			};
+		},
+		computed: {
+			userServerInfo() {
+				//用户服务器信息
+				return this.$store.state.userServerInfo;
+			}
+		},
+		onShow() {
+				// const data = uni.getStorageSync('userServerInfo')
+				// this.$store.commit('GETUSERSERVERINFO', data)
+				this.getGiftList()
+				this.getBound()
+			
+		},
+		onPullDownRefresh() {
+			this.getGiftList()
+			this.getBound()
+			setTimeout(function() {
+				uni.stopPullDownRefresh()
+			}, 1500);
+		},
+		methods: {
+			goAddress() {
+				uni.navigateTo({
+					url: "../zbs-addAddress/addAddress"
+				})
+			},
+			getGiftList() {
+				// uni.showLoading();
+				api_getExchangeList().then(res => {
+					if (res.code == 200) {
+						//获取兑换礼品列表
+						this.list = res.data.list;
+						console.log(res.data.list)
+						// uni.hideLoading();
+					} else {
+						uni.showToast({
+							title: res.message || '获取失败',
+							duration: 2000,
+							icon: 'none'
+						})
+					}
+				});
+			},
+			getBound() {
+				GetInte({ user_id: this.userServerInfo.id }).then(res => {
+					//获取jiang xue jin
+					this.integral = res.data.integral
+					console.log(res.data.integral)
+				});
+			},
+			exchangerecord() {
+				//进入兑换记录页面 
+				uni.navigateTo({
+					url: '../zbs-exchangerecord/exchangerecord'
+				})
+			},
+			priview(src) {
+				// 预览
+				uni.previewImage({
+					urls: [src]
+				});
+			},
+			exchange(data) {
+				if (data.surplus) {
+					//如果有货
+					getApp().globalData.detail = data; //把兑换列表保存到 globalData 中
+					uni.navigateTo({
+						url: '../zbs-detail/detail' //去商品详情页面时
+					});
+				} else {
+					uni.showModal({
+						content: '来晚了！礼品已兑换完毕！再看看别的吧！',
+						showCancel: false
+					});
+				}
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.flexCC {
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+	}
+
+	.share_show {
+		width: 100%;
+		height: 100vh;
+		position: fixed;
+		top: 0;
+		left: 0;
+		background-color: rgba(0, 0, 0, 0.7);
+		z-index: 9999;
+
+		.share_con {
+			width: 80%;
+			margin: 0 auto;
+			height: 100%;
+			z-index: 999999;
+
+			.canvas {
+				width: 540rpx;
+				height: 960rpx;
+				position: relative;
+
+				#canvas {
+					width: 540rpx;
+					height: 960rpx;
+					position: absolute;
+					top: 0;
+					left: 0;
+				}
+
+				.poster_img {
+					-webkit-touch-callout: default;
+					width: 540rpx;
+					height: 960rpx;
+					display: block;
+				}
+
+				img[src=''],
+				img:not([src]) {
+					opacity: 0;
+				}
+			}
+
+			.save_img {
+				color: #fff;
+				width: 100%;
+				text-align: center;
+				font-size: 40rpx;
+				margin-top: 20rpx;
+			}
+
+			.iconfont {
+				position: absolute;
+				top: 4vh;
+				right: 25rpx;
+				color: #dedede;
+				font-size: 60rpx;
+				z-index: 999;
+			}
+		}
+
+		.sub_btn {
+			margin-top: 76rpx;
+		}
+	}
+
+	page {
+		height: auto;
+		display: flex;
+		flex-direction: column;
+
+		// .status_bar {
+		// 	width: 100vw;
+		// 	position: relative;
+		// 	z-index: 10;
+		// 	margin: 0;
+
+		// 	.nav_box {
+		// 		width: 100%;
+		// 		padding: 0 20px;
+		// 		font-size: 40rpx;
+
+		// 		.back {
+		// 			margin-right: 8rpx;
+		// 		}
+		// 	}
+
+
+			// position: fixed;
+			// top: 0;
+			// padding-top: 40rpx;
+			// left: 25rpx;
+			// height: 128rpx;
+			// z-index: 1000;
+			// line-height: 88rpx;
+			// background-color: #fff;
+			// width: 100%;
+			// display: flex;
+			// justify-content: space-between;
+			// align-items: center;
+		// }
+
+		.giftContainer {
+			flex: 1;
+			overflow: hidden;
+			padding: 30rpx;
+			box-sizing: border-box;
+			// margin-top: 110rpx;
+
+			.message {
+				width: 100%;
+				display: flex;
+				align-items: center;
+				padding: 0 42rpx 0 14rpx;
+				box-sizing: border-box;
+				background-color: #fff4f3;
+				height: 62rpx;
+				border-radius: 62rpx;
+				margin-bottom: 30rpx;
+
+				.icon {
+					width: 128rpx;
+					height: 46rpx;
+					background: linear-gradient(88deg, #ffc401 0%, #fe2400 41%, #fe0000 100%);
+					border-radius: 45rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					color: #ffffff;
+					font-size: 28rpx;
+					margin-right: 14rpx;
+
+					&::before {
+						content: '';
+						display: block;
+						width: 28rpx;
+						height: 28rpx;
+						background: url(../../static/gift/1.png) 100% center no-repeat;
+						background-size: 100%;
+						margin-right: 6rpx;
+					}
+				}
+
+				.text {
+					flex: 1;
+					height: 40rpx;
+					overflow: hidden;
+
+					.scroll {
+						height: 40rpx;
+						line-height: 40rpx;
+						white-space: nowrap;
+						color: #ea4a41;
+						font-weight: 28rpx;
+						animation: scroll-left-right 12s linear infinite;
+					}
+				}
+			}
+
+			.banner {
+				width: 100%;
+				height: 240rpx;
+				background: linear-gradient(270deg, #f97c55 0%, #f44545 100%);
+				border-top-left-radius: 24rpx;
+				border-top-right-radius: 24rpx;
+				position: relative;
+				padding: 60rpx 40rpx;
+				box-sizing: border-box;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				margin-bottom: 30rpx;
+
+				.num {
+					color: #ffffff;
+					font-size: 32rpx;
+					line-height: 44rpx;
+
+					.spec {
+						font-size: 76rpx;
+						margin-right: 10rpx;
+					}
+
+					margin-bottom: 10rpx;
+				}
+
+				.mingxi {
+					width: 184rpx;
+					height: 64rpx;
+					background: linear-gradient(180deg, #FCEAC0 0%, #FFD57D 100%);
+					border-radius: 32rpx;
+					color: #FB231F;
+					font-size: 28rpx;
+					text-align: center;
+					line-height: 64rpx;
+				}
+
+				&::after {
+					content: '';
+					display: block;
+					width: calc(100% + 30rpx);
+					height: 28rpx;
+					background: linear-gradient(180deg, rgba(234, 74, 65, 0) 0%, rgba(234, 74, 65, 0.35) 100%);
+					border-radius: 28rpx;
+					position: absolute;
+					left: -15rpx;
+					right: -15rpx;
+					bottom: -14rpx;
+				}
+
+				&::before {
+					content: '';
+					display: block;
+					width: 170rpx;
+					height: 170rpx;
+					background-image: url('https://api.jiuweiyun.cn/public/uploads/weapp/icon/2.png');
+					background-position: center;
+					background-size: 100%;
+					background-repeat: no-repeat;
+					position: absolute;
+					top: 50%;
+					right: 30rpx;
+					transform: translateY(-50%);
+				}
+			}
+
+			.fixedHeader {
+				width: 100%;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				margin-bottom: 30rpx;
+
+				.num {
+					display: flex;
+					align-items: center;
+					color: #333333;
+					font-size: 32rpx;
+					line-height: 56rpx;
+
+					.spec {
+						color: #ea4a41;
+						font-size: 40rpx;
+					}
+
+					&::before {
+						content: '';
+						display: block;
+						width: 40rpx;
+						height: 40rpx;
+						background-image: url(../../static/gift/3.png);
+						background-size: 100%;
+						background-position: center;
+						background-repeat: no-repeat;
+						margin-right: 10rpx;
+					}
+				}
+
+				.title {
+					display: flex;
+					align-items: center;
+					color: #999999;
+					font-size: 32rpx;
+
+					&::before {
+						content: '';
+						display: block;
+						width: 34rpx;
+						height: 34rpx;
+						background-image: url(../../static/gift/4.png);
+						background-size: 100%;
+						background-position: center;
+						background-repeat: no-repeat;
+						margin-right: 10rpx;
+					}
+				}
+			}
+
+			.list {
+				width: 100%;
+
+				.item {
+					width: 100%;
+					display: flex;
+					align-items: stretch;
+					justify-content: space-between;
+					margin-bottom: 30rpx;
+
+					.avatar {
+						width: 260rpx;
+						height: 260rpx;
+						background-color: #f9f9fb;
+						position: relative;
+						border-radius: 16rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						margin-right: 20rpx;
+						background-position: center;
+						background-repeat: no-repeat;
+						background-size: 100%;
+						overflow: hidden;
+
+						.none {
+							position: absolute;
+							top: 0;
+							bottom: 0;
+							right: 0;
+							left: 0;
+							background: rgba(0, 0, 0, 0.5);
+							display: flex;
+							align-items: center;
+							justify-content: center;
+							color: #ffffff;
+							font-size: 32rpx;
+						}
+					}
+
+					.info {
+						flex: 1;
+						overflow: hidden;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-between;
+
+						.title {
+							color: #333333;
+							font-size: 32rpx;
+							line-height: 44rpx;
+							width: 100%;
+							height: 44rpx;
+							overflow: hidden;
+							font-weight: bold;
+							margin-bottom: 20rpx;
+						}
+
+						&-num {
+							display: flex;
+							align-items: center;
+							justify-content: space-between;
+							margin-bottom: 70rpx;
+
+							.info-other {
+								color: #ea4a41;
+								font-size: 28rpx;
+								height: 52rpx;
+								line-height: 52rpx;
+								padding: 0 10rpx;
+								border-radius: 8rpx;
+								background-color: #fff4f3;
+							}
+
+							.info-status {
+								color: #ffffff;
+								font-size: 28rpx;
+								height: 44rpx;
+								line-height: 44rpx;
+								padding: 0 14rpx;
+								background-color: #ffbb01;
+								border-top-left-radius: 16rpx;
+								border-bottom-right-radius: 16rpx;
+							}
+						}
+
+						.bottom {
+							display: flex;
+							align-items: center;
+							justify-content: space-between;
+
+							.money {
+								color: #ea4a41;
+								font-size: 24rpx;
+
+								.spec {
+									font-size: 40rpx !important;
+								}
+							}
+
+							.btn {
+								height: 68rpx;
+								border-radius: 68rpx;
+								background: linear-gradient(141deg, #f97c55 0%, #f44545 100%);
+								line-height: 68rpx;
+								width: 192rpx;
+								text-align: center;
+								color: #ffffff;
+								font-size: 28rpx;
+
+								&.disabled {
+									background: #f8f8f8 !important;
+									color: #999999;
+								}
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+
+	.exchange {
+		// @include page();
+
+		.content {
+			display: flex;
+			flex-direction: column;
+
+			.scroll {
+				height: 50rpx;
+				line-height: 50rpx;
+				background: rgba(250, 99, 66, 0.2);
+				display: flex;
+				align-items: center;
+				color: #fa6342;
+
+				text {
+					font-size: 40rpx;
+					color: #fa6342;
+					margin-left: 30rpx;
+				}
+
+				.scroll-wrapper {
+					flex: 1;
+					height: 100%;
+					overflow: hidden;
+
+					.scroller {
+						height: 100%;
+						white-space: nowrap;
+						font-size: 26rpx;
+						padding-left: 10rpx;
+						animation: scroll-left-right 12s linear infinite;
+					}
+				}
+			}
+
+			.banner {
+				width: 100%;
+				height: 216rpx;
+			}
+
+			.nav {
+				height: 76rpx;
+				box-sizing: border-box;
+				padding: 0 30rpx;
+				border-bottom: 6rpx solid #eeeeee;
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				font-size: 32rpx;
+
+				view {
+					height: 100%;
+					display: flex;
+					align-items: center;
+
+					.cuIcon {
+						font-size: 40rpx;
+						margin-right: 12rpx;
+					}
+				}
+			}
+
+			.list {
+				flex: 1;
+
+				scroll-view {
+					box-sizing: border-box;
+					padding: 0 30rpx 0;
+				}
+			}
+		}
+	}
+
+	@keyframes scroll-left-right {
+		0% {
+			transform: translateX(100%);
+		}
+
+		100% {
+			transform: translateX(-100%);
+		}
+	}
+</style>

pages/zbs-exchangerecord/exchangerecord.vue

@@ -0,0 +1,229 @@
+<template>
+	<scroll-view
+		:scroll-y="true"
+		class="recordContainer"
+	>
+		<template v-if="list.length > 0">
+			<view
+				v-for="item in list" 
+				:key="item.id"
+				class="recordItem"
+				:class="item.type ? 'voided' : ''"
+			>
+				<view class="header">
+					<view class="time">{{ item.timestamp | dateFormatter('yyyy-MM-dd hh:mm:ss') }}</view>
+					<view class="money">-{{ item.cost }}</view>
+				</view>
+				<view class="body">
+					<view
+						class="avatar"
+						:style="{ backgroundImage: `url(${item.gift_info.imgurl})` }"
+					/>
+					<view class="info">
+						<view class="name">{{ item.name }}</view>
+						<view class="num">X{{ item.num }}</view>
+					</view>
+					<view class="voidBtn" v-if="!item.type" @click="publishDestoryGiftOrder(item)">取消兑换</view>
+				</view>
+			</view>
+		</template>
+		<template v-else>
+			<view class="noTip">暂无兑换记录</view>
+		</template>
+	</scroll-view>
+</template>
+
+<script>
+	import { api_record, notGiftOrder } from '../../apis/zbs.js'
+	export default {
+		data() {
+			return {
+				list: []
+			};
+		},
+		computed: {
+			userServerInfo() {
+				//用户服务器信息
+				return this.$store.state.userServerInfo;
+			},
+		},
+		onShow() {
+			this.getRecordList()
+		},
+		methods: {
+			publishDestoryGiftOrder(data) {
+				const _this = this
+				uni.showModal({
+					content: "确认取消该兑换订单",
+					success(res) {
+						if(res.confirm) {
+							uni.showLoading()
+							notGiftOrder({ gift_id: this.data.id, user_id: this.userServerInfo.id }).then(res => {
+								uni.hideLoading()
+								if(res.code === 200) {
+									uni.showModal({
+										content: "兑换订单取消成功",
+										showCancel: false,
+										success(res) {
+											if(res.confirm) {
+												_this.getRecordList()
+												_this.$store.dispatch('onLaunch')
+											}
+										}
+									})
+								} else {
+									uni.showModal({
+										content: res.msg || '取消兑换订单失败',
+										showCancel: false
+									})
+								}
+							}).catch(() => {
+								uni.hideLoading()
+								uni.showModal({
+									content:"取消兑换订单失败",
+									showCancel: false
+								})
+							})
+						}
+					}
+				})
+			},
+			getRecordList() {
+				uni.showLoading()
+				api_record({ user_id: this.userServerInfo.id }).then(res => {
+					uni.hideLoading()
+					if(res.code === 200) {
+						this.list = res.data.list
+					} else {
+						uni.showModal({
+							content: "获取兑换记录失败",
+							showCancel:false
+						})
+					}
+				}).catch(() => {
+					uni.hideLoading()
+					uni.showModal({
+						content: "获取兑换记录失败",
+						showCancel:false
+					})
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page {
+		height: 100%;
+		display: flex;
+		flex-direction: column;
+		justify-content: space-between;
+		.recordContainer {
+			width: 100%;
+			height: 100%;
+			padding: 30rpx;
+			box-sizing: border-box;
+			background-color: #F9F9FB;
+			.recordItem {
+				width: 100%;
+				padding: 30rpx;
+				box-sizing: border-box;
+				margin-bottom: 30rpx;
+				border-radius: 24rpx;
+				background-color: #FFFFFF;
+				&.voided {
+					position: relative;
+					overflow: hidden;
+					&::after {
+						content: "";
+						display: block;
+						width: 168rpx;
+						height: 168rpx;
+						background-position: center;
+						background-repeat: no-repeat;
+						background-size: 100%;
+						// background-image: url(../../static/gift/cancel.png);
+						background-image: url('https://api.jiuweiyun.cn/public/uploads/weapp/icon/cancel.png');
+						filter: grayscale(100%);
+						position: absolute;
+						right: 56rpx;
+						bottom: -20rpx;
+					}
+				}
+				.header {
+					width: 100%;
+					display: flex;
+					align-items: center;
+					justify-content: space-between;
+					margin-bottom: 20rpx;
+					.time {
+						color: #999999;
+						font-size: 28rpx;
+						line-height: 40rpx;
+					}
+					.money {
+						color: #EA4A41;
+						font-size: 32rpx;
+						line-height: 44rpx;
+						font-weight: bold;
+					}
+				}
+				.body {
+					width: 100%;
+					display: flex;
+					align-items: stretch;
+					justify-content: space-between;
+					position: relative;
+					.avatar {
+						width: 128rpx;
+						height: 128rpx;
+						border-radius: 8rpx;
+						background-color: #FF7B39;
+						background-position: center;
+						background-repeat: no-repeat;
+						background-size: 100%;
+						margin-right: 20rpx;
+					}
+					.info {
+						flex: 1;
+						overflow: hidden;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-around;
+						.name {
+							color: #333333;
+							font-size: 32rpx;
+							line-height: 44rpx;
+							font-weight: bold;
+						}
+						.num {
+							color: #999999;
+							font-size: 28rpx;
+							line-height: 40rpx;
+						}
+					}
+					.voidBtn{
+						width: 192rpx;
+						height: 68rpx;
+						border-radius: 68rpx;
+						text-align: center;
+						background: linear-gradient(141deg, #F97C55 0%, #F44545 100%);
+						line-height: 68rpx;
+						color: #FFFFFF;
+						font-size: 28rpx;
+						position: absolute;
+						bottom: 0;
+						right: 0;
+					}
+				}
+			}
+			.noTip {
+				width: 100%;
+				text-align: center;
+				padding: 20rpx 0;
+				font-size: 28rpx;
+				color: #333333;
+			}
+		}
+	}
+</style>

store/modules/app.js

@@ -8,7 +8,7 @@ export default {
 		indextabbarHeight: uni.upx2px(98), // 首页 tabbar 高
 		token: uni.getStorageSync('token'),
 		// token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJodHRwOlwvXC9hcGkuYXBwLmNsaXUuY2NcL2FwaVwvbG9naW5cL2dldF91c2VyX29wZW5pZCIsImlhdCI6MTY5ODgxNTc0OSwiZXhwIjoxNjk5Njc5NzQ5LCJuYmYiOjE2OTg4MTU3NDksImp0aSI6InRMU25oSTdmMHVOZEZFamgiLCJzdWIiOjM5NTE2LCJwcnYiOiIyM2JkNWM4OTQ5ZjYwMGFkYjM5ZTcwMWM0MDA4NzJkYjdhNTk3NmY3In0.9W32gsVAoq1N1P1W38SCc-H8lCqKLxUfhWwHaGWszoM',
-		token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJodHRwOlwvXC9hcGkuYXBwLmNsaXUuY2NcL2FwaVwvbG9naW5cL2dldF91c2VyX29wZW5pZCIsImlhdCI6MTcwMzMwMTQxNSwiZXhwIjoxNzA0MTY1NDE1LCJuYmYiOjE3MDMzMDE0MTUsImp0aSI6ImNWMXpFcVJReU9jSmxjM0QiLCJzdWIiOjc1NjYwLCJwcnYiOiIyM2JkNWM4OTQ5ZjYwMGFkYjM5ZTcwMWM0MDA4NzJkYjdhNTk3NmY3In0.UAr-E_J-wrHLxPmNGDstJ3qDh0I3BpIidlVLOwO12Wk',
+		// token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJodHRwOlwvXC9hcGkuYXBwLmNsaXUuY2NcL2FwaVwvbG9naW5cL2dldF91c2VyX29wZW5pZCIsImlhdCI6MTcwMzMwMTQxNSwiZXhwIjoxNzA0MTY1NDE1LCJuYmYiOjE3MDMzMDE0MTUsImp0aSI6ImNWMXpFcVJReU9jSmxjM0QiLCJzdWIiOjc1NjYwLCJwcnYiOiIyM2JkNWM4OTQ5ZjYwMGFkYjM5ZTcwMWM0MDA4NzJkYjdhNTk3NmY3In0.UAr-E_J-wrHLxPmNGDstJ3qDh0I3BpIidlVLOwO12Wk',
 	},
 	mutations: {
 		LOGIN(state, payload) { // 登录 保存 token