# Order Detail Address Display Fix (订单详情地址显示修复)

## Issue
The order detail view was only showing the detailed address (`shipping_address`) without displaying the province, city, and district information.

## Changes Made

### 1. Added Computed Property for Full Address
**File**: `admin/src/views/consumer/prescription/order_list.vue`

Added `detailFullAddress` computed property that combines all address components:

```typescript
// 完整收货地址（省市区 + 详细地址）
const detailFullAddress = computed(() => {
    const d = detailData.value
    if (!d) return '—'
    
    const parts = []
    if (d.shipping_province) parts.push(d.shipping_province)
    if (d.shipping_city) parts.push(d.shipping_city)
    if (d.shipping_district) parts.push(d.shipping_district)
    if (d.shipping_address) parts.push(d.shipping_address)
    
    return parts.length > 0 ? parts.join(' ') : '—'
})
```

### 2. Updated Display Template
Changed the shipping address display from:
```vue
<el-descriptions-item label="收货地址" :span="2">
    {{ detailData.shipping_address }}
</el-descriptions-item>
```

To:
```vue
<el-descriptions-item label="收货地址" :span="2">
    {{ detailFullAddress }}
</el-descriptions-item>
```

## Display Format

### Before:
```
收货地址: 顶顶顶
```

### After:
```
收货地址: 北京市 北京市 丰台区 顶顶顶
```

## Logic

The `detailFullAddress` computed property:
1. Checks if `detailData` exists
2. Collects non-empty address components in order:
   - `shipping_province` (省)
   - `shipping_city` (市)
   - `shipping_district` (区/县)
   - `shipping_address` (详细地址)
3. Joins them with spaces
4. Returns '—' if no address components exist

## Examples

### Complete Address:
```
Input:
  shipping_province: "四川省"
  shipping_city: "成都市"
  shipping_district: "武侯区"
  shipping_address: "天府大道中段666号"

Output:
  四川省 成都市 武侯区 天府大道中段666号
```

### Partial Address (Missing Province):
```
Input:
  shipping_province: null
  shipping_city: "成都市"
  shipping_district: "武侯区"
  shipping_address: "天府大道中段666号"

Output:
  成都市 武侯区 天府大道中段666号
```

### Only Detailed Address:
```
Input:
  shipping_province: null
  shipping_city: null
  shipping_district: null
  shipping_address: "天府大道中段666号"

Output:
  天府大道中段666号
```

### No Address:
```
Input:
  shipping_province: null
  shipping_city: null
  shipping_district: null
  shipping_address: null

Output:
  —
```

## Testing Steps

### 1. Test Complete Address Display
1. Open an order that has province/city/district data
2. Check the "收货地址" field in the detail view
3. Verify it shows: `省 市 区 详细地址`

### 2. Test Legacy Orders (No Region Data)
1. Open an old order that only has `shipping_address`
2. Verify it still displays the detailed address correctly
3. Should show just the detailed address without extra spaces

### 3. Test Empty Address
1. Create an order without any address information
2. Verify it displays "—" instead of empty string

### 4. Test Different Address Combinations
Test various combinations:
- Full address (province + city + district + detail)
- City + district + detail (no province)
- District + detail (no province/city)
- Detail only (no region data)
- Empty (no data at all)

## Related Files

### Frontend:
- `admin/src/views/consumer/prescription/order_list.vue`
  - Added `detailFullAddress` computed property
  - Updated shipping address display template

### Backend:
- `server/app/adminapi/logic/tcm/PrescriptionOrderLogic.php`
  - Already returns `shipping_province`, `shipping_city`, `shipping_district` in detail response

### Database:
- `tcm_prescription_order` table
  - Columns: `shipping_province`, `shipping_city`, `shipping_district`, `shipping_address`

## Benefits

✅ **Complete Information**: Users can now see the full address including province/city/district  
✅ **Better Readability**: Address components are clearly separated with spaces  
✅ **Backward Compatible**: Works with legacy orders that only have detailed address  
✅ **Graceful Handling**: Shows "—" when no address data exists  
✅ **Flexible**: Handles partial address data (missing province, city, or district)  

## Summary

The order detail view now displays the complete shipping address including province, city, district, and detailed address, providing users with full address information at a glance!