恢复相似案例卡片优化展示

- 恢复 TOP 1 至 TOP 5 的独立标签布局\n- 恢复案例长文本自动换行和相似度展示\n- 优化移动端相似案例布局\n- 保持 AI 预防建议基础展示格式不变

src/components/assistant/AssistantResponseCard.vue

@@ -41,6 +41,13 @@ interface CardData extends AssistantResponseCard {
   confidence?: string;
   analysisBase?: string;
   risks?: Array<{ level: string; title: string; detail: string }>;
+  similarCases?: Array<{
+    date?: string | null;
+    product?: string | null;
+    problem?: string | null;
+    solution?: string | null;
+    similarity?: number | null;
+  }>;
   warning?: string;
 }
 const data = computed(() => props.card as CardData);
@@ -224,6 +231,26 @@ function formatCount(value: unknown) {
           当前标准库暂无可匹配规则，请补充产品品类、包材或检测指标。
         </p>
       </section>
+      <section v-if="data.similarCases?.length" class="solution-section">
+        <h4>相似历史案例</h4>
+        <div
+          v-for="(item, index) in data.similarCases"
+          :key="`${item.date}-${index}`"
+          class="standard-row"
+        >
+          <span>TOP {{ index + 1 }}</span>
+          <div>
+            <b>{{ item.product || "未命名产品" }}</b>
+            <small
+              >{{ item.problem || "异常问题未填写" }} →
+              {{ item.solution || "解决方案未填写" }}
+              <em v-if="item.similarity != null"
+                >相似度 {{ Math.round(item.similarity * 100) }}%</em
+              ></small
+            >
+          </div>
+        </div>
+      </section>
       <section v-if="data.risks?.length" class="solution-section risk-list">
         <div v-for="risk in data.risks" :key="risk.title" class="solution-risk">
           <span>{{ risk.level }}</span>
@@ -495,6 +522,7 @@ function formatCount(value: unknown) {
   font-size: 11px;
   line-height: 1.55;
 }
+
 .solution-risk {
   display: flex;
   gap: 7px;

src/components/assistant/RiskAnalysisCard.vue

@@ -238,11 +238,18 @@ const stars = computed(() => {
           class="case-row"
           type="button"
         >
-          <span>TOP {{ index + 1 }}</span>
-          <small
-            >{{ item.date }} · {{ item.product }} · {{ item.problem }} →
-            {{ item.solution }}</small
-          >
+          <span class="case-rank">TOP {{ index + 1 }}</span>
+          <div class="case-content">
+            <small>
+              {{ item.date || "日期未知" }} ·
+              {{ item.product || "未命名产品" }} ·
+              {{ item.problem || "异常问题未填写" }} →
+              {{ item.solution || "解决方案未填写" }}
+              <em v-if="item.similarity != null"
+                >相似度 {{ Math.round(item.similarity * 100) }}%</em
+              >
+            </small>
+          </div>
         </button>
       </section>
 
@@ -644,8 +651,8 @@ h3 {
 .case-row {
   display: grid;
   width: 100%;
-  grid-template-columns: minmax(0, 1fr) auto auto auto;
-  align-items: center;
+  grid-template-columns: 58px minmax(0, 1fr);
+  align-items: start;
   gap: 8px;
   border: 0;
   border-radius: 6px;
@@ -656,22 +663,36 @@ h3 {
   text-align: left;
 }
 
-.case-row span {
-  min-width: 0;
-  overflow: hidden;
-  font-size: 11px;
-  text-overflow: ellipsis;
+.case-rank {
+  display: inline-flex;
+  width: 58px;
+  min-width: 58px;
+  justify-content: flex-start;
+  padding-top: 1px;
+  color: var(--color-accent);
+  font-weight: 650;
   white-space: nowrap;
+  font-size: 11px;
 }
 
-.case-row small {
+.case-content {
+  min-width: 0;
+}
+
+.case-content small {
+  display: block;
   color: var(--color-text-faint);
   font-size: 9px;
+  line-height: 1.45;
+  overflow-wrap: anywhere;
+  word-break: break-word;
 }
 
-.case-row strong {
+.case-content em {
+  margin-left: 6px;
   color: var(--color-accent);
-  font-size: 11px;
+  font-style: normal;
+  white-space: nowrap;
 }
 
 .tips-card {
@@ -735,11 +756,16 @@ h3 {
   }
 
   .case-row {
-    grid-template-columns: minmax(0, 1fr) auto auto;
+    grid-template-columns: 50px minmax(0, 1fr);
   }
 
-  .case-row small {
-    display: none;
+  .case-rank {
+    width: 50px;
+    min-width: 50px;
+  }
+
+  .case-content small {
+    white-space: normal;
   }
 }
 </style>

src/types/risk.ts

@@ -39,10 +39,11 @@ export interface RiskAssessmentResult {
   modelVersion: string;
   factors: RiskFactorResult[];
   similarCases?: Array<{
-    date: string;
-    product: string;
-    problem: string;
-    solution: string;
+    date?: string | null;
+    product?: string | null;
+    problem?: string | null;
+    solution?: string | null;
+    similarity?: number | null;
   }>;
   aiSuggestions?: string[];
   riskBadge?: string | null;