第二次迭代优化

src/views/orders/OrderDetailView.vue

@@ -128,7 +128,8 @@ onMounted(loadDetail)
           <div v-for="record in detail.writeOffRecordList" :key="record.id" class="record-row">
             <CheckCircle2 :size="18" />
             <div>
-              <strong>{{ record.packageName || detail.commodityName }}</strong>
+              <strong>{{ record.commodityName || detail.commodityName }}</strong>
+              <p v-if="record.packageName">套餐名称：{{ record.packageName }}</p>
               <p>{{ record.createTime }} · {{ record.userName || '员工' }}</p>
             </div>
           </div>
@@ -156,11 +157,17 @@ onMounted(loadDetail)
 
 .order-hero {
   display: grid;
-  grid-template-columns: 112px 1fr;
+  grid-template-columns: 112px minmax(0, 1fr);
   gap: 12px;
   padding: 12px;
 }
 
+.order-hero__content,
+.package-row div,
+.record-row div {
+  min-width: 0;
+}
+
 .order-hero img {
   width: 112px;
   height: 112px;
@@ -215,6 +222,7 @@ onMounted(loadDetail)
 .package-row strong,
 .record-row strong {
   color: var(--text-strong);
+  overflow-wrap: anywhere;
 }
 
 .package-row p,