新增内容,新增拉起软件层

This commit is contained in:
super
2026-06-08 09:19:15 +08:00
parent 8ab647c419
commit c85e5b278f
67 changed files with 1552 additions and 189 deletions

View File

@@ -0,0 +1,12 @@
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>图生视频</title>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/image-video-main.ts"></script>
</body>
</html>

View File

@@ -0,0 +1,7 @@
import { createApp } from 'vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import '@/styles/main.css'
import ImageVideoPage from '@/pages/image-video/ImageVideoPage.vue'
createApp(ImageVideoPage).use(ElementPlus).mount('#app')

View File

@@ -202,6 +202,9 @@ const dashboard = ref<SimilarAsinDashboardVo>({
failedTaskCount: 0,
})
const historyItems = ref<SimilarAsinHistoryItem[]>([])
// 前端实时进度态:保存最近一次 progress/batch 接口拿到的进度,作为 history 接口的兜底,
// 避免历史接口暂时返回不到该任务、或字段不全时,当前任务区出现进度回退/丢失。
const liveProgressItems = ref<Record<number, SimilarAsinHistoryItem>>({})
const visibleTaskSummary = computed(() => parseResult.value || queuedTaskSummary.value)
const pendingParseItem = computed<SimilarAsinHistoryItem | null>(() => {
@@ -219,10 +222,22 @@ const pendingParseItem = computed<SimilarAsinHistoryItem | null>(() => {
})
const currentItems = computed(() => {
const activeIds = new Set([...pollingTaskIds.value, ...pendingFileTaskIds.value])
const activeItems = historyItems.value.filter((item) => {
const status = normalizeTaskStatus(item)
return item.taskId != null && (activeIds.has(item.taskId) || status === 'RUNNING' || status === 'PENDING')
})
const activeItems = historyItems.value
.filter((item) => {
const status = normalizeTaskStatus(item)
return item.taskId != null && (activeIds.has(item.taskId) || status === 'RUNNING' || status === 'PENDING')
})
.map((item) => mergeCurrentTaskItem(item))
// 兜底history 暂未返回该任务,但实时缓存里仍在跑,保留它在当前任务区
for (const [taskIdText, liveItem] of Object.entries(liveProgressItems.value)) {
const taskId = Number(taskIdText)
if (!Number.isFinite(taskId) || taskId <= 0) continue
if (!activeIds.has(taskId) && normalizeTaskStatus(liveItem) !== 'RUNNING' && normalizeTaskStatus(liveItem) !== 'PENDING') {
continue
}
if (activeItems.some((item) => item.taskId === taskId)) continue
activeItems.push(mergeCurrentTaskItem(liveItem))
}
if (!pendingParseItem.value) return activeItems
const exists = activeItems.some((item) => item.taskId === pendingParseItem.value?.taskId)
return exists ? activeItems : [pendingParseItem.value, ...activeItems]
@@ -234,6 +249,20 @@ const historyOnlyItems = computed(() =>
}),
)
function mergeCurrentTaskItem(item: SimilarAsinHistoryItem) {
if (item.taskId == null) return item
const liveItem = liveProgressItems.value[item.taskId]
if (!liveItem) return item
return {
...item,
...liveItem,
sourceFilename: liveItem.sourceFilename || item.sourceFilename,
resultFilename: liveItem.resultFilename || item.resultFilename,
rowCount: liveItem.rowCount ?? item.rowCount,
createdAt: liveItem.createdAt || item.createdAt,
}
}
function effectiveCozeApiKey() {
return getStoredApiSecret('similar-asin').trim()
}
@@ -463,6 +492,11 @@ function addPollingTask(taskId: number) {
function removePollingTask(taskId: number) {
pollingTaskIds.value = pollingTaskIds.value.filter((id) => id !== taskId)
if (!pendingFileTaskIds.value.includes(taskId)) {
const next = { ...liveProgressItems.value }
delete next[taskId]
liveProgressItems.value = next
}
savePollingIds()
}
@@ -476,9 +510,32 @@ function addPendingFileTask(taskId: number) {
function removePendingFileTask(taskId: number) {
pendingFileTaskIds.value = pendingFileTaskIds.value.filter((id) => id !== taskId)
if (!pollingTaskIds.value.includes(taskId)) {
const next = { ...liveProgressItems.value }
delete next[taskId]
liveProgressItems.value = next
}
savePollingIds()
}
function removeTaskFromLocalState(taskId?: number) {
if (!taskId) return
removePollingTask(taskId)
removePendingFileTask(taskId)
if (parseResult.value?.taskId === taskId) {
clearParsedTask()
}
if (queuedTaskSummary.value?.taskId === taskId) {
queuedTaskSummary.value = null
}
historyItems.value = historyItems.value.filter((row) => row.taskId !== taskId)
if (liveProgressItems.value[taskId]) {
const next = { ...liveProgressItems.value }
delete next[taskId]
liveProgressItems.value = next
}
}
function ensurePolling() {
if (disposed) return
if (pollTimer.value != null) return
@@ -528,7 +585,14 @@ async function refreshTaskProgress() {
const task = detail.task
if (!task?.id) continue
const item = detail.items?.[0]
if (item) mergeHistoryItem(item)
if (item) {
// 实时缓存:以最新一次 progress 为准,避免 history 接口字段缺失/延迟时丢失进度
liveProgressItems.value = {
...liveProgressItems.value,
[task.id]: item,
}
mergeHistoryItem(item)
}
if (task.status === 'SUCCESS' || task.status === 'FAILED') {
removePollingTask(task.id)
shouldRefreshDashboard = true
@@ -848,11 +912,17 @@ async function downloadResult(item: SimilarAsinHistoryItem) {
async function deleteTaskRecord(item: SimilarAsinHistoryItem) {
try {
if (item.taskStatus === 'RUNNING' && item.taskId) {
await deleteSimilarAsinTask(item.taskId)
removePollingTask(item.taskId)
const status = normalizeTaskStatus(item)
const taskId = item.taskId
const shouldDeleteTask = taskId != null && (status === 'RUNNING' || status === 'PENDING' || !item.resultId)
if (shouldDeleteTask) {
await deleteSimilarAsinTask(taskId)
removeTaskFromLocalState(taskId)
} else if (item.resultId) {
await deleteSimilarAsinHistory(item.resultId)
if (item.taskId) {
historyItems.value = historyItems.value.filter((row) => row.taskId !== item.taskId)
}
}
await loadDashboard()
await loadHistory({ force: true })

View File

@@ -0,0 +1,198 @@
<template>
<div class="image-video-page">
<header class="page-header">
<span class="header-title">数富AI</span>
<a class="back-link" href="/home">返回首页</a>
</header>
<main class="entrances" aria-label="图生视频入口">
<button
type="button"
class="entrance-btn"
:disabled="launching"
@click="launchDesktop"
>
数字人
</button>
<button type="button" class="entrance-btn" @click="showSoon('带货视频')">
带货视频
</button>
<button type="button" class="entrance-btn" @click="showSoon('混剪')">
混剪
</button>
</main>
<div class="toast" :class="{ show: Boolean(statusText), error: statusType === 'error' }">
{{ statusText }}
</div>
</div>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { getPywebviewApi } from '@/shared/bridges/pywebview'
const launching = ref(false)
const statusText = ref('')
const statusType = ref<'normal' | 'error'>('normal')
let statusTimer: number | undefined
function showStatus(message: string, type: 'normal' | 'error' = 'normal') {
statusText.value = message
statusType.value = type
if (statusTimer) {
window.clearTimeout(statusTimer)
}
statusTimer = window.setTimeout(() => {
statusText.value = ''
}, 2200)
}
function showSoon(name: string) {
showStatus(`${name}暂未开通,敬请期待`)
}
async function launchDesktop() {
const api = getPywebviewApi()
if (!api?.launch_yaoayanui) {
showStatus('当前环境不支持拉起桌面端', 'error')
return
}
launching.value = true
try {
const result = await api.launch_yaoayanui()
if (result?.success) {
showStatus('已发送启动请求')
return
}
showStatus(result?.error || '启动失败', 'error')
} catch (error) {
showStatus(error instanceof Error ? error.message : String(error), 'error')
} finally {
launching.value = false
}
}
</script>
<style scoped>
.image-video-page {
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 40px;
color: #333;
font-family: "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", sans-serif;
background:
linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5)),
url('/static/bg.jpg') center/cover no-repeat,
#eef3f7;
}
.page-header {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 56px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 24px;
background: rgba(255, 255, 255, 0.5);
}
.header-title {
color: #333;
font-size: 18px;
font-weight: 600;
}
.back-link {
color: #555;
font-size: 14px;
text-decoration: none;
}
.back-link:hover {
color: #667eea;
}
.entrances {
display: flex;
gap: 32px;
flex-wrap: wrap;
justify-content: center;
}
.entrance-btn {
width: 160px;
height: 100px;
display: flex;
align-items: center;
justify-content: center;
color: #333;
background: #c5c1c1;
border: 4px solid #b8d4e3;
border-radius: 12px;
cursor: pointer;
font: inherit;
font-size: 18px;
font-weight: 600;
text-decoration: none;
transition: all 0.2s;
}
.entrance-btn:hover:not(:disabled) {
background: #f8fbfd;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.entrance-btn:disabled {
cursor: wait;
opacity: 0.72;
}
.toast {
position: fixed;
bottom: 40px;
left: 50%;
padding: 12px 24px;
max-width: min(420px, calc(100vw - 48px));
color: #fff;
background: rgba(0, 0, 0, 0.75);
border-radius: 8px;
font-size: 14px;
text-align: center;
opacity: 0;
pointer-events: none;
transform: translateX(-50%);
transition: opacity 0.3s;
}
.toast.show {
opacity: 1;
}
.toast.error {
background: rgba(176, 42, 55, 0.92);
}
@media (max-width: 640px) {
.image-video-page {
padding: 88px 24px 40px;
}
.entrances {
width: 100%;
gap: 18px;
}
.entrance-btn {
width: 100%;
max-width: 220px;
}
}
</style>

View File

@@ -60,6 +60,11 @@ export interface PywebviewApi {
path?: string;
error?: string;
}>;
launch_yaoayanui?: () => Promise<{
success: boolean;
path?: string;
error?: string;
}>;
enqueue_json?: (
data: unknown,
) => Promise<{ success: boolean; queue_size?: number; error?: string }>;

View File

@@ -54,6 +54,7 @@ export default defineConfig({
'patrol-delete': resolve(__dirname, 'patrol-delete.html'),
'query-asin': resolve(__dirname, 'query-asin.html'),
'collect-data': resolve(__dirname, 'collect-data.html'),
'image-video': resolve(__dirname, 'image-video.html'),
},
output: {
entryFileNames: 'assets/[name].js',