Merge branch 'master' of http://git.sjzkeji.com/panghu/school_webUser

common/css/common.css

@@ -179,9 +179,15 @@ image {
 .fs-40{
 	font-size: 40rpx;
 }
+.fs-44{
+	font-size: 44rpx;
+}
 .fs-48{
 	font-size: 48rpx;
 }
+.fs-64{
+	font-size: 64rpx;
+}
 
 /* 字体下面横线 */
 .text-underline{
@@ -232,12 +238,20 @@ image {
 	color: #57CAFF;
 }
 .fc-FB3D03{
-	color: #FB3D03;
+	color: #ff3422;
+}
+.fc-ff3939{
+	color: #ff3939;
 }
 .fc-FF7F00{
 	color: #FF7F00;
 }
-
+.fc-ED301D{
+	color: #ED301D;
+}
+.fc-ADADAD{
+	color: #ADADAD;
+}
 /* 背景颜色 */
 .bgc-f{
 	background-color: #fff;
@@ -282,6 +296,9 @@ image {
 .bgc-F5F4F9{
 	background-color: #F5F4F9;
 }
+.bgc-F3F4F6{
+	background-color: #F3F4F6;
+}
 
 .b-b-F9F9F9{
 	border-bottom: 1rpx solid #F9F9F9;
@@ -331,6 +348,9 @@ image {
 .plr-24{
 	padding: 0 24rpx;
 }
+.plr-32{
+	padding: 0 32rpx;
+}
 .ptp-24{
 	padding: 24rpx 0;
 }
@@ -339,6 +359,9 @@ image {
 .m-24{
 	margin: 24rpx;
 }
+.mt-5{
+	margin-top: 5rpx;
+}
 .mt-24{
 	margin-top: 24rpx;
 }
@@ -349,6 +372,9 @@ image {
 .ml-10{
 	margin-left: 10rpx;
 }
+.ml-16{
+	margin-left: 16rpx;
+}
 .ml-40{
 	margin-left: 40rpx;
 }

components/en-utils/en-eva/en-eva.vue

@@ -0,0 +1,83 @@
+<template>
+	<view class="en-eva">
+		<view class="en-eva-box" v-if="type">
+			<view class="n-x">
+				<image v-for="(item,i) in 5" :key="i"
+				 src="@/static/img/index/xing-n.png" mode=""></image>
+			</view>
+			<view class="s-x">
+				<image v-for="(item,i) in num" :key="i"
+				 src="@/static/img/index/index-x.png" mode=""></image>
+			</view>
+		</view>
+		
+		<view class="en-eva-box" v-else>
+			<view class="n-x">
+				<image v-for="(item,i) in 5" :key="i" @click="select(i)"
+				 src="@/static/img/index/xing-n.png" mode=""></image>
+			</view>
+			<view class="s-x">
+				<image v-for="(item,i) in numList" :key="i" @click="select(i)"
+				 src="@/static/img/index/index-x.png" mode=""></image>
+			</view>
+		</view>
+		
+	</view>
+</template>
+
+<script>
+	export default {
+		name:'en-eva',
+		props:{
+			// true 只做显示 false 可编辑
+			type:{
+				type: Boolean,
+				default:true,
+			},
+			num:{
+				type: Number,
+				default:0,
+			},
+		},
+		data(){
+			return{
+				numList:0,
+			}
+		},
+		methods:{
+			select(i){
+				this.numList = i+1
+				this.$nextTick();
+				this.$emit('getEvaNum',this.numList)
+			},
+		},
+	}
+</script>
+
+<style scoped lang="scss">
+	.en-eva{
+		width: 140rpx;
+		height: 24rpx;
+		.en-eva-box{
+			width: 140rpx;
+			height: 24rpx;
+			position: relative;
+			image{
+				width: 24rpx;
+				height: 24rpx;
+				margin-right: 4rpx;
+			}
+			.n-x{
+				display: flex;
+				position: absolute;
+				z-index: 1;
+			}
+			.s-x{
+				display: flex;
+				position: absolute;
+				z-index: 2;
+			}
+		}
+		
+	}
+</style>

pages-takeout/aptitude.vue

@@ -0,0 +1,54 @@
+<template>
+	<view class="aptitude-index iPhone-bottom flex-common-css box-border-box bgc-f">
+		<Nav title='营业资质'></Nav>
+		
+		<view class="scroll-view-css info-list box-border-box p-24 mb-20">
+			<view class="card-box box-border-box p-24">
+				<view class="mb-20 fw-600 fs-32">营业资质</view>
+				<image v-for="(item,i) in 2" :key="i" @click="lookImg(i,item)"
+				src="@/static/img/my/bg.png" mode="scaleToFill"></image>
+			</view>
+			<view class="card-box box-border-box p-24">
+				<view class="mb-20 fw-600 fs-32">许可证</view>
+				<image v-for="(item,i) in 2" :key="i" @click="lookImg(i,item)"
+				src="@/static/img/my/bg.png" mode="scaleToFill"></image>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import tools from "@/service/tools";
+	export default {
+		data(){
+			return{
+				
+			}
+		},
+		methods:{
+			lookImg(i,item){
+				tools.lookBigImg(i,item)
+			},
+		},
+	}
+</script>
+
+<style scoped lang="scss">
+	.aptitude-index{
+		.info-list{
+			height: 100%;
+			background-color: #F5F4F9;
+			.card-box{
+				width: 100%;
+				min-height: 572rpx;
+				background: #FFFFFF;
+				border-radius: 20rpx;
+				image{
+					width: 100%;
+					height: 460rpx;
+					margin-bottom: 20rpx;
+				}
+			}
+		}
+	}
+</style>

pages-takeout/replace-mod/select-site.vue

@@ -0,0 +1,15 @@
+<template>
+	<view class="">
+
+	</view>
+</template>
+
+<script>
+	export default {
+		
+	}
+</script>
+
+<style scoped lang="scss">
+
+</style>

pages-takeout/replace-take.vue

@@ -0,0 +1,269 @@
+<template>
+	<view class="replace-take-box iPhone-bottom flex-common-css box-border-box bgc-f">
+		
+		<view class="nav-box">
+			<image class="bg-img" src="@/static/img/takeout/dq-bg.png" mode="scaleToFill"></image>
+			<Nav :leftShow='false' :customNav='true' bgckgroundBox='transparent'>
+				<template>
+					<view slot="custom" class="align-items-center">
+						<uni-icons type="left" size="20" @click="toBack()"></uni-icons>
+						<view class="w-390 text-overflow-ellipsis-one fs-36 fw-400">代重庆邮电大学邮电大代重庆邮电大学邮电大</view>
+					</view>
+				</template>
+			</Nav>
+			<view :class="addressData.id?'bottom-124':''" class="address-box align-items-center box-border-box plr-24">
+				<view v-if="!addressData.id" class="address-1 flex-justify-space align-items-center">
+					<view class="align-items-center">
+						<image class="qu-image" src="@/static/img/takeout/qu-icon.png" mode=""></image>
+						<view class="fw-600 fs-40">请选择站点</view>
+					</view>
+					<image class="address-box-right" src="@/static/img/toRight.png" mode=""></image>
+				</view>
+				<view v-else class="address-2 flex-justify-space align-items-center">
+					<view class="display-flex">
+						<image class="address-img mr-20" src="@/static/img/my/bg.png" mode="scaleToFill"></image>
+						<view class="">
+							<view class="w-474 fs-40 fw-600 mb-4">菜鸟驿站</view>
+							<view class="w-474 fw-400 fs-26 fc-9">兴科大道252号兴科大道252号兴科大道252号</view>
+						</view>
+					</view>
+					<image class="address-box-right" src="@/static/img/toRight.png" mode=""></image>
+				</view>
+			</view>
+		</view>
+		
+		
+		<view class="scroll-view-css list-box box-border-box plr-24">
+			<view class="mb-32" :class="addressData.id?'h-120':'h-60'"></view>
+			
+			<view class="list-box-b mb-48">
+				<view class="fs-36 fw-600 mb-22">快递类型</view>
+				<view class="list-item flex-justify-space" v-for="(item,i) in 6" :key="i">
+					<image src="@/static/img/my/bg.png" mode="scaleToFill"></image>
+					<view class="flex-1 ">
+						<view class="fs-32 fw-600 mb-4">小件(轻薄衣物，小1111111物品11) 1小件(轻薄衣物，小1111111物品11) 1</view>
+						<view class="fs-24 fw-400 mb-4 fc-9">规格规格规格规格规格</view>
+						<view class="fs-24 fw-400 mb-4 fc-9">销量2801</view>
+						<view class="flex-justify-space">
+							<view class="">
+								<span class="fw-4 fc-FB3D03 fs-24">￥</span>
+								<span class="fw-b fc-FB3D03 fs-40">3.9</span>
+								<span class="fw-400 fc-9 fs-24">/份</span>
+							</view>
+							<view class="display-flex align-items-center">
+								<view class="right-only-right-red fw-500 text-align-center fs-36 fc-f">-</view>
+								<view class="right-only-right-2 text-align-center fs-28 fw-400">1</view>
+								<view class="right-only-right-add fw-500 text-align-center fs-36 fc-f">+</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			
+			<view class="">
+				<view class="fs-36 fw-600 mb-22">取件码（6）</view>
+				<view class="mb-20" v-for="(item,i) in 6" :key="i">
+					<input class="input-num" type="text" placeholder="未输入取件码" placeholder-class="input-p">
+				</view>
+			</view>
+		</view>
+		
+		<view class="shop-buttom-money box-border-box" @click="createOrder()">
+			<view class="shop-buttom-money-1 flex-justify-space align-items-center">
+				<image src="@/static/img/takeout/buy-icon.png" mode="scaleToFill"></image>
+				<view class="shop-buttom-num fs-24 fc-f text-align-center">3</view>
+				<view class="">
+					<span class="fw-600 fs-24 fc-f">￥</span>
+					<span class="fw-600 fs-44 fc-f">19.26</span>
+				</view>
+				<view class="shop-buttom-money-2 text-align-center fs-32 fc-f fw-600">去结算</view>
+			</view>
+		</view>
+		
+	</view>
+</template>
+
+<script>
+	import tools from "@/service/tools";
+	export default {
+		data(){
+			return{
+				addressData:{
+					id:'',
+					name:'',
+				},
+			}
+		},
+		onShow() {
+			
+		},
+		methods:{
+			toBack(){
+				tools.leftClick()
+			},
+			createOrder(){
+				
+			},
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.replace-take-box{
+		.h-120{
+			height: 120rpx;
+		}
+		.h-60{
+			height: 60rpx;
+		}
+		.w-474{
+			width: 474rpx;
+		}
+		.w-390{
+			width: 390rpx;
+			margin-left: 38rpx;
+		}
+		.nav-box{
+			height: 490rpx;
+			position: relative;
+			.bg-img{
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 490rpx;
+				// z-index: -1;
+			}
+			.bottom-124{
+				bottom: -124rpx !important;
+			}
+			.address-box{
+				z-index: 100;
+				position: absolute;
+				bottom: -64rpx;
+				left: 24rpx;
+				box-sizing: border-box;
+				width: 702rpx;
+				min-height: 136rpx;
+				background: linear-gradient( 182deg, #F1F9FF 0%, #FFFFFF 100%);
+				box-shadow: 0rpx 0rpx 40rpx 0rpx rgba(172,210,235,0.19);
+				border-radius: 20rpx;
+				border-image: linear-gradient(167deg, rgba(255, 255, 255, 1), rgba(208, 236, 255, 0.61)) 2 2;
+				.address-1{
+					width: 100%;
+					.qu-image{
+						width: 40rpx;
+						height: 49rpx;
+						margin: 10rpx 10rpx 0 0;
+					}
+					
+				}
+				.address-2{
+					box-sizing: border-box;
+					padding:32rpx 0;
+				}
+				.address-img{
+					width: 100rpx;
+					height: 100rpx;
+					border-radius: 8rpx;
+				}
+				.address-box-right{
+					width: 32rpx;
+					height: 32rpx;
+				}
+			}
+		}
+		
+		.shop-buttom-money{
+			width: 100%;
+			height: 140rpx;
+			background: rgba(255,255,255,0.8);
+			padding: 20rpx 24rpx;
+			.shop-buttom-money-1{
+				width: 100%;
+				height: 100%;
+				background: #333333;
+				border-radius: 200rpx;
+				box-sizing: border-box;
+				padding-left: 136rpx;
+				// padding-right: 32rpx;
+				position: relative;
+				image{
+					position: absolute;
+					bottom: 0;
+					left: 8rpx;
+					width: 128rpx;
+					height: 128rpx;
+				}
+				.shop-buttom-num{
+					width: 32rpx;
+					height: 32rpx;
+					line-height: 32rpx;
+					background: #FB3D03;
+					border-radius: 50%;
+					position: absolute;
+					top: 36rpx;
+					left: 82rpx;
+				}
+				.shop-buttom-money-2{
+					width: 200rpx;
+					height: 100rpx;
+					line-height: 100rpx;
+					background: #41ABF5;
+					border-radius: 0rpx 200rpx 200rpx 0rpx;
+				}
+			}
+		}
+		
+		.list-box{
+			.list-box-b{
+				border-bottom: 1rpx solid #f9f9f9;
+			}
+			.list-item{
+				width: 100%;
+				min-height: 200rpx;
+				margin-bottom: 50rpx;
+				
+				image{
+					width: 200rpx;
+					height: 200rpx;
+					border-radius: 20rpx;
+					margin-right: 20rpx;
+				}
+			}
+			.right-only-right-red{
+				width: 44rpx;
+				height: 44rpx;
+				line-height: 40rpx;
+				border-radius: 12rpx;
+				border: 1rpx solid #41ABF5;
+				color: #41ABF5;
+			}
+			.right-only-right-add{
+				width: 44rpx;
+				height: 44rpx;
+				line-height: 40rpx;
+				background: linear-gradient( 117deg, #57CAFF 0%, #41ABF5 100%);
+				border-radius: 12rpx;
+			}
+			.right-only-right-2{
+				min-width: 50rpx;
+			}
+			.input-num{
+				width: 100%;
+				height: 92rpx;
+				box-sizing: border-box;
+				padding: 0 24rpx;
+				background: #F6F6F6;
+				border-radius: 20rpx;
+				font-size: 32rpx;
+			}
+			.input-p{
+				font-weight: 400;
+				font-size: 28rpx;
+				color: #FB3D03;
+			}
+		}
+		
+	}
+</style>

pages-takeout/shop-mod/evaluate.vue

@@ -0,0 +1,242 @@
+<template>
+	<view class="flex-index-css evaluate-box box-border-box">
+		
+		<scroll-view scroll-y="true" class="scroll-view-css" @scrolltolower="scrolltolower">
+			<view>
+				<view class="card-box flex-justify-space align-items-center">
+					<view class="align-items-center">
+						<view class="fs-64 fc-FF7F00 fw-600 mr-12">4.6</view>
+						<EnEva :num="3"></EnEva>
+					</view>
+					<view class="align-items-center">
+						<view class="mr-30">
+							<view class="fs-24 mb-4 fw-400">味道</view>
+							<view class="fs-32 fw-b">4.2</view>
+						</view>
+						<view class="mr-30">
+							<view class="fs-24 mb-4 fw-400">包装</view>
+							<view class="fs-32 fw-b">4.2</view>
+						</view>
+						<view class="">
+							<view class="fs-24 mb-4 fw-400">配送满意度</view>
+							<view class="fs-32 fw-b">91%</view>
+						</view>
+					</view>
+				</view>
+				<view class="card-box align-items-center">
+					<view class="list-item fs-28" @click="selectType(item.id)"
+					:class="type==item.id?'s-item':'n-item'"
+					v-for="(item,i) in list" :key="i">{{item.name}}{{item.num||''}}</view>
+				</view>
+				
+				<view class="card-box" v-for="(item,i) in 5" :key="i">
+					<view class="item-head flex-justify-space mb-22">
+						<view class="display-flex">
+							<image class="left-img mr-16" src="@/static/img/my/bg.png" mode="scaleToFill"></image>
+							<view class="mt-5">
+								<view class="fs-28 fw-600">匿名用户</view>
+								<view class="fs-24 fc-9">2024-05-16</view>
+							</view>
+						</view>
+						<image @click="openPop" class="right-img" src="@/static/img/takeout/ddd.png" mode=""></image>
+					</view>
+					<view class="align-items-center mb-16">
+						<EnEva :num="3"></EnEva>
+						<view class="fs-24 fc-9 ml-16">非常棒</view>
+					</view>
+					<view class="fs-32 fw-400 mb-16">
+						味道好吃就是这个盒子包装不好味道好吃就1是这个盒子包装不好味道好吃就是这个盒子包装1不好味道好吃就是这个盒子包装不好
+					</view>
+					<view class="flex-wrap-wrap">
+						<image v-for="(item,i) in 8" :key="i" @click="lookImg(i,item)"
+						class="list-img" src="@/static/img/my/bg.png" mode="scaleToFill"></image>
+					</view>
+					
+					<view class="bgc-F3F4F6 b-rad-12 box-border-box p-24 ">
+						<view class="flex-justify-space align-items-center mb-12">
+							<view class="fs-28 fw-600 fc-6">商家回复</view>
+							<view class="fs-24 fc-9 fw-400">2024-5-16</view>
+						</view>
+						<view class="fs-24 fc-6 fw-400">
+							感谢亲亲的认可，接到亲的需求,我们就以火箭的速度准备并送出啦，亲亲能否品尝出我们的用心呢?欢迎再来哦!
+						</view>
+					</view>
+				</view>
+			</view>
+		</scroll-view>
+		
+		<uni-popup ref="popup" type="bottom">
+			<view class="pop-box" @click.stop="closePop">
+				<view class="pop-box-1" v-if="tup">
+					<view @click.stop="tup=false" class="text-align-center fs-32 fw-600 mb-20">我要举报</view>
+					<view class="text-align-center fs-32 fw-600">取消</view>
+				</view>
+				<view v-else class="flex-index-css">
+					<view class="flex-1"></view>
+					<view class="pop-box-2 box-border-box p-24">
+						<view class="pop-box-2-1 fs-36 fw-600 text-align-center mb-28">
+							选择举报理由
+							<view class="pop-box-2-2" @click.stop="tup=true">
+								<uni-icons  type="closeempty" size="24"></uni-icons>
+							</view>
+						</view>
+						<view class="pop-item text-align-center fs-32" 
+						v-for="(item,i) in reasonList" :key="i" @click.stop="report(item)">
+							{{item.name}}
+						</view>
+					</view>
+				</view>
+			</view>
+		</uni-popup>
+	</view>
+</template>
+
+<script>
+	import EnEva from '@/components/en-utils/en-eva/en-eva.vue';
+	import tools from "@/service/tools";
+	export default {
+		name:"evaluate-box",
+		components:{EnEva},
+		data(){
+			return{
+				type:0,
+				list:[
+					{name:'全部',id:0},
+					{name:'很棒',id:1,num:11},
+					{name:'一般',id:2},
+					{name:'有图',id:3},
+				],
+				tup:true,
+				reasonList:[
+					{name:'政治敏感',id:1},
+					{name:'色情低俗',id:2},
+					{name:'恶意辱骂',id:3},
+					{name:'违法违规',id:4},
+					{name:'垃圾广告',id:5},
+					{name:'涉未成年',id:6},
+				]
+			}
+		},
+		methods:{
+			lookImg(i,item){
+				tools.lookBigImg(i,item)
+			},
+			selectType(type){
+				if(this.type != type){
+					this.type = type
+				}
+			},
+			scrolltolower(){
+				console.log('触底');
+			},
+			openPop(){
+				this.$refs.popup.open();
+			},
+			closePop(){
+				this.$refs.popup.close();
+				this.tup = true;
+			},
+			report(item){
+				this.closePop()
+			},
+		},
+	}
+</script>
+
+<style scoped lang="scss">
+	.evaluate-box{
+		background-color: #F5F4F9;
+		padding: 16rpx 24rpx;
+		.card-box{
+			box-sizing: border-box;
+			padding: 24rpx;
+			background-color: #fff;
+			border-radius: 20rpx;
+			margin-bottom: 20rpx;
+		}
+		.list-item{
+			min-width: 56rpx;
+			height: 52rpx;
+			border-radius: 8rpx;
+			text-align: center;
+			line-height: 52rpx;
+			margin-right: 20rpx;
+			padding: 0 16rpx;
+		}
+		.s-item{
+			background: linear-gradient( 117deg, #57CAFF 0%, #41ABF5 100%);
+			color: #fff;
+		}
+		.n-item{
+			background: #F3F4F6;
+			color: #333;
+		}
+		.item-head{
+			.left-img{
+				width: 80rpx;
+				height: 80rpx;
+				border-radius: 50%;
+			}
+			.right-img{
+				width: 30rpx;
+				height: 6rpx;
+			}
+		}
+		.list-img{
+			width: 210rpx;
+			height: 210rpx;
+			border-radius: 12rpx;
+			margin: 0 10rpx 10rpx 0;
+		}
+		.list-img:nth-child(3){
+			margin-right: 0 !important;
+		}
+		.list-img:nth-child(6){
+			margin-right: 0 !important;
+		}
+		.list-img:nth-child(9){
+			margin-right: 0 !important;
+		}
+		
+		.pop-box{
+			width: 100%;
+			height: 100vh;
+			background-color: #333;
+			position: relative;
+			.pop-box-1{
+				position: absolute;
+				bottom: 20rpx;
+				left: 24rpx;
+				view{
+					width: 702rpx;
+					height: 88rpx;
+					line-height: 88rpx;
+					background: #FFFFFF;
+					border-radius: 16rpx;
+				}
+			}
+			.pop-box-2{
+				width: 100%;
+				height: 820rpx;
+				background: #FFFFFF;
+				border-radius: 24rpx 24rpx 0rpx 0rpx;
+				.pop-box-2-1{
+					position: relative;
+					.pop-box-2-2{
+						position: absolute;
+						top: 0;
+						right: 0;
+					}
+				}
+				.pop-item{
+					width: 100%;
+					height: 92rpx;
+					line-height: 92rpx;
+					background: #F3F4F6;
+					border-radius: 200rpx;
+					margin-bottom: 24rpx;
+				}
+			}
+		}
+	}
+</style>

pages-takeout/shop-mod/info.vue

@@ -0,0 +1,85 @@
+<template>
+	<view class="shop-info-box box-border-box">
+		<view class="box-card box-border-box p-24 bgc-f mb-20">
+			<view class="fs-32 fw-500 mb-32">商家信息</view>
+			<view class="mb-40 align-items-center">
+				<image src="@/static/img/takeout/info-address.png" mode=""></image>
+				<view class="fs-28 fw-400">重庆市沙坪坝区陈新村陈新路40号食神.牛油拌饭</view>
+			</view>
+			<view class="mb-40 align-items-center">
+				<image src="@/static/img/takeout/info-class.png" mode=""></image>
+				<view class="fs-28 fw-400">门店类目：快餐便当</view>
+			</view>
+			<view class="mb-40 align-items-center">
+				<image src="@/static/img/takeout/info-time.png" mode=""></image>
+				<view class="fs-28 fw-400">营业时间:周一、二、三、四、五、六、日:09:00- 21:40</view>
+			</view>
+			<view class="mb-40 align-items-center">
+				<image src="@/static/img/takeout/info-phone.png" mode=""></image>
+				<view class="fs-28 fw-400">联系电话: 17323751579 </view>
+			</view>
+			<view class="right-img-f align-items-center">
+				<image src="@/static/img/takeout/info-zz.png" mode=""></image>
+				<view class="fs-28 fw-400">查看营业资质 </view>
+				<image @click="to()" class="right-img" src="@/static/img/toRight.png" mode=""></image>
+			</view>
+		</view>
+		
+		<view class="box-card box-border-box p-24 bgc-f mb-20">
+			<view class="fs-32 fw-500 mb-32">商家公告</view>
+			<view class="mb-40 display-flex">
+				<image src="@/static/img/takeout/info-gg.png" mode=""></image>
+				<view class="fs-28 fw-400">第一次点餐的顾客收餐后-定要搅拌均匀在吃哟!我们的肉和牛油拌饭汁均在碗底</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return{
+				
+			}
+		},
+		onShow() {
+			
+		},
+		methods:{
+			to(){
+				uni.navigateTo({
+					url:'/pages-takeout/aptitude'
+				})
+			},
+		},
+	}
+</script>
+
+<style scoped lang="scss">
+	.shop-info-box{
+		height: 100%;
+		overflow: scroll;
+		background-color: #F5F4F9;
+		padding: 16rpx 24rpx;
+		.box-card{
+			width: 100%;
+			min-height: 10rpx;
+			border-radius: 20rpx;
+			image{
+				width: 40rpx;
+				height: 40rpx;
+				margin-right: 16rpx;
+			}
+			.right-img-f{
+				position: relative;
+				.right-img{
+					position: absolute;
+					top: 10rpx;
+					right: -10rpx;
+					width: 32rpx;
+					height: 32rpx;
+				}
+			}
+		}
+	}
+</style>

pages-takeout/shop-mod/menu.vue

@@ -0,0 +1,408 @@
+<template>
+	<view class="menu-box flex-justify-space">
+		<scroll-view scroll-y="true" class="menu-box-left" :scroll-into-view="idMark" :scroll-with-animation='true'>
+			<view class="menu-type-list-f">
+				<view class="menu-type-list fs-28 fc-6 text-align-center" v-for="(item,i) in typeList" :key="i" @click="selectType(item)"
+				:class="type ===  item.type?'bgc-BCEAFF':''"  :id="'scroll'+ item.type">
+					{{item.name}}
+					<view class="menu-type-num fc-f" v-show="item.num > 0">{{item.num > 99?'99+':item.num}}</view>
+				</view>
+			</view>
+			
+		</scroll-view>
+		
+		<scroll-view scroll-y="true" :scroll-with-animation='true' :scroll-into-view="idMark" @scroll="menuScroll">
+			<view class="menu-box-right">
+				<view class="menu-box-only" v-for="(item,i) in menuList" :key="i" :id="'scroll'+ item.type">
+					<view class="mb-18 fs-34 fw-600">{{item.name}}</view>
+					<view class="menu-list flex-justify-space" v-for="(info,k) in item.list" :key="k">
+						<image src="@/static/img/my/bg.png" mode="scaleToFill"></image>
+						<view class="menu-list-right">
+							<view class="mb-4 text-overflow-ellipsis fs-34 fw-600">[畅销款]奥尔1良烤肉 牛油拌饭[畅销款]奥尔1良烤肉 牛油拌饭[畅销款]奥尔1良烤肉 牛油拌饭[畅销款]奥尔1良烤肉 牛油拌饭</view>
+							<view class="mb-20 fw-400 fc-9 fs-24">月销196</view>
+							<view class="flex-justify-space align-items-flex-end">
+								<view class="">
+									<span class="fs-24 fw-400 fc-FB3D03">￥</span>
+									<span class="fs-40 fw-b fc-FB3D03">3.9</span>
+									<span class="fs-24 fc-9 fw-400 text-line-through">￥12</span>
+								</view>
+								<view class="display-flex align-items-center" v-if="info.spec != 1">
+									<view v-show="info.num > 0" class="right-only-right-red fw-500 text-align-center fs-36 fc-f" @click="addred(1,i,k,item)">-</view>
+									<view v-show="info.num > 0" class="right-only-right-2 text-align-center fs-28 fw-400">{{info.num}}</view>
+									<view class="right-only-right-add fw-500 text-align-center fs-36 fc-f" @click="addred(2,i,k,item)">+</view>
+								</view>
+								<view v-else class="right-only-right text-align-center fw-600 fs-28 fc-f" @click="addred(3,i,k,item)">选规格</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</scroll-view>
+		
+		
+		
+		<uni-popup ref="popupGG" type="bottom">
+			<view class="gg-box  flex-index-css">
+				<view class="flex-justify-space  box-border-box p-32">
+					<view class="fs-32 fw-500 fc-0">商品详情规格</view>
+					<view class="" @click="addred(4)">
+						<uni-icons type="closeempty" size="20" ></uni-icons>
+					</view>
+				</view>
+				<view class="goods-info flex-justify-space mb-32 box-border-box plr-32">
+					<image src="@/static/img/my/bg.png" mode="scaleToFill"></image>
+					<view class="flex-1">
+						<view style="width: 446rpx;" class="fw-600 fs-34 text-overflow-ellipsis-one">[畅销款]奥尔1良烤肉牛油拌饭</view>
+						<view class="fw-400 fc-9 fs-24">月销196</view>
+					</view>
+				</view>
+				
+				<view class="scroll-view-css box-border-box plr-32">
+					<view class="" v-for="(item,i) in popData.specList" :key="i">
+						<view class="fs-32 fw-500 fc-0 mb-32">{{item.specName}}</view>
+						<view class="flex-wrap-wrap">
+							<view class="spec-item text-align-center fs-28" 
+							:class="info.isSelect?'s-item':'n-item'"
+							v-for="(info,k) in item.list" :key="k" @click="select(i,k,item,info)">
+								{{info.name}}
+							</view>
+						</view>
+						
+					</view>
+				</view>
+				
+				<view class="pop-buttom box-border-box plr-32">
+					<view class="flex-justify-space mb-28">
+						<view class="pop-buttom-left">
+							<view class="">
+								<span class="fw-600 fs-32 fc-ED301D">￥</span>
+								<span class="fw-600 fs-48 fc-ED301D">19.26</span>
+							</view>
+							<view class="">
+								<span class="fw-400 fs-24 fc-9">已选规格：</span>
+								<span class="fw-400 fs-24">不辣</span>
+							</view>
+						</view>
+						<view class="display-flex align-items-center">
+							<view class="right-only-right-red fw-500 text-align-center fs-36 fc-f">-</view>
+							<view class="right-only-right-2 text-align-center fs-28 fw-400">1</view>
+							<view class="right-only-right-add fw-500 text-align-center fs-36 fc-f">+</view>
+						</view>
+					</view>
+					<view class="pop-buttom-2  text-align-center fs-32 fw-600 fc-f">选好了</view>
+				</view>
+			</view>
+		</uni-popup>
+	</view>
+</template>
+
+<script>
+	import tools from "@/service/tools";
+	export default {
+		name:'menu-box',
+		data(){
+			return{
+				idMark:'',//滚动自适应参数
+				
+				type:1,//分类标识
+				typeList:[],
+				
+				menuList:[],
+				
+				popData:{
+					spec_name:'',
+					spec_ids:'',
+					spec_list:[],
+					specList:[
+						{	
+							specName:'口味',
+							specType:1,
+							list:[
+								{name:'辣1',id:1,isSelect:false},{name:'辣2',id:2,isSelect:false},{name:'辣3',id:3,isSelect:false},{name:'辣4',id:4,isSelect:false},
+							]
+						},
+						{
+							specName:'大小',
+							specType:2,
+							list:[
+								{name:'大1',id:5,isSelect:false},{name:'大2',id:6,isSelect:false},{name:'大3',id:7,isSelect:false},{name:'大4',id:8,isSelect:false},
+							]
+						},
+						{
+							specName:'加料',
+							specType:3,
+							list:[
+								{name:'加1',id:9,isSelect:false},{name:'加2',id:10,isSelect:false},{name:'加3',id:11,isSelect:false},{name:'加4',id:12,isSelect:false},
+							]
+						},
+					]
+				},
+			}
+		},
+		mounted() {
+			this.getTypeList();
+		},
+		methods:{
+			getTypeList(){
+				this.typeList = [
+					{
+						"category_id": 1,
+						"name": "爆品推荐",
+						"type": 1,
+					},
+					{
+						"category_id": 2,
+						"name": "必点口味",
+						"type": 2
+					},
+				]
+				this.type = this.typeList[0].type;
+				this.idMark = 'scroll'+ this.type;
+				this.typeList.forEach((v)=>{
+					v.num = 0
+				})
+				
+				this.menuList = [
+					{
+						name:'分类1',
+						type:1,
+						list:[
+							{name:1,num:0,spec:1},{name:2,num:0},{name:3,num:0},{name:4,num:0},
+						]
+					},
+					{
+						name:'分类2',
+						type:2,
+						list:[
+							{name:1,num:0},{name:2,num:0,spec:1},{name:3,num:0},{name:4,num:0},
+						]
+					},
+				]
+			},
+			
+			selectType(item){
+				if(this.type != item.type){
+					this.type = item.type;
+					this.idMark = 'scroll'+ item.type
+				}
+			},
+			menuScroll(){
+				let _this = this;
+				let query = uni.createSelectorQuery().in(this);
+				query.selectAll(".menu-box-only").boundingClientRect(data=>{
+					data.forEach((v)=>{
+						if(v.top < 329&&v.top>0){
+							_this.idMark = v.id;
+							let arr = v.id.split('scroll');
+							_this.type = Number(arr[1]);
+						}
+					})
+				}).exec();
+			},
+			addred(type,i,k,item){
+				if(type === 1){
+					// 减
+					this.menuList[i].list[k].num -= 1;
+					this.setSub(item);
+				}else if(type === 2){
+					// 加
+					this.menuList[i].list[k].num += 1;
+					this.setSub(item);
+				}else if(type === 3){
+					// 选规格
+					this.$refs.popupGG.open();
+				}else{
+					this.$refs.popupGG.close();
+				}
+			},
+			setSub(item){
+				let num = 0;
+				item.list.forEach((n)=>{
+					num += n.num
+				})
+				this.typeList.forEach((v)=>{
+					if(v.type == item.type){
+						v.num = num
+					}
+				})
+			},
+			
+			// -------弹窗选择规格-----------
+			select(i,k,item,info){
+				if(!info.isSelect){
+					item.list.forEach((v)=>{
+						v.isSelect = false;
+					})
+					info.isSelect = true;
+					
+					item.list.forEach(v=>{
+						this.popData.spec_list.forEach((n,i)=>{
+							if(v.id == n){
+								this.popData.spec_list.splice(i, 1)
+							}
+						})
+					})
+					this.popData.spec_list.push(info.id);
+				}else{
+					info.isSelect = false;
+					let index = this.popData.spec_list.indexOf(info.id)
+					this.popData.spec_list.splice(index, 1)
+				}
+				this.spec_ids = this.popData.spec_list.join('_')
+				
+			},
+		},
+	}
+</script>
+
+<style scoped lang="scss">
+		.menu-box{
+			height: 100%;
+			
+			.menu-box-left{
+				width: 176rpx;
+				height: 100%;
+				background-color: #F7F8FA;
+				border-radius: 0rpx 20rpx 0 0rpx;
+				.menu-type-list-f{
+					width: 176rpx;
+					height: 100%;
+					.menu-type-list{
+						width: 176rpx;
+						min-height: 10rpx;
+						box-sizing: border-box;
+						padding: 14rpx 32rpx;
+						position: relative;
+						.menu-type-num{
+							position: absolute;
+							top: 2rpx;
+							right: 8rpx;
+							padding: 0 6rpx;
+							min-width: 20rpx;
+							height: 32rpx;
+							text-align: center;
+							line-height: 32rpx;
+							background: #FB3D03;
+							border-radius: 50%;
+						}
+					}
+				}
+			}
+			
+			.menu-box-right{
+				flex: 1;
+				height: 100%;
+				box-sizing: border-box;
+				padding: 0 16rpx;
+				.menu-list{
+					width: 100%;
+					height: 200rpx;
+					margin-bottom: 40rpx;
+					image{
+						width: 200rpx;
+						height: 200rpx;
+						border-radius: 12rpx;
+						margin-right: 16rpx;
+					}
+					.menu-list-right{
+						flex: 1;
+						.right-only-right{
+							width: 100rpx;
+							height: 44rpx;
+							background: linear-gradient( 117deg, #57CAFF 0%, #41ABF5 100%);
+							border-radius: 12rpx;
+							line-height: 44rpx;
+						}
+						.right-only-right-red{
+							width: 44rpx;
+							height: 44rpx;
+							line-height: 40rpx;
+							border-radius: 12rpx;
+							border: 1rpx solid #41ABF5;
+							color: #41ABF5;
+						}
+						.right-only-right-add{
+							width: 44rpx;
+							height: 44rpx;
+							line-height: 40rpx;
+							background: linear-gradient( 117deg, #57CAFF 0%, #41ABF5 100%);
+							border-radius: 12rpx;
+						}
+						.right-only-right-2{
+							min-width: 50rpx;
+						}
+					}
+				}
+			}
+			
+			.gg-box{
+				width: 750rpx;
+				height: 1208rpx;
+				background: #FFFFFF;
+				border-radius: 24rpx 24rpx 0rpx 0rpx;
+				.goods-info{
+					border-bottom: 1rpx solid #EEEEEE;
+					image{
+						width: 170rpx;
+						height: 160rpx;
+						border-radius: 8rpx;
+						margin-right: 22rpx;
+						margin-bottom: 32rpx;
+					}
+				}
+				.pop-buttom{
+					width: 100%;
+					height: 250rpx;
+					box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(51,51,51,0.1);
+					.pop-buttom-left{
+						padding-top: 12rpx;
+					}
+					.pop-buttom-2{
+						width: 100%;
+						height: 96rpx;
+						line-height: 96rpx;
+						background: #41ABF5;
+						border-radius: 200rpx
+					}
+					.right-only-right-red{
+						width: 44rpx;
+						height: 44rpx;
+						line-height: 40rpx;
+						border-radius: 12rpx;
+						border: 1rpx solid #41ABF5;
+						color: #41ABF5;
+					}
+					.right-only-right-add{
+						width: 44rpx;
+						height: 44rpx;
+						line-height: 40rpx;
+						background: linear-gradient( 117deg, #57CAFF 0%, #41ABF5 100%);
+						border-radius: 12rpx;
+					}
+					.right-only-right-2{
+						min-width: 50rpx;
+					}
+				}
+				.spec-item{
+					width: 210rpx;
+					height: 66rpx;
+					line-height: 66rpx;
+					box-sizing: border-box;
+					border-radius: 12rpx;
+					margin: 0 26rpx 26rpx 0;
+				}
+				.spec-item:nth-child(3){
+					margin-right: 0rpx !important;
+				}
+				.s-item{
+					background-color: #ECF7FE;
+					border: 2rpx solid #41ABF5;
+					color: #41ABF5;
+				}
+				.n-item{
+					border: 2rpx solid #EEEEEE;
+					color: #000;
+				}
+			}
+		}
+</style>

pages-takeout/shop.vue

@@ -0,0 +1,392 @@
+<template>
+	<view class="shop-index iPhone-bottom flex-common-css box-border-box">
+		<image class="bg-img" src="@/static/img/my/lqzx-bg.png" mode="scaleToFill"></image>
+		
+		<view class="nav-box">
+			<Nav :leftShow='false' :customNav='true' bgckgroundBox='transparent'>
+				<template>
+					<view slot="custom" class="">
+						<image class="nav-img" @click="toBack()" src="@/static/img/takeout/bg-back.png" mode="scaleToFill"></image>
+					</view>
+				</template>
+			</Nav>
+		</view>
+		
+		<view class="head-box bgc-f box-border-box plr-24" :style="{height:domHeigjt + 'rpx'}">
+			<view id="shopInfoBox" class="shop-info-box bgc-f box-border-box p-24">
+				<view class="info-box-top flex-justify-space">
+					<view class="box-top-left">
+						<view class="top-left-1 fs-40 fw-600 text-overflow-ellipsis-one">猪油拌猪油拌饭猪油拌猪油拌饭猪油拌饭猪油拌（回兴店）</view>
+						<view class="align-items-center mb-8">
+							<image class="img-x mr-12" src="@/static/img/my/wdpj.png" mode=""></image>
+							<view class="fs-26 fw-600 fc-FF7F00 mr-12">4.5分</view>
+							<view class="fc-6 fs-24 mr-12">| 预计38分钟 |</view>
+							<view class="fc-6 fs-24 mr-12">855人购买</view>
+						</view>
+					</view>
+					<image class="box-top-right" src="@/static/img/my/bg.png" mode="scaleToFill"></image>
+				</view>
+				<view class="fs-24 fw-400 fc-9 mb-20">
+					公告：公告内容公告内容公告内容公告内容公告内11容公公告内容公告内容公告内容公告内容公告内公告内容公告内容公告内容公告内容公告内
+				</view>
+				<view class="flex-wrap-wrap">
+					<view class="info-box-quan-list" v-for="(item,i) in 4" :key="i">
+						<image src="@/static/img/takeout/quan-bg.png" mode=""></image>
+						<view class="quan-list-1 fw-b fs-32 fc-f">
+							<span class="fw-b fs-20 fc-f">￥</span>10</view>
+						<view class="quan-list-2 fw-400 fs-24 fc-f">领</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		
+		<view class="head-box-1 bgc-f box-border-box plr-24">
+			<view class="align-items-center shop-type-list">
+				<view class="shop-item fs-32" @click="seletShopType(item)"
+				:class="shopType === item.id?'s-item':'n-item'"
+				v-for="(item,i) in shopTypeList" :key="i">
+					{{item.name}}
+					<view v-if="item.id == 2" class="pj-num" :class="shopType === item.id?'s-item':'n-item'">999+</view>
+				</view>
+				<view class="shop-item-bs" :style="{left:shopTypeBsLeft+'rpx'}"></view>
+			</view>
+		</view>
+		
+		
+		<view class="common-view-css bgc-f" style="overflow: hidden;">
+			<Menu style="height: 100%;" v-if="shopType === 1"></Menu>
+			<Evaluate style="height: 100%;" v-else-if="shopType === 2"></Evaluate>
+			<ShopInfo style="height: 100%;" v-else-if="shopType === 3"></ShopInfo>
+		</view>
+		
+		<view class="shop-buttom-money box-border-box" @click="openBuyCrad()">
+			<view class="shop-buttom-money-1 flex-justify-space align-items-center">
+				<image src="@/static/img/takeout/buy-icon.png" mode="scaleToFill"></image>
+				<view class="shop-buttom-num fs-24 fc-f text-align-center">3</view>
+				<view class="">
+					<view class="">
+						<span class="fw-600 fs-24 fc-f">￥</span>
+						<span class="fw-600 fs-44 fc-f">19.26</span>
+					</view>
+					<!-- <view class="fs-24 fc-ADADAD">免配送</view> -->
+					<view class="fs-24 fc-ff3939">配送费￥10</view>
+				</view>
+				<view class="fs-32 fw-600 fc-f mr-30">20元起送</view>
+				<!-- <view class="shop-buttom-money-2 text-align-center fc-f fs-32 fw-600">去结算</view> -->
+			</view>
+		</view>
+		
+		<uni-popup ref="popupBuy" type="bottom">
+			<view class="buy-card flex-index-css">
+				<view class="buy-card-top box-border-box plr-32 flex-justify-space align-items-center">
+					<view class="">
+						<span class="fs-32 fc-3 mr-12">已选商品</span>
+						<span class="fs-32 fc-9">(打包费<span class="fs-32 fc-FB3D03">8元</span>)</span>
+					</view>
+					<view class="fs-28 fw-400 fc-9 align-items-center">
+						<view class="">
+							<uni-icons type="trash" size="18" color="#999"></uni-icons>
+						</view>
+						<view class="fs-28 fw-400 fc-9">清空</view>
+					</view>
+				</view>
+				<view class="scroll-view-css box-border-box p-32">
+					<view class="buy-card-item display-flex" v-for="(item,i) in 5" :key="i">
+						<image src="@/static/img/my/bg.png" mode="scaleToFill"></image>
+						<view class="flex-1">
+							<view class="w-514 text-overflow-ellipsis-one fs-34 fw-600 mb-12">[畅销款]奥尔1良烤肉牛油拌饭拌饭[畅销款]奥尔1良烤肉牛油拌饭拌饭</view>
+							<view class="w-514 text-overflow-ellipsis-one fs-24 fw-400 fc-9 mb-18">不辣，加辣</view>
+							
+							<view class="flex-justify-space">
+								<view class="">
+									<span class="fs-24 fc-FB3D03 fw-400">￥</span>
+									<span class="fs-40 fc-FB3D03 fw-b">3.99</span>
+								</view>
+								<view class="display-flex align-items-center">
+									<view class="right-only-right-red fw-500 text-align-center fs-36 fc-f">-</view>
+									<view class="right-only-right-2 text-align-center fs-28 fw-400">1</view>
+									<view class="right-only-right-add fw-500 text-align-center fs-36 fc-f">+</view>
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+				
+				<view class="shop-buttom-money box-border-box" @click="createOrder()">
+					<view class="shop-buttom-money-1 flex-justify-space align-items-center">
+						<image src="@/static/img/takeout/buy-icon.png" mode="scaleToFill"></image>
+						<view class="shop-buttom-num fs-24 fc-f text-align-center">3</view>
+						<view class="">
+							<view class="">
+								<span class="fw-600 fs-24 fc-f">￥</span>
+								<span class="fw-600 fs-44 fc-f">19.26</span>
+							</view>
+							<!-- <view class="fs-24 fc-ADADAD">免配送</view> -->
+							<view class="fs-24 fc-ff3939">配送费￥10</view>
+						</view>
+						<!-- <view class="fs-32 fw-600 fc-f mr-30">20元起送</view> -->
+						<view class="shop-buttom-money-2 text-align-center fs-32 fc-f fw-600">去结算</view>
+					</view>
+				</view>
+			</view>
+		</uni-popup>
+	</view>
+</template>
+
+<script>
+	import Menu from './shop-mod/menu.vue';
+	import Evaluate from './shop-mod/evaluate.vue';
+	import ShopInfo from './shop-mod/info.vue';
+	
+	import tools from "@/service/tools";
+	export default {
+		components:{Menu,Evaluate,ShopInfo},
+		data(){
+			return{
+				domHeigjt:224,
+				shopTypeList:[{name:"点菜",id:1},{name:"评价",id:2},{name:"店铺",id:3},],
+				shopType:1,//组件类型
+				shopTypeBsLeft:12,
+			}
+		},
+		onLoad(e) {
+			
+		},
+		mounted() {
+			this.getDomH();
+		},
+		methods:{
+			toBack(){
+				tools.leftClick()
+			},
+			getDomH(){
+				let info = uni.createSelectorQuery().select('#shopInfoBox');
+				info.boundingClientRect((data)=>{
+					this.domHeigjt = data.height * 2 - 34
+				}).exec()
+			},
+			
+			scrolltolower(){
+				console.log('触底');
+			},
+			seletShopType(item){
+				if(this.shopType!=item.id){
+					this.shopType = item.id;
+					if(this.shopType == 1){
+						this.shopTypeBsLeft = 12
+					}else if(this.shopType == 2){
+						this.shopTypeBsLeft = 166
+					}else{
+						this.shopTypeBsLeft = 160*2
+					}
+				}
+			},
+			openBuyCrad(){
+				this.$refs.popupBuy.open()
+			},
+			createOrder(){
+				
+			},
+		},
+	}
+</script>
+
+<style scoped lang="scss">
+	.shop-index{
+		position: relative;
+		.right-only-right-red{
+			width: 44rpx;
+			height: 44rpx;
+			line-height: 40rpx;
+			border-radius: 12rpx;
+			border: 1rpx solid #41ABF5;
+			color: #41ABF5;
+		}
+		.right-only-right-add{
+			width: 44rpx;
+			height: 44rpx;
+			line-height: 40rpx;
+			background: linear-gradient( 117deg, #57CAFF 0%, #41ABF5 100%);
+			border-radius: 12rpx;
+		}
+		.right-only-right-2{
+			min-width: 50rpx;
+		}
+		.w-514{
+			width: 514rpx;
+		}
+		.bg-img{
+			position: absolute;
+			top: 0;
+			left: 0;
+			width: 100%;
+			height: 280rpx;
+			z-index: -1;
+		}
+		.nav-box{
+			margin-bottom: 110rpx;
+			.nav-img{
+				width: 56rpx;
+				height: 56rpx;
+			}
+		}
+		
+		.shop-buttom-money{
+			width: 100%;
+			height: 140rpx;
+			background: rgba(255,255,255,0.8);
+			padding: 20rpx 24rpx;
+			.shop-buttom-money-1{
+				width: 100%;
+				height: 100%;
+				background: #333333;
+				border-radius: 200rpx;
+				box-sizing: border-box;
+				padding-left: 136rpx;
+				// padding-right: 32rpx;
+				position: relative;
+				image{
+					position: absolute;
+					bottom: 0;
+					left: 8rpx;
+					width: 128rpx;
+					height: 128rpx;
+				}
+				.shop-buttom-num{
+					width: 32rpx;
+					height: 32rpx;
+					line-height: 32rpx;
+					background: #FB3D03;
+					border-radius: 50%;
+					position: absolute;
+					top: 36rpx;
+					left: 82rpx;
+				}
+				.shop-buttom-money-2{
+					width: 200rpx;
+					height: 100rpx;
+					line-height: 100rpx;
+					background: #41ABF5;
+					border-radius: 0rpx 200rpx 200rpx 0rpx;
+				}
+			}
+		}
+		
+		
+		.head-box{
+			width: 100%;
+			position: relative;
+			.shop-info-box{
+				position: absolute;
+				top: -50rpx;
+				left: 24rpx;
+				width: 702rpx;
+				min-height: 258rpx;
+				border-radius: 20rpx;
+				box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(0,0,0,0.1);
+				.info-box-top{
+					.box-top-left{
+						.top-left-1{
+							width: 480rpx;
+							margin-bottom: 8rpx;
+						}
+						.img-x{
+							width: 24rpx;
+							height: 24rpx;
+						}
+					}
+					.box-top-right{
+						width: 100rpx;
+						height: 100rpx;
+						border-radius: 12rpx;
+					}
+				}
+				.info-box-quan-list{
+					width: 124rpx;
+					height: 48rpx;
+					margin: 0 8rpx 8rpx 0;
+					position: relative;
+					image{
+						width: 124rpx;
+						height: 48rpx;
+						position: absolute;
+						top: 0;
+						left: 0;
+						z-index: 1;
+					}
+					.quan-list-1{
+						position: absolute;
+						top: 3rpx;
+						left: 8rpx;
+						z-index: 2;
+					}
+					.quan-list-2{
+						position: absolute;
+						top: 8rpx;
+						right: 12rpx;
+						z-index: 2;
+					}
+				}
+			}
+		}
+		.head-box-1{
+			width: 100%;
+			height: 88rpx;
+			border-bottom: 1rpx solid #eee;
+			.shop-type-list{
+				height: 88rpx;
+				position: relative;
+				.shop-item-bs{
+					position: absolute;
+					bottom: 0;
+					width: 40rpx;
+					height: 6rpx;
+					border-radius: 20rpx;
+					background-color: #41ABF5;
+					transition: left 0.5s;
+				}
+				.shop-item{
+					margin-right: 90rpx;
+					position: relative;
+					.pj-num{
+						position: absolute;
+						right: -80rpx;
+						top: 0;
+						text-align: left;
+						width: 80rpx;
+					}
+				}
+				.s-item{
+					font-weight: 600;
+				}
+				.n-item{
+					font-weight: 400;
+					color: #666666;
+				}
+			}
+		}
+		.buy-card{
+			height: 828rpx;
+			background-color: #fff;
+			border-radius: 24rpx 24rpx 0rpx 0rpx;
+			.buy-card-top{
+				width: 100%;
+				height: 92rpx;
+				background: #FCF5DB;
+				border-radius: 24rpx 24rpx 0rpx 0rpx;
+			}
+			.buy-card-item{
+				width: 100%;
+				height: 176rpx;
+				margin-bottom: 32rpx;
+				image{
+					width: 152rpx;
+					height: 152rpx;
+					border-radius: 12rpx;
+					margin-right: 20rpx;
+				}
+			}
+		}
+		
+	}
+</style>

pages-takeout/takeout.vue

@@ -7,7 +7,7 @@
 				<template>
 					<view slot="custom" class="">
 						<view class="align-items-center mb-28 s-input-f">
-							<uni-icons type="left" size="20"></uni-icons>
+							<uni-icons @click="toBack()" type="left" size="20"></uni-icons>
 							<view v-if="!isScroll" class="fs-40 ml-10 fw-600">外卖</view>
 							<view v-else class="s-input s-input-c" :class="isScroll?'w-454':'w-100100'">
 								<view class="input-icon s-left">
@@ -36,9 +36,9 @@
 						
 						<swiper class="swiper-tj" :circular='false' 
 						indicator-active-color='#FF7F00' indicator-color='#FDC583'
-						:indicator-dots="false" 
+						:indicator-dots="false" :current='BanenerCurrent' @change="onSwiperChange"
 						:autoplay="true" :interval="3000" :duration="300">
-							<swiper-item v-for="(item,i) in 4" :key="i">
+							<swiper-item v-for="(item,i) in 4" :key="i" @click="toShop(item)">
 								<view class="swiper-item display-flex">
 									<image class="left-img" src="@/static/img/my/bg.png" mode="scaleToFill"></image>
 									<view class="right-box flex-1">
@@ -49,7 +49,7 @@
 										<view class="align-items-center mb-12">
 											<image class="img-x mr-12" src="@/static/img/my/wdpj.png" mode=""></image>
 											<view class="fs-26 fw-600 fc-FF7F00 mr-12">4.5分</view>
-											<view class="fc-6 fs-24 mr-12">| 预计38分钟 |</view>
+											<view class="fc-6 fs-24 mr-12">| 预计{{BanenerCurrent}}分钟 |</view>
 											<view class="fc-6 fs-24 mr-12">855人购买</view>
 										</view>
 										<view class="align-items-center flex-wrap-wrap">
@@ -62,6 +62,9 @@
 								</view>
 							</swiper-item>
 						</swiper>
+						<view class="align-items-center dot-f">
+							<view :class="BanenerCurrent === i?'dot-box-s':'dot-box'" v-for="(item,i) in 4" :key="i"></view>
+						</view>
 					</view>
 				</view>
 				
@@ -120,9 +123,12 @@
 </template>
 
 <script>
+	import tools from "@/service/tools";
 	export default {
 		data(){
 			return{
+				bgckgroundBox:'transparent',
+				BanenerCurrent:0,
 				search:'',
 				isScroll:false,
 				navList:[{name:"汉堡薯条",img:require('@/static/img/index/index-wm.png')},
@@ -140,6 +146,12 @@
 			
 		},
 		methods:{
+			toBack(){
+				tools.leftClick()
+			},
+			onSwiperChange(e){
+				this.BanenerCurrent = e.detail.current;
+			},
 			scrollFun(e){
 				if(e.target.scrollTop>50){
 					this.isScroll = true;
@@ -150,7 +162,11 @@
 			scrolltolower(){
 				console.log('触底');
 			},
-			
+			toShop(item){
+				uni.navigateTo({
+					url:'/pages-takeout/shop'
+				})
+			},
 		},
 	}
 </script>
@@ -245,6 +261,25 @@
 					}
 				}
 			}
+			.dot-f{
+				margin: 20rpx auto;
+				justify-content: center;
+				.dot-box{
+					width: 8rpx;
+					height: 6rpx;
+					background: #FEC683;
+					border-radius: 200rpx;
+					margin: 0 6rpx;
+				}
+				.dot-box-s{
+					width: 16rpx;
+					height: 6rpx;
+					background: #FF7F00;
+					border-radius: 200rpx;
+					margin: 0 6rpx;
+				}
+			}
+			
 		}
 		
 		.nav-bg{

pages.json

@@ -86,6 +86,25 @@
 					"style": {
 						"navigationBarTitleText": "外卖"
 					}
+				},
+				{
+					"path": "replace-take",
+					"style": {
+						"navigationBarTitleText": "代取"
+					}
+				},
+				{
+					"path": "shop",
+					"style": {
+						"navigationBarTitleText": "店铺"
+					}
+				},
+				{
+				
+					"path": "aptitude",
+					"style": {
+						"navigationBarTitleText": "资质"
+					}
 				}
 			]
 		},

pages/index/index.vue

@@ -136,7 +136,7 @@
 				bgckgroundType:'',
 				navList:[
 					{name:"外卖",img:require('@/static/img/index/index-wm.png'),type:2},
-					{name:"代取",img:require('@/static/img/index/index-dq.png'),},
+					{name:"代取",img:require('@/static/img/index/index-dq.png'),type:3},
 					{name:"校友圈",img:require('@/static/img/index/index-xyq.png'),},
 					{name:"团购",img:require('@/static/img/index/index-tg.png'),},
 					{name:"票务",img:require('@/static/img/index/index-pw.png'),},
@@ -204,6 +204,11 @@
 					uni.navigateTo({
 						url:'/pages-takeout/takeout'
 					})
+				}else if(type === 3){
+					// 去外卖
+					uni.navigateTo({
+						url:'/pages-takeout/replace-take'
+					})
 				}
 			}
 		},

service/tools.js

@@ -16,6 +16,21 @@ tools.sortNumber = function (a, b) {
     return a - b;
 }
 
+// 查看大图
+tools.lookBigImg = function(i,value){
+	let list = []
+	if(typeof(value) === 'string'){
+		list.push(value)
+	}else{
+		list = value
+	}
+	uni.previewImage({
+		current:i,
+		urls:list,
+		loop:true,
+	})
+}
+
 
 //邮箱/手机***过滤
 tools.starPhone = function(value, type) {
@@ -58,9 +73,13 @@ tools.formatDecimal = function (num, decimal) {
  * @param msg
  */
 tools.error = function (msg) {
+	let type = 'error'
+	if(msg.length > 7){
+		type = 'none'
+	}
     uni.showToast({
         'title': msg,
-        'icon': 'error',
+        'icon': type,
         'mask': true,
         'duration': 1500
     })