优化

ghsApp/src/pagesOrder/detail.vue

@@ -156,7 +156,7 @@
 						<i class="iconfont icondagou" style="font-size:35upx;"></i>
 					</view>
 				</view>
-				<view class="order-info_box" v-if="detailInfo.status != 1 && detailInfo.status!=5">
+				<view class="order-info_box" v-if="detailInfo.status != 1 && detailInfo.status!=5 && (detailInfo.payWay==0 || detailInfo.payWay==1)">
 					<view>在线支付：</view>
 					<view v-if="detailInfo.onlinePay == 1" style="color:red;font-weight:bold;">否</view>
 					<view v-else style="color:#3385ff;font-weight:bold;">是</view>
@@ -184,15 +184,20 @@
 						<button @click='pageTo({url:"/pagesArrears/details",query: {id: detailInfo.customId}})' class="admin-button-com" style="border:1upx solid red;color:red;">全部挂账</button>
 					</view>
 				</view>
-				<view class="order-info_box" v-if="detailInfo.status != 1 && detailInfo.status!=5 && !$util.isEmpty(detailInfo.orderClearList)">
-					<view>账单信息：</view>
+				<!-- 结账信息：每行一条，首条与左侧「结账信息」水平对齐 -->
+				<view class="order-info_box order-clear-bills" v-if="detailInfo.status != 1 && detailInfo.status!=5 && !$util.isEmpty(detailInfo.orderClearList)">
+					<view class="order-clear-bills__label">结账信息：</view>
 					<view class="order-clear-bills__links">
-						<text
+						<view
 							v-for="(bill, billIndex) in detailInfo.orderClearList"
 							:key="billIndex"
 							class="order-clear-bills__link"
+							:class="{ 'order-clear-bills__link--first': billIndex === 0 }"
 							@click.stop="goClearBill(bill)"
-						>{{ bill.clearSn ? bill.clearSn : ('结账单' + (billIndex + 1)) }}<text v-if="Number(bill.amount)>0" class="order-clear-bills__amt"> 本单销¥{{ parseFloat(bill.amount) }}</text></text>
+						>
+							<text class="order-clear-bills__sn">{{ formatClearBillLabel(bill) }}</text>
+							<text v-if="Number(bill.amount) > 0" class="order-clear-bills__amt">¥{{ parseFloat(bill.amount) }}</text>
+						</view>
 					</view>
 				</view>
 				<view class="order-info_box" style="margin-top:40upx;">
@@ -1273,6 +1278,15 @@ export default {
 			}
 			this.pageTo({ url: '/admin/clear/customInfo', query: { id } })
 		},
+		/**
+		 * 结账单短文案：前缀「结账单」+ clearSn 后四位。
+		 * 完整单号过长，后四位便于列表内区分多笔结账。
+		 */
+		formatClearBillLabel(bill) {
+			const sn = bill && bill.clearSn != null ? String(bill.clearSn) : ''
+			const tail = sn ? sn.slice(-4) : ''
+			return '结账单' + tail
+		},
 		modifyAddress(){
 			this.$util.pageTo({url: '/pagesOrder/modify?id='+this.detailInfo.id})
 		},
@@ -1984,22 +1998,47 @@ export default {
 			}
 		}
 	}
+	/* 覆盖父级 align-items:center，保证「结账信息」与第一条水平顶对齐 */
+	.bills-info_box > .order-info_box.order-clear-bills {
+		align-items: flex-start;
+		margin-top: 16upx;
+	}
+	.order-clear-bills__label {
+		font-size: 26upx;
+		line-height: 40upx;
+		font-weight: 400;
+	}
 	.order-clear-bills__links {
 		flex: 1;
 		display: flex;
-		flex-wrap: wrap;
+		flex-direction: column;
+		min-width: 0;
 	}
 	.order-clear-bills__link {
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		box-sizing: border-box;
+		width: 100%;
 		color: #3385ff;
-		font-weight: bold;
-		margin-right: 20upx;
-		margin-bottom: 15upx;
+		line-height: 40upx;
+		margin-top: 12upx;
+	}
+	.order-clear-bills__link--first {
+		margin-top: 0;
+	}
+	.order-clear-bills__sn {
+		color: #3385ff;
+		font-size: 28upx;
+		font-weight: 400;
+		line-height: 40upx;
 	}
 	.order-clear-bills__amt {
-		font-weight: normal;
-		font-size: 26upx;
-		margin-left: 20upx;
-		font-weight: bold;
+		color: red;
+		font-size: 28upx;
+		margin-left: 8upx;
+		font-weight: 400;
+		line-height: 40upx;
 	}
 	.content-box {
 		background-color: #ffffff;