diff --git a/src/views/Address.vue b/src/views/Address.vue
index 42a715b..e4c9dde 100644
--- a/src/views/Address.vue
+++ b/src/views/Address.vue
@@ -44,15 +44,18 @@
>
-
- {{ address.province }} {{ address.city }} {{ address.district }} {{ address.detailAddress }}
+ {{ address.recipientName }}
+ {{ address.recipientPhone }}
@@ -300,6 +303,23 @@ const loadAddresses = async () => {
if (response.data.success) {
addresses.value = response.data.data.addresses || []
} else {
+ addresses.value = [{
+ recipientName: '张三',
+ recipientPhone: '11111111111',
+ province: '浙江省',
+ city: '宁波市',
+ district: '鄞州区',
+ detailAddress: '宁波外经合作大厦',
+ isDefault: true
+ },{
+ recipientName: '李四',
+ recipientPhone: '22222222222',
+ province: '浙江省',
+ city: '宁波市',
+ district: '鄞州区',
+ detailAddress: '四明东路',
+ isDefault: false
+ }]
throw new Error(response.data.message || '获取地址列表失败')
}
} catch (error) {
@@ -520,7 +540,6 @@ onMounted(() => {
.address-item {
background: white;
border-radius: 8px;
- padding: 16px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
transition: all 0.3s ease;
}
@@ -530,20 +549,40 @@ onMounted(() => {
}
.default-address {
- border: 2px solid #409eff;
+ border: 2px solid #ffc640;
}
.address-info {
margin-bottom: 12px;
+ flex: 1;
}
.address-header {
display: flex;
- align-items: center;
+ align-items: flex-start;
gap: 12px;
margin-bottom: 8px;
}
+.address-location {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ flex: 1;
+}
+
+.region-info {
+ font-size: 16px;
+ color: #333;
+ margin-bottom: 4px;
+}
+
+.detail-info {
+ font-size: 14px;
+ color: #666;
+ font-weight: normal;
+}
+
.recipient-name {
font-size: 16px;
font-weight: 500;
@@ -551,12 +590,14 @@ onMounted(() => {
}
.recipient-phone {
- font-size: 14px;
+ font-size: 16px;
color: #666;
}
.default-tag {
font-size: 12px;
+ margin-left: auto;
+ align-self: flex-start;
}
.address-detail {
@@ -566,12 +607,17 @@ onMounted(() => {
color: #666;
font-size: 14px;
line-height: 1.5;
+ margin-left: 0;
+ justify-content: flex-end;
}
.address-actions {
display: flex;
gap: 16px;
justify-content: flex-end;
+ margin-top: 12px;
+ padding-top: 12px;
+ border-top: 1px solid #f0f0f0;
}
.edit-btn {