diff --git a/App.vue b/App.vue
index 48bb5c7..0181ccc 100644
--- a/App.vue
+++ b/App.vue
@@ -31,7 +31,6 @@
 				})
 			}
 			// #endif
-
 			this.initLog({
 				mch_id: 0
 			}) // 访问记录
@@ -39,7 +38,10 @@
 			setHeaderHeight();
 		},
 		onShow(options) {
-			
+			uni.hideTabBar()
+		},
+		onLoad() {
+			uni.hideTabBar()
 		},
 		onHide() {
 			// console.log("App Hide");
diff --git a/api/modules/common.js b/api/modules/common.js
index 65fe454..d4e743e 100644
--- a/api/modules/common.js
+++ b/api/modules/common.js
@@ -143,7 +143,7 @@ export default {
 			needLogin: true,
 		});
 	},
-	
+
 	wechatPageH5(data) {
 		return request({
 			url: "/common/wechatPageH5",
@@ -152,7 +152,7 @@ export default {
 			needLogin: true,
 		});
 	},
-	
+
 	aliH5(data) {
 		return request({
 			url: "/common/aliH5",
@@ -170,7 +170,7 @@ export default {
 			needLogin: true,
 		});
 	},
-	
+
 	getFlashMch(data) {
 		return request({
 			url: "/common/FlashListMch",
@@ -187,7 +187,7 @@ export default {
 			needLogin: true,
 		});
 	},
-	
+
 	getAliCard(data = {}) {
 		return request({
 			url: "/common/getAliCard",
@@ -196,4 +196,70 @@ export default {
 			needLogin: true,
 		});
 	},
+
+
+	getFootCat(data) {
+		return request({
+			url: "/common/getFootCat",
+			method: "GET",
+			data,
+			needLogin: true,
+		});
+	},
+	getFootGoods(data) {
+		return request({
+			url: "/common/getFootGoods",
+			method: "GET",
+			data,
+			needLogin: true,
+		});
+	},
+	goodsInfo(data) {
+		return request({
+			url: "/goods/goodsInfo",
+			method: "POST",
+			data,
+		});
+	},
+
+	getIsBusinessHours(data) {
+		return request({
+			url: "/common/getIsBusinessHours",
+			method: "POST",
+			data,
+			needLogin: true,
+		});
+	},
+	DiningRoom(data) {
+		return request({
+			url: "/goodFood/DiningRoom",
+			method: "POST",
+			data,
+			needLogin: true,
+		});
+	},
+	FoodOrderPreview(data) {
+		return request({
+			url: "/order/FoodOrderPreview",
+			method: "GET",
+			data,
+			needLogin: true,
+		});
+	},
+	FoodPlaceOrder(data) {
+		return request({
+			url: "/order/FoodPlaceOrder",
+			method: "POST",
+			data,
+			needLogin: true,
+		});
+	},
+	getFootOrder(data = {}) {
+		return request({
+			url: "/common/getFootOrder",
+			method: "POST",
+			data,
+			needLogin: true,
+		});
+	},
 };
\ No newline at end of file
diff --git a/api/modules/user.js b/api/modules/user.js
index 49ab90e..3d80070 100644
--- a/api/modules/user.js
+++ b/api/modules/user.js
@@ -11,6 +11,13 @@ export default {
 			data,
 		});
 	},
+	wxH5Login(data) {
+		return request({
+			url: "/auth/wxH5Login",
+			method: "POST",
+			data,
+		});
+	},
 	// 手机号注册
 	regPhone(data) {
 		return request({
diff --git a/components/login/logins.vue b/components/login/logins.vue
index 7d1a199..aa1d52a 100644
--- a/components/login/logins.vue
+++ b/components/login/logins.vue
@@ -41,15 +41,23 @@
 				// #ifdef H5
 				// 如果是支付宝h5自动完成登陆
 				if (this.type == 0) {
-					if (this.$utils.isInAliBrowser() || this.$utils.isInWeChatBrowser()) {
-						this.login()
-					}
+					this.h5IsLogin()
 				}
 				// #endif
 			}
 			
 		},
 		methods: {
+			async h5IsLogin() {
+				if (this.$utils.isInAliBrowser() || this.$utils.isInWeChatBrowser()) {
+					const res = await this.$api.user.isLogin();
+					if (res.data.is_login > 0) {
+						this.$emit('isLogin')
+					} else {
+						this.login()
+					}
+				}
+			},
 			async login({
 				phone_code
 			} = {}) {
@@ -120,8 +128,8 @@
 					var fruits = redirect_uri.split("?");
 					// console.log(fruits, 'fruits')
 					redirect_uri = encodeURIComponent(fruits[0]);
-					// 构建微信授权链接，包含应用的appid、重定向地址等参数
-					// const wxAuthUrl = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect`;
+					
+					// 构建微信授权链接，包含应用的appid、重定向地址等参数;
 					const wxAuthUrl = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_base&state=STATE&component_appid=${component_appid}#wechat_redirect`
 					// 通过重定向将用户导向微信授权页面
 					window.location.href = wxAuthUrl;
diff --git a/components/login/logins11.vue b/components/login/logins11.vue
new file mode 100644
index 0000000..e315e6e
--- /dev/null
+++ b/components/login/logins11.vue
@@ -0,0 +1,207 @@
+<template>
+	<view>
+		<loginPage v-if="type == 1" @goLogin="goLogin" @backPage="backPage"></loginPage>
+		<loginPopup v-if="type == 2" :show='show' @loginShow="loginShow" @empower="empower" @goLogin="goLogin">
+		</loginPopup>
+	</view>
+</template>
+
+<script>
+	import loginPopup from './loginPopup.vue'
+	import loginPage from './loginPage.vue'
+	// #ifdef H5
+	import ap from "@/uni_modules/alipayjsapi/alipayjsapi.js"
+	// #endif
+	export default {
+		name: "login",
+		components: {
+			loginPopup,
+			loginPage
+		},
+		data() {
+			return {
+				title: "Hello",
+				disabled: false,
+				show: false
+			};
+		},
+		props: {
+			type: Number,
+			// show: Boolean,
+			wcCode: String,
+		},
+		created() {
+			if (this.wcCode) {
+				this.actionLogin(this.wcCode, '', 1);
+			} else {
+				// 验证是否需要登录
+				if (this.type == 2) {
+					this.isLogin()
+				}
+				// #ifdef H5
+				// 如果是支付宝h5自动完成登陆
+				if (this.type == 0) {
+					if (this.$utils.isInAliBrowser() || this.$utils.isInWeChatBrowser()) {
+						this.login()
+					}
+				}
+				// #endif
+			}
+			
+		},
+		methods: {
+			async login({
+				phone_code
+			} = {}) {
+				this.disabled = true;
+				let that = this
+				// #ifdef MP-WEIXIN 
+				uni.login({
+					provider: "weixin", //使用微信登录
+					// onlyAuthorize: '',
+					success: (loginRes) => {
+						this.actionLogin(loginRes.code, phone_code);
+					},
+					fail: (res) => {
+						uni.$u.toast(res.errMsg);
+						this.disabled = false;
+					},
+				});
+				// #endif
+
+				// #ifdef MP-ALIPAY
+				my.getAuthCode({
+					scopes: 'auth_user',
+					success: (loginRes) => {
+						if (loginRes.authCode) {
+							this.actionLogin(loginRes.authCode);
+						} else {
+							// uni.$u.toast(loginRes.errMsg ? loginRes.errMsg : '登录失败');
+						}
+					},
+					fail: (res) => {
+						uni.$u.toast(res.errMsg);
+						this.disabled = false;
+					},
+				});
+				// #endif
+
+				//#ifdef H5
+				// 支付宝h5登陆
+				if (this.$utils.isInAliBrowser()) {
+					const res = await this.$api.common.aliH5();
+					// 获取微信应用的 appid
+					const appid = res.data.appid;
+					ap.getAuthCode({
+						appId: appid,
+						scopes: ['auth_base'],
+					}, function(res) {
+						console.log(res, 'resresres')
+						if (res.authCode) {
+							that.actionLogin(res.authCode, '', 2);
+						} else {
+							uni.showToast({
+								icon: 'none',
+								title: res.errorDesc || res.errorMessage
+							})
+						}
+					});
+					return;
+
+				} else if (this.$utils.isInWeChatBrowser()) {
+					let redirect_uri = window.location.href;
+					var fruits = redirect_uri.split("?");
+					redirect_uri = encodeURIComponent(fruits[0]);
+					const res = await this.$api.user.wxH5Login({
+						redirect_uri
+					});
+					console.log(res,'res')
+					
+					return;
+				} else {
+					return;
+				}
+				//#endif
+
+			},
+			// 验证是否已经登陆
+			async isLogin() {
+				const res = await this.$api.user.isLogin();
+				if (res.data.is_login > 0) {
+					this.$emit('isLogin')
+				} else {
+					this.show = true;
+				}
+			},
+			async actionLogin(code, phone_code = "", origin_h5 = 0) {
+				const foke_parent_user = uni.getStorageSync('distributor_id') || 0
+				try {
+					const res = await this.$api.user.login({
+						code,
+						foke_parent_user,
+						phone_code,
+						origin_h5
+					});
+					uni.hideLoading();
+					if (!res.code) {
+						let {
+							token,
+							user_info,
+							store_id
+						} = res.data;
+						uni.setStorageSync("token_" + store_id, token);
+						uni.setStorageSync("user_info", user_info);
+						if (this.type != 0) {
+							uni.showToast({
+								icon: "none",
+								title: "登录成功",
+							});
+						}
+						foke_parent_user && this.initDistributor(foke_parent_user)
+						this.backPage()
+						return;
+					}
+					uni.$u.toast(res.message);
+				} catch (e) {
+					uni.hideLoading();
+					throw new Error(e);
+				}
+				this.disabled = false;
+			},
+			loginShow(e) {
+				// this.$emit('loginShow', e);
+				this.show = e
+			},
+			empower(e) {
+				this.login()
+			},
+			goLogin(e, params) {
+				this.login(params)
+			},
+
+			backPage() {
+				if (this.type == 0) {
+					this.$emit('isLogin')
+				} else if (this.type != 2) {
+					setTimeout(() => {
+						const backPage = uni.getStorageSync("backPage")
+						if (backPage) {
+							if (backPage.includes('login/login')) {
+								this.$utils.toUrl("/pages/index/index", "redirectTo");
+							} else {
+								this.$utils.toUrl(backPage);
+							}
+						} else {
+							this.$utils.toUrl("/pages/index/index", "redirectTo");
+						}
+						// this.$emit('loginShow', false);
+					}, 200);
+				} else {
+					this.$emit('isLogin')
+					this.loginShow(false)
+				}
+
+			}
+		},
+	};
+</script>
\ No newline at end of file
diff --git a/components/the/keyword.vue b/components/the/keyword.vue
new file mode 100644
index 0000000..f34b399
--- /dev/null
+++ b/components/the/keyword.vue
@@ -0,0 +1,119 @@
+<template>
+	<view>
+		<view style="padding: 10rpx 20rpx;background: #F0F0F0;display: flex;flex-wrap: wrap;">
+			<view class="btn-box">
+				<view class="click-effect btn-item" @click="btnClick(1)">1</view>
+			</view>
+			<view class="btn-box">
+				<view class="click-effect btn-item" @click="btnClick(2)">2</view>
+			</view>
+			<view class="btn-box">
+				<view class="click-effect btn-item" @click="btnClick(3)">3</view>
+			</view>
+			<view class="btn-box">
+				<view class="click-effect btn-item" @click="btnClick(4)">4</view>
+			</view>
+			<view class="btn-box">
+				<view class="click-effect btn-item" @click="btnClick(5)">5</view>
+			</view>
+			<view class="btn-box">
+				<view class="click-effect btn-item" @click="btnClick(6)">6</view>
+			</view>
+			<view class="btn-box">
+				<view class="click-effect btn-item" @click="btnClick(7)">7</view>
+			</view>
+			<view class="btn-box">
+				<view class="click-effect btn-item" @click="btnClick(8)">8</view>
+			</view>
+			<view class="btn-box">
+				<view class="click-effect btn-item" @click="btnClick(9)">9</view>
+			</view>
+			<view class="btn-box">
+				<view class="click-effect btn-item" @click="btnClick('.')">.</view>
+			</view>
+			<view class="btn-box">
+				<view class="click-effect btn-item" @click="btnClick(0)">0</view>
+			</view>
+			<view class="btn-box">
+				<view class="click-effect btn-item" @click="backspace"  style="background: #ccc;">
+					<u-icon name="backspace" color="#333" size="70rpx"></u-icon>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+
+export default {
+	name: 'keyword',
+	components: {},
+	data() {
+		return {
+			
+		};
+	},
+	computed: {
+		
+	},
+	created() {
+		
+	},
+	methods: {
+		btnClick(e) {
+			this.$emit('change', e)
+		},
+		backspace() {
+			this.$emit('backspace')
+		}
+	},
+	onReachBottom() { },
+	onPullDownRefresh() { },
+}
+</script>
+
+<style scoped lang="scss">
+.btn-box {
+		width: 33.33%;
+		padding: 10rpx;
+	}
+	.btn-item {
+		background: #FFF;
+		line-height: 110rpx;
+		height: 110rpx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		font-size: 46rpx;
+		text-align: center;
+		font-weight: bold;
+		box-sizing: border-box;
+		border-radius: 10rpx;
+	}
+
+	.click-effect {
+		position: relative;
+		overflow: hidden;
+	}
+
+	.click-effect:after {
+		content: "";
+		position: absolute;
+		top: 50%;
+		left: 50%;
+		width: 100px;
+		height: 100px;
+		background-color: rgba(0, 0, 0, 0.1);
+		border-radius: 50%;
+		transform: translate(-50%, -50%);
+		opacity: 0;
+		transition: transform 0.15s, opacity 0.15s, background-color 0.15s;
+	}
+
+	.click-effect:active:after {
+		opacity: 1;
+		transform: translate(-50%, -50%) scale(2);
+		background-color: rgba(0, 0, 0, 0.2);
+	}
+
+</style>
diff --git a/pages.json b/pages.json
index 1d66cd4..561dbd3 100644
--- a/pages.json
+++ b/pages.json
@@ -47,6 +47,24 @@
 					"titlePenetrate": "YES"
 				}
 			}
+		},
+		{
+			"path": "pages/takeaway/index",
+			"style": {
+				"navigationBarTitleText": "点餐"
+			}
+		},
+		{
+			"path": "pages/takeaway/orderAndSettlement/index",
+			"style": {
+				"navigationBarTitleText": "点餐"
+			}
+		},
+		{
+			"path": "pages/takeaway/orderAndSettlement/edit",
+			"style": {
+				"navigationBarTitleText": "点餐"
+			}
 		}
 	],
 	"subPackages": [
@@ -120,6 +138,7 @@
 		"selectedColor": "#E2231A",
 		"borderStyle": "black",
 		"backgroundColor": "#fff",
+		"height": "0px",
 		"list": [
 			{
 				"pagePath": "pages/index/index",
diff --git a/pages/takeaway/compontents/goods.vue b/pages/takeaway/compontents/goods.vue
new file mode 100644
index 0000000..b472a4b
--- /dev/null
+++ b/pages/takeaway/compontents/goods.vue
@@ -0,0 +1,77 @@
+<template>
+	<view>
+		<u-popup :show="show" @close="close" mode="center" round="20rpx" :closeable="true">
+			<view style="width: 600rpx;height: 60vh;background: #FFF;border-radius: 20rpx;overflow: hidden;overflow-y: scroll;">
+				<view v-if="goods && goods.id > 0">
+					<pageBanner :goods="goods"></pageBanner>
+					<pageInfo :goods="goods"></pageInfo>
+					<view class="Pbox" style="margin-top: 20rpx;">
+						<pageDetail v-if="goods" class="mb" :goods="goods"></pageDetail>
+					</view>
+				</view>
+				<view v-else style="display: flex;align-items: center;justify-content: center;height: 100%;">
+					<u-loading-icon></u-loading-icon>
+				</view>
+			</view>
+		</u-popup>
+	</view>
+</template>
+
+<script>
+	import pageBanner from "./page-banner";
+	import pageInfo from "./page-info.vue";
+	import pageDetail from "./page-detail";
+	export default {
+		props: {
+			goods_id: {
+				type: Number,
+				default: 0
+			}
+		},
+		components: {
+			pageBanner,
+			pageInfo,
+			pageDetail
+		},
+		data() {
+			return {
+				goods: null,
+				show: true
+			}
+		},
+		watch: {
+			
+		},
+		computed: {
+			
+		},
+		created() {
+			this.getGoods()
+		},
+		methods: {
+			close() {
+				this.$emit('close')
+			},
+			// 选择规格
+			async getGoods() {
+				this.goods = {};
+				const res = await this.$api.common.goodsInfo({
+					id: this.goods_id
+				});
+				if (res.code == 0) {
+					this.goods = res.data
+				} else {
+					uni.showToast({
+						icon: 'none',
+						title: res.msg
+					})
+				}
+				
+			},
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	
+</style>
\ No newline at end of file
diff --git a/pages/takeaway/compontents/page-banner.vue b/pages/takeaway/compontents/page-banner.vue
new file mode 100644
index 0000000..88fb63a
--- /dev/null
+++ b/pages/takeaway/compontents/page-banner.vue
@@ -0,0 +1,188 @@
+<template>
+	<view class="banner" v-if="goods && goods.goods_pic && goods.goods_pic.length">
+		<swiper :current="current" :indicator-dots="false" @change="(e) => (current = e.detail.current)">
+			<template v-if="goods.video_url">
+				<swiper-item>
+					<video id="myVideo" :autoplay="true" :muted="true" :show-mute-btn="true" class="banner-image" :src="goods.video_url"></video>
+				</swiper-item>
+			</template>
+			<swiper-item v-for="(item, index) of goods.goods_pic" :key="index">
+				<image class="banner-image" :src="item.pic_url" mode="aspectFill"></image>
+			</swiper-item>
+		</swiper>
+		<div class="banner-info-1" :class="goods.video_url && current == 0 ? 'banner-info-top' : 'banner-info-2'">
+			<view>
+				<template v-if="goods.video_url">
+					<view @click="current = 0" class="banner-item" :class="current > 0 ? '' : 'active-banner'">
+						视频
+					</view>
+					<view @click="current = 1" class="banner-item" :class="current > 0 ? 'active-banner' : ''">
+						图集
+						<template v-if="current > 0">
+							{{ current }}/{{ goods.goods_pic && goods.goods_pic.length }}
+						</template>
+					</view>
+				</template>
+				<template v-else>
+					<view class="banner-item active-banner">
+						图集 {{ current + 1 }}/{{ goods.goods_pic && goods.goods_pic.length }}
+					</view>
+				</template>
+				
+			</view>
+		</div>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: ["goods"],
+
+		data: () => {
+			return {
+				current: 0,
+				videoContext: null
+			}
+		},
+		computed: {
+			getPrice() {
+				return (price = "0.00") => {
+					return price.split(".");
+				};
+			}
+		},
+		created() {
+			// setTimeout(() => {
+			// 	this.videoContext = uni.createVideoContext('myVideo')
+			// }, 500)
+		},
+		watch: {
+			// current(value) {
+			// 	let videoContext = uni.createVideoContext('myVideo')
+			// 	console.log(videoContext, 'videoContext')
+			// 	videoContext.pause()
+			// }
+		},
+		methods: {
+			previewPics(current) {
+				let urls = this.goods.goods_pic.map((el) => el.pic_url);
+				uni.previewImage({
+					current,
+					urls,
+				});
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.banner {
+		position: relative;
+	}
+
+	swiper,
+	swiper-item,
+	.banner-image {
+		height: 500rpx;
+		width: 100%;
+	}
+
+	.banner-image {
+		display: block;
+	}
+	.banner-info-1 {
+		
+	}
+	.banner-info-2 {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		position: absolute;
+		right: 0;
+		left: 0;
+		bottom: 20rpx;
+	}
+	.banner-info-top {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		position: absolute;
+		right: 0;
+		left: 0;
+		top: 20rpx;
+	}
+	.banner-info-1 > view {
+		background: rgba(0, 0, 0, 0.2);
+		border-radius: 20rpx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		.banner-item {
+			padding: 4rpx 20rpx;
+			font-size: 24rpx;
+			color: #fff;
+			display: flex;
+			align-items: center;
+			border-radius: 30rpx;
+		}
+		.active-banner {
+			background: rgba(0, 0, 0, 0.4);
+		}
+	}
+	.banner-info {
+		position: absolute;
+		right: 0;
+		left: 0;
+		margin: 0 auto;
+		bottom: 20rpx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 220rpx;
+		height: 38rpx;
+		background: rgba(0, 0, 0, 0.2);
+		border-radius: 32px;
+		color: #fff;
+		font-size: 24rpx;
+		display: flex;
+		align-items: center;
+	}
+
+	.banner-num {
+		bottom: 34rpx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 126rpx;
+		height: 38rpx;
+		background: rgba(0, 0, 0, 0.5);
+		border-radius: 32px;
+		color: #fff;
+		font-size: 22rpx;
+		margin-right: auto;
+	}
+
+	.banner-det {
+		padding-right: 15rpx;
+		font-size: 22rpx;
+		display: flex;
+		align-items: center;
+	}
+
+	// .banner-det {
+	//   position: absolute;
+	//   right: 0;
+	//   left: 0;
+	//   margin: 0 auto;
+	//   bottom: 34rpx;
+	//   display: flex;
+	//   align-items: center;
+	//   justify-content: center;
+	//   width: 252rpx;
+	//   height: 38rpx;
+	//   background: rgba(0, 0, 0, 0.3);
+	//   border-radius: 32px;
+	//   color: #fff;
+	//   font-size: 24rpx;
+	// }
+</style>
\ No newline at end of file
diff --git a/pages/takeaway/compontents/page-detail.vue b/pages/takeaway/compontents/page-detail.vue
new file mode 100644
index 0000000..97d4535
--- /dev/null
+++ b/pages/takeaway/compontents/page-detail.vue
@@ -0,0 +1,94 @@
+<template>
+	<view class="details">
+		<!-- <view class="title">
+			<view class="line"></view>
+			<view class="con">详情</view>
+			<view class="line"></view>
+		</view> -->
+		<u-transition show>
+			<u-parse :content="detail"></u-parse>
+		</u-transition>
+		<!-- #ifdef MP-ALIPAY -->
+		<view class="line-box"></view>
+		<!-- #endif -->
+	</view>
+</template>
+
+<script>
+	export default {
+		props: ["goods"],
+
+		data() {
+			return {
+				detail: ""
+			}
+		},
+
+		mounted() {
+			this.detail = this.getDetail()
+		},
+
+		methods: {
+			getDetail() {
+				return this.formatRichText(this.goods.detail || "");
+			},
+			formatRichText: (html) => {
+				let newContent = html.replace(/<img[^>]*>/gi, function(match, capture) {
+					match = match
+						.replace(/style="[^"]+"/gi, "")
+						.replace(/style='[^']+'/gi, "");
+					match = match
+						.replace(/width="[^"]+"/gi, "")
+						.replace(/width='[^']+'/gi, "");
+					match = match
+						.replace(/height="[^"]+"/gi, "")
+						.replace(/height='[^']+'/gi, "");
+					return match;
+				});
+				newContent = newContent.replace(
+					/style="[^"]+"/gi,
+					function(match, capture) {
+						match = match
+							.replace(/width:[^;]+;/gi, "max-width:100%;")
+							.replace(/width:[^;]+;/gi, "max-width:100%;");
+						return match;
+					}
+				);
+				newContent = newContent.replace(/<br[^>]*\/>/gi, "");
+				newContent = newContent.replace(
+					/\<img/gi,
+					'<img style="display:block;max-width:100%;height:auto"'
+				);
+				return newContent;
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.details {
+		.title {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			height: 90rpx;
+			background: #f6f6f6;
+		}
+
+		.con {
+			position: relative;
+			padding: 0 30rpx;
+			font-size: 28rpx;
+		}
+
+		.line {
+			width: 48rpx;
+			height: 2rpx;
+			background: #cecece;
+		}
+
+		.line-box {
+			height: 40rpx;
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/pages/takeaway/compontents/page-info.vue b/pages/takeaway/compontents/page-info.vue
new file mode 100644
index 0000000..692b9d0
--- /dev/null
+++ b/pages/takeaway/compontents/page-info.vue
@@ -0,0 +1,279 @@
+<template>
+	<view class="product-info" v-if="goods">
+		<view class="price">
+			<view class="price-left">
+				<view style="display: flex;align-items: center;justify-content: space-between;">
+					<view class="active">
+						<template v-if="!goods.use_sku || goods.price_min == goods.price_max">
+							<view>¥</view>
+							<view v-for="(item, index) of getPrice(goods.price_min)" :class="!index ? 's2' : ''"
+								:key="index">{{
+	index ? "." + item : item }}</view>
+	
+						</template>
+						<template v-else>
+							<view class="flex">
+								<view>¥</view>
+								<view v-for="(item, index) of getPrice(goods.price_min)" :class="!index ? 's2' : ''"
+									:key="index">{{
+	  index ? "." + item : item }}</view>
+							</view>
+							<view class="flex">-</view>
+							<view class="flex">
+								<view v-for="(item, index) of getPrice(goods.price_max)" :class="!index ? 's2' : ''"
+									:key="index">{{
+	  index ? "." + item : item }}</view>
+							</view>
+						</template>
+					</view>
+					<view style="font-size: 24rpx;color: #999;margin-top: 16rpx;display: flex;">
+						<view style="text-decoration: line-through;margin-right: 30rpx;">
+							<template v-if="goods.original_price > 0">
+								￥{{ goods.original_price }}
+							</template>
+						</view>
+						<view>
+							已售：{{ goods.sales }}
+						</view>
+					</view>
+				</view>
+			</view>
+
+		</view>
+		<view class="name">{{ goods.name }}</view>
+		<!-- <view class="page-server_project" v-if="server_project_list">
+			<view class="tag" v-for="tag of server_project_list" :key="tag">
+				<u-icon name="checkmark-circle" size="12" color="#f0250e" top="1"></u-icon>
+				<text class="tagName" style="color: #f0250e;">
+					{{ tag }}
+				</text>
+			</view>
+		</view> -->
+	</view>
+</template>
+
+<script>
+	
+
+	export default {
+		components: {},
+		props: ["goods"],
+
+		computed: {
+			getPrice() {
+				return (price = "0.00") => {
+					return price.split(".");
+				};
+			},
+
+			server_project_list() {
+				return this.goods?.server_project?.split?.(",")
+			}
+		},
+		data() {
+			return {
+				eventDiscount: ''
+			}
+		},
+		methods: {
+			openTheShare() {
+				this.$refs.pageShare.showPop = true
+			},
+			calculateDiscount(_discount) {
+				const discount = _discount
+
+				if (discount == 0) {
+					return "免费";
+				}
+
+				if (discount == 100) {
+					return "0" + " 折";
+				}
+
+				var discountText = discount / 10 + " 折";
+				if (discount % 10 === 0) {
+					discountText = discount / 10 + " 折";
+				} else {
+					discountText = discount / 10 + " 折";
+				}
+
+				return discountText
+			}
+		}
+	}
+</script>
+<style scoped lang="scss">
+	.product-info {
+		padding: 24rpx;
+		background-color: #fff;
+		margin-bottom: 20rpx;
+	}
+
+	.price {
+		display: flex;
+		align-items: flex-start;
+
+		.price-left {
+			padding-right: 10rpx;
+			flex: 1;
+			overflow: hidden;
+			// display: flex;
+			// align-items: flex-end;
+			// line-height: 30rpx;
+
+			.active {
+				display: flex;
+				align-items: flex-end;
+				align-items: center;
+				margin-right: 20rpx;
+				color: #f0250e;
+				font-size: 24rpx;
+				font-weight: bold;
+
+				.s2 {
+					margin-left: 3px;
+					line-height: 1.2;
+					font-size: 38rpx;
+				}
+			}
+
+			.old {
+				position: relative;
+				font-size: 24rpx;
+				color: #8c8c8c;
+
+				&:after {
+					content: "";
+					position: absolute;
+					left: 0;
+					top: 50%;
+					width: 100%;
+					height: 1px;
+					background: #8c8c8c;
+				}
+			}
+		}
+	}
+
+	.memberBox {
+		font-size: 26rpx;
+		font-weight: bold;
+		color: #f74715;
+		line-height: 50rpx;
+		background: linear-gradient(117.64deg, #ff0e87, #ff1e1e 61%, #ff640b), linear-gradient(#820c00, #820c00);
+		color: white;
+		margin: 20rpx -22rpx;
+		padding: 16rpx 20rpx;
+		display: flex;
+		justify-content: space-between;
+		// border-radius: 20rpx;
+		position: relative;
+		overflow: hidden;
+
+
+		.Tvip {
+			position: absolute;
+			top: 0;
+			right: 60rpx;
+			opacity: 0.4;
+			-webkit-transform: scale3d(2.1, 2, 8.2) rotate(-24deg);
+		}
+
+	}
+
+	.name {
+		padding-top: 10rpx;
+		font-size: 34rpx;
+		color: #262626;
+		line-height: 1.5;
+		font-weight: bold;
+	}
+
+	.flex {
+		display: flex;
+		align-items: flex-end;
+	}
+
+	.page-server_project {
+		display: flex;
+		align-items: center;
+		flex-wrap: wrap;
+		background-color: white;
+		margin-top: 12rpx;
+
+		.tag {
+			display: flex;
+			align-items: center;
+			margin-right: 12rpx;
+			margin-bottom: 12rpx;
+			font-size: 12px;
+
+			.tagName {
+				padding-left: 6rpx;
+				font-size: 12px;
+				color: #8c8c8c;
+			}
+		}
+	}
+
+	.tags {
+		display: flex;
+		flex-wrap: wrap;
+
+		margin: 10rpx 0;
+	}
+
+	.afterTheDiscount {
+		display: inline-flex;
+		color: #8c8c8c;
+		font-size: 22rpx;
+	}
+
+	.share {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+
+		position: relative;
+
+		.buttonShare {
+			position: absolute;
+			top: 0;
+			bottom: 0;
+			right: 0;
+			left: 0;
+		}
+
+		button {
+			color: inherit !important;
+			text-decoration: none !important;
+			outline: none !important;
+			border: none !important;
+		}
+
+		button {
+			color: inherit !important;
+			text-decoration: none !important;
+		}
+
+		button:link,
+		button:visited {
+			color: inherit !important;
+			text-decoration: none !important;
+		}
+
+		button,
+		button:hover,
+		button:active,
+		button:visited,
+		button:link,
+		button:focus {
+			-webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
+			-webkit-tap-highlight-color: transparent !important;
+			outline: none !important;
+			background: none !important;
+			text-decoration: none !important;
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/pages/takeaway/compontents/page-sku.vue b/pages/takeaway/compontents/page-sku.vue
new file mode 100644
index 0000000..b509d61
--- /dev/null
+++ b/pages/takeaway/compontents/page-sku.vue
@@ -0,0 +1,547 @@
+<template>
+	<uni-popup v-if="goods.goods_sku && goods.goods_sku.length > 1" style="z-index: 1004;" z-index="1004" ref="popup" closeable type="bottom">
+		<view class="goodsPop">
+			<view @click="$refs.popup.close()" class="close">
+				<u-icon size="14" color="#9b9b9b" name="close"></u-icon>
+			</view>
+			<view class="info">
+				<view class="img">
+					<u-image radius="10" class="img" :src="getGoodsInfo.pic_url ? getGoodsInfo.pic_url : goods.pic_url"
+						width="200rpx" height="200rpx"></u-image>
+				</view>
+				<view class="txt">
+					<view class="subTitle"> {{ goods.name || "" }}</view>
+					<view class="g-price">
+						<view>¥</view>
+						<view class="fwb">{{ getPrice(getGoodsInfo.price_max)[0] }}</view>
+						<view>.{{ getPrice(getGoodsInfo.price_max)[1] }}</view>
+					</view>
+					<view class="current" v-if="getGoodsInfo.attr_name">{{
+						getGoodsInfo.attr_name
+					}}</view>
+				</view>
+			</view>
+			<scroll-view scroll-y class="scroll">
+				<view v-for="(item, index) of skuPopData.new_sku_group" :key="item.id">
+					<view class="m-tit">{{ item.name }}</view>
+					<view class="skuList">
+						<view @click="checked(item, index, e, i)" :class="[
+							'item',
+							e.disabled ? 'disabled' : '',
+							skuPopData.subIndex[index] == i ? 'checked' : '',
+							!e.isShow ? 'disabled' : '',
+						]" v-for="(e, i) of item.group_item" :key="e.id">{{ e.name }}</view>
+					</view>
+				</view>
+				<smallMaterial ref="smallMaterial" :smallPrice.sync="smallPrice" :small_goods="goods.small_goods"></smallMaterial>
+			</scroll-view>
+			<view class="number">
+				<view class="m-tit">数量</view>
+				<view class="number-rig">
+					<u-number-box v-model="skuPopData.num" :min="1" :max="getGoodsInfo.stock"></u-number-box>
+				</view>
+			</view>
+			<view class="btn">
+				<view @click="submit">确定</view>
+			</view>
+		</view>
+	</uni-popup>
+</template>
+
+<script>
+import smallMaterial from "./smallMaterial";
+export default {
+	components: { smallMaterial },
+	props: {
+		goods: {
+			type: Object,
+			required: true,
+			default: {
+				goods: {},
+				goods_sku: {}
+			},
+		}
+	},
+	data() {
+		return {
+			skuPopData: {
+				num: 1,
+				type: 1, // 1.加入购物车 0.立即购买
+				showPop: false,
+				skuId: "", //规格id
+				// attr: [],
+				shopItemInfo: {}, //存放要和选中的值进行匹配的数据
+				subIndex: [], //是否选中 因为不确定是多规格还是单规格，所以这里定义数组来判断
+				selectArr: [], //存放被选中的值
+				activeGoodsInfo: null, // 当前选中的规格
+				new_sku_group: [],
+			},
+			smallPrice: 0
+		}
+	},
+	watch: {
+		'goods': {
+			handler(newvalue) {
+				if (newvalue) this.init(newvalue);
+			},
+			deep: true,
+			immediate: true,
+		},
+
+		"getGoodsInfo.stock"() {
+			if (this.getGoodsInfo.stock < this.skuPopData.num) {
+				this.skuPopData.num = 1
+			}
+		},
+
+		"getGoodsInfo.price_max": {
+			handler(newVal) {
+				try {
+					this.$emit("changeCoupon", Number(newVal) + Number(this.smallPrice))
+				} catch (error) {
+					console.log(error);
+				}
+			},
+		},
+		smallPrice(newVal) {
+			try {
+				this.$nextTick(() => {
+					this.$emit("changeCoupon", Number(this.getGoodsInfo.price_max) + Number(newVal))
+				})
+			} catch (error) {
+				console.log(error);
+			}
+		},
+		"skuPopData.showPop"(newVal) {
+			if (newVal) {
+				try {
+					this.$nextTick(() => {
+						this.$emit("changeCoupon", Number(this.getGoodsInfo.price_max) + Number(this.smallPrice))
+					})
+				} catch (error) {
+					console.log(error);
+				}
+			}
+		}
+	},
+	computed: {
+		getPrice: {
+			get() {
+				return (price = "0.00") => {
+					return String((Number(price) + this.smallPrice).toFixed(2)).split(".");
+				};
+			},
+		},
+		getGoodsInfo: {
+			get() {
+				try {
+					// 如果是
+					if (this.goods && !this.skuPopData.activeGoodsInfo) {
+						let {
+							stock,
+							price_max,
+							price_min,
+							use_sku,
+							name,
+							pic_url
+						} =
+							this.goods;
+						return {
+							stock,
+							price_max,
+							price_min,
+							use_sku,
+							pic_url: pic_url[0].pic_url,
+						};
+					}
+					let {
+						stock,
+						attr_list = [],
+						pic_url,
+						price
+					} = this.skuPopData.activeGoodsInfo;
+					return {
+						stock,
+						price_max: price,
+						price_min: price,
+						use_sku: 1,
+						pic_url,
+						attr_name: attr_list.map((el) => el.name).join("-"),
+					};
+				} catch (e) {
+					return {
+						stock: 0,
+						price_max: "0.00",
+						price_min: "0.00",
+						use_sku: 0,
+						name: "",
+						pic_url: "",
+					};
+				}
+			},
+		},
+	},
+	methods: {
+		getInfo(item) {
+			const checked = item.join("_");
+			if (this.skuPopData.shopItemInfo[checked]) {
+				this.skuPopData.skuId = this.skuPopData.shopItemInfo?.[checked]?.attr_list;
+			} else {
+				this.skuPopData.skuId = "";
+			}
+
+			if (this.skuPopData.skuId) {
+				const sku_no = this.skuPopData.skuId.map((el) => el.attr_id).join("_");
+				this.skuPopData.activeGoodsInfo = this.skuPopData.shopItemInfo[sku_no];
+			}
+		},
+		isMay(result) {
+			for (let i in result) {
+				if (result[i] == "") {
+					return true;
+				}
+			}
+			result = result.join("_");
+			if (!this.skuPopData.shopItemInfo[result]) {
+				return false;
+			}
+			
+			// console.log(result);
+			// console.log(this.skuPopData.shopItemInfo);
+			return this.skuPopData.shopItemInfo[result].stock == 0 ? false : true;
+		},
+		checkItem() {
+			const option = JSON.parse(JSON.stringify(this.goods.sku_group));
+			const result = []; // define an array to store selected values
+			for (let i = 0; i < option.length; i++) {
+				result[i] = this.skuPopData.selectArr[i] ? this.skuPopData.selectArr[i] : "";
+			}
+			for (let i = 0; i < option.length; i++) {
+				const last = result[i];
+				for (let k = 0; k < option[i].group_item.length; k++) {
+					result[i] = option[i].group_item[k].id;
+					option[i].group_item[k].isShow = this.isMay(result);
+				}
+				result[i] = last;
+			}
+			this.skuPopData.new_sku_group = [];
+			// assign the original array
+			this.skuPopData.new_sku_group = option;
+			this.getInfo(this.skuPopData.selectArr);
+		},
+		pushData(id, pindex, index, disable, pname, attr_group_id, attr_name) {
+			if (!disable) {
+				return "";
+			}
+			if (this.skuPopData.selectArr[pindex] !== id) {
+				this.$set(this.skuPopData.selectArr, pindex, id);
+				this.$set(this.skuPopData.subIndex, pindex, index);
+				// this.$set(this.skuPopData.attr, pindex, {
+				//   attr_id: id,
+				//   attr_group_id: attr_group_id,
+				//   attr_name: attr_name,
+				//   attr_group_name: pname,
+				// });
+			}
+			this.checkItem();
+		},
+		checked(pItem, pindex, item, index) {
+			let { id: attr_group_id, name: group_name } = pItem;
+			let { id, isShow: disable, name: attr_name } = item;
+
+			this.pushData(id, pindex, index, disable, group_name, attr_group_id, attr_name);
+
+			this.goods.goods_sku.forEach((d) => {
+				if (d.id === attr_group_id) {
+					this.$set(d, 'select_name', attr_name);
+				}
+			});
+		},
+		async init(newvalue = { goods_sku: [] }) {
+			this.skuPopData.skuId = "";
+			this.skuPopData.attr = [];
+			this.skuPopData.shopItemInfo = {};
+			this.skuPopData.subIndex = [];
+			this.skuPopData.selectArr = [];
+			this.skuPopData.activeGoodsInfo = null;
+			if (!newvalue.goods_sku) {
+				return
+			}
+			// 初始化规格数据
+			for (let i of newvalue.goods_sku) {
+				let sp = "";
+				for (let j of i.attr_list) {
+					sp += j.attr_id + "_";
+				}
+				if (sp.length > 0) {
+					sp = sp.substr(0, sp.length - 1);
+				}
+				this.skuPopData.shopItemInfo[sp] = i;
+			}
+
+			if (newvalue.sku_group && newvalue.sku_group.length) {
+				this.skuPopData.selectArr.length = newvalue.sku_group.length;
+				this.skuPopData.subIndex.length = newvalue.sku_group.length;
+				for (let i = 0; i < newvalue.goods_sku.length; i++) {
+					let group = newvalue.goods_sku[i];
+					if (group.stock > 0) {
+						let attrList = group.attr_list;
+						let skuGroup = newvalue.sku_group;
+						for (let attr of attrList) {
+							for (let groups of skuGroup) {
+								if (attr.attr_group_id === groups.id) {
+									let groupItem = groups.group_item.find((item) => item.id === attr.attr_id);
+									let groupItemIndex = groups.group_item.findIndex((item) => item.id === attr.attr_id);
+									if (groupItem) {
+										let groupIndex = skuGroup.indexOf(groups);
+										groupItem.isShow = true
+										this.checked(groups, groupIndex, groupItem, groupItemIndex, 1)
+										break;
+									}
+								}
+							}
+						}
+						break;
+					}
+				}
+			}
+			this.checkItem();
+			await this.$nextTick()
+			if (this.goods.goods_sku && this.goods.goods_sku.length == 1 && this.goods.small_goods.length == 0) {
+				this.submit(1)
+			}
+		},
+		changeNum(num) {
+			let count = 0;
+			if (num <= this.getGoodsInfo.stock) {
+				if (num <= 0) {
+					count = 1;
+				} else {
+					count = num;
+				}
+			} else {
+				count = this.getGoodsInfo.stock;
+			}
+
+			this.skuPopData.num = count;
+		},
+		async addCart(params) {
+			uni.showLoading({
+				title: "请稍等",
+				mask: true,
+			});
+
+			try {
+				const res = await this.$api.goods.cartEdit(params);
+				uni.hideLoading();
+
+				if (res.code) return uni.$u.toast(res.message);
+				uni.$u.toast("操作成功！");
+				this.skuPopData.showPop = false;
+				this.$refs.popup.close()
+			} catch (e) {
+				uni.hideLoading();
+
+				throw new Error(e);
+			}
+		},
+		submit(is_auto = 0) {
+			let {
+				num,
+				activeGoodsInfo,
+				type
+			} = this.skuPopData;
+
+			if (!activeGoodsInfo) return uni.$u.toast("请完善规格！");
+			
+			const [result, judge] = this.$refs?.smallMaterial?.check() || [[], true]
+			
+			if (!judge) {
+				return
+			}
+
+			let {
+				id: goods_sku_id
+			} = activeGoodsInfo,
+				params = {
+					goods_sku_id,
+					num,
+					goods_id: this.goods.id,
+					small_goods: result,
+					small_goods_json: JSON.stringify(result)
+				};
+
+			this.skuPopData.small_goods = result
+			this.skuPopData.small_goods_json = JSON.stringify(result)
+			
+			type = 2
+			switch (type) {
+				case 0:
+					uni.navigateTo({
+						url: "/subPackages/order/preview/index?submit=" +
+							JSON.stringify([{
+								mch_id: this.goods?.mch_id,
+								good_list: [{
+									...params,
+									cart_id: 0
+								}],
+							},]),
+					});
+					break;
+				case 1:
+					this.addCart(params);
+					break;
+				case 2:
+					this.skuPopData.showPop = false;
+					this.$refs.popup?.close()
+					this.skuPopData.goods_sku_id = goods_sku_id;
+					this.skuPopData.goods = this.goods;
+					this.skuPopData.activeGoodsInfo.totalPrice = (Number(this.skuPopData.activeGoodsInfo.price) + this.smallPrice).toFixed(2)
+					this.$emit('skuPopData', this.skuPopData);
+					break;
+			}
+		},
+	}
+}
+
+</script>
+
+<style scoped lang="scss">
+.goodsPop {
+	display: flex;
+	flex-direction: column;
+	padding: 36rpx 36rpx 0;
+	max-height: 90vh;
+	background-color: white;
+	border-radius: 26rpx 26rpx 0 0;
+	position: relative;
+
+	.close {
+		position: absolute;
+		right: 28rpx;
+		top: 28rpx;
+		background-color: #eaeaea;
+		padding: 6rpx;
+		border-radius: 100px;
+	}
+
+	.info {
+		display: flex;
+		align-items: flex-end;
+
+		.txt {
+			flex: 1;
+			padding-left: 20rpx;
+			overflow: hidden;
+			color: #f0250e;
+		}
+
+		.stock {
+			font-size: 22rpx;
+			color: #f0250e;
+		}
+
+		.current {
+			font-size: 22rpx;
+			color: #8c8c8c;
+		}
+	}
+}
+
+.g-price {
+	line-height: 1;
+}
+
+.scroll {
+	flex: 1;
+	overflow-y: auto;
+}
+
+.m-tit {
+	padding: 30rpx 0 0;
+	font-size: 26rpx;
+	font-weight: bold;
+	color: #262626;
+}
+
+.btn {
+	display: flex;
+	margin: 10rpx -11rpx;
+
+	view {
+		overflow: hidden;
+		flex: 1;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		margin: 0 11rpx;
+		height: 76rpx;
+		font-size: 26rpx;
+		color: #fff;
+		font-weight: bold;
+		border-radius: 32px;
+		background: linear-gradient(90deg, #f22407 0%, #f84d17 100%);
+	}
+}
+
+.skuList {
+	display: flex;
+	flex-wrap: wrap;
+
+	.item {
+		position: relative;
+		margin: 24rpx 24rpx 0 0;
+		padding: 14rpx 28rpx;
+		border-radius: 32px;
+		background: #f2f1f2;
+		color: #262626;
+
+		font-size: 14px;
+	}
+
+	.disabled {
+		color: #8c8c8c;
+
+		&:after {
+			content: "";
+			position: absolute;
+			left: 20rpx;
+			top: 50%;
+			right: 20rpx;
+			height: 1px;
+			background: #8c8c8c;
+		}
+	}
+
+	.checked {
+		background: #fbeceb;
+		color: #f0250e;
+	}
+}
+
+.subTitle {
+	font-size: 28rpx;
+	color: #262626;
+	margin-bottom: 20rpx;
+	margin-right: 50rpx;
+}
+
+.number {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	padding: 40rpx 0;
+
+	.m-tit {
+		flex: 1;
+		overflow: hidden;
+		padding: 0;
+	}
+}
+</style>
+
+<style>
+uni-toast {
+	z-index: 999999999999 !important;
+}
+</style>
\ No newline at end of file
diff --git a/pages/takeaway/compontents/smallMaterial.vue b/pages/takeaway/compontents/smallMaterial.vue
new file mode 100644
index 0000000..5a98a0c
--- /dev/null
+++ b/pages/takeaway/compontents/smallMaterial.vue
@@ -0,0 +1,244 @@
+<template>
+	<view>
+		<!-- <view @click="check()">
+            校验
+        </view> -->
+		<view v-for="(item, index) of list" :key="index">
+			<view class="m-tit" :class="{ stars: item.is_nes == 1 }">{{ item.name }}</view>
+			<view class="skuList">
+				<view class="item"
+					:class="{ checked: selectThe[item.id] && selectThe[item.id].includes(JSON.stringify(e)) }"
+					@click="checked(item.id, e, item.is_mul)" v-for="e of item.group">
+					{{ e.name }}
+
+					<view class="price" v-if="e.price">
+						{{ e.price }} 元
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			small_goods: {
+				type: Array,
+				default: () => ([])
+			},
+			smallPrice: {
+				type: Number,
+				default: 0
+			}
+		},
+		data() {
+			return {
+				selectThe: {}
+			}
+		},
+		watch: {
+			selectThe() {
+				this.$emit("update:smallPrice", Object.values(this.selectThe).flat(Infinity).reduce((price, item) => {
+					return price += JSON.parse(item).price
+				}, 0))
+			}
+		},
+		computed: {
+			selectIDS() {
+
+				function fromEntries(entries) {
+					if (!Array.isArray(entries)) {
+						throw new TypeError('Argument should be an array');
+					}
+
+					var result = {};
+
+					for (var i = 0; i < entries.length; i++) {
+						var entry = entries[i];
+
+						if (!Array.isArray(entry) || entry.length !== 2) {
+							throw new TypeError('Each entry should be an array with two elements');
+						}
+
+						var key = entry[0];
+						var value = entry[1];
+
+						result[key] = value;
+					}
+
+					return result;
+				}
+
+				let arr = []
+				arr = fromEntries(Object.entries(this.selectThe).filter(([key, val]) => Boolean(val)))
+
+				return Object.values(arr).map(({
+					id
+				}) => id)
+			},
+			selectPrice() {
+				let price = 0
+
+				for (const smallMaterial of Object.values(this.selectThe)) {
+					if (!smallMaterial) continue
+					price += smallMaterial.price
+				}
+
+				return price
+			},
+			list() {
+				return this.small_goods.map(item => ({
+					...item,
+					group: JSON.parse(item.group)
+				}))
+			},
+			dataMap() {
+				return this.small_goods.reduce((obj, item) => {
+					obj[item.id] = item
+					return obj
+				}, {})
+			},
+			priceAll() {
+				this.$emit("update:smallPrice", Object.values(this.selectThe).flat(Infinity).reduce((price, item) => {
+					return price += JSON.parse(item).price
+				}, 0))
+				return Object.values(this.selectThe).flat(Infinity).reduce((price, item) => {
+					return price += JSON.parse(item).price
+				}, 0)
+			}
+		},
+		methods: {
+			checked(id, e, is_mul) {
+				if (this.selectThe[id] && this.selectThe[id].includes(JSON.stringify(e))) {
+					const index = this.selectThe[id].findIndex(item => item === JSON.stringify(e))
+					this.selectThe[id].splice(index, 1)
+				} else {
+					// 单选
+					if (is_mul != 1) {
+						console.log("单选");
+						this.selectThe[id] = []
+						console.log(this.selectThe[id]);
+					} else {
+						this.selectThe[id] = this.selectThe[id] || []
+					}
+					this.selectThe[id].push(JSON.stringify(e))
+					console.log(this.selectThe[id]);
+				}
+
+				this.selectThe = JSON.parse(JSON.stringify(this.selectThe))
+			},
+			check() {
+				console.log(Object.entries(this.dataMap));
+				for (const [key, val] of Object.entries(this.dataMap)) {
+					if (val.is_nes == 1) {
+						if (Array.isArray(this.selectThe[key])) {
+							if (this.selectThe[key].length === 0) {
+								console.log("请选择" + val.name);
+								uni.$u.toast("请选择" + val.name);
+
+								this.$emit("select", [null, false])
+								return [null, false]
+							}
+						} else {
+							console.log("请选择" + val.name);
+							uni.$u.toast("请选择" + val.name);
+							this.$emit("select", [null, false])
+							return [null, false]
+						}
+					}
+
+				}
+				this.$emit("select", [this.selectThe, false])
+				const result = Object.entries(this.selectThe).reduce((arr, [key, val], index) => {
+					arr[index] = {
+						"id": key,
+						"name": this.dataMap[key].name,
+						"group_item": val.map(item => JSON.parse(item))
+					}
+
+					return arr
+				}, [])
+				return [result, true]
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.m-tit {
+		padding: 30rpx 0 0;
+		font-size: 26rpx;
+		font-weight: bold;
+		color: #262626;
+	}
+
+	.stars {
+		position: relative;
+
+		&::after {
+			content: "*";
+			color: #f0250e;
+
+			padding-left: 4px;
+			position: absolute;
+		}
+	}
+
+	.skuList {
+		display: flex;
+		flex-wrap: wrap;
+
+		.item {
+			position: relative;
+			margin: 24rpx 24rpx 0 0;
+			padding: 14rpx 24rpx;
+
+			border-radius: 100rpx;
+			background: #f2f1f2;
+			color: #262626;
+
+			font-size: 14px;
+
+			display: flex;
+			align-items: center;
+			overflow: hidden;
+
+			.price {
+				// background-color: red;
+				margin-left: 12rpx;
+				border-left: 2px solid #ffffff;
+
+				// margin: -14rpx -18rpx;
+				padding-left: 12rpx;
+
+			}
+		}
+
+		.disabled {
+			color: #8c8c8c;
+
+			&:after {
+				content: "";
+				position: absolute;
+				left: 20rpx;
+				top: 50%;
+				right: 20rpx;
+				height: 1px;
+				background: #8c8c8c;
+			}
+		}
+
+		.checked {
+			background: #fbeceb;
+			color: #f0250e;
+
+			// .price {
+			//     background-color: red;
+			//     padding: 14rpx 28rpx;
+			//     margin-left: 10px;
+			//     color: white;
+			// }
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/pages/takeaway/index.vue b/pages/takeaway/index.vue
new file mode 100644
index 0000000..7d8af7a
--- /dev/null
+++ b/pages/takeaway/index.vue
@@ -0,0 +1,486 @@
+<template>
+	<view>
+		<view style="display: flex;flex-direction: column;height: 100vh;">
+			<view class="hearder-box" style="display: flex;align-items: center;justify-content: space-between;"
+				v-if="mch">
+				<view>
+					<view style="color: #000;font-weight: bold;display: flex;align-items: center;">
+						{{ mch.name }}
+						<u-icon name="arrow-right" color="#262626" size="15"></u-icon>
+					</view>
+					<view style="margin-top: 20rpx;">
+						<u-icon @click="openLocation(mch)" name="map"
+						    :label="mch.detail || mch.name" labelColor="#a8a8a8" color="#a8a8a8" size="12"
+						    label-size="12"></u-icon>
+					</view>
+					<!-- <view style="color: #999;margin-top: 20rpx;font-size: 28rpx;">距离您1km</view>
+					<view>
+						<view style="font-size: 28rpx;color: #999;">
+							营业时间：<text style="color: #333;">10:30-22:40</text>
+						</view>
+					</view> -->
+				</view>
+				<view v-if="table" style="font-size: 36rpx;font-weight: bold;">
+					桌号：{{ table.number }}
+				</view>
+			</view>
+			<view class="content-box" style="overflow: hidden;">
+				<!-- 左侧菜单 -->
+				<view class="left-tab" style="overflow-y: scroll;">
+					<view v-for="(item, index) in cat_list" class="cat-item" @click="cat_index = index"
+						:class="cat_index == index ? 'cat-item-active' : ''">
+						<view v-if="item.pic_url">
+							<image style="width: 60rpx;height: 60rpx;" :src="item.pic_url" mode=""></image>
+						</view>
+						<view>
+							{{ item.name }}
+						</view>
+					</view>
+
+				</view>
+				<!-- 右侧菜单 -->
+				<view class="right-tab" style="display: flex;">
+					<scroll-view scroll-y style="overflow-y: scroll;float: left;width: 100%;flex: 1;">
+						<view style="padding: 20rpx;">
+							<view v-if="cat_list && cat_list.length > 0" style="margin-bottom: 20rpx;">
+								{{ cat_list[cat_index].name }}</view>
+							<view v-for="(item, index) in goods_list" @click="show_goods_id = item.goods_id"
+								style="display: flex;width: 100%;background: #FFF;border-radius: 14rpx;box-shadow: 0px 0px 8rpx 0px rgba(0, 0, 0, 0.1);margin-bottom: 20rpx;overflow: hidden;">
+								<view style="background: #F0F0F0;">
+									<image style="display: block;width: 200rpx;height: 200rpx;"
+										:src="item.goods_info.pic_url" mode="aspectFill"></image>
+								</view>
+								<view
+									style="flex: 1;padding: 10rpx 14rpx;display: flex;flex-direction: column;justify-content: space-between;">
+									<view>
+										<view class="goods_name">{{ item.goods_info.name }}</view>
+										<view style="color: #A16222;font-weight: bold;margin-top: 16rpx;">
+											￥{{ item.goods_info.price_min }}起
+										</view>
+									</view>
+									<view style="display: flex;justify-content: flex-end;">
+										<view @click.stop="chooseSpecifications(item, $event)" :data-index="index">
+											<u-icon name="plus-circle-fill" color="#A16222" size="50rpx"></u-icon>
+										</view>
+									</view>
+								</view>
+							</view>
+							<template v-if="goods_loading == 0">
+								<!-- 加载中 -->
+								<view style="padding: 20rpx;display: flex;align-items: center;justify-content: center;">
+									<u-loading-icon></u-loading-icon>
+								</view>
+							</template>
+							<template v-else>
+								<!-- 加载完毕 -->
+							</template>
+
+						</view>
+					</scroll-view>
+				</view>
+			</view>
+			<view class="bttom-box" v-show="1 || goodsArr.reduce((sum, item) => sum + (item.num - 0), 0) > 0"
+				style="height: 110rpx;background: #EFEFEF;position: relative;">
+				<view
+					style="padding: 0 30rpx;display: flex;align-items: center;justify-content: space-between;position: relative;z-index: 1;height: 100%;border-top: 1rpx solid #eee;background: #EFEFEF;">
+					<view style="display: flex;align-items: center;">
+						<view @click="show_card = !show_card"
+							style="width: 80rpx;height: 80rpx;background: #FFF;border-radius: 50%;display: flex;align-items: center;justify-content: center;position: relative;">
+							<u-icon size="70rpx" name="shopping-cart" color="#A16222"></u-icon>
+							<view
+								style="position: absolute;background: #BD3124;color: #FFF;font-size: 20rpx;line-height: 30rpx;padding: 0 10rpx;border-radius: 15rpx;right: 0;top: 0;">
+								{{ goodsArr.reduce((sum, item) => sum + (item.num - 0), 0) }}
+							</view>
+						</view>
+						<view style="margin-left: 40rpx;color: #000;font-weight: bold;font-size: 40rpx;">
+							<!-- ￥{{ (
+								goodsArr.reduce((sum, item) => sum + (item.activeGoodsInfo.price * item.num - 0), 0)
+							).toFixed(2) }} -->
+							￥{{ totalPrice }}
+						</view>
+					</view>
+					<view @click="toSubmit"
+						style="background: #A16222;color: #FFF;padding: 0 30rpx;line-height: 60rpx;border-radius: 30rpx;">
+						去下单
+					</view>
+				</view>
+				<view style="position: fixed;bottom: 0;top: 0;left: 0;right: 0;background: rgba(0, 0, 0, .2);"
+					@click="show_card = !show_card" v-if="show_card">
+					<view :style="{
+						maxHeight: show_card ? '60vh' : '0'
+					}" style="position: absolute;left: 0;right: 0;bottom: 0;background: #FFF;border-radius: 20rpx 20rpx 0 0;z-index: 0;transition: max-height 0.5s;overflow-y: scroll;">
+						<view
+							style="padding: 20rpx 30rpx;border-bottom: 1rpx solid #F0F0F0;position: sticky;top: 0;z-index: 3;background: #FFF;">
+							购物车({{ goodsArr.reduce((sum, item) => sum + (item.num - 0), 0) }})
+						</view>
+						<view style="padding: 20rpx;flex: 1;overflow-y: scroll;">
+							<view v-for="(item, index) in goodsArr" v-if="item.num > 0"
+								style="display: flex;width: 100%;background: #f7f7f7;border-radius: 14rpx;margin-bottom: 20rpx;overflow: hidden;padding: 16rpx;">
+								<view style="overflow: hidden;">
+									<image style="display: block;width: 140rpx;height: 140rpx;border-radius: 18rpx;"
+										:src="item.goods.pic_url" mode="aspectFill"></image>
+								</view>
+								<view
+									style="flex: 1;padding: 10rpx 14rpx;display: flex;flex-direction: column;justify-content: space-between;">
+									<view>
+										<view class="goods_name" style="-webkit-line-clamp: 1;font-size: 20rpx;">
+											{{ item.goods.name }}</view>
+									</view>
+									<view class="item-desc" style="margin: 10rpx 0;">
+										<view class="goods_sky" style="color: #999;font-size: 24rpx;">
+											<text v-for="(sku, _index) of item.activeGoodsInfo.attr_list" :key="_index">
+												{{ sku.group_name }}：{{ sku.name }}
+											</text>
+										</view>
+									</view>
+									<view style="display: flex;">
+										<view v-for="(small, index) of item.small_goods" :key="index"
+											v-show="small.group_item.length != 0">
+											<view
+												style="display: flex;background: #FFF;margin: 0 10rpx 10rpx 0;font-size: 22rpx;padding: 10rpx 20rpx;flex-wrap: nowrap;align-items: center;border-radius: 10rpx;justify-content: center;"
+												v-for="sitem of small.group_item">
+												<view>
+													{{ sitem.name }}
+												</view>
+												<view v-if="sitem.price" style="color:#BD3124;">
+													{{ sitem.price }} 元
+												</view>
+											</view>
+										</view>
+									</view>
+									<view style="display: flex;justify-content: space-between;align-items: center;">
+										<view style="color: #A16222;font-weight: bold;">
+											￥{{ item.activeGoodsInfo.price }}
+										</view>
+										<u-number-box :min="0" v-model="item.num"></u-number-box>
+									</view>
+								</view>
+							</view>
+						</view>
+						<view class="bttom-box" style="height: 110rpx;width: 100%;"></view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<logins v-if="wcCode != -1" :wcCode="wcCode"
+			:type="$utils.isInAliBrowser() || $utils.isInWeChatBrowser() ? 0 : 2"></logins>
+		<pageSku v-if="goods.id" ref="pagesku" :goods="goods" @skuPopData="skuPopData"></pageSku>
+		<view v-if="show_donghua == 1" :animation="animationData" style="position: fixed;right: 32rpx;top: 600rpx;z-index: 10;"
+			:style="{
+			top: top + 'px'
+		}">
+			<!-- <image style="width: 50rpx;height: 50rpx;" src="../my/images/av.png" mode=""></image> -->
+			<u-icon size="50rpx" name="plus-circle-fill" color="#A16222" style="background: #fff;border-radius: 50%;"></u-icon>
+		</view>
+		
+		<goods v-if="show_goods_id > 0" :goods_id="show_goods_id" @close="show_goods_id = 0"></goods>
+	</view>
+</template>
+<script>
+	import logins from '@/components/login/logins.vue'
+	import pageSku from "./compontents/page-sku.vue";
+	import goods from "./compontents/goods.vue";
+	export default {
+		components: {
+			logins,
+			pageSku,
+			goods
+		},
+		data() {
+			return {
+				wcCode: -1,
+				mch_id: 0,
+				store_id: 0,
+				n_id: 0,
+				cat_index: 0,
+				goods_loading: 0,
+
+				cat_list: [],
+				goods_list: [],
+				mch: null,
+				table: null,
+				goods: {},
+				goodsArr: [],
+				show_card: false,
+
+
+				top: 0,
+				show_donghua: 0,
+				animationData: {},
+				animation: null,
+				cartData: null,
+				is_cont: 0,
+				
+				show_goods_id: 0
+			}
+		},
+		watch: {
+			cat_index(value) {
+				this.goods_list = []
+				this.getGoods()
+			}
+		},
+		async onLoad(query) {
+			if (query.wxcode) {
+				this.wcCode = query.wxcode
+			} else {
+				this.wcCode = ''
+			}
+			this.mch_id = query.mch_id
+			this.store_id = query.store_id
+			this.n_id = query.n_id
+			this.is_cont = query.is_cont ? 1 : 0
+			this.getCatList(query)
+		},
+		//发送给朋友
+		onShareAppMessage(res) {
+
+		},
+		onPullDownRefresh() {
+
+		},
+		onShow() {
+			
+		},
+		onReady() {
+			setTimeout(() => {
+				let view = uni.createSelectorQuery().select(".bttom-box");
+				if (view) {
+					view.boundingClientRect(data => {
+						this.cartData = data
+					}).exec();
+				}
+			}, 200)
+		},
+		onHide() {},
+		computed: {
+			totalPrice() {
+				return this.goodsArr.reduce((pre, cur) => {
+					let price = cur.activeGoodsInfo.price * cur.num
+					// 计算小料
+					let smallMaterialPrice = 0
+					if (cur.small_goods) {
+						smallMaterialPrice = cur.small_goods.reduce((price, item) => {
+							return price + item.group_item.reduce((price, item) =>
+								price + item.price, 0)
+						}, 0)
+					}
+					smallMaterialPrice = cur.num * (Number(smallMaterialPrice))
+					return pre + Number(price) + smallMaterialPrice;
+				}, 0).toFixed(2);
+			}
+		},
+		methods: {
+			async getCatList(query) {
+				uni.showLoading({
+					title: '加载中'
+				})
+				let res = await this.$api.common.getFootCat({
+					store_id: query.store_id,
+					mch_id: query.mch_id,
+					n_id: query.n_id
+				})
+				uni.hideLoading()
+				if (res.code > 0) {
+					uni.showModal({
+						title: '提示',
+						content: res.msg,
+						showCancel: false,
+						success() {
+							
+						}
+					})
+				} else {
+					if (res.data.is_more && res.data.is_more > 0 && this.is_cont == 0) {
+						uni.reLaunch({
+							url: '/pages/takeaway/orderAndSettlement/edit?n_id=' + query.n_id + '&mch_id=' + query.mch_id + '&store_id=' + query.store_id
+						})
+					}
+					this.cat_list = res.data.cat_list
+					this.mch = res.data.mch
+					this.table = res.data.table
+					this.$nextTick(() => {
+						this.getGoods()
+					})
+				}
+			},
+			async getGoods() {
+				this.goods_loading = 0
+				let res = await this.$api.common.getFootGoods({
+					cat_id: this.cat_list[this.cat_index].id,
+					store_id: this.store_id,
+					mch_id: this.mch_id,
+				})
+				this.goods_loading = 1
+				if (res.code > 0) {
+					uni.showModal({
+						title: '提示',
+						content: res.msg,
+						showCancel: false,
+						success() {}
+					})
+				} else {
+					this.goods_list = res.data
+				}
+			},
+			// 选择规格
+			async chooseSpecifications(params, e) {
+				uni.showLoading({
+					title: "请稍等",
+					mask: true,
+				});
+				this.goods = {};
+				await this.$nextTick()
+				const res = await this.$api.common.goodsInfo({
+					id: params.goods_id
+				});
+				this.goods = res.data
+				await this.$nextTick()
+				await this.setStart(e)
+				setTimeout(async () => {
+					uni.hideLoading();
+					this.$refs.pagesku.skuPopData.type = 2;
+					this.$refs.pagesku.$refs?.popup?.open();
+				}, 0)
+			},
+			async skuPopData(e) {
+				const goods = this.goodsArr.find(item => item.goods_sku_id === e.goods_sku_id && item.small_goods_json ===
+					e.small_goods_json)
+				if (goods) {
+					let goodsArr = this.goodsArr
+					this.goodsArr.forEach((item, index) => {
+						if (item.goods_sku_id === e.goods_sku_id && item.small_goods_json === e.small_goods_json) {
+							this.goodsArr[index].num = (this.goodsArr[index].num - 0) + 1
+						}
+					})
+					this.goodsArr = []
+					this.goodsArr = goodsArr
+				} else {
+					e.key = Math.random()
+					this.goodsArr.push(JSON.parse(JSON.stringify(e)))
+				}
+				console.log(this.goodsArr)
+				await this.$nextTick()
+				this.setA()
+			},
+			setStart(e) {
+				this.top = e.detail.y
+				var animation = uni.createAnimation({
+					duration: 600,
+					timingFunction: 'ease',
+				})
+				this.animation = animation
+				this.animationData = animation.export()
+			},
+			setA() {
+				this.show_donghua = 1
+				// 先旋转后放大
+				this.animation.translate('-600rpx', (this.cartData.top - this.top)).step()
+				this.animationData = this.animation.export()
+				setTimeout(() => {
+					this.show_donghua = 0
+					this.$nextTick(() => {
+						this.animation.translate('600rpx', -(this.cartData.top - this.top)).step()
+						this.animationData = this.animation.export()
+					})
+				}, 600)
+			},
+			toSubmit() {
+				let goodsArr = this.goodsArr.filter(item => item.num > 0)
+				if (!goodsArr.length) {
+				    uni.$u.toast("请选择点餐商品")
+				    return
+				}
+				let that = this
+				uni.setStorage({
+					key: 'take_n_id_' + this.n_id,
+					data: goodsArr,
+					success() {
+						uni.navigateTo({
+						    url: "/pages/takeaway/orderAndSettlement/index?" + "n_id=" + that.n_id + "&mch_id=" + that.mch_id + "&store_id=" + that.store_id,
+						});
+					}
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.hearder-box {
+		background: linear-gradient(to bottom, #D6BDA3, #F3EEE8);
+		// background: #FFF;
+		padding: 20rpx;
+	}
+
+	.content-box {
+		display: flex;
+		flex: 1;
+		background: blue;
+
+		.left-tab {
+			width: 160rpx;
+			height: 100%;
+			background: #E3DAD0;
+		}
+
+		.right-tab {
+			flex: 1;
+			height: 100%;
+			background: #FFF;
+		}
+	}
+
+	.bttom-box {
+		padding-bottom: constant(safe-area-inset-bottom);
+		padding-bottom: env(safe-area-inset-bottom);
+	}
+
+	.cat-item {
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+		font-size: 30rpx;
+		padding: 20rpx;
+	}
+
+	.cat-item-active {
+		background: #FFF;
+	}
+
+	.goods_name {
+		display: -webkit-box;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 2;
+		/* 定义文本的行数 */
+		overflow: hidden;
+		text-overflow: ellipsis;
+		font-size: 28rpx;
+	}
+
+	.minus {
+		border: 1px solid #e5e5e5;
+		border-right: none;
+		border-radius: 20px 0 0 20px;
+		padding: 6px;
+	}
+
+	.plus {
+		border: 1px solid #e5e5e5;
+		border-left: none;
+		border-radius: 0 20px 20px 0;
+		padding: 6px;
+	}
+
+	.numInput {
+		width: 35px;
+		text-align: center;
+		border: 1px solid #e5e5e5;
+		padding: 3px 0;
+		height: 20px;
+		line-height: 20px;
+		font-size: 12px;
+		color: #000;
+	}
+</style>
\ No newline at end of file
diff --git a/pages/takeaway/orderAndSettlement/edit.vue b/pages/takeaway/orderAndSettlement/edit.vue
new file mode 100644
index 0000000..b83b4bb
--- /dev/null
+++ b/pages/takeaway/orderAndSettlement/edit.vue
@@ -0,0 +1,126 @@
+<template>
+	<view class="page-box" style="padding: 20rpx;">
+		<view v-if="info">
+			<view  style="padding: 30rpx;background: #FFF;text-align: center;display: flex;align-items: center;justify-content: space-around;">
+				<view
+				@click="toDiancan"
+				style="width: 50%;display: flex;align-items: center;justify-content: center;">
+					<u-icon name="file-text-fill" color="#f29100" size="50rpx"></u-icon>
+					继续点餐
+				</view>
+				<view style="height: 30rpx;width: 3rpx;background: #eee;"></view>
+				<view style="width: 50%;">
+					桌号：{{ info.table.number }}
+				</view>
+			</view>
+			
+			<view style="margin-top: 30rpx;background: #FFF;">
+				<view style="text-align: center;font-weight: bold;padding: 30rpx;">
+					已点菜单
+				</view>
+				<view v-for="item in info.list" style="padding: 20rpx;">
+					<view style="display: flex;justify-content: space-between;">
+						<view style="color: #999;font-size: 24rpx;">{{ item.order_no }}</view>
+						<view style="font-size: 24rpx;color: #E6A23C;">
+							{{ item.create_time }}
+						</view>
+					</view>
+					<view v-for="goodsItem in item.details" style="display: flex;margin-top: 20rpx;">
+						<view>
+							<image style="width: 100rpx;height: 100rpx;border-radius: 10rpx;" mode="aspectFill" :src="goodsItem.goods_pic"></image>
+						</view>
+						<view style="flex: 1;font-size: 24rpx;padding-left: 14rpx;">
+							<view>
+								{{ goodsItem.goods_name }}
+							</view>
+							<view style="font-size: 22rpx;color: #999;margin: 10rpx;">
+								<div class="goods_sky">
+									<span v-for="(sku, _index) of goodsItem.goods_sku_json" :key="_index">
+										{{ sku.group_name }}：{{ sku.name }}</span>
+								</div>
+								<div class="tags" style="display: flex;flex-wrap: wrap;" v-if="goodsItem.small_goods_json">
+									<div class="tag" v-for="items of  goodsItem.small_goods_json" :key="items.name">
+										{{ items.name }}：
+										<text v-for="item1 of items.group_item" :key="item1.name" style="padding: 6rpx;">
+											<text style="color: #0080ff;">{{ item1.name }}</text>
+											<text v-if="item1.price > 0" style="color: red;">
+												- {{ item1.price }}元
+											</text>
+										</text>
+									</div>
+								</div>
+							</view>
+						</view>
+						<view style="width: 120rpx;text-align: right;">
+							<view style="color: #999;font-size: 24rpx;">
+								x{{ goodsItem.num }}
+							</view>
+							<view style="color: red;margin-top: 10rpx;">
+								￥{{ goodsItem.price }}
+							</view>
+						</view>
+					</view>
+				</view>
+				<view style="padding: 0 20rpx 40rpx;text-align: right;">
+					合计：<text style="color: red;font-weight: bold;">￥{{ (info.list.reduce((sum, item) => sum + (item.pay_price - 0), 0)).toFixed(2) }}</text>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		components: {},
+		data() {
+			return {
+				mch_id: 0,
+				store_id: 0,
+				n_id: 0,
+				
+				info: null
+			}
+		},
+		computed: {
+			
+		},
+		async onLoad(query) {
+			this.mch_id = query.mch_id
+			this.store_id = query.store_id
+			this.n_id = query.n_id
+			this.getOrderInfo(query)
+		},
+		onShow() {},
+		onHide() {},
+		methods: {
+			async getOrderInfo(query) {
+				uni.showLoading({
+					title: '加载中'
+				})
+				let res = await this.$api.common.getFootOrder({
+					store_id: query.store_id,
+					mch_id: query.mch_id,
+					n_id: query.n_id
+				})
+				uni.hideLoading()
+				if (res.code > 0) {
+					uni.showToast({
+						icon: 'none',
+						title: res.msg
+					})
+				} else {
+					this.info = res.data
+				}
+			},
+			toDiancan() {
+				uni.reLaunch({
+					url: '/pages/takeaway/index?store_id=' + this.store_id + '&mch_id=' + this.mch_id + '&n_id=' + this.n_id + '&is_cont=1'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	
+</style>
\ No newline at end of file
diff --git a/pages/takeaway/orderAndSettlement/index.vue b/pages/takeaway/orderAndSettlement/index.vue
new file mode 100644
index 0000000..6e7f699
--- /dev/null
+++ b/pages/takeaway/orderAndSettlement/index.vue
@@ -0,0 +1,734 @@
+<template>
+	<view class="page" v-if="diningRoomInfo.table_info">
+		<div class="shop">
+			<div class="head">
+				<u-icon name="shopping-cart" color="#fff" size="16"></u-icon>
+				下单中
+			</div>
+			<div class="body">
+				<view class="floor-1">
+					<view class="left">
+						<view @click="toUrl('/subPackages/stores/restaurantList/index')"
+							style="margin-bottom: 20rpx;display: flex;">
+							<u-icon name="arrow-right" :label="diningRoomInfo.name" labelPos="left" color="#262626"
+								size="15"></u-icon>
+						</view>
+						<u-icon name="map" @click="openLocation(diningRoomInfo)"
+							:label="diningRoomInfo.detail || diningRoomInfo.name" labelColor="#a8a8a8" color="#a8a8a8"
+							size="12" label-size="12"></u-icon>
+					</view>
+					<view class="right">
+						<view class="item active">桌号：{{ diningRoomInfo.table_info.number }}</view>
+					</view>
+				</view>
+			</div>
+		</div>
+
+		<view class="settlementGoods" v-show="!openinglod">
+			<view class="list" @click.stop>
+				<view class="item" v-for="(item, index1) of goodsArr" :key="item.key">
+					<view class="item-menu-image" v-if="item.goods">
+						<u--image width="160rpx" height="160rpx" radius="10" class=""
+							:src="item.activeGoodsInfo.pic_url || item.goods.pic_url || item.goods.pic_url"></u--image>
+					</view>
+					<view class="info" v-if="item.goods">
+						<view class="item-menu-name text_line">{{ item.goods.name }}</view>
+						<view class="item-desc">
+							<view class="goods_sky">
+								<text v-for="(sku, _index) of item.activeGoodsInfo.attr_list" :key="_index">{{
+                                    sku.group_name
+                                }}：{{ sku.name }}
+								</text>
+							</view>
+						</view>
+						<view class="list-smallMaterialAttr mb">
+							<view class="smallitem" v-for="small of item.small_goods">
+								<view class="tags">
+									<view class="tag" v-for="sitem of small.group_item">
+										<view>
+											{{ sitem.name }}
+										</view>
+										<view v-if="sitem.price" class="price">
+											{{ sitem.price }} 元
+										</view>
+									</view>
+								</view>
+							</view>
+						</view>
+						<view class="sku" v-if="item.activeGoodsInfo">
+							<view class="price">
+								¥ {{ (item.activeGoodsInfo.price * item.num).toFixed(2) }}
+							</view>
+							<u-number-box :min="1" v-model="item.num"></u-number-box>
+						</view>
+					</view>
+
+				</view>
+			</view>
+			<view
+				style="padding: 20rpx;margin-top: 20rpx;background-color: white; border-radius:10rpx 10rpx 0 0; display: grid;grid-template-columns: auto 1fr;align-items: center;grid-gap: 14rpx;gap: 14rpx;">
+				备注 <u--input placeholder="请输入点餐备注" border="surround" v-model="value"></u--input>
+			</view>
+			<view class="settlement">
+				<view class="submit">
+					<view class="shop">
+						<view class="box">
+							<view class="price">总价：￥ {{ totalPrice }}</view>
+							<!-- <view class="table">桌号：{{ number }}</view> -->
+						</view>
+					</view>
+					<view class="btn" @click="submit" v-if="opening">
+						<view class="loading" v-if="loading">
+							<u-loading-icon size="18" color="#fff" textColor="#fff" mode="semicircle"></u-loading-icon>
+						</view>
+						<view class="text">
+							{{ loading ? "下单中" : "下单" }}
+						</view>
+					</view>
+					<view class="btn no_opening" v-else>
+						<view class="text">
+							店铺休息中...
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	// #ifndef MP
+	import wxConfig from '@/utils/wxConfig'
+	// #endif
+	export default {
+		components: {},
+		data() {
+			return {
+				mch: {},
+				goodsArr: [],
+				value: "",
+				n_id: "",
+				mch_id: "",
+				loading: false,
+				number: "",
+				opening: true,
+				openinglod: true,
+				discount: {
+					type: 1, // 1 折扣
+					amount: 0
+				},
+				diningRoomInfo: {},
+				
+				pay_type: 0
+			}
+		},
+		async onLoad({
+			n_id,
+			mch_id,
+			number
+		}) {
+			this.n_id = n_id
+			this.mch_id = mch_id
+			this.number = number
+
+			const res = await this.$api.common.getIsBusinessHours({
+				shop_id: mch_id
+			})
+			this.openinglod = false
+			if (res.code == 0) {
+				this.opening = res.data
+			}
+			const res1 = await this.$api.common.DiningRoom({
+				table_number: this.n_id,
+				mch_id: this.mch_id
+			});
+			this.diningRoomInfo = res1.data || {};
+			
+			if (this.$utils.isInWeChatBrowser()) {
+				this.pay_type = 2
+			}
+			if (this.$utils.isInAliBrowser()) {
+				this.pay_type = 1
+			}
+		},
+
+		async onShow() {
+			if (!this.$utils.isInWeChatBrowser() && !this.$utils.isInAliBrowser()) {
+				uni.showModal({
+					title: '提示',
+					content: '请使用微信或支付宝扫码',
+					showCancel: false,
+					success() {
+						uni.switchTab({
+							url: '/pages/index/index'
+						})
+					}
+				})
+			} else {
+				this.goodsArr = uni.getStorageSync("take_n_id_" + this.n_id)
+				const res = await this.$api.common.FoodOrderPreview({
+					'mch_list': JSON.stringify([{
+						"mch_id": this.mch_id,
+						"shop_id": this.mch_id,
+						"delivery_type": 1,
+						"good_list": this.goodsArr.map(item => {
+							return {
+								"num": item.num,
+								"goods_id": item.goods.id,
+								"goods_sku_id": item.goods_sku_id,
+								"small_goods": item.small_goods,
+								"small_goods_json": item.small_goods_json,
+							}
+						})
+					}]),
+					table_number: this.n_id,
+				});
+				if (res.code) {
+					return
+				}
+				this.mch = res.data.mch_list[0]
+			}
+		},
+		onHide() {},
+		computed: {
+			totalPrice() {
+				return (this.goodsArr.reduce((pre, cur) => {
+					let price = cur.activeGoodsInfo.price * cur.num
+					// 计算小料
+					let smallMaterialPrice = 0
+					if (cur.small_goods) {
+						smallMaterialPrice = cur.small_goods.reduce((price, item) => {
+							return price + item.group_item.reduce((price, item) =>
+								price + item.price, 0)
+						}, 0)
+					}
+					smallMaterialPrice = cur.num * (Number(smallMaterialPrice))
+					return pre + Number(price) + smallMaterialPrice;
+				}, 0)).toFixed(2)
+			}
+		},
+		methods: {
+			/**
+			 * 异步提交订单并处理结果。
+			 */
+			async submit() {
+				// 如果正在加载中，则直接返回，避免重复提交
+				if (this.loading) {
+					return;
+				}
+				// 开始加载
+				this.loading = true;
+				// 构建商品列表信息
+				const good_list = this.goodsArr.map(item => ({
+					"num": item.num,
+					"goods_id": item.goods.id,
+					"goods_sku_id": item.goods_sku_id,
+					"small_goods": item.small_goods,
+				}));
+
+				// 发起订单提交请求
+				try {
+					const res1 = await this.$api.common.FoodPlaceOrder({
+						'mch_list': JSON.stringify([{
+							"mch_id": this.mch_id,
+							"shop_id": this.mch_id,
+							"delivery_type": 4,
+							"good_list": good_list,
+						}]),
+						delivery_type: 4,
+						table_number: this.n_id,
+						mark: this.value,
+					});
+					this.loading = false;
+					// 如果请求返回的 code 存在（可能表示请求出错），则显示相应的提示信息并返回
+					if (res1.code) {
+						return uni.$u.toast(res1.message);
+					}
+					if (res1.data.is_online && res1.data.is_online > 0) {
+						return this.successSubmit();
+					} else {
+						// 构建跳转链接
+						const order_no = res1.data && res1.data.order_merge_no ? res1.data.order_merge_no : res1.data.order_no;
+						this.payType(this.pay_type, order_no, 4)
+					}
+				} catch (error) {
+					console.error("Error occurred while submitting order:", error);
+					this.loading = false;
+				}
+			},
+			
+			
+			async payType(payType, order_no, order_type) {
+				switch (payType) {
+					case 1:
+						await this.payTreasureToPay({
+							payType,
+							order_no,
+							order_type
+						})
+						break;
+					case 2:
+						await this.wechatPayNow({
+							payType,
+							order_no,
+							order_type
+						})
+						break;
+					default:
+						break;
+				}
+			},
+			
+			// H5 微信支付
+			async wechatPayNow({
+				payType,
+				order_no,
+				order_type
+			}) {
+				wxConfig.init(["chooseWXPay"]).then((wx) => {
+					console.log(wx.chooseWXPay);
+				})
+				try {
+					uni.showLoading({
+						title: '支付中'
+					})
+					const res = await this.$api.pay.OrderPayment({
+						pay_type: payType,
+						order_no: order_no,
+						order_type
+					});
+					uni.hideLoading()
+					if (res.code) return this.$u.toast(res.message)
+					if (res.data == -1) {
+						return this.successSubmit();
+					}
+					let that = this
+					wxConfig.init(["chooseWXPay"]).then(wx => {
+						wx.chooseWXPay({
+							// 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。
+							// 但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
+							timestamp: res.data.timeStamp, // 时间戳
+							nonceStr: res.data.nonceStr, // 支付签名随机串，不长于 32 位
+							package: res.data.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=\*\*\*）
+							signType: res.data.signType, // 签名算法
+							paySign: res.data.paySign, // 签名
+							success: function(res) {
+								console.log(res, 'success')
+								if (res.err_msg == "get_brand_wcpay_request:ok" || res.err_Info ==
+									"success" || res.errMsg == "chooseWXPay:ok") {
+									that.successSubmit();
+								} else {
+									that.failSubmit();
+								}
+							},
+							complete: function(err) {
+								console.log(res, 'complete')
+								if (res.err_msg == "get_brand_wcpay_request:ok" || res.err_Info ==
+									"success" || res.errMsg == "chooseWXPay:ok" || res.errMsg ==
+									"getBrandWCPayRequest:ok") {
+									that.successSubmit();
+								} else {
+									that.failSubmit();
+								}
+							},
+						})
+					})
+				} catch (error) {
+					this.$u.toast(error.message)
+				}
+			},
+			
+			// 支付宝支付
+			async payTreasureToPay({
+				payType,
+				order_no,
+				order_type
+			}) {
+				try {
+					let that = this
+					uni.showLoading({
+						title: '支付中'
+					})
+					const res = await this.$api.pay.OrderPayment({
+						pay_type: payType,
+						order_no: order_no,
+						order_type,
+					});
+					uni.hideLoading()
+					if (res.code) return this.$u.toast(res.message)
+					
+					if (this.$utils.isInAliBrowser()) {
+						AlipayJSBridge.call("tradePay", {
+							tradeNO: res.data.trade_no
+						}, function(data) {
+							if ("9000" == data.resultCode) {
+								that.successSubmit(res)
+							} else {
+								throw new Error('支付失败，状态码：' + data.resultCode)
+							}
+						});
+					} else {
+						return uni.showToast({
+							icon: 'none',
+							title: '请到支付宝或微信环境中支付'
+						})
+					}
+				} catch (error) {
+					this.$u.toast(error.message)
+				}
+			},
+			failSubmit() {
+				this.$u.toast("支付失败")
+			},
+			successSubmit() {
+				this.$u.toast("操作成功")
+				setTimeout(() => {
+					uni.reLaunch({
+						url: '/pages/takeaway/orderAndSettlement/edit?store_id=' + this.store_id + '&mch_id=' + this.mch_id + '&n_id=' + this.n_id
+					})
+				}, 1500)
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	* {
+		box-sizing: border-box;
+	}
+
+	.shop {
+		padding: 24rpx;
+		padding-bottom: 0px;
+
+		.head {
+			background: linear-gradient(45deg, #cecece 38%, #ebebeb 38%, );
+			font-size: 24rpx;
+			color: white;
+			padding: 14rpx;
+			border-radius: 10rpx 10rpx 0 0;
+			margin: 0 10rpx;
+
+			display: flex;
+			align-items: center;
+			grid-gap: 10rpx;
+			gap: 10rpx;
+		}
+
+		.body {
+			border-radius: 10rpx 10rpx 10rpx 10rpx;
+			overflow: hidden;
+		}
+
+		.floor-1 {
+			padding: 30rpx;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			background: white;
+
+			.right {
+				padding: 12rpx 8rpx;
+				border-radius: 100px;
+				position: relative;
+				font-size: 18px;
+				font-weight: 600;
+				flex: 1 0 auto;
+				text-align: end;
+
+				.item {
+					padding: 12rpx 16rpx;
+					background-color: transparent;
+				}
+			}
+		}
+	}
+
+	.coupons {
+		padding: 0 20rpx;
+		background-color: white;
+		border-radius: 0 0 10rpx 10rpx;
+	}
+
+	.settlement {
+		position: fixed;
+
+		height: 122rpx;
+
+		// #ifdef MP-ALIPAY
+		height: 192rpx;
+		// #endif
+
+		bottom: 0;
+		left: 0;
+		right: 0;
+		overflow: hidden;
+		display: flex;
+		flex-direction: column;
+		box-shadow: 0 0.3125rem 1.25rem rgba(166, 199, 251, 0.12);
+		z-index: 999999999999 !important;
+
+		.submit {
+			flex: 1;
+			display: flex;
+			align-items: center;
+			background-color: white;
+			box-shadow: 0 0.3125rem 1.25rem 20px rgba(166, 199, 251, 0.12);
+			// background: linear-gradient(90deg, #313233 80%, #f84d17);
+		}
+
+
+		.shop {
+			display: flex;
+			flex-direction: column;
+			justify-content: space-evenly;
+			height: 100%;
+			padding: 10rpx 24rpx;
+
+			.box {
+				// color: white;
+				margin-left: 11px;
+				font-weight: 600;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-evenly;
+				height: 100%;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-evenly;
+
+				.price {
+					font-size: 32rpx;
+				}
+
+				.table {
+					font-size: 28rpx;
+					color: rgb(168, 168, 168);
+				}
+			}
+		}
+
+		.btn {
+			background: linear-gradient(90deg, #ff1e00 0%, #ff5927 100%);
+			margin-left: auto;
+			font-size: 36rpx;
+			border-radius: 20rpx;
+			display: grid;
+			align-items: center;
+			margin: auto 0px;
+			margin-left: auto;
+			margin-right: 20rpx;
+			padding: 20rpx 40rpx;
+
+			color: #fff;
+
+			display: flex;
+			justify-content: center;
+			align-items: center;
+
+			transition: all 0.4;
+
+			box-sizing: border-box;
+
+			.loading {
+				margin-right: 22rpx;
+			}
+
+			.text {
+				font-weight: 600;
+			}
+		}
+
+
+		.no_opening {
+			background: linear-gradient(90deg, #e4e4e4 0%, #e4e4e4 100%);
+			color: #5f5f5f;
+		}
+	}
+
+	.page {
+		height: 100vh;
+		overflow: auto;
+	}
+
+	.settlementGoods {
+		overflow: hidden;
+		z-index: 1;
+		background-clip: content-box;
+		display: flex;
+		flex-direction: column;
+		margin: 20rpx;
+		border-radius: 10rpx;
+		margin-bottom: 220rpx;
+	}
+
+	.item-menu-image {
+		width: 160rpx;
+		height: 160rpx;
+
+		background: #f6f6f6;
+		border-radius: 20rpx;
+
+		margin-right: 24rpx;
+	}
+
+	.settlementGoods {
+		overflow: hidden;
+
+		.list {
+			background-color: white;
+			padding: 28rpx;
+			padding-bottom: 0;
+		}
+
+		.item {
+			display: flex;
+			margin-bottom: 24rpx;
+
+			.item-menu-name {
+				font-weight: normal;
+				font-size: 28rpx;
+				color: $u-main-color;
+				margin-bottom: 10rpx;
+				margin-top: 10rpx;
+			}
+
+			.info {
+				flex: 1;
+			}
+
+			.item-tag {
+				margin-bottom: 16rpx;
+			}
+
+			.item-desc {
+				color: rgb(168, 168, 168);
+				font-size: 24rpx;
+				margin: 0px 0px 16rpx 3px;
+			}
+
+			.sku {
+				.price {
+					font-weight: 600;
+					font-size: 14px;
+				}
+
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				color: #ff553f;
+
+				.s-sku {
+					background: linear-gradient(90deg, #ff1e00 0%, #ff5927 100%);
+					color: white;
+
+					display: inline-flex;
+
+					padding: 6rpx 12rpx;
+
+					font-size: 12px;
+
+					font-weight: 600;
+					border-radius: 100px;
+				}
+			}
+		}
+	}
+
+	.list-smallMaterialAttr {
+		.price {
+			color: #f0250e;
+		}
+
+		font-size: 22rpx;
+		color: #8c8c8c;
+		flex: 1;
+		display: flex;
+		align-items: center;
+		width: 100%;
+		grid-gap: 8px;
+		gap: 8px;
+		flex-wrap: wrap;
+		margin-top: 14rpx;
+		margin: 0px 0px 8px 3px;
+
+		.smallitem {
+			display: flex;
+			align-items: center;
+		}
+
+		.tags {
+			display: flex;
+			grid-gap: 12px;
+			gap: 12px;
+			align-items: center;
+			flex-wrap: wrap;
+
+			.tag {
+				background-color: rgb(245, 245, 245);
+				border-radius: 100px;
+
+				display: flex;
+				align-items: center;
+				padding: 12rpx 20rpx;
+
+				.price {
+					// background-color: red;
+					margin-left: 12rpx;
+					border-left: 2px solid #ffffff;
+
+					// margin: -14rpx -18rpx;
+					padding-left: 12rpx;
+				}
+			}
+		}
+	}
+
+	.half_price_count {
+		font-size: 22rpx;
+		color: #8c8c8c;
+		margin-top: 6rpx;
+	}
+
+	/deep/ {
+		.u-input {
+			border: 1px solid rgb(236, 236, 236) !important;
+			border-radius: 14rpx !important;
+		}
+	}
+
+	.remarks {
+		padding: 14rpx 20rpx;
+		display: flex;
+		align-items: center;
+		font-size: 14px;
+		font-weight: 600;
+
+		background-color: white;
+	}
+
+	.minus {
+		border: 1px solid #e5e5e5;
+		border-right: none;
+		border-radius: 20px 0 0 20px;
+		padding: 6px;
+	}
+
+	.plus {
+		border: 1px solid #e5e5e5;
+		border-left: none;
+		border-radius: 0 20px 20px 0;
+		padding: 6px;
+	}
+
+	.numInput {
+		width: 35px;
+		text-align: center;
+		border: 1px solid #e5e5e5;
+		padding: 3px 0;
+		height: 20px;
+		line-height: 20px;
+		font-size: 12px;
+		color: #000;
+	}
+</style>
\ No newline at end of file
diff --git a/subPackages/inPersonToPay/index/index.vue b/subPackages/inPersonToPay/index/index.vue
index af1d35f..0f713df 100644
--- a/subPackages/inPersonToPay/index/index.vue
+++ b/subPackages/inPersonToPay/index/index.vue
@@ -8,18 +8,21 @@
 				<view class="logo">
 					<u--image :showLoading="true" :src="info.logo_url" width="60px" height="60px"></u--image>
 				</view>
-				<text>
+				<text style="font-size: 40rpx;">
 					{{ info.name }}
 				</text>
 			</view>
 			<view class="con">
 				<u--text text="付款金额" margin="0 0 8px 8px" bold color="#000000" size="14"></u--text>
-				<view class="price">
+				<view class="price" style="padding-bottom: 20rpx;align-items: flex-end;">
 					<view>
-						<u--text text="￥" margin="0 3px 0 0" size="32" bold color="#000000"></u--text>
+						<u--text text="￥" margin="0 3px 0 0" size="34rpx" bold color="#000000"></u--text>
 					</view>
-					<input ref="input" v-model.lazy="total_price" @blur="formatInput" :focus="focusState" border="none"
-						type="digit" class="input" />
+					<view class="input" style="font-size: 70rpx;">
+						{{ total_price }}
+					</view>
+					<!-- <input ref="input" v-model.lazy="total_price" @blur="formatInput" :focus="focusState" border="none"
+						type="digit" class="input" /> -->
 				</view>
 				<coupons v-if="coupon && coupon.length" :activeCoupon.sync="activeCoupon" :coupon="coupon"
 					:currentPrice="total_price">
@@ -34,30 +37,11 @@
 					</view>
 				</view>
 
-				<!-- #ifdef MP-WEIXIN  -->
-				<view style="background: #19be6b;" class="item" @click="pay(2)" v-if="info.pay_type.includes(2)">
-					<view class="let">
-						<text>微信</text>
-						<!-- <text v-show="total_price">{{ price || 0 }} ￥</text> -->
-					</view>
-				</view>
-				<!-- #endif -->
-
-				<!-- #ifdef MP-ALIPAY  -->
-				<view style="background: #2979ff;" class="item">
-					<view class="let" @click="pay(1)" v-if="info.pay_type.includes(1)">
-						<text>支付宝</text>
-						<!-- <text v-show="total_price">{{ price || 0 }} ￥</text> -->
-					</view>
-				</view>
-				<!-- #endif -->
-
-
 				<!-- #ifdef H5  -->
 				<view v-if="$utils.isInWeChatBrowser() && info.pay_type.includes(2)" style="background: #19be6b;"
 					class="item" @click="pay(2)">
 					<view class="let">
-						<text>微信</text>
+						<text>微信支付</text>
 						<!-- <text v-show="total_price">{{ price || 0 }} ￥</text> -->
 					</view>
 				</view>
@@ -65,7 +49,7 @@
 				<view v-if="$utils.isInAliBrowser() && info.pay_type.includes(1)" style="background: #2979ff;"
 					class="item" @click="pay(1)">
 					<view class="let">
-						<text>支付宝</text>
+						<text>支付宝支付</text>
 						<!-- <text v-show="total_price">{{ price || 0 }} ￥</text> -->
 					</view>
 				</view>
@@ -73,7 +57,16 @@
 
 			</view>
 		</template>
-		<logins v-if="wcCode != -1" @isLogin="isLogin" :wcCode="wcCode" :type="$utils.isInAliBrowser() || $utils.isInWeChatBrowser() ? 0 : 2"></logins>
+		<view v-if="wcCode != -1" style="" class="keyword-box">
+			<!-- <u-keyboard ref="uKeyboard" style="font-weight: bold;"
+			@change="valueChange" @backspace="valueBackspace"
+			mode="number" :show="true"
+			:safeAreaInsetBottom="true" :overlay="false"
+			:showCancel="false" :showConfirm="false"></u-keyboard> -->
+			<keyword @change="valueChange" @backspace="valueBackspace"></keyword>
+		</view>
+		<logins v-if="wcCode != -1" @isLogin="isLogin" :wcCode="wcCode"
+			:type="$utils.isInAliBrowser() || $utils.isInWeChatBrowser() ? 0 : 2"></logins>
 	</view>
 </template>
 
@@ -82,6 +75,7 @@
 	import coupons from '../compontents/coupons.vue';
 
 	import logins from '@/components/login/logins.vue'
+	import keyword from '@/components/the/keyword.vue'
 
 	// #ifndef MP
 	import wxConfig from '@/utils/wxConfig'
@@ -91,7 +85,8 @@
 		components: {
 			coupons,
 			isPhone,
-			logins
+			logins,
+			keyword
 		},
 		data() {
 			return {
@@ -183,24 +178,29 @@
 				}
 				this.coupon = res.data.coupon
 			},
+			valueChange(e) {
+				this.total_price += ('' + e)
+				this.formatInput()
+			},
+			valueBackspace() {
+				let value = this.total_price.toString()
+				value = value.slice(0, -1)
+				this.total_price = value
+			},
 			formatInput() {
 				if (this.total_price !== null) {
-					let value = this.total_price.toString();
-					value = value.replace(/[^\d.]/g, ""); // 去掉非数字和小数点
-					value = value.replace(/^\./g, ""); // 去掉开头的小数点
-					value = value.replace(/\.{2,}/g, "."); // 去掉多余的小数点
-					value = value.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
-					// 将第一个小数点替换成分隔符
-					value = parseFloat(value);
-					if (isNaN(value)) {
-						value = null;
-					} else {
-						value = value.toFixed(2); // 保留两位小数
+					let value = this.total_price
+					let value_arr = value.toString().split('.')
+					if (value_arr.length > 1) {
+						var len = value_arr.pop().length;
+						if (len > 2) {
+							value = parseFloat(value);
+							value = value.toFixed(2); // 保留两位小数
+						}
 					}
 					this.total_price = value;
 				}
 			},
-
 			async pay(type) {
 				if (this.submit()) return
 				this.payCurrent = true
@@ -496,6 +496,15 @@
 </script>
 
 <style lang="scss" scoped>
+	.keyword-box {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		padding-bottom: calc(constant(safe-area-inset-bottom));
+		padding-bottom: calc(env(safe-area-inset-bottom));
+	}
+
 	.info {
 		display: flex;
 		align-items: center;