frontend/src/components/RecipeCard.vue

@@ -56,11 +56,15 @@ const volumeLabel = computed(() => {
     if (ml <= 2) return '单次'
     return `${Math.round(ml)}ml`
   }
-  // Non-coconut: find portion product and show its amount + unit
-  const portionIng = ings.find(i => oilsStore.isPortionUnit(i.oil))
-  if (portionIng) {
-    return `${portionIng.drops}${oilsStore.unitLabel(portionIng.oil)}`
+  // Non-coconut: sum portion products by unit
+  const unitSums = {}
+  for (const ing of ings) {
+    if (!oilsStore.isPortionUnit(ing.oil)) continue
+    const u = oilsStore.unitLabel(ing.oil)
+    unitSums[u] = (unitSums[u] || 0) + (ing.drops || 0)
   }
+  const parts = Object.entries(unitSums).map(([u, v]) => `${Math.round(v)}${u}`)
+  if (parts.length) return parts.join('+')
   return ''
 })
 </script>