feat(frontend): add P2 quality gates

2026-05-15 17:35:50 +08:00
parent a65c0713fb
commit 787b01749c
62 changed files with 4907 additions and 1355 deletions
@@ -74,7 +74,9 @@ function formatBindingCountSummary(item: AdminTaskListItem) {
  return `共 ${summary.totalBindingCount} 条 · 预占 ${summary.reservedBindingCount} · 已消费 ${summary.consumedBindingCount} · 已释放 ${summary.releasedBindingCount}`
 }

-onMounted(() => { void loadTasks() })
+onMounted(() => {
+  void loadTasks()
+})

 async function runAction(
  taskId: number,
@@ -83,8 +85,14 @@ async function runAction(
  confirmText: string,
 ) {
  try {
-    await showConfirm(confirmText, '确认操作', { type: 'warning', confirmButtonText: '继续执行', cancelButtonText: '取消' })
-  } catch { return }
+    await showConfirm(confirmText, '确认操作', {
+      type: 'warning',
+      confirmButtonText: '继续执行',
+      cancelButtonText: '取消',
+    })
+  } catch {
+    return
+  }

  actionLoadingId.value = taskId
  try {
@@ -94,23 +102,45 @@ async function runAction(
    await loadTasks()
  } catch (error) {
    showError(error instanceof Error ? error.message : '操作失败')
-  } finally { actionLoadingId.value = null }
+  } finally {
+    actionLoadingId.value = null
+  }
 }

 function handleActionCommand(actionKey: AdminTaskActionKey, item: AdminTaskListItem) {
  if (actionKey === 'retry') {
-    void runAction(item.taskId, () => retryAdminTask(item.taskId), '任务已重试', `确认重试任务 ${item.taskNo} 吗？`)
+    void runAction(
+      item.taskId,
+      () => retryAdminTask(item.taskId),
+      '任务已重试',
+      `确认重试任务 ${item.taskNo} 吗？`,
+    )
    return
  }
  if (actionKey === 'regenerate_claim_link') {
-    void runAction(item.taskId, () => regenerateAdminTaskClaimLink(item.taskId), '领取链接已重新生成', `确认重新生成任务 ${item.taskNo} 的领取链接吗？旧链接会失效。`)
+    void runAction(
+      item.taskId,
+      () => regenerateAdminTaskClaimLink(item.taskId),
+      '领取链接已重新生成',
+      `确认重新生成任务 ${item.taskNo} 的领取链接吗？旧链接会失效。`,
+    )
    return
  }
  if (actionKey === 'manual_review') {
-    void runAction(item.taskId, () => markAdminTaskManualReview(item.taskId), '任务已转人工处理', `确认将任务 ${item.taskNo} 转为人工处理吗？`)
+    void runAction(
+      item.taskId,
+      () => markAdminTaskManualReview(item.taskId),
+      '任务已转人工处理',
+      `确认将任务 ${item.taskNo} 转为人工处理吗？`,
+    )
    return
  }
-  void runAction(item.taskId, () => closeAdminTask(item.taskId), '任务已关闭', `确认关闭任务 ${item.taskNo} 吗？关闭后不会自动继续推进。`)
+  void runAction(
+    item.taskId,
+    () => closeAdminTask(item.taskId),
+    '任务已关闭',
+    `确认关闭任务 ${item.taskNo} 吗？关闭后不会自动继续推进。`,
+  )
 }

 function resetFilters() {
@@ -127,7 +157,10 @@ function resetFilters() {

 <template>
  <div class="tasks-page list-page">
-    <AdminPageHeader title="交付任务" description="更紧凑地查看任务状态、角色绑定、库存凭据和异常信息。">
+    <AdminPageHeader
+      title="交付任务"
+      description="更紧凑地查看任务状态、角色绑定、库存凭据和异常信息。"
+    >
      <template #extra>
        <span class="total-badge">共 {{ pagination.total }} 条任务</span>
      </template>
@@ -142,14 +175,44 @@ function resetFilters() {
      </template>
      <div class="filter-grid">
        <el-select v-model="status" placeholder="状态" clearable>
-          <el-option v-for="opt in adminTaskStatusOptions" :key="opt.value" :label="opt.label" :value="opt.value" />
+          <el-option
+            v-for="opt in adminTaskStatusOptions"
+            :key="opt.value"
+            :label="opt.label"
+            :value="opt.value"
+          />
        </el-select>
-        <el-input v-model="taskNo" placeholder="任务号（模糊匹配）" clearable @keyup.enter="loadTasks(1)" />
-        <el-input v-model="platformOrderId" placeholder="平台订单号" clearable @keyup.enter="loadTasks(1)" />
-        <el-input v-model="roleId" placeholder="角色唯一标识" clearable @keyup.enter="loadTasks(1)" />
+        <el-input
+          v-model="taskNo"
+          placeholder="任务号（模糊匹配）"
+          clearable
+          @keyup.enter="loadTasks(1)"
+        />
+        <el-input
+          v-model="platformOrderId"
+          placeholder="平台订单号"
+          clearable
+          @keyup.enter="loadTasks(1)"
+        />
+        <el-input
+          v-model="roleId"
+          placeholder="角色唯一标识"
+          clearable
+          @keyup.enter="loadTasks(1)"
+        />
        <el-input v-model="skuCode" placeholder="商品 SKU" clearable @keyup.enter="loadTasks(1)" />
-        <el-date-picker v-model="dateFrom" type="date" placeholder="开始日期" value-format="YYYY-MM-DD" />
-        <el-date-picker v-model="dateTo" type="date" placeholder="结束日期" value-format="YYYY-MM-DD" />
+        <el-date-picker
+          v-model="dateFrom"
+          type="date"
+          placeholder="开始日期"
+          value-format="YYYY-MM-DD"
+        />
+        <el-date-picker
+          v-model="dateTo"
+          type="date"
+          placeholder="结束日期"
+          value-format="YYYY-MM-DD"
+        />
        <div class="filter-buttons">
          <el-button round @click="resetFilters">重置</el-button>
          <el-button round type="primary" @click="loadTasks(1)">查询</el-button>
@@ -157,10 +220,29 @@ function resetFilters() {
      </div>
    </el-card>

-    <el-alert v-if="errorMessage" :title="errorMessage" type="error" show-icon :closable="false" style="margin-top: 16px" />
-    <el-alert v-if="lastClaimUrl" :title="`最近生成的领取链接：${lastClaimUrl}`" type="info" show-icon :closable="false" style="margin-top: 16px" />
+    <el-alert
+      v-if="errorMessage"
+      :title="errorMessage"
+      type="error"
+      show-icon
+      :closable="false"
+      style="margin-top: 16px"
+    />
+    <el-alert
+      v-if="lastClaimUrl"
+      :title="`最近生成的领取链接：${lastClaimUrl}`"
+      type="info"
+      show-icon
+      :closable="false"
+      style="margin-top: 16px"
+    />

-    <el-card shadow="never" class="section-card" v-loading="loading" element-loading-text="任务列表加载中">
+    <el-card
+      shadow="never"
+      class="section-card"
+      v-loading="loading"
+      element-loading-text="任务列表加载中"
+    >
      <template v-if="items.length === 0 && !loading">
        <el-empty description="当前筛选条件下暂无任务" :image-size="60" />
      </template>
@@ -175,14 +257,22 @@ function resetFilters() {
          <el-table-column label="任务 / 商品" min-width="220">
            <template #default="{ row }">
              <div class="cell-stack">
-                <RouterLink :to="`/admin/tasks/${row.taskId}`" class="task-no id-link" :title="row.taskNo">
+                <RouterLink
+                  :to="`/admin/tasks/${row.taskId}`"
+                  class="task-no id-link"
+                  :title="row.taskNo"
+                >
                  {{ row.taskNo }}
                </RouterLink>
                <div class="cell-meta-row">
-                  <span class="compact-chip" :title="row.platformOrderId">订单 {{ row.platformOrderId }}</span>
+                  <span class="compact-chip" :title="row.platformOrderId"
+                    >订单 {{ row.platformOrderId }}</span
+                  >
                  <span class="compact-chip compact-chip--muted">重试 {{ row.retryCount }} 次</span>
                </div>
-                <span class="cell-title" :title="row.skuName || row.skuCode">{{ row.skuName || row.skuCode }}</span>
+                <span class="cell-title" :title="row.skuName || row.skuCode">{{
+                  row.skuName || row.skuCode
+                }}</span>
                <span class="cell-subline">SKU {{ row.skuCode || '-' }}</span>
              </div>
            </template>
@@ -208,12 +298,24 @@ function resetFilters() {
          <el-table-column label="角色 / 凭据" min-width="180">
            <template #default="{ row }">
              <div class="cell-stack">
-                <span class="cell-title" :title="row.roleName || row.roleId || '-'">{{ row.roleName || '-' }}</span>
-                <span class="cell-subline" :title="row.roleId || '-'">角色ID {{ row.roleId || '-' }}</span>
+                <span class="cell-title" :title="row.roleName || row.roleId || '-'">{{
+                  row.roleName || '-'
+                }}</span>
+                <span class="cell-subline" :title="row.roleId || '-'"
+                  >角色ID {{ row.roleId || '-' }}</span
+                >
                <span class="cell-subline">登录 {{ row.loginType || '-' }}</span>
-                <span class="cell-subline" :title="row.inventoryDisplayMasked || '-'">凭据 {{ row.inventoryDisplayMasked || '-' }}</span>
-                <span class="cell-subline" :title="formatBindingRoles(row)">绑定 {{ formatBindingRoles(row) }}</span>
-                <span class="cell-subline cell-subline--strong" :title="formatBindingCountSummary(row)">{{ formatBindingCountSummary(row) }}</span>
+                <span class="cell-subline" :title="row.inventoryDisplayMasked || '-'"
+                  >凭据 {{ row.inventoryDisplayMasked || '-' }}</span
+                >
+                <span class="cell-subline" :title="formatBindingRoles(row)"
+                  >绑定 {{ formatBindingRoles(row) }}</span
+                >
+                <span
+                  class="cell-subline cell-subline--strong"
+                  :title="formatBindingCountSummary(row)"
+                  >{{ formatBindingCountSummary(row) }}</span
+                >
              </div>
            </template>
          </el-table-column>
@@ -222,25 +324,43 @@ function resetFilters() {
              <div class="cell-stack">
                <span class="cell-subline">创建 {{ formatAdminDateTime(row.createdAt) }}</span>
                <span class="cell-subline">更新 {{ formatAdminDateTime(row.updatedAt) }}</span>
-                <span v-if="row.claimedAt" class="cell-subline">领取 {{ formatAdminDateTime(row.claimedAt) }}</span>
-                <span v-if="row.roleConfirmedAt" class="cell-subline">确认 {{ formatAdminDateTime(row.roleConfirmedAt) }}</span>
-                <span v-if="row.redeemedAt" class="cell-subline">兑换 {{ formatAdminDateTime(row.redeemedAt) }}</span>
+                <span v-if="row.claimedAt" class="cell-subline"
+                  >领取 {{ formatAdminDateTime(row.claimedAt) }}</span
+                >
+                <span v-if="row.roleConfirmedAt" class="cell-subline"
+                  >确认 {{ formatAdminDateTime(row.roleConfirmedAt) }}</span
+                >
+                <span v-if="row.redeemedAt" class="cell-subline"
+                  >兑换 {{ formatAdminDateTime(row.redeemedAt) }}</span
+                >
              </div>
            </template>
          </el-table-column>
          <el-table-column label="异常 / 操作" min-width="220">
            <template #default="{ row }">
              <div class="cell-stack">
-                <span class="cell-error" :title="row.lastError || '-'">{{ row.lastError || '当前无异常' }}</span>
+                <span class="cell-error" :title="row.lastError || '-'">{{
+                  row.lastError || '当前无异常'
+                }}</span>
                <div class="action-stack">
                  <el-button
                    v-if="canManageTaskLifecycle"
-                    :disabled="row.executorKey === 'manual_dispatch' || !['retry_pending', 'manual_review', 'waiting_inventory'].includes(row.status)"
+                    :disabled="
+                      row.executorKey === 'manual_dispatch' ||
+                      !['retry_pending', 'manual_review', 'waiting_inventory'].includes(row.status)
+                    "
                    :loading="actionLoadingId === row.taskId"
                    size="small"
                    type="danger"
                    plain
-                    @click="runAction(row.taskId, () => retryAdminTask(row.taskId), '任务已重试', `确认重试任务 ${row.taskNo} 吗？`)"
+                    @click="
+                      runAction(
+                        row.taskId,
+                        () => retryAdminTask(row.taskId),
+                        '任务已重试',
+                        `确认重试任务 ${row.taskNo} 吗？`,
+                      )
+                    "
                  >
                    重试
                  </el-button>
@@ -290,13 +410,31 @@ function resetFilters() {
@import '../../../styles/admin-list-pages.css';

 .filter-grid {
-  grid-template-columns: minmax(150px, 0.75fr) minmax(220px, 1fr) minmax(220px, 1fr) minmax(210px, 0.95fr);
+  grid-template-columns: minmax(150px, 0.75fr) minmax(220px, 1fr) minmax(220px, 1fr) minmax(
+      210px,
+      0.95fr
+    );
+}
+.filter-grid :deep(.el-date-editor) {
+  width: 100%;
 }
-.filter-grid :deep(.el-date-editor) { width: 100%; }

-.progress-row { display: flex; align-items: center; gap: var(--space-2); min-width: 0; }
-.progress-row :deep(.el-tag) { min-width: 0; max-width: calc(100% - 42px); }
-.progress-row :deep(.el-tag__content) { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.progress-row {
+  display: flex;
+  align-items: center;
+  gap: var(--space-2);
+  min-width: 0;
+}
+.progress-row :deep(.el-tag) {
+  min-width: 0;
+  max-width: calc(100% - 42px);
+}
+.progress-row :deep(.el-tag__content) {
+  display: block;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}

 .progress-label {
  display: inline-flex;
@@ -314,10 +452,28 @@ function resetFilters() {
  flex: 0 0 auto;
 }

-.cell-error { display: block; min-width: 0; line-height: 1.55; color: #475467; word-break: break-word; font-size: var(--text-xs); }
+.cell-error {
+  display: block;
+  min-width: 0;
+  line-height: 1.55;
+  color: #475467;
+  word-break: break-word;
+  font-size: var(--text-xs);
+}

-.cell-subline--strong { color: var(--text-primary); font-weight: 600; }
+.cell-subline--strong {
+  color: var(--text-primary);
+  font-weight: 600;
+}

-.action-stack { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
-.action-stack :deep(.el-button) { flex: 0 0 auto; margin-left: 0; }
+.action-stack {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--space-2);
+  align-items: center;
+}
+.action-stack :deep(.el-button) {
+  flex: 0 0 auto;
+  margin-left: 0;
+}
 </style>