|
|
@@ -262,32 +262,11 @@
|
|
|
<div class="proposal-confirm-card card">
|
|
|
<div class="card-header">
|
|
|
<h2>方案确认</h2>
|
|
|
- <div class="sync-status">
|
|
|
+ <div class="sync-status">
|
|
|
<span class="progress-text">{{ getRequiredStagesProgress() }}% 完成</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
-<<<<<<< HEAD
|
|
|
-=======
|
|
|
- <!-- 参考图+色彩报告摘要 -->
|
|
|
- <!-- <div class="report-summary-title">参考图 + 色彩报告</div> -->
|
|
|
- <div class="report-summary" *ngIf="colorAnalysisResult; else noColorReportLeft">
|
|
|
- <div class="summary-left">
|
|
|
- <div class="ref-image-wrap" (click)="previewColorRefImage()" title="点击预览参考图">
|
|
|
- <img [src]="colorAnalysisResult.originalImage" alt="参考图预览" class="ref-image" />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="summary-right">
|
|
|
- <div class="palette">
|
|
|
- <div class="swatch" *ngFor="let c of colorAnalysisResult.colors; let i = index" [style.background]="c.hex" [title]="c.hex"></div>
|
|
|
- </div>
|
|
|
- <div class="main-color">主色：{{ dominantColorHex || (colorAnalysisResult.colors.length > 0 ? colorAnalysisResult.colors[0].hex : '未知') }}</div>
|
|
|
- <div class="status">分析状态：{{ isAnalyzing ? '解析中' : '已完成' }}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <ng-template #noColorReportLeft>
|
|
|
- <!-- <p class="placeholder-note">暂无色彩分析结果。完成左侧颜色提取后，这里将显示参考图与报告摘要。</p> -->
|
|
|
- </ng-template>
|
|
|
->>>>>>> 40a51193d4c23c1d7b0c30c59fee7a98d288dcee
|
|
|
+
|
|
|
|
|
|
<!-- 素材解析状态 -->
|
|
|
@if (isAnalyzing) {
|
|
|
@@ -643,7 +622,7 @@
|
|
|
@if (stage !== '订单创建') {
|
|
|
<div class="vertical-stage-header">
|
|
|
<span class="dot" [class.completed]="getStageStatus(stage) === 'completed'" [class.active]="getStageStatus(stage) === 'active'"></span>
|
|
|
- <h3>{{ stage }}</h3>
|
|
|
+ <h3>{{ stage === '方案确认' ? '色彩分析报告' : stage }}</h3>
|
|
|
</div>
|
|
|
}
|
|
|
<!-- 直接复用原阶段内容卡片：按stage匹配显示 -->
|
|
|
@@ -679,11 +658,10 @@
|
|
|
}
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="pane right" style="flex:1;">
|
|
|
- <div class="pane-header" style="font-weight:600;margin-bottom:8px;">色彩分析报告</div>
|
|
|
+ <!-- 中间列：保留 CAD 文件列表（不改动原展示） -->
|
|
|
+ <div class="pane middle" style="flex:1;">
|
|
|
+ <div class="pane-header" style="font-weight:600;margin-bottom:8px;">CAD图纸</div>
|
|
|
<div class="pane-body scroller" style="max-height:240px;overflow:auto;border:1px solid #eee;border-radius:8px;padding:8px;">
|
|
|
- <!-- 保持CAD列表展示不变，仅将右侧标题改为色彩分析报告 -->
|
|
|
- <div class="subsection-title" style="font-weight:600;margin-bottom:8px;">CAD图纸</div>
|
|
|
@if (cadFiles.length > 0) {
|
|
|
<div class="files-grid" style="display:grid;grid-template-columns:repeat(auto-fill, minmax(140px, 1fr));gap:8px;">
|
|
|
@for (file of cadFiles; track file.id) {
|
|
|
@@ -697,116 +675,63 @@
|
|
|
<div class="empty-tip" style="color:#888;">暂无CAD文件</div>
|
|
|
}
|
|
|
</div>
|
|
|
- <!-- 色彩分析报告：迁移到“确认需求”板块右侧显示 -->
|
|
|
- <div class="card color-report-card" style="margin-top:8px;">
|
|
|
- <div class="card-header">
|
|
|
- <h4>色彩分析报告</h4>
|
|
|
- </div>
|
|
|
- <div class="card-body">
|
|
|
- @if (isAnalyzing) {
|
|
|
- <div class="analysis-progress" style="margin-bottom:8px;">
|
|
|
- <div class="progress-header" style="display:flex;align-items:center;justify-content:space-between;">
|
|
|
- <h5 style="margin:0;font-size:14px;">正在解析素材...</h5>
|
|
|
- <span class="progress-percentage">{{ analysisProgress.toFixed(0) }}%</span>
|
|
|
- </div>
|
|
|
- <div class="progress-bar" style="height:6px;background:#eee;border-radius:6px;overflow:hidden;">
|
|
|
- <div class="progress-fill" [style.width.%]="analysisProgress" style="height:100%;background:#007AFF;"></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- }
|
|
|
- @if (colorAnalysisResult) {
|
|
|
- <div class="report-summary" style="display:flex;flex-direction:column;gap:16px;">
|
|
|
- <div class="report-images">
|
|
|
- <div class="section-title" style="font-weight:600;margin-bottom:6px;">参考图</div>
|
|
|
- <div class="images-row" style="display:flex;gap:8px;flex-wrap:wrap;">
|
|
|
- @if (colorAnalysisResult.originalImage) {
|
|
|
- <img [src]="colorAnalysisResult.originalImage" alt="参考图" (click)="previewImageFile(colorAnalysisResult.originalImage)" style="width:96px;height:96px;object-fit:cover;border-radius:6px;cursor:pointer;border:1px solid #eee;" />
|
|
|
- } @else {
|
|
|
- <div class="empty-tip" style="color:#888;">暂无参考图</div>
|
|
|
- }
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="palette">
|
|
|
- <div class="section-title" style="font-weight:600;margin-bottom:6px;font-size:12px;">色板</div>
|
|
|
- <div class="palette-row" style="display:flex;gap:6px;flex-wrap:wrap;">
|
|
|
- @for (c of colorAnalysisResult.colors; track c.hex) {
|
|
|
- <div class="palette-item" style="display:flex;align-items:center;gap:4px;padding:4px;border:1px solid #eee;border-radius:4px;">
|
|
|
- <div class="swatch" [style.backgroundColor]="c.hex" style="width:16px;height:16px;border-radius:3px;border:1px solid #ddd;"></div>
|
|
|
- <div class="hex" style="font-size:10px;color:#333;">{{ c.hex }}</div>
|
|
|
- <div class="pct" style="font-size:10px;color:#666;">{{ c.percentage }}%</div>
|
|
|
- </div>
|
|
|
- }
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="dominant-color">
|
|
|
- <div class="section-title" style="font-weight:600;margin-bottom:6px;font-size:12px;">主色</div>
|
|
|
- <div class="dominant-row" style="display:flex;align-items:center;gap:6px;">
|
|
|
- <div class="swatch" [style.backgroundColor]="dominantColorHex || '#ccc'" style="width:24px;height:24px;border-radius:4px;border:1px solid #ddd;"></div>
|
|
|
- <span class="hex" style="font-size:11px;color:#333;">
|
|
|
- {{ dominantColorHex || (colorAnalysisResult.colors.length > 0 ? colorAnalysisResult.colors[0].hex : '未知') }}
|
|
|
- </span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- } @else {
|
|
|
- <div class="empty-tip" style="color:#888;">暂无色彩分析结果</div>
|
|
|
- }
|
|
|
- </div>
|
|
|
- </div>
|
|
|
</div>
|
|
|
+
|
|
|
+
|
|
|
</div>
|
|
|
+
|
|
|
} @else if (stage === '方案确认') {
|
|
|
-<<<<<<< HEAD
|
|
|
- <!-- 方案确认阶段：右侧不再显示色彩分析报告 -->
|
|
|
-=======
|
|
|
- <!-- 替换右侧占位为：色彩分析报告（与参考图关联） -->
|
|
|
- <div class="card color-report-card" style="margin-top:8px;">
|
|
|
- <div class="card-header">
|
|
|
- <h4>方案确认</h4>
|
|
|
- </div>
|
|
|
- <div class="card-body">
|
|
|
- @if (colorAnalysisResult) {
|
|
|
- <div class="report-summary" style="display:flex;flex-direction:column;gap:16px;">
|
|
|
- <div class="report-images">
|
|
|
- <div class="section-title" style="font-weight:600;margin-bottom:6px;">参考图</div>
|
|
|
- @if (referenceImages.length > 0) {
|
|
|
- <div class="images-row" style="display:flex;gap:8px;flex-wrap:wrap;">
|
|
|
- @for (img of referenceImages; track img.id) {
|
|
|
- <img [src]="img.url" [alt]="img.name || '参考图'" class="image-thumb" (click)="previewImageFile(img.url)" style="width:80px;height:80px;object-fit:cover;border-radius:6px;cursor:pointer;border:1px solid #eee;" />
|
|
|
- }
|
|
|
- </div>
|
|
|
+ <!-- 直接以色彩分析面板填充最右侧全部区域 -->
|
|
|
+ <div class="color-analysis-panel" style="width:100%; display:flex; flex-direction:column; gap:14px;">
|
|
|
+ @if (isAnalyzing) {
|
|
|
+ <div class="analysis-progress" style="margin-bottom:4px;">
|
|
|
+ <div class="progress-header" style="display:flex;align-items:center;justify-content:space-between;">
|
|
|
+ <h5 style="margin:0;font-size:14px;">正在解析素材...</h5>
|
|
|
+ <span class="progress-percentage">{{ analysisProgress.toFixed(0) }}%</span>
|
|
|
+ </div>
|
|
|
+ <div class="progress-bar" style="height:8px;background:#eee;border-radius:6px;overflow:hidden;">
|
|
|
+ <div class="progress-fill" [style.width.%]="analysisProgress" style="height:100%;background:#007AFF;"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ }
|
|
|
+ @if (colorAnalysisResult) {
|
|
|
+ <div class="report-summary" style="display:flex;flex-direction:column;gap:18px;">
|
|
|
+ <div class="report-images">
|
|
|
+ <div class="section-title" style="font-weight:600;margin-bottom:8px;">参考图</div>
|
|
|
+ <div class="images-row" style="display:flex;gap:10px;flex-wrap:wrap;">
|
|
|
+ @if (colorAnalysisResult.originalImage) {
|
|
|
+ <img [src]="colorAnalysisResult.originalImage" alt="参考图" (click)="previewImageFile(colorAnalysisResult.originalImage)" style="width:140px;height:140px;object-fit:cover;border-radius:8px;cursor:pointer;border:1px solid #eee;" />
|
|
|
} @else {
|
|
|
<div class="empty-tip" style="color:#888;">暂无参考图</div>
|
|
|
}
|
|
|
</div>
|
|
|
- <div class="palette">
|
|
|
- <div class="section-title" style="font-weight:600;margin-bottom:6px;">色板</div>
|
|
|
- <div class="palette-row" style="display:flex;gap:8px;flex-wrap:wrap;">
|
|
|
- @for (c of colorAnalysisResult.colors; track c.hex) {
|
|
|
- <div class="palette-item" style="display:flex;align-items:center;gap:6px;padding:6px;border:1px solid #eee;border-radius:6px;">
|
|
|
- <div class="swatch" [style.backgroundColor]="c.hex" style="width:20px;height:20px;border-radius:4px;border:1px solid #ddd;"></div>
|
|
|
- <div class="hex" style="font-size:12px;color:#333;">{{ c.hex }}</div>
|
|
|
- <div class="pct" style="font-size:12px;color:#666;">{{ c.percentage }}%</div>
|
|
|
- </div>
|
|
|
- }
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ <div class="palette">
|
|
|
+ <div class="section-title" style="font-weight:600;margin-bottom:8px;font-size:13px;">色板</div>
|
|
|
+ <div class="palette-row" style="display:flex;gap:8px;flex-wrap:wrap;">
|
|
|
+ @for (c of colorAnalysisResult.colors; track c.hex) {
|
|
|
+ <div class="palette-item" style="display:flex;align-items:center;gap:6px;padding:6px;border:1px solid #eee;border-radius:6px;">
|
|
|
+ <div class="swatch" [style.backgroundColor]="c.hex" style="width:20px;height:20px;border-radius:4px;border:1px solid #ddd;"></div>
|
|
|
+ <div class="hex" style="font-size:12px;color:#333;">{{ c.hex }}</div>
|
|
|
+ <div class="pct" style="font-size:12px;color:#666;">{{ c.percentage }}%</div>
|
|
|
+ </div>
|
|
|
+ }
|
|
|
</div>
|
|
|
- <div class="dominant-color">
|
|
|
- <div class="section-title" style="font-weight:600;margin-bottom:6px;">主色</div>
|
|
|
- <div class="dominant-row" style="display:flex;align-items:center;gap:8px;">
|
|
|
- <div class="swatch" [style.backgroundColor]="dominantColorHex || '#ccc'" style="width:28px;height:28px;border-radius:6px;border:1px solid #ddd;"></div>
|
|
|
- <span class="hex" style="font-size:12px;color:#333;">
|
|
|
- {{ dominantColorHex || (colorAnalysisResult.colors.length > 0 ? colorAnalysisResult.colors[0].hex : '未知') }}
|
|
|
- </span>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ <div class="dominant-color">
|
|
|
+ <div class="section-title" style="font-weight:600;margin-bottom:8px;font-size:13px;">主色</div>
|
|
|
+ <div class="dominant-row" style="display:flex;align-items:center;gap:8px;">
|
|
|
+ <div class="swatch" [style.backgroundColor]="dominantColorHex || '#ccc'" style="width:28px;height:28px;border-radius:6px;border:1px solid #ddd;"></div>
|
|
|
+ <span class="hex" style="font-size:12px;color:#333;">
|
|
|
+ {{ dominantColorHex || (colorAnalysisResult.colors.length > 0 ? colorAnalysisResult.colors[0].hex : '未知') }}
|
|
|
+ </span>
|
|
|
</div>
|
|
|
</div>
|
|
|
- } @else {
|
|
|
- <div class="empty-tip" style="color:#888;">暂无色彩分析结果</div>
|
|
|
- }
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ } @else {
|
|
|
+ <div class="empty-tip" style="color:#888;">暂无色彩分析结果</div>
|
|
|
+ }
|
|
|
</div>
|
|
|
->>>>>>> 40a51193d4c23c1d7b0c30c59fee7a98d288dcee
|
|
|
} @else if (stage === '建模') {
|
|
|
<div class="upload-section">
|
|
|
<div class="upload-header">
|
