feat(admin): modernize business views including listings, review, users, orders, pickups, and mohong
This commit is contained in:
yml2213
@@ -899,110 +899,115 @@ function paymentPaidAt(record: AdminPayment) {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<section class="page" v-loading="loading">
|
||||
<div v-if="order" class="page-header-row">
|
||||
<div class="page-header">
|
||||
<p class="eyebrow">{{ order.order_no }}</p>
|
||||
<h1>订单详情</h1>
|
||||
<p>
|
||||
商品编号 {{ listingCode }} · {{ order.title }} · {{ order.server_region }} /
|
||||
{{ order.login_platform }}
|
||||
</p>
|
||||
<div class="finance-page-container" v-loading="loading">
|
||||
<!-- 头部卡片 -->
|
||||
<header v-if="order" class="page-header-card">
|
||||
<div class="header-main">
|
||||
<div class="title-group">
|
||||
<div class="eyebrow-tag">
|
||||
<span>ORDER: {{ order.order_no }}</span>
|
||||
</div>
|
||||
<h1 class="page-title">订单详情</h1>
|
||||
<p class="page-subtitle">
|
||||
商品编号 {{ listingCode }} · {{ order.title }} · {{ order.server_region }} /
|
||||
{{ order.login_platform }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="toolbar-actions">
|
||||
<RouterLink :to="returnTarget">
|
||||
<el-button>{{ returnLabel }}</el-button>
|
||||
</RouterLink>
|
||||
<el-button v-if="canResetHandoff" type="success" @click="openAction('reset')">
|
||||
{{ resetActionLabel }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="canPlatformHandoff"
|
||||
class="platform-handoff-button"
|
||||
type="primary"
|
||||
@click="openPlatformHandoff"
|
||||
>
|
||||
{{ platformHandoffAction?.label || '客服代交接' }}
|
||||
</el-button>
|
||||
<el-button v-if="canForceHandoff" type="warning" @click="openForceHandoff">
|
||||
{{ forceHandoffAction?.label || '客服一键交接' }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="canPlatformCheckoutConfirm"
|
||||
type="primary"
|
||||
@click="openAction('platform_checkout_confirm')"
|
||||
>
|
||||
{{ platformCheckoutConfirmAction?.label || '客服确认结账' }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="canPlatformCheckoutCounter"
|
||||
type="warning"
|
||||
plain
|
||||
@click="openPlatformCheckoutCounter"
|
||||
>
|
||||
{{ platformCheckoutCounterAction?.label || '客服修改结账方案' }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="canPlatformCheckoutDispute"
|
||||
type="warning"
|
||||
@click="openAction('platform_checkout_dispute')"
|
||||
>
|
||||
{{ platformCheckoutDisputeAction?.label || '发起结账争议' }}
|
||||
</el-button>
|
||||
<el-button v-if="canOfflineSettlement" type="success" @click="openOfflineSettlement">
|
||||
{{ offlineSettlementAction?.label || '确认线下结算' }}
|
||||
</el-button>
|
||||
<el-button v-if="canAdminCreateDispute" type="warning" plain @click="openAdminDispute">
|
||||
发起申诉
|
||||
</el-button>
|
||||
<el-button type="warning" :disabled="!canOperate" @click="openAction('abnormal')"
|
||||
>标记异常</el-button
|
||||
>
|
||||
<el-tooltip :content="closeActionTip" placement="top">
|
||||
<span>
|
||||
<el-button type="danger" :disabled="!canOperate" @click="confirmCloseAction"
|
||||
>客服关闭</el-button
|
||||
>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="sealActionTip" placement="top">
|
||||
<span>
|
||||
<el-button type="danger" plain :disabled="!canOperate" @click="confirmSealAction"
|
||||
>封存订单</el-button
|
||||
>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-tooltip v-if="canHoldDeposit" :content="depositHoldActionTip" placement="top">
|
||||
<span>
|
||||
<el-button type="warning" plain @click="confirmHoldDeposit"> 暂扣押金 </el-button>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-tooltip v-if="isDepositHeld" :content="depositReleaseActionTip" placement="top">
|
||||
<span>
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
:disabled="!canReleaseDeposit"
|
||||
@click="confirmReleaseDeposit"
|
||||
>
|
||||
归还押金
|
||||
</el-button>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="refundActionTip" placement="top">
|
||||
<span>
|
||||
<el-button
|
||||
type="primary"
|
||||
:loading="refunding"
|
||||
:disabled="refundButtonDisabled"
|
||||
@click="confirmRefund"
|
||||
>
|
||||
{{ refundButtonDisabled ? '已退款' : '人工退款' }}
|
||||
</el-button>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
<div class="toolbar-actions">
|
||||
<RouterLink :to="returnTarget">
|
||||
<el-button>{{ returnLabel }}</el-button>
|
||||
</RouterLink>
|
||||
<el-button v-if="canResetHandoff" type="success" @click="openAction('reset')">
|
||||
{{ resetActionLabel }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="canPlatformHandoff"
|
||||
class="platform-handoff-button"
|
||||
type="primary"
|
||||
@click="openPlatformHandoff"
|
||||
>
|
||||
{{ platformHandoffAction?.label || '客服代交接' }}
|
||||
</el-button>
|
||||
<el-button v-if="canForceHandoff" type="warning" @click="openForceHandoff">
|
||||
{{ forceHandoffAction?.label || '客服一键交接' }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="canPlatformCheckoutConfirm"
|
||||
type="primary"
|
||||
@click="openAction('platform_checkout_confirm')"
|
||||
>
|
||||
{{ platformCheckoutConfirmAction?.label || '客服确认结账' }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="canPlatformCheckoutCounter"
|
||||
type="warning"
|
||||
plain
|
||||
@click="openPlatformCheckoutCounter"
|
||||
>
|
||||
{{ platformCheckoutCounterAction?.label || '客服修改结账方案' }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="canPlatformCheckoutDispute"
|
||||
type="warning"
|
||||
@click="openAction('platform_checkout_dispute')"
|
||||
>
|
||||
{{ platformCheckoutDisputeAction?.label || '发起结账争议' }}
|
||||
</el-button>
|
||||
<el-button v-if="canOfflineSettlement" type="success" @click="openOfflineSettlement">
|
||||
{{ offlineSettlementAction?.label || '确认线下结算' }}
|
||||
</el-button>
|
||||
<el-button v-if="canAdminCreateDispute" type="warning" plain @click="openAdminDispute">
|
||||
发起申诉
|
||||
</el-button>
|
||||
<el-button type="warning" :disabled="!canOperate" @click="openAction('abnormal')"
|
||||
>标记异常</el-button
|
||||
>
|
||||
<el-tooltip :content="closeActionTip" placement="top">
|
||||
<span>
|
||||
<el-button type="danger" :disabled="!canOperate" @click="confirmCloseAction"
|
||||
>客服关闭</el-button
|
||||
>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="sealActionTip" placement="top">
|
||||
<span>
|
||||
<el-button type="danger" plain :disabled="!canOperate" @click="confirmSealAction"
|
||||
>封存订单</el-button
|
||||
>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-tooltip v-if="canHoldDeposit" :content="depositHoldActionTip" placement="top">
|
||||
<span>
|
||||
<el-button type="warning" plain @click="confirmHoldDeposit"> 暂扣押金 </el-button>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-tooltip v-if="isDepositHeld" :content="depositReleaseActionTip" placement="top">
|
||||
<span>
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
:disabled="!canReleaseDeposit"
|
||||
@click="confirmReleaseDeposit"
|
||||
>
|
||||
归还押金
|
||||
</el-button>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="refundActionTip" placement="top">
|
||||
<span>
|
||||
<el-button
|
||||
type="primary"
|
||||
:loading="refunding"
|
||||
:disabled="refundButtonDisabled"
|
||||
@click="confirmRefund"
|
||||
>
|
||||
{{ refundButtonDisabled ? '已退款' : '人工退款' }}
|
||||
</el-button>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div v-if="order" class="metric-grid dashboard-metrics order-metrics">
|
||||
<div class="metric-card">
|
||||
@@ -1652,10 +1657,77 @@ function paymentPaidAt(record: AdminPayment) {
|
||||
</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</section>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.finance-page-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
padding: 0 4px 32px;
|
||||
}
|
||||
|
||||
.page-header-card {
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
padding: 24px 28px;
|
||||
box-shadow:
|
||||
0 1px 3px rgba(15, 23, 42, 0.04),
|
||||
0 4px 12px rgba(15, 23, 42, 0.02);
|
||||
border: 1px solid rgba(226, 232, 240, 0.8);
|
||||
}
|
||||
|
||||
.header-main {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 16px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.title-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.eyebrow-tag {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.8px;
|
||||
color: #3b82f6;
|
||||
background: #eff6ff;
|
||||
padding: 3px 10px;
|
||||
border-radius: 20px;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
margin: 0;
|
||||
font-size: 26px;
|
||||
font-weight: 800;
|
||||
color: #0f172a;
|
||||
letter-spacing: -0.5px;
|
||||
}
|
||||
|
||||
.page-subtitle {
|
||||
margin: 0;
|
||||
font-size: 13.5px;
|
||||
color: #64748b;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.toolbar-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.order-metrics {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user