2 Commits

Author SHA1 Message Date
08c2d5bd75 feat: 未登录用户也显示二维码上传提示,点击时引导登录/注册
Some checks failed
PR Preview / teardown-preview (pull_request) Has been skipped
Test / unit-test (push) Successful in 5s
Test / build-check (push) Successful in 4s
PR Preview / test (pull_request) Successful in 4s
PR Preview / deploy-preview (pull_request) Successful in 13s
Test / e2e-test (push) Failing after 1m7s
2026-04-07 22:13:42 +00:00
7030dd107c feat: 配方卡片加入上传个人二维码功能
Some checks failed
Test / unit-test (push) Successful in 5s
Test / build-check (push) Successful in 4s
PR Preview / teardown-preview (pull_request) Has been skipped
Test / e2e-test (push) Failing after 1m8s
PR Preview / test (pull_request) Successful in 5s
PR Preview / deploy-preview (pull_request) Successful in 13s
- RecipeDetailOverlay: 未上传二维码/背景图时,卡片上方显示提示横幅,下方出现「上传我的二维码」按钮,点击跳转到 MyDiary 品牌设置页并记录来源配方
- MyDiary: 新增二维码图片上传区域(直接上传图片文件,存为 base64 → PUT /api/brand qr_code 字段);上传成功后若有待返回配方则自动跳回配方卡片;修复 loadBrandSettings 字段名与后端不一致的问题
- RecipeSearch: 支持 ?openRecipe= 查询参数,页面挂载时自动打开指定配方卡片,实现从 MyDiary 上传后无缝返回

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-04-07 21:58:17 +00:00
13 changed files with 126 additions and 228 deletions

View File

@@ -238,10 +238,6 @@ def init_db():
c.execute("ALTER TABLE recipes ADD COLUMN owner_id INTEGER") c.execute("ALTER TABLE recipes ADD COLUMN owner_id INTEGER")
if "updated_by" not in cols: if "updated_by" not in cols:
c.execute("ALTER TABLE recipes ADD COLUMN updated_by INTEGER") c.execute("ALTER TABLE recipes ADD COLUMN updated_by INTEGER")
if "en_name" not in cols:
c.execute("ALTER TABLE recipes ADD COLUMN en_name TEXT DEFAULT ''")
if "en_oils" not in cols:
c.execute("ALTER TABLE recipes ADD COLUMN en_oils TEXT DEFAULT '{}'")
# Seed admin user if no users exist # Seed admin user if no users exist
count = c.execute("SELECT COUNT(*) FROM users").fetchone()[0] count = c.execute("SELECT COUNT(*) FROM users").fetchone()[0]

View File

@@ -95,8 +95,6 @@ class RecipeIn(BaseModel):
class RecipeUpdate(BaseModel): class RecipeUpdate(BaseModel):
name: Optional[str] = None name: Optional[str] = None
en_name: Optional[str] = None
en_oils: Optional[str] = None
note: Optional[str] = None note: Optional[str] = None
ingredients: Optional[list[IngredientIn]] = None ingredients: Optional[list[IngredientIn]] = None
tags: Optional[list[str]] = None tags: Optional[list[str]] = None
@@ -310,7 +308,7 @@ def symptom_search(body: dict, user=Depends(get_current_user)):
conn = get_db() conn = get_db()
# Search in recipe names # Search in recipe names
rows = conn.execute( rows = conn.execute(
"SELECT id, name, note, owner_id, version, en_name, en_oils FROM recipes ORDER BY id" "SELECT id, name, note, owner_id, version FROM recipes ORDER BY id"
).fetchall() ).fetchall()
exact = [] exact = []
related = [] related = []
@@ -698,8 +696,6 @@ def _recipe_to_dict(conn, row):
return { return {
"id": rid, "id": rid,
"name": row["name"], "name": row["name"],
"en_name": row["en_name"] if "en_name" in row.keys() else "",
"en_oils": row["en_oils"] if "en_oils" in row.keys() else "{}",
"note": row["note"], "note": row["note"],
"owner_id": row["owner_id"], "owner_id": row["owner_id"],
"owner_name": (owner["display_name"] or owner["username"]) if owner else None, "owner_name": (owner["display_name"] or owner["username"]) if owner else None,
@@ -714,19 +710,19 @@ def list_recipes(user=Depends(get_current_user)):
conn = get_db() conn = get_db()
# Admin sees all; others see admin-owned (adopted) + their own # Admin sees all; others see admin-owned (adopted) + their own
if user["role"] == "admin": if user["role"] == "admin":
rows = conn.execute("SELECT id, name, note, owner_id, version, en_name, en_oils FROM recipes ORDER BY id").fetchall() rows = conn.execute("SELECT id, name, note, owner_id, version FROM recipes ORDER BY id").fetchall()
else: else:
admin = conn.execute("SELECT id FROM users WHERE role = 'admin' LIMIT 1").fetchone() admin = conn.execute("SELECT id FROM users WHERE role = 'admin' LIMIT 1").fetchone()
admin_id = admin["id"] if admin else 1 admin_id = admin["id"] if admin else 1
user_id = user.get("id") user_id = user.get("id")
if user_id: if user_id:
rows = conn.execute( rows = conn.execute(
"SELECT id, name, note, owner_id, version, en_name, en_oils FROM recipes WHERE owner_id = ? OR owner_id = ? ORDER BY id", "SELECT id, name, note, owner_id, version FROM recipes WHERE owner_id = ? OR owner_id = ? ORDER BY id",
(admin_id, user_id) (admin_id, user_id)
).fetchall() ).fetchall()
else: else:
rows = conn.execute( rows = conn.execute(
"SELECT id, name, note, owner_id, version, en_name, en_oils FROM recipes WHERE owner_id = ? ORDER BY id", "SELECT id, name, note, owner_id, version FROM recipes WHERE owner_id = ? ORDER BY id",
(admin_id,) (admin_id,)
).fetchall() ).fetchall()
result = [_recipe_to_dict(conn, r) for r in rows] result = [_recipe_to_dict(conn, r) for r in rows]
@@ -737,7 +733,7 @@ def list_recipes(user=Depends(get_current_user)):
@app.get("/api/recipes/{recipe_id}") @app.get("/api/recipes/{recipe_id}")
def get_recipe(recipe_id: int): def get_recipe(recipe_id: int):
conn = get_db() conn = get_db()
row = conn.execute("SELECT id, name, note, owner_id, version, en_name, en_oils FROM recipes WHERE id = ?", (recipe_id,)).fetchone() row = conn.execute("SELECT id, name, note, owner_id, version FROM recipes WHERE id = ?", (recipe_id,)).fetchone()
if not row: if not row:
conn.close() conn.close()
raise HTTPException(404, "Recipe not found") raise HTTPException(404, "Recipe not found")
@@ -808,10 +804,6 @@ def update_recipe(recipe_id: int, update: RecipeUpdate, user=Depends(get_current
c.execute("UPDATE recipes SET name = ? WHERE id = ?", (update.name, recipe_id)) c.execute("UPDATE recipes SET name = ? WHERE id = ?", (update.name, recipe_id))
if update.note is not None: if update.note is not None:
c.execute("UPDATE recipes SET note = ? WHERE id = ?", (update.note, recipe_id)) c.execute("UPDATE recipes SET note = ? WHERE id = ?", (update.note, recipe_id))
if update.en_name is not None:
c.execute("UPDATE recipes SET en_name = ? WHERE id = ?", (update.en_name, recipe_id))
if update.en_oils is not None:
c.execute("UPDATE recipes SET en_oils = ? WHERE id = ?", (update.en_oils, recipe_id))
if update.ingredients is not None: if update.ingredients is not None:
c.execute("DELETE FROM recipe_ingredients WHERE recipe_id = ?", (recipe_id,)) c.execute("DELETE FROM recipe_ingredients WHERE recipe_id = ?", (recipe_id,))
for ing in update.ingredients: for ing in update.ingredients:
@@ -841,7 +833,7 @@ def delete_recipe(recipe_id: int, user=Depends(get_current_user)):
conn = get_db() conn = get_db()
row = _check_recipe_permission(conn, recipe_id, user) row = _check_recipe_permission(conn, recipe_id, user)
# Save full snapshot for undo # Save full snapshot for undo
full = conn.execute("SELECT id, name, note, owner_id, version, en_name, en_oils FROM recipes WHERE id = ?", (recipe_id,)).fetchone() full = conn.execute("SELECT id, name, note, owner_id, version FROM recipes WHERE id = ?", (recipe_id,)).fetchone()
snapshot = _recipe_to_dict(conn, full) snapshot = _recipe_to_dict(conn, full)
log_audit(conn, user["id"], "delete_recipe", "recipe", recipe_id, row["name"], log_audit(conn, user["id"], "delete_recipe", "recipe", recipe_id, row["name"],
json.dumps(snapshot, ensure_ascii=False)) json.dumps(snapshot, ensure_ascii=False))
@@ -1344,7 +1336,7 @@ def recipes_by_inventory(user=Depends(get_current_user)):
if not inv: if not inv:
conn.close() conn.close()
return [] return []
rows = conn.execute("SELECT id, name, note, owner_id, version, en_name, en_oils FROM recipes ORDER BY id").fetchall() rows = conn.execute("SELECT id, name, note, owner_id, version FROM recipes ORDER BY id").fetchall()
result = [] result = []
for r in rows: for r in rows:
recipe = _recipe_to_dict(conn, r) recipe = _recipe_to_dict(conn, r)

View File

@@ -15,8 +15,7 @@
@click="toggleUserMenu" @click="toggleUserMenu"
> >
<template v-if="auth.isLoggedIn"> <template v-if="auth.isLoggedIn">
👤 {{ auth.user.display_name || auth.user.username }} 👤 {{ auth.user.display_name || auth.user.username }}
</template> </template>
<template v-else> <template v-else>
<span style="background:rgba(255,255,255,0.2);padding:4px 12px;border-radius:12px">登录</span> <span style="background:rgba(255,255,255,0.2);padding:4px 12px;border-radius:12px">登录</span>
@@ -42,7 +41,7 @@
<UserMenu v-if="showUserMenu" @close="showUserMenu = false" /> <UserMenu v-if="showUserMenu" @close="showUserMenu = false" />
<!-- Nav tabs --> <!-- Nav tabs -->
<div class="nav-tabs" :style="isPreview ? { top: '36px' } : {}"> <div class="nav-tabs">
<div class="nav-tab" :class="{ active: ui.currentSection === 'search' }" @click="goSection('search')">🔍 配方查询</div> <div class="nav-tab" :class="{ active: ui.currentSection === 'search' }" @click="goSection('search')">🔍 配方查询</div>
<div class="nav-tab" :class="{ active: ui.currentSection === 'manage' }" @click="requireLogin('manage')">📋 管理配方</div> <div class="nav-tab" :class="{ active: ui.currentSection === 'manage' }" @click="requireLogin('manage')">📋 管理配方</div>
<div class="nav-tab" :class="{ active: ui.currentSection === 'inventory' }" @click="requireLogin('inventory')">📦 个人库存</div> <div class="nav-tab" :class="{ active: ui.currentSection === 'inventory' }" @click="requireLogin('inventory')">📦 个人库存</div>
@@ -65,7 +64,7 @@
<CustomDialog /> <CustomDialog />
<!-- Toast messages --> <!-- Toast messages -->
<div v-for="toast in ui.toasts" :key="toast.id" class="toast">{{ toast.msg }}</div> <div v-for="(toast, i) in ui.toasts" :key="i" class="toast">{{ toast }}</div>
</template> </template>
<script setup> <script setup>

View File

@@ -445,7 +445,7 @@ body {
.toast { .toast {
position: fixed; bottom: 80px; left: 50%; transform: translateX(-50%); position: fixed; bottom: 80px; left: 50%; transform: translateX(-50%);
background: rgba(0,0,0,0.8); color: white; padding: 10px 24px; background: rgba(0,0,0,0.8); color: white; padding: 10px 24px;
border-radius: 20px; font-size: 14px; z-index: 9000; border-radius: 20px; font-size: 14px; z-index: 999;
pointer-events: none; transition: opacity 0.3s; pointer-events: none; transition: opacity 0.3s;
} }

View File

@@ -11,8 +11,8 @@
ref="promptInput" ref="promptInput"
/> />
<div class="dialog-btn-row"> <div class="dialog-btn-row">
<button v-if="dialogState.type !== 'alert'" class="dialog-btn-outline" @click="cancel">{{ dialogState.cancelText || '取消' }}</button> <button v-if="dialogState.type !== 'alert'" class="dialog-btn-outline" @click="cancel">取消</button>
<button class="dialog-btn-primary" @click="ok">{{ dialogState.okText || '确定' }}</button> <button class="dialog-btn-primary" @click="ok">确定</button>
</div> </div>
</div> </div>
</div> </div>

View File

@@ -104,11 +104,8 @@ async function submit() {
ui.showToast('注册成功') ui.showToast('注册成功')
} }
emit('close') emit('close')
if (ui.pendingAction) { // Reload page data after auth change
ui.runPendingAction()
} else {
window.location.reload() window.location.reload()
}
} catch (e) { } catch (e) {
errorMsg.value = e?.message || (mode.value === 'login' ? '登录失败,请检查用户名和密码' : '注册失败,请重试') errorMsg.value = e?.message || (mode.value === 'login' ? '登录失败,请检查用户名和密码' : '注册失败,请重试')
} finally { } finally {
@@ -122,7 +119,7 @@ async function submit() {
position: fixed; position: fixed;
inset: 0; inset: 0;
background: rgba(0, 0, 0, 0.35); background: rgba(0, 0, 0, 0.35);
z-index: 6000; z-index: 5000;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;

View File

@@ -36,22 +36,27 @@
>English</button> >English</button>
</div> </div>
<!-- QR / brand upload hint -->
<div v-if="showBrandHint" class="brand-upload-hint">
<span class="hint-icon"></span>
<span>上传你的专属二维码生成属于自己的配方卡片</span>
</div>
<!-- Card image (rendered by html2canvas) --> <!-- Card image (rendered by html2canvas) -->
<div v-show="!cardImageUrl" ref="cardRef" class="export-card"> <div v-show="!cardImageUrl" ref="cardRef" class="export-card">
<!-- Brand overlay layers --> <!-- Brand overlay layers -->
<div
v-if="brand.brand_bg"
class="card-brand-bg"
:style="{ backgroundImage: `url('${brand.brand_bg}')` }"
/>
<div v-if="brand.qr_code" class="card-qr-wrapper">
<img <img
v-if="brand.brand_bg"
:src="brand.brand_bg"
class="card-brand-bg"
crossorigin="anonymous"
/>
<img
v-if="brand.qr_code"
:src="brand.qr_code" :src="brand.qr_code"
class="card-qr" class="card-qr"
crossorigin="anonymous" crossorigin="anonymous"
/> />
<div v-if="brand.brand_name" class="card-qr-name">{{ brand.brand_name }}</div>
</div>
<img <img
v-if="brand.brand_logo" v-if="brand.brand_logo"
:src="brand.brand_logo" :src="brand.brand_logo"
@@ -356,7 +361,6 @@ import { useAuthStore } from '../stores/auth'
import { useUiStore } from '../stores/ui' import { useUiStore } from '../stores/ui'
import { useDiaryStore } from '../stores/diary' import { useDiaryStore } from '../stores/diary'
import { api } from '../composables/useApi' import { api } from '../composables/useApi'
import { showConfirm, showPrompt } from '../composables/useDialog'
import { oilEn, recipeNameEn } from '../composables/useOilTranslation' import { oilEn, recipeNameEn } from '../composables/useOilTranslation'
// TagPicker replaced with inline tag editing // TagPicker replaced with inline tag editing
@@ -378,7 +382,6 @@ const viewMode = ref('card')
const cardRef = ref(null) const cardRef = ref(null)
const cardImageUrl = ref(null) const cardImageUrl = ref(null)
const cardLang = ref('zh') const cardLang = ref('zh')
const selectedCardVolume = ref('单次')
const showTranslationEditor = ref(false) const showTranslationEditor = ref(false)
const customRecipeNameEn = ref('') const customRecipeNameEn = ref('')
const customOilNameEn = ref({}) const customOilNameEn = ref({})
@@ -397,30 +400,14 @@ const canEditThisRecipe = computed(() => {
const isFav = computed(() => recipesStore.isFavorite(recipe.value)) const isFav = computed(() => recipesStore.isFavorite(recipe.value))
// Scale ingredients proportionally to target volume; '单次' = no scaling // Card ingredients: exclude coconut oil
function scaleIngredients(ingredients, volume) {
const targetDrops = VOLUME_DROPS[volume]
if (!targetDrops) return ingredients // 单次:不缩放
const totalDrops = ingredients.reduce((sum, ing) => sum + (ing.drops || 0), 0)
if (totalDrops === 0) return ingredients
return ingredients.map(ing => ({
...ing,
drops: Math.round(ing.drops * targetDrops / totalDrops),
}))
}
// Card ingredients: scaled to selected volume, coconut oil excluded from display
const scaledCardIngredients = computed(() =>
scaleIngredients(recipe.value.ingredients, selectedCardVolume.value)
)
const cardIngredients = computed(() => const cardIngredients = computed(() =>
scaledCardIngredients.value.filter(ing => ing.oil !== '椰子油') recipe.value.ingredients.filter(ing => ing.oil !== '椰子油')
) )
// Coconut oil drops (from scaled set) // Coconut oil drops
const coconutDrops = computed(() => { const coconutDrops = computed(() => {
const coco = scaledCardIngredients.value.find(ing => ing.oil === '椰子油') const coco = recipe.value.ingredients.find(ing => ing.oil === '椰子油')
return coco ? coco.drops : 0 return coco ? coco.drops : 0
}) })
@@ -446,7 +433,7 @@ const dilutionDesc = computed(() => {
: `该配方适用于单次用量(共${totalDrops}滴),其中纯精油 ${totalEoDrops.value} 滴,椰子油 ${coconutDrops.value} 滴,稀释比例为 1:${ratio}` : `该配方适用于单次用量(共${totalDrops}滴),其中纯精油 ${totalEoDrops.value} 滴,椰子油 ${coconutDrops.value} 滴,稀释比例为 1:${ratio}`
}) })
const priceInfo = computed(() => oilsStore.fmtCostWithRetail(scaledCardIngredients.value)) const priceInfo = computed(() => oilsStore.fmtCostWithRetail(recipe.value.ingredients))
// Today string // Today string
const todayStr = computed(() => { const todayStr = computed(() => {
@@ -477,14 +464,6 @@ async function loadBrand() {
} catch { } catch {
brand.value = {} brand.value = {}
} }
// Show upload prompt if user hasn't set up brand assets yet
if (showBrandHint.value) {
const ok = await showConfirm(
'上传你的专属二维码,让配方卡片更专业 ✨',
{ okText: '去上传', cancelText: '取消' }
)
if (ok) goUploadQr()
}
} }
// Whether to show the brand/QR upload hint (show to all users who haven't set up brand assets) // Whether to show the brand/QR upload hint (show to all users who haven't set up brand assets)
@@ -494,7 +473,7 @@ const showBrandHint = computed(() =>
function goUploadQr() { function goUploadQr() {
if (!authStore.isLoggedIn) { if (!authStore.isLoggedIn) {
ui.openLogin(() => goUploadQr()) ui.openLogin()
return return
} }
if (recipe.value._id) { if (recipe.value._id) {
@@ -533,12 +512,6 @@ function switchLang(lang) {
nextTick(() => generateCardImage()) nextTick(() => generateCardImage())
} }
function onCardVolumeChange(ml) {
selectedCardVolume.value = ml
cardImageUrl.value = null
nextTick(() => generateCardImage())
}
async function saveImage() { async function saveImage() {
if (!cardImageUrl.value) { if (!cardImageUrl.value) {
await generateCardImage() await generateCardImage()
@@ -568,27 +541,15 @@ function copyText() {
].filter(Boolean).join('\n') ].filter(Boolean).join('\n')
navigator.clipboard.writeText(text).then(() => { navigator.clipboard.writeText(text).then(() => {
ui.showToast('已复制') ui.showToast('已复制到剪贴板')
}).catch(() => { }).catch(() => {
ui.showToast('复制失败') ui.showToast('复制失败')
}) })
} }
async function applyTranslation() { function applyTranslation() {
// translations stored in customOilNameEn / customRecipeNameEn
showTranslationEditor.value = false showTranslationEditor.value = false
// Persist en_name and en_oils to backend
if (recipe.value._id) {
try {
await api.put(`/api/recipes/${recipe.value._id}`, {
en_name: customRecipeNameEn.value,
en_oils: JSON.stringify(customOilNameEn.value),
version: recipe.value._version,
})
ui.showToast('翻译已保存')
} catch (e) {
ui.showToast('翻译保存失败')
}
}
cardImageUrl.value = null cardImageUrl.value = null
nextTick(() => generateCardImage()) nextTick(() => generateCardImage())
} }
@@ -603,7 +564,7 @@ function getCardOilName(name) {
function getCardRecipeName() { function getCardRecipeName() {
if (cardLang.value === 'en') { if (cardLang.value === 'en') {
return customRecipeNameEn.value || recipe.value.en_name || recipeNameEn(recipe.value.name) return customRecipeNameEn.value || recipeNameEn(recipe.value.name)
} }
return recipe.value.name return recipe.value.name
} }
@@ -611,7 +572,7 @@ function getCardRecipeName() {
// ---- Favorite ---- // ---- Favorite ----
async function handleToggleFavorite() { async function handleToggleFavorite() {
if (!authStore.isLoggedIn) { if (!authStore.isLoggedIn) {
ui.openLogin(() => handleToggleFavorite()) ui.openLogin()
return return
} }
if (!recipe.value._id) { if (!recipe.value._id) {
@@ -630,10 +591,10 @@ async function handleToggleFavorite() {
// ---- Save to diary ---- // ---- Save to diary ----
async function saveToDiary() { async function saveToDiary() {
if (!authStore.isLoggedIn) { if (!authStore.isLoggedIn) {
ui.openLogin(() => saveToDiary()) ui.openLogin()
return return
} }
const name = await showPrompt('保存为我的配方,名称:', recipe.value.name) const name = prompt('保存为我的配方,名称:', recipe.value.name)
if (!name) return if (!name) return
try { try {
await api.post('/api/diary', { await api.post('/api/diary', {
@@ -708,11 +669,10 @@ onMounted(() => {
editTags.value = [...(r.tags || [])] editTags.value = [...(r.tags || [])]
editIngredients.value = (r.ingredients || []).map(i => ({ oil: i.oil, drops: i.drops })) editIngredients.value = (r.ingredients || []).map(i => ({ oil: i.oil, drops: i.drops }))
// Init translation defaults // Init translation defaults
customRecipeNameEn.value = r.en_name || recipeNameEn(r.name) customRecipeNameEn.value = recipeNameEn(r.name)
const savedOilMap = r.en_oils ? (() => { try { return JSON.parse(r.en_oils) } catch { return {} } })() : {}
const enMap = {} const enMap = {}
;(r.ingredients || []).forEach(ing => { ;(r.ingredients || []).forEach(ing => {
enMap[ing.oil] = savedOilMap[ing.oil] || oilEn(ing.oil) || ing.oil enMap[ing.oil] = oilEn(ing.oil) || ing.oil
}) })
customOilNameEn.value = enMap customOilNameEn.value = enMap
@@ -1000,52 +960,32 @@ async function saveRecipe() {
inset: 0; inset: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background-size: cover; object-fit: cover;
background-position: center; opacity: 0.06;
background-repeat: no-repeat;
opacity: 0.12;
z-index: 0; z-index: 0;
pointer-events: none; pointer-events: none;
} }
.card-qr-wrapper {
position: absolute;
top: 36px;
right: 24px;
display: flex;
flex-direction: column;
align-items: center;
gap: 3px;
z-index: 2;
}
.card-qr { .card-qr {
width: 54px; position: absolute;
height: 54px; top: 16px;
object-fit: cover; right: 16px;
border-radius: 6px; width: 64px;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); height: 64px;
} object-fit: contain;
z-index: 3;
.card-qr-name { opacity: 0.85;
font-size: 7px;
color: var(--text-light, #8a7a6a);
text-align: center;
line-height: 1.3;
max-width: 68px;
white-space: pre-line;
} }
.card-logo { .card-logo {
position: absolute; position: absolute;
bottom: 60px; bottom: 16px;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
height: 60px; height: 28px;
object-fit: contain; object-fit: contain;
z-index: 1; z-index: 3;
opacity: 0.2; opacity: 0.3;
pointer-events: none;
} }
.card-brand-text { .card-brand-text {
@@ -1518,10 +1458,6 @@ async function saveRecipe() {
margin-bottom: 10px; margin-bottom: 10px;
} }
.card-volume-controls {
margin: 8px 0 12px;
}
.volume-btn { .volume-btn {
padding: 7px 16px; padding: 7px 16px;
border: 1.5px solid var(--border, #e0d4c0); border: 1.5px solid var(--border, #e0d4c0);

View File

@@ -2,6 +2,9 @@
<div class="usermenu-overlay" @click.self="$emit('close')"> <div class="usermenu-overlay" @click.self="$emit('close')">
<div class="usermenu-card"> <div class="usermenu-card">
<div class="usermenu-name">{{ auth.user.display_name || auth.user.username }}</div> <div class="usermenu-name">{{ auth.user.display_name || auth.user.username }}</div>
<div class="usermenu-role">
<span class="role-badge">{{ roleLabel }}</span>
</div>
<div class="usermenu-actions"> <div class="usermenu-actions">
<button class="usermenu-btn" @click="goMyDiary"> <button class="usermenu-btn" @click="goMyDiary">
@@ -68,6 +71,16 @@ const bugContent = ref('')
const unreadCount = computed(() => notifications.value.filter(n => !n.is_read).length) const unreadCount = computed(() => notifications.value.filter(n => !n.is_read).length)
const roleLabel = computed(() => {
const map = {
admin: '管理员',
senior_editor: '高级编辑',
editor: '编辑',
viewer: '查看者',
}
return map[auth.user.role] || auth.user.role
})
function formatTime(d) { function formatTime(d) {
if (!d) return '' if (!d) return ''
return new Date(d + 'Z').toLocaleString('zh-CN', { month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit' }) return new Date(d + 'Z').toLocaleString('zh-CN', { month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit' })
@@ -123,7 +136,7 @@ function handleLogout() {
auth.logout() auth.logout()
ui.showToast('已退出登录') ui.showToast('已退出登录')
emit('close') emit('close')
router.push('/') window.location.reload()
} }
onMounted(loadNotifications) onMounted(loadNotifications)
@@ -149,7 +162,13 @@ onMounted(loadNotifications)
z-index: 4001; z-index: 4001;
} }
.usermenu-name { font-size: 16px; font-weight: 600; color: #3e3a44; margin-bottom: 14px; } .usermenu-name { font-size: 16px; font-weight: 600; color: #3e3a44; margin-bottom: 4px; }
.usermenu-role { margin-bottom: 14px; }
.role-badge {
display: inline-block; font-size: 11px; padding: 2px 10px;
border-radius: 8px; background: linear-gradient(135deg, #e8f5e9, #c8e6c9);
color: #4a9d7e; font-weight: 500;
}
.usermenu-actions { display: flex; flex-direction: column; gap: 4px; } .usermenu-actions { display: flex; flex-direction: column; gap: 4px; }
.usermenu-btn { .usermenu-btn {

View File

@@ -5,8 +5,6 @@ export const dialogState = reactive({
type: 'alert', // 'alert', 'confirm', 'prompt' type: 'alert', // 'alert', 'confirm', 'prompt'
message: '', message: '',
defaultValue: '', defaultValue: '',
okText: '',
cancelText: '',
resolve: null resolve: null
}) })
@@ -15,19 +13,15 @@ export function showAlert(msg) {
dialogState.visible = true dialogState.visible = true
dialogState.type = 'alert' dialogState.type = 'alert'
dialogState.message = msg dialogState.message = msg
dialogState.okText = ''
dialogState.cancelText = ''
dialogState.resolve = resolve dialogState.resolve = resolve
}) })
} }
export function showConfirm(msg, opts = {}) { export function showConfirm(msg) {
return new Promise(resolve => { return new Promise(resolve => {
dialogState.visible = true dialogState.visible = true
dialogState.type = 'confirm' dialogState.type = 'confirm'
dialogState.message = msg dialogState.message = msg
dialogState.okText = opts.okText || ''
dialogState.cancelText = opts.cancelText || ''
dialogState.resolve = resolve dialogState.resolve = resolve
}) })
} }

View File

@@ -5,7 +5,6 @@ import { api } from '../composables/useApi'
export const DROPS_PER_ML = 18.6 export const DROPS_PER_ML = 18.6
export const VOLUME_DROPS = { export const VOLUME_DROPS = {
'单次': null,
'2.5': 46, '2.5': 46,
'5': 93, '5': 93,
'10': 186, '10': 186,

View File

@@ -16,8 +16,6 @@ export const useRecipesStore = defineStore('recipes', () => {
_owner_name: r._owner_name ?? r.owner_name ?? '', _owner_name: r._owner_name ?? r.owner_name ?? '',
_version: r._version ?? r.version ?? 1, _version: r._version ?? r.version ?? 1,
name: r.name, name: r.name,
en_name: r.en_name ?? '',
en_oils: r.en_oils ?? '{}',
note: r.note ?? '', note: r.note ?? '',
tags: r.tags ?? [], tags: r.tags ?? [],
ingredients: (r.ingredients ?? []).map((ing) => ({ ingredients: (r.ingredients ?? []).map((ing) => ({

View File

@@ -5,7 +5,6 @@ export const useUiStore = defineStore('ui', () => {
const currentSection = ref('search') const currentSection = ref('search')
const showLoginModal = ref(false) const showLoginModal = ref(false)
const toasts = ref([]) const toasts = ref([])
const pendingAction = ref(null)
let toastId = 0 let toastId = 0
@@ -21,10 +20,7 @@ export const useUiStore = defineStore('ui', () => {
}, duration) }, duration)
} }
function openLogin(afterLogin) { function openLogin() {
if (afterLogin) {
pendingAction.value = afterLogin
}
showLoginModal.value = true showLoginModal.value = true
} }
@@ -32,23 +28,13 @@ export const useUiStore = defineStore('ui', () => {
showLoginModal.value = false showLoginModal.value = false
} }
function runPendingAction() {
if (pendingAction.value) {
const action = pendingAction.value
pendingAction.value = null
action()
}
}
return { return {
currentSection, currentSection,
showLoginModal, showLoginModal,
toasts, toasts,
pendingAction,
showSection, showSection,
showToast, showToast,
openLogin, openLogin,
closeLogin, closeLogin,
runPendingAction,
} }
}) })

View File

@@ -107,11 +107,6 @@
<!-- Brand Tab --> <!-- Brand Tab -->
<div v-if="activeTab === 'brand'" class="tab-content"> <div v-if="activeTab === 'brand'" class="tab-content">
<!-- Back to recipe card (when navigated from a recipe) -->
<div v-if="returnRecipeId" class="return-banner">
<span>📋 上传完成后可返回配方卡片</span>
<button class="btn-return" @click="goBackToRecipe"> 返回配方卡片</button>
</div>
<div class="section-card"> <div class="section-card">
<h4>🏷 品牌设置</h4> <h4>🏷 品牌设置</h4>
@@ -174,6 +169,10 @@
<div class="form-static">{{ auth.user.username }}</div> <div class="form-static">{{ auth.user.username }}</div>
</div> </div>
<div class="form-group">
<label>角色</label>
<div class="form-static role-badge">{{ roleLabel }}</div>
</div>
</div> </div>
<div class="section-card"> <div class="section-card">
@@ -212,7 +211,7 @@
</template> </template>
<script setup> <script setup>
import { ref, onMounted, watch } from 'vue' import { ref, computed, onMounted, watch } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { useAuthStore } from '../stores/auth' import { useAuthStore } from '../stores/auth'
import { useOilsStore } from '../stores/oils' import { useOilsStore } from '../stores/oils'
@@ -231,7 +230,6 @@ const router = useRouter()
const activeTab = ref('brand') const activeTab = ref('brand')
const pasteText = ref('') const pasteText = ref('')
const selectedDiaryId = ref(null) const selectedDiaryId = ref(null)
const returnRecipeId = ref(null)
const selectedDiary = ref(null) const selectedDiary = ref(null)
const newEntryText = ref('') const newEntryText = ref('')
@@ -252,20 +250,22 @@ const newPassword = ref('')
const confirmPassword = ref('') const confirmPassword = ref('')
const businessReason = ref('') const businessReason = ref('')
const roleLabel = computed(() => {
const roles = {
admin: '管理员',
senior_editor: '高级编辑',
editor: '编辑',
viewer: '查看者',
}
return roles[auth.user.role] || auth.user.role
})
onMounted(async () => { onMounted(async () => {
await diaryStore.loadDiary() await diaryStore.loadDiary()
displayName.value = auth.user.display_name || '' displayName.value = auth.user.display_name || ''
await loadBrandSettings() await loadBrandSettings()
returnRecipeId.value = localStorage.getItem('oil_return_recipe_id') || null
}) })
function goBackToRecipe() {
if (returnRecipeId.value) {
localStorage.removeItem('oil_return_recipe_id')
router.push('/?openRecipe=' + encodeURIComponent(returnRecipeId.value))
}
}
function selectDiary(d) { function selectDiary(d) {
const id = d._id || d.id const id = d._id || d.id
selectedDiaryId.value = id selectedDiaryId.value = id
@@ -412,7 +412,18 @@ async function handleUpload(type, event) {
if (res.ok) { if (res.ok) {
if (type === 'logo') brandLogo.value = base64 if (type === 'logo') brandLogo.value = base64
else if (type === 'bg') brandBg.value = base64 else if (type === 'bg') brandBg.value = base64
else if (type === 'qr') brandQrImage.value = base64 else if (type === 'qr') {
brandQrImage.value = base64
// If user came here from a recipe card, navigate back
const returnRecipeId = localStorage.getItem('oil_return_recipe_id')
if (returnRecipeId) {
localStorage.removeItem('oil_return_recipe_id')
ui.showToast('二维码已上传,返回配方卡片 ✨')
await new Promise(r => setTimeout(r, 800))
router.push('/?openRecipe=' + encodeURIComponent(returnRecipeId))
return
}
}
ui.showToast('上传成功') ui.showToast('上传成功')
} }
} catch { } catch {
@@ -742,39 +753,6 @@ async function applyBusiness() {
border-color: #7ec6a4; border-color: #7ec6a4;
} }
/* Return banner */
.return-banner {
display: flex;
align-items: center;
justify-content: space-between;
background: #f0faf5;
border: 1.5px solid #7ec6a4;
border-radius: 12px;
padding: 10px 14px;
margin-bottom: 14px;
font-size: 13px;
color: #3e7d5a;
gap: 10px;
}
.btn-return {
background: linear-gradient(135deg, #7ec6a4 0%, #4a9d7e 100%);
color: #fff;
border: none;
border-radius: 8px;
padding: 6px 14px;
font-size: 12px;
cursor: pointer;
font-family: inherit;
font-weight: 500;
white-space: nowrap;
flex-shrink: 0;
}
.btn-return:hover {
opacity: 0.9;
}
/* Brand */ /* Brand */
.form-group { .form-group {
margin-bottom: 14px; margin-bottom: 14px;
@@ -796,6 +774,22 @@ async function applyBusiness() {
color: #6b6375; color: #6b6375;
} }
.role-badge {
display: inline-block;
}
.qr-preview {
margin-top: 10px;
text-align: center;
}
.qr-img {
width: 120px;
height: 120px;
border-radius: 8px;
border: 1.5px solid #e5e4e7;
}
.upload-area { .upload-area {
width: 100%; width: 100%;
min-height: 80px; min-height: 80px;
@@ -813,18 +807,6 @@ async function applyBusiness() {
border-color: #7ec6a4; border-color: #7ec6a4;
} }
.qr-preview {
margin-top: 10px;
text-align: center;
}
.qr-img {
width: 120px;
height: 120px;
border-radius: 8px;
border: 1.5px solid #e5e4e7;
}
.upload-preview { .upload-preview {
max-width: 80px; max-width: 80px;
max-height: 80px; max-height: 80px;