页面开发

components/VNavigationBar.vue

@@ -27,9 +27,10 @@ export default {
 		  default: '#fff'
 		}
 	},
-	onLoad() {
+	mounted() {
 		// #ifdef MP
 		const {barHeight, barTop, menuButtonLeft} = getWXStatusHeight()
+		console.log('barHeight, barTop, menuButtonLeft: ',barHeight, barTop, menuButtonLeft);
 		this.homeHeaderPaddingTop = barTop || 0
 		this.homeHeaderMenuHeight = barHeight
 		this.homeHeaderMenuLeft = menuButtonLeft - 6

pages/message/message.vue

@@ -3,7 +3,7 @@
 		<VNavigationBarVue title="消息通知"></VNavigationBarVue>
 		<scroll-view scroll-y @scrolltolower="scrolltolower" class="mubu">
 			<view class="jsy" v-if="listArr.length == 0">
-				<image src="http://www.nuoyunr.com/lananRsc/detection/qs.png" mode=""></image>
+				<image src="http://www.nuoyunr.com/lananRsc/detection/qs.png" mode="aspectFit"></image>
 			</view>
 			<view class="noticeGroup" v-for="group in groupArr" :key="group.date">
 				<view class="noticeDate">{{ group.date }}</view>

pages/rescue/rescue.vue

@@ -82,7 +82,7 @@
 			<!-- #endif -->
 			<!-- #ifdef MP-WEIXIN -->
 			<view class="box">
-				<view class="xz-box" id="y1" @click="getsxwhat(1)">
+				<!-- <view class="xz-box" id="y1" @click="getsxwhat(1)">
 					<view class="box-wenzi">拖车</view>
 				</view>
 				<view class="xz-box" id="y2" @click="getsxwhat(2)">
@@ -93,7 +93,17 @@
 				</view>
 				<view class="xz-box" id="y4" @click="getsxwhat(4)">
 					<view class="box-wenzi">换胎</view>
-				</view>
+				</view> -->
+				<template v-for="(item, index) in busiTypeList">
+					<view :key="index" class="xz-box" :class="{ checked: busiType === index + 1 }" @click="getsxwhat(index + 1)">
+						<image class="xz-box-icon" :src="item.icon" mode="aspectFit"></image>
+						<view class="box-wenzi">{{item.label}}</view>
+						<view class="checkedFlag">
+						</view>
+						<!-- <uni-icons type="plus"></uni-icons> -->
+						<uni-icons class="checkedFlagIcon" type="checkmarkempty" size="22" color="#fff"></uni-icons>
+					</view>
+				</template>
 				<!-- 	<view class="xz-box" v-if="role[0] == 'jjdd' " id="y5" @click="getsx(5)">
 				<view class="box-wenzi">扣车</view>
 			</view> -->
@@ -138,7 +148,7 @@
 			</view>
 			<view class="tap-box">
 				<view class="ques" v-if="orderList.length== 0 ">
-					<image src="../../static/quesheng.png" mode=""></image>
+					<image src="../../static/quesheng.png" mode="aspectFit"></image>
 				</view>
 				<view style="display: flex;flex-direction: column;row-gap: 10px;" v-else>
 					<order-card @deleteOk="deleteOrderHandle" @refresh="getlist" v-for="(item, index) in orderList" :key="index" :orderData="item"></order-card>
@@ -198,7 +208,7 @@
 		</view>
 		<u-modal :show="showDelete" :title="title" :showCancelButton="true" @confirm="confirm"
 			@cancel="cancel"></u-modal>
-		<u-popup :show="showp" @close="close" @open="open" mode="center" :round="10">
+		<u-popup :show="showp" @close="close" mode="center" :round="10">
 			<scroll-view scroll-y style="height: 200px;">
 				<view class="box_">
 					<view class="title_">车辆提醒</view>
@@ -229,6 +239,27 @@
 	export default {
 		data() {
 			return {
+				busiTypeList: [{
+						label: '拖车',
+						icon: require('@/static/icons/order/tuoche.png')
+					},
+					{
+						label: '送油',
+						icon: require('@/static/icons/order/songyou.png')
+					},
+					{
+						label: '搭电',
+						icon: require('@/static/icons/order/dadian.png')
+					},
+					{
+						label: '换胎',
+						icon: require('@/static/icons/order/huantai.png')
+					},
+					// {
+					// 	label: '扣车',
+					// 	icon: require('@/static/icons/order/tuoche.png')
+					// },
+				],
 				topMenuList: [
 					{
 						title: '我的订单',
@@ -413,6 +444,7 @@
 				})
 			},
 			register() { //注册
+				// #ifdef APP
 				console.log('keepAlive', keepAlivePlugin);
 				keepAlivePlugin.register({
 						channelId: this.keepLive.channelId,
@@ -423,6 +455,7 @@
 					(res) => {
 						console.log('保活注册', res);
 					});
+				// #endif
 			},
 			deleteOrderHandle() {
 				this.pageNum = 1
@@ -697,6 +730,9 @@
 		background-image: url('~@/static/images/homeOrderCard/dzf.png');
 		background-size: cover;
 		background-position: center;
+		    display: flex;
+		    flex-direction: column;
+		    justify-content: center;
 	}
 
 	.boxf1 {
@@ -708,6 +744,9 @@
 		background-image: url('~@/static/images/homeOrderCard/dqc.png');
 		background-size: cover;
 		background-position: center;
+		    display: flex;
+		    flex-direction: column;
+		    justify-content: center;
 	}
 
 	.boxf2 {
@@ -719,6 +758,9 @@
 		background-image: url('~@/static/images/homeOrderCard/jyz.png');
 		background-size: cover;
 		background-position: center;
+		    display: flex;
+		    flex-direction: column;
+		    justify-content: center;
 	}
 
 	.boxf3 {
@@ -730,6 +772,9 @@
 		background-image: url('~@/static/images/homeOrderCard/ywc.png');
 		background-size: cover;
 		background-position: center;
+		    display: flex;
+		    flex-direction: column;
+		    justify-content: center;
 	}
 
 	.zi1 {
@@ -979,19 +1024,76 @@
 		flex-wrap: wrap;
 	}
 
+	// .xz-box {
+	// 	height: 80px;
+	// 	width: 48%;
+	// 	display: flex;
+	// 	justify-content: center;
+	// 	align-items: center;
+	// 	font-size: 16px;
+	// 	font-weight: 400;
+	// 	color: #FFFFFF;
+	// 	background-size: cover;
+	// 	background-position: center;
+	// 	margin-top: 20px;
+
+	// }
 	.xz-box {
-		height: 80px;
+		width: 330rpx;
-		width: 48%;
+		height: 396rpx;
+		background: #FFFFFF;
+		box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(0, 0, 0, 0.06);
+		border-radius: 16rpx;
 		display: flex;
+		flex-direction: column;
 		justify-content: center;
 		align-items: center;
 		font-size: 16px;
 		font-weight: 400;
 		color: #FFFFFF;
-		background-size: cover;
+		margin-top: 36rpx;
-		background-position: center;
+		transition: all ease 400ms;
-		margin-top: 20px;
+		overflow: hidden;
-
+	
+		.checkedFlagIcon {
+			display: none;
+		}
+	
+		&.checked {
+			box-sizing: border-box;
+			position: relative;
+			border: 2rpx solid #478AFA;
+	
+			.checkedFlag {
+				background-color: #478AFA;
+				width: 120rpx;
+				height: 120rpx;
+				position: absolute;
+				right: -60rpx;
+				bottom: -60rpx;
+				transform: rotate(45deg);
+				z-index: 1;
+			}
+	
+			.checkedFlagIcon {
+				display: inline-block;
+				position: absolute;
+				z-index: 2;
+				bottom: 0;
+				right: 0;
+			}
+		}
+	
+		.xz-box-icon {
+			width: 130rpx;
+			height: 130rpx;
+			margin-bottom: 26rpx;
+		}
+	
+		.box-wenzi {
+			font-size: 28rpx;
+			color: #000000;
+		}
 	}
 
 	#y1 {