自助预约页面优化

pagesA/makeAnPppointment/makeAnPppointment.vue

@@ -16,10 +16,14 @@
 					</view>
 					<view :style="{background:[ingColor,publicColor,failColor,failColor,failColor][item.status]}" class="fon24 colf radius10 flexs" style="padding: 14rpx 24rpx;">{{['审核中...','预约成功','预约失败','预约取消','预约完成'][item.status]}}</view>
 				</view>
-				<view class="mar-s36 fon24 col3">预约时间：{{item.yuTime}}</view>
+				<view class="mar-s36 leave-word fon24 col3"><text>预约时间：</text><text>{{item.yuTime}}</text></view>
 				<view class="disjbac fon24 col3 mar-s30">
 					<!-- <view>联系人：{{item.lname}}</view> -->
-					<view>联系电话：{{item.lphone}}</view>
+					<view class="leave-word"><text>联系电话：</text><text>{{item.lphone}}</text></view>
+				</view>
+				<view class="disjbac fon24 col3 mar-s30">
+					<!-- <view>联系人：{{item.lname}}</view> -->
+					<view class="leave-word"><text>留言信息：</text><text>{{item.remarks}}</text></view>
 				</view>
 				<view @tap="quyuy(index)" class="disjcac mar-s40 width100 colf fon30 radius10 posir" :style="{background:[quColor,quColor,publicColor,publicColor,publicColor][item.status]}" style="height: 90rpx;line-height: 90rpx;">
 					{{['取消预约','取消预约','重新预约','再次预约','再次预约'][item.status]}}
@@ -121,7 +125,8 @@
 									content:item.typeInfo.title,
 									yuTime:`${timeStr[0]}年${timeStr[1]}月${timeStr[2]}日 ${timeZui[0]}至${timeZui[1]}`,
 									lname:item.name,
-									lphone:item.phone
+									lphone:item.phone,
+									remarks:item.remarks,
 								}
 								this.dataList.push(obj)
 							})
@@ -162,5 +167,14 @@
 	}
 </script>
 
-<style>
+<style scoped>
+	.leave-word{
+		display: flex;
+	}
+	.leave-word>text:first-child{
+		width: 125rpx;
+	}
+	.leave-word>text:last-child{
+		width: calc(100% - 125rpx);
+	}
 </style>