对接数据库,模拟第三方接入信息
This commit is contained in:
@@ -2,6 +2,7 @@
|
||||
<view class="container">
|
||||
<!-- 头部状态栏 (沉浸式) -->
|
||||
<view class="status-header">
|
||||
<text class="back-link-white" @click="goBack">⬅ 返回</text>
|
||||
<view class="status-main">
|
||||
<text class="status-icon">{{ getStatusIcon(order.status) }}</text>
|
||||
<view class="status-text-wrap">
|
||||
@@ -40,17 +41,13 @@
|
||||
<view class="content">
|
||||
<view class="event-header">
|
||||
<view class="status-time-row">
|
||||
<text v-if="shouldShowStatus(index)" class="status-label" :class="{active: index === 0}">{{ getStatusLabel(event.status_code) }}</text>
|
||||
<text class="status-label" :class="{active: index === 0}">{{ getStatusLabel(event.status_code) }}</text>
|
||||
<text class="event-time" :class="{active: index === 0}">{{ event.event_time }}</text>
|
||||
</view>
|
||||
<view class="event-title-row">
|
||||
<text v-for="(seg, i) in splitText(event.event_text)" :key="i" class="event-title-text" :class="{ 'highlight': seg.isPhone, 'active': index === 0 }" @click="seg.isPhone ? makeCall(seg.raw as string) : null">{{ seg.text }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="event.location" class="location-info">
|
||||
<text class="loc-icon">📍</text>
|
||||
<text class="loc-text">{{ event.location }}</text>
|
||||
</view>
|
||||
<!-- 证据/签收图片 (POD) -->
|
||||
<view v-if="event.evidence_urls.length > 0" class="evidence-grid">
|
||||
<image v-for="(img, idx) in event.evidence_urls" :key="idx" :src="img" class="evidence-img" mode="aspectFill" @click="previewImage(img, event.evidence_urls)" />
|
||||
@@ -123,15 +120,19 @@
|
||||
this.loadData()
|
||||
},
|
||||
methods: {
|
||||
loadData() {
|
||||
const orders = mockService.getMockOrders()
|
||||
goBack() {
|
||||
uni.navigateBack()
|
||||
},
|
||||
async loadData() {
|
||||
const orders = await mockService.getMockOrders()
|
||||
const found = orders.find((o: MockOrder): boolean => o.order_no === this.orderNo)
|
||||
if (found != null) {
|
||||
// 确保对象引用更新以触发响应式
|
||||
this.order = { ...found } as MockOrder
|
||||
}
|
||||
// 确保数组引用更新
|
||||
this.statusHistory = [...mockService.getMockTracking(this.orderNo)]
|
||||
const tracking = await mockService.getMockTracking(this.orderNo)
|
||||
this.statusHistory = [...tracking]
|
||||
},
|
||||
getStatusText(status: string): string {
|
||||
const maps = {
|
||||
@@ -237,6 +238,12 @@
|
||||
padding: 60rpx 40rpx;
|
||||
color: #ffffff;
|
||||
}
|
||||
.back-link-white {
|
||||
color: #ffffff;
|
||||
font-size: 28rpx;
|
||||
margin-bottom: 20rpx;
|
||||
display: block;
|
||||
}
|
||||
.status-main {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -428,7 +435,6 @@
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
.status-label.active {
|
||||
color: #007AFF;
|
||||
@@ -452,20 +458,6 @@
|
||||
.event-time.active {
|
||||
color: #007AFF;
|
||||
}
|
||||
.event-time.active {
|
||||
color: #666;
|
||||
}
|
||||
.location-info {
|
||||
margin-top: 12rpx;
|
||||
background-color: #f9fafb;
|
||||
padding: 10rpx 16rpx;
|
||||
border-radius: 8rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
}
|
||||
.loc-icon { font-size: 20rpx; }
|
||||
.loc-text { font-size: 22rpx; color: #666; }
|
||||
.evidence-grid {
|
||||
display: flex;
|
||||
gap: 16rpx;
|
||||
|
||||
Reference in New Issue
Block a user