样式

App.vue

@@ -3,7 +3,7 @@
 		onLaunch: function() {
 			// #ifdef APP-PLUS
 			plus.screen.lockOrientation('portrait-primary');
-			plus.navigator.setFullscreen(true);
+			// plus.navigator.setFullscreen(true);
 			// #endif
 		},
 		onHide: function() {

common/style/layout.css

@@ -1,10 +1,9 @@
 page {
-    background-color: #f6f6f6 !important;
+    background-color: #f6f6f6!important;
     min-height: 100% !important;
     height: 100% !important;
 }
 uni-page-body {
-	background-color: #f6f6f6 !important;
 	min-height: 100% !important;
 	height: 100% !important;
 }
@@ -109,7 +108,7 @@ uni-button:after {
 .zd_content {
 	width: 100%;
 	height: auto;
-	padding: 92rpx 14rpx 82rpx 14rpx;
+	padding: calc(var(--status-bar-height) + 92rpx) 14rpx 82rpx 14rpx;
 }
 .zd_wrapper {
 	width: 100%;
@@ -279,7 +278,7 @@ uni-button:after {
 	margin: 0 40rpx 10rpx 0;
 	border-radius: 30rpx;
 }
-.btn-disabled, .submit-button:disabled {
+.btn-disabled, .submit-button[disabled] {
 	background-color: #c9c9c9;
 	border: 1px solid #c9c9c9;
 	color: #fff;

components/NavBar.vue

@@ -53,7 +53,7 @@
 .header
 	_fj()
 	position fixed
-	_wh(100%, 72rpx)
+	_wh(100%, calc(var(--status-bar-height) + 72rpx))
 	background-color $red
 	z-index 200
 	padding 0 20rpx

pages.json

@@ -256,11 +256,11 @@
 		}
     ],
 	"globalStyle": {
-		// "pageOrientation": "landscape",
+		"navigationBarTextStyle": "black",//导航栏标题颜色及状态栏前景颜色，仅支持 black/white
-		"navigationBarTextStyle": "white",
+		"navigationBarTitleText": "印尼海亮铜箔",//导航栏标题文字内容
-		"navigationBarTitleText": "uni-app",
+		"navigationBarBackgroundColor": "#ff6a00",//导航栏背景颜色（同状态栏背景色）
-		"navigationBarBackgroundColor": "#d7592f",
+		"backgroundColor": "#ffffff",//下拉显示出来的窗口的背景色
-		"backgroundColor": "#ffffff"
+		"onReachBottomDistance": 50//页面上拉触底事件触发时距页面底部距离，单位只支持px
 	},
 	"uniIdRouter": {}
 }

pages/home/home.vue

@@ -1,21 +1,23 @@
 <template>
-	<view class="zd_content">
+	<view class="home_wraper">
-		<view class="header">{{$t('home.title')}}</view>
+		<view class="zd_content">
-		<view class="userInfo-wrap">
+			<view class="header">{{$t('home.title')}}</view>
-			<view class="userInfo">
+			<view class="userInfo-wrap">
-				<text class="p1">{{$store.getters.userName}}</text>
+				<view class="userInfo">
-				<text class="p2">{{$t('home.message')}}</text>
+					<text v-if="userName !== ''" class="p1">{{userName}}</text>
+					<text class="p2">{{$t('home.message')}}</text>
+				</view>
+				<view class="exit" @tap="Quit">
+					<view class="icon-exit"></view>
+					<view class="exit-text">{{$t('home.exit')}}</view>
+				</view>
 			</view>
-			<view class="exit" @tap="Quit">
+			<view class="zd_home_wrapper">
-				<view class="icon-exit"></view>
+				<view class="menu-wrap">
-				<view class="exit-text">{{$t('home.exit')}}</view>
+					<view class="menu-item" v-for="(e, i) in menuList" :key="i" @tap="toPage1(e)">
-			</view>
+						<image class="menu-img" :src="require('../../static/image/menu/' + e.path + '.png')" alt="">
-		</view>
+						<view class="menu-name">{{e.name}}</view>
-		<view class="zd_wrapper zd_home_wrapper">
+					</view>
-			<view class="menu-wrap">
-				<view class="menu-item" v-for="(e, i) in menuList" :key="i" @tap="toPage1(e)">
-					<image class="menu-img" :src="require('../../static/image/menu/' + e.path + '.png')" alt="">
-					<view class="menu-name">{{e.name}}</view>
 				</view>
 			</view>
 		</view>
@@ -38,12 +40,16 @@
 	export default {
 		data() {
 			return {
+				userName: '',
 				menuList: [],
 				show: false,
 				secM: []
 			};
 		},
 		created () {
+			if (this.$store.getters.userInfo) {
+				this.userName = JSON.parse(this.$store.getters.userInfo).username
+			}
 			this._authority()
 		},
 		methods: {
@@ -75,12 +81,21 @@
 
 <style lang="stylus">
 @import '../../common/style/mixin.styl';
+.home_wraper
+	_wh(100%, 100%)
 .zd_content
-	padding-top 0
+	padding 0 24rpx
-	padding-bottom 0
 	height 100%
+	padding-top calc(var(--status-bar-height) + 86rpx)
+	background linear-gradient(to bottom, #f8e6db 0%, #f6f6f6 30%, #f6f6f6 100%)
 .header
-	height 86rpx
+	position fixed
+	left 0
+	top 0
+	padding-top var(--status-bar-height)
+	z-index 100
+	_wh(100%, calc(var(--status-bar-height) + 86rpx))
+	background-color  #f8e6db
 	_font(36rpx,86rpx,#333,,center)
 .userInfo-wrap
 	_fj()
@@ -89,7 +104,7 @@
 	background-color $red
 	_bis('../../static/image/info_bg.png',auto,100%,right,bottom)
 	border-radius 12rpx
-	margin-bottom 20rpx
+	margin-bottom 24rpx
 .userInfo
 	_fj(,flex-start,column)
 .p1
@@ -110,8 +125,11 @@
 	_font(24rpx,47rpx,#fff,,right)
 	padding-left 10rpx
 .zd_home_wrapper
-	height calc(100% - 286rpx)
+	_wh(100%, calc(100% - 208rpx))
-	overflow hidden
+	background-color #fff
+	border-radius: 12rpx;
+	padding: 14rpx;
+	margin-bottom: 24rpx;
 	overflow-y auto
 .menu-wrap
 	_wh(100%, auto)
@@ -141,7 +159,7 @@
 	left 0
 	width 100%
 	height 70%
-	background-color #f4f5f5
+	background-color rgba(246, 246, 246, 1)
 	box-shadow 0 -8px 16px 0 rgba(28,31,33,.1)
 	border-top-left-radius 20rpx
 	border-top-right-radius 20rpx

pages/login/login.vue

@@ -50,7 +50,7 @@
 			//#ifdef APP-PLUS
 				// 获取本地应用资源版本号
 				plus.runtime.getProperty(plus.runtime.appid, (info) => {
-					console.log(JSON.stringify(info));
+					// console.log(JSON.stringify(info));
 					this.version = info.version;
 					this.versionCode = info.versionCode ;
 				}) 
@@ -182,6 +182,7 @@
 .zd_content
 	position: relative
 	height: 100%
+	overflow: hidden
 .version-name
 	width 100%
 	position: absolute