完善订单界面

components/module/f-navbar/f-navbar.vue

@@ -188,7 +188,6 @@ export default {
             }
         },
         scrollTop(val) {
-			console.log(val,909090)
         	this.pageScroll({
         		scrollTop: val
         	});

components/storeList/storeList.vue

@@ -71,7 +71,7 @@
 			onNavToHome(val){
 				uni.setStorageSync("storeId",val.id)
 				uni.switchTab({
-					url:`/pages/index/index`
+					url:`/pages/index/index?storeId=${val.id}`
 				})
 			},
 			onPreview(item) {

config/index.config.js

@@ -2,8 +2,8 @@ const CONFIG = {
     // 开发环境配置
     development: {
         assetsPath: '/static', // 静态资源路径
-		baseUrl: 'http://10.106.30.136:8883/front', // 后台接口请求地址
-		hostUrl: 'http://10.106.30.136:8882', // H5地址(前端运行地址)
+		baseUrl: 'http://10.106.30.135:8883/front', // 后台接口请求地址
+		hostUrl: 'http://10.106.30.135:8882', // H5地址(前端运行地址)
 		// baseUrl: 'http://192.168.43.242:8883/front', // 后台接口请求地址
 		// hostUrl: 'http://192.168.43.242:8882', // H5地址(前端运行地址)
         websocketUrl: '', // websocket服务端地址

pages/index/index.vue

 <template>
 	<view class="home" @touchstart="onTouchStart" @touchmove="onTouchMove" @touchend="onTouchEnd">
-		<f-navbar title="凑角" :isShowTransparentTitle="false" :isShowLeft="false" fontColor="#ffffff" bgColor="#e40583"
+		<f-navbar title="凑角" :isShowTransparentTitle="false" :isShowLeft="false" fontColor="#ffffff" :fontSize="46" bgColor="#e40583"
 			:scrollTop="scrollTop" navbarType='5'></f-navbar>
 		<scroll-view class="scroll-view" scroll-y="true" @scroll="onScroll">
 			<view class="content-box">
@@ -84,9 +84,9 @@
 							</view>
 							<view class="flex-1 flex-between">
 								<view class="flex-row room-type">
-									<text>房间套餐</text>
-									<view v-for="(item,i) in options" :key="i" class="item">
-										<text>{{item.label}}</text>
+									<text>优惠套餐：</text>
+									<view v-for="(item,i) in item.packList" :key="i" class="item">
+										<text>{{item.name}}</text>
 									</view>
 								</view>
 								<view class="confirm" @tap="onNavToOrder(item)">
@@ -123,6 +123,7 @@
 			return {
 				scrollTop: 0,
 				storeId: '',
+				storeList:[],
 				storeInfo: {},
 				statusBarHeight: this.statusBarHeight,
 				hostUrl: config.hostUrl,
@@ -170,14 +171,31 @@
 			}
 		},
 		onShow() {
-			if (uni.getStorageSync("storeId")) {
+			if (uni.getStorageSync("storeId") && this.storeList.length) {
 				this.storeId = uni.getStorageSync("storeId")
+				let obj = this.storeList.filter(item => item.id === this.storeId)[0]
+				console.log(obj,909090)
+				if (obj.roomVoList.length) {
+					this.storeInfo = {
+						...obj,
+						roomVoList: obj.roomVoList.map(item => {
+							return {
+								...item,
+								images: item.images ? item.images
+									.split(",").map(val => this.hostUrl + val) : []
+							}
+						})
+				
+					}
+					this.$forceUpdate();
+				}
+				console.log(this.storeInfo, 9999)
+			}else{
+				uni.showLoading({
+					title: "加载中"
+				})
+				this.onLoading()
 			}
-			uni.showLoading({
-				title: "加载中"
-			})
-
-			this.onLoading()
 		},
 		onReachBottom() {
 			if (this.status == 'loadmore') {
@@ -190,11 +208,10 @@
 		},
 		onLoad(option) {
 			console.log(option, 909090)
-
 		},
 		methods: {
 			onScroll(e){
-				console.log(e,90909090)
+				this.scrollTop = e.target.scrollTop;
 			},
 			onLoading() {
 				this.onGetListStore()
@@ -207,6 +224,7 @@
 				}).then(res => {
 					uni.hideLoading()
 					if (res.data.code == 200 && res.data.data.length) {
+						this.storeList = res.data.data;
 						let obj = {}
 						if (this.storeId) {
 							obj = res.data.data.filter(item => item.id === this.storeId)[0]
@@ -226,7 +244,6 @@
 
 							}
 						}
-						console.log(this.storeInfo, 9999)
 					}
 				})
 			},
@@ -300,13 +317,21 @@
 </style>
 <style lang="scss" scoped>
 	.home {
+		width: 100vw;
+		height: 100vh;
+		overflow-x: hidden;
+	}
+.scroll-view{
+	position: relative;
+	width: 100vw;
+	height: 100%;
+	.content-box{
 		display: flex;
 		flex-direction: column;
 		align-items: center;
-		width: 100vw;
-		overflow-x: hidden;
+		width: 100%;
 	}
-
+}
 	.header-content {
 		display: flex;
 		justify-content: center;
@@ -320,15 +345,6 @@
 			margin-top: -16upx;
 		}
 	}
-
-.scroll-view{
-	width: 100vw;
-	.content-box{
-		display: flex;
-		flex-direction: column;
-		width: 100%;
-	}
-}
 	.store-nav {
 		position: relative;
 		display: flex;
@@ -602,8 +618,8 @@
 							display: flex;
 							justify-content: center;
 							align-items: center;
-							width: 90rpx;
 							height: 44rpx;
+							padding: 0 8upx;
 							background: #FFFFFF;
 							border-radius: 11rpx 11rpx 11rpx 11rpx;
 							border: 2rpx solid #130F26;

pages/useCoupon/index.vue

 <template>
 	<view class="coupon-list-box">
-	
-		<view v-for="(item,index) in list" :key="index" class="coupon-item">
+
+		<view v-for="(item,index) in list" :key="index" class="coupon-item" :class="{active: current === index}"
+			@tap="onSelect(item,index)">
 			<view class="part-left">
-				<image :src="item.useStatus==1? '../../static/coupon_icon.png':'../../static/coupon_icon_gray.png'" mode="widthFix"></image>
+				<image :src="item.isAvailable === 0? '../../static/coupon_icon.png':'../../static/coupon_icon_gray.png'"
+					mode="widthFix"></image>
 			</view>
 			<view class="part-right">
 				<view class="coupon-name">
 					<text class="text-title text-lg text-bold">{{item.name}}</text>
-					<text class="text-lg" :class="item.useStatus==1?'text-pink':'text-gray'">{{item.useStatus==1?'待使用':'已使用'}}</text>
+					<text class="text-lg"
+						:class="item.isAvailable === 0?'text-pink':'text-gray'">{{item.useStatus==0?'可使用':'无法使用'}}</text>
 				</view>
 				<view class="flex-row margin-top">
 					<text class="">使用说明：</text>
@@ -29,196 +32,228 @@
 					<text class="text-gray">有效期限：</text>
 					<text class="text-gray">{{item.startDate}}至{{item.endDate}}</text>
 				</view>
+				<view v-if="item.isAvailable !== 0" class="coupon-name margin-top">
+					<text class="text-gray">不可用原因：</text>
+					<text class="text-gray">{{item.reason}}</text>
+				</view>
 			</view>
 		</view>
-		
-		<view v-if="list.length == 0" class="empty-box">
-			<!-- 列表数量为0时 -->
-			<u-empty text="暂无门店数据" textColor='#C1C1C1' width="60"
-				:icon="storeListBlankImage">
-			</u-empty>
-		</view>
-		<!-- 当数据没有更多时 -->
-		<view v-if="list.length" style="padding: 12px 6% 0;">
-			<u-loadmore :status="status" :icon="true" :line='true' :loading-text="loadingText"
-				:loadmore-text="loadmoreText" :nomore-text="nomoreText" />
+		<view class="box-content">
+			<button class="cu-btn round bg-gray " @tap="onCancle">返回</button>
+
+			<button class="cu-btn round bg-pink " @tap="onConfirm">选择</button>
 		</view>
-		
 	</view>
 </template>
 
 <script>
 	import indexConfig from "@/config/index.config";
 	import FixedHeader from "@/components/fixedHeader/index";
-    import {getCouponList} from "@/api/coupon"
-	
+	import {
+		getUseCoupon
+	} from "@/api/coupon"
+
 	export default {
 		data() {
 			return {
-				status: 'nomore ',
-				loadingText: '努力加载中',
-				loadmoreText: '上划加载',
-				nomoreText: '已展示全部门店',
 				scrollTop: 0,
-				current: '',
+				current: undefined,
 				hostUrl: indexConfig.hostUrl,
 				statusBarHeight: this.statusBarHeight,
 				titleBarHeight: this.titleBarHeight,
-				list: [
-					{
-						couponId:"111",
-						couponCode:"111",
-						name:"任意房型8小时通用券",
-						roomType:"标准",
-						couponTimeStart:"00:00",
-						couponTimeEnd:"08:00",
-						couponType:"满减券(2)",
-						maxDuration:8,
-						duration:8,
-						minPrice:200,
-						subPrice:62,
-						sourceType:"领取(1)",
-						platformType:1,
-						startDate:"2023-10-23",
-						endDate:"2023-11-23",
-						useStatus:1,
-						useDate:""
+				list: [{
+						couponId: "111",
+						couponCode: "111",
+						name: "任意房型8小时通用券",
+						roomType: "标准",
+						couponTimeStart: "00:00",
+						couponTimeEnd: "08:00",
+						couponType: "满减券(2)",
+						maxDuration: 8,
+						duration: 8,
+						minPrice: 200,
+						subPrice: 62,
+						sourceType: "领取(1)",
+						platformType: 1,
+						startDate: "2023-10-23",
+						endDate: "2023-11-23",
+						useStatus: 1,
+						useDate: ""
 					},
 					{
-						couponId:"2222",
-						couponCode:"2222",
-						name:"任意房型4小时通用券",
-						roomType:"标准",
-						couponTimeStart:"",
-						couponTimeEnd:"",
-						couponType:"满减券(2)",
-						maxDuration:4,
-						duration:4,
-						minPrice:100,
-						subPrice:22,
-						sourceType:"领取(1)",
-						platformType:2,
-						startDate:"2023-10-23",
-						endDate:"2023-11-23",
-						useStatus:1,
-						useDate:""
+						couponId: "2222",
+						couponCode: "2222",
+						name: "任意房型4小时通用券",
+						roomType: "标准",
+						couponTimeStart: "",
+						couponTimeEnd: "",
+						couponType: "满减券(2)",
+						maxDuration: 4,
+						duration: 4,
+						minPrice: 100,
+						subPrice: 22,
+						sourceType: "领取(1)",
+						platformType: 2,
+						startDate: "2023-10-23",
+						endDate: "2023-11-23",
+						useStatus: 1,
+						useDate: ""
 					},
 					{
-						couponId:"8888",
-						couponCode:"8888",
-						name:"任意房型8小时通用券",
-						roomType:"标准",
-						couponTimeStart:"",
-						couponTimeEnd:"",
-						couponType:"满减券(2)",
-						maxDuration:8,
-						duration:8,
-						minPrice:200,
-						subPrice:62,
-						sourceType:"领取(1)",
-						platformType:2,
-						startDate:"2023-10-23",
-						endDate:"2023-11-23",
-						useStatus:2,
-						useDate:""
+						couponId: "8888",
+						couponCode: "8888",
+						name: "任意房型8小时通用券",
+						roomType: "标准",
+						couponTimeStart: "",
+						couponTimeEnd: "",
+						couponType: "满减券(2)",
+						maxDuration: 8,
+						duration: 8,
+						minPrice: 200,
+						subPrice: 62,
+						sourceType: "领取(1)",
+						platformType: 2,
+						startDate: "2023-10-23",
+						endDate: "2023-11-23",
+						useStatus: 2,
+						useDate: ""
 					}
 				],
 				height: 120,
 				queryParams: {
-					pageSize: 2,
-					pageNum: 1,
-					useStatus: '',
+					storeId: '',
+					roomId: '',
+					orderMode: '',
+					preStartDate: '',
+					preEndDate: ''
 				},
-				eventChannel:null,
-				tipText:"",
-				show:false,
+				eventChannel: null,
+				tipText: "",
+				show: false,
+				eventChannel: null,
+				selectId: ''
 			};
 		},
 		components: {
 			'fixed-header': FixedHeader
 		},
-		onReachBottom() {
-			if(this.status=='loadmore'){
-				this.queryParams.pageNum+=1;
-				this.onLoading();
-			}
-		
-		},
 		onLoad() {
-			this.onLoading();
+			this.eventChannel = this.getOpenerEventChannel();
+			// eventChannel.emit('acceptDataFromOpenedPage', {data: 'data from test page'});
+
+			this.eventChannel.on('sendData', (data) => {
+				this.selectId = data.selectId
+				this.onLoading(data);
+			})
 		},
 		methods: {
-			onLoading(){
-				getCouponList(this.queryParams).then(res=>{
-					console.log(res,909090909)
-					if(res.data.code === 200 ){
-						this.list = res.data.rows
-						this.total = res.data.total
-						
-						if (this.list.length < this.total) {
-							this.status = 'loadmore';
-						} else {
-							this.status = 'nomore'
+			onLoading(d) {
+				console.log(d, 90909)
+				getUseCoupon(d).then(res => {
+					console.log(res.data.data, "优惠券")
+					if (res.statusCode == 200) {
+						if (res.data && res.data.data.length) {
+							this.list = res.data.data.sort((a, b) => b.subPrice - a.subPrice);
+		                    this.current = this.list.findIndex(item=>item.id === this.selectId)
 						}
-						
 					}
 				})
+			},
+			onSelect(item, i) {
+				if (item.isAvailable !== 0 || this.current === i) return
+				this.current = i
+			},
+			onCancle() {
+				uni.navigateBack()
+			},
+			onConfirm() {
+				this.eventChannel.emit('getSelectData', {
+					couponId: this.list[this.current].id
+				});
+				this.onCancle();
 			}
 		}
 	}
 </script>
 
 <style scoped lang="scss">
- .coupon-list-box{
-	 display: flex;
-	 flex-direction: column;
-	 align-items: center;
-	 width: 100%;
-	 .coupon-item{
-		 display: flex;
-		 flex-direction: row;
-		 width: 92%;
-		 border-radius: 20upx;
-		 background-color: #ffffff;
-		 margin: 12upx 0;
-		 padding: 30upx 20upx;
-		 .part-left{
-			 display: flex;
-			 justify-content: center;
-			 align-items: center;
-			 width: 160upx;
-			 margin-right: 20upx;
-			 image{
-				 display: block;
-				 width: 100%;
-				 max-height:140upx ;
-			 }
-		 }
-		 .part-right{
-			 display: flex;
-			 flex: 1;
-			 flex-direction: column;
-			 .coupon-name{
-				 display: flex;
-				 justify-content: space-between;
-			 }
-			 .des{
-				 display: flex;
-				 justify-content: space-between;
-				 align-items: center;
-				 .flex-row{
-					 display: flex;
-					 flex-direction: row;
-					 align-items: center;
-				 }
-			 }
-		 }
-	 }
- }
- .empty-box{
- 	display: flex;
- 	justify-content: center;
- 	align-items: center;
- 	min-height: 400upx;
- }
-</style>
+	.coupon-list-box {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		width: 100%;
+		padding-bottom: 140upx;
+
+		.coupon-item {
+			display: flex;
+			flex-direction: row;
+			width: 92%;
+			border-radius: 20upx;
+			background-color: #ffffff;
+			margin: 12upx 0;
+			padding: 30upx 20upx;
+
+			.part-left {
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				width: 160upx;
+				margin-right: 20upx;
+
+				image {
+					display: block;
+					width: 100%;
+					max-height: 140upx;
+				}
+			}
+
+			.part-right {
+				display: flex;
+				flex: 1;
+				flex-direction: column;
+
+				.coupon-name {
+					display: flex;
+					justify-content: space-between;
+				}
+
+				.des {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+
+					.flex-row {
+						display: flex;
+						flex-direction: row;
+						align-items: center;
+					}
+				}
+			}
+
+			.margin-top {
+				margin-top: 12upx;
+			}
+		}
+
+		.active {
+			box-shadow: 0 0 10upx #ff55ff;
+		}
+	}
+
+	.box-content {
+		position: fixed;
+		left: 0;
+		bottom: 0;
+		width: 100vw;
+		height: 120upx;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		background-color: #ffffff;
+
+		.cu-btn {
+			width: 40%;
+			margin: 0 5%;
+		}
+	}
+</style>
\ No newline at end of file