feat: 非精油产品编辑页面适配 — 容量输入框+单位下拉(ml/g/颗)
All checks were successful
Test / unit-test (push) Successful in 6s
Test / build-check (push) Successful in 4s
PR Preview / teardown-preview (pull_request) Has been skipped
Test / e2e-test (push) Successful in 2m56s
PR Preview / test (pull_request) Successful in 6s
PR Preview / deploy-preview (pull_request) Successful in 16s

- 编辑弹窗根据unit类型显示不同UI:精油用标准容量下拉,其他产品用数字+单位选择
- 标签"精油名称"/"产品名称"自动切换
- 保存时传unit参数

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-04-14 17:11:50 +00:00
parent 9e11270fbf
commit e30891d3d2

View File

@@ -327,28 +327,45 @@
</div>
<div class="modal-body">
<div class="form-group">
<label>精油名称</label>
<input v-model="editOilDisplayName" class="form-input" type="text" placeholder="精油名称" />
<label>{{ editUnit === 'drop' ? '精油名称' : '产品名称' }}</label>
<input v-model="editOilDisplayName" class="form-input" type="text" :placeholder="editUnit === 'drop' ? '精油名称' : '产品名称'" />
</div>
<div class="form-group">
<label>英文名</label>
<input v-model="editOilEnName" class="form-input" type="text" placeholder="English name" />
</div>
<div class="form-group">
<label>容量</label>
<select v-model="editVolume" class="form-select">
<option value="2.5">2.5ml (46)</option>
<option value="5">5ml (93)</option>
<option value="10">10ml (186)</option>
<option value="15">15ml (280)</option>
<option value="115">115ml (2146)</option>
<option value="custom">自定义</option>
</select>
</div>
<div class="form-group" v-if="editVolume === 'custom'">
<label>自定义滴数</label>
<input v-model.number="editDropCount" class="form-input" type="number" />
</div>
<!-- 精油容量 -->
<template v-if="editUnit === 'drop'">
<div class="form-group">
<label>容量</label>
<select v-model="editVolume" class="form-select">
<option value="2.5">2.5ml (46)</option>
<option value="5">5ml (93)</option>
<option value="10">10ml (186)</option>
<option value="15">15ml (280)</option>
<option value="115">115ml (2146)</option>
<option value="custom">自定义</option>
</select>
</div>
<div class="form-group" v-if="editVolume === 'custom'">
<label>自定义滴数</label>
<input v-model.number="editDropCount" class="form-input" type="number" />
</div>
</template>
<!-- 其他产品容量 -->
<template v-else>
<div class="form-group">
<label>容量</label>
<div style="display:flex;gap:6px;align-items:center">
<input v-model.number="editProductAmount" class="form-input" type="number" min="1" style="flex:1" />
<select v-model="editProductUnit" class="form-select" style="width:70px">
<option value="ml">ml</option>
<option value="g">g</option>
<option value="capsule"></option>
</select>
</div>
</div>
</template>
<div class="form-group">
<label>会员价 (¥)</label>
<input v-model.number="editBottlePrice" class="form-input" type="number" />
@@ -468,6 +485,9 @@ const editVolume = ref('5')
const editDropCount = ref(0)
const editRetailPrice = ref(null)
const editOilEnName = ref('')
const editUnit = ref('drop')
const editProductAmount = ref(null)
const editProductUnit = ref('ml')
const editCardEmoji = ref('')
const editCardEffects = ref('')
const editCardUsage = ref('')
@@ -727,6 +747,11 @@ function editOil(name) {
editDropCount.value = dc
editRetailPrice.value = meta?.retailPrice || null
editOilEnName.value = meta?.enName || getEnglishName(name) || ''
editUnit.value = meta?.unit || 'drop'
if (editUnit.value !== 'drop') {
editProductAmount.value = dc
editProductUnit.value = editUnit.value
}
// Load knowledge card if exists
const card = getOilCard(name)
editCardEmoji.value = card?.emoji || ''
@@ -752,12 +777,15 @@ async function saveEditOil() {
if (newName && newName !== oldName) {
await oils.deleteOil(oldName)
}
const finalDropCount = editUnit.value !== 'drop' ? editProductAmount.value : dropCount
const finalUnit = editUnit.value !== 'drop' ? editProductUnit.value : null
await oils.saveOil(
newName || oldName,
editBottlePrice.value,
dropCount,
finalDropCount,
editRetailPrice.value,
editOilEnName.value.trim() || null
editOilEnName.value.trim() || null,
finalUnit
)
// Save knowledge card if any content provided
const finalName = newName || oldName