diff --git a/App.vue b/App.vue
index a523028..589f927 100644
--- a/App.vue
+++ b/App.vue
@@ -1,5 +1,7 @@
 <script>
-	export default {
+	import api from "@/utils/functions";
+
+  export default {
 		onLaunch: function() {
 			console.log('App Launch')
 		},
@@ -10,8 +12,19 @@
 			console.log('App Hide')
 		},
 		mounted() {
-			
-		}
+
+		},
+    created() {
+      if(!uni.getStorageSync('sysInfo')){
+        uni.showLoading({title:'加载中'});
+        api.uniSysInfo().then(data => {
+          uni.hideLoading();
+        }).catch(err => {
+          uni.hideLoading();
+          uni.$u.toast(err);
+        });
+      }
+    },
 	}
 </script>
 
diff --git a/components/HeaderNav/components/index.scss b/components/HeaderNav/components/index.scss
index 6cf1204..419ca78 100644
--- a/components/HeaderNav/components/index.scss
+++ b/components/HeaderNav/components/index.scss
@@ -21,8 +21,8 @@
 		display:flex;
 		align-items: center;
 		padding:{
-			top:10rpx;
-			bottom:10rpx;
+			//top:10rpx;
+			//bottom:10rpx;
 		}
 	}
 	.header-back-button{
diff --git a/components/HeaderNav/index.vue b/components/HeaderNav/index.vue
index 32f958c..f11c99b 100644
--- a/components/HeaderNav/index.vue
+++ b/components/HeaderNav/index.vue
@@ -5,9 +5,8 @@
 				
 		<view class="header-container" :style="{
 			height:navHeight+'px',
-			paddingTop:headerPadding+'px',
-			paddingBottom:headerPadding+'px',
-			justifyContent: (isBack?'space-between':'center')
+			justifyContent: (isBack?'space-between':'center'),
+			padding:menuButtonPadding+'px 0'
 			}">
 			<view v-show="isBack" class="header-back-button" @click="navBack()">
 				<u-icon name="arrow-leftward"></u-icon>
@@ -44,7 +43,8 @@
 				navHeight: 32,
 				navPaddingTop: 47,
 				headerPadding:4,
-				isTop:true
+				isTop:true,
+        menuButtonPadding:0,
 			}
 		},
 		onShow() {
@@ -55,12 +55,10 @@
 		},
 		methods: {
 			init() {
-				this.navPaddingTop = api.navHeight().navPaddingTop,
-				this.navHeight = api.navHeight().navHeight,
-				this.headerPadding = api.navHeight().headerPadding
-				console.log('this.navPaddingTop123',this.navPaddingTop);
-				console.log('this.navHeight',this.navHeight);
-				console.log('this.headerPadding',this.headerPadding);
+        let sysInfo = uni.getStorageSync('sysInfo');
+				this.navPaddingTop = sysInfo.sysMenuHeight;
+				this.navHeight = sysInfo.menuButtonHeight;
+        this.menuButtonPadding = sysInfo.menuButtonPadding;
 			},
 			navBack(){
 				uni.navigateBack({
@@ -70,17 +68,17 @@
 		},
 		created() {
 			this.init()
-			// onPageScroll:function(e){
-			// 	console.log(1);
-			// }
 		},
 		updated() {},
 		mounted() {
-			var that = this;
-			uni.$on('isTop', function(data) {
+			let that = this;
+			uni.$on('isTop', (data) => {
 				that.isTop = data;
 			});
-		}
+
+
+
+    }
 	}
 </script>
 
diff --git a/pages/Index/components/OrderPage/components/index.scss b/pages/Index/components/OrderPage/components/index.scss
index bb01f7d..cd8b990 100644
--- a/pages/Index/components/OrderPage/components/index.scss
+++ b/pages/Index/components/OrderPage/components/index.scss
@@ -1,99 +1,106 @@
-.app-wallpaper{
-	position: relative;
-	background:{
-		size: 100% 100%;
-		repeat: no-repeat;
-	};
-	.order-capsule-container{
-		position: sticky;
-		
+.order-capsule-container{
+	position: sticky;
+
+	box-sizing: border-box;
+	width:100%;
+	padding:10rpx;
+	border:2rpx solid #262626;
+	border-radius: 45rpx;
+	box-shadow: 1rpx 4rpx 12rpx 0rpx rgba(90,104,103,0.24);
+	background-color: #F8FAFA;
+	.order-capsule{
 		box-sizing: border-box;
-		width:100%;
-		padding:10rpx;
-		border:2rpx solid #262626;
-		border-radius: 45rpx;
-		box-shadow: 1rpx 4rpx 12rpx 0rpx rgba(90,104,103,0.24);
-		background-color: #F8FAFA;
-		.order-capsule{
-			box-sizing: border-box;
-			padding:20rpx;
-			text-align: center;
-			font: {
-				size:30rpx;
-				weight:500;
-			}
-			line-height:30rpx;
-			border:2rpx solid rgba(0,0,0,0);
-			&.active{
-				background:{
-					color:#4DC3B8;
-				}
-				color:#FFFFFF;
-				border:2rpx solid #262626;
-				border-radius:35rpx;
+		padding:20rpx;
+		text-align: center;
+		font: {
+			size:30rpx;
+			weight:500;
+		}
+		line-height:30rpx;
+		border:2rpx solid rgba(0,0,0,0);
+		&.active{
+			background:{
+				color:#4DC3B8;
 			}
+			color:#FFFFFF;
+			border:2rpx solid #262626;
+			border-radius:35rpx;
 		}
 	}
-	.order-screen-container{
-		.order-screen{
-			padding:40rpx 0 20rpx 0;
-			padding-right: 66rpx;
-			font-size: 28rpx;
-			line-height: 53rpx;
-			color:#646464;
-			font-weight: 400;
-			position: relative;
-			&.active{
-				color:#000000;
-				font-size: 32rpx;
-				font-weight: 500;
-				.order-screen-active{
-					display:flex;
-				}
-			}
+}
+.order-screen-container{
+	.order-screen{
+		padding:40rpx 0 20rpx 0;
+		padding-right: 66rpx;
+		font-size: 28rpx;
+		line-height: 53rpx;
+		color:#646464;
+		font-weight: 400;
+		position: relative;
+		&.active{
+			color:#000000;
+			font-size: 32rpx;
+			font-weight: 500;
 			.order-screen-active{
-				display: none;
-				align-items: center;
-				justify-content: center;
-				position: absolute;
-				top: 90rpx;
-				left: 12rpx;
-				.img{
-					width:37rpx;
-				}
+				display:flex;
 			}
-			
 		}
-		.order-screen-time-container{
-			flex:1;
-			margin-left:auto;
-			justify-content: flex-end;
-			.order-screen{
-				// padding-right:0;
+		.order-screen-active{
+			display: none;
+			align-items: center;
+			justify-content: center;
+			position: absolute;
+			top: 90rpx;
+			left: 12rpx;
+			.img{
+				width:37rpx;
 			}
 		}
-			.order-screen-time-title{
-				color:#B5B5B5;
-				font-size:26rpx;
-				font-weight: 400;
-				line-height:53rpx;
-				padding-right: 16rpx;
-			}
-			.order-screen-time-buttton-container{
-				padding-right: 0;
-			}
-			.order-screen-time-buttton{
-				padding:8rpx 19rpx;
-				color:#4EC2B7;
-				font-size: 28rpx;
-				font-weight: 400;
-				background-color:#ffffff;
-				border:1px solid #4EC2B7;
-				border-radius: 10rpx;
-				line-height: 28rpx;
-				box-shadow: 0rpx 4rpx 5rpx 0rpx rgba(82,84,84,0.1), 2rpx -4rpx 0rpx 0rpx rgba(78,194,183,0.2);
-			}
+
+	}
+	.order-screen-time-container{
+		flex:1;
+		margin-left:auto;
+		justify-content: flex-end;
+		.order-screen{
+			// padding-right:0;
+		}
+	}
+	.order-screen-time-title{
+		color:#B5B5B5;
+		font-size:26rpx;
+		font-weight: 400;
+		line-height:53rpx;
+		padding-right: 16rpx;
+	}
+	.order-screen-time-buttton-container{
+		padding-right: 0;
 	}
+	.order-screen-time-buttton{
+		padding:8rpx 19rpx;
+		color:#4EC2B7;
+		font-size: 28rpx;
+		font-weight: 400;
+		background-color:#ffffff;
+		border:1px solid #4EC2B7;
+		border-radius: 10rpx;
+		line-height: 28rpx;
+		box-shadow: 0rpx 4rpx 5rpx 0rpx rgba(82,84,84,0.1), 2rpx -4rpx 0rpx 0rpx rgba(78,194,183,0.2);
+	}
+}
+.order-screen-top{
+	position: sticky;
+	left:0;
+	z-index: 9999;
+	background-color:#fff;
+	padding:25rpx;
+}
+.app-wallpaper{
+	position: relative;
+	background:{
+		size: 100% 100%;
+		repeat: no-repeat;
+	};
 	.order-list-container{
 		width:100%;
 		//max-height: 1000rpx;
diff --git a/pages/Index/components/OrderPage/index.vue b/pages/Index/components/OrderPage/index.vue
index 3505a11..9557de3 100644
--- a/pages/Index/components/OrderPage/index.vue
+++ b/pages/Index/components/OrderPage/index.vue
@@ -1,44 +1,45 @@
 <template>
-	<view class="app-wallpaper" :style="{
-		backgroundImage:'url('+staticImage.wallpaperBgImage+')'
+  <view class="order-screen-top" :style="{
+			top:topStyle
 		}">
+    <view class="order-capsule-container row">
+      <view class="order-capsule col-4"
+            v-for="(item,index) in screenMenu"
+            :class="{active:(item.value === screenCheck)}"
+            @click="selectScreen(item)"
+      >
+        {{ item.name }}
+      </view>
 
-		<view class="order-screen-top" :style="{
-			// top:(uni.$u.)
-		}">
-			<view class="order-capsule-container row">
-				<view class="order-capsule col-4"
-							v-for="(item,index) in screenMenu"
-							:class="{active:(item.value === screenCheck)}"
-							@click="selectScreen(item)"
-				>
-					{{ item.name }}
-				</view>
+    </view>
+    <view class="order-screen-container row">
+      <view class="order-screen" v-for="(date, index) in dateSelectData" @click="dayActiveToggle(date)" :class="{active:dayActive === date.value}">
+        {{ date.title }}
+        <view class="order-screen-active">
+          <image mode="widthFix" class="img" :src="staticImage.screenActiveImg" />
+        </view>
+      </view>
 
-			</view>
-			<view class="order-screen-container row">
-				<view class="order-screen" v-for="(date, index) in dateSelectData" @click="dayActiveToggle(date)" :class="{active:dayActive === date.value}">
-					{{ date.title }}
-					<view class="order-screen-active">
-						<image mode="widthFix" class="img" :src="staticImage.screenActiveImg" />
-					</view>
-				</view>
+      <view class="order-screen-time-container row">
+        <view class="order-screen order-screen-time-title">
+          05/06-08-03
+        </view>
+        <view class="order-screen order-screen-time-buttton-container">
+          <view class="order-screen-time-buttton">
+            时间
+          </view>
+        </view>
+      </view>
+
+    </view>
+  </view>
+	<view class="app-wallpaper" :style="{
+		backgroundImage:'url('+staticImage.wallpaperBgImage+')'
+		}">
 
-				<view class="order-screen-time-container row">
-					<view class="order-screen order-screen-time-title">
-						05/06-08-03
-					</view>
-					<view class="order-screen order-screen-time-buttton-container">
-						<view class="order-screen-time-buttton">
-							时间
-						</view>
-					</view>
-				</view>
 
-			</view>
-		</view>
 		<view class="order-list-container">
-			<view class="order-list-item" v-for="(item,index) in orderList">
+			<view class="order-list-item" v-for="(item,index) of 10">
 				<view class="order-card-container row">
 					<view class="order-card-container-background col-12"></view>
 					<view class="order-card-container-background-main row">
@@ -105,6 +106,11 @@
 			RightNav,
 			MzButton
 		},
+    computed:{
+      topStyle(){
+        return (uni.getStorageSync('sysInfo').sysAndMenuHeight)+'px'
+      },
+    },
 		data() {
 			return {
 				title: 'Hello',
@@ -156,6 +162,7 @@
 
 		},
 		methods: {
+
       selectScreen(item){
         this.screenCheck = item.value;
 				this.page = 1;
diff --git a/pages/OrderPage/index.vue b/pages/OrderPage/index.vue
index 2c63084..cb4bb39 100644
--- a/pages/OrderPage/index.vue
+++ b/pages/OrderPage/index.vue
@@ -218,8 +218,48 @@
       1、文字占位文字占位文字占位文字占位文字占位文字占位文字占位    2、文字占位文字占位文字占位文字占位文字占位文字占位文
     </view>
   </uv-popup>
-  <uv-popup ref="addServicePopup" mode="bottom" closeable safeAreaInsetTop safeAreaInsetBottom>
-
+  <uv-popup ref="addServicePopup" mode="bottom" round="20" closeable safeAreaInsetTop safeAreaInsetBottom>
+    <view class="pop-service-container">
+      <u-cell-group custom-style="max-height:700rpx;overflow:auto;">
+        <u-cell
+            size="large"
+            :title="item.name"
+            isLink
+            right-icon=""
+            v-for="(item,index) in addServiceList"
+            @click="selectAddService(item,index)"
+        >
+          <template #value>
+            <view class="">
+              <view class="" style="display:flex;align-items: center">
+                <view class="">
+                  <u-text :text="parseFloat(item.price)+'元'" size="32" style="white-space: nowrap;" line-height="32"></u-text>
+                </view>
+                <view class="">
+                    <u-radio-group>
+                      <u-radio
+                          :customStyle="{marginBottom: '0',marginTop: '0',marginLeft:'15rpx'}"
+                          size="32"
+                          :checked="(addServiceChecked.indexOf(item.id))"
+                          @click="selectAddService(item)"
+                      >
+                      </u-radio>
+                    </u-radio-group>
+                </view>
+              </view>
+            </view>
+          </template>
+        </u-cell>
+      </u-cell-group>
+      <view class="row">
+        <view class="col-6" style="padding:0 30rpx;">
+          <MzButton title="取消"></MzButton>
+        </view>
+        <view class="col-6" style="padding:0 30rpx;">
+          <MzButton title="确认" button-color="#4DC3B8" font-color="#fff"></MzButton>
+        </view>
+      </view>
+    </view>
   </uv-popup>
 	<!-- <RightNav></RightNav> -->
 </template>
@@ -286,7 +326,8 @@
         pages:{
           page:1,
           limit:10
-        }
+        },
+        addServiceChecked:[],
 			}
 		},
 		onLoad(options) {
@@ -297,11 +338,17 @@
       this.getDefaultAddress();
     },
 		methods: {
+      serverBottomLower(){
+        console.log(123123)
+      },
       showAddServicePopup(){
         this.$refs.addServicePopup.open();
       },
       selectAddService(item){
-
+        if(!this.addServiceChecked.indexOf(item.id)){
+          this.addServiceChecked.push.apply(item.id);
+        }
+        console.log(this.addServiceChecked)
       },
       getStoreServiceList(){
         getStoreService({address_id: this.address.id}).then(res => {
diff --git a/utils/functions.js b/utils/functions.js
index d1fbdac..8065b61 100644
--- a/utils/functions.js
+++ b/utils/functions.js
@@ -267,5 +267,21 @@ const api = {
 			system:this.system
 		};
 	},
+	uniSysInfo:() => {
+		return new Promise((resolve,reject)=>{
+			let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
+			let sysMenuHeight = uni.$u.sys().statusBarHeight;
+			let menuButtonHeight = menuButtonInfo.height
+			let menuButtonPadding = menuButtonInfo.top - sysMenuHeight
+			let data = {
+				sysMenuHeight:sysMenuHeight,
+				menuButtonHeight:menuButtonHeight,
+				menuButtonPadding:menuButtonPadding,
+				sysAndMenuHeight:(sysMenuHeight+menuButtonHeight+(menuButtonPadding*2))
+			}
+			uni.setStorageSync('sysInfo',data);
+			resolve(data);
+		})
+	}
 }
 export default api;