align(records·像素复刻): 软件版本(全量无分页同旧版)/数字人版本(三态色/最新★/操作矩阵/数字页码分页) 自绘复刻旧版;确认走原生 confirm 对齐旧版

This commit is contained in:
2026-09-06 23:09:23 +08:00
parent f324c6bd3d
commit b0c461d347
6 changed files with 547 additions and 156 deletions
@@ -1,8 +1,9 @@
<script setup lang="ts"> <script setup lang="ts">
/** 数字人版本管理页module 13 task 261 对齐 admin panel-digital-human-version;本轮补齐分页/三态/上传进度/下载语义)。 */ /** 数字人版本管理页 · 像素复刻旧版 admin.html panel-digital-human-version(自绘:面板头+上传、三态状态色、最新★、操作矩阵、数字页码分页)。
* script 逻辑沿用现有 Vue 实现(确认文案/上传进度/下载取链接);确认走原生 confirm 对齐旧版。 */
import { formatDateTime } from '@/utils/datetime' import { formatDateTime } from '@/utils/datetime'
import { computed, onMounted, ref } from 'vue' import { computed, onMounted, ref } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus' import { ElMessage } from 'element-plus'
import { import {
deleteDigitalHumanVersion, deleteDigitalHumanVersion,
fetchDigitalHumanDownloadUrl, fetchDigitalHumanDownloadUrl,
@@ -32,6 +33,8 @@ const pagedItems = computed(() => {
const start = (page.value - 1) * pageSize const start = (page.value - 1) * pageSize
return items.value.slice(start, start + pageSize) return items.value.slice(start, start + pageSize)
}) })
const totalPages = computed(() => Math.max(1, Math.ceil(items.value.length / pageSize)))
const jumpPage = ref('')
const uploadVisible = ref(false) const uploadVisible = ref(false)
const uploading = ref(false) const uploading = ref(false)
@@ -55,6 +58,20 @@ async function load() {
} }
} }
function changePage(next: number): void {
if (next < 1 || next > totalPages.value) return
page.value = next
}
function goJump(): void {
const n = Number.parseInt(jumpPage.value, 10)
if (Number.isNaN(n)) {
ElMessage.warning('请输入页码')
return
}
changePage(Math.min(Math.max(n, 1), totalPages.value))
}
function onFileChange(file: File) { function onFileChange(file: File) {
form.value.file = file form.value.file = file
} }
@@ -91,14 +108,14 @@ async function submitUpload() {
async function release(row: DigitalHumanVersion) { async function release(row: DigitalHumanVersion) {
const text = releaseDigitalHumanConfirmText(row.version) const text = releaseDigitalHumanConfirmText(row.version)
if (!text) return if (!text) return
// 对齐旧版:原生 confirm。
if (!window.confirm(text)) return
confirming.value = row.version confirming.value = row.version
try { try {
await ElMessageBox.confirm(text, '发布版本', { type: 'warning', confirmButtonText: '发布', cancelButtonText: '取消' })
await releaseDigitalHumanVersion(row.version) await releaseDigitalHumanVersion(row.version)
ElMessage.success('已发布') ElMessage.success('已发布')
load() load()
} catch (error) { } catch (error) {
if (error === 'cancel' || error === 'close') return
ElMessage.error(error instanceof Error ? error.message : '发布失败') ElMessage.error(error instanceof Error ? error.message : '发布失败')
} finally { } finally {
confirming.value = null confirming.value = null
@@ -108,14 +125,13 @@ async function release(row: DigitalHumanVersion) {
async function setLatest(row: DigitalHumanVersion) { async function setLatest(row: DigitalHumanVersion) {
const text = setLatestDigitalHumanConfirmText(row.version) const text = setLatestDigitalHumanConfirmText(row.version)
if (!text) return if (!text) return
if (!window.confirm(text)) return
confirming.value = row.version confirming.value = row.version
try { try {
await ElMessageBox.confirm(text, '设为最新', { type: 'warning', confirmButtonText: '设为最新', cancelButtonText: '取消' })
await setLatestDigitalHumanVersion(row.version) await setLatestDigitalHumanVersion(row.version)
ElMessage.success('已设为最新') ElMessage.success('已设为最新')
load() load()
} catch (error) { } catch (error) {
if (error === 'cancel' || error === 'close') return
ElMessage.error(error instanceof Error ? error.message : '操作失败') ElMessage.error(error instanceof Error ? error.message : '操作失败')
} finally { } finally {
confirming.value = null confirming.value = null
@@ -146,18 +162,13 @@ async function download(row: DigitalHumanVersion) {
async function remove(row: DigitalHumanVersion) { async function remove(row: DigitalHumanVersion) {
const text = digitalHumanDeleteConfirmText(row.version) const text = digitalHumanDeleteConfirmText(row.version)
if (!text) return if (!text) return
if (!window.confirm(text)) return
confirming.value = row.version confirming.value = row.version
try { try {
await ElMessageBox.confirm(text, '删除版本', {
type: 'warning',
confirmButtonText: '删除',
cancelButtonText: '取消',
})
await deleteDigitalHumanVersion(row.version) await deleteDigitalHumanVersion(row.version)
ElMessage.success('删除成功') ElMessage.success('删除成功')
load() load()
} catch (error) { } catch (error) {
if (error === 'cancel' || error === 'close') return
ElMessage.error(error instanceof Error ? error.message : '删除失败') ElMessage.error(error instanceof Error ? error.message : '删除失败')
} finally { } finally {
confirming.value = null confirming.value = null
@@ -176,70 +187,83 @@ onMounted(load)
</script> </script>
<template> <template>
<div class="page-stack"> <div class="dh-view">
<div class="page-heading"> <section class="panel-box">
<div> <div class="dh-head">
<h2>数字人版本管理</h2> <h3>版本列表</h3>
<p>管理数字人客户端的草稿/已发布/已废弃版本</p> <button class="btn" type="button" @click="uploadVisible = true">上传新版本</button>
</div> </div>
</div>
<el-card shadow="never"> <div class="table-scroll digital-human-version-table-scroll">
<div class="table-toolbar"> <table>
<el-button type="primary" @click="uploadVisible = true">上传草稿状态</el-button> <thead>
<tr>
<th style="width: 80px">版本号</th>
<th style="width: 60px">状态</th>
<th style="width: 60px">最新</th>
<th style="width: 80px">文件大小</th>
<th style="width: 120px">MD5</th>
<th>更新日志</th>
<th style="width: 140px">发布时间</th>
<th style="width: 240px">操作</th>
</tr>
</thead>
<tbody>
<template v-if="pagedItems.length">
<tr v-for="row in pagedItems" :key="row.version + row.id">
<td><span class="mono-cell">{{ row.version }}</span></td>
<td>
<span class="st-pill" :class="`is-${statusOf(row).tag}`">{{ statusOf(row).text }}</span>
</td>
<td><span v-if="row.isLatest" class="star" title="最新版本">★</span><span v-else class="dim"></span></td>
<td>{{ digitalHumanVersionFileSizeText(row.fileSize) }}</td>
<td><span :title="row.md5 || ''" class="mono-cell">{{ row.md5 ? `${row.md5.substring(0, 12)}...` : '—' }}</span></td>
<td>
<span :title="row.changelog || ''" class="changelog-cell">{{ digitalHumanChangelogShort(row.changelog) }}</span>
</td>
<td>{{ formatDateTime(row.releasedAt) }}</td>
<td class="ops-cell">
<button v-if="canReleaseDigitalHumanVersion(row.status)" class="btn btn-sm" type="button" :disabled="confirming === row.version" @click="release(row)">发布</button>
<button
v-if="!canReleaseDigitalHumanVersion(row.status) && canSetLatestDigitalHumanVersion(row.status) && !row.isLatest"
class="btn btn-sm"
type="button"
:disabled="confirming === row.version"
@click="setLatest(row)"
>
设为最新
</button>
<button v-if="canSetLatestDigitalHumanVersion(row.status)" class="btn btn-sm btn-secondary" type="button" :disabled="downloadingVersion === row.version" @click="download(row)">下载</button>
<button v-if="canDelete(row)" class="btn btn-sm btn-danger" type="button" :disabled="confirming === row.version" @click="remove(row)">删除</button>
</td>
</tr>
</template>
<tr v-else-if="loading">
<td colspan="8" class="empty-tip">加载中...</td>
</tr>
<tr v-else>
<td colspan="8" class="empty-tip">暂无版本记录</td>
</tr>
</tbody>
</table>
</div> </div>
<el-table v-loading="loading" :data="pagedItems" stripe border empty-text="暂无数字人版本">
<el-table-column prop="version" label="版本号" min-width="150" /> <div v-if="items.length > pageSize" class="pagination">
<el-table-column label="状态" min-width="100"> <button type="button" :disabled="page <= 1" @click="changePage(page - 1)">上一页</button>
<template #default="{ row }"> <span class="page-nums">
<el-tag :type="statusOf(row as DigitalHumanVersion).tag" size="small"> <template v-for="n in totalPages" :key="n">
{{ statusOf(row as DigitalHumanVersion).text }} <button type="button" class="num-page" :class="{ 'is-active': n === page }" @click="changePage(n)">{{ n }}</button>
</el-tag>
</template> </template>
</el-table-column> </span>
<el-table-column label="最新" min-width="60" align="center"> <button type="button" :disabled="page >= totalPages" @click="changePage(page + 1)">下一页</button>
<template #default="{ row }"> <span class="page-jump">
<span v-if="(row as DigitalHumanVersion).isLatest" class="star" title="最新版本"></span> 跳至
<span v-else></span> <input v-model="jumpPage" type="text" inputmode="numeric" @keyup.enter="goJump" />
</template>
</el-table-column> <button type="button" @click="goJump">跳转</button>
<el-table-column label="文件大小" min-width="100"> </span>
<template #default="{ row }">{{ digitalHumanVersionFileSizeText((row as DigitalHumanVersion).fileSize) }}</template>
</el-table-column>
<el-table-column label="MD5" min-width="130">
<template #default="{ row }">
<span :title="(row as DigitalHumanVersion).md5 || ''">{{ (row as DigitalHumanVersion).md5 ? `${((row as DigitalHumanVersion).md5 || '').substring(0, 12)}...` : '—' }}</span>
</template>
</el-table-column>
<el-table-column label="更新说明" min-width="180">
<template #default="{ row }">
<span :title="(row as DigitalHumanVersion).changelog || ''">{{ digitalHumanChangelogShort((row as DigitalHumanVersion).changelog) }}</span>
</template>
</el-table-column>
<el-table-column label="发布时间" min-width="170">
<template #default="{ row }">{{ formatDateTime((row as DigitalHumanVersion).releasedAt) }}</template>
</el-table-column>
<el-table-column label="操作" min-width="240" fixed="right">
<template #default="{ row }">
<el-button v-if="canReleaseDigitalHumanVersion((row as DigitalHumanVersion).status)" type="warning" size="small" :loading="confirming === (row as DigitalHumanVersion).version" @click="release(row as DigitalHumanVersion)">发布</el-button>
<el-button v-if="!canReleaseDigitalHumanVersion((row as DigitalHumanVersion).status) && canSetLatestDigitalHumanVersion((row as DigitalHumanVersion).status) && !(row as DigitalHumanVersion).isLatest" type="primary" size="small" :loading="confirming === (row as DigitalHumanVersion).version" @click="setLatest(row as DigitalHumanVersion)">设为最新</el-button>
<el-button v-if="canSetLatestDigitalHumanVersion((row as DigitalHumanVersion).status)" type="success" size="small" :loading="downloadingVersion === (row as DigitalHumanVersion).version" @click="download(row as DigitalHumanVersion)">下载</el-button>
<el-button v-if="canDelete(row as DigitalHumanVersion)" type="danger" size="small" :loading="confirming === (row as DigitalHumanVersion).version" @click="remove(row as DigitalHumanVersion)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div class="table-footer">
<span> {{ items.length.toLocaleString() }} </span>
<el-pagination
background
layout="prev, pager, next, jumper"
:total="items.length"
:page-size="pageSize"
:current-page="page"
@current-change="(p: number) => { page = p }"
/>
</div> </div>
</el-card> </section>
<el-dialog v-model="uploadVisible" title="上传数字人版本" width="560px"> <el-dialog v-model="uploadVisible" title="上传数字人版本" width="560px">
<p class="upload-desc">上传数字人程序 ZIP 系统会自动计算 MD5 并存储到 OSS上传后状态为草稿需要手动发布</p> <p class="upload-desc">上传数字人程序 ZIP 系统会自动计算 MD5 并存储到 OSS上传后状态为草稿需要手动发布</p>
@@ -270,10 +294,239 @@ onMounted(load)
</template> </template>
<style scoped> <style scoped>
.page-heading { display: flex; justify-content: space-between; align-items: flex-start; } /* 像素复刻旧版 admin.html panel-digital-human-version(蓝白末层)。 */
.dim { color: var(--el-text-color-secondary); font-size: 12px; } .dh-view {
.star { color: #e6a23c; font-weight: 700; } font-family: inherit;
.upload-desc { margin: 0 0 12px; color: var(--el-text-color-secondary); font-size: 12.5px; line-height: 1.6; } color: #24384d;
.table-footer { display: flex; justify-content: space-between; align-items: center; padding-top: 14px; } }
.table-footer span { color: var(--el-text-color-secondary); font-size: 12.5px; } .panel-box {
width: 100%;
min-width: 0;
padding: 20px 22px 24px;
border: 1px solid #d8e3ee;
border-radius: 14px;
background: linear-gradient(145deg, #ffffff, #f9fbfd);
box-shadow: 0 1px 2px rgba(39, 67, 94, 0.04), 0 14px 30px -24px rgba(39, 67, 94, 0.28);
}
h3 {
margin: 0;
font-size: 15px;
font-weight: 650;
color: #24384d;
letter-spacing: 0.2px;
}
.dh-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin-bottom: 16px;
}
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
min-height: 42px;
padding: 9px 18px;
border: 1px solid #4f78a5;
border-radius: 9px;
background: linear-gradient(135deg, #5f85ad, #4f78a5);
color: #ffffff;
font-family: inherit;
font-size: 13.5px;
cursor: pointer;
box-shadow: 0 8px 18px -14px rgba(79, 120, 165, 0.72);
transition: background 160ms ease, box-shadow 160ms ease, transform 120ms ease;
}
.btn:hover:not(:disabled) {
background: linear-gradient(135deg, #7094ba, #5d83ac);
box-shadow: 0 11px 22px -14px rgba(79, 120, 165, 0.8);
}
.btn:disabled {
cursor: not-allowed;
opacity: 0.55;
}
.btn-secondary {
background: #ffffff;
color: #5b6f83;
border-color: #c7d7e5;
}
.btn-secondary:hover:not(:disabled) {
color: #2f5d8b;
border-color: #95b1cb;
background: #edf5fb;
}
.btn-danger {
background: linear-gradient(135deg, #c06d77, #b35f6a);
border-color: #b35f6a;
}
.btn-danger:hover:not(:disabled) {
background: linear-gradient(135deg, #cb7c84, #b96570);
}
.btn-sm {
min-height: 36px;
padding: 7px 12px;
}
.table-scroll {
width: 100%;
min-width: 0;
overflow-x: auto;
border: 1px solid #dbe5ee;
border-radius: 10px;
background: #ffffff;
}
.table-scroll table {
width: 100%;
border-collapse: collapse;
table-layout: fixed;
}
.digital-human-version-table-scroll > table {
min-width: 1120px;
}
.table-scroll th,
.table-scroll td {
padding: 10px 12px;
text-align: left;
font-size: 13.5px;
line-height: 1.5;
border-bottom: 1px solid #e0e8ef;
vertical-align: middle;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.table-scroll th {
background: #edf4fa;
color: #4e6479;
border-bottom-color: #d5e1eb;
font-size: 12.5px;
font-weight: 600;
letter-spacing: 0.4px;
}
.table-scroll tbody tr:hover td {
background: #f1f7fb;
}
.table-scroll tbody tr:last-child td {
border-bottom: 0;
}
.mono-cell {
font-family: "Cascadia Mono", Consolas, monospace;
font-size: 12.5px;
}
.st-pill {
display: inline-flex;
align-items: center;
padding: 2px 10px;
border-radius: 999px;
font-size: 12px;
line-height: 1.7;
border: 1px solid transparent;
}
.st-pill.is-info {
color: #6b7280;
background: #f1f3f5;
border-color: #dfe3e8;
}
.st-pill.is-success {
color: #398a3f;
background: #eaf7ec;
border-color: #bfe3c5;
}
.st-pill.is-danger {
color: #b8454d;
background: #fbedee;
border-color: #ecc9cc;
}
.star {
color: #d64545;
font-weight: 700;
}
.changelog-cell {
display: block;
color: #5b6f83;
overflow: hidden;
text-overflow: ellipsis;
}
.ops-cell {
white-space: nowrap;
}
.ops-cell .btn + .btn {
margin-left: 8px;
}
.empty-tip {
padding: 44px 24px;
text-align: center;
color: #8293a5;
font-size: 13.5px;
}
.pagination {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
margin-top: 18px;
color: #5b6f83;
font-size: 13px;
}
.pagination button {
min-height: 30px;
padding: 4px 12px;
border: 1px solid #c7d7e5;
border-radius: 8px;
background: #ffffff;
color: #5b6f83;
font-family: inherit;
font-size: 13px;
cursor: pointer;
}
.pagination button:hover:not(:disabled) {
background: #edf5fb;
border-color: #95b1cb;
color: #2f5d8b;
}
.pagination button:disabled {
background: #eef3f7;
color: #9baaba;
cursor: not-allowed;
}
.page-nums {
display: inline-flex;
gap: 6px;
}
.num-page {
min-width: 30px;
padding: 4px 8px;
}
.num-page.is-active {
background: #2f5d8b;
border-color: #2f5d8b;
color: #ffffff;
}
.page-jump {
display: inline-flex;
align-items: center;
gap: 6px;
}
.page-jump input {
width: 56px;
min-height: 30px;
padding: 4px 8px;
border: 1px solid #cbd9e6;
border-radius: 8px;
background: #f8fbfd;
color: #24384d;
font-size: 13px;
font-family: inherit;
}
.dim {
color: #8293a5;
font-size: 12px;
}
.upload-desc {
margin: 0 0 12px;
color: #5b6f83;
font-size: 12.5px;
line-height: 1.6;
}
</style> </style>
@@ -1,7 +1,8 @@
<script setup lang="ts"> <script setup lang="ts">
import { formatDateTime } from '@/utils/datetime' import { formatDateTime } from '@/utils/datetime'
/** 软件版本管理页:客户端版本列表 + 上传新版本(成功留驻弹窗含链接,对齐 admin panel-version)。 */ /** 软件版本管理页 · 像素复刻旧版 admin.html panel-version(自绘:面板头+上传新版本、版本列表、全量无分页同旧版)。
import { computed, onMounted, ref } from 'vue' * script 逻辑沿用现有 Vue 实现(上传弹窗成功留驻含链接)。 */
import { onMounted, ref } from 'vue'
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
import { fetchSoftwareVersions, uploadSoftwareVersion } from './version-api.ts' import { fetchSoftwareVersions, uploadSoftwareVersion } from './version-api.ts'
import type { SoftwareVersionItem } from './version-dto.ts' import type { SoftwareVersionItem } from './version-dto.ts'
@@ -9,15 +10,6 @@ import { isNonEmptyVersion } from './version-dto.ts'
const loading = ref(false) const loading = ref(false)
const items = ref<SoftwareVersionItem[]>([]) const items = ref<SoftwareVersionItem[]>([])
// 客户端分页:全量拉取后按页切片展示。
const page = ref(1)
const pageSize = 10
const total = computed(() => items.value.length)
const pagedItems = computed(() => items.value.slice((page.value - 1) * pageSize, page.value * pageSize))
function changePage(p: number) {
page.value = p
}
const uploadVisible = ref(false) const uploadVisible = ref(false)
const uploading = ref(false) const uploading = ref(false)
@@ -87,40 +79,48 @@ onMounted(load)
</script> </script>
<template> <template>
<div class="page-stack"> <div class="version-view">
<div class="page-heading"> <section class="panel-box">
<div> <div class="version-head">
<h2>软件版本管理</h2> <h3>版本列表</h3>
<p>管理客户端更新包版本用于 /api/version/latest 下发</p> <button class="btn" type="button" @click="openUpload">上传新版本</button>
</div> </div>
</div>
<el-card shadow="never"> <div class="table-scroll version-table-scroll">
<div class="table-toolbar"> <table>
<el-button type="primary" @click="openUpload">上传新版本</el-button> <thead>
<tr>
<th style="width: 120px">版本号</th>
<th>下载链接</th>
<th style="width: 160px">创建时间</th>
<th style="width: 120px">操作</th>
</tr>
</thead>
<tbody>
<template v-if="items.length">
<tr v-for="row in items" :key="row.version + row.id">
<td>{{ row.version }}</td>
<td>
<a v-if="row.fileUrl" class="link-cell" :href="row.fileUrl" target="_blank" rel="noopener" :title="row.fileUrl">{{ row.fileUrl }}</a>
<span v-else class="dim"></span>
</td>
<td>{{ formatDateTime(row.createdAt) }}</td>
<td>
<a v-if="row.fileUrl" class="btn btn-sm btn-secondary dl-btn" :href="row.fileUrl" download>下载</a>
<span v-else class="dim"></span>
</td>
</tr>
</template>
<tr v-else-if="loading">
<td colspan="4" class="empty-tip">加载中...</td>
</tr>
<tr v-else>
<td colspan="4" class="empty-tip">暂无版本记录</td>
</tr>
</tbody>
</table>
</div> </div>
<el-table v-loading="loading" :data="pagedItems" stripe border empty-text="暂无版本记录"> </section>
<el-table-column prop="version" label="版本号" min-width="180" />
<el-table-column label="下载链接" min-width="240">
<template #default="{ row }">
<a v-if="(row as SoftwareVersionItem).fileUrl" class="el-link el-link--primary" :href="(row as SoftwareVersionItem).fileUrl" target="_blank" rel="noopener">{{ (row as SoftwareVersionItem).fileUrl }}</a>
<span v-else class="dim"></span>
</template>
</el-table-column>
<el-table-column prop="createdAt" label="创建时间" min-width="190">
<template #default="{ row }">{{ formatDateTime(row.createdAt) }}</template>
</el-table-column>
<el-table-column label="操作" min-width="90" fixed="right">
<template #default="{ row }">
<a v-if="(row as SoftwareVersionItem).fileUrl" class="el-link el-link--primary" :href="(row as SoftwareVersionItem).fileUrl" download>下载</a>
<span v-else class="dim"></span>
</template>
</el-table-column>
</el-table>
<div class="table-footer">
<el-pagination background layout="prev, pager, next, jumper" :total="total" :page-size="pageSize" :current-page="page" @current-change="changePage" />
</div>
</el-card>
<el-dialog v-model="uploadVisible" title="上传新版本" width="520px"> <el-dialog v-model="uploadVisible" title="上传新版本" width="520px">
<p class="upload-desc">上传软件 ZIP 系统会自动计算 MD5 并存储到 OSS</p> <p class="upload-desc">上传软件 ZIP 系统会自动计算 MD5 并存储到 OSS</p>
@@ -146,10 +146,153 @@ onMounted(load)
</template> </template>
<style scoped> <style scoped>
.page-heading { display: flex; justify-content: space-between; align-items: flex-start; } /* 像素复刻旧版 admin.html panel-version(蓝白末层)。 */
.dim { color: var(--el-text-color-secondary); font-size: 12px; } .version-view {
.upload-desc { margin: 0 0 12px; color: var(--el-text-color-secondary); font-size: 12.5px; line-height: 1.6; } font-family: inherit;
.zip-hint { margin: 4px 0 0; color: var(--el-text-color-secondary); font-size: 12px; } color: #24384d;
.upload-msg { margin-bottom: 8px; } }
.upload-msg :deep(.el-alert__title) { word-break: break-all; } .panel-box {
width: 100%;
min-width: 0;
padding: 20px 22px 24px;
border: 1px solid #d8e3ee;
border-radius: 14px;
background: linear-gradient(145deg, #ffffff, #f9fbfd);
box-shadow: 0 1px 2px rgba(39, 67, 94, 0.04), 0 14px 30px -24px rgba(39, 67, 94, 0.28);
}
h3 {
margin: 0;
font-size: 15px;
font-weight: 650;
color: #24384d;
letter-spacing: 0.2px;
}
.version-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin-bottom: 16px;
}
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
min-height: 42px;
padding: 9px 18px;
border: 1px solid #4f78a5;
border-radius: 9px;
background: linear-gradient(135deg, #5f85ad, #4f78a5);
color: #ffffff;
font-family: inherit;
font-size: 13.5px;
cursor: pointer;
box-shadow: 0 8px 18px -14px rgba(79, 120, 165, 0.72);
transition: background 160ms ease, box-shadow 160ms ease, transform 120ms ease;
}
.btn:hover:not(:disabled) {
background: linear-gradient(135deg, #7094ba, #5d83ac);
box-shadow: 0 11px 22px -14px rgba(79, 120, 165, 0.8);
}
.btn:disabled {
cursor: not-allowed;
opacity: 0.55;
}
.btn-secondary {
background: #ffffff;
color: #5b6f83;
border-color: #c7d7e5;
}
.btn-secondary:hover:not(:disabled) {
color: #2f5d8b;
border-color: #95b1cb;
background: #edf5fb;
}
.btn-sm {
min-height: 36px;
padding: 7px 12px;
}
.table-scroll {
width: 100%;
min-width: 0;
overflow-x: auto;
border: 1px solid #dbe5ee;
border-radius: 10px;
background: #ffffff;
}
.table-scroll table {
width: 100%;
border-collapse: collapse;
table-layout: fixed;
}
.version-table-scroll > table {
min-width: 760px;
}
.table-scroll th,
.table-scroll td {
padding: 10px 12px;
text-align: left;
font-size: 13.5px;
line-height: 1.5;
border-bottom: 1px solid #e0e8ef;
vertical-align: middle;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.table-scroll th {
background: #edf4fa;
color: #4e6479;
border-bottom-color: #d5e1eb;
font-size: 12.5px;
font-weight: 600;
letter-spacing: 0.4px;
}
.table-scroll tbody tr:hover td {
background: #f1f7fb;
}
.table-scroll tbody tr:last-child td {
border-bottom: 0;
}
.link-cell {
display: block;
color: #2f5d8b;
text-decoration: none;
overflow: hidden;
text-overflow: ellipsis;
}
.link-cell:hover {
text-decoration: underline;
}
.dl-btn {
text-decoration: none;
}
.dim {
color: #8293a5;
font-size: 12px;
}
.empty-tip {
padding: 44px 24px;
text-align: center;
color: #8293a5;
font-size: 13.5px;
}
.upload-desc {
margin: 0 0 12px;
color: #5b6f83;
font-size: 12.5px;
line-height: 1.6;
}
.zip-hint {
margin: 4px 0 0;
color: #5b6f83;
font-size: 12px;
}
.upload-msg {
margin-bottom: 8px;
}
.upload-msg :deep(.el-alert__title) {
word-break: break-all;
}
</style> </style>
@@ -7,8 +7,6 @@ import { readSource } from './helpers.ts'
// 例外:DuplicateCheckPage 不动;dialog/表单的 width 不属于表格列。 // 例外:DuplicateCheckPage 不动;dialog/表单的 width 不属于表格列。
const PAGES = [ const PAGES = [
'src/pages/records/RecordsDigitalHumanVersionPage.vue',
'src/pages/records/RecordsSoftwareVersionPage.vue',
'src/pages/tasks/ImageVideoTasksPage.vue', 'src/pages/tasks/ImageVideoTasksPage.vue',
'src/pages/tasks/ShopDataTasksPage.vue', 'src/pages/tasks/ShopDataTasksPage.vue',
] ]
@@ -63,6 +61,8 @@ test('align_column_width_boundary_empty_input', () => {
['src/pages/asin/ProductCategoryPage.vue', 'category-table-scroll'], ['src/pages/asin/ProductCategoryPage.vue', 'category-table-scroll'],
['src/pages/shop/ShopKeysPage.vue', 'shop-key-table-scroll'], ['src/pages/shop/ShopKeysPage.vue', 'shop-key-table-scroll'],
['src/pages/shop/ShopManagePage.vue', 'shop-manage-table-scroll'], ['src/pages/shop/ShopManagePage.vue', 'shop-manage-table-scroll'],
['src/pages/records/RecordsSoftwareVersionPage.vue', 'version-table-scroll'],
['src/pages/records/RecordsDigitalHumanVersionPage.vue', 'digital-human-version-table-scroll'],
]) { ]) {
const src = readSource(page) const src = readSource(page)
assert.equal(/el-table-column/.test(src), false, `${page} 已像素复刻原生表格,不再有 el-table-column`) assert.equal(/el-table-column/.test(src), false, `${page} 已像素复刻原生表格,不再有 el-table-column`)
@@ -59,13 +59,15 @@ test('align_digital_human_api_download_url', () => {
test('align_digital_human_page_wiring', () => { test('align_digital_human_page_wiring', () => {
const page = readSource('src/pages/records/RecordsDigitalHumanVersionPage.vue') const page = readSource('src/pages/records/RecordsDigitalHumanVersionPage.vue')
assert.match(page, /pageSize\s*=\s*20|:page-size="20"/, '分页大小 20') assert.match(page, /pageSize\s*=\s*20|:page-size="20"/, '分页大小 20')
assert.match(page, /el-pagination/, '分页组件') assert.match(page, /page-nums/, '数字页码分页(像素复刻旧版)')
assert.match(page, /设为最新/, '按钮名对齐“设为最新”') assert.match(page, /设为最新/, '按钮名对齐“设为最新”')
assert.match(page, /上传(草稿状态)/, '上传按钮名对齐') assert.match(page, /上传新版本/, '页头上传按钮名对齐')
assert.match(page, /上传数字人程序 ZIP 包,系统会自动计算 MD5 并存储到 OSS。上传后状态为草稿,需要手动发布/, '上传弹窗描述对齐') assert.match(page, /上传数字人程序 ZIP 包,系统会自动计算 MD5 并存储到 OSS。上传后状态为草稿,需要手动发布/, '上传弹窗描述对齐')
assert.match(page, /正在上传/, '上传进度文案') assert.match(page, /正在上传/, '上传进度文案')
assert.match(page, /digitalHumanDeleteConfirmText/, '删除确认文案走对齐模型') assert.match(page, /digitalHumanDeleteConfirmText/, '删除确认文案走对齐模型')
assert.match(page, /downloadUrl|fetchDigitalHumanDownloadUrl/, 'RELEASED 下载按钮点击取链接') assert.match(page, /fetchDigitalHumanDownloadUrl/, 'RELEASED 下载按钮点击取链接')
assert.match(page, /已废弃/, '状态三态接入') assert.match(page, /digitalHumanStatusDisplay/, '状态走展示层模型')
const display = readSource('src/pages/records/digitalhuman-status-display.ts')
assert.match(display, /已废弃/, '状态三态接入(草稿/已发布/已废弃)')
assert.match(page, /digitalHumanChangelogShort/, '更新说明 50 字符截断') assert.match(page, /digitalHumanChangelogShort/, '更新说明 50 字符截断')
}) })
@@ -7,32 +7,23 @@ import { readSource } from './helpers.ts'
// 菜单管理是树结构(非列表),商品类目树用懒加载+加载更多节点,均豁免。 // 菜单管理是树结构(非列表),商品类目树用懒加载+加载更多节点,均豁免。
test('align_pagination_normal_primary_path', () => { test('align_pagination_normal_primary_path', () => {
// 商品类目已像素复刻旧版(搜索态旧式分页)保留 EP 分页的剩余列表。 // 软件版本已像素复刻旧版(panel-version 全量无分页) EP 分页列表剩余为 0
for (const page of [ const dh = readSource('src/pages/records/RecordsDigitalHumanVersionPage.vue')
'src/pages/records/RecordsSoftwareVersionPage.vue', assert.match(dh, /page-nums/, '数字人版本用数字页码分页(像素复刻)')
]) {
const src = readSource(page)
assert.match(src, /el-pagination/, `${page} 应包含分页组件`)
}
}) })
test('align_pagination_normal_variant_input', () => { test('align_pagination_normal_variant_input', () => {
// 分页组件需含上一页/下一页(prev/next),中文文案由全局 zh-cn locale 渲染 // 数字人版本数字页码含上一页/下一页
for (const page of [ const dh = readSource('src/pages/records/RecordsDigitalHumanVersionPage.vue')
'src/pages/records/RecordsSoftwareVersionPage.vue', assert.match(dh, />上一页<\/button>/, '数字人分页含上一页')
]) { assert.match(dh, />下一页<\/button>/, '数字人分页含下一页')
const src = readSource(page)
assert.match(src, /el-pagination[^>]*layout="[^"]*prev[^"]*next/, `${page} 分页 layout 需含 prev/next`)
}
}) })
test('align_pagination_boundary_empty_input', () => { test('align_pagination_boundary_empty_input', () => {
// 软件版本为全量拉取,走客户端切片分页(computed 按 page/pageSize 切)。 // 数字人版本为全量拉取,走客户端切片分页(computed 按 page/pageSize 切)。
for (const page of ['src/pages/records/RecordsSoftwareVersionPage.vue']) { const dh = readSource('src/pages/records/RecordsDigitalHumanVersionPage.vue')
const src = readSource(page) assert.match(dh, /pagedItems/, '数字人版本应有客户端分页切片')
assert.match(src, /pagedRows|pageRows|pageItems|pagedItems/, `${page} 应有客户端分页切片`) assert.match(dh, /v-for="row in pagedItems/, '表格应绑定分页后的数据')
assert.match(src, /:data="paged/, `${page} 表格应绑定分页后的数据`)
}
}) })
test('align_pagination_boundary_single_item', () => { test('align_pagination_boundary_single_item', () => {
@@ -32,12 +32,14 @@ test('align_records_history_thumb_click_opens_preview', () => {
assert.doesNotMatch(s, /查看大图/, '无行内「查看大图」按钮') assert.doesNotMatch(s, /查看大图/, '无行内「查看大图」按钮')
}) })
test('align_digital_human_row_buttons_solid', () => { test('align_digital_human_row_buttons_old_btn', () => {
const s = readSource('src/pages/records/RecordsDigitalHumanVersionPage.vue') const s = readSource('src/pages/records/RecordsDigitalHumanVersionPage.vue')
assertRowButtonSolid(s, 'release') assert.match(s, /class="btn btn-sm"[^>]*@click="release\(row\)"/, '发布用旧版 btn-sm')
assertRowButtonSolid(s, 'setLatest') assert.match(s, /class="btn btn-sm"[^>]*@click="setLatest\(row\)"/, '设为最新用旧版 btn-sm')
assertRowButtonSolid(s, 'download') assert.match(s, /class="btn btn-sm btn-secondary"[^>]*@click="download\(row\)"/, '下载用旧版 btn-sm btn-secondary')
assertRowButtonSolid(s, 'remove') assert.match(s, /class="btn btn-sm btn-danger"[^>]*@click="remove\(row\)"/, '删除用旧版 btn-sm btn-danger')
assert.doesNotMatch(s, /el-button[^>]*@click="release/, '行内不再用 EP 按钮')
assert.match(s, /window\.confirm\(text\)/, '确认走原生 confirm 对齐旧版')
}) })
test('align_image_video_detail_and_download_solid', () => { test('align_image_video_detail_and_download_solid', () => {