feat:customer23

src/app/pages/designer/project-detail/project-detail.html

@@ -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">