我先获取设计系统推荐和图片资源,为这个三维重建仿真系统做准备。现在我来构建这个三维重建仿真系统的完整 HTML 代码。这是一个 Vue 3 应用,采用科技感暗色主题,分步骤自动推进。
```json{
"summary": "构建了一个三维重建仿真系统的 Vue 3 单页应用,包含7个步骤(拍照→图像预处理→点云生成→Mesh构建→纹理生成→模型导出→模型发布)。采用深色科技感主题,蓝紫渐变为主色调,每个步骤有独立的动画图标和状态指示器,步骤间自动过渡(带进度条),整体UI简洁且富有科技氛围。",
"widget": {
"type": "full-html",
"html": "<!DOCTYPE html>\n<html lang=\"zh-CN\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>三维重建仿真系统</title>\n <script src=\"https://cdn.tailwindcss.com\"></script>\n <script src=\"https://unpkg.com/vue@3/dist/vue.global.js\"></script>\n <link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.c…\">\n <link href=\"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500…\" rel=\"stylesheet\">\n <style>\n :root {\n --bg-primary: #0a0e1a;\n --bg-secondary: #111827;\n --bg-card: #0f1729;\n --bg-card-hover: #1a2338;\n --border-color: #1e293b;\n --border-glow: rgba(56, 189, 248, 0.15);\n --text-primary: #e2e8f0;\n --text-secondary: #94a3b8;\n --text-muted: #64748b;\n --accent-1: #38bdf8;\n --accent-2: #818cf8;\n --accent-3: #2dd4bf;\n --gradient-main: linear-gradient(135deg, #38bdf8, #818cf8);\n --gradient-glow: linear-gradient(135deg, rgba(56,189,248,0.2), rgba(129,140,248,0.2));\n --shadow-glow: 0 0 30px rgba(56,189,248,0.08);\n }\n\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n body {\n font-family: 'Space Grotesk', sans-serif;\n background: var(--bg-primary);\n color: var(--text-primary);\n min-height: 100vh;\n overflow-x: hidden;\n }\n\n /* 背景网格 */\n .bg-grid {\n background-image: \n linear-gradient(rgba(56,189,248,0.03) 1px, transparent 1px),\n linear-gradient(90deg, rgba(56,189,248,0.03) 1px, transparent 1px);\n background-size: 40px 40px;\n }\n\n /* 背景光晕 */\n .bg-glow {\n position: fixed;\n top: -20%;\n left: -10%;\n width: 60%;\n height: 60%;\n background: radial-gradient(ellipse at center, rgba(56,189,248,0.06) 0%, transparent 70%);\n pointer-events: none;\n z-index: 0;\n }\n .bg-glow-2 {\n position: fixed;\n bottom: -20%;\n right: -10%;\n width: 60%;\n height: 60%;\n background: radial-gradient(ellipse at center, rgba(129,140,248,0.05) 0%, transparent 70%);\n pointer-events: none;\n z-index: 0;\n }\n\n /* 主容器 */\n .app-container {\n position: relative;\n z-index: 1;\n max-width: 1200px;\n margin: 0 auto;\n padding: 2rem 1.5rem;\n min-height: 100vh;\n display: flex;\n flex-direction: column;\n }\n\n /* 头部 */\n .header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 1rem 0 2rem;\n border-bottom: 1px solid var(--border-color);\n margin-bottom: 2.5rem;\n }\n\n .logo {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n }\n\n .logo-icon {\n width: 40px;\n height: 40px;\n border-radius: 10px;\n background: var(--gradient-main);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.2rem;\n color: #fff;\n box-shadow: 0 0 20px rgba(56,189,248,0.2);\n }\n\n .logo-text {\n font-weight: 600;\n font-size: 1.25rem;\n letter-spacing: -0.02em;\n background: var(--gradient-main);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n }\n\n .logo-sub {\n font-size: 0.7rem;\n color: var(--text-muted);\n letter-spacing: 0.15em;\n text-transform: uppercase;\n font-weight: 400;\n }\n\n .header-status {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n font-size: 0.8rem;\n color: var(--text-secondary);\n }\n\n .status-dot {\n width: 8px;\n height: 8px;\n border-radius: 50%;\n background: var(--accent-3);\n animation: pulse-dot 2s ease-in-out infinite;\n }\n\n @keyframes pulse-dot {\n 0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(45,212,191,0.4); }\n 50% { opacity: 0.7; box-shadow: 0 0 0 6px rgba(45,212,191,0); }\n }\n\n /* 进度条 */\n .progress-container {\n margin-bottom: 2.5rem;\n }\n\n .progress-bar-track {\n width: 100%;\n height: 3px;\n background: rgba(255,255,255,0.06);\n border-radius: 4px;\n overflow: hidden;\n position: relative;\n }\n\n .progress-bar-fill {\n height: 100%;\n background: var(--gradient-main);\n border-radius: 4px;\n transition: width 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);\n position: relative;\n }\n\n .progress-bar-fill::after {\n content: '';\n position: absolute;\n right: 0;\n top: 50%;\n transform: translateY(-50%);\n width: 8px;\n height: 8px;\n border-radius: 50%;\n background: var(--accent-1);\n box-shadow: 0 0 12px rgba(56,189,248,0.6);\n }\n\n .progress-label {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-top: 0.6rem;\n font-size: 0.75rem;\n color: var(--text-muted);\n letter-spacing: 0.05em;\n }\n\n .progress-percent {\n font-family: 'JetBrains Mono', monospace;\n color: var(--accent-1);\n font-weight: 500;\n }\n\n /* 步骤导航 */\n .steps-nav {\n display: flex;\n justify-content: space-between;\n margin-bottom: 3rem;\n position: relative;\n padding: 0 0.5rem;\n }\n\n .steps-nav::before {\n content: '';\n position: absolute;\n top: 20px;\n left: 2rem;\n right: 2rem;\n height: 1px;\n background: rgba(255,255,255,0.06);\n z-index: 0;\n }\n\n .step-item {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 0.5rem;\n position: relative;\n z-index: 1;\n cursor: pointer;\n transition: all 0.4s ease;\n }\n\n .step-circle {\n width: 40px;\n height: 40px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 0.9rem;\n transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);\n border: 2px solid rgba(255,255,255,0.08);\n background: var(--bg-card);\n color: var(--text-muted);\n position: relative;\n }\n\n .step-item.active .step-circle {\n border-color: var(--accent-1);\n background: rgba(56,189,248,0.12);\n color: var(--accent-1);\n box-shadow: 0 0 20px rgba(56,189,248,0.15);\n transform: scale(1.1);\n }\n\n .step-item.completed .step-circle {\n border-color: var(--accent-3);\n background: rgba(45,212,191,0.12);\n color: var(--accent-3);\n }\n\n .step-item.pending .step-circle {\n opacity: 0.5;\n }\n\n .step-label {\n font-size: 0.65rem;\n color: var(--text-muted);\n text-align: center;\n letter-spacing: 0.03em;\n transition: all 0.3s ease;\n max-width: 70px;\n line-height: 1.3;\n }\n\n .step-item.active .step-label {\n color: var(--accent-1);\n }\n\n .step-item.completed .step-label {\n color: var(--accent-3);\n }\n\n /* 主内容区 */\n .main-content {\n flex: 1;\n display: flex;\n flex-direction: column;\n }\n\n /* 步骤卡片 */\n .step-card {\n background: var(--bg-card);\n border: 1px solid var(--border-color);\n border-radius: 16px;\n padding: 2.5rem;\n position: relative;\n overflow: hidden;\n transition: all 0.5s ease;\n animation: card-enter 0.6s ease-out;\n }\n\n .step-card::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 2px;\n background: var(--gradient-main);\n opacity: 0.6;\n }\n\n @keyframes card-enter {\n from {\n opacity: 0;\n transform: translateY(20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n .step-card-header {\n display: flex;\n align-items: center;\n gap: 1rem;\n margin-bottom: 1.5rem;\n }\n\n .step-icon {\n width: 52px;\n height: 52px;\n border-radius: 14px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.4rem;\n background: var(--gradient-glow);\n border: 1px solid rgba(56,189,248,0.15);\n color: var(--accent-1);\n flex-shrink: 0;\n }\n\n .step-icon.spinning i {\n animation: spin 2s linear infinite;\n }\n\n @keyframes spin {\n from { transform: rotate(0deg); }\n to { transform: rotate(360deg); }\n }\n\n .step-title {\n font-size: 1.3rem;\n font-weight: 600;\n letter-spacing: -0.01em;\n }\n\n .step-title .step-num {\n color: var(--text-muted);\n font-weight: 400;\n font-size: 0.85rem;\n margin-right: 0.5rem;\n }\n\n .step-status-badge {\n margin-left: auto;\n padding: 0.3rem 0.8rem;\n border-radius: 20px;\n font-size: 0.7rem;\n font-weight: 500;\n letter-spacing: 0.05em;\n text-transform: uppercase;\n }\n\n .step-status-badge.running {\n background: rgba(56,189,248,0.12);\n color: var(--accent-1);\n border: 1px solid rgba(56,189,248,0.2);\n animation: pulse-badge 2s ease-in-out infinite;\n }\n\n .step-status-badge.done {\n background: rgba(45,212,191,0.12);\n color: var(--accent-3);\n border: 1px solid rgba(45,212,191,0.2);\n }\n\n .step-status-badge.waiting {\n background: rgba(255,255,255,0.04);\n color: var(--text-muted);\n border: 1px solid rgba(255,255,255,0.06);\n }\n\n @keyframes pulse-badge {\n 0%, 100% { opacity: 1; }\n 50% { opacity: 0.7; }\n }\n\n .step-body {\n color: var(--text-secondary);\n line-height: 1.7;\n font-size: 0.95rem;\n }\n\n .step-body p {\n margin-bottom: 1rem;\n }\n\n /* 模拟进度指示 */\n .sim-progress {\n margin-top: 1.5rem;\n padding: 1.2rem;\n background: rgba(0,0,0,0.2);\n border-radius: 10px;\n border: 1px solid rgba(255,255,255,0.04);\n }\n\n .sim-progress-bar {\n height: 6px;\n background: rgba(255,255,255,0.06);\n border-radius: 4px;\n overflow: hidden;\n margin-bottom: 0.6rem;\n }\n\n .sim-progress-fill {\n height: 100%;\n background: var(--gradient-main);\n border-radius: 4px;\n transition: width 0.3s ease;\n position: relative;\n }\n\n .sim-progress-fill::after {\n content: '';\n position: absolute;\n right: 0;\n top: 0;\n bottom: 0;\n width: 20px;\n background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3));\n border-radius: 4px;\n }\n\n .sim-progress-text {\n display: flex;\n justify-content: space-between;\n font-size: 0.75rem;\n font-family: 'JetBrains Mono', monospace;\n color: var(--text-muted);\n }\n\n .sim-progress-text .percent {\n color: var(--accent-1);\n }\n\n /* 日志输出 */\n .log-output {\n margin-top: 1.5rem;\n background: rgba(0,0,0,0.3);\n border-radius: 10px;\n padding: 1rem 1.2rem;\n border: 1px solid rgba(255,255,255,0.04);\n max-height: 120px;\n overflow-y: auto;\n font-family: 'JetBrains Mono', monospace;\n font-size: 0.75rem;\n line-height: 1.8;\n color: var(--text-muted);\n }\n\n .log-output::-webkit-scrollbar {\n width: 3px;\n }\n .log-output::-webkit-scrollbar-track {\n background: transparent;\n }\n .log-output::-webkit-scrollbar-thumb {\n background: rgba(56,189,248,0.2);\n border-radius: 4px;\n }\n\n .log-line {\n opacity: 0;\n animation: log-fade 0.3s ease forwards;\n }\n\n .log-line .log-time {\n color: var(--text-muted);\n margin-right: 0.6rem;\n }\n .log-line .log-info {\n color: var(--accent-1);\n }\n .log-line .log-success {\n color: var(--accent-3);\n }\n .log-line .log-warn {\n color: #fbbf24;\n }\n\n @keyframes log-fade {\n to { opacity: 1; }\n }\n\n /* 步骤详情网格 */\n .step-details {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 1rem;\n margin-top: 1.2rem;\n }\n\n .detail-item {\n padding: 0.8rem 1rem;\n background: rgba(0,0,0,0.15);\n border-radius: 8px;\n border: 1px solid rgba(255,255,255,0.04);\n }\n\n .detail-item .label {\n font-size: 0.65rem;\n color: var(--text-muted);\n text-transform: uppercase;\n letter-spacing: 0.08em;\n margin-bottom: 0.3rem;\n }\n\n .detail-item .value {\n font-size: 0.9rem;\n color: var(--text-primary);\n font-weight: 500;\n }\n\n .detail-item .value.highlight {\n color: var(--accent-1);\n }\n\n /* 底部操作区 */\n .footer-actions {\n margin-top: 2rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n\n .btn {\n padding: 0.7rem 1.8rem;\n border-radius: 10px;\n font-size: 0.85rem;\n font-weight: 500;\n font-family: 'Space Grotesk', sans-serif;\n cursor: pointer;\n transition: all 0.3s ease;\n border: none;\n display: inline-flex;\n align-items: center;\n gap: 0.5rem;\n letter-spacing: 0.02em;\n }\n\n .btn-primary {\n background: var(--gradient-main);\n color: #fff;\n box-shadow: 0 4px 15px rgba(56,189,248,0.2);\n }\n\n .btn-primary:hover {\n transform: translateY(-2px);\n box-shadow: 0 6px 25px rgba(56,189,248,0.3);\n }\n\n .btn-primary:disabled {\n opacity: 0.4;\n cursor: not-allowed;\n transform: none;\n }\n\n .btn-ghost {\n background: transparent;\n color: var(--text-secondary);\n border: 1px solid var(--border-color);\n }\n\n .btn-ghost:hover {\n background: rgba(255,255,255,0.04);\n border-color: rgba(255,255,255,0.1);\n }\n\n .btn-success {\n background: linear-gradient(135deg, #2dd4bf, #14b8a6);\n color: #fff;\n box-shadow: 0 4px 15px rgba(45,212,191,0.2);\n }\n\n .btn-success:hover {\n transform: translateY(-2px);\n box-shadow: 0 6px 25px rgba(45,212,191,0.3);\n }\n\n /* 完成状态 */\n .completed-all {\n text-align: center;\n padding: 3rem 2rem;\n }\n\n .completed-all .big-icon {\n font-size: 3rem;\n color: var(--accent-3);\n margin-bottom: 1rem;\n animation: success-bounce 0.6s ease-out;\n }\n\n @keyframes success-bounce {\n 0% { transform: scale(0); opacity: 0; }\n 50% { transform: scale(1.2); }\n 100% { transform: scale(1); opacity: 1; }\n }\n\n .completed-all h2 {\n font-size: 1.5rem;\n margin-bottom: 0.5rem;\n background: var(--gradient-main);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n }\n\n .completed-all p {\n color: var(--text-muted);\n margin-bottom: 1.5rem;\n }\n\n /* 响应式 */\n @media (max-width: 768px) {\n .app-container {\n padding: 1rem;\n }\n .header {\n flex-direction: column;\n align-items: flex-start;\n gap: 0.8rem;\n padding-bottom: 1.2rem;\n margin-bottom: 1.5rem;\n }\n .header-status {\n align-self: flex-start;\n }\n .steps-nav {\n overflow-x: auto;\n gap: 0.3rem;\n padding-bottom: 0.5rem;\n justify-content: flex-start;\n }\n .steps-nav::before {\n display: none;\n }\n .step-item {\n min-width: 60px;\n }\n .step-circle {\n width: 34px;\n height: 34px;\n font-size: 0.75rem;\n }\n .step-label {\n font-size: 0.55rem;\n max-width: 55px;\n }\n .step-card {\n padding: 1.5rem;\n }\n .step-details {\n grid-template-columns: 1fr;\n }\n .step-card-header {\n flex-wrap: wrap;\n }\n .step-status-badge {\n margin-left: 0;\n }\n .footer-actions {\n flex-direction: column;\n gap: 0.8rem;\n }\n .btn {\n width: 100%;\n justify-content: center;\n }\n }\n\n @media (max-width: 480px) {\n .step-card {\n padding: 1rem;\n }\n .step-icon {\n width: 40px;\n height: 40px;\n font-size: 1rem;\n }\n .step-title {\n font-size: 1rem;\n }\n .log-output {\n max-height: 80px;\n font-size: 0.65rem;\n }\n }\n </style>\n</head>\n<body>\n\n<div id=\"app\">\n <div class=\"bg-glow\"></div>\n <div class=\"bg-glow-2\"></div>\n \n <div class=\"app-container bg-grid\">\n \n <!-- 头部 -->\n <header class=\"header\">\n <div class=\"logo\">\n <div class=\"logo-icon\">\n <i class=\"fas fa-cube\"></i>\n </div>\n <div>\n <div class=\"logo-text\">3D 重建系统</div>\n <div class=\"logo-sub\">三维重建仿真平台</div>\n </div>\n </div>\n <div class=\"header-status\">\n <span class=\"status-dot\"></span>\n <span>{{ statusText }}</span>\n </div>\n </header>\n\n <!-- 进度条 -->\n <div class=\"progress-container\">\n <div class=\"progress-bar-track\">\n <div class=\"progress-bar-fill\" :style=\"{ width: progressPercent + '%' }\"></div>\n </div>\n <div class=\"progress-label\">\n <span>步骤 {{ currentStepIndex + 1 }} / {{ steps.length }}</span>\n <span class=\"progress-percent\">{{ Math.round(progressPercent) }}%</span>\n </div>\n </div>\n\n <!-- 步骤导航 -->\n <div class=\"steps-nav\">\n <div v-for=\"(step, index) in steps\" :key=\"index\" \n class=\"step-item\"\n :class=\"{ active: currentStepIndex === index, completed: index < currentStepIndex, pending: index > currentStepIndex }\">\n <div class=\"step-circle\">\n <i v-if=\"index < currentStepIndex\" class=\"fas fa-check\"></i>\n <i v-else-if=\"currentStepIndex === index && isRunning\" class=\"fas fa-spinner\"></i>\n <span v-else>{{ index + 1 }}</span>\n </div>\n <div class=\"step-label\">{{ step.short }}</div>\n </div>\n </div>\n\n <!-- 主内容 -->\n <div class=\"main-content\">\n \n <!-- 全部完成 -->\n <div v-if=\"allCompleted\" class=\"step-card\">\n <div class=\"completed-all\">\n <div class=\"big-icon\">\n <i class=\"fas fa-check-circle\"></i>\n </div>\n <h2>三维重建已完成</h2>\n <p>所有步骤已成功执行,模型已发布至平台</p>\n <div class=\"step-details\" style=\"text-align: left; max-width: 400px; margin: 0 auto 1.5rem;\">\n <div class=\"detail-item\">\n <div class=\"label\">模型名称</div>\n <div class=\"value highlight\">Reconstruction_Model_v1</div>\n </div>\n <div class=\"detail-item\">\n <div class=\"label\">三角面数</div>\n <div class=\"value\">2,847,632</div>\n </div>\n <div class=\"detail-item\">\n <div class=\"label\">纹理分辨率</div>\n <div class=\"value\">8192 × 8192</div>\n </div>\n <div class=\"detail-item\">\n <div class=\"label\">处理耗时</div>\n <div class=\"value highlight\">{{ totalTime }}</div>\n </div>\n </div>\n <button class=\"btn btn-primary\" @click=\"resetAll\">\n <i class=\"fas fa-rotate\"></i> 重新开始\n </button>\n </div>\n </div>\n\n <!-- 当前步骤卡片 -->\n <div v-else class=\"step-card\" :key=\"currentStepIndex\">\n <div class=\"step-card-header\">\n <div class=\"step-icon\" :class=\"{ spinning: isRunning }\">\n <i :class=\"currentStep.icon\"></i>\n </div>\n <div>\n <div class=\"step-title\">\n <span class=\"step-num\">步骤 {{ currentStepIndex + 1 }}</span>\n {{ currentStep.title }}\n </div>\n </div>\n <div class=\"step-status-badge\" :class=\"isRunning ? 'running' : (currentStepIndex < steps.length ? 'waiting' : 'done')\">\n {{ isRunning ? '执行中...' : '等待开始' }}\n </div>\n </div>\n\n <div class=\"step-body\">\n <p>{{ currentStep.description }}</p>\n\n <!-- 步骤详情 -->\n <div class=\"step-details\" v-if=\"currentStep.details\">\n <div class=\"detail-item\" v-for=\"(detail, dIdx) in currentStep.details\" :key=\"dIdx\">\n <div class=\"label\">{{ detail.label }}</div>\n <div class=\"value\" :class=\"{ highlight: detail.highlight }\">{{ isRunning ? detail.value : '--' }}</div>\n </div>\n </div>\n\n <!-- 模拟进度 -->\n <div class=\"sim-progress\" v-if=\"isRunning\">\n <div class=\"sim-progress-bar\">\n <div class=\"sim-progress-fill\" :style=\"{ width: simPercent + '%' }\"></div>\n </div>\n <div class=\"sim-progress-text\">\n <span>{{ currentStep.action }}</span>\n <span class=\"percent\">{{ Math.round(simPercent) }}%</span>\n </div>\n </div>\n\n <!-- 日志 -->\n <div class=\"log-output\" v-if=\"logs.length > 0\" ref=\"logContainer\">\n <div v-for=\"(log, lIdx) in logs\" :key=\"lIdx\" class=\"log-line\">\n <span class=\"log-time\">[{{ log.time }}]</span>\n <span :class=\"'log-' + log.type\">{{ log.msg }}</span>\n </div>\n </div>\n </div>\n\n <div class=\"footer-actions\">\n <button class=\"btn btn-ghost\" @click=\"skipStep\" :disabled=\"isRunning || allCompleted\">\n <i class=\"fas fa-forward-step\"></i> 跳过\n </button>\n <button v-if=\"!isRunning && !allCompleted\" class=\"btn btn-primary\" @click=\"startCurrentStep\">\n <i class=\"fas fa-play\"></i> 开始执行\n </button>\n <button v-else-if=\"isRunning\" class=\"btn btn-ghost\" disabled>\n <i class=\"fas fa-spinner fa-spin\"></i> 执行中...\n </button>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n<script>\nconst { createApp, ref, computed, onMounted, nextTick, watch } = Vue;\n\ncreateApp({\n setup() {\n const steps = [\n {\n short: '拍照',\n title: '多角度图像采集',\n icon: 'fas fa-camera',\n action: '正在采集多角度图像...',\n description: '系统正在通过多视角相机阵列对目标物体进行全方位图像采集,覆盖 360° 视角,确保每个角度都有足够的重叠区域用于后续重建。',\n details: [\n { label: '采集角度', value: '72 个视角', highlight: true },\n { label: '图像分辨率', value: '4096 × 3072 px' },\n { label: '覆盖范围', value: '360° × 180°' },\n { label: '预计耗时', value: '约 45 秒' }\n ]\n },\n {\n short: '预处理',\n title: '图像预处理',\n icon: 'fas fa-sliders',\n action: '正在预处理图像数据...',\n description: '对采集到的原始图像进行去噪、色彩校正、白平衡调整和畸变矫正,提取特征点并进行图像对齐,为点云生成准备高质量数据。',\n details: [\n { label: '图像数量', value: '72 张', highlight: true },\n { label: '特征点提取', value: 'SIFT + SuperPoint' },\n { label: '匹配对数', value: '2,847 对' },\n { label: '预计耗时', value: '约 60 秒' }\n ]\n },\n {\n short: '点云生成',\n title: '稀疏与稠密点云生成',\n icon: 'fas fa-cloud',\n action: '正在生成点云数据