样式

pages/home/home.vue

@@ -22,12 +22,13 @@
 			</view>
 		</view>
 		<view class="sec_menu_wraper" :class="show ? 'show' : 'hidden'">
-			<view class="cancel">
+			<!-- <view class="cancel">
 				<view class="iconfont cancel_icon" @tap="show = false"></view>
-			</view>
+			</view> -->
+			<view class="line"></view>
 			<view class="sec_menu_w">
-				<view class="sec_menu-item" v-for="(e, i) in secM" :key="i" @click="toPage2(e)">
-					<view class="menu-name_inner">{{e.name}}</view>
+				<view class="sec_menu-item" :style="{'background-image': 'url(' + require('../../static/image/menu/' + e.icon + '.png') + ')'}" v-for="(e, i) in secM" :key="i" @click="toPage2(e)">
+					<view class="menu-name_inner" :class="'bgc_' + (i + 1)">{{e.name}}</view>
 				</view>
 			</view>
 		</view>
@@ -40,7 +41,7 @@
 	export default {
 		data() {
 			return {
-				userName: '',
+				userName: 'admin',
 				menuList: [],
 				show: false,
 				secM: []
@@ -108,29 +109,30 @@
 .userInfo
 	_fj(,flex-start,column)
 .p1
-	_font(34rpx,1,#fff)
+	_font(32rpx,1,#fff)
 	padding-bottom 18rpx
 .p2
-	_font(26rpx,1,#fff)
+	_font(28rpx,1,#fff)
 .exit
 	_fj()
-	height 47rpx
-	padding 0 15rpx
+	height 48rpx
+	padding 0 20rpx
 	border 1px solid #FF967C
 	border-radius 20rpx
 .icon-exit
 	_wh(22rpx, 22rpx)
 	_bis('../../static/image/exit.png',22rpx)
 .exit-text
-	_font(24rpx,47rpx,#fff,,right)
+	_font(28rpx,48rpx,#fff,,right)
 	padding-left 10rpx
 .zd_home_wrapper
 	_wh(100%, calc(100% - 208rpx))
 	background-color #fff
 	border-radius: 12rpx;
-	padding: 14rpx;
+	padding: 24rpx 14rpx;
 	margin-bottom: 24rpx;
 	overflow-y auto
+	box-shadow 0 4rpx 10rpx 2rpx rgba(0,0,0,.1)
 .menu-wrap
 	_wh(100%, auto)
 	_fj(flex-start,flex-start,,wrap)
@@ -140,26 +142,30 @@
 	flex-direction column
 	_wh(30%, auto)
 	margin-bottom 40rpx
-	_font(26rpx, 60rpx,#e74f1a,,center)
+	_font(26rpx, 28rpx,#e74f1a,,center)
 	&:nth-child(3n+2)
 		margin-left 5%
 		margin-right 5%
 ::v-deep .menu-img 
 	_wh(100%, auto)
+	margin-bottom 16rpx
 	img
 		position relative
 		opacity 1
 		_wh(55%, auto)
+		background-color: #f3f5f8
+		box-shadow 8rpx 6rpx 10rpx 0px rgba(0,0,0,0.1)
+		padding 16rpx
+		border-radius 50%
 		margin 0 auto 0.2rpx
 .menu-name
-	_font(28rpx, 38rpx, #444,,center)
+	_font(28rpx, 30rpx, #444,,center)
 .sec_menu_wraper
 	position fixed
 	bottom 0
 	left 0
 	width 100%
-	height 70%
-	background-color rgba(246, 246, 246, 1)
+	background-color #f4f5f5
 	box-shadow 0 -8px 16px 0 rgba(28,31,33,.1)
 	border-top-left-radius 20rpx
 	border-top-right-radius 20rpx
@@ -178,20 +184,27 @@
 	_fj(flex-start)
 	flex-wrap wrap
 .sec_menu-item
-	_wh(32%, 150rpx)
+	_wh(30%, 120rpx)
 	margin-bottom 20rpx
-	background-color #fff
-	border 2px solid #dfe2e6
-	border-radius 20rpx
+	border-radius 10rpx
+	background-size 40% auto
+	background-position right 90%
+	background-repeat no-repeat
 	&:nth-child(3n+2)
-		margin-left 2%
-		margin-right 2%
+		margin-left 5%
+		margin-right 5%
 .menu-name_inner
 	_wh(100%, 100%)
 	_fj(center)
-	_font(28rpx, 34rpx, #444,,center)
+	_font(28rpx, 30rpx, #fff,,center)
+	border-radius 10rpx
 	padding 10rpx
 	overflow hidden
+.line
+	_wh(90rpx, 10rpx)
+	background-color #e0e0e1
+	border-radius 4rpx
+	margin 20rpx auto 40rpx
 .cancel
 	_wh(calc(100% - 76rpx), 100rpx)
 	margin 0 auto
@@ -202,4 +215,18 @@
 	transform: translateY(0)
 .hidden
 	transform: translateY(100%)
+.bgc_1
+	background linear-gradient(to right, rgba(73,102,255,0.8) 0%, rgba(117,142,255,0.8) 100%)
+.bgc_2
+	background linear-gradient(to right, rgba(254, 168, 20,0.8) 0%, rgba(255, 177, 1,0.8) 100%)
+.bgc_3
+	background linear-gradient(to right, rgba(0, 228, 153,0.8) 0%, rgba(0, 241, 197,0.8) 100%)
+.bgc_4
+	background linear-gradient(to right, rgba(162, 86, 171,0.8) 0%, rgba(183,120,190,0.8) 100%)
+.bgc_5
+	background linear-gradient(to right, rgba(146, 94, 52,0.8) 0%, rgba(162, 116, 79,0.8) 100%)
+.bgc_6
+	background linear-gradient(to right, rgba(83, 191, 194,0.8) 0%, rgba(119, 198, 201,0.8) 100%)
+.bgc_7
+	background linear-gradient(to right, rgba(244, 97, 61,0.8) 0%, rgba(245, 130, 102,0.8) 100%)
 </style>

pages/login/login.vue

@@ -84,9 +84,9 @@
 				})
 			},
 			async toLogin() {
-				// uni.redirectTo({
-				// 	url: '/pages/home/home'
-				// })
+				uni.redirectTo({
+					url: '/pages/home/home'
+				})
 				this.disabled = true
 				if (this.user === '') {
 					uni.showToast({
@@ -143,11 +143,11 @@
 <style lang="stylus" scoped>
 @import '../../common/style/mixin.styl';
 .p1
-  _font(60rpx,75rpx,#444)
+  _font(40rpx,75rpx,#444,666)
   padding-top: 90rpx
 .p2
-  _font(50rpx,1,#444)
-  padding: 40rpx 0 25rpx
+  _font(52rpx,1,#444,600)
+  padding: 10rpx 0 55rpx 0
 .input-box
   _fj()
   margin-top 68rpx
@@ -182,6 +182,9 @@
 .zd_content
 	position: relative
 	height: 100%
+	padding-left 40rpx
+	padding-right 40rpx
+	background linear-gradient(to bottom, #f8e6db 0%, #f6f6f6 30%, #f6f6f6 100%)
 	overflow: hidden
 .version-name
 	width 100%