整理初始化迁移并优化订单和用户菜单

This commit is contained in:
yml2213
2026-06-10 16:21:01 +08:00
parent 70a35204b3
commit 3e0a1a2d4b
6 changed files with 149 additions and 100 deletions
+2 -2
View File
@@ -165,8 +165,8 @@ export async function fetchPostRentalNotice() {
}
export async function fetchOrders() {
const { data } = await apiClient.get<ApiResponse<Order[]>>('/orders')
return data.data
const { data } = await apiClient.get<ApiResponse<{ items: Order[] }>>('/orders')
return Array.isArray(data.data?.items) ? data.data.items : []
}
export async function fetchOrder(id: string | number) {
@@ -34,7 +34,8 @@ onMounted(() => {
async function loadOrders() {
loading.value = true
try {
orders.value = await fetchOrders()
const items = await fetchOrders()
orders.value = Array.isArray(items) ? items : []
} catch {
showToast({ message: '订单加载失败,请稍后重试', icon: 'warning-o' })
} finally {
@@ -42,11 +42,11 @@ const displayOrders = computed(() => {
const keyword = searchKeyword.value.trim().toLowerCase()
filtered = filtered.filter(
order =>
order.order_no.toLowerCase().includes(keyword) ||
textValue(order.order_no).toLowerCase().includes(keyword) ||
formatListingCode(order).toLowerCase().includes(keyword) ||
String(order.listing_id).includes(keyword) ||
String(order.account_id).includes(keyword) ||
order.title.toLowerCase().includes(keyword)
textValue(order.title).toLowerCase().includes(keyword)
)
}
@@ -85,7 +85,8 @@ function handleTabChange(tab: string | number) {
async function loadOrders() {
loading.value = true
try {
orders.value = await fetchOrders()
const items = await fetchOrders()
orders.value = Array.isArray(items) ? items : []
} finally {
loading.value = false
}
@@ -143,14 +144,29 @@ function money(value: unknown) {
return formatMoney(Number(value || 0))
}
function shortenOrderNo(orderNo: string) {
if (orderNo.length <= 20) return orderNo
return `${orderNo.slice(0, 12)}...${orderNo.slice(-6)}`
function textValue(value: unknown) {
return typeof value === 'string' ? value : ''
}
async function copyOrderNo(orderNo: string) {
function orderNoText(orderNo: unknown) {
return textValue(orderNo) || '订单号未生成'
}
function shortenOrderNo(orderNo: unknown) {
const value = orderNoText(orderNo)
if (value === '订单号未生成') return value
if (value.length <= 20) return value
return `${value.slice(0, 12)}...${value.slice(-6)}`
}
async function copyOrderNo(orderNo: unknown) {
const value = textValue(orderNo)
if (!value) {
ElMessage.warning('订单号未生成,暂无法复制')
return
}
try {
await navigator.clipboard.writeText(orderNo)
await navigator.clipboard.writeText(value)
ElMessage.success('订单号已复制')
} catch {
ElMessage.error('复制失败')
+111 -65
View File
@@ -12,7 +12,6 @@ import {
EditPen,
Finished,
House,
InfoFilled,
Search,
Service,
Shop,
@@ -201,45 +200,43 @@ async function handleSupportClick() {
<Transition name="dropdown">
<div v-if="showUserDropdown" class="pc-user-dropdown-container">
<div class="pc-user-dropdown">
<RouterLink class="dropdown-item" to="/profile" @click="showUserDropdown = false">
<el-icon><EditPen /></el-icon>
<span>个人资料</span>
</RouterLink>
<RouterLink class="dropdown-item" to="/orders" @click="showUserDropdown = false">
<el-icon><Tickets /></el-icon>
<span>我的订单</span>
</RouterLink>
<RouterLink class="dropdown-item" to="/wallet" @click="showUserDropdown = false">
<el-icon><Wallet /></el-icon>
<span>我的钱包</span>
</RouterLink>
<RouterLink
class="dropdown-item"
to="/seller/listings/create"
@click="showUserDropdown = false"
>
<el-icon><CirclePlus /></el-icon>
<span>发布账号</span>
</RouterLink>
<RouterLink
class="dropdown-item"
to="/realname"
@click="showUserDropdown = false"
>
<el-icon><DocumentChecked /></el-icon>
<span>实名认证</span>
<span class="dropdown-status" :class="`is-${realnameBadge.tone}`">
{{ realnameBadge.text }}
</span>
</RouterLink>
<RouterLink
class="dropdown-item"
to="/post-rental-notice"
@click="showUserDropdown = false"
>
<el-icon><InfoFilled /></el-icon>
<span>租后须知</span>
</RouterLink>
<div class="dropdown-basic-grid">
<RouterLink
class="dropdown-basic-item"
to="/profile"
@click="showUserDropdown = false"
>
<el-icon><EditPen /></el-icon>
<span>个人资料</span>
</RouterLink>
<RouterLink
class="dropdown-basic-item"
to="/orders"
@click="showUserDropdown = false"
>
<el-icon><Tickets /></el-icon>
<span>我的订单</span>
</RouterLink>
<RouterLink
class="dropdown-basic-item"
to="/wallet"
@click="showUserDropdown = false"
>
<el-icon><Wallet /></el-icon>
<span>我的钱包</span>
</RouterLink>
<RouterLink
class="dropdown-basic-item"
to="/realname"
@click="showUserDropdown = false"
>
<el-icon><DocumentChecked /></el-icon>
<span>实名认证</span>
<span class="dropdown-status" :class="`is-${realnameBadge.tone}`">
{{ realnameBadge.text }}
</span>
</RouterLink>
</div>
<div class="dropdown-divider"></div>
<section class="dropdown-service-group">
@@ -271,11 +268,11 @@ async function handleSupportClick() {
<div class="dropdown-service-head">
<span>卖家服务</span>
</div>
<div class="dropdown-seller-list">
<div class="dropdown-seller-grid">
<RouterLink
v-for="item in sellerServiceItems"
:key="item.label"
class="dropdown-seller-item"
class="dropdown-seller-card"
:to="item.to"
@click="showUserDropdown = false"
>
@@ -662,8 +659,8 @@ async function handleSupportClick() {
}
.pc-user-dropdown {
width: 324px;
padding: 10px;
width: 388px;
padding: 14px;
border-radius: 14px;
background: #fff;
border: 1px solid #eef1f5;
@@ -691,12 +688,12 @@ async function handleSupportClick() {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 54px;
height: 22px;
min-width: 50px;
height: 20px;
margin-left: auto;
padding: 0 8px;
padding: 0 7px;
border-radius: 999px;
font-size: 12px;
font-size: 11px;
font-weight: 800;
line-height: 1;
white-space: nowrap;
@@ -732,21 +729,66 @@ async function handleSupportClick() {
.dropdown-divider {
height: 1px;
margin: 6px 10px;
margin: 12px 6px;
background: #f1f5f9;
}
.dropdown-basic-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 8px;
}
.dropdown-basic-item {
display: flex;
align-items: center;
gap: 9px;
min-width: 0;
min-height: 42px;
padding: 0 12px;
border-radius: 10px;
background: #f8fafc;
color: #475569;
font-size: 13px;
font-weight: 800;
text-decoration: none;
transition: all 0.2s;
}
.dropdown-basic-item .el-icon {
flex: 0 0 auto;
color: #94a3b8;
font-size: 16px;
}
.dropdown-basic-item span:not(.dropdown-status) {
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.dropdown-basic-item:hover {
background: #fff3e8;
color: #ff6a00;
transform: translateY(-1px);
}
.dropdown-basic-item:hover .el-icon {
color: #ff6a00;
}
.dropdown-service-group {
padding: 6px 4px 4px;
padding: 0 2px;
}
.dropdown-service-head {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 8px 8px;
padding: 0 2px 8px;
color: #17233d;
font-size: 13px;
font-size: 14px;
font-weight: 900;
}
@@ -768,7 +810,7 @@ async function handleSupportClick() {
}
.dropdown-service-card,
.dropdown-seller-item {
.dropdown-seller-card {
text-decoration: none;
transition: all 0.2s;
}
@@ -776,7 +818,7 @@ async function handleSupportClick() {
.dropdown-service-card {
display: grid;
min-width: 0;
min-height: 68px;
min-height: 74px;
place-items: center;
gap: 6px;
padding: 8px 4px;
@@ -799,35 +841,39 @@ async function handleSupportClick() {
transform: translateY(-1px);
}
.dropdown-seller-list {
.dropdown-seller-grid {
display: grid;
gap: 6px;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 8px;
}
.dropdown-seller-item {
display: flex;
.dropdown-seller-card {
display: grid;
place-items: center;
align-items: center;
gap: 10px;
min-height: 36px;
padding: 0 10px;
gap: 8px;
min-height: 72px;
padding: 10px 6px;
border-radius: 10px;
background: #f8fafc;
color: #475569;
font-size: 13px;
font-weight: 800;
text-align: center;
}
.dropdown-seller-item .el-icon {
.dropdown-seller-card .el-icon {
color: #94a3b8;
font-size: 16px;
font-size: 18px;
}
.dropdown-seller-item:hover {
.dropdown-seller-card:hover {
background: #fff3e8;
color: #ff6a00;
transform: translateY(-1px);
}
.dropdown-seller-item:hover .el-icon {
.dropdown-seller-card:hover .el-icon {
color: #ff6a00;
}