1

components/coupon/packagecart.vue

+<template>
+  <u-popup
+    mode="bottom"
+    border-radius="20"
+    :popup="false"
+    v-model="show"
+    :maskCloseAble="true"
+    length="auto"
+    :safeAreaInsetBottom="true"
+    @close="popupClose"
+    :z-index="9999"
+    close-icon="cross"
+    :closeable="true"
+  >
+    <view class="course">
+      <view class="title">套餐卡</view>
+      <view class="chosentips">请选择要使用的套餐卡</view>
+      <view class="details">
+        <view class="item" v-for="(x, i) in ts" :key="i">
+          <view class="ticket">
+				<image mode="aspectFill" :src="x.CouponIco" style="width: 100%; height: 100%;border-top-left-radius: 5px;border-bottom-left-radius: 5px;" ></image>
+          </view>
+          <view class="detail">
+            <view class="coupond">
+              <view class="name">{{x.Name}}</view>
+			  <view class="rule">{{x.Describe}}</view>
+              <view class="date" v-if="x.IndateType==2">{{x.StartDate+"-"+x.EndDate}}</view>
+			  <view class="date" v-if="x.IndateType==1">{{x.StartDate+"-"+x.EndDate}}</view>
+            </view>
+            <view class="chosen">
+              <u-radio-group v-model="currentChosen"  >
+                <u-radio
+                  shape="circle"
+                  :name="x.CouponId"
+                  :icon-size="36"
+                  :active-color="mc"
+                ></u-radio>
+              </u-radio-group>
+            </view>
+          </view>
+        </view>
+      </view>
+      <view class="btton-box">
+        <u-button
+          size="80"
+          :ripple="true"
+          shape="circle"
+          :custom-style="{
+            backgroundColor: mc,
+            height: '80rpx',
+            color: '#FFF',
+            fontSize: '14px',
+            margin: '0 3vw',
+            width: '90vw',
+          }"
+          @click="popupClose"
+          >确定</u-button
+        >
+      </view>
+    </view>
+  </u-popup>
+</template>
+
+<script>
+export default {
+  props: ["list", "current"],
+  data() {
+    return {
+      mc: "",
+      show: true,
+      currentChosen: "",
+      ts:[]
+    };
+  },
+  mounted() {
+    this.mc = this.$uiConfig.mainColor;
+    this.currentChosen = this.current;
+    this.ts=this.list
+    this.ts.forEach(x=>{
+        x.StartDate=x.StartDate.split(' ')[0].replace(/-/g,'.')
+        x.EndDate=x.EndDate.split(' ')[0].replace(/-/g,'.')
+    })
+  },
+  methods: {
+    popupClose(){
+      if(this.currentChosen!=this.current){
+        this.$emit('close',this.currentChosen)
+      }else{
+        this.$emit('close',-1)
+      }
+    },
+  },
+};
+</script>
+
+<style>
+.course {
+  max-height: 70vh;
+  background: #f5f5f5;
+  padding-bottom: 50px;
+  text-align: left !important;
+  border-top-left-radius: 20rpx;
+  border-top-right-radius: 20rpx;
+  overflow: scroll;
+}
+.course .title {
+  font-size: 22px;
+  color: #000;
+  padding: 20px;
+  background: #fff;
+}
+.course .chosentips {
+  padding: 12px 20px;
+  border-bottom: 1px solid #f5f5f5;
+  border-top: 1px solid #f5f5f5;
+  color: #777;
+  background: #fff;
+  font-size: 12px;
+}
+.course .details {
+  padding: 10px;
+  display: flex;
+  flex-direction: column;
+}
+.course .details .item {
+  display: flex;
+  margin-bottom: 10px;
+  align-items: flex-start;
+  background: #fff;
+  border-radius: 5px;
+  box-shadow:0 4px 6px 1px rgba(76, 76, 76, 0.1);
+}
+.course .details .item .ticket {
+	width: 104px;
+	height: 78px;
+}
+
+.course .details .item .detail {
+  width: 1px;
+  flex: 1;
+  background: #fff;
+  padding: 10px;
+  display: flex;
+  align-items: center;
+}
+.course .details .item .detail .coupond {
+  flex: 1;
+}
+.course .details .item .detail .coupond .name {
+  font-size: 13px;
+  font-weight: 600;
+  color: #000;
+  overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 1;
+    -webkit-box-orient: vertical;
+}
+.course .details .item .detail .coupond .date {
+  margin-top: 5px;
+  font-size: 11px;
+  color: #777;
+}
+.course .details .item .detail .coupond .rule{
+    font-size: 11px;
+    color:#777;
+    margin-top: 5px;
+	overflow: hidden;
+	  text-overflow: ellipsis;
+	  display: -webkit-box;
+	  -webkit-line-clamp: 1;
+	  -webkit-box-orient: vertical;
+}
+.course .details .item .detail .chosen {
+  width: 20px;
+}
+
+</style>

pages/reserve/storeDetails.vue

@@ -7,6 +7,7 @@
 	.details-box{
 		width: 100%;
 		height: 100%;
+		
 	}
 	.storeDetails .headStatus {
 		  overflow: hidden;
@@ -216,6 +217,8 @@
 	}
 	.storeDetails .richtext{
 		padding: 15px;
+		margin-bottom: 80px;
+
 	}
 	.storeDetails .comment {
 	  background: #fff;
@@ -270,6 +273,25 @@
 		margin-top: 10px;
 		
 	}
+	.storeDetails .btn{
+		width: 100%;
+		padding: 15px;
+		position: fixed;
+		left: 0;
+		bottom: 0;
+		background: #FFF;
+		z-index: 99;
+	}
+	.storeDetails .btn-box{
+		width: 100%;
+		height: 45px;
+		border-radius: 6px;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		font-size: 14px;
+		color: #FFFFFF;
+	}
 </style>
 <template>
 	<view class='storeDetails'
@@ -494,7 +516,11 @@
 			<view class="richtext" >
 				<h-parse :content="detailContent" @navigate="clickDescription"></h-parse>
 			</view>
-			
+			<view class="btn">
+				<view class="btn-box" :style="{'background':mc}" @click="gosubscribe">
+					预约
+				</view>
+			</view>
 		</view>
 		
 		<u-skeleton :loading="loading" :animation="true" bgColor="#FFF"></u-skeleton>
@@ -658,9 +684,30 @@
 			
 			
 		},
-		onReady(){
 	
 		
+		onPageScroll(e){
+			// console.log(e)
+			this.scrollTop = e.scrollTop;
+			if(this.scrollTop>=this.stickyH-this.headH){
+				this.showSticky=true
+			}
+			if(this.stickyH-this.headH>this.scrollTop){
+				this.showSticky=false
+			}
+		},
+		mounted() {
+			this.$utils.getRect('.headStatus').then(res => {
+				if(res && res.height){
+					this.headH = res.height
+				}
+			})
+			this.$utils.getRect('.store-tabs').then(res => {
+				if(res && res.top){
+					this.stickyH = res.top
+					
+				}
+			})
 			setTimeout(()=>{
 				this.$utils.getRect('.setmeal-box').then(res => {
 					if(res && res.top){
@@ -685,32 +732,6 @@
 				})
 			},1000)
 			
-			
-		},
-		
-		onPageScroll(e){
-			// console.log(e)
-			this.scrollTop = e.scrollTop;
-			if(this.scrollTop>=this.stickyH-this.headH){
-				this.showSticky=true
-			}
-			if(this.stickyH-this.headH>this.scrollTop){
-				this.showSticky=false
-			}
-		},
-		mounted() {
-			this.$utils.getRect('.headStatus').then(res => {
-				if(res && res.height){
-					this.headH = res.height
-				}
-			})
-			this.$utils.getRect('.store-tabs').then(res => {
-				if(res && res.top){
-					this.stickyH = res.top
-					
-				}
-			})
-			
 		},
 		methods:{
 			getRect(){

pages/reserve/subscribe.vue

@@ -217,6 +217,12 @@
 		color: #FFF;
 		font-size: 14px;
 	}
+	.subscribe .right{
+		flex: 1;
+		color: #232323;
+		text-align: right;
+		display: flex;
+	}
 </style>
 <template>
 	<view class="subscribe">
@@ -320,6 +326,16 @@
 					<text class="info-i-l">人数</text>
 					<u-number-box v-model="value" :min="1" @change="valChange"></u-number-box>
 				</view>
+				<view class="info-item">
+					<text class="info-i-l">套餐卡</text>
+					<view class="right" >
+						<text class="content" v-if="courseList.length>0" @click="showCourseHandler">选择套餐卡
+						</text>
+						<text class="content" v-else-if="courseList.length==0">暂无套餐卡</text>
+						<text class="content" v-else :style="{ color: pricecolor }" @click="showCourseHandler">已优惠0元</text>
+						<u-icon name="ellipsis" size="36" v-if="courseList.length > 0" @click="showCourseHandler"></u-icon>
+					</view>
+				</view>
 				<view class="info-item">
 					<text class="info-i-l">手机</text>
 					<input class="uni-input inputsmart"  v-model="Mobile" placeholder='请输入手机号码' />
@@ -387,16 +403,19 @@
 				
 			</view>
 		</u-popup>
+		<packagecart v-if="courseList.length > 0 && showCourse" :list="courseList" :current="User_Coupon_Id" @close="closeCourseHandler"></packagecart>
 	</view>
 </template>
 
 <script>
 	import payCom from '@/components/pay/pay';
 	import hParse from "@/components/u-parse/parse.vue";
+	import packagecart from '@/components/coupon/packagecart.vue';
 	export default {
 		components: {
 			payCom,
 			hParse,
+			packagecart,
 		},
 		data() {
 			return {
@@ -429,6 +448,9 @@
 					OrderPayType: 1,
 					GoodsName: ''
 				},
+				courseList:[],
+				showCourse:false,
+				User_Coupon_Id:0,
 			};
 		},
 		
@@ -445,7 +467,7 @@
 				this.GetApplOGInfo()//商品详情
 			}
 			this.payInfo.OpenId=uni.getStorageSync('mall_UserInfo').OpenId;
-			
+			this.getAllCPList()
 		},
 		mounted() {
 			uni.setNavigationBarTitle({
@@ -474,6 +496,19 @@
 					}
 				);
 			},
+			closeCourseHandler(e) {//套餐卡返回
+			console.log(e)
+				if (e != -1) {
+					this.User_Coupon_Id = e;
+					
+				}
+				this.showCoupon = false;
+				
+				
+			},
+			showCourseHandler(){
+				this.showCourse = true;
+			},
 			GetAppOGList(){
 				uni.showLoading({
 					title: '加载中'
@@ -497,7 +532,21 @@
 					}
 				);
 			},
+			getAllCPList(){
+				this.request2({
+						url: '/api/AppletStores/GetAllCouponPageList',
+						data: {pageIndex:1,pageSize:999,StoreId:this.id}
+					},
+					res => {
+						
+						if (res.resultCode == 1) {
+							this.courseList = res.data.pageData
+						}
+					}
+				);
+			},
 			GetApplOGInfo(){
+				
 				uni.showLoading({
 					title: '加载中'
 				});
@@ -535,6 +584,12 @@
 			submitOrderHandler(){//提交订单
 				let that = this;
 				this.submitOrder = true;
+				if(that.Mobile==''){
+					uni.showToast({
+						title:'填写手机号码'
+					})
+					return
+				}
 				uni.requestSubscribeMessage({
 					tmplIds: that.goods.template_message_list,
 					complete(res) {
@@ -580,19 +635,7 @@
 					}
 				});
 			},
-			getphonenumber(e){
-					console.log(e)  
-					uni.checkSession({//检查登录状态是否过期
-						success:(x)=>{
-							if(x.errMsg=='checkSession:ok'){//没有过期
-								console.log('没过期')
-							}
-						},
-						fail:(err)=>{//检测失败重新登录
-							console.log(err)
-						}
-					})
-			},
+		
 			switchitem(item){//选中分类的操作
 				this.categoryIds = item.Id;
 				this.GetAppOGList()