From 7abc2196598d54c7a9adbdd672551c6ae34e9176 Mon Sep 17 00:00:00 2001
From: Hera Zhao <hera@euphon.net>
Date: Mon, 13 Apr 2026 15:13:37 +0000
Subject: [PATCH] =?UTF-8?q?fix:=20=E7=B2=BE=E6=B2=B9=E4=BB=B7=E7=9B=AE?=
 =?UTF-8?q?=E6=81=A2=E5=A4=8D=E5=8E=9F=E5=A7=8B=E6=98=BE=E7=A4=BA(?=
 =?UTF-8?q?=E6=AF=8F=E6=BB=B4/=E6=AF=8Fml/=E6=AF=8F=E9=A2=97)=EF=BC=8Cml?=
 =?UTF-8?q?=E4=BA=A7=E5=93=81=E7=94=A8=E6=96=B0=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

精油: 总滴数 + 每滴价格 + 每ml价格（和之前一样）
植物空胶囊: /颗（和之前一样）
ml产品: 总容量Xml + 每ml价格（新）

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 frontend/src/views/OilReference.vue | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/frontend/src/views/OilReference.vue b/frontend/src/views/OilReference.vue
index d928f5d..dd95487 100644
--- a/frontend/src/views/OilReference.vue
+++ b/frontend/src/views/OilReference.vue
@@ -146,9 +146,9 @@
             <div v-if="getMeta(name)?.retailPrice" class="oil-retail-line">¥{{ getMeta(name).retailPrice }}/瓶</div>
           </template>
           <template v-else>
-            <div class="oil-price-line">¥{{ oils.pricePerDrop(name).toFixed(2) }}<span class="oil-price-unit">/{{ oils.unitLabel(name) }}</span></div>
+            <div class="oil-price-line">¥{{ oils.pricePerDrop(name).toFixed(2) }}<span class="oil-price-unit">/{{ oilPriceUnit(name) }}</span></div>
             <div v-if="getMeta(name)?.retailPrice && getMeta(name)?.dropCount" class="oil-retail-line">
-              ¥{{ (getMeta(name).retailPrice / getMeta(name).dropCount).toFixed(2) }}/{{ oils.unitLabel(name) }}
+              ¥{{ (getMeta(name).retailPrice / getMeta(name).dropCount).toFixed(2) }}/{{ oilPriceUnit(name) }}
             </div>
           </template>
         </div>
@@ -172,7 +172,7 @@
               <div class="oil-card-price-info" v-if="getMeta(activeCardName)">
                 ¥ {{ (getMeta(activeCardName).bottlePrice || 0).toFixed(2) }}
                 <span v-if="oils.pricePerDrop(activeCardName)">
-                  &middot; ¥ {{ oils.pricePerDrop(activeCardName).toFixed(4) }}/{{ oils.unitLabel(activeCardName) }}
+                  &middot; ¥ {{ oils.pricePerDrop(activeCardName).toFixed(4) }}/{{ oilPriceUnit(activeCardName) }}
                 </span>
               </div>
             </div>
@@ -242,6 +242,10 @@
             <span class="detail-label">零售价</span>
             <span class="detail-value">¥ {{ getMeta(selectedOilName).retailPrice.toFixed(2) }}</span>
           </div>
+          <div v-if="!oils.isMlUnit(selectedOilName)" class="detail-row">
+            <span class="detail-label">每ml价格</span>
+            <span class="detail-value">{{ oils.pricePerDrop(selectedOilName) ? ('¥ ' + (oils.pricePerDrop(selectedOilName) * DROPS_PER_ML).toFixed(2)) : '--' }}</span>
+          </div>
 
           <h4 style="margin:16px 0 8px">含此精油的配方</h4>
           <div v-if="recipesWithOil.length" class="detail-recipes">
@@ -468,6 +472,12 @@ for (const [ml, drops] of Object.entries(VOLUME_OPTIONS)) {
   DROPS_TO_VOLUME[drops] = ml + 'ml'
 }
 
+function oilPriceUnit(name) {
+  if (oils.isMlUnit(name)) return 'ml'
+  if (name === '植物空胶囊') return '颗'
+  return '滴'
+}
+
 function volumeLabel(dropCount, name) {
   if (dropCount === 160) return '160颗'
   if (oils.isMlUnit(name)) return dropCount + 'ml'