更新全局导航栏信息获取

App.vue

@@ -1,4 +1,6 @@
 <script>
+	import api from "@/utils/functions";
+
   export default {
 		onLaunch: function() {
 			console.log('App Launch')
@@ -11,7 +13,18 @@
 		},
 		mounted() {
 
+		},
+    created() {
+      if(!uni.getStorageSync('sysInfo')){
+        uni.showLoading({title:'加载中'});
+        api.uniSysInfo().then(data => {
+          uni.hideLoading();
+        }).catch(err => {
+          uni.hideLoading();
+          uni.$u.toast(err);
+        });
       }
+    },
 	}
 </script>
 

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{

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,16 +68,16 @@
 		},
 		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>

pages/Index/components/OrderPage/components/index.scss

@@ -1,10 +1,4 @@
-.app-wallpaper{
-	position: relative;
-	background:{
-		size: 100% 100%;
-		repeat: no-repeat;
-	};
-	.order-capsule-container{
+.order-capsule-container{
 	position: sticky;
 
 	box-sizing: border-box;
@@ -33,8 +27,8 @@
 			border-radius:35rpx;
 		}
 	}
-	}
-	.order-screen-container{
+}
+.order-screen-container{
 	.order-screen{
 		padding:40rpx 0 20rpx 0;
 		padding-right: 66rpx;
@@ -93,7 +87,20 @@
 		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;

pages/Index/components/OrderPage/index.vue

@@ -1,10 +1,6 @@
 <template>
-	<view class="app-wallpaper" :style="{
-		backgroundImage:'url('+staticImage.wallpaperBgImage+')'
-		}">
-
   <view class="order-screen-top" :style="{
-			// top:(uni.$u.)
+			top:topStyle
 		}">
     <view class="order-capsule-container row">
       <view class="order-capsule col-4"
@@ -37,8 +33,13 @@
 
     </view>
   </view>
+	<view class="app-wallpaper" :style="{
+		backgroundImage:'url('+staticImage.wallpaperBgImage+')'
+		}">
+
+
 		<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;

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 => {

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;