平台配置页改造

This commit is contained in:
yml2213
2026-05-14 19:05:08 +08:00
parent f7f3289d04
commit 7775525f30
15 changed files with 2351 additions and 1727 deletions
@@ -25,95 +25,155 @@ defineProps<Props>()
</script>
<template>
<section class="meta-card">
<div class="meta-line">
<span class="meta-label">职责</span>
<span>接收 91卡券推送订单,未命中履约配置时先进入待补全队列,补完商品规则后可手动重试生成任务。</span>
</div>
<div class="meta-line">
<span class="meta-label">处理建议</span>
<span>先到“快手 Cloud 新履约”页为 91 的 productNo 配置规则,再回到这里点击重试。</span>
</div>
</section>
<div class="platform-section">
<!-- 说明信息 -->
<el-card class="section-card">
<template #header>
<span class="card-title">说明信息</span>
</template>
<el-descriptions :column="1" border size="small">
<el-descriptions-item label="职责">
接收 91卡券推送订单,未命中履约配置时先进入待补全队列,补完商品规则后可手动重试生成任务。
</el-descriptions-item>
<el-descriptions-item label="处理建议">
先到"快手 Cloud 新履约"页为 91 的 productNo 配置规则,再回到这里点击重试。
</el-descriptions-item>
</el-descriptions>
</el-card>
<section class="table-card">
<div class="section-title-row">
<div>
<h3>91卡券订单队列</h3>
<p>当前筛选 {{ ninetyoneStats.currentCount }} 条,总计 {{ ninetyoneStats.total }} 条,已生成任务 {{ ninetyoneStats.taskReadyCount }} 条。</p>
</div>
<div class="section-actions">
<el-button-group>
<el-button :type="ninetyoneStatus === 'pending_config' ? 'primary' : 'default'" round @click="handleNinetyoneStatusChange('pending_config')">待补全</el-button>
<el-button :type="ninetyoneStatus === 'manual_failed' ? 'primary' : 'default'" round @click="handleNinetyoneStatusChange('manual_failed')">失败</el-button>
<el-button :type="ninetyoneStatus === 'all' ? 'primary' : 'default'" round @click="handleNinetyoneStatusChange('all')">全部</el-button>
</el-button-group>
<el-button :loading="ninetyoneLoading" round @click="loadNinetyoneOrders(ninetyoneOrders.page)">刷新</el-button>
</div>
</div>
<!-- 订单队列 -->
<el-card class="section-card">
<template #header>
<div class="card-header">
<div>
<span class="card-title">91卡券订单队列</span>
<p class="card-desc">
当前筛选 {{ ninetyoneStats.currentCount }} 条,总计 {{ ninetyoneStats.total }} 条,已生成任务 {{ ninetyoneStats.taskReadyCount }} 条。
</p>
</div>
<div class="card-actions">
<el-radio-group
:model-value="ninetyoneStatus"
size="small"
@update:model-value="(v: string | number | boolean | undefined) => handleNinetyoneStatusChange(v as 'pending_config' | 'all' | 'manual_failed')"
>
<el-radio-button value="pending_config">待补全</el-radio-button>
<el-radio-button value="manual_failed">失败</el-radio-button>
<el-radio-button value="all">全部</el-radio-button>
</el-radio-group>
<el-button :loading="ninetyoneLoading" @click="loadNinetyoneOrders(ninetyoneOrders.page)">刷新</el-button>
</div>
</div>
</template>
<p v-if="ninetyoneResultError" class="error-copy">{{ ninetyoneResultError }}</p>
<div v-if="ninetyoneLoading" class="empty-inline">正在读取 91卡券订单…</div>
<el-alert
v-if="ninetyoneResultError"
:title="ninetyoneResultError"
type="error"
show-icon
:closable="false"
style="margin-bottom: 16px"
/>
<table v-else class="data-table">
<thead>
<tr>
<th>订单</th>
<th>商品</th>
<th>状态</th>
<th>时间</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr v-for="item in ninetyoneOrders.items" :key="item.orderId">
<td>
<div class="cell-stack">
<strong>{{ item.orderNo }}</strong>
<span class="cell-subtle">{{ item.outTradeNo || '-' }}</span>
<el-table
:data="ninetyoneOrders.items"
stripe
size="small"
v-loading="ninetyoneLoading"
element-loading-text="正在读取 91卡券订单..."
>
<el-table-column label="订单" min-width="180">
<template #default="{ row }">
<div>
<div style="font-weight: 600">{{ row.orderNo }}</div>
<div style="font-size: var(--text-xs); color: var(--text-muted)">{{ row.outTradeNo || '-' }}</div>
</div>
</td>
<td>
<div class="cell-stack">
<strong>{{ item.productName || item.productNo || '-' }}</strong>
<span class="cell-subtle">productNo: {{ item.productNo || '-' }}</span>
<span class="cell-subtle">数量:{{ item.buyNum || 0 }}</span>
</template>
</el-table-column>
<el-table-column label="商品" min-width="180">
<template #default="{ row }">
<div>
<div style="font-weight: 600">{{ row.productName || row.productNo || '-' }}</div>
<div style="font-size: var(--text-xs); color: var(--text-muted)">productNo: {{ row.productNo || '-' }}</div>
<div style="font-size: var(--text-xs); color: var(--text-muted)">数量:{{ row.buyNum || 0 }}</div>
</div>
</td>
<td>
<div class="cell-stack">
<strong>{{ item.orderStatus }}</strong>
<span class="cell-subtle">任务 {{ item.taskCount }}</span>
<span v-if="item.failReason" class="cell-subtle">{{ item.failReason }}</span>
</template>
</el-table-column>
<el-table-column label="状态" min-width="140">
<template #default="{ row }">
<div>
<el-tag size="small">{{ row.orderStatus }}</el-tag>
<div style="font-size: var(--text-xs); color: var(--text-muted); margin-top: 4px">任务 {{ row.taskCount }}</div>
<div v-if="row.failReason" style="font-size: var(--text-xs); color: var(--color-danger)">{{ row.failReason }}</div>
</div>
</td>
<td>{{ formatAdminDateTime(item.updatedAt || item.createdAt) }}</td>
<td>
<div class="row-actions">
<el-button
:loading="ninetyoneActionLoadingId === item.orderId"
link
type="primary"
@click="handleNinetyoneRetryOrder(item)"
>
重试生成任务
</el-button>
<el-button
v-if="item.orderStatus !== 'manual_failed'"
:loading="ninetyoneActionLoadingId === item.orderId"
link
type="danger"
@click="handleNinetyoneFailOrder(item)"
>
标记失败
</el-button>
</div>
</td>
</tr>
<tr v-if="ninetyoneOrders.items.length === 0">
<td colspan="5" class="empty-inline">当前没有 91卡券订单。</td>
</tr>
</tbody>
</table>
</section>
</template>
</el-table-column>
<el-table-column label="时间" width="180">
<template #default="{ row }">{{ formatAdminDateTime(row.updatedAt || row.createdAt) }}</template>
</el-table-column>
<el-table-column label="操作" width="200" align="center">
<template #default="{ row }">
<el-button
:loading="ninetyoneActionLoadingId === row.orderId"
size="small"
type="primary"
@click="handleNinetyoneRetryOrder(row)"
>
重试生成任务
</el-button>
<el-button
v-if="row.orderStatus !== 'manual_failed'"
:loading="ninetyoneActionLoadingId === row.orderId"
size="small"
type="danger"
@click="handleNinetyoneFailOrder(row)"
>
标记失败
</el-button>
</template>
</el-table-column>
<template #empty>
<el-empty description="当前没有 91卡券订单。" :image-size="60" />
</template>
</el-table>
</el-card>
</div>
</template>
<style scoped>
.platform-section {
display: grid;
gap: var(--space-4);
}
.section-card {
border-radius: var(--radius-lg);
}
.card-title {
font-size: var(--text-lg);
font-weight: 600;
color: var(--text-primary);
}
.card-desc {
margin: var(--space-1) 0 0;
font-size: var(--text-sm);
color: var(--text-secondary);
}
.card-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
gap: var(--space-3);
}
.card-actions {
display: flex;
gap: var(--space-2);
flex-shrink: 0;
flex-wrap: wrap;
}
</style>