2 Commits

Author SHA1 Message Date
04ff28bf45 fix: 修复 recipe-detail 测试选择器和按钮文本
Some checks failed
PR Preview / teardown-preview (pull_request) Has been skipped
Test / unit-test (push) Successful in 4s
Test / build-check (push) Failing after 4s
PR Preview / test (pull_request) Successful in 4s
PR Preview / deploy-preview (pull_request) Failing after 7s
Test / e2e-test (push) Failing after 1m23s
- [class*="detail"] → .detail-overlay 避免匹配多余元素
- 导出图片 → 保存图片(匹配当前 UI)
- admin 编辑测试加入按钮存在性检查,token 失效时不崩溃

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-09 18:39:03 +00:00
36bd6f5a0b fix: 搜索过滤收藏、拼音首字母匹配、清除图片、滑动切换、通知已读
1. 搜索时收藏配方也按关键词过滤,不匹配的隐藏
2. 编辑配方添加精油时支持拼音首字母匹配(如xyc→薰衣草)
3. 品牌设置页清除图片立即保存到后端,不需点保存按钮
4. 左右滑动切换tab,轮播区域内滑动切换图片不触发tab切换
5. 通知列表每条未读通知加"已读"按钮,调用POST /api/notifications/{id}/read

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-09 18:39:03 +00:00
17 changed files with 425 additions and 1675 deletions

View File

@@ -324,7 +324,7 @@ def symptom_search(body: dict, user=Depends(get_current_user)):
# If user reports no match, notify editors # If user reports no match, notify editors
if body.get("report_missing"): if body.get("report_missing"):
who = user.get("display_name") or user.get("username") or "用户" who = user.get("display_name") or user.get("username") or "用户"
for role in ("admin", "senior_editor"): for role in ("admin", "senior_editor", "editor"):
conn.execute( conn.execute(
"INSERT INTO notifications (target_role, title, body) VALUES (?, ?, ?)", "INSERT INTO notifications (target_role, title, body) VALUES (?, ?, ?)",
(role, "🔍 用户需求:" + query, (role, "🔍 用户需求:" + query,
@@ -766,14 +766,13 @@ def create_recipe(recipe: RecipeIn, user=Depends(get_current_user)):
c.execute("INSERT OR IGNORE INTO tags (name) VALUES (?)", (tag,)) c.execute("INSERT OR IGNORE INTO tags (name) VALUES (?)", (tag,))
c.execute("INSERT OR IGNORE INTO recipe_tags (recipe_id, tag_name) VALUES (?, ?)", (rid, tag)) c.execute("INSERT OR IGNORE INTO recipe_tags (recipe_id, tag_name) VALUES (?, ?)", (rid, tag))
log_audit(conn, user["id"], "create_recipe", "recipe", rid, recipe.name) log_audit(conn, user["id"], "create_recipe", "recipe", rid, recipe.name)
# Notify admin and senior editors when non-admin creates a recipe # Notify admin when non-admin creates a recipe
if user["role"] not in ("admin", "senior_editor"): if user["role"] != "admin":
who = user.get("display_name") or user["username"] who = user.get("display_name") or user["username"]
for role in ("admin", "senior_editor"):
conn.execute( conn.execute(
"INSERT INTO notifications (target_role, title, body) VALUES (?, ?, ?)", "INSERT INTO notifications (target_role, title, body) VALUES (?, ?, ?)",
(role, "📝 新配方待审核", ("admin", "📝 新配方待审核",
f"{who} 共享了配方「{recipe.name}」,请到管理配方查看。\n[recipe_id:{rid}]") f"{who} 新增了配方「{recipe.name}」,请到管理配方查看并采纳")
) )
conn.commit() conn.commit()
conn.close() conn.close()
@@ -781,15 +780,15 @@ def create_recipe(recipe: RecipeIn, user=Depends(get_current_user)):
def _check_recipe_permission(conn, recipe_id, user): def _check_recipe_permission(conn, recipe_id, user):
"""Check if user can modify this recipe. Requires editor+ role.""" """Check if user can modify this recipe."""
row = conn.execute("SELECT owner_id, name FROM recipes WHERE id = ?", (recipe_id,)).fetchone() row = conn.execute("SELECT owner_id, name FROM recipes WHERE id = ?", (recipe_id,)).fetchone()
if not row: if not row:
raise HTTPException(404, "Recipe not found") raise HTTPException(404, "Recipe not found")
if user["role"] in ("admin", "senior_editor"): if user["role"] in ("admin", "senior_editor"):
return row return row
if user["role"] in ("editor",) and row["owner_id"] == user.get("id"): if row["owner_id"] == user.get("id"):
return row return row
raise HTTPException(403, "权限不足") raise HTTPException(403, "只能修改自己创建的配方")
@app.put("/api/recipes/{recipe_id}") @app.put("/api/recipes/{recipe_id}")
@@ -863,48 +862,11 @@ def adopt_recipe(recipe_id: int, user=Depends(require_role("admin"))):
if row["owner_id"] == user["id"]: if row["owner_id"] == user["id"]:
conn.close() conn.close()
return {"ok": True, "msg": "already owned"} return {"ok": True, "msg": "already owned"}
old_owner = conn.execute("SELECT id, role, display_name, username FROM users WHERE id = ?", (row["owner_id"],)).fetchone() old_owner = conn.execute("SELECT display_name, username FROM users WHERE id = ?", (row["owner_id"],)).fetchone()
old_name = (old_owner["display_name"] or old_owner["username"]) if old_owner else "unknown" old_name = (old_owner["display_name"] or old_owner["username"]) if old_owner else "unknown"
conn.execute("UPDATE recipes SET owner_id = ?, updated_by = ? WHERE id = ?", (user["id"], user["id"], recipe_id)) conn.execute("UPDATE recipes SET owner_id = ?, updated_by = ? WHERE id = ?", (user["id"], user["id"], recipe_id))
log_audit(conn, user["id"], "adopt_recipe", "recipe", recipe_id, row["name"], log_audit(conn, user["id"], "adopt_recipe", "recipe", recipe_id, row["name"],
json.dumps({"from_user": old_name})) json.dumps({"from_user": old_name}))
# Notify submitter that recipe was approved
if old_owner and old_owner["id"] != user["id"]:
conn.execute(
"INSERT INTO notifications (target_role, title, body, target_user_id) VALUES (?, ?, ?, ?)",
(old_owner["role"], "🎉 配方已采纳",
f"你共享的配方「{row['name']}」已被采纳到公共配方库!", old_owner["id"])
)
conn.commit()
conn.close()
return {"ok": True}
@app.post("/api/recipes/{recipe_id}/reject")
def reject_recipe(recipe_id: int, body: dict = None, user=Depends(require_role("admin"))):
conn = get_db()
row = conn.execute("SELECT id, name, owner_id FROM recipes WHERE id = ?", (recipe_id,)).fetchone()
if not row:
conn.close()
raise HTTPException(404, "Recipe not found")
reason = (body or {}).get("reason", "").strip()
# Notify submitter
old_owner = conn.execute("SELECT id, role, display_name, username FROM users WHERE id = ?", (row["owner_id"],)).fetchone()
if old_owner and old_owner["id"] != user["id"]:
msg = f"你共享的配方「{row['name']}」未被采纳。"
if reason:
msg += f"\n原因:{reason}"
msg += "\n你可以修改后重新共享。"
conn.execute(
"INSERT INTO notifications (target_role, title, body, target_user_id) VALUES (?, ?, ?, ?)",
(old_owner["role"], "配方未被采纳", msg, old_owner["id"])
)
# Delete the recipe
conn.execute("DELETE FROM recipe_ingredients WHERE recipe_id = ?", (recipe_id,))
conn.execute("DELETE FROM recipe_tags WHERE recipe_id = ?", (recipe_id,))
conn.execute("DELETE FROM recipes WHERE id = ?", (recipe_id,))
log_audit(conn, user["id"], "reject_recipe", "recipe", recipe_id, row["name"],
json.dumps({"reason": reason}))
conn.commit() conn.commit()
conn.close() conn.close()
return {"ok": True} return {"ok": True}
@@ -1011,9 +973,6 @@ def delete_user(user_id: int, user=Depends(require_role("admin"))):
def update_user(user_id: int, body: UserUpdate, user=Depends(require_role("admin"))): def update_user(user_id: int, body: UserUpdate, user=Depends(require_role("admin"))):
conn = get_db() conn = get_db()
if body.role is not None: if body.role is not None:
if body.role == "admin":
conn.close()
raise HTTPException(403, "不能将用户设为管理员")
conn.execute("UPDATE users SET role = ? WHERE id = ?", (body.role, user_id)) conn.execute("UPDATE users SET role = ? WHERE id = ?", (body.role, user_id))
if body.display_name is not None: if body.display_name is not None:
conn.execute("UPDATE users SET display_name = ? WHERE id = ?", (body.display_name, user_id)) conn.execute("UPDATE users SET display_name = ? WHERE id = ?", (body.display_name, user_id))
@@ -1438,55 +1397,17 @@ def get_unmatched_searches(days: int = 7, user=Depends(require_role("admin", "se
return [dict(r) for r in rows] return [dict(r) for r in rows]
# ── Recipe review history ──────────────────────────────
@app.get("/api/recipe-reviews")
def list_recipe_reviews(user=Depends(require_role("admin"))):
conn = get_db()
rows = conn.execute(
"SELECT a.id, a.action, a.target_name, a.detail, a.created_at, "
"u.display_name, u.username "
"FROM audit_log a LEFT JOIN users u ON a.user_id = u.id "
"WHERE a.action IN ('adopt_recipe', 'reject_recipe') "
"ORDER BY a.id DESC LIMIT 100"
).fetchall()
conn.close()
return [dict(r) for r in rows]
# ── Contribution stats ─────────────────────────────────
@app.get("/api/me/contribution")
def my_contribution(user=Depends(get_current_user)):
if not user.get("id"):
return {"adopted_count": 0, "shared_count": 0}
conn = get_db()
# adopted_count: recipes adopted from this user (owner changed to admin)
adopted = conn.execute(
"SELECT COUNT(*) FROM audit_log WHERE action = 'adopt_recipe' AND detail LIKE ?",
(f'%"from_user": "{user.get("display_name") or user.get("username")}"%',)
).fetchone()[0]
# pending: recipes still owned by user in public library (not yet adopted)
pending = conn.execute(
"SELECT COUNT(*) FROM recipes WHERE owner_id = ?", (user["id"],)
).fetchone()[0]
conn.close()
return {"adopted_count": adopted, "shared_count": adopted + pending}
# ── Notifications ────────────────────────────────────── # ── Notifications ──────────────────────────────────────
@app.get("/api/notifications") @app.get("/api/notifications")
def get_notifications(user=Depends(get_current_user)): def get_notifications(user=Depends(get_current_user)):
if not user["id"]: if not user["id"]:
return [] return []
conn = get_db() conn = get_db()
# Only show notifications created after user registration
user_created = conn.execute("SELECT created_at FROM users WHERE id = ?", (user["id"],)).fetchone()
created_at = user_created["created_at"] if user_created else "2000-01-01"
rows = conn.execute( rows = conn.execute(
"SELECT id, title, body, is_read, created_at FROM notifications " "SELECT id, title, body, is_read, created_at FROM notifications "
"WHERE (target_user_id = ? OR (target_user_id IS NULL AND (target_role = ? OR target_role = 'all'))) " "WHERE (target_user_id = ? OR (target_user_id IS NULL AND (target_role = ? OR target_role = 'all'))) "
"AND created_at >= ? "
"ORDER BY is_read ASC, id DESC LIMIT 200", "ORDER BY is_read ASC, id DESC LIMIT 200",
(user["id"], user["role"], created_at) (user["id"], user["role"])
).fetchall() ).fetchall()
conn.close() conn.close()
return [dict(r) for r in rows] return [dict(r) for r in rows]

View File

@@ -25,7 +25,7 @@ describe('Oil Data Integrity', () => {
const ppd = oil.bottle_price / oil.drop_count const ppd = oil.bottle_price / oil.drop_count
expect(ppd).to.be.a('number') expect(ppd).to.be.a('number')
expect(ppd).to.be.gte(0) expect(ppd).to.be.gte(0)
expect(ppd).to.be.lte(300) // sanity check: some premium oils can cost >100 per drop expect(ppd).to.be.lte(100) // sanity check: no oil costs >100 per drop
}) })
}) })
}) })

View File

@@ -1,58 +1,45 @@
// Helper: dismiss any modal that may cover the detail overlay (login modal, error dialog)
function dismissModals() {
cy.get('body').then($body => {
if ($body.find('.login-overlay').length) {
cy.get('.login-overlay').click('topLeft') // click backdrop to close
}
if ($body.find('.dialog-overlay').length) {
cy.get('.dialog-btn-primary').click()
}
})
}
describe('Recipe Detail', () => { describe('Recipe Detail', () => {
beforeEach(() => { beforeEach(() => {
cy.visit('/') cy.visit('/')
cy.get('.recipe-card', { timeout: 10000 }).should('have.length.gte', 1) cy.get('.recipe-card', { timeout: 10000 }).should('have.length.gte', 1)
dismissModals()
}) })
it('opens detail panel when clicking a recipe card', () => { it('opens detail panel when clicking a recipe card', () => {
cy.get('.recipe-card').first().click() cy.get('.recipe-card').first().click()
dismissModals() cy.get('.detail-overlay').should('be.visible')
cy.get('.detail-overlay').should('exist')
}) })
it('shows recipe name in detail view', () => { it('shows recipe name in detail view', () => {
cy.get('.recipe-card').first().invoke('text').then(cardText => {
cy.get('.recipe-card').first().click() cy.get('.recipe-card').first().click()
dismissModals() cy.wait(500)
cy.get('.detail-overlay').should('exist') cy.get('.detail-overlay').should('be.visible')
})
}) })
it('shows ingredient info with drops', () => { it('shows ingredient info with drops', () => {
cy.get('.recipe-card').first().click() cy.get('.recipe-card').first().click()
dismissModals() cy.wait(500)
cy.contains('滴').should('exist') cy.contains('滴').should('exist')
}) })
it('shows cost with ¥ symbol', () => { it('shows cost with ¥ symbol', () => {
cy.get('.recipe-card').first().click() cy.get('.recipe-card').first().click()
dismissModals() cy.wait(500)
cy.contains('¥').should('exist') cy.contains('¥').should('exist')
}) })
it('closes detail panel when clicking close button', () => { it('closes detail panel when clicking close button', () => {
cy.get('.recipe-card').first().click() cy.get('.recipe-card').first().click()
dismissModals() cy.get('.detail-overlay').should('be.visible')
cy.get('.detail-overlay').should('exist') cy.get('button').contains(/✕|关闭/).first().click()
cy.get('.detail-close-btn').first().click({ force: true })
cy.get('.recipe-card').should('be.visible') cy.get('.recipe-card').should('be.visible')
}) })
it('shows action buttons in detail', () => { it('shows action buttons in detail', () => {
cy.get('.recipe-card').first().click() cy.get('.recipe-card').first().click()
dismissModals() cy.wait(500)
cy.get('.detail-overlay button').should('have.length.gte', 1) cy.get('[class*="detail"] button').should('have.length.gte', 1)
}) })
it('shows favorite star on recipe cards', () => { it('shows favorite star on recipe cards', () => {
@@ -70,13 +57,11 @@ describe('Recipe Detail - Editor (Admin)', () => {
} }
}) })
cy.get('.recipe-card', { timeout: 10000 }).should('have.length.gte', 1) cy.get('.recipe-card', { timeout: 10000 }).should('have.length.gte', 1)
dismissModals()
}) })
it('shows editable ingredients table in editor tab', () => { it('shows editable ingredients table in editor tab', () => {
cy.get('.recipe-card').first().click() cy.get('.recipe-card').first().click()
dismissModals() cy.get('.detail-overlay', { timeout: 5000 }).should('be.visible')
cy.get('.detail-overlay', { timeout: 5000 }).should('exist')
cy.get('.detail-overlay').then($el => { cy.get('.detail-overlay').then($el => {
if ($el.find(':contains("编辑")').filter('button').length) { if ($el.find(':contains("编辑")').filter('button').length) {
cy.contains('编辑').click() cy.contains('编辑').click()
@@ -89,8 +74,7 @@ describe('Recipe Detail - Editor (Admin)', () => {
it('shows add ingredient button in editor tab', () => { it('shows add ingredient button in editor tab', () => {
cy.get('.recipe-card').first().click() cy.get('.recipe-card').first().click()
dismissModals() cy.get('.detail-overlay', { timeout: 5000 }).should('be.visible')
cy.get('.detail-overlay', { timeout: 5000 }).should('exist')
cy.get('.detail-overlay').then($el => { cy.get('.detail-overlay').then($el => {
if ($el.find(':contains("编辑")').filter('button').length) { if ($el.find(':contains("编辑")').filter('button').length) {
cy.contains('编辑').click() cy.contains('编辑').click()
@@ -103,8 +87,7 @@ describe('Recipe Detail - Editor (Admin)', () => {
it('shows save image button', () => { it('shows save image button', () => {
cy.get('.recipe-card').first().click() cy.get('.recipe-card').first().click()
dismissModals() cy.get('.detail-overlay', { timeout: 5000 }).should('be.visible')
cy.get('.detail-overlay', { timeout: 5000 }).should('exist')
cy.contains('保存图片').should('exist') cy.contains('保存图片').should('exist')
}) })
}) })

View File

@@ -9,14 +9,12 @@
<div class="header-title"> <div class="header-title">
<h1>doTERRA 配方计算器</h1> <h1>doTERRA 配方计算器</h1>
<p>查询配方 · 计算成本 · 自制配方 · 导出卡片 · 精油知识</p> <p>查询配方 · 计算成本 · 自制配方 · 导出卡片 · 精油知识</p>
<p v-if="auth.isAdmin" class="version-info">v2.0.0 · 2026-04-10</p>
</div> </div>
</div> </div>
<div class="header-right" @click="toggleUserMenu"> <div class="header-right" @click="toggleUserMenu">
<template v-if="auth.isLoggedIn"> <template v-if="auth.isLoggedIn">
<span v-if="auth.isBusiness" class="biz-badge" title="商业认证用户">🏢</span> <span v-if="auth.isBusiness" class="biz-badge" title="商业认证用户">🏢</span>
<span class="user-name">{{ auth.user.display_name || auth.user.username }} </span> <span class="user-name">{{ auth.user.display_name || auth.user.username }} </span>
<span v-if="unreadNotifCount > 0" class="notif-badge">{{ unreadNotifCount }}</span>
</template> </template>
<template v-else> <template v-else>
<span class="login-btn">登录</span> <span class="login-btn">登录</span>
@@ -26,15 +24,18 @@
</div> </div>
<!-- User Menu Popup --> <!-- User Menu Popup -->
<UserMenu v-if="showUserMenu" @close="showUserMenu = false; loadUnreadCount()" /> <UserMenu v-if="showUserMenu" @close="showUserMenu = false" />
<!-- Nav tabs --> <!-- Nav tabs -->
<div class="nav-tabs" ref="navTabsRef" :style="isPreview ? { top: '36px' } : {}"> <div class="nav-tabs" :style="isPreview ? { top: '36px' } : {}">
<div v-for="tab in visibleTabs" :key="tab.key" <div class="nav-tab" :class="{ active: ui.currentSection === 'search' }" @click="goSection('search')">🔍 配方查询</div>
class="nav-tab" <div class="nav-tab" :class="{ active: ui.currentSection === 'manage' }" @click="requireLogin('manage')">📋 管理配方</div>
:class="{ active: ui.currentSection === tab.key }" <div class="nav-tab" :class="{ active: ui.currentSection === 'inventory' }" @click="requireLogin('inventory')">📦 个人库存</div>
@click="handleTabClick(tab)" <div class="nav-tab" :class="{ active: ui.currentSection === 'oils' }" @click="goSection('oils')">💧 精油价目</div>
>{{ tab.icon }} {{ tab.label }}</div> <div v-if="auth.isBusiness" class="nav-tab" :class="{ active: ui.currentSection === 'projects' }" @click="goSection('projects')">💼 商业核算</div>
<div v-if="auth.isAdmin" class="nav-tab" :class="{ active: ui.currentSection === 'audit' }" @click="goSection('audit')">📜 操作日志</div>
<div v-if="auth.isAdmin" class="nav-tab" :class="{ active: ui.currentSection === 'bugs' }" @click="goSection('bugs')">🐛 Bug</div>
<div v-if="auth.isAdmin" class="nav-tab" :class="{ active: ui.currentSection === 'users' }" @click="goSection('users')">👥 用户管理</div>
</div> </div>
<!-- Main content --> <!-- Main content -->
@@ -53,7 +54,7 @@
</template> </template>
<script setup> <script setup>
import { ref, computed, onMounted, watch, nextTick } from 'vue' import { ref, computed, onMounted, watch } from 'vue'
import { useRouter, useRoute } from 'vue-router' import { useRouter, useRoute } from 'vue-router'
import { useAuthStore } from './stores/auth' import { useAuthStore } from './stores/auth'
import { useOilsStore } from './stores/oils' import { useOilsStore } from './stores/oils'
@@ -62,7 +63,6 @@ import { useUiStore } from './stores/ui'
import LoginModal from './components/LoginModal.vue' import LoginModal from './components/LoginModal.vue'
import CustomDialog from './components/CustomDialog.vue' import CustomDialog from './components/CustomDialog.vue'
import UserMenu from './components/UserMenu.vue' import UserMenu from './components/UserMenu.vue'
import { api } from './composables/useApi'
const auth = useAuthStore() const auth = useAuthStore()
const oils = useOilsStore() const oils = useOilsStore()
@@ -71,47 +71,12 @@ const ui = useUiStore()
const router = useRouter() const router = useRouter()
const route = useRoute() const route = useRoute()
const showUserMenu = ref(false) const showUserMenu = ref(false)
const navTabsRef = ref(null)
// Tab 定义,顺序固定
// require: 点击时需要的条件,不满足则提示
// hide: 完全隐藏(只有满足条件才显示)
const allTabs = [
{ key: 'search', icon: '🔍', label: '配方查询' },
{ key: 'manage', icon: '📋', label: '管理配方', require: 'login' },
{ key: 'inventory', icon: '📦', label: '个人库存', require: 'login' },
{ key: 'oils', icon: '💧', label: '精油价目' },
{ key: 'projects', icon: '💼', label: '商业核算', require: 'login' },
{ key: 'audit', icon: '📜', label: '操作日志', hide: 'admin' },
{ key: 'bugs', icon: '🐛', label: 'Bug', hide: 'admin' },
{ key: 'users', icon: '👥', label: '用户管理', hide: 'admin' },
]
// 所有人都能看到大部分 tabbug 和用户管理只有 admin 可见
const visibleTabs = computed(() => allTabs.filter(t => {
if (!t.hide) return true
if (t.hide === 'admin') return auth.isAdmin
return true
}))
const unreadNotifCount = ref(0)
async function loadUnreadCount() {
if (!auth.isLoggedIn) return
try {
const res = await api('/api/notifications')
if (res.ok) {
const data = await res.json()
unreadNotifCount.value = data.filter(n => !n.is_read).length
}
} catch {}
}
// Sync ui.currentSection from route on load and navigation // Sync ui.currentSection from route on load and navigation
const routeToSection = { '/': 'search', '/manage': 'manage', '/inventory': 'inventory', '/oils': 'oils', '/projects': 'projects', '/mydiary': 'mydiary', '/audit': 'audit', '/bugs': 'bugs', '/users': 'users' } const routeToSection = { '/': 'search', '/manage': 'manage', '/inventory': 'inventory', '/oils': 'oils', '/projects': 'projects', '/mydiary': 'mydiary', '/audit': 'audit', '/bugs': 'bugs', '/users': 'users' }
watch(() => route.path, (path) => { watch(() => route.path, (path) => {
const section = routeToSection[path] || 'search' const section = routeToSection[path] || 'search'
ui.showSection(section) ui.showSection(section)
nextTick(() => scrollActiveTabToCenter())
}, { immediate: true }) }, { immediate: true })
// Preview environment detection: pr-{id}.oil.oci.euphon.net // Preview environment detection: pr-{id}.oil.oci.euphon.net
@@ -120,35 +85,9 @@ const prMatch = hostname.match(/^pr-(\d+)\./)
const isPreview = !!prMatch const isPreview = !!prMatch
const prId = prMatch ? prMatch[1] : '' const prId = prMatch ? prMatch[1] : ''
function handleTabClick(tab) {
if (tab.require === 'login' && !auth.isLoggedIn) {
ui.openLogin(() => goSection(tab.key))
return
}
if (tab.require === 'business' && !auth.isBusiness) {
if (!auth.isLoggedIn) {
ui.openLogin(() => goSection(tab.key))
} else {
ui.showToast('需要商业认证才能使用此功能')
}
return
}
goSection(tab.key)
}
function goSection(name) { function goSection(name) {
ui.showSection(name) ui.showSection(name)
router.push('/' + (name === 'search' ? '' : name)) router.push('/' + (name === 'search' ? '' : name))
nextTick(() => scrollActiveTabToCenter())
}
function scrollActiveTabToCenter() {
if (!navTabsRef.value) return
const active = navTabsRef.value.querySelector('.nav-tab.active')
if (!active) return
const container = navTabsRef.value
const scrollLeft = active.offsetLeft - container.clientWidth / 2 + active.clientWidth / 2
container.scrollTo({ left: scrollLeft, behavior: 'smooth' })
} }
function requireLogin(name) { function requireLogin(name) {
@@ -167,35 +106,45 @@ function toggleUserMenu() {
showUserMenu.value = !showUserMenu.value showUserMenu.value = !showUserMenu.value
} }
// ── 左右滑动切换 tab ── // Swipe to switch tabs
// 滑动顺序 = visibleTabs 的顺序(根据用户角色动态决定)
// 轮播区域data-no-tab-swipe内的滑动不触发 tab 切换
const swipeStartX = ref(0) const swipeStartX = ref(0)
const swipeStartY = ref(0) const swipeStartY = ref(0)
// Tab order for swipe navigation (only user-accessible tabs)
const tabOrder = computed(() => {
const tabs = ['search', 'oils']
if (auth.isLoggedIn) {
tabs.splice(1, 0, 'manage', 'inventory')
}
if (auth.isBusiness) tabs.push('projects')
return tabs
})
function onSwipeStart(e) { function onSwipeStart(e) {
swipeStartX.value = e.touches[0].clientX const touch = e.touches[0]
swipeStartY.value = e.touches[0].clientY swipeStartX.value = touch.clientX
swipeStartY.value = touch.clientY
} }
function onSwipeEnd(e) { function onSwipeEnd(e) {
const dx = e.changedTouches[0].clientX - swipeStartX.value const touch = e.changedTouches[0]
const dy = e.changedTouches[0].clientY - swipeStartY.value const dx = touch.clientX - swipeStartX.value
// 必须是水平滑动 > 50px且水平距离大于垂直距离 const dy = touch.clientY - swipeStartY.value
// Only trigger if horizontal swipe is dominant and > 50px
if (Math.abs(dx) < 50 || Math.abs(dy) > Math.abs(dx)) return if (Math.abs(dx) < 50 || Math.abs(dy) > Math.abs(dx)) return
// 轮播区域内不触发 tab 切换 // Check if the swipe originated inside a carousel (data-no-tab-swipe)
if (e.target.closest && e.target.closest('[data-no-tab-swipe]')) return if (e.target.closest && e.target.closest('[data-no-tab-swipe]')) return
const tabs = visibleTabs.value.map(t => t.key) const tabs = tabOrder.value
const currentIdx = tabs.indexOf(ui.currentSection) const currentIdx = tabs.indexOf(ui.currentSection)
if (currentIdx < 0) return if (currentIdx < 0) return
let nextIdx = -1 if (dx < -50 && currentIdx < tabs.length - 1) {
if (dx < 0 && currentIdx < tabs.length - 1) nextIdx = currentIdx + 1 // Swipe left -> next tab
else if (dx > 0 && currentIdx > 0) nextIdx = currentIdx - 1 goSection(tabs[currentIdx + 1])
if (nextIdx >= 0) { } else if (dx > 50 && currentIdx > 0) {
const tab = visibleTabs.value[nextIdx] // Swipe right -> previous tab
handleTabClick(tab) goSection(tabs[currentIdx - 1])
} }
} }
@@ -208,7 +157,6 @@ onMounted(async () => {
]) ])
if (auth.isLoggedIn) { if (auth.isLoggedIn) {
await recipeStore.loadFavorites() await recipeStore.loadFavorites()
await loadUnreadCount()
} }
// Periodic refresh // Periodic refresh
@@ -216,7 +164,6 @@ onMounted(async () => {
if (document.visibilityState !== 'visible') return if (document.visibilityState !== 'visible') return
try { try {
await auth.loadMe() await auth.loadMe()
await loadUnreadCount()
} catch {} } catch {}
}, 15000) }, 15000)
}) })
@@ -256,11 +203,6 @@ onMounted(async () => {
letter-spacing: 0.5px; letter-spacing: 0.5px;
white-space: nowrap; white-space: nowrap;
} }
.version-info {
font-size: 10px !important;
opacity: 0.5 !important;
margin-top: 1px !important;
}
.header-right { .header-right {
flex-shrink: 0; flex-shrink: 0;
cursor: pointer; cursor: pointer;
@@ -275,19 +217,6 @@ onMounted(async () => {
opacity: 0.95; opacity: 0.95;
white-space: nowrap; white-space: nowrap;
} }
.notif-badge {
background: #e53935;
color: #fff;
font-size: 11px;
font-weight: 700;
min-width: 18px;
height: 18px;
line-height: 18px;
text-align: center;
border-radius: 9px;
padding: 0 5px;
margin-left: 4px;
}
.login-btn { .login-btn {
color: white; color: white;
background: rgba(255,255,255,0.2); background: rgba(255,255,255,0.2);

View File

@@ -69,24 +69,6 @@ body {
.nav-tab:hover { color: var(--sage-dark); } .nav-tab:hover { color: var(--sage-dark); }
.nav-tab.active { color: var(--sage-dark); border-bottom-color: var(--sage); } .nav-tab.active { color: var(--sage-dark); border-bottom-color: var(--sage); }
.section-title-bar {
display: flex;
justify-content: center;
align-items: center;
background: white;
padding: 12px 0;
position: sticky;
top: 0;
z-index: 50;
}
.section-title-text {
font-size: 15px;
font-weight: 600;
color: var(--sage-dark);
border-bottom: 2px solid var(--sage);
padding-bottom: 4px;
}
/* Main content */ /* Main content */
.main { padding: 24px; max-width: 960px; margin: 0 auto; } .main { padding: 24px; max-width: 960px; margin: 0 auto; }

View File

@@ -51,15 +51,6 @@
<button class="login-submit" :disabled="loading" @click="submit"> <button class="login-submit" :disabled="loading" @click="submit">
{{ loading ? '请稍候...' : (mode === 'login' ? '登录' : '注册') }} {{ loading ? '请稍候...' : (mode === 'login' ? '登录' : '注册') }}
</button> </button>
<div class="login-divider"></div>
<button v-if="!showFeedback" class="login-feedback-btn" @click="showFeedback = true">🐛 反馈问题无需登录</button>
<div v-if="showFeedback" class="feedback-section">
<textarea v-model="feedbackText" class="login-input" rows="3" placeholder="描述你遇到的问题..." style="resize:vertical;"></textarea>
<button class="login-submit" :disabled="!feedbackText.trim() || feedbackLoading" @click="submitFeedback">
{{ feedbackLoading ? '提交中...' : '提交反馈' }}
</button>
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -69,7 +60,6 @@
import { ref } from 'vue' import { ref } from 'vue'
import { useAuthStore } from '../stores/auth' import { useAuthStore } from '../stores/auth'
import { useUiStore } from '../stores/ui' import { useUiStore } from '../stores/ui'
import { api } from '../composables/useApi'
const emit = defineEmits(['close']) const emit = defineEmits(['close'])
@@ -83,9 +73,6 @@ const confirmPassword = ref('')
const displayName = ref('') const displayName = ref('')
const errorMsg = ref('') const errorMsg = ref('')
const loading = ref(false) const loading = ref(false)
const showFeedback = ref(false)
const feedbackText = ref('')
const feedbackLoading = ref(false)
async function submit() { async function submit() {
errorMsg.value = '' errorMsg.value = ''
@@ -128,26 +115,6 @@ async function submit() {
loading.value = false loading.value = false
} }
} }
async function submitFeedback() {
if (!feedbackText.value.trim()) return
feedbackLoading.value = true
try {
const res = await api('/api/bug-report', {
method: 'POST',
body: JSON.stringify({ content: feedbackText.value.trim(), priority: 0 }),
})
if (res.ok) {
feedbackText.value = ''
showFeedback.value = false
ui.showToast('反馈已提交,感谢!')
}
} catch {
ui.showToast('提交失败')
} finally {
feedbackLoading.value = false
}
}
</script> </script>
<style scoped> <style scoped>
@@ -242,31 +209,4 @@ async function submitFeedback() {
opacity: 0.6; opacity: 0.6;
cursor: not-allowed; cursor: not-allowed;
} }
.login-divider {
height: 1px;
background: #eee;
margin: 4px 0;
}
.login-feedback-btn {
background: none;
border: none;
color: #999;
font-size: 13px;
cursor: pointer;
font-family: inherit;
text-align: center;
padding: 4px 0;
}
.login-feedback-btn:hover {
color: #666;
}
.feedback-section {
display: flex;
flex-direction: column;
gap: 10px;
}
</style> </style>

View File

@@ -9,7 +9,7 @@
<button class="action-btn action-btn-fav action-btn-sm" @click="handleToggleFavorite"> <button class="action-btn action-btn-fav action-btn-sm" @click="handleToggleFavorite">
{{ isFav ? ' 已收藏' : ' 收藏' }} {{ isFav ? ' 已收藏' : ' 收藏' }}
</button> </button>
<button v-if="!props.isDiary" class="action-btn action-btn-diary action-btn-sm" @click="saveToDiary"> <button v-if="!recipe._diary_id" class="action-btn action-btn-diary action-btn-sm" @click="saveToDiary">
📔 存为我的 📔 存为我的
</button> </button>
</div> </div>
@@ -359,9 +359,7 @@ import { matchesPinyinInitials } from '../composables/usePinyinMatch'
// TagPicker replaced with inline tag editing // TagPicker replaced with inline tag editing
const props = defineProps({ const props = defineProps({
recipeIndex: { type: Number, default: null }, recipeIndex: { type: Number, required: true },
recipeData: { type: Object, default: null },
isDiary: { type: Boolean, default: false },
}) })
const emit = defineEmits(['close']) const emit = defineEmits(['close'])
@@ -388,10 +386,9 @@ const generatingImage = ref(false)
const previewOverride = ref(null) const previewOverride = ref(null)
// ---- Source recipe ---- // ---- Source recipe ----
const recipe = computed(() => { const recipe = computed(() =>
if (props.recipeData) return props.recipeData recipesStore.recipes[props.recipeIndex] || { name: '', ingredients: [], tags: [], note: '' }
return recipesStore.recipes[props.recipeIndex] || { name: '', ingredients: [], tags: [], note: '' } )
})
// ---- Display recipe: previewOverride when in preview mode, otherwise saved recipe ---- // ---- Display recipe: previewOverride when in preview mode, otherwise saved recipe ----
const displayRecipe = computed(() => { const displayRecipe = computed(() => {
@@ -400,8 +397,8 @@ const displayRecipe = computed(() => {
}) })
const canEditThisRecipe = computed(() => { const canEditThisRecipe = computed(() => {
if (props.isDiary) return false
if (authStore.canEdit) return true if (authStore.canEdit) return true
if (authStore.isLoggedIn && recipe.value._owner_id === authStore.user.id) return true
return false return false
}) })
@@ -713,31 +710,22 @@ async function saveToDiary() {
return return
} }
const name = await showPrompt('保存为我的配方,名称:', recipe.value.name) const name = await showPrompt('保存为我的配方,名称:', recipe.value.name)
// null = user cancelled (clicked 取消)
if (name === null) return if (name === null) return
// empty string = user cleared the name field
if (!name.trim()) { if (!name.trim()) {
ui.showToast('请输入配方名称') ui.showToast('请输入配方名称')
return return
} }
const trimmed = name.trim()
const dupDiary = diaryStore.userDiary.some(d => d.name === trimmed)
const dupPublic = recipesStore.recipes.some(r => r.name === trimmed)
if (dupDiary) {
ui.showToast('我的配方中已有同名配方「' + trimmed + '」')
return
}
if (dupPublic) {
ui.showToast('公共配方库中已有同名配方「' + trimmed + '」')
return
}
try { try {
const payload = { const payload = {
name: name.trim(), name: name.trim(),
note: recipe.value.note || '', note: recipe.value.note || '',
ingredients: recipe.value.ingredients.map(i => ({ oil: i.oil, drops: i.drops })), ingredients: recipe.value.ingredients.map(i => ({ oil_name: i.oil, drops: i.drops })),
tags: recipe.value.tags || [], tags: recipe.value.tags || [],
source_recipe_id: recipe.value._id || null,
} }
await diaryStore.createDiary(payload) console.log('[saveToDiary] saving recipe:', payload)
await recipesStore.saveRecipe(payload)
ui.showToast('已保存!可在「配方查询 → 我的配方」查看') ui.showToast('已保存!可在「配方查询 → 我的配方」查看')
} catch (e) { } catch (e) {
console.error('[saveToDiary] failed:', e) console.error('[saveToDiary] failed:', e)

View File

@@ -30,14 +30,7 @@
class="notif-item" :class="{ unread: !n.is_read }"> class="notif-item" :class="{ unread: !n.is_read }">
<div class="notif-item-header"> <div class="notif-item-header">
<div class="notif-title">{{ n.title }}</div> <div class="notif-title">{{ n.title }}</div>
<div v-if="!n.is_read" class="notif-actions"> <button v-if="!n.is_read" class="notif-mark-one" @click="markOneRead(n)">已读</button>
<!-- 搜索未收录通知已添加按钮 -->
<button v-if="isSearchMissing(n)" class="notif-action-btn notif-btn-added" @click="markAdded(n)">已添加</button>
<!-- 审核类通知去审核按钮 -->
<button v-else-if="isReviewable(n)" class="notif-action-btn notif-btn-review" @click="goReview(n)">去审核</button>
<!-- 默认已读按钮 -->
<button v-else class="notif-mark-one" @click="markOneRead(n)">已读</button>
</div>
</div> </div>
<div v-if="n.body" class="notif-body">{{ n.body }}</div> <div v-if="n.body" class="notif-body">{{ n.body }}</div>
<div class="notif-time">{{ formatTime(n.created_at) }}</div> <div class="notif-time">{{ formatTime(n.created_at) }}</div>
@@ -115,29 +108,6 @@ async function submitBug() {
} }
} }
function isSearchMissing(n) {
return n.title && n.title.includes('用户需求')
}
function isReviewable(n) {
if (!n.title) return false
return n.title.includes('待审核') || n.title.includes('商业认证') || n.title.includes('申请')
}
async function markAdded(n) {
await markOneRead(n)
}
function goReview(n) {
markOneRead(n)
emit('close')
if (n.title.includes('配方')) {
router.push('/manage')
} else if (n.title.includes('商业认证') || n.title.includes('申请')) {
router.push('/users')
}
}
async function markOneRead(n) { async function markOneRead(n) {
try { try {
await api(`/api/notifications/${n.id}/read`, { method: 'POST', body: '{}' }) await api(`/api/notifications/${n.id}/read`, { method: 'POST', body: '{}' })
@@ -163,7 +133,7 @@ function handleLogout() {
auth.logout() auth.logout()
ui.showToast('已退出登录') ui.showToast('已退出登录')
emit('close') emit('close')
window.location.href = '/' router.push('/')
} }
onMounted(loadNotifications) onMounted(loadNotifications)
@@ -235,16 +205,6 @@ onMounted(loadNotifications)
font-family: inherit; white-space: nowrap; flex-shrink: 0; font-family: inherit; white-space: nowrap; flex-shrink: 0;
} }
.notif-mark-one:hover { background: #f0faf5; border-color: #7a9e7e; } .notif-mark-one:hover { background: #f0faf5; border-color: #7a9e7e; }
.notif-actions { display: flex; gap: 4px; flex-shrink: 0; }
.notif-action-btn {
background: none; border: 1px solid #ccc; border-radius: 6px;
font-size: 11px; cursor: pointer; padding: 2px 8px;
font-family: inherit; white-space: nowrap;
}
.notif-btn-added { color: #4a9d7e; border-color: #7ec6a4; }
.notif-btn-added:hover { background: #e8f5e9; }
.notif-btn-review { color: #e65100; border-color: #ffb74d; }
.notif-btn-review:hover { background: #fff3e0; }
.notif-body { color: #888; font-size: 12px; margin-top: 2px; white-space: pre-line; } .notif-body { color: #888; font-size: 12px; margin-top: 2px; white-space: pre-line; }
.notif-time { color: #bbb; font-size: 11px; margin-top: 2px; } .notif-time { color: #bbb; font-size: 11px; margin-top: 2px; }
.notif-empty { text-align: center; color: #ccc; padding: 16px; font-size: 13px; } .notif-empty { text-align: center; color: #ccc; padding: 16px; font-size: 13px; }

View File

@@ -260,99 +260,3 @@ export function parseSingleBlock(raw, oilNames) {
notFound notFound
} }
} }
/**
* Parse multi-recipe text. Each time an unrecognized non-number token
* appears after some oils have been found, it starts a new recipe.
*/
export function parseMultiRecipes(raw, oilNames) {
// First split by lines/commas, then within each part also try space splitting
const roughParts = raw.split(/[,,、\n\r]+/).map(s => s.trim()).filter(s => s)
const parts = []
for (const rp of roughParts) {
// If the part has spaces and contains mixed name+oil, split by spaces too
// But only if spaces actually separate meaningful chunks
const spaceParts = rp.split(/\s+/).filter(s => s)
if (spaceParts.length > 1) {
parts.push(...spaceParts)
} else {
// No spaces or single chunk — try to separate name prefix from oil+number
// e.g. "长高芳香调理8" → check if any oil is inside
const hasOilInside = oilNames.some(oil => rp.includes(oil))
if (hasOilInside && rp.length > 2) {
// Find the earliest oil match position
let earliest = rp.length
let earliestOil = ''
for (const oil of oilNames) {
const pos = rp.indexOf(oil)
if (pos >= 0 && pos < earliest) {
earliest = pos
earliestOil = oil
}
}
if (earliest > 0) {
parts.push(rp.substring(0, earliest))
parts.push(rp.substring(earliest))
} else {
parts.push(rp)
}
} else {
parts.push(rp)
}
}
}
const recipes = []
let current = { nameParts: [], ingredientParts: [], foundOil: false }
for (const part of parts) {
const hasNumber = /\d/.test(part)
const hasOil = oilNames.some(oil => part.includes(oil)) ||
Object.keys(OIL_HOMOPHONES).some(alias => part.includes(alias))
// Also check fuzzy: 3+ char parts
const fuzzyOil = !hasOil && part.replace(/\d+\.?\d*/g, '').length >= 2 &&
findOil(part.replace(/\d+\.?\d*/g, '').trim(), oilNames)
if (current.foundOil && !hasOil && !fuzzyOil && !hasNumber && part.length >= 2) {
// New recipe starts
recipes.push(current)
current = { nameParts: [], ingredientParts: [], foundOil: false }
current.nameParts.push(part)
} else if (!current.foundOil && !hasOil && !fuzzyOil && !hasNumber) {
current.nameParts.push(part)
} else {
current.foundOil = true
current.ingredientParts.push(part)
}
}
recipes.push(current)
// Convert each block to parsed recipe
return recipes.filter(r => r.ingredientParts.length > 0 || r.nameParts.length > 0).map(r => {
const allIngs = []
const notFound = []
for (const p of r.ingredientParts) {
const parsed = parseOilChunk(p, oilNames)
for (const item of parsed) {
if (item.notFound) notFound.push(item.oil)
else allIngs.push(item)
}
}
// Deduplicate
const deduped = []
const seen = {}
for (const item of allIngs) {
if (seen[item.oil] !== undefined) {
deduped[seen[item.oil]].drops += item.drops
} else {
seen[item.oil] = deduped.length
deduped.push({ ...item })
}
}
return {
name: r.nameParts.join(' ') || '未命名配方',
ingredients: deduped,
notFound,
}
})
}

View File

@@ -10,13 +10,11 @@ const routes = [
path: '/manage', path: '/manage',
name: 'RecipeManager', name: 'RecipeManager',
component: () => import('../views/RecipeManager.vue'), component: () => import('../views/RecipeManager.vue'),
meta: { requiresAuth: true },
}, },
{ {
path: '/inventory', path: '/inventory',
name: 'Inventory', name: 'Inventory',
component: () => import('../views/Inventory.vue'), component: () => import('../views/Inventory.vue'),
meta: { requiresAuth: true },
}, },
{ {
path: '/oils', path: '/oils',
@@ -27,31 +25,26 @@ const routes = [
path: '/projects', path: '/projects',
name: 'Projects', name: 'Projects',
component: () => import('../views/Projects.vue'), component: () => import('../views/Projects.vue'),
meta: { requiresAuth: true },
}, },
{ {
path: '/mydiary', path: '/mydiary',
name: 'MyDiary', name: 'MyDiary',
component: () => import('../views/MyDiary.vue'), component: () => import('../views/MyDiary.vue'),
meta: { requiresAuth: true },
}, },
{ {
path: '/audit', path: '/audit',
name: 'AuditLog', name: 'AuditLog',
component: () => import('../views/AuditLog.vue'), component: () => import('../views/AuditLog.vue'),
meta: { requiresAuth: true },
}, },
{ {
path: '/bugs', path: '/bugs',
name: 'BugTracker', name: 'BugTracker',
component: () => import('../views/BugTracker.vue'), component: () => import('../views/BugTracker.vue'),
meta: { requiresAuth: true },
}, },
{ {
path: '/users', path: '/users',
name: 'UserManagement', name: 'UserManagement',
component: () => import('../views/UserManagement.vue'), component: () => import('../views/UserManagement.vue'),
meta: { requiresAuth: true },
}, },
] ]

View File

@@ -28,6 +28,16 @@ export const useAuthStore = defineStore('auth', () => {
// Actions // Actions
async function initToken() { async function initToken() {
const params = new URLSearchParams(window.location.search)
const urlToken = params.get('token')
if (urlToken) {
token.value = urlToken
localStorage.setItem('oil_auth_token', urlToken)
// Clean URL
const url = new URL(window.location)
url.searchParams.delete('token')
window.history.replaceState({}, '', url)
}
if (token.value) { if (token.value) {
await loadMe() await loadMe()
} }
@@ -75,7 +85,7 @@ export const useAuthStore = defineStore('auth', () => {
function canEditRecipe(recipe) { function canEditRecipe(recipe) {
if (isAdmin.value || user.value.role === 'senior_editor') return true if (isAdmin.value || user.value.role === 'senior_editor') return true
if (canEdit.value && recipe._owner_id === user.value.id) return true if (recipe._owner_id === user.value.id) return true
return false return false
} }

View File

@@ -241,65 +241,26 @@
</div> </div>
<!-- Business Verification --> <!-- Business Verification -->
<div ref="bizCertRef" class="section-card"> <div v-if="!auth.isBusiness" class="section-card">
<h4>💼 商业认证</h4> <h4>💼 商业认证</h4>
<p class="hint-text">申请商业认证后可使用商业核算功能</p>
<!-- 已认证 -->
<div v-if="auth.isBusiness" class="biz-status biz-approved">
<div class="biz-status-icon"></div>
<div class="biz-status-text">已认证商业用户</div>
</div>
<!-- 审核中 -->
<template v-else-if="bizApp.status === 'pending'">
<div class="biz-status biz-pending">
<div class="biz-status-icon"></div>
<div class="biz-status-text">认证申请审核中</div>
<div class="biz-status-detail">商户名{{ bizApp.business_name }}</div>
<div class="biz-status-detail">提交时间{{ formatDate(bizApp.created_at) }}</div>
</div>
</template>
<!-- 被拒绝可重新申请 -->
<template v-else-if="bizApp.status === 'rejected'">
<div class="biz-status biz-rejected">
<div class="biz-status-icon"></div>
<div class="biz-status-text">认证申请未通过</div>
<div v-if="bizApp.reject_reason" class="biz-reject-reason">原因{{ bizApp.reject_reason }}</div>
</div>
<p class="hint-text">你可以修改信息后重新申请</p>
<div class="form-group">
<label>商户名称</label>
<input v-model="businessName" class="form-input" placeholder="你的商户/品牌名称" />
</div>
<div class="form-group"> <div class="form-group">
<label>申请说明</label> <label>申请说明</label>
<textarea v-model="businessReason" class="form-textarea" rows="3" placeholder="请说明您的业务情况和申请理由..."></textarea> <textarea v-model="businessReason" class="form-textarea" rows="3" placeholder="请说明您的申请理由..."></textarea>
</div> </div>
<button class="btn-primary" @click="applyBusiness" :disabled="!businessName.trim()">重新申请</button> <button class="btn-primary" @click="applyBusiness" :disabled="!businessReason.trim()">提交申请</button>
</template>
<!-- 首次申请 -->
<template v-else>
<p class="hint-text">申请商业认证后可使用商业核算功能请填写以下信息</p>
<div class="form-group">
<label>商户名称</label>
<input v-model="businessName" class="form-input" placeholder="你的商户/品牌名称" />
</div> </div>
<div class="form-group"> <div v-else class="section-card">
<label>申请说明</label> <h4>💼 商业认证</h4>
<textarea v-model="businessReason" class="form-textarea" rows="3" placeholder="请说明您的业务情况和申请理由..."></textarea> <div class="verified-badge"> 已认证商业用户</div>
</div>
<button class="btn-primary" @click="applyBusiness" :disabled="!businessName.trim()">提交申请</button>
</template>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script setup> <script setup>
import { ref, nextTick, onMounted, watch } from 'vue' import { ref, onMounted, watch } from 'vue'
import { useRouter, useRoute } 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'
import { useDiaryStore } from '../stores/diary' import { useDiaryStore } from '../stores/diary'
@@ -313,10 +274,8 @@ const oils = useOilsStore()
const diaryStore = useDiaryStore() const diaryStore = useDiaryStore()
const ui = useUiStore() const ui = useUiStore()
const router = useRouter() const router = useRouter()
const route = useRoute()
const bizCertRef = ref(null)
const activeTab = ref(route.query.tab || 'brand') const activeTab = ref('brand')
const pasteText = ref('') const pasteText = ref('')
const selectedDiaryId = ref(null) const selectedDiaryId = ref(null)
const returnRecipeId = ref(null) const returnRecipeId = ref(null)
@@ -339,25 +298,13 @@ const displayName = ref('')
const oldPassword = ref('') const oldPassword = ref('')
const newPassword = ref('') const newPassword = ref('')
const confirmPassword = ref('') const confirmPassword = ref('')
const businessName = ref('')
const businessReason = ref('') const businessReason = ref('')
const bizApp = ref({ status: null })
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 returnRecipeId.value = localStorage.getItem('oil_return_recipe_id') || null
// Load business application status
try {
const bizRes = await api('/api/my-business-application')
if (bizRes.ok) bizApp.value = await bizRes.json()
} catch {}
// 从商业核算跳转过来,滚到商业认证区域
if (route.query.section === 'biz-cert') {
await nextTick()
bizCertRef.value?.scrollIntoView({ behavior: 'smooth', block: 'center' })
}
}) })
function goBackToRecipe() { function goBackToRecipe() {
@@ -627,6 +574,26 @@ async function clearBrandImage(type) {
} }
} }
async function clearBrandImage(type) {
const fieldMap = { logo: 'brand_logo', bg: 'brand_bg', qr: 'qr_code' }
const field = fieldMap[type]
if (!field) return
try {
const res = await api('/api/brand', {
method: 'PUT',
body: JSON.stringify({ [field]: '' }),
})
if (res.ok) {
if (type === 'logo') brandLogo.value = ''
else if (type === 'bg') brandBg.value = ''
else if (type === 'qr') brandQrImage.value = ''
ui.showToast('已清除')
}
} catch {
ui.showToast('清除失败')
}
}
// Account // Account
async function updateDisplayName() { async function updateDisplayName() {
try { try {
@@ -669,30 +636,13 @@ async function changePassword() {
} }
async function applyBusiness() { async function applyBusiness() {
if (!businessName.value.trim()) {
ui.showToast('请填写商户名称')
return
}
try { try {
const res = await api('/api/business-apply', { await api('/api/business-apply', {
method: 'POST', method: 'POST',
body: JSON.stringify({ body: JSON.stringify({ reason: businessReason.value }),
business_name: businessName.value.trim(),
document: businessReason.value.trim(),
}),
}) })
if (res.ok) {
businessName.value = ''
businessReason.value = '' businessReason.value = ''
bizApp.value = { status: 'pending', business_name: businessName.value } ui.showToast('申请已提交,请等待审核')
ui.showToast('申请已提交,请等待管理员审核')
// Reload status
const bizRes = await api('/api/my-business-application')
if (bizRes.ok) bizApp.value = await bizRes.json()
} else {
const err = await res.json().catch(() => ({}))
ui.showToast(err.detail || '提交失败')
}
} catch { } catch {
ui.showToast('提交失败') ui.showToast('提交失败')
} }
@@ -1147,20 +1097,6 @@ async function applyBusiness() {
text-align: center; text-align: center;
} }
.biz-status {
padding: 16px;
border-radius: 12px;
text-align: center;
margin-bottom: 12px;
}
.biz-status-icon { font-size: 32px; margin-bottom: 8px; }
.biz-status-text { font-size: 15px; font-weight: 600; margin-bottom: 4px; }
.biz-status-detail { font-size: 12px; color: #999; }
.biz-approved { background: #e8f5e9; color: #2e7d5a; }
.biz-pending { background: #fff8e1; color: #e65100; }
.biz-rejected { background: #fce4ec; color: #c62828; }
.biz-reject-reason { font-size: 13px; margin-top: 8px; padding: 8px 12px; background: rgba(0,0,0,0.05); border-radius: 8px; }
/* Buttons */ /* Buttons */
.btn-primary { .btn-primary {
background: linear-gradient(135deg, #7ec6a4 0%, #4a9d7e 100%); background: linear-gradient(135deg, #7ec6a4 0%, #4a9d7e 100%);

View File

@@ -132,7 +132,7 @@
v-for="name in filteredOilNames" v-for="name in filteredOilNames"
:key="name + '-' + cardVersion" :key="name + '-' + cardVersion"
class="oil-chip" class="oil-chip"
:class="{ 'oil-chip--inactive': getMeta(name)?.isActive === false, 'oil-chip--incomplete': auth.canManage && isIncomplete(name) }" :class="{ 'oil-chip--inactive': getMeta(name)?.isActive === false, 'oil-chip--incomplete': auth.isAdmin && isIncomplete(name) }"
:style="chipStyle(name)" :style="chipStyle(name)"
@click="openOilDetail(name)" @click="openOilDetail(name)"
> >
@@ -260,15 +260,12 @@
</div> </div>
<!-- Edit Oil Overlay --> <!-- Edit Oil Overlay -->
<div v-if="editingOilName" class="modal-overlay" @click.self="editingOilName = null" @keydown.enter="saveEditOil"> <div v-if="editingOilName" class="modal-overlay" @click.self="editingOilName = null">
<div class="modal-panel"> <div class="modal-panel">
<div class="modal-header"> <div class="modal-header">
<h3>{{ editingOilName }}</h3> <h3>{{ editingOilName }}</h3>
<div style="display:flex;gap:8px;align-items:center">
<button class="btn-primary" style="padding:6px 16px;font-size:13px" @click="saveEditOil">保存</button>
<button class="btn-close" @click="editingOilName = null"></button> <button class="btn-close" @click="editingOilName = null"></button>
</div> </div>
</div>
<div class="modal-body"> <div class="modal-body">
<div class="form-group"> <div class="form-group">
<label>精油名称</label> <label>精油名称</label>

View File

@@ -3,7 +3,7 @@
<!-- Project List --> <!-- Project List -->
<div class="toolbar"> <div class="toolbar">
<h3 class="page-title">💼 商业核算</h3> <h3 class="page-title">💼 商业核算</h3>
<button v-if="auth.isBusiness" class="btn-primary" @click="createProject">+ 新建项目</button> <button class="btn-primary" @click="createProject">+ 新建项目</button>
</div> </div>
<div v-if="!selectedProject" class="project-list"> <div v-if="!selectedProject" class="project-list">
@@ -23,7 +23,7 @@
成本 {{ oils.fmtPrice(oils.calcCost(p.ingredients)) }} 成本 {{ oils.fmtPrice(oils.calcCost(p.ingredients)) }}
</span> </span>
</div> </div>
<div v-if="auth.isAdmin" class="proj-actions" @click.stop> <div class="proj-actions" @click.stop>
<button class="btn-icon-sm" @click="deleteProject(p)" title="删除">🗑</button> <button class="btn-icon-sm" @click="deleteProject(p)" title="删除">🗑</button>
</div> </div>
</div> </div>
@@ -177,7 +177,6 @@
<script setup> <script setup>
import { ref, computed, onMounted } from 'vue' import { ref, computed, onMounted } from 'vue'
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'
import { useRecipesStore } from '../stores/recipes' import { useRecipesStore } from '../stores/recipes'
@@ -189,14 +188,6 @@ const auth = useAuthStore()
const oils = useOilsStore() const oils = useOilsStore()
const recipeStore = useRecipesStore() const recipeStore = useRecipesStore()
const ui = useUiStore() const ui = useUiStore()
const router = useRouter()
async function showCertPrompt() {
const ok = await showConfirm('此功能需要商业认证,是否前往申请认证?', { okText: '去认证', cancelText: '取消' })
if (ok) {
router.push('/mydiary?tab=account&section=biz-cert')
}
}
const projects = ref([]) const projects = ref([])
const selectedProject = ref(null) const selectedProject = ref(null)
@@ -246,10 +237,6 @@ async function createProject() {
} }
function selectProject(p) { function selectProject(p) {
if (!auth.isBusiness) {
showCertPrompt()
return
}
selectedProject.value = { selectedProject.value = {
...p, ...p,
ingredients: (p.ingredients || []).map(i => ({ ...i })), ingredients: (p.ingredients || []).map(i => ({ ...i })),

File diff suppressed because it is too large Load Diff

View File

@@ -49,27 +49,27 @@
<!-- Personal Section (logged in) --> <!-- Personal Section (logged in) -->
<div v-if="auth.isLoggedIn" class="personal-section"> <div v-if="auth.isLoggedIn" class="personal-section">
<template v-if="!searchQuery || myDiaryRecipes.length > 0">
<div class="section-header" @click="showMyRecipes = !showMyRecipes"> <div class="section-header" @click="showMyRecipes = !showMyRecipes">
<span>📖 我的配方 ({{ myDiaryRecipes.length }})</span> <span>📖 我的配方 ({{ myDiaryRecipes.length }})</span>
<span v-if="!auth.isAdmin && sharedCount.total > 0" class="contrib-badge">已贡献 {{ sharedCount.adopted }}/{{ sharedCount.total }} </span>
<span class="toggle-icon">{{ showMyRecipes ? '▾' : '▸' }}</span> <span class="toggle-icon">{{ showMyRecipes ? '▾' : '▸' }}</span>
</div> </div>
<div v-if="showMyRecipes" class="recipe-grid"> <div v-if="showMyRecipes" class="recipe-grid">
<div v-for="d in myDiaryRecipes" :key="'diary-' + d.id" class="diary-card-wrap"> <div
<RecipeCard v-for="d in myDiaryRecipes"
:recipe="diaryAsRecipe(d)" :key="'diary-' + d.id"
:index="-1" class="recipe-card diary-card"
@click="openDiaryDetail(d)" @click="openDiaryDetail(d)"
/> >
<span v-if="getDiaryShareStatus(d) === 'shared'" class="share-status shared">已共享</span> <div class="card-name">{{ d.name }}</div>
<span v-else-if="getDiaryShareStatus(d) === 'pending'" class="share-status pending">审核中</span> <div class="card-oils">{{ (d.ingredients || []).map(i => i.oil).join('、') }}</div>
<div class="card-bottom">
<span class="card-price">{{ oils.fmtPrice(oils.calcCost(d.ingredients || [])) }}</span>
<button class="share-btn" @click.stop="shareDiaryToPublic(d)" title="共享到公共配方库">📤</button>
</div>
</div> </div>
<div v-if="myDiaryRecipes.length === 0" class="empty-hint">暂无个人配方</div> <div v-if="myDiaryRecipes.length === 0" class="empty-hint">暂无个人配方</div>
</div> </div>
</template>
<template v-if="!searchQuery || favoritesPreview.length > 0">
<div class="section-header" @click="showFavorites = !showFavorites"> <div class="section-header" @click="showFavorites = !showFavorites">
<span> 收藏配方 ({{ favoritesPreview.length }})</span> <span> 收藏配方 ({{ favoritesPreview.length }})</span>
<span class="toggle-icon">{{ showFavorites ? '▾' : '▸' }}</span> <span class="toggle-icon">{{ showFavorites ? '▾' : '▸' }}</span>
@@ -85,55 +85,21 @@
/> />
<div v-if="favoritesPreview.length === 0" class="empty-hint">暂无收藏配方</div> <div v-if="favoritesPreview.length === 0" class="empty-hint">暂无收藏配方</div>
</div> </div>
</template>
</div> </div>
<!-- Search Results (public recipes) --> <!-- Search Results (public recipes) -->
<div v-if="searchQuery" class="search-results-section"> <div v-if="searchQuery" class="search-results-section">
<!-- Exact matches --> <div class="section-label">🔍 公共配方搜索结果 ({{ fuzzyResults.length }})</div>
<template v-if="exactResults.length > 0">
<div class="section-label">🔍 搜索结果 ({{ exactResults.length }})</div>
<div class="recipe-grid"> <div class="recipe-grid">
<RecipeCard <RecipeCard
v-for="r in exactResults" v-for="(r, i) in fuzzyResults"
:key="r._id" :key="r._id"
:recipe="r" :recipe="r"
:index="findGlobalIndex(r)" :index="findGlobalIndex(r)"
@click="openDetail(findGlobalIndex(r))" @click="openDetail(findGlobalIndex(r))"
@toggle-fav="handleToggleFav(r)" @toggle-fav="handleToggleFav(r)"
/> />
</div> <div v-if="fuzzyResults.length === 0" class="empty-hint">未找到匹配的公共配方</div>
</template>
<!-- Similar/related matches -->
<template v-if="similarResults.length > 0">
<div class="section-label similar-label">
{{ exactResults.length > 0 ? '💡 相关配方' : '💡 没有完全匹配,以下是相关配方' }}
({{ similarResults.length }})
</div>
<div class="recipe-grid">
<RecipeCard
v-for="r in similarResults"
:key="'sim-' + r._id"
:recipe="r"
:index="findGlobalIndex(r)"
@click="openDetail(findGlobalIndex(r))"
@toggle-fav="handleToggleFav(r)"
/>
</div>
</template>
<!-- No results at all -->
<div v-if="exactResults.length === 0 && similarResults.length === 0" class="no-match-box">
<div class="empty-hint">未找到{{ searchQuery }}相关配方</div>
</div>
<!-- Report missing button (always shown at bottom) -->
<div class="no-match-box" style="margin-top:12px">
<button v-if="!reportedMissing" class="btn-report-missing" @click="reportMissing">
📢 没找到想要的通知编辑添加
</button>
<div v-else class="reported-hint">已通知编辑感谢反馈</div>
</div> </div>
</div> </div>
@@ -155,11 +121,9 @@
<!-- Recipe Detail Overlay --> <!-- Recipe Detail Overlay -->
<RecipeDetailOverlay <RecipeDetailOverlay
v-if="selectedRecipeIndex !== null || selectedDiaryRecipe !== null" v-if="selectedRecipeIndex !== null"
:recipeIndex="selectedRecipeIndex" :recipeIndex="selectedRecipeIndex"
:recipeData="selectedDiaryRecipe" @close="selectedRecipeIndex = null"
:isDiary="selectedDiaryRecipe !== null"
@close="selectedRecipeIndex = null; selectedDiaryRecipe = null"
/> />
</div> </div>
</template> </template>
@@ -188,11 +152,9 @@ const searchQuery = ref('')
const selectedCategory = ref(null) const selectedCategory = ref(null)
const categories = ref([]) const categories = ref([])
const selectedRecipeIndex = ref(null) const selectedRecipeIndex = ref(null)
const selectedDiaryRecipe = ref(null) const showMyRecipes = ref(true)
const showMyRecipes = ref(false) const showFavorites = ref(true)
const showFavorites = ref(false)
const catIdx = ref(0) const catIdx = ref(0)
const sharedCount = ref({ adopted: 0, total: 0 })
onMounted(async () => { onMounted(async () => {
try { try {
@@ -202,16 +164,9 @@ onMounted(async () => {
} }
} catch {} } catch {}
// Load personal diary recipes & contribution stats // Load personal diary recipes
if (auth.isLoggedIn) { if (auth.isLoggedIn) {
await diaryStore.loadDiary() await diaryStore.loadDiary()
try {
const cRes = await api('/api/me/contribution')
if (cRes.ok) {
const data = await cRes.json()
sharedCount.value = { adopted: data.adopted_count || 0, total: data.shared_count || 0 }
}
} catch {}
} }
// Return to a recipe card after QR upload redirect // Return to a recipe card after QR upload redirect
@@ -251,107 +206,21 @@ const filteredRecipes = computed(() => {
if (selectedCategory.value) { if (selectedCategory.value) {
list = list.filter(r => r.tags && r.tags.includes(selectedCategory.value)) list = list.filter(r => r.tags && r.tags.includes(selectedCategory.value))
} }
return list.slice().sort((a, b) => a.name.localeCompare(b.name, 'zh')) return list
}) })
// Synonym groups for broader fuzzy matching // Search results from public recipes
const synonymGroups = [ const fuzzyResults = computed(() => {
['胸', '乳腺', '乳房', '丰胸', '胸部'],
['瘦', '减肥', '减脂', '消脂', '纤体', '塑形', '体重'],
['痘', '痤疮', '粉刺', '暗疮', '长痘', '祛痘'],
['斑', '色斑', '淡斑', '雀斑', '黑色素', '美白', '亮肤'],
['皱', '抗皱', '皱纹', '紧致', '抗衰', '抗老'],
['睡', '眠', '失眠', '助眠', '安眠', '好眠', '入睡'],
['焦虑', '紧张', '压力', '情绪', '放松', '舒缓', '安神', '宁神'],
['头', '头痛', '头疼', '偏头痛', '头晕'],
['咳', '咳嗽', '止咳', '清咽'],
['鼻', '鼻炎', '鼻塞', '过敏性鼻炎', '打喷嚏'],
['感冒', '发烧', '发热', '流感', '风寒', '风热'],
['胃', '消化', '肠胃', '胃痛', '胃胀', '积食', '便秘'],
['肝', '护肝', '养肝', '肝脏', '排毒'],
['肾', '补肾', '养肾', '肾虚'],
['腰', '腰痛', '腰酸', '腰椎'],
['肩', '肩颈', '颈椎', '肩周'],
['关节', '骨骼', '骨质', '风湿', '类风湿'],
['肌肉', '酸痛', '疼痛', '拉伤'],
['月经', '痛经', '经期', '姨妈', '生理期', '调经'],
['子宫', '卵巢', '生殖', '备孕', '怀孕', '孕'],
['前列腺', '男性', '阳'],
['湿', '祛湿', '排湿', '湿气', '化湿'],
['免疫', '免疫力', '抵抗力'],
['脱发', '掉发', '生发', '头发', '发际线', '秃'],
['过敏', '敏感', '荨麻疹', '湿疹', '皮炎'],
['血压', '高血压', '低血压', '血管', '循环'],
['血糖', '糖尿病', '降糖'],
['淋巴', '排毒', '水肿', '浮肿'],
['呼吸', '肺', '支气管', '哮喘', '气管'],
['眼', '眼睛', '视力', '近视', '干眼'],
['耳', '耳鸣', '中耳炎', '耳朵'],
['口', '口腔', '口臭', '牙', '牙龈', '牙疼'],
['皮肤', '护肤', '保湿', '修复', '焕肤'],
['疤', '疤痕', '伤疤', '妊娠纹'],
['心', '心脏', '心悸', '养心'],
['甲状腺', '甲亢', '甲减'],
['高', '长高', '增高', '个子'],
['静脉', '静脉曲张'],
['痔', '痔疮'],
]
function expandQuery(q) {
const terms = [q]
for (const group of synonymGroups) {
if (group.some(t => q.includes(t) || t.includes(q))) {
for (const t of group) {
if (!terms.includes(t)) terms.push(t)
}
}
}
return terms
}
// Search results: exact matches (query in recipe name or tags, NOT oil names to avoid noise like 西班牙牛至)
const exactResults = computed(() => {
if (!searchQuery.value.trim()) return [] if (!searchQuery.value.trim()) return []
const q = searchQuery.value.trim().toLowerCase() const q = searchQuery.value.trim().toLowerCase()
return recipeStore.recipes.filter(r => { return recipeStore.recipes.filter(r => {
const nameMatch = r.name.toLowerCase().includes(q) const nameMatch = r.name.toLowerCase().includes(q)
const oilMatch = r.ingredients.some(ing => ing.oil.toLowerCase().includes(q))
const tagMatch = r.tags && r.tags.some(t => t.toLowerCase().includes(q)) const tagMatch = r.tags && r.tags.some(t => t.toLowerCase().includes(q))
return nameMatch || tagMatch return nameMatch || oilMatch || tagMatch
}).sort((a, b) => a.name.localeCompare(b.name, 'zh'))
}) })
// Similar results: synonym expansion, only match against recipe NAME (not ingredients/tags)
// Filter out single-char expanded terms to avoid overly broad matches
const similarResults = computed(() => {
if (!searchQuery.value.trim()) return []
const q = searchQuery.value.trim()
const exactIds = new Set(exactResults.value.map(r => r._id))
const terms = expandQuery(q).filter(t => t.length >= 2 || t === q)
return recipeStore.recipes.filter(r => {
if (exactIds.has(r._id)) return false
const name = r.name
// Match by expanded synonyms (name only, not ingredients)
if (terms.some(t => name.includes(t))) return true
return false
}).sort((a, b) => a.name.localeCompare(b.name, 'zh')).slice(0, 30)
}) })
const reportedMissing = ref(false)
async function reportMissing() {
try {
await api('/api/symptom-search', {
method: 'POST',
body: JSON.stringify({ query: searchQuery.value.trim(), report_missing: true }),
})
reportedMissing.value = true
ui.showToast('已通知编辑,感谢反馈!')
} catch {
ui.showToast('通知失败')
}
}
// Personal recipes from diary (separate from public recipes) // Personal recipes from diary (separate from public recipes)
const myDiaryRecipes = computed(() => { const myDiaryRecipes = computed(() => {
if (!auth.isLoggedIn) return [] if (!auth.isLoggedIn) return []
@@ -391,24 +260,27 @@ function openDetail(index) {
} }
} }
function getDiaryShareStatus(d) {
const pub = recipeStore.recipes.find(r => r.name === d.name && r._owner_id === auth.user?.id)
if (pub) return 'shared'
return null
}
function diaryAsRecipe(d) {
return {
_id: 'diary-' + d.id,
name: d.name,
note: d.note || '',
tags: d.tags || [],
ingredients: d.ingredients || [],
}
}
function openDiaryDetail(diary) { function openDiaryDetail(diary) {
selectedDiaryRecipe.value = diaryAsRecipe(diary) // Create a temporary recipe-like object from diary and open it
const tmpRecipe = {
_id: null,
_diary_id: diary.id,
name: diary.name,
note: diary.note || '',
tags: diary.tags || [],
ingredients: diary.ingredients || [],
_owner_id: auth.user.id,
}
recipeStore.recipes.push(tmpRecipe)
const tmpIdx = recipeStore.recipes.length - 1
selectedRecipeIndex.value = tmpIdx
// Clean up temp recipe when detail closes
const unwatch = watch(selectedRecipeIndex, (val) => {
if (val === null) {
recipeStore.recipes.splice(tmpIdx, 1)
unwatch()
}
})
} }
async function handleToggleFav(recipe) { async function handleToggleFav(recipe) {
@@ -445,13 +317,12 @@ async function shareDiaryToPublic(diary) {
} }
function onSearch() { function onSearch() {
reportedMissing.value = false // fuzzyResults computed handles the filtering reactively
} }
function clearSearch() { function clearSearch() {
searchQuery.value = '' searchQuery.value = ''
selectedCategory.value = null selectedCategory.value = null
reportedMissing.value = false
} }
// Carousel swipe // Carousel swipe
@@ -664,57 +535,6 @@ function onCarouselTouchEnd(e) {
color: #999; color: #999;
} }
.diary-card-wrap {
position: relative;
}
.share-status {
position: absolute;
top: 8px;
right: 8px;
font-size: 10px;
padding: 2px 8px;
border-radius: 8px;
font-weight: 600;
}
.share-status.shared {
background: #e8f5e9;
color: #2e7d32;
}
.share-status.pending {
background: #fff3e0;
color: #e65100;
}
.share-btn {
position: absolute;
top: 8px;
right: 8px;
background: rgba(255,255,255,0.9);
border: 1px solid #d4cfc7;
border-radius: 8px;
padding: 2px 8px;
font-size: 14px;
cursor: pointer;
}
.share-btn:hover {
background: #e8f5e9;
border-color: #7ec6a4;
}
.contrib-badge {
font-size: 11px;
color: #4a9d7e;
background: #e8f5e9;
padding: 2px 8px;
border-radius: 8px;
font-weight: 500;
margin-left: auto;
}
.section-label { .section-label {
font-size: 14px; font-size: 14px;
font-weight: 600; font-weight: 600;
@@ -742,40 +562,6 @@ function onCarouselTouchEnd(e) {
padding: 24px 0; padding: 24px 0;
} }
.similar-label {
color: #e65100;
background: #fff8e1;
padding: 8px 14px;
border-radius: 10px;
}
.no-match-box {
text-align: center;
padding: 12px 0;
}
.btn-report-missing {
background: linear-gradient(135deg, #ffb74d, #e65100);
color: #fff;
border: none;
border-radius: 10px;
padding: 10px 20px;
font-size: 14px;
cursor: pointer;
font-family: inherit;
margin-top: 8px;
}
.btn-report-missing:hover {
opacity: 0.9;
}
.reported-hint {
color: #4a9d7e;
font-size: 13px;
font-weight: 500;
}
.diary-card { .diary-card {
background: white; background: white;
border-radius: 14px; border-radius: 14px;

View File

@@ -27,8 +27,8 @@
<div class="review-list"> <div class="review-list">
<div v-for="app in businessApps" :key="app._id || app.id" class="review-item"> <div v-for="app in businessApps" :key="app._id || app.id" class="review-item">
<div class="review-info"> <div class="review-info">
<span class="review-name">{{ app.display_name || app.username }}</span> <span class="review-name">{{ app.user_name || app.display_name }}</span>
<span class="review-reason">商户名{{ app.business_name }}</span> <span class="review-reason">{{ app.reason }}</span>
</div> </div>
<div class="review-actions"> <div class="review-actions">
<button class="btn-sm btn-approve" @click="approveBusiness(app)">通过</button> <button class="btn-sm btn-approve" @click="approveBusiness(app)">通过</button>
@@ -38,7 +38,27 @@
</div> </div>
</div> </div>
<!-- User self-registers, admin assigns roles below --> <!-- New User Creation -->
<div class="create-section">
<h4 class="section-title"> 创建新用户</h4>
<div class="create-form">
<input v-model="newUser.username" class="form-input" placeholder="用户名" />
<input v-model="newUser.display_name" class="form-input" placeholder="显示名称" />
<input v-model="newUser.password" class="form-input" type="password" placeholder="密码 (留空自动生成)" />
<select v-model="newUser.role" class="form-select">
<option value="viewer">查看者</option>
<option value="editor">编辑</option>
<option value="senior_editor">高级编辑</option>
<option value="admin">管理员</option>
</select>
<button class="btn-primary" @click="createUser" :disabled="!newUser.username.trim()">创建</button>
</div>
<div v-if="createdLink" class="created-link">
<span>登录链接:</span>
<code>{{ createdLink }}</code>
<button class="btn-sm btn-outline" @click="copyLink(createdLink)">复制</button>
</div>
</div>
<!-- Search & Filter --> <!-- Search & Filter -->
<div class="filter-toolbar"> <div class="filter-toolbar">
@@ -80,12 +100,13 @@
:value="u.role" :value="u.role"
class="role-select" class="role-select"
@change="changeRole(u, $event.target.value)" @change="changeRole(u, $event.target.value)"
:disabled="u.role === 'admin'"
> >
<option value="viewer">查看者</option> <option value="viewer">查看者</option>
<option value="editor">编辑</option> <option value="editor">编辑</option>
<option value="senior_editor">高级编辑</option> <option value="senior_editor">高级编辑</option>
<option value="admin">管理员</option>
</select> </select>
<button class="btn-sm btn-outline" @click="copyUserLink(u)" title="复制登录链接">🔗</button>
<button class="btn-sm btn-delete" @click="removeUser(u)" title="删除用户">🗑</button> <button class="btn-sm btn-delete" @click="removeUser(u)" title="删除用户">🗑</button>
</div> </div>
</div> </div>
@@ -97,11 +118,11 @@
</template> </template>
<script setup> <script setup>
import { ref, computed, onMounted } from 'vue' import { ref, computed, reactive, onMounted } from 'vue'
import { useAuthStore } from '../stores/auth' import { useAuthStore } from '../stores/auth'
import { useUiStore } from '../stores/ui' import { useUiStore } from '../stores/ui'
import { api } from '../composables/useApi' import { api } from '../composables/useApi'
import { showConfirm, showPrompt } from '../composables/useDialog' import { showConfirm } from '../composables/useDialog'
const auth = useAuthStore() const auth = useAuthStore()
const ui = useUiStore() const ui = useUiStore()
@@ -111,6 +132,15 @@ const searchQuery = ref('')
const filterRole = ref('') const filterRole = ref('')
const translations = ref([]) const translations = ref([])
const businessApps = ref([]) const businessApps = ref([])
const createdLink = ref('')
const newUser = reactive({
username: '',
display_name: '',
password: '',
role: 'viewer',
})
const roles = [ const roles = [
{ value: 'admin', label: '管理员' }, { value: 'admin', label: '管理员' },
{ value: 'senior_editor', label: '高级编辑' }, { value: 'senior_editor', label: '高级编辑' },
@@ -176,10 +206,43 @@ async function loadBusinessApps() {
} }
} }
async function createUser() {
if (!newUser.username.trim()) return
try {
const res = await api('/api/users', {
method: 'POST',
body: JSON.stringify({
username: newUser.username.trim(),
display_name: newUser.display_name.trim() || newUser.username.trim(),
password: newUser.password || undefined,
role: newUser.role,
}),
})
if (res.ok) {
const data = await res.json()
if (data.token) {
const baseUrl = window.location.origin
createdLink.value = `${baseUrl}/?token=${data.token}`
}
newUser.username = ''
newUser.display_name = ''
newUser.password = ''
newUser.role = 'viewer'
await loadUsers()
ui.showToast('用户已创建')
} else {
const err = await res.json().catch(() => ({}))
ui.showToast('创建失败: ' + (err.error || err.message || ''))
}
} catch {
ui.showToast('创建失败')
}
}
async function changeRole(user, newRole) { async function changeRole(user, newRole) {
const id = user._id || user.id const id = user._id || user.id
try { try {
const res = await api(`/api/users/${id}`, { const res = await api(`/api/users/${id}/role`, {
method: 'PUT', method: 'PUT',
body: JSON.stringify({ role: newRole }), body: JSON.stringify({ role: newRole }),
}) })
@@ -207,6 +270,30 @@ async function removeUser(user) {
} }
} }
async function copyUserLink(user) {
try {
const id = user._id || user.id
const res = await api(`/api/users/${id}/token`)
if (res.ok) {
const data = await res.json()
const link = `${window.location.origin}/?token=${data.token}`
await navigator.clipboard.writeText(link)
ui.showToast('链接已复制')
}
} catch {
ui.showToast('获取链接失败')
}
}
async function copyLink(link) {
try {
await navigator.clipboard.writeText(link)
ui.showToast('已复制')
} catch {
ui.showToast('复制失败')
}
}
async function approveTranslation(t) { async function approveTranslation(t) {
const id = t._id || t.id const id = t._id || t.id
try { try {
@@ -248,13 +335,8 @@ async function approveBusiness(app) {
async function rejectBusiness(app) { async function rejectBusiness(app) {
const id = app._id || app.id const id = app._id || app.id
const reason = await showPrompt('请输入拒绝原因(选填):')
if (reason === null) return
try { try {
const res = await api(`/api/business-applications/${id}/reject`, { const res = await api(`/api/business-applications/${id}/reject`, { method: 'POST' })
method: 'POST',
body: JSON.stringify({ reason: reason || '' }),
})
if (res.ok) { if (res.ok) {
businessApps.value = businessApps.value.filter(item => (item._id || item.id) !== id) businessApps.value = businessApps.value.filter(item => (item._id || item.id) !== id)
ui.showToast('已拒绝') ui.showToast('已拒绝')