修改

pages/order/index.vue

@@ -6,9 +6,9 @@
 
 		<!-- sticky吸顶悬浮的菜单, 父元素必须是 mescroll -->
 		<view class="sticky-tabs">
-			<view class=" u-flex padding ding-view">
+			<view class="ding-view">
 				<view class="u-m-r-10">
-					<image :src="avatar" style="width: 100rpx;height: 100rpx;border-radius: 100rpx;"
+					<image :src="avatar" class="head-port"
 						@click="goNav('/pages/my/userinfo')"></image>
 				</view>
 				<view class="u-flex-1 u-m-l-10 " v-if="isLogin && userName">
@@ -67,41 +67,41 @@
 				<view class="flex justify-between padding-sm">
 					<view v-if="item.overTimeOrders == 1" style="color: red;font-size: 26rpx">(订单已超时)</view>
 					<!-- <view class="text-green" v-if="item.status == 1">待支付</view> -->
-					<view class="text-green" v-if="item.status == 2">待服务</view>
+					<view class="progress-status" v-if="item.status == 2">待服务</view>
 					<view class="text-green" v-if="item.status == 3">已完成待评价</view>
 					<!-- <view class="text-green" v-if="item.status == 4" style="color: #999999;">已取消</view> -->
-					<view class="text-green" v-if="item.status == 5">已完成</view>
-					<view class="text-green" v-if="item.status == 6">服务中</view>
-					<view class="text-green" v-if="item.status == 7">技师出发</view>
-					<view class="text-green" v-if="item.status == 8">技师到达</view>
-					<view class="text-green" v-if="item.status ==9">确认接单</view>
+					<view class="progress-status" v-if="item.status == 5">已完成</view>
+					<view class="progress-status" v-if="item.status == 6">服务中</view>
+					<view class="progress-status" v-if="item.status == 7">技师出发</view>
+					<view class="progress-status" v-if="item.status == 8">技师到达</view>
+					<view class="progress-status" v-if="item.status ==9">确认接单</view>
 					<!-- <view class="text-green" v-if="item.state ==1 ||item.state ==2">待完成</view>
 			
 					<view class="text-green" v-if="item.state ==3||item.state ==4">已完成</view> -->
 
-					<view class="text-green">预约时间：{{ item.serveTime }}</view>
+					<view style="color: #333;">预约时间：{{ item.serveTime }}</view>
 					<view v-if="item.status == 9&& item.refusalContent" class="judan">
 						拒单审核中...
 					</view>
 				</view>
 				<view class="xian"></view>
-				<view class=" u-flex u-p-t-30 padding-sm">
+				<view class=" u-flex padding-sm">
 					<view class="u-m-r-10">
 						<u-avatar :src="item.massageImg ? item.massageImg : '../../static/logo.png'" mode="square"
 							size="100">
 						</u-avatar>
 					</view>
 					<view class="u-flex-1  margin-left-xs">
-						<view class="u-font-18  text-bold u-line-1 top-title">
-							<view class="margin-right-xs text-df margin-left-xs" style="margin-top: 0rpx;display: inline-block;width: 105px; overflow: hidden;white-space: nowrap;text-overflow: ellipsis;">
+						<view class="u-font-18  u-line-1 top-title">
+							<view class="margin-right-xs order-details ">
 								{{ item.title }}
 							</view>
-							<view class="flex-sub ">
-								实收：<text class="text-df">￥</text><text class="text-xl text-bold">{{ item.artificerMoneyTotal
+							<view class="flex-sub">
+								<text class="text-df">实收:￥</text><text class="text-xl text-bold">{{ item.artificerMoneyTotal
 									}}</text>
 							</view>
 						</view>
-						<view class="margin-left-xs text-cut" style="width:550upx">{{ item.address }}</view>
+						<view class="text-cut" style="width:550upx; color: #999;">{{ item.address }}</view>
 
 					</view>
 				</view>
@@ -114,7 +114,7 @@
 							@click="goNav('/my/order/pay?id=' + item.ordersId + '&isTrue=1')">查看详情</u-button> -->		
 						<view class="showBtn">
 							<view class="gengduo" @click.stop="gengBtn(index)">更多</view>
-							<view class="showBtn-view">
+							<view class="order-status showBtn-view">
 								<u-button :custom-style="customStyle" shape="circle" :plain="true"
 									@click="goChat">联系客服</u-button>
 								<u-button :custom-style="customStyle" v-if="item.status == 1||item.status == 7||item.status == 8||item.status == 9" shape="circle" :plain="true"
@@ -144,7 +144,7 @@
 				</view>
 				<view class="xian" v-if="item.status == 6"></view>
 				<view class="pintuan_syrs flex justify-between" v-if="item.status == 6">
-					<view style="font-size: 28rpx;font-family: PingFang SC;font-weight: bold;color: #096f4b;">服务倒计时
+					<view style="font-size: 28rpx;font-family: PingFang SC;font-weight: bold;color: #fe9130;">服务倒计时
 					</view>
 					<u-count-down :timestamp="endOfServiceTimer" separator-color="#20C675" color="#20C675"
 						font-size="30" separator-size="30"></u-count-down>
@@ -242,11 +242,11 @@
 				}, {
 					activityImageProps: {
 						src: '../../static/images/order_02.png',
-						style: 'width: 26px;height: 26px;',
+						style: 'width: 30px;height: 30px;',
 					},
 					noactivityImageProps: {
 						src: '../../static/images/order_022.png',
-						style: 'width: 26px;height: 26px;',
+						style: 'width: 30px;height: 30px;',
 					},
 					activityTitleTextProps: {
 						class: 'activityTitleTextProps',
@@ -259,11 +259,11 @@
 				}, {
 					activityImageProps: {
 						src: '../../static/images/order_03.png',
-						style: 'width: 26px;height: 26px;',
+						style: 'width: 30px;height: 30px;',
 					},
 					noactivityImageProps: {
 						src: '../../static/images/order_033.png',
-						style: 'width: 26px;height: 26px;',
+						style: 'width: 30px;height: 30px;',
 					},
 					activityTitleTextProps: {
 						class: 'activityTitleTextProps',
@@ -276,11 +276,11 @@
 				}, {
 					activityImageProps: {
 						src: '../../static/images/order_04.png',
-						style: 'width: 26px;height: 26px;',
+						style: 'width: 30px;height: 30px;',
 					},
 					noactivityImageProps: {
 						src: '../../static/images/order_044.png',
-						style: 'width: 26px;height: 26px;',
+						style: 'width: 28px;height: 30px;',
 					},
 					activityTitleTextProps: {
 						class: 'activityTitleTextProps',
@@ -872,6 +872,11 @@
 		flex-direction: row;
 		align-items: center;
 	}
+	.order-status{
+		width: 90%;
+		display: flex;
+		flex-direction: row;
+	}
 	.showBtn{
 		justify-content: space-between;
 	}
@@ -885,11 +890,12 @@
 		
 	}
 	/deep/.text-xl{
-		font-size: 15px;
+		font-size: 34rpx;
+		color: #fe9130;
 	}
 	.flex-sub{
 		text-align: right;
-		font-size: 13px;
+		font-size: 28rpx;
 	}
 	.top-title{
 		width: 95%;
@@ -1004,10 +1010,10 @@
 	   background: linear-gradient(-90deg, #019C88, #1BB9A5, #029D88);
 	   border-radius: 24rpx;
 	   margin: 10px auto 0px auto;
-	   align-items: end;
 	   display: flex;
 	   flex-direction: row;
 	   justify-content: space-between;
+	   padding:30rpx;
    }
 	.content{
 		width: 100%;
@@ -1018,7 +1024,7 @@
 		display: flex;
 		flex-direction: column;
 		align-items: center;
-		padding: 30px 0px;
+		padding: 10px 0px;
 	}
 
 	.u-tabs {
@@ -1031,7 +1037,7 @@
 	}
 
 	/deep/.u-scroll-view {
-		padding: 10px 16px !important;
+		padding: 10px 0px !important;
 	}
 
 	/deep/.u-tab-item {
@@ -1054,7 +1060,7 @@
 	}
 
 	/deep/.activityTitleTextProps {
-		color: #096f4b;
+		color: #019c88;
 		font-size: 14px;
 	}
 
@@ -1094,7 +1100,7 @@
 		width: 100%;
 		height: 1rpx;
 		border: 1rpx solid #f8f8f8;
-		margin-top: 20rpx;
+		margin-bottom: 20rpx;
 	}
 
 	.pintuan_syrs {
@@ -1125,4 +1131,22 @@
 			margin-right: 8rpx;
 		}
 	}
+	.head-port{
+		width: 110rpx;
+		height: 110rpx;
+		border-radius: 50%;
+		border: 1px #d6f2ee solid;
+	}
+	/deep/.radius {
+		border-radius: 20rpx;
+	}
+	.progress-status{
+		color: #019c88;
+		font-weight: bold;
+		font-size: 30rpx;
+	}
+	.order-details{
+		font-size: 34rpx;
+		
+	}
 </style>