1、招租详情：返回首页、收藏的功能实现，和立即联系的逻辑实现

pages/canteenRent/rentDetail.vue

@@ -92,21 +92,21 @@
 			<!-- 底部按钮 -->
 			<view class="footer-box">
 				<view class="icon-box flex ml40">
-					<view>
+					<view @click="backHome">
 						<image class="btnIcon" src="https://jiangxiaoxian.0rui.cn/backHome.png" mode=""></image>
 						<view class="btnText" style="margin-top: 10rpx;">首页</view>
 					</view>
-					<view style="margin-left: 40rpx;">
+					<view style="margin-left: 40rpx;" @click="showShareModal">
 						<image class="btnIcon" src="https://jiangxiaoxian.0rui.cn/rentShare.png" mode=""></image>
 						<view class="btnText" style="margin-top: 10rpx;">分享</view>
 					</view>
-					<view style="margin-left: 40rpx;">
+					<view style="margin-left: 40rpx;" @click="handleColect">
 						<image v-if="detailRent.is_collect == 0" class="btnIcon"
 							src="https://jiangxiaoxian.0rui.cn/unCollect.png" mode=""></image>
 						<image v-else class="btnIcon" src="https://jiangxiaoxian.0rui.cn/collected.png" mode=""></image>
 						<view class="btnText" style="margin-top: 10rpx;">收藏</view>
 					</view>
-					<view style="margin-left: 40rpx;">
+					<view style="margin-left: 40rpx;" @click="toPage('/pages/chat/index')">
 						<image class="btnIcon" src="https://jiangxiaoxian.0rui.cn/service.png" mode=""></image>
 						<view class="btnText" style="margin-top: 10rpx;">客服</view>
 					</view>
@@ -120,17 +120,28 @@
 		<su-popup :show="showContacted == true" type="center" round="10" :isMaskClick="false">
 			<view class="popupContacted">
 				<view class="contactedBox">
-					<image style="width: 120rpx;height: 120rpx;"></image>
+					<image style="width: 120rpx;height: 120rpx;position: relative;left: 54rpx;" src="https://jiangxiaoxian.0rui.cn/rentContact1.png"></image>
-					<view style="font-size: 36rpx;line-height: 50rpx;font-weight: 900;color: #3d3d3d;margin: 30rpx 0;">确认拨号</view>
+					<view style="font-size: 36rpx;line-height: 50rpx;font-weight: 900;color: #3d3d3d;position: relative;left: 44rpx;">确认拨号</view>
-					<view style="font-size: 30rpx;line-height: 44rpx;font-weight: 400;color: #3d3d3d;">剩余联系次数：detailRent.all_mobile_num</view>
+					<view style="font-size: 30rpx;line-height: 44rpx;font-weight: 400;color: #3d3d3d;">剩余联系次数：{{detailRent.all_mobile_num}}</view>
+				</view>
+				<view class="contactBtn">
+						<view class="tactBtnBox" style="color: #999999;" @click="showContacted = false">取消</view>
+						<view class="tactBtnBox" style="color: #333333;" @click="handleTell">确定</view>
 				</view>
-				
 			</view>
 		</su-popup>
 		
 		<su-popup :show="showContactNo == true" type="center" round="10" :isMaskClick="false">
 			<view class="popupContactNo">
-				
+				<view class="contactNoBox">
+					<image style="width: 120rpx;height: 120rpx;position: relative;left: 190rpx;" src="https://jiangxiaoxian.0rui.cn/rentContact2.png"></image>
+					<view style="font-size: 36rpx;line-height: 50rpx;font-weight: 900;color: #3d3d3d;position: relative;left: 180rpx;">非常抱歉</view>
+					<view style="font-size: 30rpx;line-height: 44rpx;font-weight: 400;color: #3d3d3d;">你的联系次数不足请前往积分商城兑换</view>
+				</view>
+				<view class="contactBtn">
+					<view class="tactBtnBox" style="color: #999999;" @click="showContactNo = false">取消</view>
+					<view class="tactBtnBox" style="color: #333333;" @click="gotoExchange">去兑换</view>
+				</view>
 			</view>
 		</su-popup>
 		
@@ -158,6 +169,7 @@
 	} from '@/sheep/validate/form';
 	import rent from '../../sheep/api/rent';
 	import sheep from '@/sheep';
+	import { showShareModal } from '@/sheep/hooks/useModal';
 
 	const rentId = ref('');
 	const detailRent = ref('')
@@ -172,6 +184,12 @@
 			getDetail();
 		}
 	})
+	
+	onShow(() => {
+		if (rentId.value) {
+			getDetail();
+		}
+	})
 
 	async function getDetail() {
 		const res = await sheep.$api.rent.rentInfo(rentId.value)
@@ -192,6 +210,44 @@
 		}
 	}
 	
+	//返回首页
+	function backHome() {
+		uni.switchTab({
+			url: '/pages/index/index'
+		})
+	}
+	
+	//页面跳转
+	const toPage = (e) => {
+		uni.navigateTo({
+			url: e
+		})
+	}
+	
+	//收藏
+	function handleColect() {
+		console.log('收藏',detailRent.value.is_collect);
+		if(detailRent.value.is_collect == 1) {
+			detailRent.value.is_collect = 0
+			uni.showToast({
+				title:'已取消收藏',
+				icon:'none'
+			})
+		}else {
+			detailRent.value.is_collect = 1
+			uni.showToast({
+				title:'已收藏',
+				icon:'none'
+			})
+			// setTimeout(() => {
+			// 	uni.showToast({
+			// 		title:'已收藏',
+			// 		icon:'none'
+			// 	})
+			// }, 1000)
+		}
+	}
+	
 	//是否拨打电话的次数
 	function handleJuage() {
 		console.log('拨打电话次数:',detailRent.value.all_mobile_num);
@@ -201,6 +257,36 @@
 			showContactNo.value = true
 		}
 	}
+	const phoneTell = ref()
+	//确定拨打电话
+	async function handleTell() {
+		const res = await sheep.$api.rent.getPhoneNum({
+			id:rentId.value
+		})
+		console.log('获取电话',res);
+		if(res.code == 1) {
+			phoneTell.value = res.data.contact_number
+			showContacted.value = false
+			wx.makePhoneCall({
+			      phoneNumber: phoneTell.value,
+			      success: function() {
+			        console.log("拨打电话成功")
+					
+			      },
+			      fail: function(err) {
+			        console.log("拨打电话失败", err)
+			      }
+			    })
+		}
+	}
+	//去兑换拨号次数
+	function gotoExchange() {
+		showContactNo.value = false
+		uni.navigateTo({
+			url: '/pages/app/score-shop'
+		})
+	}
+	
 </script>
 
 <style lang="scss" scoped>
@@ -338,6 +424,7 @@
 
 		.listItem-contents {
 			background-color: #ffffff;
+			padding: 30rpx;
 			// margin-left: 20rpx;
 			// padding: 30rpx;
 
@@ -374,7 +461,7 @@
 
 			.cons-third {
 				margin-top: 20rpx;
-				padding: 30rpx;
+				// padding: 30rpx;
 				display: flex;
 				justify-content: space-between;
 				align-items: center;
@@ -459,14 +546,70 @@
 		width: 660rpx;
 		height: 477rpx;
 		background-color: #fff;
+		display: grid;
+		border-radius: 18rpx;
 		
 		.contactedBox {
-			width: 100%;
+			width: 660rpx;
-			height: 100%;
+			height: 325rpx;
+			padding: 30rpx 0;
+			// margin-top: 40rpx;
 			display: grid;
 			justify-content: center;
 			align-items: center;
-			padding-top: 40rpx;
+		}
+		
+		.contactBtn {
+			width: 660rpx;
+			height: 92rpx;
+			border-top: 1rpx solid #eeeeee;
+			display: flex;
+			border-radius: 0 0 18rpx 18rpx;
+			// margin-top: 40rpx;
+			
+			.tactBtnBox {
+				width: 330rpx;
+				height: 92rpx;
+				border-right: 1rpx solid #eeeeee;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+			}
+		}
+		
+	}
+	
+	.popupContactNo {
+		width: 660rpx;
+		height: 477rpx;
+		background-color: #fff;
+		display: grid;
+		border-radius: 18rpx;
+		
+		.contactNoBox {
+			width: 660rpx;
+			height: 325rpx;
+			padding: 30rpx 0;
+			display: grid;
+			justify-content: center;
+			align-items: center;
+		}
+		
+		.contactBtn {
+			width: 660rpx;
+			height: 92rpx;
+			border-top: 1rpx solid #eeeeee;
+			display: flex;
+			border-radius: 0 0 18rpx 18rpx;
+			
+			.tactBtnBox {
+				width: 330rpx;
+				height: 92rpx;
+				border-right: 1rpx solid #eeeeee;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+			}
 		}
 	}
 	

sheep/api/rent.js

@@ -22,12 +22,18 @@ export default {
 			},
 		}),
 	rentInfo: (id) =>
-	  request({
+		request({
-	    url: 'meal.information/detail',
+			url: 'meal.information/detail',
-	    method: 'GET',
+			method: 'GET',
-	    params: {
+			params: {
-	      id: id,
+				id: id,
-	    },
+			},
-	  }),
+		}),
-
+	//获取手机号
+	getPhoneNum: (data) =>
+		request({
+			url: 'meal.information/exchange',
+			method: 'POST',
+			data,
+		}),
 };