Compare commits
1 Commits
feat/next-
...
fix/volume
| Author | SHA1 | Date | |
|---|---|---|---|
| 1ca9943d50 |
@@ -1,22 +0,0 @@
|
||||
name: Deploy Production
|
||||
on:
|
||||
push:
|
||||
branches: [main]
|
||||
|
||||
jobs:
|
||||
test:
|
||||
runs-on: test
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
- name: Unit tests
|
||||
run: cd frontend && npm ci && npx vitest run
|
||||
- name: Build check
|
||||
run: cd frontend && npm run build
|
||||
|
||||
deploy:
|
||||
needs: test
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
- name: Deploy Production
|
||||
run: python3 scripts/deploy-preview.py deploy-prod
|
||||
@@ -1,50 +0,0 @@
|
||||
name: PR Preview
|
||||
on:
|
||||
pull_request:
|
||||
types: [opened, synchronize, reopened, closed]
|
||||
|
||||
jobs:
|
||||
test:
|
||||
if: github.event.action != 'closed'
|
||||
runs-on: test
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
- name: Unit tests
|
||||
run: cd frontend && npm ci && npx vitest run
|
||||
|
||||
deploy-preview:
|
||||
if: github.event.action != 'closed'
|
||||
needs: test
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
- name: Deploy Preview
|
||||
run: python3 scripts/deploy-preview.py deploy ${{ github.event.pull_request.number }}
|
||||
- name: Comment PR
|
||||
env:
|
||||
GIT_TOKEN: ${{ secrets.GIT_TOKEN }}
|
||||
run: |
|
||||
PR_ID="${{ github.event.pull_request.number }}"
|
||||
curl -sf -X POST \
|
||||
"https://git.euphon.cloud/api/v1/repos/${{ github.repository }}/issues/${PR_ID}/comments" \
|
||||
-H "Authorization: token ${GIT_TOKEN}" \
|
||||
-H "Content-Type: application/json" \
|
||||
-d "{\"body\": \"🚀 **Preview**: https://pr-${PR_ID}.oil.oci.euphon.net\n\nDB is a copy of production.\"}" || true
|
||||
|
||||
teardown-preview:
|
||||
if: github.event.action == 'closed'
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
- name: Teardown
|
||||
run: python3 scripts/deploy-preview.py teardown ${{ github.event.pull_request.number }}
|
||||
- name: Comment PR
|
||||
env:
|
||||
GIT_TOKEN: ${{ secrets.GIT_TOKEN }}
|
||||
run: |
|
||||
PR_ID="${{ github.event.pull_request.number }}"
|
||||
curl -sf -X POST \
|
||||
"https://git.euphon.cloud/api/v1/repos/${{ github.repository }}/issues/${PR_ID}/comments" \
|
||||
-H "Authorization: token ${GIT_TOKEN}" \
|
||||
-H "Content-Type: application/json" \
|
||||
-d "{\"body\": \"🗑️ Preview torn down.\"}" || true
|
||||
@@ -1,67 +0,0 @@
|
||||
name: Test
|
||||
on: [push]
|
||||
|
||||
jobs:
|
||||
unit-test:
|
||||
runs-on: test
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
- name: Install & Run unit tests
|
||||
run: cd frontend && npm ci && npx vitest run --reporter=verbose
|
||||
|
||||
e2e-test:
|
||||
runs-on: test
|
||||
needs: unit-test
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
|
||||
- name: Install frontend deps
|
||||
run: cd frontend && npm ci
|
||||
|
||||
- name: Install backend deps
|
||||
run: python3 -m venv /tmp/ci-venv && /tmp/ci-venv/bin/pip install -q -r backend/requirements.txt
|
||||
|
||||
- name: E2E tests
|
||||
run: |
|
||||
# Start backend
|
||||
DB_PATH=/tmp/ci_oil_test.db FRONTEND_DIR=/dev/null \
|
||||
/tmp/ci-venv/bin/uvicorn backend.main:app --port 8000 &
|
||||
|
||||
# Start frontend (in subshell to not change cwd)
|
||||
(cd frontend && npx vite --port 5173) &
|
||||
|
||||
# Wait for both servers
|
||||
for i in $(seq 1 30); do
|
||||
if curl -sf http://localhost:8000/api/version > /dev/null 2>&1 && \
|
||||
curl -sf http://localhost:5173/ > /dev/null 2>&1; then
|
||||
echo "Both servers ready"
|
||||
break
|
||||
fi
|
||||
sleep 1
|
||||
done
|
||||
|
||||
# Run core cypress specs (proven stable)
|
||||
cd frontend
|
||||
npx cypress run --spec "\
|
||||
cypress/e2e/recipe-detail.cy.js,\
|
||||
cypress/e2e/oil-reference.cy.js,\
|
||||
cypress/e2e/oil-data-integrity.cy.js,\
|
||||
cypress/e2e/recipe-cost-parity.cy.js,\
|
||||
cypress/e2e/category-modules.cy.js,\
|
||||
cypress/e2e/notification-flow.cy.js,\
|
||||
cypress/e2e/registration-flow.cy.js\
|
||||
" --config video=false
|
||||
EXIT_CODE=$?
|
||||
|
||||
# Cleanup
|
||||
pkill -f "uvicorn backend" || true
|
||||
pkill -f "node.*vite" || true
|
||||
rm -f /tmp/ci_oil_test.db
|
||||
exit $EXIT_CODE
|
||||
|
||||
build-check:
|
||||
runs-on: test
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
- name: Build frontend
|
||||
run: cd frontend && npm ci && npm run build
|
||||
1
.gitignore
vendored
1
.gitignore
vendored
@@ -8,4 +8,3 @@ backups/
|
||||
# Frontend
|
||||
frontend/node_modules/
|
||||
frontend/dist/
|
||||
frontend/.vite/
|
||||
|
||||
@@ -163,8 +163,6 @@ def init_db():
|
||||
c.execute("ALTER TABLE users ADD COLUMN brand_bg TEXT")
|
||||
if "brand_align" not in user_cols:
|
||||
c.execute("ALTER TABLE users ADD COLUMN brand_align TEXT DEFAULT 'center'")
|
||||
if "role_changed_at" not in user_cols:
|
||||
c.execute("ALTER TABLE users ADD COLUMN role_changed_at TEXT")
|
||||
|
||||
# Migration: add tags to user_diary
|
||||
diary_cols = [row[1] for row in c.execute("PRAGMA table_info(user_diary)").fetchall()]
|
||||
@@ -223,8 +221,6 @@ def init_db():
|
||||
c.execute("ALTER TABLE oils ADD COLUMN retail_price REAL")
|
||||
if "is_active" not in oil_cols:
|
||||
c.execute("ALTER TABLE oils ADD COLUMN is_active INTEGER DEFAULT 1")
|
||||
if "en_name" not in oil_cols:
|
||||
c.execute("ALTER TABLE oils ADD COLUMN en_name TEXT DEFAULT ''")
|
||||
|
||||
# Migration: add new columns to category_modules if missing
|
||||
cat_cols = [row[1] for row in c.execute("PRAGMA table_info(category_modules)").fetchall()]
|
||||
@@ -242,8 +238,6 @@ def init_db():
|
||||
c.execute("ALTER TABLE recipes ADD COLUMN owner_id INTEGER")
|
||||
if "updated_by" not in cols:
|
||||
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 ''")
|
||||
|
||||
# Seed admin user if no users exist
|
||||
count = c.execute("SELECT COUNT(*) FROM users").fetchone()[0]
|
||||
|
||||
391
backend/main.py
391
backend/main.py
@@ -6,35 +6,9 @@ import json
|
||||
import os
|
||||
|
||||
from backend.database import get_db, init_db, seed_defaults, log_audit
|
||||
import hashlib
|
||||
import secrets as _secrets
|
||||
|
||||
app = FastAPI(title="Essential Oil Formula Calculator API")
|
||||
|
||||
|
||||
# ── Password hashing (PBKDF2-SHA256, stdlib) ─────────
|
||||
def hash_password(password: str) -> str:
|
||||
salt = _secrets.token_hex(16)
|
||||
h = hashlib.pbkdf2_hmac("sha256", password.encode(), salt.encode(), 200_000)
|
||||
return f"{salt}${h.hex()}"
|
||||
|
||||
|
||||
def verify_password(password: str, stored: str) -> bool:
|
||||
if not stored:
|
||||
return False
|
||||
if "$" not in stored:
|
||||
# Legacy plaintext — compare directly
|
||||
return password == stored
|
||||
salt, h = stored.split("$", 1)
|
||||
return hashlib.pbkdf2_hmac("sha256", password.encode(), salt.encode(), 200_000).hex() == h
|
||||
|
||||
|
||||
def _upgrade_password_if_needed(conn, user_id: int, password: str, stored: str):
|
||||
"""If stored password is legacy plaintext, upgrade to hashed."""
|
||||
if stored and "$" not in stored:
|
||||
conn.execute("UPDATE users SET password = ? WHERE id = ?", (hash_password(password), user_id))
|
||||
conn.commit()
|
||||
|
||||
# Periodic WAL checkpoint to ensure data is flushed to main DB file
|
||||
import threading, time as _time
|
||||
def _wal_checkpoint_loop():
|
||||
@@ -79,8 +53,6 @@ class OilIn(BaseModel):
|
||||
bottle_price: float
|
||||
drop_count: int
|
||||
retail_price: Optional[float] = None
|
||||
en_name: Optional[str] = None
|
||||
is_active: Optional[int] = None
|
||||
|
||||
|
||||
class IngredientIn(BaseModel):
|
||||
@@ -97,7 +69,6 @@ class RecipeIn(BaseModel):
|
||||
|
||||
class RecipeUpdate(BaseModel):
|
||||
name: Optional[str] = None
|
||||
en_name: Optional[str] = None
|
||||
note: Optional[str] = None
|
||||
ingredients: Optional[list[IngredientIn]] = None
|
||||
tags: Optional[list[str]] = None
|
||||
@@ -311,7 +282,7 @@ def symptom_search(body: dict, user=Depends(get_current_user)):
|
||||
conn = get_db()
|
||||
# Search in recipe names
|
||||
rows = conn.execute(
|
||||
"SELECT id, name, note, owner_id, version, en_name FROM recipes ORDER BY id"
|
||||
"SELECT id, name, note, owner_id, version FROM recipes ORDER BY id"
|
||||
).fetchall()
|
||||
exact = []
|
||||
related = []
|
||||
@@ -324,7 +295,7 @@ def symptom_search(body: dict, user=Depends(get_current_user)):
|
||||
# If user reports no match, notify editors
|
||||
if body.get("report_missing"):
|
||||
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(
|
||||
"INSERT INTO notifications (target_role, title, body) VALUES (?, ?, ?)",
|
||||
(role, "🔍 用户需求：" + query,
|
||||
@@ -341,6 +312,7 @@ def symptom_search(body: dict, user=Depends(get_current_user)):
|
||||
# ── Register ────────────────────────────────────────────
|
||||
@app.post("/api/register", status_code=201)
|
||||
def register(body: dict):
|
||||
import secrets
|
||||
username = body.get("username", "").strip()
|
||||
password = body.get("password", "").strip()
|
||||
display_name = body.get("display_name", "").strip()
|
||||
@@ -348,12 +320,12 @@ def register(body: dict):
|
||||
raise HTTPException(400, "用户名至少2个字符")
|
||||
if not password or len(password) < 4:
|
||||
raise HTTPException(400, "密码至少4位")
|
||||
token = _secrets.token_hex(24)
|
||||
token = secrets.token_hex(24)
|
||||
conn = get_db()
|
||||
try:
|
||||
conn.execute(
|
||||
"INSERT INTO users (username, token, role, display_name, password) VALUES (?, ?, ?, ?, ?)",
|
||||
(username, token, "viewer", display_name or username, hash_password(password))
|
||||
(username, token, "viewer", display_name or username, password)
|
||||
)
|
||||
conn.commit()
|
||||
except Exception:
|
||||
@@ -371,19 +343,14 @@ def login(body: dict):
|
||||
if not username or not password:
|
||||
raise HTTPException(400, "请输入用户名和密码")
|
||||
conn = get_db()
|
||||
user = conn.execute("SELECT id, token, password, display_name, role FROM users WHERE username = ?", (username,)).fetchone()
|
||||
user = conn.execute("SELECT token, password, display_name, role FROM users WHERE username = ?", (username,)).fetchone()
|
||||
conn.close()
|
||||
if not user:
|
||||
conn.close()
|
||||
raise HTTPException(401, "用户名不存在")
|
||||
if not user["password"]:
|
||||
conn.close()
|
||||
raise HTTPException(401, "该账号未设置密码，请使用链接登录后设置密码")
|
||||
if not verify_password(password, user["password"]):
|
||||
conn.close()
|
||||
if user["password"] != password:
|
||||
raise HTTPException(401, "密码错误")
|
||||
# Auto-upgrade legacy plaintext password to hashed
|
||||
_upgrade_password_if_needed(conn, user["id"], password, user["password"])
|
||||
conn.close()
|
||||
return {"token": user["token"], "display_name": user["display_name"], "role": user["role"]}
|
||||
|
||||
|
||||
@@ -418,11 +385,11 @@ def update_me(body: dict, user=Depends(get_current_user)):
|
||||
raise HTTPException(400, "新密码至少4位")
|
||||
old_pw = body.get("old_password", "").strip()
|
||||
current_pw = user.get("password") or ""
|
||||
if current_pw and not verify_password(old_pw, current_pw):
|
||||
if current_pw and old_pw != current_pw:
|
||||
conn.close()
|
||||
raise HTTPException(400, "当前密码不正确")
|
||||
if pw:
|
||||
conn.execute("UPDATE users SET password = ? WHERE id = ?", (hash_password(pw), user["id"]))
|
||||
conn.execute("UPDATE users SET password = ? WHERE id = ?", (pw, user["id"]))
|
||||
conn.commit()
|
||||
conn.close()
|
||||
return {"ok": True}
|
||||
@@ -437,7 +404,7 @@ def set_password(body: dict, user=Depends(get_current_user)):
|
||||
if not pw or len(pw) < 4:
|
||||
raise HTTPException(400, "密码至少4位")
|
||||
conn = get_db()
|
||||
conn.execute("UPDATE users SET password = ? WHERE id = ?", (hash_password(pw), user["id"]))
|
||||
conn.execute("UPDATE users SET password = ? WHERE id = ?", (pw, user["id"]))
|
||||
conn.commit()
|
||||
conn.close()
|
||||
return {"ok": True}
|
||||
@@ -477,8 +444,6 @@ def business_apply(body: dict, user=Depends(get_current_user)):
|
||||
"INSERT INTO notifications (target_role, title, body) VALUES (?, ?, ?)",
|
||||
("admin", "🏢 商业认证申请", f"{who} 申请商业用户认证，商户名：{business_name}")
|
||||
)
|
||||
log_audit(conn, user["id"], "business_apply", "user", user["id"], who,
|
||||
json.dumps({"business_name": business_name}))
|
||||
conn.commit()
|
||||
conn.close()
|
||||
return {"ok": True}
|
||||
@@ -503,7 +468,7 @@ def get_my_business_application(user=Depends(get_current_user)):
|
||||
def list_business_applications(user=Depends(require_role("admin"))):
|
||||
conn = get_db()
|
||||
rows = conn.execute(
|
||||
"SELECT a.id, a.user_id, a.business_name, a.document, a.status, a.reject_reason, a.created_at, "
|
||||
"SELECT a.id, a.user_id, a.business_name, a.document, a.status, a.created_at, "
|
||||
"u.display_name, u.username FROM business_applications a "
|
||||
"LEFT JOIN users u ON a.user_id = u.id ORDER BY a.id DESC"
|
||||
).fetchall()
|
||||
@@ -520,15 +485,13 @@ def approve_business(app_id: int, user=Depends(require_role("admin"))):
|
||||
raise HTTPException(404, "申请不存在")
|
||||
conn.execute("UPDATE business_applications SET status = 'approved', reviewed_at = datetime('now') WHERE id = ?", (app_id,))
|
||||
conn.execute("UPDATE users SET business_verified = 1 WHERE id = ?", (app["user_id"],))
|
||||
target = conn.execute("SELECT role, display_name, username FROM users WHERE id = ?", (app["user_id"],)).fetchone()
|
||||
target_name = (target["display_name"] or target["username"]) if target else "unknown"
|
||||
# Notify user
|
||||
target = conn.execute("SELECT role FROM users WHERE id = ?", (app["user_id"],)).fetchone()
|
||||
if target:
|
||||
conn.execute(
|
||||
"INSERT INTO notifications (target_role, title, body, target_user_id) VALUES (?, ?, ?, ?)",
|
||||
(target["role"], "🎉 商业认证通过", "恭喜！你的商业用户认证已通过，现在可以使用项目核算等商业功能。", app["user_id"])
|
||||
)
|
||||
log_audit(conn, user["id"], "approve_business", "user", app["user_id"], target_name,
|
||||
json.dumps({"business_name": app["business_name"]}))
|
||||
conn.commit()
|
||||
conn.close()
|
||||
return {"ok": True}
|
||||
@@ -543,8 +506,7 @@ def reject_business(app_id: int, body: dict = None, user=Depends(require_role("a
|
||||
raise HTTPException(404, "申请不存在")
|
||||
reason = (body or {}).get("reason", "").strip()
|
||||
conn.execute("UPDATE business_applications SET status = 'rejected', reviewed_at = datetime('now'), reject_reason = ? WHERE id = ?", (reason, app_id))
|
||||
target = conn.execute("SELECT role, display_name, username FROM users WHERE id = ?", (app["user_id"],)).fetchone()
|
||||
target_name = (target["display_name"] or target["username"]) if target else "unknown"
|
||||
target = conn.execute("SELECT role FROM users WHERE id = ?", (app["user_id"],)).fetchone()
|
||||
if target:
|
||||
msg = "你的商业用户认证申请未通过。"
|
||||
if reason:
|
||||
@@ -554,8 +516,6 @@ def reject_business(app_id: int, body: dict = None, user=Depends(require_role("a
|
||||
"INSERT INTO notifications (target_role, title, body, target_user_id) VALUES (?, ?, ?, ?)",
|
||||
(target["role"], "商业认证未通过", msg, app["user_id"])
|
||||
)
|
||||
log_audit(conn, user["id"], "reject_business", "user", app["user_id"], target_name,
|
||||
json.dumps({"reason": reason}))
|
||||
conn.commit()
|
||||
conn.close()
|
||||
return {"ok": True}
|
||||
@@ -621,23 +581,6 @@ def reject_translation(sid: int, user=Depends(require_role("admin"))):
|
||||
return {"ok": True}
|
||||
|
||||
|
||||
@app.post("/api/business-grant/{user_id}")
|
||||
def grant_business(user_id: int, user=Depends(require_role("admin"))):
|
||||
conn = get_db()
|
||||
conn.execute("UPDATE users SET business_verified = 1 WHERE id = ?", (user_id,))
|
||||
target = conn.execute("SELECT role, display_name, username FROM users WHERE id = ?", (user_id,)).fetchone()
|
||||
target_name = (target["display_name"] or target["username"]) if target else "unknown"
|
||||
if target:
|
||||
conn.execute(
|
||||
"INSERT INTO notifications (target_role, title, body, target_user_id) VALUES (?, ?, ?, ?)",
|
||||
(target["role"], "🎉 商业认证已开通", "管理员已为你开通商业用户认证，现在可以使用商业核算等功能。", user_id)
|
||||
)
|
||||
log_audit(conn, user["id"], "grant_business", "user", user_id, target_name, None)
|
||||
conn.commit()
|
||||
conn.close()
|
||||
return {"ok": True}
|
||||
|
||||
|
||||
@app.post("/api/business-revoke/{user_id}")
|
||||
def revoke_business(user_id: int, body: dict = None, user=Depends(require_role("admin"))):
|
||||
conn = get_db()
|
||||
@@ -653,9 +596,6 @@ def revoke_business(user_id: int, body: dict = None, user=Depends(require_role("
|
||||
"INSERT INTO notifications (target_role, title, body, target_user_id) VALUES (?, ?, ?, ?)",
|
||||
(target["role"], "商业资格已取消", msg, user_id)
|
||||
)
|
||||
target_name = (target["display_name"] or target["username"]) if target else "unknown"
|
||||
log_audit(conn, user["id"], "revoke_business", "user", user_id, target_name,
|
||||
json.dumps({"reason": reason}) if reason else None)
|
||||
conn.commit()
|
||||
conn.close()
|
||||
return {"ok": True}
|
||||
@@ -678,7 +618,7 @@ def impersonate(body: dict, user=Depends(require_role("admin"))):
|
||||
@app.get("/api/oils")
|
||||
def list_oils():
|
||||
conn = get_db()
|
||||
rows = conn.execute("SELECT name, bottle_price, drop_count, retail_price, is_active, en_name FROM oils ORDER BY name").fetchall()
|
||||
rows = conn.execute("SELECT name, bottle_price, drop_count, retail_price, is_active FROM oils ORDER BY name").fetchall()
|
||||
conn.close()
|
||||
return [dict(r) for r in rows]
|
||||
|
||||
@@ -687,11 +627,9 @@ def list_oils():
|
||||
def upsert_oil(oil: OilIn, user=Depends(require_role("admin", "senior_editor"))):
|
||||
conn = get_db()
|
||||
conn.execute(
|
||||
"INSERT INTO oils (name, bottle_price, drop_count, retail_price, en_name, is_active) VALUES (?, ?, ?, ?, ?, ?) "
|
||||
"ON CONFLICT(name) DO UPDATE SET bottle_price=excluded.bottle_price, drop_count=excluded.drop_count, "
|
||||
"retail_price=excluded.retail_price, en_name=COALESCE(excluded.en_name, oils.en_name), "
|
||||
"is_active=COALESCE(excluded.is_active, oils.is_active)",
|
||||
(oil.name, oil.bottle_price, oil.drop_count, oil.retail_price, oil.en_name, oil.is_active),
|
||||
"INSERT INTO oils (name, bottle_price, drop_count, retail_price) VALUES (?, ?, ?, ?) "
|
||||
"ON CONFLICT(name) DO UPDATE SET bottle_price=excluded.bottle_price, drop_count=excluded.drop_count, retail_price=excluded.retail_price",
|
||||
(oil.name, oil.bottle_price, oil.drop_count, oil.retail_price),
|
||||
)
|
||||
log_audit(conn, user["id"], "upsert_oil", "oil", oil.name, oil.name,
|
||||
json.dumps({"bottle_price": oil.bottle_price, "drop_count": oil.drop_count}))
|
||||
@@ -728,7 +666,6 @@ def _recipe_to_dict(conn, row):
|
||||
return {
|
||||
"id": rid,
|
||||
"name": row["name"],
|
||||
"en_name": row["en_name"] if "en_name" in row.keys() else "",
|
||||
"note": row["note"],
|
||||
"owner_id": row["owner_id"],
|
||||
"owner_name": (owner["display_name"] or owner["username"]) if owner else None,
|
||||
@@ -743,19 +680,19 @@ def list_recipes(user=Depends(get_current_user)):
|
||||
conn = get_db()
|
||||
# Admin sees all; others see admin-owned (adopted) + their own
|
||||
if user["role"] == "admin":
|
||||
rows = conn.execute("SELECT id, name, note, owner_id, version, en_name FROM recipes ORDER BY id").fetchall()
|
||||
rows = conn.execute("SELECT id, name, note, owner_id, version FROM recipes ORDER BY id").fetchall()
|
||||
else:
|
||||
admin = conn.execute("SELECT id FROM users WHERE role = 'admin' LIMIT 1").fetchone()
|
||||
admin_id = admin["id"] if admin else 1
|
||||
user_id = user.get("id")
|
||||
if user_id:
|
||||
rows = conn.execute(
|
||||
"SELECT id, name, note, owner_id, version, en_name 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)
|
||||
).fetchall()
|
||||
else:
|
||||
rows = conn.execute(
|
||||
"SELECT id, name, note, owner_id, version, en_name 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,)
|
||||
).fetchall()
|
||||
result = [_recipe_to_dict(conn, r) for r in rows]
|
||||
@@ -766,7 +703,7 @@ def list_recipes(user=Depends(get_current_user)):
|
||||
@app.get("/api/recipes/{recipe_id}")
|
||||
def get_recipe(recipe_id: int):
|
||||
conn = get_db()
|
||||
row = conn.execute("SELECT id, name, note, owner_id, version, en_name 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:
|
||||
conn.close()
|
||||
raise HTTPException(404, "Recipe not found")
|
||||
@@ -776,19 +713,11 @@ def get_recipe(recipe_id: int):
|
||||
|
||||
|
||||
@app.post("/api/recipes", status_code=201)
|
||||
def create_recipe(recipe: RecipeIn, user=Depends(get_current_user)):
|
||||
if not user.get("id"):
|
||||
raise HTTPException(401, "请先登录")
|
||||
def create_recipe(recipe: RecipeIn, user=Depends(require_role("admin", "senior_editor", "editor"))):
|
||||
conn = get_db()
|
||||
c = conn.cursor()
|
||||
# Senior editors adding directly to public library: set owner to admin so everyone can see
|
||||
owner_id = user["id"]
|
||||
if user["role"] in ("senior_editor",):
|
||||
admin = c.execute("SELECT id FROM users WHERE role = 'admin' LIMIT 1").fetchone()
|
||||
if admin:
|
||||
owner_id = admin["id"]
|
||||
c.execute("INSERT INTO recipes (name, note, owner_id) VALUES (?, ?, ?)",
|
||||
(recipe.name, recipe.note, owner_id))
|
||||
(recipe.name, recipe.note, user["id"]))
|
||||
rid = c.lastrowid
|
||||
for ing in recipe.ingredients:
|
||||
c.execute(
|
||||
@@ -799,20 +728,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 recipe_tags (recipe_id, tag_name) VALUES (?, ?)", (rid, tag))
|
||||
log_audit(conn, user["id"], "create_recipe", "recipe", rid, recipe.name)
|
||||
who = user.get("display_name") or user["username"]
|
||||
if user["role"] == "senior_editor":
|
||||
# Senior editor adds directly — just inform admin
|
||||
conn.execute(
|
||||
"INSERT INTO notifications (target_role, title, body) VALUES (?, ?, ?)",
|
||||
("admin", "📋 新配方已添加",
|
||||
f"{who} 将配方「{recipe.name}」添加到了公共配方库。\n[recipe_id:{rid}]")
|
||||
)
|
||||
elif user["role"] not in ("admin",):
|
||||
# Other users need review
|
||||
# Notify admin when non-admin creates a recipe
|
||||
if user["role"] != "admin":
|
||||
who = user.get("display_name") or user["username"]
|
||||
conn.execute(
|
||||
"INSERT INTO notifications (target_role, title, body) VALUES (?, ?, ?)",
|
||||
("admin", "📝 新配方待审核",
|
||||
f"{who} 共享了配方「{recipe.name}」，请到管理配方查看。\n[recipe_id:{rid}]")
|
||||
f"{who} 新增了配方「{recipe.name}」，请到管理配方查看并采纳。")
|
||||
)
|
||||
conn.commit()
|
||||
conn.close()
|
||||
@@ -820,19 +742,19 @@ def create_recipe(recipe: RecipeIn, user=Depends(get_current_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()
|
||||
if not row:
|
||||
raise HTTPException(404, "Recipe not found")
|
||||
if user["role"] in ("admin", "senior_editor", "editor"):
|
||||
if user["role"] in ("admin", "senior_editor"):
|
||||
return row
|
||||
raise HTTPException(403, "权限不足")
|
||||
if user["role"] == "editor" and row["owner_id"] == user["id"]:
|
||||
return row
|
||||
raise HTTPException(403, "只能修改自己创建的配方")
|
||||
|
||||
|
||||
@app.put("/api/recipes/{recipe_id}")
|
||||
def update_recipe(recipe_id: int, update: RecipeUpdate, user=Depends(get_current_user)):
|
||||
if not user.get("id"):
|
||||
raise HTTPException(401, "请先登录")
|
||||
def update_recipe(recipe_id: int, update: RecipeUpdate, user=Depends(require_role("admin", "senior_editor", "editor"))):
|
||||
conn = get_db()
|
||||
c = conn.cursor()
|
||||
_check_recipe_permission(conn, recipe_id, user)
|
||||
@@ -848,8 +770,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))
|
||||
if update.note is not None:
|
||||
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.ingredients is not None:
|
||||
c.execute("DELETE FROM recipe_ingredients WHERE recipe_id = ?", (recipe_id,))
|
||||
for ing in update.ingredients:
|
||||
@@ -873,13 +793,11 @@ def update_recipe(recipe_id: int, update: RecipeUpdate, user=Depends(get_current
|
||||
|
||||
|
||||
@app.delete("/api/recipes/{recipe_id}")
|
||||
def delete_recipe(recipe_id: int, user=Depends(get_current_user)):
|
||||
if not user.get("id"):
|
||||
raise HTTPException(401, "请先登录")
|
||||
def delete_recipe(recipe_id: int, user=Depends(require_role("admin", "senior_editor", "editor"))):
|
||||
conn = get_db()
|
||||
row = _check_recipe_permission(conn, recipe_id, user)
|
||||
# Save full snapshot for undo
|
||||
full = conn.execute("SELECT id, name, note, owner_id, version, en_name 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)
|
||||
log_audit(conn, user["id"], "delete_recipe", "recipe", recipe_id, row["name"],
|
||||
json.dumps(snapshot, ensure_ascii=False))
|
||||
@@ -900,95 +818,11 @@ def adopt_recipe(recipe_id: int, user=Depends(require_role("admin"))):
|
||||
if row["owner_id"] == user["id"]:
|
||||
conn.close()
|
||||
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"
|
||||
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"],
|
||||
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", "senior_editor"))):
|
||||
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,))
|
||||
from_name = (old_owner["display_name"] or old_owner["username"]) if old_owner else "unknown"
|
||||
log_audit(conn, user["id"], "reject_recipe", "recipe", recipe_id, row["name"],
|
||||
json.dumps({"reason": reason, "from_user": from_name}))
|
||||
conn.commit()
|
||||
conn.close()
|
||||
return {"ok": True}
|
||||
|
||||
|
||||
@app.post("/api/recipes/{recipe_id}/recommend")
|
||||
def recommend_recipe(recipe_id: int, body: dict = None, user=Depends(get_current_user)):
|
||||
"""Senior editor recommends a recipe for admin approval."""
|
||||
if user["role"] not in ("senior_editor", "admin"):
|
||||
raise HTTPException(403, "权限不足")
|
||||
conn = get_db()
|
||||
recipe = conn.execute("SELECT name, owner_id FROM recipes WHERE id = ?", (recipe_id,)).fetchone()
|
||||
if not recipe:
|
||||
conn.close()
|
||||
raise HTTPException(404, "配方不存在")
|
||||
who = user.get("display_name") or user.get("username")
|
||||
conn.execute(
|
||||
"INSERT INTO notifications (target_role, title, body) VALUES (?, ?, ?)",
|
||||
("admin", "👍 配方推荐通过",
|
||||
f"{who} 审核了配方「{recipe['name']}」并推荐通过，请最终确认。\n[recipe_id:{recipe_id}]")
|
||||
)
|
||||
conn.commit()
|
||||
conn.close()
|
||||
return {"ok": True}
|
||||
|
||||
|
||||
@app.post("/api/recipes/{recipe_id}/assign-review")
|
||||
def assign_recipe_review(recipe_id: int, body: dict, user=Depends(require_role("admin"))):
|
||||
reviewer_id = body.get("user_id")
|
||||
if not reviewer_id:
|
||||
raise HTTPException(400, "请选择审核人")
|
||||
conn = get_db()
|
||||
recipe = conn.execute("SELECT name FROM recipes WHERE id = ?", (recipe_id,)).fetchone()
|
||||
if not recipe:
|
||||
conn.close()
|
||||
raise HTTPException(404, "配方不存在")
|
||||
reviewer = conn.execute("SELECT role, display_name, username FROM users WHERE id = ?", (reviewer_id,)).fetchone()
|
||||
if not reviewer:
|
||||
conn.close()
|
||||
raise HTTPException(404, "用户不存在")
|
||||
conn.execute(
|
||||
"INSERT INTO notifications (target_role, title, body, target_user_id) VALUES (?, ?, ?, ?)",
|
||||
(reviewer["role"], "📋 请审核配方",
|
||||
f"管理员指派你审核配方「{recipe['name']}」，请到管理配方页面查看并反馈意见。\n[recipe_id:{recipe_id}]",
|
||||
reviewer_id)
|
||||
)
|
||||
conn.commit()
|
||||
conn.close()
|
||||
return {"ok": True}
|
||||
@@ -1056,7 +890,8 @@ def list_users(user=Depends(require_role("admin"))):
|
||||
|
||||
@app.post("/api/users", status_code=201)
|
||||
def create_user(body: UserIn, user=Depends(require_role("admin"))):
|
||||
token = _secrets.token_hex(24)
|
||||
import secrets
|
||||
token = secrets.token_hex(24)
|
||||
conn = get_db()
|
||||
try:
|
||||
conn.execute(
|
||||
@@ -1094,25 +929,12 @@ def delete_user(user_id: int, user=Depends(require_role("admin"))):
|
||||
@app.put("/api/users/{user_id}")
|
||||
def update_user(user_id: int, body: UserUpdate, user=Depends(require_role("admin"))):
|
||||
conn = get_db()
|
||||
target = conn.execute("SELECT role, display_name, username FROM users WHERE id = ?", (user_id,)).fetchone()
|
||||
old_role = target["role"] if target else "unknown"
|
||||
target_name = (target["display_name"] or target["username"]) if target else "unknown"
|
||||
if body.role is not None:
|
||||
if body.role == "admin":
|
||||
conn.close()
|
||||
raise HTTPException(403, "不能将用户设为管理员")
|
||||
conn.execute("UPDATE users SET role = ?, role_changed_at = datetime('now') 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:
|
||||
conn.execute("UPDATE users SET display_name = ? WHERE id = ?", (body.display_name, user_id))
|
||||
role_labels = {"admin": "管理员", "senior_editor": "高级编辑", "editor": "编辑", "viewer": "查看者"}
|
||||
detail = {}
|
||||
if body.role is not None and body.role != old_role:
|
||||
detail["from_role"] = role_labels.get(old_role, old_role)
|
||||
detail["to_role"] = role_labels.get(body.role, body.role)
|
||||
if body.display_name is not None:
|
||||
detail["display_name"] = body.display_name
|
||||
log_audit(conn, user["id"], "update_user", "user", user_id, target_name,
|
||||
json.dumps(detail, ensure_ascii=False))
|
||||
log_audit(conn, user["id"], "update_user", "user", user_id, None,
|
||||
json.dumps({"role": body.role, "display_name": body.display_name}))
|
||||
conn.commit()
|
||||
conn.close()
|
||||
return {"ok": True}
|
||||
@@ -1317,15 +1139,14 @@ def create_diary(body: dict, user=Depends(get_current_user)):
|
||||
name = body.get("name", "").strip()
|
||||
ingredients = body.get("ingredients", [])
|
||||
note = body.get("note", "")
|
||||
tags = body.get("tags", [])
|
||||
source_id = body.get("source_recipe_id")
|
||||
if not name:
|
||||
raise HTTPException(400, "请输入配方名称")
|
||||
conn = get_db()
|
||||
c = conn.cursor()
|
||||
c.execute(
|
||||
"INSERT INTO user_diary (user_id, source_recipe_id, name, ingredients, note, tags) VALUES (?, ?, ?, ?, ?, ?)",
|
||||
(user["id"], source_id, name, json.dumps(ingredients, ensure_ascii=False), note, json.dumps(tags, ensure_ascii=False))
|
||||
"INSERT INTO user_diary (user_id, source_recipe_id, name, ingredients, note) VALUES (?, ?, ?, ?, ?)",
|
||||
(user["id"], source_id, name, json.dumps(ingredients, ensure_ascii=False), note)
|
||||
)
|
||||
conn.commit()
|
||||
did = c.lastrowid
|
||||
@@ -1480,7 +1301,7 @@ def recipes_by_inventory(user=Depends(get_current_user)):
|
||||
if not inv:
|
||||
conn.close()
|
||||
return []
|
||||
rows = conn.execute("SELECT id, name, note, owner_id, version, en_name FROM recipes ORDER BY id").fetchall()
|
||||
rows = conn.execute("SELECT id, name, note, owner_id, version FROM recipes ORDER BY id").fetchall()
|
||||
result = []
|
||||
for r in rows:
|
||||
recipe = _recipe_to_dict(conn, r)
|
||||
@@ -1533,75 +1354,17 @@ def get_unmatched_searches(days: int = 7, user=Depends(require_role("admin", "se
|
||||
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, "adopted_names": [], "pending_names": []}
|
||||
conn = get_db()
|
||||
display = user.get("display_name") or user.get("username")
|
||||
# adopted: unique recipe names adopted from this user
|
||||
adopted_rows = conn.execute(
|
||||
"SELECT DISTINCT target_name FROM audit_log WHERE action = 'adopt_recipe' AND detail LIKE ?",
|
||||
(f'%"from_user": "{display}"%',)
|
||||
).fetchall()
|
||||
adopted_names = list(set(r["target_name"] for r in adopted_rows if r["target_name"]))
|
||||
# pending: recipes still owned by user in public library
|
||||
pending_rows = conn.execute(
|
||||
"SELECT name FROM recipes WHERE owner_id = ?", (user["id"],)
|
||||
).fetchall()
|
||||
pending_names = [r["name"] for r in pending_rows]
|
||||
# rejected: unique recipe names rejected (not already adopted or pending)
|
||||
rejected_rows = conn.execute(
|
||||
"SELECT DISTINCT target_name FROM audit_log WHERE action = 'reject_recipe' AND detail LIKE ?",
|
||||
(f'%"from_user": "{display}"%',)
|
||||
).fetchall()
|
||||
rejected_names = set(r["target_name"] for r in rejected_rows if r["target_name"])
|
||||
# Unique names across all: same recipe rejected then re-submitted counts as 1
|
||||
all_names = set(adopted_names) | set(pending_names) | rejected_names
|
||||
conn.close()
|
||||
return {
|
||||
"adopted_count": len(adopted_names),
|
||||
"shared_count": len(all_names),
|
||||
"adopted_names": adopted_names,
|
||||
"pending_names": pending_names,
|
||||
}
|
||||
|
||||
|
||||
# ── Notifications ──────────────────────────────────────
|
||||
@app.get("/api/notifications")
|
||||
def get_notifications(user=Depends(get_current_user)):
|
||||
if not user["id"]:
|
||||
return []
|
||||
conn = get_db()
|
||||
# Only show notifications after user registration or last role change (whichever is later)
|
||||
user_row = conn.execute("SELECT created_at, role_changed_at FROM users WHERE id = ?", (user["id"],)).fetchone()
|
||||
cutoff = "2000-01-01"
|
||||
if user_row:
|
||||
cutoff = user_row["created_at"] or cutoff
|
||||
if user_row["role_changed_at"] and user_row["role_changed_at"] > cutoff:
|
||||
cutoff = user_row["role_changed_at"]
|
||||
rows = conn.execute(
|
||||
"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'))) "
|
||||
"AND created_at >= ? "
|
||||
"ORDER BY is_read ASC, id DESC LIMIT 200",
|
||||
(user["id"], user["role"], cutoff)
|
||||
(user["id"], user["role"])
|
||||
).fetchall()
|
||||
conn.close()
|
||||
return [dict(r) for r in rows]
|
||||
@@ -1622,50 +1385,6 @@ def mark_notification_read(nid: int, body: dict = None, user=Depends(get_current
|
||||
return {"ok": True}
|
||||
|
||||
|
||||
@app.post("/api/notifications/{nid}/added")
|
||||
def mark_notification_added(nid: int, user=Depends(get_current_user)):
|
||||
"""Mark a 'search missing' notification as handled: notify others and the original requester."""
|
||||
conn = get_db()
|
||||
notif = conn.execute("SELECT title, body FROM notifications WHERE id = ?", (nid,)).fetchone()
|
||||
if not notif:
|
||||
conn.close()
|
||||
raise HTTPException(404, "通知不存在")
|
||||
# Mark this one as read
|
||||
conn.execute("UPDATE notifications SET is_read = 1 WHERE id = ?", (nid,))
|
||||
who = user.get("display_name") or user.get("username")
|
||||
title = notif["title"] or ""
|
||||
# Extract query from title "🔍 用户需求：XXX"
|
||||
query = title.replace("🔍 用户需求：", "").strip() if "用户需求" in title else title
|
||||
# Mark all same-title notifications as read
|
||||
conn.execute("UPDATE notifications SET is_read = 1 WHERE title = ? AND is_read = 0", (title,))
|
||||
# Notify other editors that it's been handled
|
||||
for role in ("admin", "senior_editor"):
|
||||
conn.execute(
|
||||
"INSERT INTO notifications (target_role, title, body) VALUES (?, ?, ?)",
|
||||
(role, "✅ 配方已添加",
|
||||
f"{who} 已为「{query}」添加了配方，无需重复处理。")
|
||||
)
|
||||
# Notify the original requester (search the body for who searched)
|
||||
body_text = notif["body"] or ""
|
||||
# body format: "XXX 搜索了「YYY」..."
|
||||
if "搜索了" in body_text:
|
||||
requester_name = body_text.split(" 搜索了")[0].strip()
|
||||
# Find the user
|
||||
requester = conn.execute(
|
||||
"SELECT id, role FROM users WHERE display_name = ? OR username = ?",
|
||||
(requester_name, requester_name)
|
||||
).fetchone()
|
||||
if requester:
|
||||
conn.execute(
|
||||
"INSERT INTO notifications (target_role, title, body, target_user_id) VALUES (?, ?, ?, ?)",
|
||||
(requester["role"], "🎉 你搜索的配方已添加",
|
||||
f"你之前搜索的「{query}」已有编辑添加了配方，快去查看吧！", requester["id"])
|
||||
)
|
||||
conn.commit()
|
||||
conn.close()
|
||||
return {"ok": True}
|
||||
|
||||
|
||||
@app.post("/api/notifications/{nid}/unread")
|
||||
def mark_notification_unread(nid: int, user=Depends(get_current_user)):
|
||||
conn = get_db()
|
||||
@@ -1775,18 +1494,4 @@ def startup():
|
||||
seed_defaults(data["oils_meta"], data["recipes"])
|
||||
|
||||
if os.path.isdir(FRONTEND_DIR):
|
||||
# Serve static assets (js/css/images) directly
|
||||
app.mount("/assets", StaticFiles(directory=os.path.join(FRONTEND_DIR, "assets")), name="assets")
|
||||
app.mount("/public", StaticFiles(directory=FRONTEND_DIR), name="public")
|
||||
|
||||
# SPA fallback: any non-API, non-asset route returns index.html
|
||||
from fastapi.responses import FileResponse
|
||||
|
||||
@app.get("/{path:path}")
|
||||
async def spa_fallback(path: str):
|
||||
# Serve actual files if they exist (favicon, icons, etc.)
|
||||
file_path = os.path.join(FRONTEND_DIR, path)
|
||||
if os.path.isfile(file_path):
|
||||
return FileResponse(file_path)
|
||||
# Otherwise return index.html for Vue Router
|
||||
return FileResponse(os.path.join(FRONTEND_DIR, "index.html"))
|
||||
app.mount("/", StaticFiles(directory=FRONTEND_DIR, html=True), name="frontend")
|
||||
|
||||
@@ -1,298 +0,0 @@
|
||||
# 前端功能点测试覆盖表
|
||||
|
||||
> 基于 Vue 3 重构后的前端，对照原始 vanilla JS 实现的所有功能点。
|
||||
|
||||
## 测试类型说明
|
||||
|
||||
- **unit** = Vitest 单元测试 (纯逻辑，无 DOM)
|
||||
- **e2e** = Cypress E2E 测试 (真实浏览器 + 后端)
|
||||
- **none** = 尚未覆盖
|
||||
|
||||
---
|
||||
|
||||
## 1. 配方查询 (RecipeSearch)
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 配方卡片列表渲染 | e2e | recipe-search.cy.js |
|
||||
| 按名称搜索过滤 | e2e | recipe-search.cy.js, search-advanced.cy.js |
|
||||
| 按精油名搜索 | e2e | search-advanced.cy.js |
|
||||
| 清除搜索恢复列表 | e2e | recipe-search.cy.js, search-advanced.cy.js |
|
||||
| 特殊字符搜索不崩溃 | e2e | search-advanced.cy.js |
|
||||
| 快速输入不崩溃 | e2e | search-advanced.cy.js |
|
||||
| 分类轮播 (carousel) | none | — |
|
||||
| 个人配方预览 (登录后) | none | — |
|
||||
| 收藏配方预览 (登录后) | none | — |
|
||||
| 症状搜索 / fuzzy results | none | — |
|
||||
|
||||
## 2. 配方详情 (RecipeDetailOverlay)
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 点击卡片弹出详情 | e2e | recipe-detail.cy.js |
|
||||
| 显示配方名称 | e2e | recipe-detail.cy.js |
|
||||
| 显示精油成分和滴数 | e2e | recipe-detail.cy.js |
|
||||
| 显示总成本 (¥) | e2e | recipe-detail.cy.js |
|
||||
| 关闭详情弹层 | e2e | recipe-detail.cy.js |
|
||||
| 收藏星标按钮 | e2e | recipe-detail.cy.js |
|
||||
| 编辑模式切换 (admin) | e2e | recipe-detail.cy.js |
|
||||
| 编辑器显示成分表 | e2e | recipe-detail.cy.js |
|
||||
| 保存按钮 | e2e | recipe-detail.cy.js |
|
||||
| 容量选择 (单次/5ml/10ml/30ml) | none | — |
|
||||
| 稀释比例换算 | none | — |
|
||||
| 应用容量到配方 | none | — |
|
||||
| 标签编辑 | none | — |
|
||||
| 备注编辑 | none | — |
|
||||
| 配方卡片图片生成 (html2canvas) | none | — |
|
||||
| 中英双语卡片 | none | — |
|
||||
| 分享 overlay | none | — |
|
||||
| 品牌水印 | none | — |
|
||||
|
||||
## 3. 精油价目 (OilReference)
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 精油列表渲染 | e2e | oil-reference.cy.js |
|
||||
| 按名称搜索 | e2e | oil-reference.cy.js |
|
||||
| 瓶价/滴价切换 | e2e | oil-reference.cy.js |
|
||||
| 精油数据完整性 (价格有效) | e2e | oil-data-integrity.cy.js |
|
||||
| 标准容量验证 | e2e | oil-data-integrity.cy.js |
|
||||
| 稀释比例知识卡 | none | — |
|
||||
| 使用禁忌知识卡 | none | — |
|
||||
| 新增精油 (admin) | e2e | api-crud.cy.js (API层) |
|
||||
| 编辑精油 (admin) | none | — |
|
||||
| 删除精油 (admin) | e2e | api-crud.cy.js (API层) |
|
||||
| 导出 PDF | none | — |
|
||||
|
||||
## 4. 管理配方 (RecipeManager)
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 页面加载配方列表 | e2e | manage-recipes.cy.js |
|
||||
| 搜索过滤 | e2e | manage-recipes.cy.js |
|
||||
| 标签筛选 | e2e | manage-recipes.cy.js |
|
||||
| 点击编辑配方 | e2e | manage-recipes.cy.js |
|
||||
| 新增配方 (API) | e2e | api-crud.cy.js |
|
||||
| 更新配方 (API) | e2e | api-crud.cy.js |
|
||||
| 删除配方 (API) | e2e | api-crud.cy.js |
|
||||
| 批量选择 | none | — |
|
||||
| 批量打标签 | none | — |
|
||||
| 批量删除 | none | — |
|
||||
| 批量导出卡片 (zip) | none | — |
|
||||
| Excel 导出 | none | — |
|
||||
| 待审核配方 (admin) | none | — |
|
||||
| 批量采纳配方 (admin) | none | — |
|
||||
| 智能粘贴 → 新增配方 | unit | smartPaste.test.js (解析逻辑) |
|
||||
|
||||
## 5. 个人库存 (Inventory)
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 添加精油到库存 (API) | e2e | api-crud.cy.js, inventory-flow.cy.js |
|
||||
| 读取库存 (API) | e2e | api-crud.cy.js, inventory-flow.cy.js |
|
||||
| 删除库存精油 | e2e | inventory-flow.cy.js |
|
||||
| 搜索精油 picker | e2e | inventory-flow.cy.js |
|
||||
| 可做配方推荐 | e2e | inventory-flow.cy.js |
|
||||
|
||||
## 6. 商业核算 (Projects)
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 项目列表 | none | — |
|
||||
| 创建/编辑/删除项目 | none | — |
|
||||
| 成分编辑 | none | — |
|
||||
| 定价利润分析 | none | — |
|
||||
| 从配方导入 | none | — |
|
||||
|
||||
## 7. 我的 (MyDiary)
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 创建个人配方 (API) | e2e | api-crud.cy.js, diary-flow.cy.js |
|
||||
| 更新个人配方 (API) | e2e | diary-flow.cy.js |
|
||||
| 删除个人配方 (API) | e2e | api-crud.cy.js, diary-flow.cy.js |
|
||||
| 添加使用日记 (API) | e2e | diary-flow.cy.js |
|
||||
| 删除使用日记 (API) | e2e | diary-flow.cy.js |
|
||||
| 日记配方列表 UI | e2e | diary-flow.cy.js |
|
||||
| 智能粘贴到日记 | unit | smartPaste.test.js (解析逻辑) |
|
||||
| 品牌设置 (QR/Logo/背景) | none | — |
|
||||
| 账号设置 (昵称/密码) | none | — |
|
||||
| 商业认证申请 | none | — |
|
||||
|
||||
## 8. 操作日志 (AuditLog)
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 读取日志 (API) | e2e | api-crud.cy.js |
|
||||
| 页面渲染 | e2e | admin-flow.cy.js |
|
||||
| 类型筛选 | none | — |
|
||||
| 用户筛选 | none | — |
|
||||
| 撤销操作 | none | — |
|
||||
| 加载更多 | none | — |
|
||||
|
||||
## 9. Bug 追踪 (BugTracker)
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 提交 Bug (API) | e2e | api-crud.cy.js, bug-tracker-flow.cy.js |
|
||||
| Bug 列表 (API) | e2e | api-crud.cy.js, bug-tracker-flow.cy.js |
|
||||
| 更新状态 (API) | e2e | bug-tracker-flow.cy.js |
|
||||
| 添加评论 (API) | e2e | bug-tracker-flow.cy.js |
|
||||
| 删除 Bug (API) | e2e | api-crud.cy.js, bug-tracker-flow.cy.js |
|
||||
| 页面渲染 | e2e | admin-flow.cy.js |
|
||||
| 优先级排序 | none | — |
|
||||
| 指派测试人 | none | — |
|
||||
|
||||
## 10. 用户管理 (UserManagement)
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 用户列表 (API) | e2e | api-crud.cy.js, user-management-flow.cy.js |
|
||||
| 创建用户 (API) | e2e | user-management-flow.cy.js |
|
||||
| 修改角色 (API) | e2e | user-management-flow.cy.js |
|
||||
| 删除用户 (API) | e2e | user-management-flow.cy.js |
|
||||
| 页面渲染 | e2e | admin-flow.cy.js |
|
||||
| 权限不足拦截 | e2e | api-crud.cy.js |
|
||||
| 翻译建议审核 | none | — |
|
||||
| 商业认证审批 | none | — |
|
||||
|
||||
## 11. 认证与权限
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 未登录显示登录按钮 | e2e | auth-flow.cy.js |
|
||||
| 登录 modal 弹出 | e2e | auth-flow.cy.js |
|
||||
| 登录表单字段 | e2e | auth-flow.cy.js |
|
||||
| 无效登录错误提示 | e2e | auth-flow.cy.js |
|
||||
| Token 认证 | e2e | auth-flow.cy.js, api-health.cy.js |
|
||||
| URL token 自动登录 | e2e | auth-flow.cy.js |
|
||||
| 登出清除状态 | e2e | auth-flow.cy.js |
|
||||
| Admin tab 权限控制 | e2e | admin-flow.cy.js, navigation.cy.js |
|
||||
| 受保护 tab 登录拦截 | e2e | app-load.cy.js |
|
||||
| 注册 | none | — |
|
||||
|
||||
## 12. 收藏系统
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 添加收藏 (API) | e2e | api-crud.cy.js, favorites.cy.js |
|
||||
| 移除收藏 (API) | e2e | api-crud.cy.js, favorites.cy.js |
|
||||
| 卡片星标切换 | e2e | favorites.cy.js |
|
||||
|
||||
## 13. 智能粘贴 (Smart Paste)
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 编辑距离计算 | unit | smartPaste.test.js |
|
||||
| 精确匹配精油名 | unit | smartPaste.test.js |
|
||||
| 同音字纠错 (12 组) | unit | smartPaste.test.js |
|
||||
| 子串匹配 | unit | smartPaste.test.js |
|
||||
| 缺字匹配 | unit | smartPaste.test.js |
|
||||
| 编辑距离模糊匹配 | unit | smartPaste.test.js |
|
||||
| 贪心最长匹配 | unit | smartPaste.test.js |
|
||||
| 连写解析 "芳香调理8永久花10" | unit | smartPaste.test.js |
|
||||
| ml → 滴数换算 | unit | smartPaste.test.js |
|
||||
| 单配方解析 | unit | smartPaste.test.js |
|
||||
| 多配方拆分 | unit | smartPaste.test.js |
|
||||
| 去重合并 | unit | smartPaste.test.js |
|
||||
|
||||
## 14. 成本计算
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 单滴价格计算 | unit | oilCalculations.test.js |
|
||||
| 配方成本求和 | unit | oilCalculations.test.js |
|
||||
| 零售价计算 | unit | oilCalculations.test.js |
|
||||
| 前端成本 vs 预期值对比 | e2e | recipe-cost-parity.cy.js |
|
||||
| 价格格式化 (¥ X.XX) | unit | oilCalculations.test.js |
|
||||
| 137 种精油价格有效性 | unit+e2e | oilCalculations.test.js, oil-data-integrity.cy.js |
|
||||
|
||||
## 15. 精油翻译
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 常用精油中→英 | unit | oilTranslation.test.js |
|
||||
| 复方名中→英 | unit | oilTranslation.test.js |
|
||||
| 未知精油返回空 | unit | oilTranslation.test.js |
|
||||
|
||||
## 16. 对话框系统
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| Alert 弹出和关闭 | unit | dialog.test.js |
|
||||
| Confirm 返回 true/false | unit | dialog.test.js |
|
||||
| Prompt 返回输入值/null | unit | dialog.test.js |
|
||||
|
||||
## 17. 通用 UI
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 首页加载 | e2e | app-load.cy.js |
|
||||
| Header 渲染 | e2e | app-load.cy.js |
|
||||
| 导航 tab 切换 | e2e | navigation.cy.js |
|
||||
| 后退按钮 | e2e | navigation.cy.js |
|
||||
| Tab active 状态 | e2e | navigation.cy.js |
|
||||
| 直接 URL 访问 | e2e | navigation.cy.js |
|
||||
| 手机端渲染 (375px) | e2e | responsive.cy.js |
|
||||
| 平板端渲染 (768px) | e2e | responsive.cy.js |
|
||||
| 宽屏渲染 (1920px) | e2e | responsive.cy.js |
|
||||
| 页面加载 < 5s | e2e | performance.cy.js |
|
||||
| API 响应 < 1s | e2e | performance.cy.js |
|
||||
| 250+ 配方不崩溃 | e2e | performance.cy.js |
|
||||
| Toast 提示 | none | — |
|
||||
| 离线队列 | none | — |
|
||||
| 版本检查 | e2e | api-health.cy.js |
|
||||
|
||||
## 18. 通知系统
|
||||
|
||||
| 功能点 | 测试 | 文件 |
|
||||
|--------|------|------|
|
||||
| 读取通知 (API) | e2e | api-crud.cy.js |
|
||||
| 全部已读 | none | — |
|
||||
| 通知弹窗 | none | — |
|
||||
|
||||
---
|
||||
|
||||
## 覆盖统计
|
||||
|
||||
| 类型 | 数量 |
|
||||
|------|------|
|
||||
| **功能点总数** | ~120 |
|
||||
| **Vitest unit tests** | 105 |
|
||||
| **Cypress E2E tests** | 167 |
|
||||
| **总测试数** | **272** |
|
||||
| **功能点覆盖率** | **~79%** |
|
||||
|
||||
### 未覆盖的高风险功能
|
||||
|
||||
以下功能未测试且回归风险较高（按优先级排序）：
|
||||
|
||||
| 优先级 | 功能 | 风险 | 说明 |
|
||||
|--------|------|------|------|
|
||||
| P0 | 容量/稀释换算 | HIGH | 核心数学计算，剂量错误有安全风险 |
|
||||
| P0 | 配方卡片图片生成 | HIGH | html2canvas 外部依赖，异步渲染 |
|
||||
| P0 | 批量操作 | HIGH | 多配方变更，破坏性操作 |
|
||||
| P1 | Excel 导出 | HIGH | ExcelJS 依赖，文件格式兼容性 |
|
||||
| P1 | 品牌图片上传压缩 | HIGH | 文件 I/O，Base64 编码 |
|
||||
| P1 | 商业核算模块 | MED | 整个 Projects 模块 (~15 functions) |
|
||||
| P2 | 分类轮播 | MED | 触摸/滑动事件，动画状态 |
|
||||
| P2 | 审计日志撤销 | MED | 逆向 API 操作，数据一致性 |
|
||||
| P2 | 通知系统 | MED | 状态同步（未读计数） |
|
||||
| P2 | 商业认证审批 | MED | 权限门控功能 |
|
||||
| P3 | 症状搜索 | MED-LOW | 模糊匹配逻辑 |
|
||||
| P3 | 账号设置 | MED-LOW | 密码验证逻辑 |
|
||||
| P3 | 离线队列 | LOW | 数据保护 |
|
||||
|
||||
### 覆盖最充分的功能
|
||||
|
||||
1. 智能粘贴解析 (unit: 全覆盖，37 tests)
|
||||
2. 成本计算 (unit + e2e: 全覆盖，21 + 6 tests)
|
||||
3. API CRUD (e2e: 全覆盖，27 tests)
|
||||
4. 认证/权限 (e2e: 基本全覆盖，8 tests)
|
||||
5. 搜索/过滤 (e2e: 充分覆盖，12 tests)
|
||||
6. 数据完整性 (e2e: 137 oils + 293 recipes 验证)
|
||||
7. 响应式布局 (e2e: 3 种视口，9 tests)
|
||||
|
||||
### 已发现的后端 Bug
|
||||
|
||||
- `backend/main.py:246-247`: `@app.post("/api/bug-reports/{bug_id}/comment")` 装饰器叠在 `delete_bug` 函数上，导致 POST comment 实际执行删除操作。
|
||||
3
frontend/.gitignore
vendored
3
frontend/.gitignore
vendored
@@ -1,3 +0,0 @@
|
||||
demo-output/
|
||||
cypress/videos/
|
||||
cypress/screenshots/
|
||||
@@ -9,6 +9,5 @@ export default defineConfig({
|
||||
viewportHeight: 800,
|
||||
video: true,
|
||||
videoCompression: false,
|
||||
allowCypressEnv: false,
|
||||
},
|
||||
})
|
||||
|
||||
@@ -1,44 +0,0 @@
|
||||
describe('Account Settings', () => {
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
const authHeaders = { Authorization: `Bearer ${ADMIN_TOKEN}` }
|
||||
|
||||
it('can read current user profile', () => {
|
||||
cy.request({ url: '/api/me', headers: authHeaders }).then(res => {
|
||||
expect(res.body.username).to.eq('hera')
|
||||
expect(res.body.role).to.eq('admin')
|
||||
expect(res.body).to.have.property('display_name')
|
||||
expect(res.body).to.have.property('has_password')
|
||||
})
|
||||
})
|
||||
|
||||
it('can update display name', () => {
|
||||
// Save original
|
||||
cy.request({ url: '/api/me', headers: authHeaders }).then(res => {
|
||||
const original = res.body.display_name
|
||||
// Update
|
||||
cy.request({
|
||||
method: 'PUT', url: `/api/users/${res.body.id}`, headers: authHeaders,
|
||||
body: { display_name: 'Cypress测试名' }
|
||||
}).then(r => expect(r.status).to.eq(200))
|
||||
// Verify
|
||||
cy.request({ url: '/api/me', headers: authHeaders }).then(r2 => {
|
||||
expect(r2.body.display_name).to.eq('Cypress测试名')
|
||||
})
|
||||
// Restore
|
||||
cy.request({
|
||||
method: 'PUT', url: `/api/users/${res.body.id}`, headers: authHeaders,
|
||||
body: { display_name: original || 'Hera' }
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
it('API rejects unauthenticated profile update', () => {
|
||||
cy.request({
|
||||
method: 'PUT', url: '/api/users/1',
|
||||
body: { display_name: 'hacked' },
|
||||
failOnStatusCode: false
|
||||
}).then(res => {
|
||||
expect(res.status).to.eq(403)
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -1,39 +1,48 @@
|
||||
describe('Admin Flow', () => {
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
|
||||
beforeEach(() => {
|
||||
const token = Cypress.env('ADMIN_TOKEN')
|
||||
if (!token) {
|
||||
cy.log('ADMIN_TOKEN not set, skipping admin tests')
|
||||
return
|
||||
}
|
||||
cy.visit('/', {
|
||||
onBeforeLoad(win) {
|
||||
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
||||
win.localStorage.setItem('oil_auth_token', token)
|
||||
}
|
||||
})
|
||||
// Wait for app to load with admin privileges
|
||||
cy.get('.nav-tab', { timeout: 10000 }).should('have.length.gte', 6)
|
||||
})
|
||||
|
||||
it('shows admin-only tabs', () => {
|
||||
if (!Cypress.env('ADMIN_TOKEN')) return
|
||||
cy.get('.nav-tab').contains('操作日志').should('be.visible')
|
||||
cy.get('.nav-tab').contains('Bug').should('be.visible')
|
||||
cy.get('.nav-tab').contains('用户管理').should('be.visible')
|
||||
})
|
||||
|
||||
it('can access manage recipes page', () => {
|
||||
if (!Cypress.env('ADMIN_TOKEN')) return
|
||||
cy.get('.nav-tab').contains('管理配方').click()
|
||||
cy.url().should('include', '/manage')
|
||||
})
|
||||
|
||||
it('can access audit log page', () => {
|
||||
if (!Cypress.env('ADMIN_TOKEN')) return
|
||||
cy.get('.nav-tab').contains('操作日志').click()
|
||||
cy.url().should('include', '/audit')
|
||||
cy.contains('操作日志').should('be.visible')
|
||||
})
|
||||
|
||||
it('can access user management page', () => {
|
||||
if (!Cypress.env('ADMIN_TOKEN')) return
|
||||
cy.get('.nav-tab').contains('用户管理').click()
|
||||
cy.url().should('include', '/users')
|
||||
cy.contains('用户管理').should('be.visible')
|
||||
})
|
||||
|
||||
it('can access bug tracker page', () => {
|
||||
if (!Cypress.env('ADMIN_TOKEN')) return
|
||||
cy.get('.nav-tab').contains('Bug').click()
|
||||
cy.url().should('include', '/bugs')
|
||||
cy.contains('Bug').should('be.visible')
|
||||
|
||||
@@ -46,7 +46,12 @@ describe('API Health Check', () => {
|
||||
})
|
||||
|
||||
it('GET /api/me returns authenticated user with valid token', () => {
|
||||
const token = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
// Use the admin token from env or skip
|
||||
const token = Cypress.env('ADMIN_TOKEN')
|
||||
if (!token) {
|
||||
cy.log('ADMIN_TOKEN not set, skipping auth test')
|
||||
return
|
||||
}
|
||||
cy.request({
|
||||
url: '/api/me',
|
||||
headers: { Authorization: `Bearer ${token}` }
|
||||
|
||||
@@ -1,59 +0,0 @@
|
||||
describe('Audit Log Advanced', () => {
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
const authHeaders = { Authorization: `Bearer ${ADMIN_TOKEN}` }
|
||||
|
||||
it('fetches audit logs with pagination', () => {
|
||||
cy.request({ url: '/api/audit-log?limit=10&offset=0', headers: authHeaders }).then(res => {
|
||||
expect(res.status).to.eq(200)
|
||||
expect(res.body).to.be.an('array')
|
||||
expect(res.body.length).to.be.lte(10)
|
||||
})
|
||||
})
|
||||
|
||||
it('audit log entries have required fields', () => {
|
||||
cy.request({ url: '/api/audit-log?limit=5&offset=0', headers: authHeaders }).then(res => {
|
||||
if (res.body.length > 0) {
|
||||
const entry = res.body[0]
|
||||
expect(entry).to.have.property('action')
|
||||
expect(entry).to.have.property('created_at')
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
it('pagination works (offset returns different records)', () => {
|
||||
cy.request({ url: '/api/audit-log?limit=5&offset=0', headers: authHeaders }).then(res1 => {
|
||||
if (res1.body.length < 5) return // not enough data
|
||||
cy.request({ url: '/api/audit-log?limit=5&offset=5', headers: authHeaders }).then(res2 => {
|
||||
if (res2.body.length > 0) {
|
||||
// First record of page 2 should differ from page 1
|
||||
expect(res2.body[0].id).to.not.eq(res1.body[0].id)
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
it('creating a recipe generates an audit log entry', () => {
|
||||
// Create a recipe
|
||||
cy.request({
|
||||
method: 'POST', url: '/api/recipes', headers: authHeaders,
|
||||
body: { name: 'Cypress审计测试', note: '', ingredients: [{ oil_name: '薰衣草', drops: 1 }], tags: [] }
|
||||
}).then(createRes => {
|
||||
const recipeId = createRes.body.id
|
||||
// Check audit log
|
||||
cy.request({ url: '/api/audit-log?limit=5&offset=0', headers: authHeaders }).then(res => {
|
||||
const entry = res.body.find(e => e.action === 'create_recipe' && e.target_name === 'Cypress审计测试')
|
||||
expect(entry).to.exist
|
||||
})
|
||||
// Cleanup
|
||||
cy.request({ method: 'DELETE', url: `/api/recipes/${recipeId}`, headers: authHeaders, failOnStatusCode: false })
|
||||
})
|
||||
})
|
||||
|
||||
it('deleting a recipe generates audit log entry', () => {
|
||||
cy.request({ url: '/api/audit-log?limit=10&offset=0', headers: authHeaders }).then(res => {
|
||||
const deleteEntries = res.body.filter(e => e.action === 'delete_recipe')
|
||||
// Should have at least one delete entry (from our previous test cleanup)
|
||||
expect(deleteEntries.length).to.be.gte(0) // may or may not exist
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -1,74 +0,0 @@
|
||||
describe('Batch Operations', () => {
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
const authHeaders = { Authorization: `Bearer ${ADMIN_TOKEN}` }
|
||||
|
||||
describe('Batch tag operations via API', () => {
|
||||
let testRecipeIds = []
|
||||
|
||||
before(() => {
|
||||
// Create 3 test recipes
|
||||
const recipes = ['Cypress批量1', 'Cypress批量2', 'Cypress批量3']
|
||||
recipes.forEach(name => {
|
||||
cy.request({
|
||||
method: 'POST', url: '/api/recipes', headers: authHeaders,
|
||||
body: { name, note: 'batch test', ingredients: [{ oil_name: '薰衣草', drops: 5 }], tags: [] }
|
||||
}).then(res => testRecipeIds.push(res.body.id))
|
||||
})
|
||||
})
|
||||
|
||||
it('created 3 test recipes', () => {
|
||||
expect(testRecipeIds).to.have.length(3)
|
||||
})
|
||||
|
||||
it('can update tags on each recipe', () => {
|
||||
testRecipeIds.forEach(id => {
|
||||
cy.request({
|
||||
method: 'PUT', url: `/api/recipes/${id}`, headers: authHeaders,
|
||||
body: { tags: ['cypress-batch-tag'] }
|
||||
}).then(res => expect(res.status).to.eq(200))
|
||||
})
|
||||
})
|
||||
|
||||
it('verifies tags were applied', () => {
|
||||
cy.request('/api/recipes').then(res => {
|
||||
const tagged = res.body.filter(r => (r.tags || []).includes('cypress-batch-tag'))
|
||||
expect(tagged.length).to.be.gte(3)
|
||||
})
|
||||
})
|
||||
|
||||
it('can delete all test recipes', () => {
|
||||
testRecipeIds.forEach(id => {
|
||||
cy.request({
|
||||
method: 'DELETE', url: `/api/recipes/${id}`, headers: authHeaders
|
||||
}).then(res => expect(res.status).to.eq(200))
|
||||
})
|
||||
})
|
||||
|
||||
it('verifies recipes are deleted', () => {
|
||||
cy.request('/api/recipes').then(res => {
|
||||
const found = res.body.filter(r => r.name && r.name.startsWith('Cypress批量'))
|
||||
expect(found).to.have.length(0)
|
||||
})
|
||||
})
|
||||
|
||||
after(() => {
|
||||
// Cleanup tag
|
||||
cy.request({ method: 'DELETE', url: '/api/tags/cypress-batch-tag', headers: authHeaders, failOnStatusCode: false })
|
||||
// Cleanup any remaining test recipes
|
||||
cy.request('/api/recipes').then(res => {
|
||||
res.body.filter(r => r.name && r.name.startsWith('Cypress批量')).forEach(r => {
|
||||
cy.request({ method: 'DELETE', url: `/api/recipes/${r.id}`, headers: authHeaders, failOnStatusCode: false })
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('Recipe adopt workflow (admin)', () => {
|
||||
// Test the adopt/review workflow that admin uses to approve user-submitted recipes
|
||||
it('lists recipes and checks for owner_id field', () => {
|
||||
cy.request('/api/recipes').then(res => {
|
||||
expect(res.body[0]).to.have.property('owner_id')
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -1,99 +0,0 @@
|
||||
describe('Bug Tracker Flow', () => {
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
const authHeaders = { Authorization: `Bearer ${ADMIN_TOKEN}` }
|
||||
const TEST_CONTENT = 'Cypress_E2E_Bug_测试缺陷_' + Date.now()
|
||||
let testBugId = null
|
||||
|
||||
describe('API: bug lifecycle', () => {
|
||||
it('submits a new bug via API', () => {
|
||||
cy.request({
|
||||
method: 'POST',
|
||||
url: '/api/bug-report',
|
||||
headers: authHeaders,
|
||||
body: { content: TEST_CONTENT, priority: 2 }
|
||||
}).then(res => {
|
||||
expect(res.status).to.be.oneOf([200, 201])
|
||||
})
|
||||
})
|
||||
|
||||
it('verifies the bug appears in the list', () => {
|
||||
cy.request({ url: '/api/bug-reports', headers: authHeaders }).then(res => {
|
||||
expect(res.body).to.be.an('array')
|
||||
const found = res.body.find(b => b.content && b.content.includes('Cypress_E2E_Bug'))
|
||||
expect(found).to.exist
|
||||
testBugId = found.id
|
||||
})
|
||||
})
|
||||
|
||||
it('updates bug status to testing', () => {
|
||||
cy.request({ url: '/api/bug-reports', headers: authHeaders }).then(res => {
|
||||
const found = res.body.find(b => b.content && b.content.includes('Cypress_E2E_Bug'))
|
||||
testBugId = found.id
|
||||
cy.request({
|
||||
method: 'PUT',
|
||||
url: `/api/bug-reports/${testBugId}`,
|
||||
headers: authHeaders,
|
||||
body: { status: 1, note: 'E2E test status change' }
|
||||
}).then(r => expect(r.status).to.eq(200))
|
||||
})
|
||||
})
|
||||
|
||||
it('verifies status was updated', () => {
|
||||
cy.request({ url: '/api/bug-reports', headers: authHeaders }).then(res => {
|
||||
const found = res.body.find(b => b.content && b.content.includes('Cypress_E2E_Bug'))
|
||||
expect(found.is_resolved).to.eq(1)
|
||||
})
|
||||
})
|
||||
|
||||
// NOTE: POST /api/bug-reports/{id}/comment has a backend bug — the decorator
|
||||
// is stacked on delete_bug function, so POST to /comment actually deletes the bug.
|
||||
// Skipping comment tests until backend is fixed.
|
||||
it('bug has auto-generated creation comment', () => {
|
||||
cy.request({ url: '/api/bug-reports', headers: authHeaders }).then(res => {
|
||||
const found = res.body.find(b => b.content && b.content.includes('Cypress_E2E_Bug'))
|
||||
expect(found).to.exist
|
||||
expect(found.comments).to.be.an('array')
|
||||
expect(found.comments.length).to.be.gte(1) // auto creation log
|
||||
})
|
||||
})
|
||||
|
||||
it('deletes the test bug', () => {
|
||||
cy.request({ url: '/api/bug-reports', headers: authHeaders }).then(res => {
|
||||
const found = res.body.find(b => b.content && b.content.includes('Cypress_E2E_Bug'))
|
||||
if (found) {
|
||||
cy.request({
|
||||
method: 'DELETE',
|
||||
url: `/api/bug-reports/${found.id}`,
|
||||
headers: authHeaders
|
||||
}).then(r => expect(r.status).to.eq(200))
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
it('verifies the bug is deleted', () => {
|
||||
cy.request({ url: '/api/bug-reports', headers: authHeaders }).then(res => {
|
||||
const found = res.body.find(b => b.content && b.content.includes('Cypress_E2E_Bug'))
|
||||
expect(found).to.not.exist
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('UI: bugs page', () => {
|
||||
it('visits /bugs and page renders', () => {
|
||||
cy.visit('/bugs', {
|
||||
onBeforeLoad(win) { win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN) }
|
||||
})
|
||||
cy.contains('Bug', { timeout: 10000 }).should('be.visible')
|
||||
})
|
||||
})
|
||||
|
||||
after(() => {
|
||||
cy.request({ url: '/api/bug-reports', headers: authHeaders, failOnStatusCode: false }).then(res => {
|
||||
if (res.status === 200 && Array.isArray(res.body)) {
|
||||
res.body.filter(b => b.content && b.content.includes('Cypress_E2E_Bug')).forEach(bug => {
|
||||
cy.request({ method: 'DELETE', url: `/api/bug-reports/${bug.id}`, headers: authHeaders, failOnStatusCode: false })
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -1,28 +0,0 @@
|
||||
describe('Category Modules', () => {
|
||||
it('fetches category modules from API', () => {
|
||||
cy.request({ url: '/api/category-modules', failOnStatusCode: false }).then(res => {
|
||||
if (res.status === 200) {
|
||||
expect(res.body).to.be.an('array')
|
||||
if (res.body.length > 0) {
|
||||
const cat = res.body[0]
|
||||
expect(cat).to.have.property('name')
|
||||
expect(cat).to.have.property('tag_name')
|
||||
expect(cat).to.have.property('icon')
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
it('categories reference existing tags', () => {
|
||||
cy.request({ url: '/api/category-modules', failOnStatusCode: false }).then(catRes => {
|
||||
if (catRes.status !== 200) return
|
||||
cy.request('/api/tags').then(tagRes => {
|
||||
const tags = tagRes.body
|
||||
catRes.body.forEach(cat => {
|
||||
// Category's tag_name should correspond to a valid tag or recipes with that tag
|
||||
expect(cat.tag_name).to.be.a('string').and.not.be.empty
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -1,216 +0,0 @@
|
||||
describe('Diary Flow', () => {
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
const authHeaders = { Authorization: `Bearer ${ADMIN_TOKEN}` }
|
||||
let testDiaryId = null
|
||||
|
||||
describe('API: full diary lifecycle', () => {
|
||||
it('creates a diary entry via API', () => {
|
||||
cy.request({
|
||||
method: 'POST',
|
||||
url: '/api/diary',
|
||||
headers: authHeaders,
|
||||
body: {
|
||||
name: 'Cypress_Diary_Test_日记',
|
||||
ingredients: [
|
||||
{ oil: '薰衣草', drops: 3 },
|
||||
{ oil: '茶树', drops: 2 }
|
||||
],
|
||||
note: '这是E2E测试创建的日记'
|
||||
}
|
||||
}).then(res => {
|
||||
expect(res.status).to.be.oneOf([200, 201])
|
||||
testDiaryId = res.body.id || res.body._id
|
||||
expect(testDiaryId).to.exist
|
||||
})
|
||||
})
|
||||
|
||||
it('verifies diary entry appears in GET /api/diary', () => {
|
||||
cy.request({
|
||||
url: '/api/diary',
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
expect(res.body).to.be.an('array')
|
||||
const found = res.body.find(d => d.name === 'Cypress_Diary_Test_日记')
|
||||
expect(found).to.exist
|
||||
expect(found.ingredients).to.have.length(2)
|
||||
expect(found.note).to.eq('这是E2E测试创建的日记')
|
||||
testDiaryId = found.id || found._id
|
||||
})
|
||||
})
|
||||
|
||||
it('updates the diary entry via PUT', () => {
|
||||
cy.request({
|
||||
url: '/api/diary',
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
const found = res.body.find(d => d.name === 'Cypress_Diary_Test_日记')
|
||||
testDiaryId = found.id || found._id
|
||||
cy.request({
|
||||
method: 'PUT',
|
||||
url: `/api/diary/${testDiaryId}`,
|
||||
headers: authHeaders,
|
||||
body: {
|
||||
name: 'Cypress_Diary_Updated_日记',
|
||||
ingredients: [
|
||||
{ oil: '薰衣草', drops: 5 },
|
||||
{ oil: '乳香', drops: 3 }
|
||||
],
|
||||
note: '已更新的日记'
|
||||
}
|
||||
}).then(res => {
|
||||
expect(res.status).to.eq(200)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
it('verifies the update took effect', () => {
|
||||
cy.request({
|
||||
url: '/api/diary',
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
const found = res.body.find(d => d.name === 'Cypress_Diary_Updated_日记')
|
||||
expect(found).to.exist
|
||||
expect(found.note).to.eq('已更新的日记')
|
||||
expect(found.ingredients).to.have.length(2)
|
||||
testDiaryId = found.id || found._id
|
||||
})
|
||||
})
|
||||
|
||||
it('adds a journal entry to the diary', () => {
|
||||
cy.request({
|
||||
url: '/api/diary',
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
const found = res.body.find(d => d.name === 'Cypress_Diary_Updated_日记')
|
||||
testDiaryId = found.id || found._id
|
||||
cy.request({
|
||||
method: 'POST',
|
||||
url: `/api/diary/${testDiaryId}/entries`,
|
||||
headers: authHeaders,
|
||||
body: {
|
||||
content: 'Cypress测试日志: 使用后感觉很好'
|
||||
}
|
||||
}).then(res => {
|
||||
expect(res.status).to.be.oneOf([200, 201])
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
it('verifies journal entry exists in diary', () => {
|
||||
cy.request({
|
||||
url: '/api/diary',
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
const found = res.body.find(d => d.name === 'Cypress_Diary_Updated_日记')
|
||||
expect(found).to.exist
|
||||
expect(found.entries).to.be.an('array')
|
||||
expect(found.entries.length).to.be.gte(1)
|
||||
const entry = found.entries.find(e =>
|
||||
(e.text || e.content || '').includes('Cypress测试日志')
|
||||
)
|
||||
expect(entry).to.exist
|
||||
})
|
||||
})
|
||||
|
||||
it('deletes the journal entry', () => {
|
||||
cy.request({
|
||||
url: '/api/diary',
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
const found = res.body.find(d => d.name === 'Cypress_Diary_Updated_日记')
|
||||
const entry = found.entries.find(e =>
|
||||
(e.text || e.content || '').includes('Cypress测试日志')
|
||||
)
|
||||
const entryId = entry.id || entry._id
|
||||
cy.request({
|
||||
method: 'DELETE',
|
||||
url: `/api/diary/entries/${entryId}`,
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
expect(res.status).to.eq(200)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
it('deletes the diary entry', () => {
|
||||
cy.request({
|
||||
url: '/api/diary',
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
const found = res.body.find(d => d.name === 'Cypress_Diary_Updated_日记')
|
||||
if (found) {
|
||||
const id = found.id || found._id
|
||||
cy.request({
|
||||
method: 'DELETE',
|
||||
url: `/api/diary/${id}`,
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
expect(res.status).to.eq(200)
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
it('verifies diary entry is gone', () => {
|
||||
cy.request({
|
||||
url: '/api/diary',
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
const found = res.body.find(d =>
|
||||
d.name === 'Cypress_Diary_Updated_日记' || d.name === 'Cypress_Diary_Test_日记'
|
||||
)
|
||||
expect(found).to.not.exist
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('UI: diary page renders', () => {
|
||||
it('visits /mydiary and verifies page renders', () => {
|
||||
cy.visit('/mydiary', {
|
||||
onBeforeLoad(win) {
|
||||
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
||||
}
|
||||
})
|
||||
cy.get('.my-diary', { timeout: 10000 }).should('exist')
|
||||
// Should show diary sub-tabs
|
||||
cy.get('.sub-tab').should('have.length', 3)
|
||||
cy.contains('配方日记').should('be.visible')
|
||||
cy.contains('Brand').should('be.visible')
|
||||
cy.contains('Account').should('be.visible')
|
||||
})
|
||||
|
||||
it('diary grid is visible on diary tab', () => {
|
||||
cy.visit('/mydiary', {
|
||||
onBeforeLoad(win) {
|
||||
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
||||
}
|
||||
})
|
||||
cy.get('.my-diary', { timeout: 10000 }).should('exist')
|
||||
// Diary grid or empty hint should be present
|
||||
cy.get('.diary-grid, .empty-hint').should('exist')
|
||||
})
|
||||
})
|
||||
|
||||
// Safety cleanup in case tests fail mid-way
|
||||
after(() => {
|
||||
cy.request({
|
||||
url: '/api/diary',
|
||||
headers: authHeaders,
|
||||
failOnStatusCode: false
|
||||
}).then(res => {
|
||||
if (res.status === 200 && Array.isArray(res.body)) {
|
||||
const testEntries = res.body.filter(d =>
|
||||
d.name && (d.name.includes('Cypress_Diary_Test') || d.name.includes('Cypress_Diary_Updated'))
|
||||
)
|
||||
testEntries.forEach(entry => {
|
||||
cy.request({
|
||||
method: 'DELETE',
|
||||
url: `/api/diary/${entry.id || entry._id}`,
|
||||
headers: authHeaders,
|
||||
failOnStatusCode: false
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -1,74 +0,0 @@
|
||||
// Verify that Vue frontend pages call the correct backend API endpoints.
|
||||
// This test catches mismatched endpoint names (e.g. /api/bugs vs /api/bug-reports).
|
||||
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
|
||||
describe('API Endpoint Parity', () => {
|
||||
function visitAsAdmin(path) {
|
||||
cy.visit(path, {
|
||||
onBeforeLoad(win) {
|
||||
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
it('search page loads recipes from /api/recipes', () => {
|
||||
cy.intercept('GET', '/api/recipes').as('recipes')
|
||||
visitAsAdmin('/')
|
||||
cy.wait('@recipes').its('response.statusCode').should('eq', 200)
|
||||
})
|
||||
|
||||
it('search page loads oils from /api/oils', () => {
|
||||
cy.intercept('GET', '/api/oils').as('oils')
|
||||
visitAsAdmin('/')
|
||||
cy.wait('@oils').its('response.statusCode').should('eq', 200)
|
||||
})
|
||||
|
||||
it('oil reference page loads oils', () => {
|
||||
cy.intercept('GET', '/api/oils').as('oils')
|
||||
visitAsAdmin('/oils')
|
||||
cy.wait('@oils').its('response.statusCode').should('eq', 200)
|
||||
})
|
||||
|
||||
it('audit log page loads from /api/audit-log', () => {
|
||||
cy.intercept('GET', '/api/audit-log*').as('audit')
|
||||
visitAsAdmin('/audit')
|
||||
cy.wait('@audit').its('response.statusCode').should('eq', 200)
|
||||
})
|
||||
|
||||
it('audit log page does NOT call /api/audit-logs (wrong endpoint)', () => {
|
||||
cy.intercept('GET', '/api/audit-logs*').as('wrongAudit')
|
||||
visitAsAdmin('/audit')
|
||||
cy.wait(2000)
|
||||
cy.get('@wrongAudit.all').should('have.length', 0)
|
||||
})
|
||||
|
||||
it('bug tracker page loads from /api/bug-reports', () => {
|
||||
cy.intercept('GET', '/api/bug-reports').as('bugs')
|
||||
visitAsAdmin('/bugs')
|
||||
cy.wait('@bugs').its('response.statusCode').should('eq', 200)
|
||||
})
|
||||
|
||||
it('bug tracker page does NOT call /api/bugs (wrong endpoint)', () => {
|
||||
cy.intercept('GET', '/api/bugs').as('wrongBugs')
|
||||
visitAsAdmin('/bugs')
|
||||
cy.wait(2000)
|
||||
cy.get('@wrongBugs.all').should('have.length', 0)
|
||||
})
|
||||
|
||||
it('user management page loads from /api/users', () => {
|
||||
cy.intercept('GET', '/api/users').as('users')
|
||||
visitAsAdmin('/users')
|
||||
cy.wait('@users').its('response.statusCode').should('eq', 200)
|
||||
})
|
||||
|
||||
it('categories load from /api/categories', () => {
|
||||
cy.intercept('GET', '/api/categories').as('cats')
|
||||
visitAsAdmin('/')
|
||||
cy.wait(3000)
|
||||
// Categories may or may not be fetched depending on page logic
|
||||
// Just verify no /api/category-modules calls
|
||||
cy.intercept('GET', '/api/category-modules').as('wrongCats')
|
||||
cy.get('@wrongCats.all').should('have.length', 0)
|
||||
})
|
||||
})
|
||||
@@ -1,57 +0,0 @@
|
||||
describe('Inventory Flow', () => {
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
const authHeaders = { Authorization: `Bearer ${ADMIN_TOKEN}` }
|
||||
const TEST_OIL = '薰衣草'
|
||||
|
||||
describe('API: inventory CRUD', () => {
|
||||
it('adds an oil to inventory', () => {
|
||||
cy.request({
|
||||
method: 'POST',
|
||||
url: '/api/inventory',
|
||||
headers: authHeaders,
|
||||
body: { oil_name: TEST_OIL }
|
||||
}).then(res => {
|
||||
expect(res.status).to.be.oneOf([200, 201])
|
||||
})
|
||||
})
|
||||
|
||||
it('reads inventory and sees the oil', () => {
|
||||
cy.request({ url: '/api/inventory', headers: authHeaders }).then(res => {
|
||||
expect(res.body).to.be.an('array')
|
||||
expect(res.body).to.include(TEST_OIL)
|
||||
})
|
||||
})
|
||||
|
||||
it('gets matching recipes for inventory', () => {
|
||||
cy.request({ url: '/api/inventory/recipes', headers: authHeaders }).then(res => {
|
||||
expect(res.status).to.eq(200)
|
||||
expect(res.body).to.be.an('array')
|
||||
})
|
||||
})
|
||||
|
||||
it('removes the oil from inventory', () => {
|
||||
cy.request({
|
||||
method: 'DELETE',
|
||||
url: `/api/inventory/${encodeURIComponent(TEST_OIL)}`,
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
expect(res.status).to.eq(200)
|
||||
})
|
||||
})
|
||||
|
||||
it('verifies oil is removed', () => {
|
||||
cy.request({ url: '/api/inventory', headers: authHeaders }).then(res => {
|
||||
expect(res.body).to.not.include(TEST_OIL)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('UI: inventory page', () => {
|
||||
it('page loads with oil picker', () => {
|
||||
cy.visit('/inventory', {
|
||||
onBeforeLoad(win) { win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN) }
|
||||
})
|
||||
cy.contains('库存', { timeout: 10000 }).should('be.visible')
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -1,101 +0,0 @@
|
||||
describe('Manage Recipes Page', () => {
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
|
||||
beforeEach(() => {
|
||||
cy.visit('/manage', {
|
||||
onBeforeLoad(win) {
|
||||
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
||||
}
|
||||
})
|
||||
// Wait for the recipe manager to load
|
||||
cy.get('.recipe-manager', { timeout: 10000 }).should('exist')
|
||||
})
|
||||
|
||||
it('loads and shows recipe lists', () => {
|
||||
// Should show public recipes section with at least some recipes
|
||||
cy.contains('公共配方库').should('be.visible')
|
||||
cy.get('.recipe-row').should('have.length.gte', 1)
|
||||
})
|
||||
|
||||
it('search box filters recipes', () => {
|
||||
cy.get('.recipe-row').then($rows => {
|
||||
const initialCount = $rows.length
|
||||
// Type a search term
|
||||
cy.get('.manage-toolbar .search-input').type('薰衣草')
|
||||
cy.wait(500)
|
||||
// Filtered count should be different (fewer or equal)
|
||||
cy.get('.recipe-row').should('have.length.lte', initialCount)
|
||||
})
|
||||
})
|
||||
|
||||
it('clearing search restores all recipes', () => {
|
||||
cy.get('.manage-toolbar .search-input').type('薰衣草')
|
||||
cy.wait(500)
|
||||
cy.get('.recipe-row').then($filtered => {
|
||||
const filteredCount = $filtered.length
|
||||
cy.get('.manage-toolbar .search-input').clear()
|
||||
cy.wait(500)
|
||||
cy.get('.recipe-row').should('have.length.gte', filteredCount)
|
||||
})
|
||||
})
|
||||
|
||||
it('can click a recipe to open the editor overlay', () => {
|
||||
// Click the row-info area (which triggers editRecipe)
|
||||
cy.get('.recipe-row .row-info').first().click()
|
||||
// Editor overlay should appear
|
||||
cy.get('.overlay-panel', { timeout: 5000 }).should('be.visible')
|
||||
cy.contains('编辑配方').should('be.visible')
|
||||
// Should have form fields
|
||||
cy.get('.form-group').should('have.length.gte', 1)
|
||||
})
|
||||
|
||||
it('editor shows ingredients table with oil selects', () => {
|
||||
cy.get('.recipe-row .row-info').first().click()
|
||||
cy.get('.overlay-panel', { timeout: 5000 }).should('be.visible')
|
||||
// Ingredients section should have rows with select dropdowns
|
||||
cy.get('.overlay-panel .ing-row').should('have.length.gte', 1)
|
||||
cy.get('.overlay-panel .form-select').should('have.length.gte', 1)
|
||||
cy.get('.overlay-panel .form-input-sm').should('have.length.gte', 1)
|
||||
})
|
||||
|
||||
it('can close the editor overlay', () => {
|
||||
cy.get('.recipe-row .row-info').first().click()
|
||||
cy.get('.overlay-panel', { timeout: 5000 }).should('be.visible')
|
||||
// Close via the close button
|
||||
cy.get('.overlay-panel .btn-close').click()
|
||||
cy.get('.overlay-panel').should('not.exist')
|
||||
})
|
||||
|
||||
it('can close the editor with cancel button', () => {
|
||||
cy.get('.recipe-row .row-info').first().click()
|
||||
cy.get('.overlay-panel', { timeout: 5000 }).should('be.visible')
|
||||
cy.get('.overlay-panel').contains('取消').click()
|
||||
cy.get('.overlay-panel').should('not.exist')
|
||||
})
|
||||
|
||||
it('tag filter bar toggles', () => {
|
||||
// Look for any tag-related toggle button
|
||||
cy.get('body').then($body => {
|
||||
const hasToggle = $body.find('.tag-toggle-btn, [class*="tag-filter"] button, button:contains("标签")').length > 0
|
||||
if (hasToggle) {
|
||||
cy.get('.tag-toggle-btn, [class*="tag-filter"] button, button').contains('标签').first().click()
|
||||
cy.wait(500)
|
||||
// Tag area should exist after toggle
|
||||
cy.get('[class*="tag"]').should('exist')
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
it('shows recipe cost in each row', () => {
|
||||
cy.get('.row-cost').first().should('not.be.empty')
|
||||
cy.get('.row-cost').first().invoke('text').should('contain', '¥')
|
||||
})
|
||||
|
||||
it('has add recipe button that opens overlay', () => {
|
||||
cy.get('.manage-toolbar').contains('添加配方').click()
|
||||
cy.get('.overlay-panel', { timeout: 5000 }).should('be.visible')
|
||||
cy.contains('添加配方').should('be.visible')
|
||||
// Close it
|
||||
cy.get('.overlay-panel .btn-close').click()
|
||||
})
|
||||
})
|
||||
@@ -1,38 +0,0 @@
|
||||
describe('Notification Flow', () => {
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
const authHeaders = { Authorization: `Bearer ${ADMIN_TOKEN}` }
|
||||
|
||||
it('fetches notifications', () => {
|
||||
cy.request({ url: '/api/notifications', headers: authHeaders }).then(res => {
|
||||
expect(res.status).to.eq(200)
|
||||
expect(res.body).to.be.an('array')
|
||||
})
|
||||
})
|
||||
|
||||
it('each notification has required fields', () => {
|
||||
cy.request({ url: '/api/notifications', headers: authHeaders }).then(res => {
|
||||
if (res.body.length > 0) {
|
||||
const n = res.body[0]
|
||||
expect(n).to.have.property('title')
|
||||
expect(n).to.have.property('is_read')
|
||||
expect(n).to.have.property('created_at')
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
it('can mark all notifications as read', () => {
|
||||
cy.request({
|
||||
method: 'POST', url: '/api/notifications/read-all',
|
||||
headers: authHeaders, body: {}
|
||||
}).then(res => {
|
||||
expect(res.status).to.eq(200)
|
||||
})
|
||||
})
|
||||
|
||||
it('all notifications are now read', () => {
|
||||
cy.request({ url: '/api/notifications', headers: authHeaders }).then(res => {
|
||||
const unread = res.body.filter(n => !n.is_read)
|
||||
expect(unread).to.have.length(0)
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -25,7 +25,7 @@ describe('Oil Data Integrity', () => {
|
||||
const ppd = oil.bottle_price / oil.drop_count
|
||||
expect(ppd).to.be.a('number')
|
||||
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
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
@@ -1,32 +1,32 @@
|
||||
describe('Oil Reference Page', () => {
|
||||
beforeEach(() => {
|
||||
cy.visit('/oils')
|
||||
cy.get('.oil-chip, .oils-grid', { timeout: 10000 }).should('exist')
|
||||
cy.get('.oil-card, .oils-grid', { timeout: 10000 }).should('exist')
|
||||
})
|
||||
|
||||
it('displays oil grid with items', () => {
|
||||
cy.contains('精油价目').should('be.visible')
|
||||
cy.get('.oil-chip').should('have.length.gte', 10)
|
||||
cy.get('.oil-card').should('have.length.gte', 10)
|
||||
})
|
||||
|
||||
it('shows oil name and price on each chip', () => {
|
||||
cy.get('.oil-chip').first().should('contain', '¥')
|
||||
cy.get('.oil-card').first().should('contain', '¥')
|
||||
})
|
||||
|
||||
it('filters oils by search', () => {
|
||||
cy.get('.oil-chip').then($chips => {
|
||||
cy.get('.oil-card').then($chips => {
|
||||
const initial = $chips.length
|
||||
cy.get('input[placeholder*="搜索精油"]').type('薰衣草')
|
||||
cy.wait(300)
|
||||
cy.get('.oil-chip').should('have.length.lt', initial)
|
||||
cy.get('.oil-card').should('have.length.lt', initial)
|
||||
})
|
||||
})
|
||||
|
||||
it('toggles between bottle and drop price view', () => {
|
||||
cy.get('.oil-chip').first().invoke('text').then(textBefore => {
|
||||
cy.get('.oil-card').first().invoke('text').then(textBefore => {
|
||||
cy.contains('滴价').click()
|
||||
cy.wait(300)
|
||||
cy.get('.oil-chip').first().invoke('text').should('not.eq', textBefore)
|
||||
cy.get('.oil-card').first().invoke('text').should('not.eq', textBefore)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
@@ -38,7 +38,7 @@ describe('Performance', () => {
|
||||
it('oil reference page loads within 3 seconds', () => {
|
||||
const start = Date.now()
|
||||
cy.visit('/oils')
|
||||
cy.get('.oil-chip', { timeout: 3000 }).should('have.length.gte', 1)
|
||||
cy.get('.oil-card', { timeout: 3000 }).should('have.length.gte', 1)
|
||||
cy.then(() => {
|
||||
expect(Date.now() - start).to.be.lt(3000)
|
||||
})
|
||||
|
||||
@@ -1,39 +0,0 @@
|
||||
describe('Price Display Regression', () => {
|
||||
it('recipe cards show non-zero prices', () => {
|
||||
cy.visit('/')
|
||||
cy.get('.recipe-card', { timeout: 10000 }).should('have.length.gte', 1)
|
||||
cy.wait(2000) // wait for oils store to load and re-render
|
||||
|
||||
// Check via .recipe-card-price elements which hold the formatted cost
|
||||
cy.get('.recipe-card-price').first().invoke('text').then(text => {
|
||||
const match = text.match(/¥\s*(\d+\.?\d*)/)
|
||||
expect(match, 'Card price should contain ¥').to.not.be.null
|
||||
expect(parseFloat(match[1]), 'Price should be > 0').to.be.gt(0)
|
||||
})
|
||||
})
|
||||
|
||||
it('oil reference page shows non-zero prices', () => {
|
||||
cy.visit('/oils')
|
||||
cy.get('.oil-card', { timeout: 10000 }).should('have.length.gte', 1)
|
||||
cy.wait(500)
|
||||
|
||||
cy.get('.oil-card').first().invoke('text').then(text => {
|
||||
const match = text.match(/¥\s*(\d+\.?\d*)/)
|
||||
expect(match, 'Oil card should contain a price').to.not.be.null
|
||||
expect(parseFloat(match[1])).to.be.gt(0)
|
||||
})
|
||||
})
|
||||
|
||||
it('recipe detail shows non-zero total cost', () => {
|
||||
cy.visit('/')
|
||||
cy.get('.recipe-card', { timeout: 10000 }).first().click()
|
||||
cy.wait(1000)
|
||||
|
||||
// Look for any ¥ amount > 0 in the detail overlay
|
||||
cy.get('[class*="overlay"], [class*="detail"]').invoke('text').then(text => {
|
||||
const prices = [...text.matchAll(/¥\s*(\d+\.?\d*)/g)].map(m => parseFloat(m[1]))
|
||||
const nonZero = prices.filter(p => p > 0)
|
||||
expect(nonZero.length, 'Detail should show at least one non-zero price').to.be.gte(1)
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -1,85 +0,0 @@
|
||||
describe('Projects Flow', () => {
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
const authHeaders = { Authorization: `Bearer ${ADMIN_TOKEN}` }
|
||||
let testProjectId = null
|
||||
|
||||
it('creates a project', () => {
|
||||
cy.request({
|
||||
method: 'POST', url: '/api/projects', headers: authHeaders,
|
||||
body: {
|
||||
name: 'Cypress测试项目',
|
||||
ingredients: JSON.stringify([{ oil: '薰衣草', drops: 5 }, { oil: '乳香', drops: 3 }]),
|
||||
pricing: 100,
|
||||
note: 'E2E test project'
|
||||
}
|
||||
}).then(res => {
|
||||
expect(res.status).to.be.oneOf([200, 201])
|
||||
testProjectId = res.body.id
|
||||
})
|
||||
})
|
||||
|
||||
it('lists projects', () => {
|
||||
cy.request({ url: '/api/projects', headers: authHeaders }).then(res => {
|
||||
expect(res.body).to.be.an('array')
|
||||
const found = res.body.find(p => p.name === 'Cypress测试项目')
|
||||
expect(found).to.exist
|
||||
testProjectId = found.id
|
||||
})
|
||||
})
|
||||
|
||||
it('updates the project pricing', () => {
|
||||
cy.request({ url: '/api/projects', headers: authHeaders }).then(res => {
|
||||
const found = res.body.find(p => p.name === 'Cypress测试项目')
|
||||
testProjectId = found.id
|
||||
cy.request({
|
||||
method: 'PUT', url: `/api/projects/${testProjectId}`, headers: authHeaders,
|
||||
body: { pricing: 200, note: 'updated pricing' }
|
||||
}).then(r => expect(r.status).to.eq(200))
|
||||
})
|
||||
})
|
||||
|
||||
it('verifies update', () => {
|
||||
cy.request({ url: '/api/projects', headers: authHeaders }).then(res => {
|
||||
const found = res.body.find(p => p.name === 'Cypress测试项目')
|
||||
expect(found.pricing).to.eq(200)
|
||||
})
|
||||
})
|
||||
|
||||
it('project profit calculation is correct', () => {
|
||||
// Fetch oils to calculate expected cost
|
||||
cy.request('/api/oils').then(oilRes => {
|
||||
const oilMap = {}
|
||||
oilRes.body.forEach(o => { oilMap[o.name] = o.bottle_price / o.drop_count })
|
||||
|
||||
cy.request({ url: '/api/projects', headers: authHeaders }).then(res => {
|
||||
const proj = res.body.find(p => p.name === 'Cypress测试项目')
|
||||
const ings = JSON.parse(proj.ingredients)
|
||||
const cost = ings.reduce((s, i) => s + (oilMap[i.oil] || 0) * i.drops, 0)
|
||||
const profit = proj.pricing - cost
|
||||
expect(profit).to.be.gt(0) // pricing(200) > cost
|
||||
expect(cost).to.be.gt(0)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
it('deletes the project', () => {
|
||||
cy.request({ url: '/api/projects', headers: authHeaders }).then(res => {
|
||||
const found = res.body.find(p => p.name === 'Cypress测试项目')
|
||||
if (found) {
|
||||
cy.request({
|
||||
method: 'DELETE', url: `/api/projects/${found.id}`, headers: authHeaders
|
||||
}).then(r => expect(r.status).to.eq(200))
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
after(() => {
|
||||
cy.request({ url: '/api/projects', headers: authHeaders, failOnStatusCode: false }).then(res => {
|
||||
if (res.status === 200 && Array.isArray(res.body)) {
|
||||
res.body.filter(p => p.name && p.name.includes('Cypress')).forEach(p => {
|
||||
cy.request({ method: 'DELETE', url: `/api/projects/${p.id}`, headers: authHeaders, failOnStatusCode: false })
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -1,88 +0,0 @@
|
||||
describe('Recipe Cost Parity Test', () => {
|
||||
// Verify recipe cost formula: cost = sum(bottle_price / drop_count * drops)
|
||||
|
||||
let oilsMap = {}
|
||||
let testRecipes = []
|
||||
|
||||
before(() => {
|
||||
cy.request('/api/oils').then(res => {
|
||||
res.body.forEach(oil => {
|
||||
oilsMap[oil.name] = {
|
||||
bottle_price: oil.bottle_price,
|
||||
drop_count: oil.drop_count,
|
||||
ppd: oil.drop_count ? oil.bottle_price / oil.drop_count : 0,
|
||||
retail_price: oil.retail_price
|
||||
}
|
||||
})
|
||||
})
|
||||
cy.request('/api/recipes').then(res => {
|
||||
testRecipes = res.body.slice(0, 20)
|
||||
})
|
||||
})
|
||||
|
||||
it('oil data has correct structure (137+ oils)', () => {
|
||||
expect(Object.keys(oilsMap).length).to.be.gte(100)
|
||||
const lav = oilsMap['薰衣草']
|
||||
expect(lav).to.exist
|
||||
expect(lav.bottle_price).to.be.gt(0)
|
||||
expect(lav.drop_count).to.be.gt(0)
|
||||
})
|
||||
|
||||
it('price-per-drop matches formula for common oils', () => {
|
||||
const checks = ['薰衣草', '乳香', '茶树', '柠檬', '椒样薄荷']
|
||||
checks.forEach(name => {
|
||||
const oil = oilsMap[name]
|
||||
if (oil) {
|
||||
const expected = oil.bottle_price / oil.drop_count
|
||||
expect(oil.ppd).to.be.closeTo(expected, 0.0001)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
it('calculates cost for each of first 20 recipes', () => {
|
||||
testRecipes.forEach(recipe => {
|
||||
let cost = 0
|
||||
recipe.ingredients.forEach(ing => {
|
||||
const oil = oilsMap[ing.oil_name]
|
||||
if (oil) cost += oil.ppd * ing.drops
|
||||
})
|
||||
expect(cost).to.be.gte(0)
|
||||
})
|
||||
})
|
||||
|
||||
it('retail price >= wholesale for oils that have it', () => {
|
||||
Object.entries(oilsMap).forEach(([name, oil]) => {
|
||||
if (oil.retail_price && oil.retail_price > 0) {
|
||||
expect(oil.retail_price).to.be.gte(oil.bottle_price)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
it('no recipe has all-zero cost', () => {
|
||||
let zeroCostCount = 0
|
||||
testRecipes.forEach(recipe => {
|
||||
let cost = 0
|
||||
recipe.ingredients.forEach(ing => {
|
||||
const oil = oilsMap[ing.oil_name]
|
||||
if (oil) cost += oil.ppd * ing.drops
|
||||
})
|
||||
if (cost === 0) zeroCostCount++
|
||||
})
|
||||
expect(zeroCostCount).to.be.lt(testRecipes.length)
|
||||
})
|
||||
|
||||
it('cost formula is consistent: two calculation methods agree', () => {
|
||||
testRecipes.forEach(recipe => {
|
||||
const costs = recipe.ingredients.map(ing => {
|
||||
const oil = oilsMap[ing.oil_name]
|
||||
return oil ? oil.ppd * ing.drops : 0
|
||||
})
|
||||
const fromMap = costs.reduce((a, b) => a + b, 0)
|
||||
const fromReduce = recipe.ingredients.reduce((s, ing) => {
|
||||
const oil = oilsMap[ing.oil_name]
|
||||
return s + (oil ? oil.ppd * ing.drops : 0)
|
||||
}, 0)
|
||||
expect(fromMap).to.be.closeTo(fromReduce, 0.001)
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -1,80 +1,84 @@
|
||||
function dismissModals() {
|
||||
cy.get('body').then($body => {
|
||||
if ($body.find('.login-overlay').length) {
|
||||
cy.get('.login-overlay').click('topLeft')
|
||||
}
|
||||
if ($body.find('.dialog-overlay').length) {
|
||||
cy.get('.dialog-btn-primary').click()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
describe('Recipe Detail', () => {
|
||||
beforeEach(() => {
|
||||
cy.visit('/')
|
||||
cy.get('.recipe-card', { timeout: 10000 }).should('have.length.gte', 1)
|
||||
dismissModals()
|
||||
})
|
||||
|
||||
it('opens detail panel when clicking a recipe card', () => {
|
||||
it('opens detail overlay when clicking a recipe card', () => {
|
||||
cy.get('.recipe-card').first().click()
|
||||
dismissModals()
|
||||
cy.get('.detail-overlay').should('exist')
|
||||
cy.get('[class*="overlay"], [class*="detail"]').should('be.visible')
|
||||
})
|
||||
|
||||
it('shows recipe name in detail view', () => {
|
||||
cy.get('.recipe-card').first().click()
|
||||
dismissModals()
|
||||
cy.get('.detail-overlay').should('exist')
|
||||
// Get recipe name from card, however it's structured
|
||||
cy.get('.recipe-card').first().invoke('text').then(cardText => {
|
||||
cy.get('.recipe-card').first().click()
|
||||
cy.wait(500)
|
||||
// The detail view should show some text from the card
|
||||
cy.get('[class*="overlay"], [class*="detail"]').should('be.visible')
|
||||
})
|
||||
})
|
||||
|
||||
it('shows ingredient info with drops', () => {
|
||||
cy.get('.recipe-card').first().click()
|
||||
dismissModals()
|
||||
cy.wait(500)
|
||||
cy.contains('滴').should('exist')
|
||||
})
|
||||
|
||||
it('shows cost with ¥ symbol', () => {
|
||||
cy.get('.recipe-card').first().click()
|
||||
dismissModals()
|
||||
cy.wait(500)
|
||||
cy.contains('¥').should('exist')
|
||||
})
|
||||
|
||||
it('closes detail panel when clicking close button', () => {
|
||||
it('closes detail overlay when clicking close button', () => {
|
||||
cy.get('.recipe-card').first().click()
|
||||
dismissModals()
|
||||
cy.get('.detail-overlay').should('exist')
|
||||
cy.get('.detail-close-btn').first().click({ force: true })
|
||||
cy.get('[class*="overlay"], [class*="detail"]').should('be.visible')
|
||||
cy.get('button').contains(/✕|关闭|←/).first().click()
|
||||
cy.get('.recipe-card').should('be.visible')
|
||||
})
|
||||
|
||||
it('shows action buttons in detail', () => {
|
||||
cy.get('.recipe-card').first().click()
|
||||
dismissModals()
|
||||
cy.get('.detail-overlay button').should('have.length.gte', 1)
|
||||
cy.wait(500)
|
||||
// Should have at least one action button
|
||||
cy.get('[class*="overlay"] button, [class*="detail"] button').should('have.length.gte', 1)
|
||||
})
|
||||
|
||||
it('shows favorite star on recipe cards', () => {
|
||||
cy.get('.fav-btn').first().should('exist')
|
||||
})
|
||||
})
|
||||
|
||||
describe('Recipe Detail - Card View', () => {
|
||||
beforeEach(() => {
|
||||
cy.visit('/')
|
||||
cy.get('.recipe-card', { timeout: 10000 }).should('have.length.gte', 1)
|
||||
dismissModals()
|
||||
it('shows favorite star', () => {
|
||||
cy.get('.recipe-card').first().click()
|
||||
dismissModals()
|
||||
})
|
||||
|
||||
it('shows export card with doTERRA branding', () => {
|
||||
cy.get('.export-card').should('exist')
|
||||
cy.contains('doTERRA').should('exist')
|
||||
})
|
||||
|
||||
it('shows language toggle', () => {
|
||||
cy.contains('中文').should('exist')
|
||||
cy.contains('English').should('exist')
|
||||
cy.wait(500)
|
||||
cy.contains(/★|☆|收藏/).should('exist')
|
||||
})
|
||||
})
|
||||
|
||||
describe('Recipe Detail - Editor (Admin)', () => {
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
|
||||
beforeEach(() => {
|
||||
cy.visit('/', {
|
||||
onBeforeLoad(win) {
|
||||
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
||||
}
|
||||
})
|
||||
cy.get('.recipe-card', { timeout: 10000 }).should('have.length.gte', 1)
|
||||
})
|
||||
|
||||
it('shows edit button for admin', () => {
|
||||
cy.get('.recipe-card').first().click()
|
||||
cy.wait(500)
|
||||
cy.contains(/编辑|✏/).should('exist')
|
||||
})
|
||||
|
||||
it('can switch to editor view', () => {
|
||||
cy.get('.recipe-card').first().click()
|
||||
cy.contains(/编辑|✏/).first().click()
|
||||
cy.get('select, input[type="number"], .oil-select, .drops-input').should('exist')
|
||||
})
|
||||
|
||||
it('editor shows save button', () => {
|
||||
cy.get('.recipe-card').first().click()
|
||||
cy.contains(/编辑|✏/).first().click()
|
||||
cy.contains(/保存|💾/).should('exist')
|
||||
})
|
||||
})
|
||||
|
||||
@@ -1,56 +0,0 @@
|
||||
describe('Registration Flow', () => {
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
const authHeaders = { Authorization: `Bearer ${ADMIN_TOKEN}` }
|
||||
const TEST_USER = 'cypress_test_register_' + Date.now()
|
||||
|
||||
it('can register a new user via API', () => {
|
||||
cy.request({
|
||||
method: 'POST', url: '/api/register',
|
||||
body: { username: TEST_USER, password: 'test1234', display_name: 'Cypress注册测试' },
|
||||
failOnStatusCode: false
|
||||
}).then(res => {
|
||||
// Registration may or may not be implemented
|
||||
if (res.status === 200 || res.status === 201) {
|
||||
expect(res.body).to.have.property('token')
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
it('registered user can authenticate', () => {
|
||||
cy.request({
|
||||
method: 'POST', url: '/api/login',
|
||||
body: { username: TEST_USER, password: 'test1234' },
|
||||
failOnStatusCode: false
|
||||
}).then(res => {
|
||||
if (res.status === 200) {
|
||||
expect(res.body).to.have.property('token')
|
||||
expect(res.body.token).to.be.a('string')
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
it('rejects duplicate username', () => {
|
||||
cy.request({
|
||||
method: 'POST', url: '/api/register',
|
||||
body: { username: TEST_USER, password: 'another123', display_name: 'Duplicate' },
|
||||
failOnStatusCode: false
|
||||
}).then(res => {
|
||||
// Should fail with 400 or 409
|
||||
if (res.status !== 404) { // 404 means register endpoint doesn't exist
|
||||
expect(res.status).to.be.oneOf([400, 409, 422])
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
after(() => {
|
||||
// Cleanup: delete test user via admin
|
||||
cy.request({ url: '/api/users', headers: authHeaders, failOnStatusCode: false }).then(res => {
|
||||
if (res.status === 200) {
|
||||
const testUser = res.body.find(u => u.username === TEST_USER)
|
||||
if (testUser) {
|
||||
cy.request({ method: 'DELETE', url: `/api/users/${testUser.id}`, headers: authHeaders, failOnStatusCode: false })
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -35,7 +35,7 @@ describe('Responsive Design', () => {
|
||||
it('oil reference page works on mobile', () => {
|
||||
cy.visit('/oils')
|
||||
cy.contains('精油价目').should('be.visible')
|
||||
cy.get('.oil-chip').should('have.length.gte', 1)
|
||||
cy.get('.oil-card').should('have.length.gte', 1)
|
||||
})
|
||||
})
|
||||
|
||||
@@ -51,7 +51,7 @@ describe('Responsive Design', () => {
|
||||
|
||||
it('oil grid shows multiple columns', () => {
|
||||
cy.visit('/oils')
|
||||
cy.get('.oil-chip', { timeout: 10000 }).should('have.length.gte', 1)
|
||||
cy.get('.oil-card', { timeout: 10000 }).should('have.length.gte', 1)
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
@@ -1,239 +0,0 @@
|
||||
describe('User Management Flow', () => {
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
const authHeaders = { Authorization: `Bearer ${ADMIN_TOKEN}` }
|
||||
const TEST_USERNAME = 'cypress_test_user_e2e'
|
||||
const TEST_DISPLAY_NAME = 'Cypress E2E Test User'
|
||||
let testUserId = null
|
||||
|
||||
describe('API: user lifecycle', () => {
|
||||
// Cleanup any leftover test user first
|
||||
before(() => {
|
||||
cy.request({
|
||||
url: '/api/users',
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
const leftover = res.body.find(u => u.username === TEST_USERNAME)
|
||||
if (leftover) {
|
||||
cy.request({
|
||||
method: 'DELETE',
|
||||
url: `/api/users/${leftover.id || leftover._id}`,
|
||||
headers: authHeaders,
|
||||
failOnStatusCode: false
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
it('creates a new test user via API', () => {
|
||||
cy.request({
|
||||
method: 'POST',
|
||||
url: '/api/users',
|
||||
headers: authHeaders,
|
||||
body: {
|
||||
username: TEST_USERNAME,
|
||||
display_name: TEST_DISPLAY_NAME,
|
||||
role: 'viewer'
|
||||
}
|
||||
}).then(res => {
|
||||
expect(res.status).to.be.oneOf([200, 201])
|
||||
testUserId = res.body.id || res.body._id
|
||||
// Should return a token for the new user
|
||||
if (res.body.token) {
|
||||
expect(res.body.token).to.be.a('string')
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
it('verifies the user appears in the user list', () => {
|
||||
cy.request({
|
||||
url: '/api/users',
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
expect(res.body).to.be.an('array')
|
||||
const found = res.body.find(u => u.username === TEST_USERNAME)
|
||||
expect(found).to.exist
|
||||
expect(found.display_name).to.eq(TEST_DISPLAY_NAME)
|
||||
expect(found.role).to.eq('viewer')
|
||||
testUserId = found.id || found._id
|
||||
})
|
||||
})
|
||||
|
||||
it('updates user role to editor', () => {
|
||||
cy.request({
|
||||
url: '/api/users',
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
const found = res.body.find(u => u.username === TEST_USERNAME)
|
||||
testUserId = found.id || found._id
|
||||
cy.request({
|
||||
method: 'PUT',
|
||||
url: `/api/users/${testUserId}`,
|
||||
headers: authHeaders,
|
||||
body: { role: 'editor' }
|
||||
}).then(res => {
|
||||
expect(res.status).to.eq(200)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
it('verifies role was updated', () => {
|
||||
cy.request({
|
||||
url: '/api/users',
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
const found = res.body.find(u => u.username === TEST_USERNAME)
|
||||
expect(found.role).to.eq('editor')
|
||||
})
|
||||
})
|
||||
|
||||
it('deletes the test user', () => {
|
||||
cy.request({
|
||||
url: '/api/users',
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
const found = res.body.find(u => u.username === TEST_USERNAME)
|
||||
if (found) {
|
||||
testUserId = found.id || found._id
|
||||
cy.request({
|
||||
method: 'DELETE',
|
||||
url: `/api/users/${testUserId}`,
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
expect(res.status).to.eq(200)
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
it('verifies the user is deleted', () => {
|
||||
cy.request({
|
||||
url: '/api/users',
|
||||
headers: authHeaders
|
||||
}).then(res => {
|
||||
const found = res.body.find(u => u.username === TEST_USERNAME)
|
||||
expect(found).to.not.exist
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('UI: users page renders', () => {
|
||||
it('visits /users and verifies page structure', () => {
|
||||
cy.visit('/users', {
|
||||
onBeforeLoad(win) {
|
||||
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
||||
}
|
||||
})
|
||||
cy.get('.user-management', { timeout: 10000 }).should('exist')
|
||||
cy.contains('用户管理').should('be.visible')
|
||||
})
|
||||
|
||||
it('shows search input and role filter buttons', () => {
|
||||
cy.visit('/users', {
|
||||
onBeforeLoad(win) {
|
||||
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
||||
}
|
||||
})
|
||||
cy.get('.user-management', { timeout: 10000 }).should('exist')
|
||||
// Search box
|
||||
cy.get('.search-input').should('exist')
|
||||
// Role filter buttons
|
||||
cy.get('.filter-btn').should('have.length.gte', 1)
|
||||
cy.get('.filter-btn').contains('管理员').should('exist')
|
||||
cy.get('.filter-btn').contains('编辑').should('exist')
|
||||
cy.get('.filter-btn').contains('查看者').should('exist')
|
||||
})
|
||||
|
||||
it('displays user list with user cards', () => {
|
||||
cy.visit('/users', {
|
||||
onBeforeLoad(win) {
|
||||
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
||||
}
|
||||
})
|
||||
cy.get('.user-management', { timeout: 10000 }).should('exist')
|
||||
cy.get('.user-card', { timeout: 5000 }).should('have.length.gte', 1)
|
||||
// Each card shows name and role
|
||||
cy.get('.user-card').first().within(() => {
|
||||
cy.get('.user-name').should('not.be.empty')
|
||||
cy.get('.user-role-badge').should('exist')
|
||||
})
|
||||
})
|
||||
|
||||
it('search filters users', () => {
|
||||
cy.visit('/users', {
|
||||
onBeforeLoad(win) {
|
||||
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
||||
}
|
||||
})
|
||||
cy.get('.user-management', { timeout: 10000 }).should('exist')
|
||||
cy.get('.user-card').then($cards => {
|
||||
const total = $cards.length
|
||||
// Search for something specific
|
||||
cy.get('.search-input').type('admin')
|
||||
cy.wait(300)
|
||||
cy.get('.user-card').should('have.length.lte', total)
|
||||
})
|
||||
})
|
||||
|
||||
it('role filter narrows user list', () => {
|
||||
cy.visit('/users', {
|
||||
onBeforeLoad(win) {
|
||||
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
||||
}
|
||||
})
|
||||
cy.get('.user-management', { timeout: 10000 }).should('exist')
|
||||
cy.get('.user-card').then($cards => {
|
||||
const total = $cards.length
|
||||
// Click a role filter
|
||||
cy.get('.filter-btn').contains('管理员').click()
|
||||
cy.wait(300)
|
||||
cy.get('.user-card').should('have.length.lte', total)
|
||||
// Clicking again deactivates the filter
|
||||
cy.get('.filter-btn').contains('管理员').click()
|
||||
cy.wait(300)
|
||||
cy.get('.user-card').should('have.length', total)
|
||||
})
|
||||
})
|
||||
|
||||
it('shows user count', () => {
|
||||
cy.visit('/users', {
|
||||
onBeforeLoad(win) {
|
||||
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
||||
}
|
||||
})
|
||||
cy.get('.user-management', { timeout: 10000 }).should('exist')
|
||||
cy.get('.user-count').should('contain', '个用户')
|
||||
})
|
||||
|
||||
it('has create user section', () => {
|
||||
cy.visit('/users', {
|
||||
onBeforeLoad(win) {
|
||||
win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN)
|
||||
}
|
||||
})
|
||||
cy.get('.user-management', { timeout: 10000 }).should('exist')
|
||||
cy.get('.create-section').should('exist')
|
||||
cy.contains('创建新用户').should('be.visible')
|
||||
})
|
||||
})
|
||||
|
||||
// Safety cleanup
|
||||
after(() => {
|
||||
cy.request({
|
||||
url: '/api/users',
|
||||
headers: authHeaders,
|
||||
failOnStatusCode: false
|
||||
}).then(res => {
|
||||
if (res.status === 200 && Array.isArray(res.body)) {
|
||||
const testUsers = res.body.filter(u => u.username === TEST_USERNAME)
|
||||
testUsers.forEach(user => {
|
||||
cy.request({
|
||||
method: 'DELETE',
|
||||
url: `/api/users/${user.id || user._id}`,
|
||||
headers: authHeaders,
|
||||
failOnStatusCode: false
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -1,55 +0,0 @@
|
||||
// Quick visual screenshots for manual review before deploy
|
||||
const ADMIN_TOKEN = 'c86ae7afbe10fabe3c1d5e1a7fee74feaadfd5dc7be2ab62'
|
||||
|
||||
describe('Visual Check - Screenshots', () => {
|
||||
it('homepage with recipes', () => {
|
||||
cy.visit('/', { onBeforeLoad(win) { win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN) } })
|
||||
cy.get('.recipe-card', { timeout: 10000 }).should('have.length.gte', 1)
|
||||
cy.wait(1000)
|
||||
cy.screenshot('01-homepage')
|
||||
})
|
||||
|
||||
it('recipe detail overlay', () => {
|
||||
cy.visit('/', { onBeforeLoad(win) { win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN) } })
|
||||
cy.get('.recipe-card', { timeout: 10000 }).first().click()
|
||||
cy.wait(1000)
|
||||
cy.screenshot('02-recipe-detail')
|
||||
})
|
||||
|
||||
it('oil reference page', () => {
|
||||
cy.visit('/oils', { onBeforeLoad(win) { win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN) } })
|
||||
cy.get('.oil-chip', { timeout: 10000 }).should('have.length.gte', 1)
|
||||
cy.wait(500)
|
||||
cy.screenshot('03-oil-reference')
|
||||
})
|
||||
|
||||
it('manage recipes page', () => {
|
||||
cy.visit('/manage', { onBeforeLoad(win) { win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN) } })
|
||||
cy.wait(2000)
|
||||
cy.screenshot('04-manage-recipes')
|
||||
})
|
||||
|
||||
it('inventory page', () => {
|
||||
cy.visit('/inventory', { onBeforeLoad(win) { win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN) } })
|
||||
cy.wait(1500)
|
||||
cy.screenshot('05-inventory')
|
||||
})
|
||||
|
||||
it('check if recipe cards show price > 0', () => {
|
||||
cy.visit('/', { onBeforeLoad(win) { win.localStorage.setItem('oil_auth_token', ADMIN_TOKEN) } })
|
||||
cy.get('.recipe-card', { timeout: 10000 }).should('have.length.gte', 1)
|
||||
// Check if any card shows a non-zero price
|
||||
cy.get('.recipe-card').first().invoke('text').then(text => {
|
||||
cy.log('First card text: ' + text)
|
||||
// Check if it contains a price like ¥ X.XX where X > 0
|
||||
const priceMatch = text.match(/¥\s*(\d+\.?\d*)/)
|
||||
if (priceMatch) {
|
||||
cy.log('Price found: ¥' + priceMatch[1])
|
||||
const price = parseFloat(priceMatch[1])
|
||||
expect(price, 'Recipe card should show price > 0').to.be.gt(0)
|
||||
} else {
|
||||
cy.log('WARNING: No price found on recipe card')
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -1,6 +1,4 @@
|
||||
// Ignore uncaught exceptions from the Vue app during E2E tests.
|
||||
// Vue components may throw on API errors, missing data, etc.
|
||||
// These are tracked separately; E2E tests focus on user-visible behavior.
|
||||
// Ignore uncaught exceptions from the app (API errors during loading, etc.)
|
||||
Cypress.on('uncaught:exception', () => false)
|
||||
|
||||
// Custom commands for the oil calculator app
|
||||
|
||||
1464
frontend/package-lock.json
generated
1464
frontend/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -9,25 +9,18 @@
|
||||
"preview": "vite preview",
|
||||
"cy:open": "cypress open",
|
||||
"cy:run": "cypress run",
|
||||
"test:e2e": "cypress run",
|
||||
"test:unit": "vitest run",
|
||||
"test": "vitest run && cypress run"
|
||||
"test:e2e": "cypress run"
|
||||
},
|
||||
"dependencies": {
|
||||
"exceljs": "^4.4.0",
|
||||
"heic2any": "^0.0.4",
|
||||
"html2canvas": "^1.4.1",
|
||||
"pinia": "^2.3.1",
|
||||
"vue": "^3.5.32",
|
||||
"vue-router": "^4.6.4",
|
||||
"xlsx": "^0.18.5"
|
||||
"vue-router": "^4.6.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vitejs/plugin-vue": "^6.0.5",
|
||||
"@vue/test-utils": "^2.4.6",
|
||||
"cypress": "^15.13.0",
|
||||
"jsdom": "^29.0.1",
|
||||
"vite": "^8.0.4",
|
||||
"vitest": "^4.1.2"
|
||||
"vite": "^8.0.4"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,44 +1,56 @@
|
||||
<template>
|
||||
<div v-if="isPreview" style="background:#e65100;color:white;text-align:center;padding:6px 16px;font-size:13px;font-weight:600;letter-spacing:0.5px;position:sticky;top:0;z-index:100">
|
||||
⚠️ 预览环境 · PR #{{ prId }} · 数据为生产副本，修改不影响正式环境
|
||||
</div>
|
||||
<div class="app-header">
|
||||
<div class="header-inner">
|
||||
<div class="header-left">
|
||||
<div class="header-icon">🌿</div>
|
||||
<div class="header-title">
|
||||
<h1>doTERRA 配方计算器</h1>
|
||||
<p>查询配方 · 计算成本 · 自制配方 · 导出卡片 · 精油知识</p>
|
||||
<p v-if="auth.isAdmin" class="version-info">v2.0.0 · 2026-04-10</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header-right" @click="toggleUserMenu">
|
||||
<template v-if="auth.isLoggedIn">
|
||||
<span v-if="auth.isBusiness" class="biz-badge" title="商业认证用户">🏢</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 v-else>
|
||||
<span class="login-btn">登录</span>
|
||||
</template>
|
||||
<div class="app-header" style="position:relative">
|
||||
<div class="header-inner" style="padding-right:80px">
|
||||
<div class="header-icon">🌿</div>
|
||||
<div class="header-title" style="text-align:left;flex:1">
|
||||
<h1 style="display:flex;justify-content:space-between;align-items:center;gap:8px;white-space:nowrap">
|
||||
<span style="flex-shrink:0">doTERRA 配方计算器
|
||||
<span v-if="auth.isAdmin" style="font-size:10px;font-weight:400;opacity:0.5;vertical-align:top">v2.2.0</span>
|
||||
</span>
|
||||
<span
|
||||
style="cursor:pointer;color:white;font-size:13px;font-weight:500;flex-shrink:0;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Hiragino Sans GB',sans-serif;letter-spacing:0.3px;opacity:0.95"
|
||||
@click="toggleUserMenu"
|
||||
>
|
||||
<template v-if="auth.isLoggedIn">
|
||||
👤 {{ auth.user.display_name || auth.user.username }} ▾
|
||||
</template>
|
||||
<template v-else>
|
||||
<span style="background:rgba(255,255,255,0.2);padding:4px 12px;border-radius:12px">登录</span>
|
||||
</template>
|
||||
</span>
|
||||
</h1>
|
||||
<p style="display:flex;flex-wrap:wrap;gap:4px 8px;margin:0">
|
||||
<span style="white-space:nowrap">查询配方</span>
|
||||
<span style="opacity:0.5">·</span>
|
||||
<span style="white-space:nowrap">计算成本</span>
|
||||
<span style="opacity:0.5">·</span>
|
||||
<span style="white-space:nowrap">自制配方</span>
|
||||
<span style="opacity:0.5">·</span>
|
||||
<span style="white-space:nowrap">导出卡片</span>
|
||||
<span style="opacity:0.5">·</span>
|
||||
<span style="white-space:nowrap">精油知识</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- User Menu Popup -->
|
||||
<UserMenu v-if="showUserMenu" @close="showUserMenu = false; loadUnreadCount()" />
|
||||
<UserMenu v-if="showUserMenu" @close="showUserMenu = false" />
|
||||
|
||||
<!-- Nav tabs -->
|
||||
<div class="nav-tabs" ref="navTabsRef" :style="isPreview ? { top: '36px' } : {}">
|
||||
<div v-for="tab in visibleTabs" :key="tab.key"
|
||||
class="nav-tab"
|
||||
:class="{ active: ui.currentSection === tab.key }"
|
||||
@click="handleTabClick(tab)"
|
||||
>{{ tab.icon }} {{ tab.label }}</div>
|
||||
<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 === '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 === 'oils' }" @click="goSection('oils')">💧 精油价目</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>
|
||||
|
||||
<!-- Main content -->
|
||||
<div class="main" @touchstart="onSwipeStart" @touchend="onSwipeEnd">
|
||||
<div class="main">
|
||||
<router-view />
|
||||
</div>
|
||||
|
||||
@@ -49,12 +61,12 @@
|
||||
<CustomDialog />
|
||||
|
||||
<!-- 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>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted, watch, nextTick } from 'vue'
|
||||
import { useRouter, useRoute } from 'vue-router'
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { useAuthStore } from './stores/auth'
|
||||
import { useOilsStore } from './stores/oils'
|
||||
import { useRecipesStore } from './stores/recipes'
|
||||
@@ -62,90 +74,17 @@ import { useUiStore } from './stores/ui'
|
||||
import LoginModal from './components/LoginModal.vue'
|
||||
import CustomDialog from './components/CustomDialog.vue'
|
||||
import UserMenu from './components/UserMenu.vue'
|
||||
import { api } from './composables/useApi'
|
||||
|
||||
const auth = useAuthStore()
|
||||
const oils = useOilsStore()
|
||||
const recipeStore = useRecipesStore()
|
||||
const ui = useUiStore()
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
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' },
|
||||
]
|
||||
|
||||
// 所有人都能看到大部分 tab，bug 和用户管理只有 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
|
||||
const routeToSection = { '/': 'search', '/manage': 'manage', '/inventory': 'inventory', '/oils': 'oils', '/projects': 'projects', '/mydiary': 'mydiary', '/audit': 'audit', '/bugs': 'bugs', '/users': 'users' }
|
||||
watch(() => route.path, (path) => {
|
||||
const section = routeToSection[path] || 'search'
|
||||
ui.showSection(section)
|
||||
nextTick(() => scrollActiveTabToCenter())
|
||||
}, { immediate: true })
|
||||
|
||||
// Preview environment detection: pr-{id}.oil.oci.euphon.net
|
||||
const hostname = window.location.hostname
|
||||
const prMatch = hostname.match(/^pr-(\d+)\./)
|
||||
const isPreview = !!prMatch
|
||||
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) {
|
||||
ui.showSection(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) {
|
||||
@@ -164,38 +103,6 @@ function toggleUserMenu() {
|
||||
showUserMenu.value = !showUserMenu.value
|
||||
}
|
||||
|
||||
// ── 左右滑动切换 tab ──
|
||||
// 滑动顺序 = visibleTabs 的顺序（根据用户角色动态决定）
|
||||
// 轮播区域（data-no-tab-swipe）内的滑动不触发 tab 切换
|
||||
const swipeStartX = ref(0)
|
||||
const swipeStartY = ref(0)
|
||||
|
||||
function onSwipeStart(e) {
|
||||
swipeStartX.value = e.touches[0].clientX
|
||||
swipeStartY.value = e.touches[0].clientY
|
||||
}
|
||||
|
||||
function onSwipeEnd(e) {
|
||||
const dx = e.changedTouches[0].clientX - swipeStartX.value
|
||||
const dy = e.changedTouches[0].clientY - swipeStartY.value
|
||||
// 必须是水平滑动 > 50px，且水平距离大于垂直距离
|
||||
if (Math.abs(dx) < 50 || Math.abs(dy) > Math.abs(dx)) return
|
||||
// 轮播区域内不触发 tab 切换
|
||||
if (e.target.closest && e.target.closest('[data-no-tab-swipe]')) return
|
||||
|
||||
const tabs = visibleTabs.value.map(t => t.key)
|
||||
const currentIdx = tabs.indexOf(ui.currentSection)
|
||||
if (currentIdx < 0) return
|
||||
|
||||
let nextIdx = -1
|
||||
if (dx < 0 && currentIdx < tabs.length - 1) nextIdx = currentIdx + 1
|
||||
else if (dx > 0 && currentIdx > 0) nextIdx = currentIdx - 1
|
||||
if (nextIdx >= 0) {
|
||||
const tab = visibleTabs.value[nextIdx]
|
||||
handleTabClick(tab)
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
await auth.initToken()
|
||||
await Promise.all([
|
||||
@@ -205,7 +112,6 @@ onMounted(async () => {
|
||||
])
|
||||
if (auth.isLoggedIn) {
|
||||
await recipeStore.loadFavorites()
|
||||
await loadUnreadCount()
|
||||
}
|
||||
|
||||
// Periodic refresh
|
||||
@@ -213,89 +119,7 @@ onMounted(async () => {
|
||||
if (document.visibilityState !== 'visible') return
|
||||
try {
|
||||
await auth.loadMe()
|
||||
await loadUnreadCount()
|
||||
} catch {}
|
||||
}, 15000)
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.header-inner {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.header-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
.header-icon { font-size: 36px; flex-shrink: 0; }
|
||||
.header-title { color: white; min-width: 0; }
|
||||
.header-title h1 {
|
||||
font-family: 'Noto Serif SC', serif;
|
||||
font-size: 22px;
|
||||
font-weight: 600;
|
||||
letter-spacing: 2px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.header-title p {
|
||||
font-size: 12px;
|
||||
opacity: 0.8;
|
||||
margin-top: 3px;
|
||||
letter-spacing: 0.5px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.version-info {
|
||||
font-size: 10px !important;
|
||||
opacity: 0.5 !important;
|
||||
margin-top: 1px !important;
|
||||
}
|
||||
.header-right {
|
||||
flex-shrink: 0;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
.user-name {
|
||||
color: white;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
opacity: 0.95;
|
||||
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 {
|
||||
color: white;
|
||||
background: rgba(255,255,255,0.2);
|
||||
padding: 5px 14px;
|
||||
border-radius: 12px;
|
||||
font-size: 13px;
|
||||
}
|
||||
.biz-badge { font-size: 14px; }
|
||||
@media (max-width: 480px) {
|
||||
.header-icon { font-size: 28px; }
|
||||
.header-title h1 { font-size: 18px; }
|
||||
.header-title p { font-size: 10px; }
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,118 +0,0 @@
|
||||
import { describe, it, expect, beforeEach } from 'vitest'
|
||||
import { dialogState, showAlert, showConfirm, showPrompt, closeDialog } from '../composables/useDialog'
|
||||
|
||||
// Reset dialog state before each test
|
||||
beforeEach(() => {
|
||||
dialogState.visible = false
|
||||
dialogState.type = 'alert'
|
||||
dialogState.message = ''
|
||||
dialogState.defaultValue = ''
|
||||
dialogState.resolve = null
|
||||
})
|
||||
|
||||
describe('Dialog System', () => {
|
||||
it('starts hidden', () => {
|
||||
expect(dialogState.visible).toBe(false)
|
||||
})
|
||||
|
||||
it('showAlert opens alert dialog', async () => {
|
||||
const promise = showAlert('test message')
|
||||
expect(dialogState.visible).toBe(true)
|
||||
expect(dialogState.type).toBe('alert')
|
||||
expect(dialogState.message).toBe('test message')
|
||||
closeDialog()
|
||||
await promise
|
||||
expect(dialogState.visible).toBe(false)
|
||||
})
|
||||
|
||||
it('showAlert resolves when closed', async () => {
|
||||
const promise = showAlert('hello')
|
||||
closeDialog()
|
||||
const result = await promise
|
||||
expect(result).toBeUndefined()
|
||||
})
|
||||
|
||||
it('showConfirm returns true on ok', async () => {
|
||||
const promise = showConfirm('are you sure?')
|
||||
expect(dialogState.type).toBe('confirm')
|
||||
expect(dialogState.message).toBe('are you sure?')
|
||||
closeDialog(true)
|
||||
const result = await promise
|
||||
expect(result).toBe(true)
|
||||
})
|
||||
|
||||
it('showConfirm returns false on cancel', async () => {
|
||||
const promise = showConfirm('are you sure?')
|
||||
closeDialog(false)
|
||||
const result = await promise
|
||||
expect(result).toBe(false)
|
||||
})
|
||||
|
||||
it('showPrompt opens prompt dialog with default value', async () => {
|
||||
const promise = showPrompt('enter name', 'default')
|
||||
expect(dialogState.visible).toBe(true)
|
||||
expect(dialogState.type).toBe('prompt')
|
||||
expect(dialogState.message).toBe('enter name')
|
||||
expect(dialogState.defaultValue).toBe('default')
|
||||
closeDialog('hello')
|
||||
await promise
|
||||
})
|
||||
|
||||
it('showPrompt returns input value', async () => {
|
||||
const promise = showPrompt('enter name', 'default')
|
||||
closeDialog('hello')
|
||||
const result = await promise
|
||||
expect(result).toBe('hello')
|
||||
})
|
||||
|
||||
it('showPrompt returns null on cancel', async () => {
|
||||
const promise = showPrompt('enter name')
|
||||
closeDialog(null)
|
||||
const result = await promise
|
||||
expect(result).toBeNull()
|
||||
})
|
||||
|
||||
it('showPrompt defaults defaultValue to empty string', async () => {
|
||||
const promise = showPrompt('enter name')
|
||||
expect(dialogState.defaultValue).toBe('')
|
||||
closeDialog('test')
|
||||
await promise
|
||||
})
|
||||
|
||||
it('closeDialog sets visible to false', async () => {
|
||||
showAlert('msg')
|
||||
expect(dialogState.visible).toBe(true)
|
||||
closeDialog()
|
||||
expect(dialogState.visible).toBe(false)
|
||||
})
|
||||
|
||||
it('closeDialog clears resolve after calling it', async () => {
|
||||
const promise = showAlert('msg')
|
||||
closeDialog()
|
||||
await promise
|
||||
expect(dialogState.resolve).toBeNull()
|
||||
})
|
||||
|
||||
it('multiple sequential dialogs work correctly', async () => {
|
||||
// First dialog
|
||||
const p1 = showAlert('first')
|
||||
expect(dialogState.message).toBe('first')
|
||||
closeDialog()
|
||||
await p1
|
||||
|
||||
// Second dialog
|
||||
const p2 = showConfirm('second')
|
||||
expect(dialogState.message).toBe('second')
|
||||
expect(dialogState.type).toBe('confirm')
|
||||
closeDialog(true)
|
||||
const r2 = await p2
|
||||
expect(r2).toBe(true)
|
||||
|
||||
// Third dialog
|
||||
const p3 = showPrompt('third', 'val')
|
||||
expect(dialogState.type).toBe('prompt')
|
||||
closeDialog('answer')
|
||||
const r3 = await p3
|
||||
expect(r3).toBe('answer')
|
||||
})
|
||||
})
|
||||
File diff suppressed because one or more lines are too long
@@ -1,192 +0,0 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import prodData from './fixtures/production-data.json'
|
||||
|
||||
const oils = prodData.oils
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Pure calculation helpers (replicate store logic without Pinia)
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
function pricePerDrop(name) {
|
||||
const meta = oils[name]
|
||||
if (!meta || !meta.dropCount) return 0
|
||||
return meta.bottlePrice / meta.dropCount
|
||||
}
|
||||
|
||||
function calcCost(ingredients) {
|
||||
return ingredients.reduce((sum, ing) => sum + pricePerDrop(ing.oil) * ing.drops, 0)
|
||||
}
|
||||
|
||||
function calcRetailCost(ingredients) {
|
||||
return ingredients.reduce((sum, ing) => {
|
||||
const meta = oils[ing.oil]
|
||||
if (meta && meta.retailPrice && meta.dropCount) {
|
||||
return sum + (meta.retailPrice / meta.dropCount) * ing.drops
|
||||
}
|
||||
return sum + pricePerDrop(ing.oil) * ing.drops
|
||||
}, 0)
|
||||
}
|
||||
|
||||
function formatPrice(n) {
|
||||
return '¥ ' + n.toFixed(2)
|
||||
}
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Oil Price Calculations
|
||||
// ---------------------------------------------------------------------------
|
||||
describe('Oil Price Calculations', () => {
|
||||
it('calculates price per drop for 薰衣草 (15ml bottle)', () => {
|
||||
const ppd = pricePerDrop('薰衣草')
|
||||
expect(ppd).toBeCloseTo(230 / 280, 4)
|
||||
})
|
||||
|
||||
it('calculates price per drop for 乳香', () => {
|
||||
const ppd = pricePerDrop('乳香')
|
||||
expect(ppd).toBeCloseTo(630 / 280, 4)
|
||||
})
|
||||
|
||||
it('calculates price per drop for 椰子油 (large bottle)', () => {
|
||||
const ppd = pricePerDrop('椰子油')
|
||||
expect(ppd).toBeCloseTo(115 / 2146, 4)
|
||||
})
|
||||
|
||||
it('calculates price per drop for expensive oil: 玫瑰', () => {
|
||||
const ppd = pricePerDrop('玫瑰')
|
||||
expect(ppd).toBeCloseTo(2680 / 93, 4)
|
||||
})
|
||||
|
||||
it('returns 0 for unknown oil', () => {
|
||||
expect(pricePerDrop('不存在的油')).toBe(0)
|
||||
})
|
||||
|
||||
it('returns 0 for oil with dropCount 0', () => {
|
||||
// edge case: manually test with a hypothetical entry
|
||||
expect(pricePerDrop('不存在')).toBe(0)
|
||||
})
|
||||
|
||||
it('calculates 酸痛包 recipe cost correctly', () => {
|
||||
const recipe = prodData.recipes[0] // 酸痛包
|
||||
expect(recipe.name).toBe('酸痛包')
|
||||
const cost = calcCost(recipe.ingredients)
|
||||
expect(cost).toBeGreaterThan(0)
|
||||
|
||||
// Verify by manual summation
|
||||
let manual = 0
|
||||
for (const ing of recipe.ingredients) {
|
||||
manual += pricePerDrop(ing.oil) * ing.drops
|
||||
}
|
||||
expect(cost).toBeCloseTo(manual, 10)
|
||||
})
|
||||
|
||||
it('retail cost >= wholesale cost for all sample recipes', () => {
|
||||
for (const recipe of prodData.recipes) {
|
||||
const cost = calcCost(recipe.ingredients)
|
||||
const retail = calcRetailCost(recipe.ingredients)
|
||||
expect(retail).toBeGreaterThanOrEqual(cost)
|
||||
}
|
||||
})
|
||||
|
||||
it('all 137 oils have valid price per drop', () => {
|
||||
const oilEntries = Object.entries(oils)
|
||||
expect(oilEntries.length).toBe(137)
|
||||
|
||||
for (const [name, meta] of oilEntries) {
|
||||
const ppd = meta.dropCount ? meta.bottlePrice / meta.dropCount : 0
|
||||
expect(ppd).toBeGreaterThanOrEqual(0)
|
||||
expect(ppd).toBeLessThan(100) // sanity: no oil > ¥100/drop
|
||||
}
|
||||
})
|
||||
|
||||
it('calculates cost for each of the 10 sample recipes', () => {
|
||||
expect(prodData.recipes).toHaveLength(10)
|
||||
|
||||
for (const recipe of prodData.recipes) {
|
||||
const cost = calcCost(recipe.ingredients)
|
||||
expect(cost).toBeGreaterThanOrEqual(0)
|
||||
|
||||
// Verify ingredient-by-ingredient
|
||||
let manual = 0
|
||||
for (const ing of recipe.ingredients) {
|
||||
manual += pricePerDrop(ing.oil) * ing.drops
|
||||
}
|
||||
expect(cost).toBeCloseTo(manual, 10)
|
||||
}
|
||||
})
|
||||
|
||||
it('all recipe ingredients reference oils that exist in the data', () => {
|
||||
for (const recipe of prodData.recipes) {
|
||||
for (const ing of recipe.ingredients) {
|
||||
expect(oils).toHaveProperty(ing.oil)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
it('小v脸 recipe has expensive ingredients (永久花, 西洋蓍草)', () => {
|
||||
const recipe = prodData.recipes.find(r => r.name === '小v脸')
|
||||
expect(recipe).toBeDefined()
|
||||
const cost = calcCost(recipe.ingredients)
|
||||
// 永久花 is ~¥7.15/drop, 西洋蓍草 is ~¥1.61/drop
|
||||
expect(cost).toBeGreaterThan(5)
|
||||
})
|
||||
|
||||
it('灰指甲 is simple: just 牛至 + 椰子油', () => {
|
||||
const recipe = prodData.recipes.find(r => r.name === '灰指甲')
|
||||
expect(recipe).toBeDefined()
|
||||
expect(recipe.ingredients).toHaveLength(2)
|
||||
const cost = calcCost(recipe.ingredients)
|
||||
expect(cost).toBeGreaterThan(0)
|
||||
})
|
||||
})
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Volume Constants
|
||||
// ---------------------------------------------------------------------------
|
||||
describe('Volume Constants', () => {
|
||||
it('DROPS_PER_ML is 18.6 (doTERRA standard)', () => {
|
||||
// Importing from useSmartPaste to verify the constant
|
||||
expect(18.6).toBe(18.6)
|
||||
})
|
||||
|
||||
it('5ml bottles have 93 drops', () => {
|
||||
// Many 5ml oils use dropCount = 93
|
||||
const count5ml = Object.values(oils).filter(o => o.dropCount === 93).length
|
||||
expect(count5ml).toBeGreaterThan(10)
|
||||
})
|
||||
|
||||
it('15ml bottles have 280 drops (majority of oils)', () => {
|
||||
const count15ml = Object.values(oils).filter(o => o.dropCount === 280).length
|
||||
expect(count15ml).toBeGreaterThan(50)
|
||||
})
|
||||
|
||||
it('10ml (呵护) bottles have 186 drops', () => {
|
||||
const count10ml = Object.values(oils).filter(o => o.dropCount === 186).length
|
||||
expect(count10ml).toBeGreaterThan(10)
|
||||
})
|
||||
|
||||
it('drop counts are one of the standard sizes', () => {
|
||||
const standardDropCounts = new Set([1, 46, 93, 160, 186, 280, 2146])
|
||||
for (const [name, meta] of Object.entries(oils)) {
|
||||
expect(standardDropCounts.has(meta.dropCount)).toBe(true)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Format Price
|
||||
// ---------------------------------------------------------------------------
|
||||
describe('Format Price', () => {
|
||||
it('formats price with ¥ and 2 decimals', () => {
|
||||
expect(formatPrice(12.5)).toBe('¥ 12.50')
|
||||
expect(formatPrice(0)).toBe('¥ 0.00')
|
||||
expect(formatPrice(1234.567)).toBe('¥ 1234.57')
|
||||
})
|
||||
|
||||
it('formats small prices correctly', () => {
|
||||
expect(formatPrice(0.01)).toBe('¥ 0.01')
|
||||
expect(formatPrice(0.005)).toBe('¥ 0.01') // rounds up
|
||||
})
|
||||
|
||||
it('formats large prices correctly', () => {
|
||||
expect(formatPrice(9999.99)).toBe('¥ 9999.99')
|
||||
})
|
||||
})
|
||||
@@ -1,75 +0,0 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { oilEn } from '../composables/useOilTranslation'
|
||||
|
||||
describe('Oil English Translation', () => {
|
||||
it('translates 薰衣草 → Lavender', () => {
|
||||
expect(oilEn('薰衣草')).toBe('Lavender')
|
||||
})
|
||||
|
||||
it('translates 茶树 → Tea Tree', () => {
|
||||
expect(oilEn('茶树')).toBe('Tea Tree')
|
||||
})
|
||||
|
||||
it('translates 乳香 → Frankincense', () => {
|
||||
expect(oilEn('乳香')).toBe('Frankincense')
|
||||
})
|
||||
|
||||
it('translates 柠檬 → Lemon', () => {
|
||||
expect(oilEn('柠檬')).toBe('Lemon')
|
||||
})
|
||||
|
||||
it('translates 椒样薄荷 → Peppermint', () => {
|
||||
expect(oilEn('椒样薄荷')).toBe('Peppermint')
|
||||
})
|
||||
|
||||
it('translates 椰子油 → Coconut Oil', () => {
|
||||
expect(oilEn('椰子油')).toBe('Coconut Oil')
|
||||
})
|
||||
|
||||
it('translates 雪松 → Cedarwood', () => {
|
||||
expect(oilEn('雪松')).toBe('Cedarwood')
|
||||
})
|
||||
|
||||
it('translates 迷迭香 → Rosemary', () => {
|
||||
expect(oilEn('迷迭香')).toBe('Rosemary')
|
||||
})
|
||||
|
||||
it('translates 天竺葵 → Geranium', () => {
|
||||
expect(oilEn('天竺葵')).toBe('Geranium')
|
||||
})
|
||||
|
||||
it('translates 依兰依兰 → Ylang Ylang', () => {
|
||||
expect(oilEn('依兰依兰')).toBe('Ylang Ylang')
|
||||
})
|
||||
|
||||
it('returns empty string for unknown oil', () => {
|
||||
expect(oilEn('不存在')).toBe('')
|
||||
expect(oilEn('随便什么')).toBe('')
|
||||
})
|
||||
|
||||
it('returns empty string for empty input', () => {
|
||||
expect(oilEn('')).toBe('')
|
||||
})
|
||||
|
||||
it('translates blend names', () => {
|
||||
expect(oilEn('芳香调理')).toBe('AromaTouch')
|
||||
expect(oilEn('保卫复方')).toBe('On Guard')
|
||||
expect(oilEn('乐活复方')).toBe('Balance')
|
||||
expect(oilEn('舒缓复方')).toBe('Past Tense')
|
||||
expect(oilEn('净化复方')).toBe('Purify')
|
||||
expect(oilEn('呼吸复方')).toBe('Breathe')
|
||||
expect(oilEn('舒压复方')).toBe('Adaptiv')
|
||||
})
|
||||
|
||||
it('translates carrier oil', () => {
|
||||
expect(oilEn('椰子油')).toBe('Coconut Oil')
|
||||
})
|
||||
|
||||
it('translates 玫瑰 → Rose', () => {
|
||||
expect(oilEn('玫瑰')).toBe('Rose')
|
||||
})
|
||||
|
||||
it('translates 橙花 → Neroli', () => {
|
||||
expect(oilEn('橙花')).toBe('Neroli')
|
||||
})
|
||||
})
|
||||
@@ -1,372 +0,0 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import {
|
||||
editDistance,
|
||||
findOil,
|
||||
greedyMatchOils,
|
||||
parseOilChunk,
|
||||
parseSingleBlock,
|
||||
splitRawIntoBlocks,
|
||||
OIL_HOMOPHONES,
|
||||
} from '../composables/useSmartPaste'
|
||||
import prodData from './fixtures/production-data.json'
|
||||
|
||||
const oilNames = Object.keys(prodData.oils)
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// editDistance
|
||||
// ---------------------------------------------------------------------------
|
||||
describe('editDistance', () => {
|
||||
it('returns 0 for identical strings', () => {
|
||||
expect(editDistance('abc', 'abc')).toBe(0)
|
||||
expect(editDistance('薰衣草', '薰衣草')).toBe(0)
|
||||
})
|
||||
|
||||
it('returns correct distance for single insertion', () => {
|
||||
expect(editDistance('abc', 'abcd')).toBe(1)
|
||||
})
|
||||
|
||||
it('returns correct distance for single deletion', () => {
|
||||
expect(editDistance('abcd', 'abc')).toBe(1)
|
||||
})
|
||||
|
||||
it('returns correct distance for single substitution', () => {
|
||||
expect(editDistance('abc', 'aXc')).toBe(1)
|
||||
})
|
||||
|
||||
it('handles empty strings', () => {
|
||||
expect(editDistance('', '')).toBe(0)
|
||||
expect(editDistance('abc', '')).toBe(3)
|
||||
expect(editDistance('', 'abc')).toBe(3)
|
||||
})
|
||||
|
||||
it('handles Chinese characters', () => {
|
||||
expect(editDistance('薰衣草', '薰衣')).toBe(1)
|
||||
expect(editDistance('博荷', '薄荷')).toBe(1)
|
||||
expect(editDistance('永久化', '永久花')).toBe(1)
|
||||
})
|
||||
})
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// findOil
|
||||
// ---------------------------------------------------------------------------
|
||||
describe('findOil', () => {
|
||||
// Exact match
|
||||
it('finds exact oil name: 薰衣草', () => {
|
||||
expect(findOil('薰衣草', oilNames)).toBe('薰衣草')
|
||||
})
|
||||
|
||||
it('finds exact oil name: 乳香', () => {
|
||||
expect(findOil('乳香', oilNames)).toBe('乳香')
|
||||
})
|
||||
|
||||
it('finds exact oil name: 椒样薄荷', () => {
|
||||
expect(findOil('椒样薄荷', oilNames)).toBe('椒样薄荷')
|
||||
})
|
||||
|
||||
// Homophone correction
|
||||
it('corrects 相貌 → 香茅', () => {
|
||||
expect(findOil('相貌', oilNames)).toBe('香茅')
|
||||
})
|
||||
|
||||
it('corrects 如香 → 乳香', () => {
|
||||
expect(findOil('如香', oilNames)).toBe('乳香')
|
||||
})
|
||||
|
||||
it('corrects 博荷 → 薄荷 (but 薄荷 is not a standalone oil)', () => {
|
||||
// OIL_HOMOPHONES maps 博荷 → 薄荷, but 薄荷 is not in oilNames
|
||||
// (only 椒样薄荷, 清醇薄荷, etc. exist). The homophone check requires
|
||||
// the canonical name to be in oilNames, so it falls through.
|
||||
// 博荷 (2 chars) is too short for substring/edit-distance to match reliably.
|
||||
const result = findOil('博荷', oilNames)
|
||||
// Verifies the actual behavior: null because 薄荷 is not in oilNames
|
||||
expect(result).toBeNull()
|
||||
})
|
||||
|
||||
it('corrects 永久化 → 永久花', () => {
|
||||
expect(findOil('永久化', oilNames)).toBe('永久花')
|
||||
})
|
||||
|
||||
it('corrects 洋甘菊 → 罗马洋甘菊', () => {
|
||||
expect(findOil('洋甘菊', oilNames)).toBe('罗马洋甘菊')
|
||||
})
|
||||
|
||||
it('corrects 椒样博荷 → 椒样薄荷', () => {
|
||||
expect(findOil('椒样博荷', oilNames)).toBe('椒样薄荷')
|
||||
})
|
||||
|
||||
it('corrects 茶树油 → 茶树', () => {
|
||||
expect(findOil('茶树油', oilNames)).toBe('茶树')
|
||||
})
|
||||
|
||||
it('corrects 薰衣草油 → 薰衣草', () => {
|
||||
expect(findOil('薰衣草油', oilNames)).toBe('薰衣草')
|
||||
})
|
||||
|
||||
// Substring match
|
||||
it('matches substring: input contained in oil name', () => {
|
||||
// 薄荷 is a substring of 椒样薄荷, 清醇薄荷, 绿薄荷, 薄荷呵护
|
||||
const result = findOil('薄荷', oilNames)
|
||||
expect(result).not.toBeNull()
|
||||
expect(result).toContain('薄荷')
|
||||
})
|
||||
|
||||
// Missing char match
|
||||
it('handles missing one character: 茶 → 茶树 (via substring)', () => {
|
||||
const result = findOil('茶树呵', oilNames)
|
||||
// 茶树呵护 is 4 chars, input is 3 chars — missing one char
|
||||
expect(result).toBe('茶树呵护')
|
||||
})
|
||||
|
||||
// Returns null for garbage
|
||||
it('returns null for empty input', () => {
|
||||
expect(findOil('', oilNames)).toBeNull()
|
||||
})
|
||||
|
||||
it('returns null for whitespace-only input', () => {
|
||||
expect(findOil(' ', oilNames)).toBeNull()
|
||||
})
|
||||
|
||||
it('returns null for completely unrelated text', () => {
|
||||
expect(findOil('XYZXYZXYZXYZ', oilNames)).toBeNull()
|
||||
})
|
||||
|
||||
// Edge cases
|
||||
it('handles single character input', () => {
|
||||
// Single char — may or may not match via substring
|
||||
const result = findOil('柠', oilNames)
|
||||
// 柠 is a substring of 柠檬, 柠檬草, etc.
|
||||
expect(result).not.toBeNull()
|
||||
})
|
||||
|
||||
it('trims whitespace from input', () => {
|
||||
expect(findOil(' 薰衣草 ', oilNames)).toBe('薰衣草')
|
||||
})
|
||||
})
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// greedyMatchOils
|
||||
// ---------------------------------------------------------------------------
|
||||
describe('greedyMatchOils', () => {
|
||||
it('splits concatenated oil names: 薰衣草茶树 → [薰衣草, 茶树]', () => {
|
||||
const result = greedyMatchOils('薰衣草茶树', oilNames)
|
||||
expect(result).toEqual(['薰衣草', '茶树'])
|
||||
})
|
||||
|
||||
it('handles single oil', () => {
|
||||
const result = greedyMatchOils('乳香', oilNames)
|
||||
expect(result).toEqual(['乳香'])
|
||||
})
|
||||
|
||||
it('returns empty for no match', () => {
|
||||
const result = greedyMatchOils('XYZXYZ', oilNames)
|
||||
expect(result).toEqual([])
|
||||
})
|
||||
|
||||
it('prefers longest match', () => {
|
||||
// 椒样薄荷 should match as one oil, not 椒 + something
|
||||
const result = greedyMatchOils('椒样薄荷', oilNames)
|
||||
expect(result).toEqual(['椒样薄荷'])
|
||||
})
|
||||
|
||||
it('handles three concatenated oils', () => {
|
||||
const result = greedyMatchOils('薰衣草茶树乳香', oilNames)
|
||||
expect(result).toEqual(['薰衣草', '茶树', '乳香'])
|
||||
})
|
||||
|
||||
it('handles homophones in concatenated text', () => {
|
||||
// 相貌 is a homophone for 香茅
|
||||
const result = greedyMatchOils('相貌', oilNames)
|
||||
expect(result).toEqual(['香茅'])
|
||||
})
|
||||
|
||||
it('skips unrecognized characters between oils', () => {
|
||||
const result = greedyMatchOils('薰衣草X茶树', oilNames)
|
||||
expect(result).toEqual(['薰衣草', '茶树'])
|
||||
})
|
||||
})
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// parseOilChunk
|
||||
// ---------------------------------------------------------------------------
|
||||
describe('parseOilChunk', () => {
|
||||
it('parses "薰衣草5" → [{oil: 薰衣草, drops: 5}]', () => {
|
||||
const result = parseOilChunk('薰衣草5', oilNames)
|
||||
expect(result).toHaveLength(1)
|
||||
expect(result[0]).toEqual({ oil: '薰衣草', drops: 5 })
|
||||
})
|
||||
|
||||
it('parses "芳香调理8永久花10" → two ingredients', () => {
|
||||
const result = parseOilChunk('芳香调理8永久花10', oilNames)
|
||||
expect(result).toHaveLength(2)
|
||||
expect(result[0]).toEqual({ oil: '芳香调理', drops: 8 })
|
||||
expect(result[1]).toEqual({ oil: '永久花', drops: 10 })
|
||||
})
|
||||
|
||||
it('parses "薰衣草3ml" → [{薰衣草, drops: 60}] (3ml * 20)', () => {
|
||||
const result = parseOilChunk('薰衣草3ml', oilNames)
|
||||
expect(result).toHaveLength(1)
|
||||
expect(result[0]).toEqual({ oil: '薰衣草', drops: 60 })
|
||||
})
|
||||
|
||||
it('parses "薰衣草5毫升" → [{薰衣草, drops: 100}] (5 * 20)', () => {
|
||||
const result = parseOilChunk('薰衣草5毫升', oilNames)
|
||||
expect(result).toHaveLength(1)
|
||||
expect(result[0]).toEqual({ oil: '薰衣草', drops: 100 })
|
||||
})
|
||||
|
||||
it('parses "薰衣草3ML" → case-insensitive ml', () => {
|
||||
const result = parseOilChunk('薰衣草3ML', oilNames)
|
||||
expect(result).toHaveLength(1)
|
||||
expect(result[0]).toEqual({ oil: '薰衣草', drops: 60 })
|
||||
})
|
||||
|
||||
it('handles decimal drops "乳香1.5"', () => {
|
||||
const result = parseOilChunk('乳香1.5', oilNames)
|
||||
expect(result).toHaveLength(1)
|
||||
expect(result[0].oil).toBe('乳香')
|
||||
expect(result[0].drops).toBeCloseTo(1.5)
|
||||
})
|
||||
|
||||
it('handles "滴" unit without conversion', () => {
|
||||
const result = parseOilChunk('薰衣草5滴', oilNames)
|
||||
expect(result).toHaveLength(1)
|
||||
expect(result[0]).toEqual({ oil: '薰衣草', drops: 5 })
|
||||
})
|
||||
|
||||
it('returns empty array for text with no numbers', () => {
|
||||
// The regex requires a number, so pure text yields nothing
|
||||
const result = parseOilChunk('薰衣草', oilNames)
|
||||
expect(result).toHaveLength(0)
|
||||
})
|
||||
})
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// parseSingleBlock
|
||||
// ---------------------------------------------------------------------------
|
||||
describe('parseSingleBlock', () => {
|
||||
it('parses "助眠，薰衣草15，雪松10" correctly', () => {
|
||||
const result = parseSingleBlock('助眠，薰衣草15，雪松10', oilNames)
|
||||
expect(result.name).toBe('助眠')
|
||||
expect(result.ingredients).toHaveLength(2)
|
||||
expect(result.ingredients[0]).toEqual({ oil: '薰衣草', drops: 15 })
|
||||
expect(result.ingredients[1]).toEqual({ oil: '雪松', drops: 10 })
|
||||
})
|
||||
|
||||
it('parses "头疗，椒样薄荷5，生姜3，迷迭香3" correctly', () => {
|
||||
const result = parseSingleBlock('头疗，椒样薄荷5，生姜3，迷迭香3', oilNames)
|
||||
expect(result.name).toBe('头疗')
|
||||
expect(result.ingredients).toHaveLength(3)
|
||||
expect(result.ingredients[0]).toEqual({ oil: '椒样薄荷', drops: 5 })
|
||||
expect(result.ingredients[1]).toEqual({ oil: '生姜', drops: 3 })
|
||||
expect(result.ingredients[2]).toEqual({ oil: '迷迭香', drops: 3 })
|
||||
})
|
||||
|
||||
it('handles recipe with no name (all parts have oils)', () => {
|
||||
const result = parseSingleBlock('薰衣草10，茶树5', oilNames)
|
||||
expect(result.name).toBe('未命名配方')
|
||||
expect(result.ingredients).toHaveLength(2)
|
||||
})
|
||||
|
||||
it('deduplicates ingredients (sums drops)', () => {
|
||||
const result = parseSingleBlock('测试，薰衣草5，薰衣草3', oilNames)
|
||||
expect(result.ingredients).toHaveLength(1)
|
||||
expect(result.ingredients[0]).toEqual({ oil: '薰衣草', drops: 8 })
|
||||
})
|
||||
|
||||
it('handles English commas as separator', () => {
|
||||
const result = parseSingleBlock('助眠,薰衣草15,雪松10', oilNames)
|
||||
expect(result.name).toBe('助眠')
|
||||
expect(result.ingredients).toHaveLength(2)
|
||||
})
|
||||
|
||||
it('handles newlines as separator', () => {
|
||||
const result = parseSingleBlock('助眠\n薰衣草15\n雪松10', oilNames)
|
||||
expect(result.name).toBe('助眠')
|
||||
expect(result.ingredients).toHaveLength(2)
|
||||
})
|
||||
|
||||
it('collects notFound oils', () => {
|
||||
const result = parseSingleBlock('测试，不存在的油99', oilNames)
|
||||
expect(result.notFound.length).toBeGreaterThan(0)
|
||||
})
|
||||
|
||||
it('parses complex real-world recipe', () => {
|
||||
const result = parseSingleBlock(
|
||||
'酸痛包，椒样薄荷1，舒缓2，芳香调理1，冬青1，柠檬草1，生姜2，茶树1，乳香1，椰子油10',
|
||||
oilNames
|
||||
)
|
||||
expect(result.name).toBe('酸痛包')
|
||||
expect(result.ingredients).toHaveLength(9)
|
||||
// Verify the first and last
|
||||
expect(result.ingredients[0]).toEqual({ oil: '椒样薄荷', drops: 1 })
|
||||
expect(result.ingredients[8]).toEqual({ oil: '椰子油', drops: 10 })
|
||||
})
|
||||
})
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// splitRawIntoBlocks
|
||||
// ---------------------------------------------------------------------------
|
||||
describe('splitRawIntoBlocks', () => {
|
||||
it('splits by blank lines', () => {
|
||||
const blocks = splitRawIntoBlocks('助眠，薰衣草15\n\n头疗，薄荷5', oilNames)
|
||||
expect(blocks).toHaveLength(2)
|
||||
expect(blocks[0]).toBe('助眠，薰衣草15')
|
||||
expect(blocks[1]).toBe('头疗，薄荷5')
|
||||
})
|
||||
|
||||
it('splits by semicolons', () => {
|
||||
const blocks = splitRawIntoBlocks('助眠，薰衣草15；头疗，薄荷5', oilNames)
|
||||
expect(blocks).toHaveLength(2)
|
||||
})
|
||||
|
||||
it('splits by English semicolons', () => {
|
||||
const blocks = splitRawIntoBlocks('助眠，薰衣草15;头疗，薄荷5', oilNames)
|
||||
expect(blocks).toHaveLength(2)
|
||||
})
|
||||
|
||||
it('single block stays single', () => {
|
||||
const blocks = splitRawIntoBlocks('助眠，薰衣草15，雪松10', oilNames)
|
||||
expect(blocks).toHaveLength(1)
|
||||
})
|
||||
|
||||
it('filters out empty blocks', () => {
|
||||
const blocks = splitRawIntoBlocks('助眠\n\n\n\n头疗', oilNames)
|
||||
expect(blocks).toHaveLength(2)
|
||||
})
|
||||
|
||||
it('handles mixed separators', () => {
|
||||
const blocks = splitRawIntoBlocks('A；B\n\nC', oilNames)
|
||||
expect(blocks).toHaveLength(3)
|
||||
})
|
||||
})
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// OIL_HOMOPHONES
|
||||
// ---------------------------------------------------------------------------
|
||||
describe('OIL_HOMOPHONES', () => {
|
||||
it('is an object with string→string mappings', () => {
|
||||
expect(typeof OIL_HOMOPHONES).toBe('object')
|
||||
for (const [key, value] of Object.entries(OIL_HOMOPHONES)) {
|
||||
expect(typeof key).toBe('string')
|
||||
expect(typeof value).toBe('string')
|
||||
}
|
||||
})
|
||||
|
||||
it('maps all aliases to oils that exist in the fixture', () => {
|
||||
for (const canonical of Object.values(OIL_HOMOPHONES)) {
|
||||
// The canonical name should exist in either the oil list or be a common base name
|
||||
// Some like 薄荷 might not be a standalone oil but it's used as a component
|
||||
expect(typeof canonical).toBe('string')
|
||||
expect(canonical.length).toBeGreaterThan(0)
|
||||
}
|
||||
})
|
||||
|
||||
it('contains expected entries', () => {
|
||||
expect(OIL_HOMOPHONES['相貌']).toBe('香茅')
|
||||
expect(OIL_HOMOPHONES['如香']).toBe('乳香')
|
||||
expect(OIL_HOMOPHONES['博荷']).toBe('薄荷')
|
||||
expect(OIL_HOMOPHONES['永久化']).toBe('永久花')
|
||||
expect(OIL_HOMOPHONES['茶树油']).toBe('茶树')
|
||||
expect(OIL_HOMOPHONES['薰衣草油']).toBe('薰衣草')
|
||||
})
|
||||
})
|
||||
@@ -1,584 +0,0 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { DROPS_PER_ML, VOLUME_DROPS } from '../stores/oils'
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Replicate the volume / dilution calculation logic locally for unit testing
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
function getTotalDropsForMode(mode, customVal = 0, customUnit = 'drops') {
|
||||
if (mode === 'single') return null
|
||||
if (mode === 'custom') {
|
||||
return customUnit === 'ml' ? Math.round(customVal * 20) : Math.round(customVal)
|
||||
}
|
||||
const presets = { '5ml': 100, '10ml': 200, '30ml': 600 }
|
||||
return presets[mode] || 100
|
||||
}
|
||||
|
||||
function applyVolume(ingredients, mode, ratio, customVal, customUnit) {
|
||||
let targetEO, targetCoconut
|
||||
if (mode === 'single') {
|
||||
targetCoconut = 10
|
||||
targetEO = Math.round(targetCoconut / ratio)
|
||||
} else {
|
||||
const totalDrops = getTotalDropsForMode(mode, customVal, customUnit)
|
||||
if (!totalDrops || totalDrops <= 0) return null
|
||||
targetEO = Math.round(totalDrops / (1 + ratio))
|
||||
targetCoconut = totalDrops - targetEO
|
||||
}
|
||||
|
||||
const eos = ingredients.filter(i => i.oil !== '椰子油')
|
||||
const currentTotalEO = eos.reduce((s, i) => s + i.drops, 0)
|
||||
if (currentTotalEO === 0) return null
|
||||
|
||||
const factor = targetEO / currentTotalEO
|
||||
const scaled = eos.map(ing => ({
|
||||
oil: ing.oil,
|
||||
drops: Math.max(0.5, Math.round(ing.drops * factor * 2) / 2),
|
||||
}))
|
||||
scaled.push({ oil: '椰子油', drops: targetCoconut })
|
||||
return scaled
|
||||
}
|
||||
|
||||
function detectVolumeMode(ingredients) {
|
||||
const eos = ingredients.filter(i => i.oil !== '椰子油')
|
||||
const coconut = ingredients.find(i => i.oil === '椰子油')
|
||||
const totalEO = eos.reduce((s, i) => s + i.drops, 0)
|
||||
const cDrops = coconut ? coconut.drops : 0
|
||||
const totalAll = totalEO + cDrops
|
||||
if (totalAll === 100) return '5ml'
|
||||
if (totalAll === 200) return '10ml'
|
||||
if (totalAll === 600) return '30ml'
|
||||
if (cDrops > 0 && cDrops <= 20 && totalAll <= 40) return 'single'
|
||||
if (cDrops > 0) return 'custom'
|
||||
return 'single'
|
||||
}
|
||||
|
||||
function getDilutionRatio(ingredients) {
|
||||
const eos = ingredients.filter(i => i.oil !== '椰子油')
|
||||
const coconut = ingredients.find(i => i.oil === '椰子油')
|
||||
const totalEO = eos.reduce((s, i) => s + i.drops, 0)
|
||||
const cDrops = coconut ? coconut.drops : 0
|
||||
if (totalEO > 0 && cDrops > 0) return Math.round(cDrops / totalEO)
|
||||
return 0
|
||||
}
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Helper: sum EO drops from a result set
|
||||
// ---------------------------------------------------------------------------
|
||||
function sumEO(result) {
|
||||
return result.filter(i => i.oil !== '椰子油').reduce((s, i) => s + i.drops, 0)
|
||||
}
|
||||
|
||||
function coconutDrops(result) {
|
||||
const c = result.find(i => i.oil === '椰子油')
|
||||
return c ? c.drops : 0
|
||||
}
|
||||
|
||||
// ===========================================================================
|
||||
// Tests
|
||||
// ===========================================================================
|
||||
|
||||
describe('Volume Constants', () => {
|
||||
it('DROPS_PER_ML equals 18.6', () => {
|
||||
expect(DROPS_PER_ML).toBe(18.6)
|
||||
})
|
||||
|
||||
it('VOLUME_DROPS has standard doTERRA sizes', () => {
|
||||
expect(VOLUME_DROPS).toHaveProperty('2.5')
|
||||
expect(VOLUME_DROPS).toHaveProperty('5')
|
||||
expect(VOLUME_DROPS).toHaveProperty('10')
|
||||
expect(VOLUME_DROPS).toHaveProperty('15')
|
||||
expect(VOLUME_DROPS).toHaveProperty('115')
|
||||
})
|
||||
|
||||
it('5ml bottle = 93 drops (factory standard)', () => {
|
||||
expect(VOLUME_DROPS['5']).toBe(93)
|
||||
})
|
||||
|
||||
it('15ml bottle = 280 drops', () => {
|
||||
expect(VOLUME_DROPS['15']).toBe(280)
|
||||
})
|
||||
|
||||
it('2.5ml bottle = 46 drops', () => {
|
||||
expect(VOLUME_DROPS['2.5']).toBe(46)
|
||||
})
|
||||
|
||||
it('10ml bottle = 186 drops', () => {
|
||||
expect(VOLUME_DROPS['10']).toBe(186)
|
||||
})
|
||||
|
||||
it('115ml bottle = 2146 drops', () => {
|
||||
expect(VOLUME_DROPS['115']).toBe(2146)
|
||||
})
|
||||
})
|
||||
|
||||
describe('getTotalDropsForMode', () => {
|
||||
it("'single' returns null", () => {
|
||||
expect(getTotalDropsForMode('single')).toBeNull()
|
||||
})
|
||||
|
||||
it("'5ml' returns 100", () => {
|
||||
expect(getTotalDropsForMode('5ml')).toBe(100)
|
||||
})
|
||||
|
||||
it("'10ml' returns 200", () => {
|
||||
expect(getTotalDropsForMode('10ml')).toBe(200)
|
||||
})
|
||||
|
||||
it("'30ml' returns 600", () => {
|
||||
expect(getTotalDropsForMode('30ml')).toBe(600)
|
||||
})
|
||||
|
||||
it("'custom' with 20ml returns 400", () => {
|
||||
expect(getTotalDropsForMode('custom', 20, 'ml')).toBe(400)
|
||||
})
|
||||
|
||||
it("'custom' with 15 drops returns 15", () => {
|
||||
expect(getTotalDropsForMode('custom', 15, 'drops')).toBe(15)
|
||||
})
|
||||
|
||||
it("'custom' with 0 ml returns 0", () => {
|
||||
expect(getTotalDropsForMode('custom', 0, 'ml')).toBe(0)
|
||||
})
|
||||
|
||||
it("'custom' rounds fractional ml values", () => {
|
||||
expect(getTotalDropsForMode('custom', 7.5, 'ml')).toBe(150)
|
||||
})
|
||||
|
||||
it('unknown mode falls back to 100', () => {
|
||||
expect(getTotalDropsForMode('unknown')).toBe(100)
|
||||
})
|
||||
})
|
||||
|
||||
describe('applyVolume - single dose', () => {
|
||||
const baseRecipe = [
|
||||
{ oil: '薰衣草', drops: 5 },
|
||||
{ oil: '椰子油', drops: 10 },
|
||||
]
|
||||
|
||||
it('with ratio 10, coconut=10, EO=1', () => {
|
||||
const result = applyVolume(baseRecipe, 'single', 10)
|
||||
expect(coconutDrops(result)).toBe(10)
|
||||
expect(sumEO(result)).toBe(1)
|
||||
})
|
||||
|
||||
it('with ratio 5, coconut=10, EO=2', () => {
|
||||
const result = applyVolume(baseRecipe, 'single', 5)
|
||||
expect(coconutDrops(result)).toBe(10)
|
||||
expect(sumEO(result)).toBe(2)
|
||||
})
|
||||
|
||||
it('scales 3 oils proportionally', () => {
|
||||
const threeOils = [
|
||||
{ oil: '薰衣草', drops: 6 },
|
||||
{ oil: '乳香', drops: 3 },
|
||||
{ oil: '薄荷', drops: 3 },
|
||||
{ oil: '椰子油', drops: 10 },
|
||||
]
|
||||
const result = applyVolume(threeOils, 'single', 5)
|
||||
// targetEO = round(10/5) = 2
|
||||
// factor = 2/12
|
||||
const lavender = result.find(i => i.oil === '薰衣草')
|
||||
const frank = result.find(i => i.oil === '乳香')
|
||||
const mint = result.find(i => i.oil === '薄荷')
|
||||
// Lavender should get ~half of the EO, frank and mint ~quarter each
|
||||
expect(lavender.drops).toBeGreaterThanOrEqual(frank.drops)
|
||||
expect(frank.drops).toBe(mint.drops)
|
||||
})
|
||||
|
||||
it('minimum 0.5 drops per oil', () => {
|
||||
const tinyOil = [
|
||||
{ oil: '薰衣草', drops: 1 },
|
||||
{ oil: '乳香', drops: 1 },
|
||||
{ oil: '椰子油', drops: 10 },
|
||||
]
|
||||
// ratio 20 → targetEO = round(10/20) = 1, factor = 0.5
|
||||
// each oil: max(0.5, round(1*0.5*2)/2) = max(0.5, 0.5) = 0.5
|
||||
const result = applyVolume(tinyOil, 'single', 20)
|
||||
result.filter(i => i.oil !== '椰子油').forEach(i => {
|
||||
expect(i.drops).toBeGreaterThanOrEqual(0.5)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('applyVolume - 5ml bottle', () => {
|
||||
it('100 total drops with ratio 10: EO~9, coconut~91', () => {
|
||||
const recipe = [
|
||||
{ oil: '薰衣草', drops: 3 },
|
||||
{ oil: '椰子油', drops: 10 },
|
||||
]
|
||||
const result = applyVolume(recipe, '5ml', 10)
|
||||
const totalEO = sumEO(result)
|
||||
const coco = coconutDrops(result)
|
||||
// targetEO = round(100/11) = 9, coconut = 91
|
||||
expect(totalEO).toBe(9)
|
||||
expect(coco).toBe(91)
|
||||
expect(totalEO + coco).toBe(100)
|
||||
})
|
||||
|
||||
it('scales existing recipe proportionally', () => {
|
||||
const recipe = [
|
||||
{ oil: '薰衣草', drops: 6 },
|
||||
{ oil: '乳香', drops: 3 },
|
||||
{ oil: '椰子油', drops: 10 },
|
||||
]
|
||||
const result = applyVolume(recipe, '5ml', 10)
|
||||
const lav = result.find(i => i.oil === '薰衣草')
|
||||
const frank = result.find(i => i.oil === '乳香')
|
||||
// Original ratio is 2:1, scaled should preserve ~2:1
|
||||
expect(lav.drops).toBeGreaterThan(frank.drops)
|
||||
})
|
||||
|
||||
it('preserves oil ratios approximately', () => {
|
||||
const recipe = [
|
||||
{ oil: '薰衣草', drops: 10 },
|
||||
{ oil: '乳香', drops: 5 },
|
||||
{ oil: '椰子油', drops: 20 },
|
||||
]
|
||||
const result = applyVolume(recipe, '5ml', 10)
|
||||
const lav = result.find(i => i.oil === '薰衣草')
|
||||
const frank = result.find(i => i.oil === '乳香')
|
||||
// ratio should be close to 2:1
|
||||
expect(lav.drops / frank.drops).toBeCloseTo(2, 0)
|
||||
})
|
||||
})
|
||||
|
||||
describe('applyVolume - 10ml bottle', () => {
|
||||
const recipe = [
|
||||
{ oil: '薰衣草', drops: 5 },
|
||||
{ oil: '椰子油', drops: 10 },
|
||||
]
|
||||
|
||||
it('produces 200 total drops', () => {
|
||||
const result = applyVolume(recipe, '10ml', 10)
|
||||
const total = sumEO(result) + coconutDrops(result)
|
||||
expect(total).toBe(200)
|
||||
})
|
||||
|
||||
it('ratio 5 gives ~33 EO drops', () => {
|
||||
const result = applyVolume(recipe, '10ml', 5)
|
||||
// targetEO = round(200/6) = 33
|
||||
expect(sumEO(result)).toBe(33)
|
||||
})
|
||||
|
||||
it('ratio 10 gives ~18 EO drops', () => {
|
||||
const result = applyVolume(recipe, '10ml', 10)
|
||||
// targetEO = round(200/11) = 18
|
||||
expect(sumEO(result)).toBe(18)
|
||||
})
|
||||
|
||||
it('ratio 15 gives ~13 EO drops', () => {
|
||||
const result = applyVolume(recipe, '10ml', 15)
|
||||
// targetEO = round(200/16) = 13 (12.5 rounds to 13)
|
||||
expect(sumEO(result)).toBe(13)
|
||||
})
|
||||
})
|
||||
|
||||
describe('applyVolume - 30ml bottle', () => {
|
||||
const recipe = [
|
||||
{ oil: '薰衣草', drops: 5 },
|
||||
{ oil: '乳香', drops: 3 },
|
||||
{ oil: '椰子油', drops: 20 },
|
||||
]
|
||||
|
||||
it('produces 600 total drops', () => {
|
||||
const result = applyVolume(recipe, '30ml', 10)
|
||||
const total = sumEO(result) + coconutDrops(result)
|
||||
expect(total).toBe(600)
|
||||
})
|
||||
|
||||
it('large recipe scaling preserves ratios', () => {
|
||||
const result = applyVolume(recipe, '30ml', 10)
|
||||
const lav = result.find(i => i.oil === '薰衣草')
|
||||
const frank = result.find(i => i.oil === '乳香')
|
||||
// Original ratio 5:3 ≈ 1.67
|
||||
expect(lav.drops / frank.drops).toBeCloseTo(5 / 3, 0)
|
||||
})
|
||||
|
||||
it('ratio 10 gives ~55 EO drops', () => {
|
||||
const result = applyVolume(recipe, '30ml', 10)
|
||||
// targetEO = round(600/11) = 55
|
||||
expect(sumEO(result)).toBe(55)
|
||||
})
|
||||
})
|
||||
|
||||
describe('applyVolume - custom', () => {
|
||||
const recipe = [
|
||||
{ oil: '薰衣草', drops: 5 },
|
||||
{ oil: '椰子油', drops: 10 },
|
||||
]
|
||||
|
||||
it('custom 20ml = 400 total drops', () => {
|
||||
const result = applyVolume(recipe, 'custom', 10, 20, 'ml')
|
||||
const total = sumEO(result) + coconutDrops(result)
|
||||
expect(total).toBe(400)
|
||||
})
|
||||
|
||||
it('custom 50 drops total', () => {
|
||||
const result = applyVolume(recipe, 'custom', 10, 50, 'drops')
|
||||
const total = sumEO(result) + coconutDrops(result)
|
||||
expect(total).toBe(50)
|
||||
})
|
||||
|
||||
it('custom 0 ml returns null', () => {
|
||||
const result = applyVolume(recipe, 'custom', 10, 0, 'ml')
|
||||
expect(result).toBeNull()
|
||||
})
|
||||
})
|
||||
|
||||
describe('applyVolume - edge cases', () => {
|
||||
it('empty ingredients returns null', () => {
|
||||
const result = applyVolume([], '5ml', 10)
|
||||
expect(result).toBeNull()
|
||||
})
|
||||
|
||||
it('only coconut oil (no EO) returns null', () => {
|
||||
const result = applyVolume([{ oil: '椰子油', drops: 10 }], '5ml', 10)
|
||||
expect(result).toBeNull()
|
||||
})
|
||||
|
||||
it('single oil scales correctly', () => {
|
||||
const recipe = [
|
||||
{ oil: '薰衣草', drops: 5 },
|
||||
{ oil: '椰子油', drops: 10 },
|
||||
]
|
||||
const result = applyVolume(recipe, '5ml', 10)
|
||||
expect(result).not.toBeNull()
|
||||
expect(result.filter(i => i.oil !== '椰子油')).toHaveLength(1)
|
||||
})
|
||||
|
||||
it('very small drops round to 0.5 minimum', () => {
|
||||
const recipe = [
|
||||
{ oil: '薰衣草', drops: 100 },
|
||||
{ oil: '乳香', drops: 1 },
|
||||
{ oil: '椰子油', drops: 10 },
|
||||
]
|
||||
// Single mode ratio 50 → targetEO = round(10/50) = 0 → but round gives 0
|
||||
// Actually ratio 10 → targetEO = 1, factor = 1/101
|
||||
// 乳香: max(0.5, round(1 * (1/101) * 2)/2) = max(0.5, 0) = 0.5
|
||||
const result = applyVolume(recipe, 'single', 10)
|
||||
const frank = result.find(i => i.oil === '乳香')
|
||||
expect(frank.drops).toBe(0.5)
|
||||
})
|
||||
|
||||
it('coconut oil is always the last element', () => {
|
||||
const recipe = [
|
||||
{ oil: '椰子油', drops: 10 },
|
||||
{ oil: '薰衣草', drops: 5 },
|
||||
{ oil: '乳香', drops: 3 },
|
||||
]
|
||||
const result = applyVolume(recipe, '5ml', 10)
|
||||
expect(result[result.length - 1].oil).toBe('椰子油')
|
||||
})
|
||||
|
||||
it('no coconut in input still adds coconut to output', () => {
|
||||
const recipe = [
|
||||
{ oil: '薰衣草', drops: 5 },
|
||||
{ oil: '乳香', drops: 3 },
|
||||
]
|
||||
const result = applyVolume(recipe, '5ml', 10)
|
||||
expect(result.find(i => i.oil === '椰子油')).toBeDefined()
|
||||
})
|
||||
})
|
||||
|
||||
describe('detectVolumeMode', () => {
|
||||
it('100 total drops → 5ml', () => {
|
||||
const ing = [
|
||||
{ oil: '薰衣草', drops: 10 },
|
||||
{ oil: '椰子油', drops: 90 },
|
||||
]
|
||||
expect(detectVolumeMode(ing)).toBe('5ml')
|
||||
})
|
||||
|
||||
it('200 total drops → 10ml', () => {
|
||||
const ing = [
|
||||
{ oil: '薰衣草', drops: 20 },
|
||||
{ oil: '椰子油', drops: 180 },
|
||||
]
|
||||
expect(detectVolumeMode(ing)).toBe('10ml')
|
||||
})
|
||||
|
||||
it('600 total drops → 30ml', () => {
|
||||
const ing = [
|
||||
{ oil: '薰衣草', drops: 50 },
|
||||
{ oil: '椰子油', drops: 550 },
|
||||
]
|
||||
expect(detectVolumeMode(ing)).toBe('30ml')
|
||||
})
|
||||
|
||||
it('small recipe with coconut → single', () => {
|
||||
const ing = [
|
||||
{ oil: '薰衣草', drops: 2 },
|
||||
{ oil: '椰子油', drops: 10 },
|
||||
]
|
||||
expect(detectVolumeMode(ing)).toBe('single')
|
||||
})
|
||||
|
||||
it('coconut <= 20 and total <= 40 → single', () => {
|
||||
const ing = [
|
||||
{ oil: '薰衣草', drops: 20 },
|
||||
{ oil: '椰子油', drops: 20 },
|
||||
]
|
||||
expect(detectVolumeMode(ing)).toBe('single')
|
||||
})
|
||||
|
||||
it('coconut > 20 but not a preset → custom', () => {
|
||||
const ing = [
|
||||
{ oil: '薰衣草', drops: 10 },
|
||||
{ oil: '椰子油', drops: 40 },
|
||||
]
|
||||
expect(detectVolumeMode(ing)).toBe('custom')
|
||||
})
|
||||
|
||||
it('total > 40 but not a preset → custom', () => {
|
||||
const ing = [
|
||||
{ oil: '薰衣草', drops: 30 },
|
||||
{ oil: '椰子油', drops: 20 },
|
||||
]
|
||||
expect(detectVolumeMode(ing)).toBe('custom')
|
||||
})
|
||||
|
||||
it('no coconut at all → single', () => {
|
||||
const ing = [{ oil: '薰衣草', drops: 5 }]
|
||||
expect(detectVolumeMode(ing)).toBe('single')
|
||||
})
|
||||
|
||||
it('only EO totalling 100 still detects 5ml', () => {
|
||||
const ing = [{ oil: '薰衣草', drops: 100 }]
|
||||
expect(detectVolumeMode(ing)).toBe('5ml')
|
||||
})
|
||||
})
|
||||
|
||||
describe('getDilutionRatio', () => {
|
||||
it('standard 1:10 ratio', () => {
|
||||
const ing = [
|
||||
{ oil: '薰衣草', drops: 10 },
|
||||
{ oil: '椰子油', drops: 100 },
|
||||
]
|
||||
expect(getDilutionRatio(ing)).toBe(10)
|
||||
})
|
||||
|
||||
it('no coconut returns 0', () => {
|
||||
const ing = [{ oil: '薰衣草', drops: 5 }]
|
||||
expect(getDilutionRatio(ing)).toBe(0)
|
||||
})
|
||||
|
||||
it('no EO returns 0', () => {
|
||||
const ing = [{ oil: '椰子油', drops: 50 }]
|
||||
expect(getDilutionRatio(ing)).toBe(0)
|
||||
})
|
||||
|
||||
it('1:5 ratio', () => {
|
||||
const ing = [
|
||||
{ oil: '薰衣草', drops: 10 },
|
||||
{ oil: '椰子油', drops: 50 },
|
||||
]
|
||||
expect(getDilutionRatio(ing)).toBe(5)
|
||||
})
|
||||
|
||||
it('1:1 ratio', () => {
|
||||
const ing = [
|
||||
{ oil: '薰衣草', drops: 10 },
|
||||
{ oil: '椰子油', drops: 10 },
|
||||
]
|
||||
expect(getDilutionRatio(ing)).toBe(1)
|
||||
})
|
||||
|
||||
it('rounds to nearest integer', () => {
|
||||
const ing = [
|
||||
{ oil: '薰衣草', drops: 3 },
|
||||
{ oil: '椰子油', drops: 20 },
|
||||
]
|
||||
// 20/3 = 6.67 → rounds to 7
|
||||
expect(getDilutionRatio(ing)).toBe(7)
|
||||
})
|
||||
|
||||
it('multiple EO oils summed for ratio', () => {
|
||||
const ing = [
|
||||
{ oil: '薰衣草', drops: 5 },
|
||||
{ oil: '乳香', drops: 5 },
|
||||
{ oil: '椰子油', drops: 100 },
|
||||
]
|
||||
// 100/10 = 10
|
||||
expect(getDilutionRatio(ing)).toBe(10)
|
||||
})
|
||||
})
|
||||
|
||||
describe('Real recipe scaling', () => {
|
||||
const baseRecipe = [
|
||||
{ oil: '薰衣草', drops: 6 },
|
||||
{ oil: '乳香', drops: 3 },
|
||||
{ oil: '薄荷', drops: 3 },
|
||||
{ oil: '椰子油', drops: 20 },
|
||||
]
|
||||
|
||||
it('scale to 5ml preserves approximate proportions', () => {
|
||||
const result = applyVolume(baseRecipe, '5ml', 10)
|
||||
const lav = result.find(i => i.oil === '薰衣草').drops
|
||||
const frank = result.find(i => i.oil === '乳香').drops
|
||||
const mint = result.find(i => i.oil === '薄荷').drops
|
||||
// Original: lav is 2x frank and 2x mint; frank == mint
|
||||
expect(frank).toBe(mint)
|
||||
expect(lav).toBeGreaterThanOrEqual(frank)
|
||||
})
|
||||
|
||||
it('scale to 10ml preserves approximate proportions', () => {
|
||||
const result = applyVolume(baseRecipe, '10ml', 10)
|
||||
const lav = result.find(i => i.oil === '薰衣草').drops
|
||||
const frank = result.find(i => i.oil === '乳香').drops
|
||||
const mint = result.find(i => i.oil === '薄荷').drops
|
||||
expect(frank).toBe(mint)
|
||||
expect(lav).toBeGreaterThanOrEqual(frank)
|
||||
})
|
||||
|
||||
it('10ml has approximately 2x the EO drops of 5ml', () => {
|
||||
const result5 = applyVolume(baseRecipe, '5ml', 10)
|
||||
const result10 = applyVolume(baseRecipe, '10ml', 10)
|
||||
const eo5 = sumEO(result5)
|
||||
const eo10 = sumEO(result10)
|
||||
// 10ml target = round(200/11) = 18, 5ml target = round(100/11) = 9
|
||||
expect(eo10 / eo5).toBeCloseTo(2, 0)
|
||||
})
|
||||
|
||||
it('30ml has approximately 3x the EO drops of 10ml', () => {
|
||||
const result10 = applyVolume(baseRecipe, '10ml', 10)
|
||||
const result30 = applyVolume(baseRecipe, '30ml', 10)
|
||||
const eo10 = sumEO(result10)
|
||||
const eo30 = sumEO(result30)
|
||||
expect(eo30 / eo10).toBeCloseTo(3, 0)
|
||||
})
|
||||
|
||||
it('scale up then scale down gives close to original EO count', () => {
|
||||
// Scale to 30ml
|
||||
const scaled30 = applyVolume(baseRecipe, '30ml', 10)
|
||||
// Now scale the 30ml result back to single
|
||||
const scaledBack = applyVolume(scaled30, 'single', 10)
|
||||
// Single: targetEO = round(10/10) = 1
|
||||
const totalEOBack = sumEO(scaledBack)
|
||||
expect(totalEOBack).toBeGreaterThanOrEqual(1)
|
||||
expect(totalEOBack).toBeLessThanOrEqual(3) // small due to rounding
|
||||
})
|
||||
|
||||
it('all EO drops are multiples of 0.5', () => {
|
||||
const result = applyVolume(baseRecipe, '5ml', 10)
|
||||
result.filter(i => i.oil !== '椰子油').forEach(i => {
|
||||
expect(i.drops * 2).toBe(Math.round(i.drops * 2))
|
||||
})
|
||||
})
|
||||
|
||||
it('coconut drops are always a whole number', () => {
|
||||
const result = applyVolume(baseRecipe, '10ml', 10)
|
||||
const coco = coconutDrops(result)
|
||||
expect(coco).toBe(Math.round(coco))
|
||||
})
|
||||
|
||||
it('total drops are within 1 drop of the volume preset (0.5 rounding)', () => {
|
||||
;['5ml', '10ml', '30ml'].forEach(mode => {
|
||||
const presets = { '5ml': 100, '10ml': 200, '30ml': 600 }
|
||||
const result = applyVolume(baseRecipe, mode, 10)
|
||||
const total = sumEO(result) + coconutDrops(result)
|
||||
// EO drops are rounded to nearest 0.5, so total may differ slightly
|
||||
expect(Math.abs(total - presets[mode])).toBeLessThanOrEqual(1.5)
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -69,24 +69,6 @@ body {
|
||||
.nav-tab:hover { color: var(--sage-dark); }
|
||||
.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 { padding: 24px; max-width: 960px; margin: 0 auto; }
|
||||
|
||||
@@ -463,7 +445,7 @@ body {
|
||||
.toast {
|
||||
position: fixed; bottom: 80px; left: 50%; transform: translateX(-50%);
|
||||
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;
|
||||
}
|
||||
|
||||
|
||||
@@ -8,25 +8,22 @@
|
||||
type="text"
|
||||
style="width:100%;padding:10px 14px;border:1.5px solid #d4cfc7;border-radius:10px;font-size:14px;margin-bottom:16px;outline:none;font-family:inherit;box-sizing:border-box"
|
||||
@keydown.enter="submitPrompt"
|
||||
@compositionstart="isComposing = true"
|
||||
@compositionend="onCompositionEnd"
|
||||
ref="promptInput"
|
||||
/>
|
||||
<div class="dialog-btn-row">
|
||||
<button v-if="dialogState.type !== 'alert'" class="dialog-btn-outline" @click="cancel">{{ dialogState.cancelText || '取消' }}</button>
|
||||
<button class="dialog-btn-primary" @click="ok">{{ dialogState.okText || '确定' }}</button>
|
||||
<button v-if="dialogState.type !== 'alert'" class="dialog-btn-outline" @click="cancel">取消</button>
|
||||
<button class="dialog-btn-primary" @click="ok">确定</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, watch, nextTick, shallowRef } from 'vue'
|
||||
import { ref, watch, nextTick } from 'vue'
|
||||
import { dialogState, closeDialog } from '../composables/useDialog'
|
||||
|
||||
const inputValue = ref('')
|
||||
const promptInput = ref(null)
|
||||
const isComposing = shallowRef(false)
|
||||
|
||||
watch(() => dialogState.visible, (v) => {
|
||||
if (v && dialogState.type === 'prompt') {
|
||||
@@ -49,15 +46,7 @@ function cancel() {
|
||||
else closeDialog(null)
|
||||
}
|
||||
|
||||
function onCompositionEnd(e) {
|
||||
isComposing.value = false
|
||||
// After compositionend, update the model value with the committed text
|
||||
inputValue.value = e.target.value
|
||||
}
|
||||
|
||||
function submitPrompt(e) {
|
||||
// Ignore Enter during IME composition (e.g. Chinese input method confirming a character)
|
||||
if (e.isComposing || isComposing.value) return
|
||||
function submitPrompt() {
|
||||
closeDialog(inputValue.value)
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -29,14 +29,6 @@
|
||||
class="login-input"
|
||||
@keydown.enter="submit"
|
||||
/>
|
||||
<input
|
||||
v-if="mode === 'register'"
|
||||
v-model="confirmPassword"
|
||||
type="password"
|
||||
placeholder="确认密码"
|
||||
class="login-input"
|
||||
@keydown.enter="submit"
|
||||
/>
|
||||
<input
|
||||
v-if="mode === 'register'"
|
||||
v-model="displayName"
|
||||
@@ -51,15 +43,6 @@
|
||||
<button class="login-submit" :disabled="loading" @click="submit">
|
||||
{{ loading ? '请稍候...' : (mode === 'login' ? '登录' : '注册') }}
|
||||
</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>
|
||||
@@ -69,7 +52,6 @@
|
||||
import { ref } from 'vue'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
import { useUiStore } from '../stores/ui'
|
||||
import { api } from '../composables/useApi'
|
||||
|
||||
const emit = defineEmits(['close'])
|
||||
|
||||
@@ -79,13 +61,9 @@ const ui = useUiStore()
|
||||
const mode = ref('login')
|
||||
const username = ref('')
|
||||
const password = ref('')
|
||||
const confirmPassword = ref('')
|
||||
const displayName = ref('')
|
||||
const errorMsg = ref('')
|
||||
const loading = ref(false)
|
||||
const showFeedback = ref(false)
|
||||
const feedbackText = ref('')
|
||||
const feedbackLoading = ref(false)
|
||||
|
||||
async function submit() {
|
||||
errorMsg.value = ''
|
||||
@@ -98,10 +76,6 @@ async function submit() {
|
||||
errorMsg.value = '请输入密码'
|
||||
return
|
||||
}
|
||||
if (mode.value === 'register' && password.value !== confirmPassword.value) {
|
||||
errorMsg.value = '两次输入的密码不一致'
|
||||
return
|
||||
}
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
@@ -117,37 +91,14 @@ async function submit() {
|
||||
ui.showToast('注册成功')
|
||||
}
|
||||
emit('close')
|
||||
if (ui.pendingAction) {
|
||||
ui.runPendingAction()
|
||||
} else {
|
||||
window.location.reload()
|
||||
}
|
||||
// Reload page data after auth change
|
||||
window.location.reload()
|
||||
} catch (e) {
|
||||
errorMsg.value = e?.message || (mode.value === 'login' ? '登录失败，请检查用户名和密码' : '注册失败，请重试')
|
||||
} finally {
|
||||
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>
|
||||
|
||||
<style scoped>
|
||||
@@ -155,7 +106,7 @@ async function submitFeedback() {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
background: rgba(0, 0, 0, 0.35);
|
||||
z-index: 6000;
|
||||
z-index: 5000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@@ -242,31 +193,4 @@ async function submitFeedback() {
|
||||
opacity: 0.6;
|
||||
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>
|
||||
|
||||
@@ -1,18 +1,30 @@
|
||||
<template>
|
||||
<div class="recipe-card" @click="$emit('click', index)">
|
||||
<div class="recipe-card-name">{{ recipe.name }}</div>
|
||||
<div v-if="visibleTags.length" class="recipe-card-tags">
|
||||
<span v-for="tag in visibleTags" :key="tag" class="tag" :class="{ 'tag-reviewed': tag === '已审核' }">{{ tag }}</span>
|
||||
<div class="card-name">{{ recipe.name }}</div>
|
||||
|
||||
<div v-if="recipe.tags && recipe.tags.length" class="card-tags">
|
||||
<span v-for="tag in recipe.tags" :key="tag" class="card-tag">{{ tag }}</span>
|
||||
</div>
|
||||
<div class="recipe-card-oils">{{ oilNames }}</div>
|
||||
<div class="recipe-card-bottom">
|
||||
<div class="recipe-card-price">💰 {{ priceInfo.cost }}</div>
|
||||
|
||||
<div class="card-oils">
|
||||
<span v-for="(ing, i) in recipe.ingredients" :key="i" class="card-oil">
|
||||
{{ ing.oil }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="card-bottom">
|
||||
<span class="card-price">
|
||||
{{ priceInfo.cost }}
|
||||
<span v-if="priceInfo.hasRetail" class="card-retail">零售 {{ priceInfo.retail }}</span>
|
||||
</span>
|
||||
<button
|
||||
class="fav-btn"
|
||||
class="card-star"
|
||||
:class="{ favorited: isFav }"
|
||||
@click.stop="$emit('toggle-fav', recipe._id)"
|
||||
:title="isFav ? '取消收藏' : '收藏'"
|
||||
>{{ isFav ? '★' : '☆' }}</button>
|
||||
>
|
||||
{{ isFav ? '★' : '☆' }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -21,9 +33,6 @@
|
||||
import { computed } from 'vue'
|
||||
import { useOilsStore } from '../stores/oils'
|
||||
import { useRecipesStore } from '../stores/recipes'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
|
||||
const EDITOR_ONLY_TAGS = ['已审核']
|
||||
|
||||
const props = defineProps({
|
||||
recipe: { type: Object, required: true },
|
||||
@@ -34,101 +43,102 @@ defineEmits(['click', 'toggle-fav'])
|
||||
|
||||
const oilsStore = useOilsStore()
|
||||
const recipesStore = useRecipesStore()
|
||||
const auth = useAuthStore()
|
||||
|
||||
const visibleTags = computed(() => {
|
||||
if (!props.recipe.tags) return []
|
||||
if (auth.canEdit) return props.recipe.tags
|
||||
return props.recipe.tags.filter(t => !EDITOR_ONLY_TAGS.includes(t))
|
||||
})
|
||||
|
||||
const oilNames = computed(() =>
|
||||
props.recipe.ingredients.map(i => i.oil).join('、')
|
||||
)
|
||||
const priceInfo = computed(() => oilsStore.fmtCostWithRetail(props.recipe.ingredients))
|
||||
const isFav = computed(() => recipesStore.isFavorite(props.recipe))
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.recipe-card {
|
||||
background: white;
|
||||
background: #fff;
|
||||
border-radius: 14px;
|
||||
padding: 18px;
|
||||
padding: 18px 16px 14px;
|
||||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
|
||||
cursor: pointer;
|
||||
box-shadow: 0 4px 20px rgba(90, 60, 30, 0.08);
|
||||
border: 2px solid transparent;
|
||||
transition: all 0.2s;
|
||||
transition: box-shadow 0.2s, transform 0.15s;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.recipe-card:hover {
|
||||
transform: translateY(-3px);
|
||||
box-shadow: 0 8px 32px rgba(90, 60, 30, 0.15);
|
||||
border-color: #c8ddc9;
|
||||
box-shadow: 0 4px 18px rgba(0, 0, 0, 0.1);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.recipe-card-name {
|
||||
.card-name {
|
||||
font-family: 'Noto Serif SC', serif;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #2c2416;
|
||||
margin-bottom: 8px;
|
||||
color: #3e3a44;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.recipe-card-tags {
|
||||
.card-tags {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 5px;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.tag {
|
||||
.card-tag {
|
||||
font-size: 11px;
|
||||
padding: 2px 8px;
|
||||
border-radius: 8px;
|
||||
background: #eef4ee;
|
||||
color: #5a7d5e;
|
||||
background: #f0ece4;
|
||||
color: #8a7e6b;
|
||||
}
|
||||
|
||||
.tag-reviewed {
|
||||
background: #e3f2fd;
|
||||
color: #1565c0;
|
||||
}
|
||||
|
||||
.recipe-card-oils {
|
||||
font-size: 12px;
|
||||
color: #9a8570;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.recipe-card-bottom {
|
||||
.card-oils {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.card-oil {
|
||||
font-size: 12px;
|
||||
color: #6b6375;
|
||||
background: #f8f7f5;
|
||||
padding: 2px 7px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.card-bottom {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 8px;
|
||||
justify-content: space-between;
|
||||
margin-top: auto;
|
||||
padding-top: 6px;
|
||||
}
|
||||
|
||||
.recipe-card-price {
|
||||
font-size: 13px;
|
||||
color: #5a7d5e;
|
||||
.card-price {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #4a9d7e;
|
||||
}
|
||||
|
||||
.fav-btn {
|
||||
.card-retail {
|
||||
font-size: 11px;
|
||||
font-weight: 400;
|
||||
color: #999;
|
||||
margin-left: 6px;
|
||||
}
|
||||
|
||||
.card-star {
|
||||
background: none;
|
||||
border: none;
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
color: #d4cfc7;
|
||||
color: #ccc;
|
||||
padding: 2px 4px;
|
||||
line-height: 1;
|
||||
transition: color 0.2s;
|
||||
}
|
||||
|
||||
.fav-btn.favorited {
|
||||
.card-star.favorited {
|
||||
color: #f5a623;
|
||||
}
|
||||
|
||||
.fav-btn:hover {
|
||||
.card-star:hover {
|
||||
color: #f5a623;
|
||||
}
|
||||
</style>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -2,73 +2,31 @@
|
||||
<div class="usermenu-overlay" @click.self="$emit('close')">
|
||||
<div class="usermenu-card">
|
||||
<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">
|
||||
<button class="usermenu-btn" @click="goMyDiary">
|
||||
📖 我的
|
||||
</button>
|
||||
<button class="usermenu-btn" @click="toggleNotifications">
|
||||
<button class="usermenu-btn" @click="goNotifications">
|
||||
🔔 通知
|
||||
<span v-if="unreadCount > 0" class="unread-badge">{{ unreadCount }}</span>
|
||||
</button>
|
||||
<button class="usermenu-btn" @click="showBugReport">
|
||||
🐛 反馈问题
|
||||
</button>
|
||||
<template v-if="auth.isAdmin">
|
||||
<button class="usermenu-btn" @click="goAdmin('audit')">📜 操作日志</button>
|
||||
<button class="usermenu-btn" @click="goAdmin('bugs')">🐛 Bug管理</button>
|
||||
<button class="usermenu-btn" @click="goAdmin('users')">👥 用户管理</button>
|
||||
</template>
|
||||
<button class="usermenu-btn usermenu-btn-logout" @click="handleLogout">
|
||||
🚪 退出登录
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Inline Notification Panel -->
|
||||
<div v-if="showNotifPanel" class="notif-panel">
|
||||
<div class="notif-header">
|
||||
<span>通知 ({{ notifications.length }})</span>
|
||||
<button v-if="unreadCount > 0" class="notif-mark-all" @click="markAllRead">全部已读</button>
|
||||
</div>
|
||||
<div class="notif-list">
|
||||
<div v-for="n in notifications.slice(0, 20)" :key="n.id"
|
||||
class="notif-item" :class="{ unread: !n.is_read }">
|
||||
<div class="notif-item-header">
|
||||
<div class="notif-title">{{ n.title }}</div>
|
||||
<div v-if="!n.is_read" class="notif-actions">
|
||||
<!-- 搜索未收录通知：已添加按钮 -->
|
||||
<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 v-if="n.body" class="notif-body">{{ n.body }}</div>
|
||||
<div class="notif-time">{{ formatTime(n.created_at) }}</div>
|
||||
</div>
|
||||
<div v-if="notifications.length === 0" class="notif-empty">暂无通知</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Bug Report Modal -->
|
||||
<div v-if="showBugForm" class="bug-form">
|
||||
<textarea v-model="bugContent" class="bug-textarea" rows="3" placeholder="描述你遇到的问题..."></textarea>
|
||||
<div class="bug-form-actions">
|
||||
<button class="btn-sm btn-outline" @click="showBugForm = false">取消</button>
|
||||
<button class="btn-sm btn-primary" @click="submitBug" :disabled="!bugContent.trim()">提交</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted } from 'vue'
|
||||
import { ref, computed } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
import { useUiStore } from '../stores/ui'
|
||||
import { api } from '../composables/useApi'
|
||||
|
||||
const emit = defineEmits(['close'])
|
||||
|
||||
@@ -76,123 +34,34 @@ const auth = useAuthStore()
|
||||
const ui = useUiStore()
|
||||
const router = useRouter()
|
||||
|
||||
const notifications = ref([])
|
||||
const showNotifPanel = ref(false)
|
||||
const showBugForm = ref(false)
|
||||
const bugContent = ref('')
|
||||
const unreadCount = ref(0)
|
||||
|
||||
const unreadCount = computed(() => notifications.value.filter(n => !n.is_read).length)
|
||||
|
||||
function formatTime(d) {
|
||||
if (!d) return ''
|
||||
return new Date(d + 'Z').toLocaleString('zh-CN', { month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit' })
|
||||
}
|
||||
const roleLabel = computed(() => {
|
||||
const map = {
|
||||
admin: '管理员',
|
||||
senior_editor: '高级编辑',
|
||||
editor: '编辑',
|
||||
viewer: '查看者',
|
||||
}
|
||||
return map[auth.user.role] || auth.user.role
|
||||
})
|
||||
|
||||
function goMyDiary() {
|
||||
emit('close')
|
||||
router.push('/mydiary')
|
||||
}
|
||||
|
||||
function goAdmin(section) {
|
||||
function goNotifications() {
|
||||
emit('close')
|
||||
router.push('/' + section)
|
||||
}
|
||||
|
||||
function toggleNotifications() {
|
||||
showNotifPanel.value = !showNotifPanel.value
|
||||
showBugForm.value = false
|
||||
}
|
||||
|
||||
function showBugReport() {
|
||||
showBugForm.value = !showBugForm.value
|
||||
showNotifPanel.value = false
|
||||
}
|
||||
|
||||
async function submitBug() {
|
||||
if (!bugContent.value.trim()) return
|
||||
try {
|
||||
const res = await api('/api/bug-report', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({ content: bugContent.value.trim(), priority: 0 }),
|
||||
})
|
||||
if (res.ok) {
|
||||
bugContent.value = ''
|
||||
showBugForm.value = false
|
||||
ui.showToast('反馈已提交')
|
||||
}
|
||||
} catch {
|
||||
ui.showToast('提交失败')
|
||||
}
|
||||
}
|
||||
|
||||
function isSearchMissing(n) {
|
||||
return n.title && n.title.includes('用户需求')
|
||||
}
|
||||
|
||||
function isReviewable(n) {
|
||||
if (!n.title) return false
|
||||
// Admin: review recipe/business/applications
|
||||
if (auth.isAdmin) {
|
||||
return n.title.includes('待审核') || n.title.includes('商业认证') || n.title.includes('申请') || n.title.includes('推荐通过')
|
||||
}
|
||||
// Senior editor: assigned reviews
|
||||
if (auth.canManage && n.title.includes('请审核')) return true
|
||||
return false
|
||||
}
|
||||
|
||||
async function markAdded(n) {
|
||||
const { showConfirm: confirm } = await import('../composables/useDialog')
|
||||
const ok = await confirm('确认已添加该配方？将通知其他编辑者和搜索用户。')
|
||||
if (!ok) return
|
||||
try {
|
||||
await api(`/api/notifications/${n.id}/added`, { method: 'POST' })
|
||||
n.is_read = 1
|
||||
ui.showToast('已标记，已通知相关人员')
|
||||
} catch {
|
||||
await markOneRead(n)
|
||||
}
|
||||
}
|
||||
|
||||
function goReview(n) {
|
||||
markOneRead(n)
|
||||
emit('close')
|
||||
if (n.title.includes('配方') || n.title.includes('审核') || n.title.includes('推荐')) {
|
||||
localStorage.setItem('oil_open_pending', '1')
|
||||
router.push('/manage')
|
||||
} else if (n.title.includes('商业认证') || n.title.includes('申请')) {
|
||||
router.push('/users')
|
||||
}
|
||||
}
|
||||
|
||||
async function markOneRead(n) {
|
||||
try {
|
||||
await api(`/api/notifications/${n.id}/read`, { method: 'POST', body: '{}' })
|
||||
n.is_read = 1
|
||||
} catch {}
|
||||
}
|
||||
|
||||
async function markAllRead() {
|
||||
try {
|
||||
await api('/api/notifications/read-all', { method: 'POST', body: '{}' })
|
||||
notifications.value.forEach(n => n.is_read = 1)
|
||||
} catch {}
|
||||
}
|
||||
|
||||
async function loadNotifications() {
|
||||
try {
|
||||
const res = await api('/api/notifications')
|
||||
if (res.ok) notifications.value = await res.json()
|
||||
} catch {}
|
||||
router.push('/notifications')
|
||||
}
|
||||
|
||||
function handleLogout() {
|
||||
auth.logout()
|
||||
ui.showToast('已退出登录')
|
||||
emit('close')
|
||||
window.location.href = '/'
|
||||
window.location.reload()
|
||||
}
|
||||
|
||||
onMounted(loadNotifications)
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
@@ -210,82 +79,78 @@ onMounted(loadNotifications)
|
||||
border-radius: 14px;
|
||||
box-shadow: 0 6px 24px rgba(0, 0, 0, 0.15);
|
||||
padding: 18px 20px 14px;
|
||||
min-width: 200px;
|
||||
max-width: 340px;
|
||||
min-width: 180px;
|
||||
z-index: 4001;
|
||||
}
|
||||
|
||||
.usermenu-name { font-size: 16px; font-weight: 600; color: #3e3a44; margin-bottom: 14px; }
|
||||
|
||||
.usermenu-actions { display: flex; flex-direction: column; gap: 4px; }
|
||||
.usermenu-btn {
|
||||
display: flex; align-items: center; gap: 6px; width: 100%;
|
||||
padding: 9px 10px; border: none; background: none; border-radius: 8px;
|
||||
font-size: 14px; color: #3e3a44; cursor: pointer; font-family: inherit;
|
||||
text-align: left; transition: background 0.15s; position: relative;
|
||||
.usermenu-name {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #3e3a44;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
.usermenu-btn:hover { background: #f5f3f0; }
|
||||
|
||||
.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-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
width: 100%;
|
||||
padding: 9px 10px;
|
||||
border: none;
|
||||
background: none;
|
||||
border-radius: 8px;
|
||||
font-size: 14px;
|
||||
color: #3e3a44;
|
||||
cursor: pointer;
|
||||
font-family: inherit;
|
||||
text-align: left;
|
||||
transition: background 0.15s;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.usermenu-btn:hover {
|
||||
background: #f5f3f0;
|
||||
}
|
||||
|
||||
.usermenu-btn-logout {
|
||||
color: #d9534f; margin-top: 6px; border-top: 1px solid #eee;
|
||||
padding-top: 12px; border-radius: 0 0 8px 8px;
|
||||
color: #d9534f;
|
||||
margin-top: 6px;
|
||||
border-top: 1px solid #eee;
|
||||
padding-top: 12px;
|
||||
border-radius: 0 0 8px 8px;
|
||||
}
|
||||
|
||||
.unread-badge {
|
||||
background: #d9534f; color: #fff; font-size: 11px; font-weight: 600;
|
||||
min-width: 18px; height: 18px; line-height: 18px; text-align: center;
|
||||
border-radius: 9px; padding: 0 5px; margin-left: auto;
|
||||
background: #d9534f;
|
||||
color: #fff;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
min-width: 18px;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
text-align: center;
|
||||
border-radius: 9px;
|
||||
padding: 0 5px;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
/* Notification panel */
|
||||
.notif-panel {
|
||||
margin-top: 12px; border-top: 1px solid #eee; padding-top: 10px;
|
||||
}
|
||||
.notif-header {
|
||||
display: flex; justify-content: space-between; align-items: center;
|
||||
font-size: 13px; font-weight: 600; color: #666; margin-bottom: 8px;
|
||||
}
|
||||
.notif-mark-all {
|
||||
background: none; border: none; color: var(--sage, #7a9e7e);
|
||||
cursor: pointer; font-size: 12px; font-family: inherit;
|
||||
}
|
||||
.notif-list { max-height: 250px; overflow-y: auto; }
|
||||
.notif-item {
|
||||
padding: 8px 0; border-bottom: 1px solid #f5f5f5; font-size: 13px;
|
||||
}
|
||||
.notif-item.unread { background: #fafafa; }
|
||||
.notif-item-header { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
|
||||
.notif-title { font-weight: 500; color: #333; flex: 1; }
|
||||
.notif-mark-one {
|
||||
background: none; border: 1px solid #ccc; border-radius: 6px;
|
||||
font-size: 11px; color: #7a9e7e; cursor: pointer; padding: 2px 8px;
|
||||
font-family: inherit; white-space: nowrap; flex-shrink: 0;
|
||||
}
|
||||
.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-time { color: #bbb; font-size: 11px; margin-top: 2px; }
|
||||
.notif-empty { text-align: center; color: #ccc; padding: 16px; font-size: 13px; }
|
||||
|
||||
/* Bug report form */
|
||||
.bug-form { margin-top: 12px; border-top: 1px solid #eee; padding-top: 10px; }
|
||||
.bug-textarea {
|
||||
width: 100%; padding: 8px 10px; border: 1.5px solid #d4cfc7;
|
||||
border-radius: 8px; font-size: 13px; font-family: inherit;
|
||||
outline: none; resize: vertical; box-sizing: border-box;
|
||||
}
|
||||
.bug-textarea:focus { border-color: #7a9e7e; }
|
||||
.bug-form-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 8px; }
|
||||
.btn-sm { padding: 6px 14px; border-radius: 8px; font-size: 13px; cursor: pointer; font-family: inherit; border: none; }
|
||||
.btn-primary { background: #7a9e7e; color: white; }
|
||||
.btn-outline { background: white; color: #666; border: 1px solid #d4cfc7; }
|
||||
.btn-sm:disabled { opacity: 0.5; cursor: not-allowed; }
|
||||
</style>
|
||||
|
||||
@@ -24,16 +24,7 @@ async function request(path, opts = {}) {
|
||||
|
||||
async function requestJSON(path, opts = {}) {
|
||||
const res = await request(path, opts)
|
||||
if (!res.ok) {
|
||||
let msg = `${res.status}`
|
||||
try {
|
||||
const body = await res.json()
|
||||
msg = body.detail || body.message || msg
|
||||
} catch {}
|
||||
const err = new Error(msg)
|
||||
err.status = res.status
|
||||
throw err
|
||||
}
|
||||
if (!res.ok) throw res
|
||||
return res.json()
|
||||
}
|
||||
|
||||
|
||||
@@ -5,8 +5,6 @@ export const dialogState = reactive({
|
||||
type: 'alert', // 'alert', 'confirm', 'prompt'
|
||||
message: '',
|
||||
defaultValue: '',
|
||||
okText: '',
|
||||
cancelText: '',
|
||||
resolve: null
|
||||
})
|
||||
|
||||
@@ -15,19 +13,15 @@ export function showAlert(msg) {
|
||||
dialogState.visible = true
|
||||
dialogState.type = 'alert'
|
||||
dialogState.message = msg
|
||||
dialogState.okText = ''
|
||||
dialogState.cancelText = ''
|
||||
dialogState.resolve = resolve
|
||||
})
|
||||
}
|
||||
|
||||
export function showConfirm(msg, opts = {}) {
|
||||
export function showConfirm(msg) {
|
||||
return new Promise(resolve => {
|
||||
dialogState.visible = true
|
||||
dialogState.type = 'confirm'
|
||||
dialogState.message = msg
|
||||
dialogState.okText = opts.okText || ''
|
||||
dialogState.cancelText = opts.cancelText || ''
|
||||
dialogState.resolve = resolve
|
||||
})
|
||||
}
|
||||
|
||||
@@ -1,49 +0,0 @@
|
||||
// Oil knowledge cards - usage guides for common essential oils
|
||||
// Ported from original vanilla JS implementation
|
||||
|
||||
export const OIL_CARDS = {
|
||||
'野橘': { emoji: '🍊', en: 'Wild Orange', effects: '安抚镇静、驱散负能量、紧张情绪和压力\n抗氧化、消炎、抗病毒、增强免疫\n提振食欲，刺激胆汁分泌，促进消化\n促进循环', usage: '日常香薰，提振情绪、舒压，营造愉悦氛围\n饮水加入 1至2 滴，护肝抗病毒\n泡澡时滴 3至4 滴，消除疲劳，放松身心\n扫地、拖地时加入 3至5 滴，清新空气\n涂抹腹部促进消化\n涂抹肝区帮助肝脏排毒\n口腔溃疡时加入水中漱口', method: '🔹香薰 ｜ 🔸内用 ｜ 🔺涂抹', caution: '轻微光敏，白天涂抹注意防晒' },
|
||||
'冬青': { emoji: '🌿', en: 'Wintergreen', effects: '强效镇痛（肌肉、关节）\n抗炎、促进循环\n舒缓紧绷肌肉，抗痉挛', usage: '牙疼时加 1 滴到水中漱口\n扭伤、落枕、酸痛（如肩颈酸痛）处稀释涂抹\n运动前后按摩', method: '🔹香薰 ｜🔺涂抹（需 6 倍稀释）', caution: '不可内用、孕期慎用、避免儿童误食' },
|
||||
'生姜': { emoji: '🫚', en: 'Ginger', effects: '促进消化、暖胃\n活血、改善循环、祛湿\n抗炎、抗氧化、强健免疫\n缓解恶心、晕车\n促进骨骼、肌肉和关节的健康', usage: '胀气、腹冷时，稀释涂抹腹部或喝 1 滴\n手脚冰凉时，稀释涂抹脚底或将1滴加入热饮中\n晕车时，吸闻或滴在手心嗅吸\n祛除风寒可将 2 滴加入热水中泡脚\n痛经时，稀释涂抹于小腹并按摩\n做菜时可加入 1 滴帮助增添风味', method: '🔹香薰 ｜ 🔸内用 ｜ 🔺涂抹（需稀释）', caution: '' },
|
||||
'柠檬草': { emoji: '🍃', en: 'Lemongrass', effects: '强效抗菌、抗炎\n驱虫、净化空气\n扩张血管，促进循环，缓解肌肉疼痛', usage: '筋膜紧绷、腿麻或肌肉酸痛时稀释涂抹\n肩周炎时，6 倍稀释后涂抹于肩颈部位并按摩\n做菜时加入 1 滴，增加泰式风味\n加入椰子油中制成家居喷雾，涂抹在裸露肌肤上驱蚊虫\n洗衣时加 3至5 滴祛味杀菌\n日常香薰平衡情绪', method: '🔹香薰 ｜ 🔸内用 ｜ 🔺涂抹（需 6 倍稀释）', caution: '' },
|
||||
'柑橘清新': { emoji: '🍬', en: 'Citrus Bliss', effects: '提振精神，改善负面情绪\n净化空间\n降低压力', usage: '日常香薰提升愉悦感，提振精神，净化空间\n拖地时加几滴清新空气\n加入到护手霜中，滋润手部肌肤，享受清新香气', method: '🔹香薰 ｜ 🔺涂抹', caution: '含柑橘类，光敏注意白天涂抹' },
|
||||
'芳香调理': { emoji: '🤲', en: 'AromaTouch', effects: '放松紧绷肌肉，放松关节\n促进血液循环\n促进淋巴排毒\n提升免疫\n舒缓放松，减少紧张', usage: '稀释涂抹于太阳穴，缓解头痛，改善紧张情绪\n稀释涂抹于僵硬的身体部位如肩颈处并按摩，促进肌肉放松\n日常香薰或加入热水中泡澡，释放压力', method: '🔹香薰 ｜ 🔺涂抹', caution: '' },
|
||||
'西洋蓍草': { emoji: '🔵', en: 'Yarrow | Pom', effects: '改善肌肤老化症状\n美白肌肤，改善瑕疵\n呵护敏感肌肤，对抗炎症\n提升整体免疫', usage: '早晚护肤时，涂抹3至4滴于面部，改善皱纹和细纹，美白肌肤\n每天早晚舌下含服1滴，促进细胞健康，提升免疫', method: '🔸内用 ｜ 🔺涂抹', caution: '' },
|
||||
'新瑞活力': { emoji: '🌿', en: 'MetaPWR', effects: '促进新陈代谢，减肥\n抑制食欲，减少对甜食的渴望\n稳定血糖波动\n提振情绪，激励身心', usage: '饭前喝1至2滴，控制食欲，稳定血糖，提升代谢\n日常香薰可以帮助恢复能量，消除疲乏感\n稀释涂抹与身体需紧致的部位，帮助紧致塑形\n加入饮品中，帮助增添风味', method: '🔹香薰 ｜ 🔸内用 ｜ 🔺涂抹（需稀释）', caution: '' },
|
||||
'安定情绪': { emoji: '🌳', en: 'Balance', effects: '促进全身的放松\n减轻焦虑，缓解紧张情绪\n带来宁静和安定感', usage: '日常香薰稳定情绪，放松\n夜间香薰促进睡眠\n涂抹脚底或脊椎放松情绪，放松肌肉\n冥想、瑜伽前涂抹', method: '🔹香薰 ｜ 🔺涂抹', caution: '' },
|
||||
'安宁神气': { emoji: '😴', en: 'Serenity', effects: '促进深度睡眠\n放松身体，缓解焦虑\n平衡情绪\n平衡自律神经系统', usage: '夜间香薰或稀释涂抹脚底促进深度睡眠，释放压力\n稀释涂抹太阳穴或脚底舒缓压力\n吸闻缓解焦虑和紧张情绪', method: '🔹香薰 ｜ 🔺涂抹', caution: '' },
|
||||
'元气': { emoji: '🔥', en: 'Zendocrine', effects: '帮助身体净化，排毒\n维持肝脏和肾脏健康\n平衡情绪', usage: '饭前内用1至2滴帮助代谢\n稀释涂抹肝区或内服3滴帮助养护肝脏\n稀释涂抹后腰脊椎出帮助养护肾脏，排除毒素\n日常香薰消除压力', method: '🔹香薰 ｜ 🔸内用 ｜ 🔺涂抹', caution: '' },
|
||||
'温柔呵护': { emoji: '🌸', en: 'Soft Talk', effects: '平衡荷尔蒙\n抚平情绪波动\n调理经期不适\n舒缓压力\n提升女性魅力', usage: '稀释涂抹下腹部帮助平衡荷尔蒙，或进行经期调理\n手心嗅吸帮助舒缓压力，平衡情绪\n2滴直接涂抹于脖颈后侧或手腕动脉处，提升女性魅力', method: '🔹香薰 ｜ 🔺涂抹', caution: '' },
|
||||
'柠檬': { emoji: '🍋', en: 'Lemon', effects: '清洁身体与环境\n强健免疫系统\n帮助肝脏代谢、排毒\n抗氧化\n净化空气、去异味\n蔬果清洗、保鲜\n促进循环、提振精神', usage: '添加至护肤品中晚上使用\n添加至牙膏里美白牙齿\n滴入口中或水里喝下，一天三次，每次3至5滴，净化身体\n洗水果和蔬菜时添加 1至2 滴浸泡\n嗓子疼或感冒初期时，含服柠檬1至2滴\n日常香薰提振情绪，护肝', method: '🔹香薰 ｜ 🔸内用 ｜ 🔺涂抹（夜间）', caution: '光敏性，白天避免涂抹' },
|
||||
'薰衣草': { emoji: '💜', en: 'Lavender', effects: '镇静安神、改善睡眠、缓解头痛\n舒缓压力、平衡情绪、抗抑郁\n烧烫伤修复、疤痕、痘印\n促进伤口修复、止血\n促进细胞再生，修复结缔组织\n抗炎、抗过敏、止痛\n皮肤舒缓止痒，如蚊虫叮咬', usage: '烧伤、烫伤、割伤及任何伤口处涂抹，止血防疤\n夜间香薰助眠，白天香薰舒缓情绪\n鱼刺卡嗓子时滴入口中\n加入护肤品中平衡油脂、改善痘痘、去疤痕', method: '🔹香薰 ｜ 🔸内用 ｜ 🔺涂抹（儿童/敏感肌需稀释）', caution: '' },
|
||||
'椒样薄荷': { emoji: '🌿', en: 'Peppermint', effects: '促进健康的呼吸系统\n祛痰、抗粘膜发炎、打开呼吸道\n强肝利胆，促进消化\n退热、缓解中暑\n清凉止痒\n提神醒脑、提升专注、缓解头痛', usage: '白天香薰提神醒脑，清新空气\n按摩头部缓解头疼、提神醒脑\n蚊虫叮咬后，涂抹止痒\n混入水中进行漱口，清新口气\n发烧时涂抹额头腋下帮助降温\n打嗝、咳嗽、鼻塞时吸闻\n消化不良时稀释涂抹于腹部或内用 2 滴', method: '🔹香薰 ｜ 🔸内用 ｜ 🔺涂抹（儿童/敏感肌需稀释）', caution: '孕期/高血压慎用，晚上少用' },
|
||||
'茶树': { emoji: '🌱', en: 'Tea Tree', effects: '抗菌、抗病毒、抗真菌\n提升免疫力\n头皮屑护理\n预防化脓\n居家杀菌净化', usage: '各种痤疮处点涂\n加入护肤品中，清洁皮肤\n洗头时加 1 滴到洗头膏，去头皮屑\n洗衣服时加入 3至5 滴，杀菌祛味\n脚气时用茶树泡脚\n感冒时涂抹，杀菌抗病毒', method: '🔹香薰 ｜ 🔸内用 ｜ 🔺涂抹（儿童/敏感肌需稀释）', caution: '' },
|
||||
'西班牙牛至': { emoji: '🔥', en: 'Oregano', effects: '强抗菌、抗病毒、抗顽固性真菌\n成人炎症辅助\n促进消化\n强抗氧化、抗衰老\n免疫力提升', usage: '洗衣服或拖地时加入 3至5 滴，消炎杀菌\n吃坏肚子时灌于胶囊中内用\n灰指甲时稀释涂抹于患处\n流感季节时香薰，杀灭空气中微生物', method: '🔹香薰 ｜ 🔸内用（胶囊） ｜ 🔺涂抹（需高倍稀释）', caution: '' },
|
||||
'保卫': { emoji: '🛡', en: 'On Guard', effects: '强化免疫力\n抗氧化\n天然杀菌、净化空气\n维护口腔健康', usage: '日常香熏净化空气，强化免疫力\n流感季节或换季时香薰\n混入水中漱口，保持口气清新\n日常稀释涂抹于脊椎或脚底，强化免疫力\n感冒时涂抹，抗菌抗病毒', method: '🔹香薰 ｜ 🔸内用 ｜ 🔺涂抹（儿童/敏感肌需稀释）', caution: '含肉桂丁香，不宜频繁涂抹' },
|
||||
'顺畅呼吸': { emoji: '🌬', en: 'Breathe', effects: '帮助缓解鼻炎、感冒等呼吸道不适\n促进呼吸系统健康\n净化空气', usage: '日常香薰，强健呼吸系统，净化空气\n咳嗽、鼻塞时香薰、吸闻、涂抹于鼻翼、喉咙或肺部\n打鼾、哮喘、鼻炎可日常吸闻\n运动前吸闻，扩张呼吸道', method: '🔹香薰 ｜ 🔺涂抹（儿童/敏感肌需稀释）', caution: '' },
|
||||
'乐活': { emoji: '🍃', en: 'DigestZen', effects: '促进消化\n缓解胀气、消化不良、便秘等胃肠不适', usage: '便秘时，稀释涂抹肚脐周围并顺时针揉腹\n喝酒前后各喝2滴，解酒护肝\n晕车时吸闻或稀释涂抹肚脐周围\n拉肚子时逆时针揉腹', method: '🔹熏香 ｜ 🔸内用 ｜ 🔺涂抹（儿童/敏感肌需稀释）', caution: '' },
|
||||
'舒缓': { emoji: '🌿', en: 'Deep Blue', effects: '缓解肌肉酸痛\n抗痉挛，抗炎', usage: '肌肉酸痛、扭伤、挫伤、肩颈紧绷、落枕、关节疼痛时稀释涂抹于患处', method: '🔺涂抹（需稀释）', caution: '' },
|
||||
'乳香': { emoji: '👑', en: 'Frankincense', effects: '促进伤口愈合，促进细胞健康\n抗氧化、抗发炎、抗衰老、淡纹\n活血行气\n疏通血管\n滋养大脑神经', usage: '加入护肤品中，淡斑，抗衰\n稀释后涂抹大眼眶，改善视力\n早晚舌下含服 2 滴，提高血氧含量\n夜间香薰，滋养大脑，安眠\n任何情况下，想不起来用什么就用乳香', method: '🔹香薰 ｜ 🔸内用 ｜ 🔺涂抹', caution: '' },
|
||||
}
|
||||
|
||||
export const OIL_CARD_ALIAS = {
|
||||
'仕女呵护': '温柔呵护',
|
||||
'薄荷呵护': '椒样薄荷',
|
||||
'牛至呵护': '西班牙牛至',
|
||||
}
|
||||
|
||||
export function getOilCard(name) {
|
||||
if (OIL_CARDS[name]) return OIL_CARDS[name]
|
||||
if (OIL_CARD_ALIAS[name] && OIL_CARDS[OIL_CARD_ALIAS[name]]) return OIL_CARDS[OIL_CARD_ALIAS[name]]
|
||||
const base = name.replace(/呵护$/, '')
|
||||
if (base !== name && OIL_CARDS[base]) return OIL_CARDS[base]
|
||||
return null
|
||||
}
|
||||
|
||||
export function setOilCard(name, card) {
|
||||
if (card && (card.effects || card.usage)) {
|
||||
OIL_CARDS[name] = card
|
||||
} else {
|
||||
delete OIL_CARDS[name]
|
||||
}
|
||||
}
|
||||
@@ -14,27 +14,14 @@ const OIL_EN = {
|
||||
'柠檬草': 'Lemongrass', '杜松浆果': 'Juniper Berry', '甜橙': 'Wild Orange',
|
||||
'香茅': 'Citronella', '薄荷': 'Peppermint', '扁柏': 'Arborvitae',
|
||||
'古巴香脂': 'Copaiba', '椰子油': 'Coconut Oil',
|
||||
'芳香调理': 'AromaTouch', '保卫复方': 'On Guard', '保卫': 'On Guard',
|
||||
'乐活复方': 'Balance', '乐活': 'DigestZen',
|
||||
'舒缓复方': 'Past Tense', '舒缓': 'Deep Blue',
|
||||
'净化复方': 'Purify', '净化清新': 'Purify',
|
||||
'呼吸复方': 'Breathe', '顺畅呼吸': 'Breathe',
|
||||
'舒压复方': 'Adaptiv', '安定情绪': 'Balance',
|
||||
'安宁神气': 'Serenity', '多特瑞': 'doTERRA',
|
||||
'野橘': 'Wild Orange', '柑橘清新': 'Citrus Bliss',
|
||||
'新瑞活力': 'MetaPWR', '元气': 'Zendocrine',
|
||||
'温柔呵护': 'ClaryCalm', '西洋蓍草': 'Yarrow|Pom',
|
||||
'西班牙牛至': 'Oregano',
|
||||
'芳香调理': 'AromaTouch', '保卫复方': 'On Guard',
|
||||
'乐活复方': 'Balance', '舒缓复方': 'Past Tense',
|
||||
'净化复方': 'Purify', '呼吸复方': 'Breathe',
|
||||
'舒压复方': 'Adaptiv', '多特瑞': 'doTERRA',
|
||||
}
|
||||
|
||||
export function oilEn(name) {
|
||||
if (OIL_EN[name]) return OIL_EN[name]
|
||||
// Try without common suffixes
|
||||
const base = name.replace(/复方$|呵护$/, '')
|
||||
if (base !== name && OIL_EN[base]) return OIL_EN[base]
|
||||
// Try adding suffixes
|
||||
if (OIL_EN[name + '复方']) return OIL_EN[name + '复方']
|
||||
return ''
|
||||
return OIL_EN[name] || ''
|
||||
}
|
||||
|
||||
export function recipeNameEn(name) {
|
||||
|
||||
@@ -1,87 +0,0 @@
|
||||
/**
|
||||
* Simple pinyin initial matching for Chinese oil names.
|
||||
* Maps common Chinese characters used in essential oil names to their pinyin initials.
|
||||
* This is a lightweight approach - no full pinyin library needed.
|
||||
*/
|
||||
|
||||
// Common characters in essential oil / herb names mapped to pinyin initials
|
||||
const PINYIN_MAP = {
|
||||
'薰': 'x', '衣': 'y', '草': 'c', '茶': 'c', '树': 's',
|
||||
'柠': 'n', '檬': 'm', '薄': 'b', '荷': 'h', '迷': 'm',
|
||||
'迭': 'd', '香': 'x', '乳': 'r', '沉': 'c', '丝': 's',
|
||||
'柏': 'b', '尤': 'y', '加': 'j', '利': 'l', '丁': 'd',
|
||||
'肉': 'r', '桂': 'g', '罗': 'l', '勒': 'l', '百': 'b',
|
||||
'里': 'l', '牛': 'n', '至': 'z', '马': 'm', '鞭': 'b',
|
||||
'天': 't', '竺': 'z', '葵': 'k', '生': 's', '姜': 'j',
|
||||
'黑': 'h', '胡': 'h', '椒': 'j', '玫': 'm', '瑰': 'g',
|
||||
'茉': 'm', '莉': 'l', '依': 'y', '兰': 'l', '花': 'h',
|
||||
'橙': 'c', '佛': 'f', '手': 's', '柑': 'g', '葡': 'p',
|
||||
'萄': 't', '柚': 'y', '甜': 't', '苦': 'k', '野': 'y',
|
||||
'山': 's', '松': 's', '杉': 's', '杜': 'd', '雪': 'x',
|
||||
'莲': 'l', '芦': 'l', '荟': 'h', '白': 'b', '芷': 'z',
|
||||
'当': 'd', '归': 'g', '川': 'c', '芎': 'x', '红': 'h',
|
||||
'枣': 'z', '枸': 'g', '杞': 'q', '菊': 'j', '洋': 'y',
|
||||
'甘': 'g', '菘': 's', '蓝': 'l', '永': 'y', '久': 'j',
|
||||
'快': 'k', '乐': 'l', '鼠': 's', '尾': 'w', '岩': 'y',
|
||||
'冷': 'l', '杰': 'j', '绿': 'lv', '芫': 'y', '荽': 's',
|
||||
'椰': 'y', '子': 'z', '油': 'y', '基': 'j', '底': 'd',
|
||||
'精': 'j', '纯': 'c', '露': 'l', '木': 'm', '果': 'g',
|
||||
'叶': 'y', '根': 'g', '皮': 'p', '籽': 'z', '仁': 'r',
|
||||
'大': 'd', '小': 'x', '西': 'x', '东': 'd', '南': 'n',
|
||||
'北': 'b', '中': 'z', '新': 'x', '古': 'g', '老': 'l',
|
||||
'春': 'c', '夏': 'x', '秋': 'q', '冬': 'd', '温': 'w',
|
||||
'热': 'r', '凉': 'l', '冰': 'b', '火': 'h', '水': 's',
|
||||
'金': 'j', '银': 'y', '铜': 't', '铁': 't', '玉': 'y',
|
||||
'珍': 'z', '珠': 'z', '翠': 'c', '碧': 'b', '紫': 'z',
|
||||
'青': 'q', '蓝': 'l', '绿': 'lv', '黄': 'h', '棕': 'z',
|
||||
'褐': 'h', '灰': 'h', '粉': 'f', '豆': 'd', '蔻': 'k',
|
||||
'藿': 'h', '苏': 's', '萃': 'c', '缬': 'x', '安': 'a',
|
||||
'息': 'x', '宁': 'n', '静': 'j', '和': 'h', '平': 'p',
|
||||
'舒': 's', '缓': 'h', '放': 'f', '松': 's', '活': 'h',
|
||||
'力': 'l', '能': 'n', '量': 'l', '保': 'b', '护': 'h',
|
||||
'防': 'f', '御': 'y', '健': 'j', '康': 'k', '美': 'm',
|
||||
'丽': 'l', '清': 'q', '新': 'x', '自': 'z', '然': 'r',
|
||||
'植': 'z', '物': 'w', '芳': 'f', '疗': 'l', '复': 'f',
|
||||
'方': 'f', '单': 'd', '配': 'p', '调': 'd',
|
||||
'忍': 'r', '圆': 'y', '侧': 'c', '呵': 'h', '铠': 'k',
|
||||
'浆': 'j', '萸': 'y', '瑞': 'r', '芙': 'f', '蓉': 'r',
|
||||
'桃': 't', '梅': 'm', '兰': 'l', '竹': 'z', '荆': 'j',
|
||||
'藏': 'z', '蒿': 'h', '艾': 'a', '牡': 'm', '丹': 'd',
|
||||
'参': 's', '芝': 'z', '灵': 'l', '芍': 's', '药': 'y',
|
||||
'枫': 'f', '桦': 'h', '柳': 'l', '榉': 'j', '楠': 'n',
|
||||
'海': 'h', '滨': 'b', '泽': 'z', '湖': 'h', '溪': 'x',
|
||||
'威': 'w', '夷': 'y', '亚': 'y', '欧': 'o', '非': 'f',
|
||||
'印': 'y', '澳': 'a', '美': 'm', '德': 'd', '法': 'f',
|
||||
'意': 'y', '英': 'y', '日': 'r', '韩': 'h', '泰': 't',
|
||||
'醒': 'x', '提': 't', '振': 'z', '镇': 'z', '抚': 'f',
|
||||
'触': 'c', '修': 'x', '养': 'y', '滋': 'z', '润': 'r',
|
||||
'呼': 'h', '吸': 'x', '消': 'x', '化': 'h', '排': 'p',
|
||||
'毒': 'd', '净': 'j', '纤': 'x', '体': 't', '塑': 's',
|
||||
}
|
||||
|
||||
/**
|
||||
* Get pinyin initials string for a Chinese name.
|
||||
* e.g. "薰衣草" -> "xyc"
|
||||
*/
|
||||
export function getPinyinInitials(name) {
|
||||
let result = ''
|
||||
for (const char of name) {
|
||||
const initial = PINYIN_MAP[char]
|
||||
if (initial) {
|
||||
result += initial
|
||||
}
|
||||
}
|
||||
return result
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if a query matches a name by pinyin initials.
|
||||
* The query is matched as a prefix or substring of the pinyin initials.
|
||||
*/
|
||||
export function matchesPinyinInitials(name, query) {
|
||||
if (!query || !name) return false
|
||||
const initials = getPinyinInitials(name)
|
||||
if (!initials) return false
|
||||
const q = query.toLowerCase()
|
||||
return initials.startsWith(q)
|
||||
}
|
||||
@@ -1,38 +0,0 @@
|
||||
/**
|
||||
* Save image — on mobile use navigator.share (same as recipe card),
|
||||
* on desktop trigger download.
|
||||
*/
|
||||
|
||||
const isMobile = () => /iPhone|iPad|iPod|Android/i.test(navigator.userAgent)
|
||||
|
||||
/**
|
||||
* Save from a data URL.
|
||||
* Mobile: navigator.share({files}) → system share sheet (save to photos / AirDrop etc)
|
||||
* Desktop: download link.
|
||||
*/
|
||||
export async function saveImageFromUrl(dataUrl, filename) {
|
||||
// Try navigator.share with files (works on iOS Safari, Chrome mobile)
|
||||
if (navigator.share && navigator.canShare) {
|
||||
try {
|
||||
const res = await fetch(dataUrl)
|
||||
const blob = await res.blob()
|
||||
const file = new File([blob], filename + '.png', { type: 'image/png' })
|
||||
if (navigator.canShare({ files: [file] })) {
|
||||
await navigator.share({ files: [file] })
|
||||
return 'shared'
|
||||
}
|
||||
} catch (e) {
|
||||
// User cancelled share or share failed, fall through to download
|
||||
if (e.name === 'AbortError') return 'cancelled'
|
||||
}
|
||||
}
|
||||
|
||||
// Fallback: direct download
|
||||
const a = document.createElement('a')
|
||||
a.href = dataUrl
|
||||
a.download = filename + '.png'
|
||||
document.body.appendChild(a)
|
||||
a.click()
|
||||
setTimeout(() => a.remove(), 100)
|
||||
return 'downloaded'
|
||||
}
|
||||
@@ -260,99 +260,3 @@ export function parseSingleBlock(raw, oilNames) {
|
||||
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,
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
@@ -10,13 +10,11 @@ const routes = [
|
||||
path: '/manage',
|
||||
name: 'RecipeManager',
|
||||
component: () => import('../views/RecipeManager.vue'),
|
||||
meta: { requiresAuth: true },
|
||||
},
|
||||
{
|
||||
path: '/inventory',
|
||||
name: 'Inventory',
|
||||
component: () => import('../views/Inventory.vue'),
|
||||
meta: { requiresAuth: true },
|
||||
},
|
||||
{
|
||||
path: '/oils',
|
||||
@@ -27,31 +25,26 @@ const routes = [
|
||||
path: '/projects',
|
||||
name: 'Projects',
|
||||
component: () => import('../views/Projects.vue'),
|
||||
meta: { requiresAuth: true },
|
||||
},
|
||||
{
|
||||
path: '/mydiary',
|
||||
name: 'MyDiary',
|
||||
component: () => import('../views/MyDiary.vue'),
|
||||
meta: { requiresAuth: true },
|
||||
},
|
||||
{
|
||||
path: '/audit',
|
||||
name: 'AuditLog',
|
||||
component: () => import('../views/AuditLog.vue'),
|
||||
meta: { requiresAuth: true },
|
||||
},
|
||||
{
|
||||
path: '/bugs',
|
||||
name: 'BugTracker',
|
||||
component: () => import('../views/BugTracker.vue'),
|
||||
meta: { requiresAuth: true },
|
||||
},
|
||||
{
|
||||
path: '/users',
|
||||
name: 'UserManagement',
|
||||
component: () => import('../views/UserManagement.vue'),
|
||||
meta: { requiresAuth: true },
|
||||
},
|
||||
]
|
||||
|
||||
|
||||
@@ -18,9 +18,6 @@ export const useAuthStore = defineStore('auth', () => {
|
||||
// Getters
|
||||
const isLoggedIn = computed(() => user.value.id !== null)
|
||||
const isAdmin = computed(() => user.value.role === 'admin')
|
||||
const canManage = computed(() =>
|
||||
['senior_editor', 'admin'].includes(user.value.role)
|
||||
)
|
||||
const canEdit = computed(() =>
|
||||
['editor', 'senior_editor', 'admin'].includes(user.value.role)
|
||||
)
|
||||
@@ -28,6 +25,16 @@ export const useAuthStore = defineStore('auth', () => {
|
||||
|
||||
// Actions
|
||||
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) {
|
||||
await loadMe()
|
||||
}
|
||||
@@ -73,8 +80,10 @@ export const useAuthStore = defineStore('auth', () => {
|
||||
user.value = { ...DEFAULT_USER }
|
||||
}
|
||||
|
||||
function canEditRecipe() {
|
||||
return canEdit.value
|
||||
function canEditRecipe(recipe) {
|
||||
if (isAdmin.value || user.value.role === 'senior_editor') return true
|
||||
if (user.value.role === 'editor' && recipe._owner_id === user.value.id) return true
|
||||
return false
|
||||
}
|
||||
|
||||
return {
|
||||
@@ -82,7 +91,6 @@ export const useAuthStore = defineStore('auth', () => {
|
||||
user,
|
||||
isLoggedIn,
|
||||
isAdmin,
|
||||
canManage,
|
||||
canEdit,
|
||||
isBusiness,
|
||||
initToken,
|
||||
|
||||
@@ -14,16 +14,16 @@ export const VOLUME_DROPS = {
|
||||
}
|
||||
|
||||
export const useOilsStore = defineStore('oils', () => {
|
||||
const oils = ref({})
|
||||
const oilsMeta = ref({})
|
||||
const oils = ref(new Map())
|
||||
const oilsMeta = ref(new Map())
|
||||
|
||||
// Getters
|
||||
const oilNames = computed(() =>
|
||||
Object.keys(oils.value).sort((a, b) => a.localeCompare(b, 'zh'))
|
||||
[...oils.value.keys()].sort((a, b) => a.localeCompare(b, 'zh'))
|
||||
)
|
||||
|
||||
function pricePerDrop(name) {
|
||||
return oils.value[name] || 0
|
||||
return oils.value.get(name) || 0
|
||||
}
|
||||
|
||||
function calcCost(ingredients) {
|
||||
@@ -34,7 +34,7 @@ export const useOilsStore = defineStore('oils', () => {
|
||||
|
||||
function calcRetailCost(ingredients) {
|
||||
return ingredients.reduce((sum, ing) => {
|
||||
const meta = oilsMeta.value[ing.oil]
|
||||
const meta = oilsMeta.value.get(ing.oil)
|
||||
if (meta && meta.retailPrice && meta.dropCount) {
|
||||
return sum + (meta.retailPrice / meta.dropCount) * ing.drops
|
||||
}
|
||||
@@ -59,38 +59,36 @@ export const useOilsStore = defineStore('oils', () => {
|
||||
// Actions
|
||||
async function loadOils() {
|
||||
const data = await api.get('/api/oils')
|
||||
const newOils = {}
|
||||
const newMeta = {}
|
||||
const newOils = new Map()
|
||||
const newMeta = new Map()
|
||||
for (const oil of data) {
|
||||
const ppd = oil.drop_count ? oil.bottle_price / oil.drop_count : 0
|
||||
newOils[oil.name] = ppd
|
||||
newMeta[oil.name] = {
|
||||
newOils.set(oil.name, ppd)
|
||||
newMeta.set(oil.name, {
|
||||
bottlePrice: oil.bottle_price,
|
||||
dropCount: oil.drop_count,
|
||||
retailPrice: oil.retail_price ?? null,
|
||||
isActive: oil.is_active !== 0,
|
||||
enName: oil.en_name ?? null,
|
||||
}
|
||||
isActive: oil.is_active ?? true,
|
||||
})
|
||||
}
|
||||
oils.value = newOils
|
||||
oilsMeta.value = newMeta
|
||||
}
|
||||
|
||||
async function saveOil(name, bottlePrice, dropCount, retailPrice, enName = null) {
|
||||
async function saveOil(name, bottlePrice, dropCount, retailPrice) {
|
||||
await api.post('/api/oils', {
|
||||
name,
|
||||
bottle_price: bottlePrice,
|
||||
drop_count: dropCount,
|
||||
retail_price: retailPrice,
|
||||
en_name: enName,
|
||||
})
|
||||
await loadOils()
|
||||
}
|
||||
|
||||
async function deleteOil(name) {
|
||||
await api.delete(`/api/oils/${encodeURIComponent(name)}`)
|
||||
delete oils.value[name]
|
||||
delete oilsMeta.value[name]
|
||||
oils.value.delete(name)
|
||||
oilsMeta.value.delete(name)
|
||||
}
|
||||
|
||||
return {
|
||||
|
||||
@@ -16,11 +16,10 @@ export const useRecipesStore = defineStore('recipes', () => {
|
||||
_owner_name: r._owner_name ?? r.owner_name ?? '',
|
||||
_version: r._version ?? r.version ?? 1,
|
||||
name: r.name,
|
||||
en_name: r.en_name ?? '',
|
||||
note: r.note ?? '',
|
||||
tags: r.tags ?? [],
|
||||
ingredients: (r.ingredients ?? []).map((ing) => ({
|
||||
oil: ing.oil_name ?? ing.oil ?? ing.name,
|
||||
oil: ing.oil ?? ing.name,
|
||||
drops: ing.drops,
|
||||
})),
|
||||
}))
|
||||
@@ -53,12 +52,7 @@ export const useRecipesStore = defineStore('recipes', () => {
|
||||
return data
|
||||
} else {
|
||||
const data = await api.post('/api/recipes', recipe)
|
||||
// Refresh list; if refresh fails, still return success (recipe was saved)
|
||||
try {
|
||||
await loadRecipes()
|
||||
} catch (e) {
|
||||
console.warn('[saveRecipe] loadRecipes failed after save:', e)
|
||||
}
|
||||
await loadRecipes()
|
||||
return data
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,7 +5,6 @@ export const useUiStore = defineStore('ui', () => {
|
||||
const currentSection = ref('search')
|
||||
const showLoginModal = ref(false)
|
||||
const toasts = ref([])
|
||||
const pendingAction = ref(null)
|
||||
|
||||
let toastId = 0
|
||||
|
||||
@@ -21,10 +20,7 @@ export const useUiStore = defineStore('ui', () => {
|
||||
}, duration)
|
||||
}
|
||||
|
||||
function openLogin(afterLogin) {
|
||||
if (afterLogin) {
|
||||
pendingAction.value = afterLogin
|
||||
}
|
||||
function openLogin() {
|
||||
showLoginModal.value = true
|
||||
}
|
||||
|
||||
@@ -32,23 +28,13 @@ export const useUiStore = defineStore('ui', () => {
|
||||
showLoginModal.value = false
|
||||
}
|
||||
|
||||
function runPendingAction() {
|
||||
if (pendingAction.value) {
|
||||
const action = pendingAction.value
|
||||
pendingAction.value = null
|
||||
action()
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
currentSection,
|
||||
showLoginModal,
|
||||
toasts,
|
||||
pendingAction,
|
||||
showSection,
|
||||
showToast,
|
||||
openLogin,
|
||||
closeLogin,
|
||||
runPendingAction,
|
||||
}
|
||||
})
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
|
||||
<!-- Action Type Filters -->
|
||||
<div class="filter-row">
|
||||
<span class="filter-label">操作:</span>
|
||||
<span class="filter-label">操作类型:</span>
|
||||
<button
|
||||
v-for="action in actionTypes"
|
||||
:key="action.value"
|
||||
@@ -15,7 +15,7 @@
|
||||
</div>
|
||||
|
||||
<!-- User Filters -->
|
||||
<div class="filter-row" v-if="uniqueUsers.length > 1">
|
||||
<div class="filter-row" v-if="uniqueUsers.length > 0">
|
||||
<span class="filter-label">用户:</span>
|
||||
<button
|
||||
v-for="u in uniqueUsers"
|
||||
@@ -26,30 +26,26 @@
|
||||
>{{ u }}</button>
|
||||
</div>
|
||||
|
||||
<!-- Target Type Filters -->
|
||||
<div class="filter-row">
|
||||
<span class="filter-label">对象:</span>
|
||||
<button
|
||||
v-for="t in targetTypes"
|
||||
:key="t.value"
|
||||
class="filter-btn"
|
||||
:class="{ active: selectedTarget === t.value }"
|
||||
@click="selectedTarget = selectedTarget === t.value ? '' : t.value"
|
||||
>{{ t.label }}</button>
|
||||
</div>
|
||||
|
||||
<!-- Log List -->
|
||||
<div class="log-list">
|
||||
<div v-for="log in filteredLogs" :key="log.id" class="log-item">
|
||||
<div v-for="log in filteredLogs" :key="log._id || log.id" class="log-item">
|
||||
<div class="log-header">
|
||||
<span class="log-action" :class="actionColorClass(log.action)">{{ actionLabel(log.action) }}</span>
|
||||
<span class="log-action" :class="actionClass(log.action)">{{ actionLabel(log.action) }}</span>
|
||||
<span class="log-user">{{ log.user_name || log.username || '系统' }}</span>
|
||||
<span class="log-time">{{ formatTime(log.created_at) }}</span>
|
||||
</div>
|
||||
<div class="log-detail">
|
||||
<span v-if="log.target_name" class="log-target-name">{{ log.target_name }}</span>
|
||||
<span v-if="parsedDetail(log)" class="log-extra">{{ parsedDetail(log) }}</span>
|
||||
<span v-if="log.target_type" class="log-target">{{ log.target_type }}: </span>
|
||||
<span class="log-desc">{{ log.description || log.detail || formatDetail(log) }}</span>
|
||||
</div>
|
||||
<div v-if="log.changes" class="log-changes">
|
||||
<pre class="changes-pre">{{ typeof log.changes === 'string' ? log.changes : JSON.stringify(log.changes, null, 2) }}</pre>
|
||||
</div>
|
||||
<button
|
||||
v-if="log.undoable"
|
||||
class="btn-undo"
|
||||
@click="undoLog(log)"
|
||||
>↩ 撤销</button>
|
||||
</div>
|
||||
<div v-if="filteredLogs.length === 0" class="empty-hint">暂无日志记录</div>
|
||||
</div>
|
||||
@@ -65,52 +61,29 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted } from 'vue'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
import { useUiStore } from '../stores/ui'
|
||||
import { api } from '../composables/useApi'
|
||||
import { showConfirm } from '../composables/useDialog'
|
||||
|
||||
const auth = useAuthStore()
|
||||
const ui = useUiStore()
|
||||
|
||||
const logs = ref([])
|
||||
const loading = ref(false)
|
||||
const hasMore = ref(true)
|
||||
const page = ref(0)
|
||||
const pageSize = 100
|
||||
const pageSize = 50
|
||||
const selectedAction = ref('')
|
||||
const selectedUser = ref('')
|
||||
const selectedTarget = ref('')
|
||||
|
||||
const ACTION_MAP = {
|
||||
create_recipe: '新增配方',
|
||||
update_recipe: '编辑配方',
|
||||
delete_recipe: '删除配方',
|
||||
adopt_recipe: '采纳配方',
|
||||
reject_recipe: '拒绝配方',
|
||||
undo_delete_recipe: '恢复配方',
|
||||
upsert_oil: '编辑精油',
|
||||
delete_oil: '删除精油',
|
||||
create_tag: '新增标签',
|
||||
delete_tag: '删除标签',
|
||||
create_user: '创建用户',
|
||||
update_user: '修改用户',
|
||||
delete_user: '删除用户',
|
||||
undo_delete_user: '恢复用户',
|
||||
business_apply: '申请商业认证',
|
||||
approve_business: '通过商业认证',
|
||||
reject_business: '拒绝商业认证',
|
||||
grant_business: '开通商业认证',
|
||||
revoke_business: '撤销商业认证',
|
||||
}
|
||||
|
||||
const actionTypes = [
|
||||
{ value: 'recipe', label: '配方' },
|
||||
{ value: 'oil', label: '精油' },
|
||||
{ value: 'user', label: '用户' },
|
||||
{ value: 'tag', label: '标签' },
|
||||
{ value: 'adopt', label: '审核' },
|
||||
{ value: 'business', label: '商业认证' },
|
||||
]
|
||||
|
||||
const targetTypes = [
|
||||
{ value: 'recipe', label: '配方' },
|
||||
{ value: 'oil', label: '精油' },
|
||||
{ value: 'user', label: '用户' },
|
||||
{ value: 'create', label: '创建' },
|
||||
{ value: 'update', label: '更新' },
|
||||
{ value: 'delete', label: '删除' },
|
||||
{ value: 'login', label: '登录' },
|
||||
{ value: 'approve', label: '审核' },
|
||||
{ value: 'export', label: '导出' },
|
||||
]
|
||||
|
||||
const uniqueUsers = computed(() => {
|
||||
@@ -125,64 +98,69 @@ const uniqueUsers = computed(() => {
|
||||
const filteredLogs = computed(() => {
|
||||
let result = logs.value
|
||||
if (selectedAction.value) {
|
||||
result = result.filter(l => l.action.includes(selectedAction.value))
|
||||
result = result.filter(l => l.action === selectedAction.value)
|
||||
}
|
||||
if (selectedUser.value) {
|
||||
result = result.filter(l => (l.user_name || l.username) === selectedUser.value)
|
||||
}
|
||||
if (selectedTarget.value) {
|
||||
result = result.filter(l => l.target_type === selectedTarget.value)
|
||||
result = result.filter(l =>
|
||||
(l.user_name || l.username) === selectedUser.value
|
||||
)
|
||||
}
|
||||
return result
|
||||
})
|
||||
|
||||
function actionLabel(action) {
|
||||
return ACTION_MAP[action] || action
|
||||
const map = {
|
||||
create: '创建',
|
||||
update: '更新',
|
||||
delete: '删除',
|
||||
login: '登录',
|
||||
approve: '审核',
|
||||
reject: '拒绝',
|
||||
export: '导出',
|
||||
undo: '撤销',
|
||||
}
|
||||
return map[action] || action
|
||||
}
|
||||
|
||||
function actionColorClass(action) {
|
||||
if (action.includes('create') || action.includes('upsert')) return 'color-create'
|
||||
if (action.includes('update')) return 'color-update'
|
||||
if (action.includes('delete') || action.includes('reject')) return 'color-delete'
|
||||
if (action.includes('adopt') || action.includes('undo')) return 'color-approve'
|
||||
return ''
|
||||
}
|
||||
|
||||
function parsedDetail(log) {
|
||||
if (!log.detail) return ''
|
||||
try {
|
||||
const d = JSON.parse(log.detail)
|
||||
const parts = []
|
||||
if (d.from_role && d.to_role) parts.push(`${d.from_role} → ${d.to_role}`)
|
||||
if (d.from_user) parts.push(`来自: ${d.from_user}`)
|
||||
if (d.reason) parts.push(`原因: ${d.reason}`)
|
||||
if (d.business_name) parts.push(`商户: ${d.business_name}`)
|
||||
if (d.display_name) parts.push(`显示名: ${d.display_name}`)
|
||||
if (d.original_log_id) parts.push(`恢复自 #${d.original_log_id}`)
|
||||
if (parts.length) return parts.join(' · ')
|
||||
// For deleted users, show username
|
||||
if (d.username) return `用户名: ${d.username}`
|
||||
return ''
|
||||
} catch {
|
||||
return log.detail.length > 100 ? log.detail.substring(0, 100) + '...' : log.detail
|
||||
function actionClass(action) {
|
||||
return {
|
||||
'action-create': action === 'create',
|
||||
'action-update': action === 'update',
|
||||
'action-delete': action === 'delete' || action === 'reject',
|
||||
'action-login': action === 'login',
|
||||
'action-approve': action === 'approve',
|
||||
}
|
||||
}
|
||||
|
||||
function formatTime(t) {
|
||||
if (!t) return ''
|
||||
return new Date(t + 'Z').toLocaleString('zh-CN', {
|
||||
month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit',
|
||||
const d = new Date(t)
|
||||
return d.toLocaleString('zh-CN', {
|
||||
month: '2-digit',
|
||||
day: '2-digit',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit',
|
||||
second: '2-digit',
|
||||
})
|
||||
}
|
||||
|
||||
function formatDetail(log) {
|
||||
if (log.target_name) return log.target_name
|
||||
if (log.recipe_name) return log.recipe_name
|
||||
if (log.oil_name) return log.oil_name
|
||||
return ''
|
||||
}
|
||||
|
||||
async function fetchLogs() {
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await api(`/api/audit-log?offset=${page.value * pageSize}&limit=${pageSize}`)
|
||||
const res = await api(`/api/audit-logs?offset=${page.value * pageSize}&limit=${pageSize}`)
|
||||
if (res.ok) {
|
||||
const data = await res.json()
|
||||
const items = Array.isArray(data) ? data : data.logs || data.items || []
|
||||
if (items.length < pageSize) hasMore.value = false
|
||||
if (items.length < pageSize) {
|
||||
hasMore.value = false
|
||||
}
|
||||
logs.value.push(...items)
|
||||
}
|
||||
} catch {
|
||||
@@ -196,52 +174,207 @@ function loadMore() {
|
||||
fetchLogs()
|
||||
}
|
||||
|
||||
onMounted(() => fetchLogs())
|
||||
async function undoLog(log) {
|
||||
const ok = await showConfirm('确定撤销此操作？')
|
||||
if (!ok) return
|
||||
try {
|
||||
const id = log._id || log.id
|
||||
const res = await api(`/api/audit-logs/${id}/undo`, { method: 'POST' })
|
||||
if (res.ok) {
|
||||
ui.showToast('已撤销')
|
||||
// Refresh
|
||||
logs.value = []
|
||||
page.value = 0
|
||||
hasMore.value = true
|
||||
await fetchLogs()
|
||||
} else {
|
||||
ui.showToast('撤销失败')
|
||||
}
|
||||
} catch {
|
||||
ui.showToast('撤销失败')
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
fetchLogs()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.audit-log { padding: 0 12px 24px; }
|
||||
.page-title { margin: 0 0 16px; font-size: 16px; color: #3e3a44; }
|
||||
.audit-log {
|
||||
padding: 0 12px 24px;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
margin: 0 0 16px;
|
||||
font-size: 16px;
|
||||
color: #3e3a44;
|
||||
}
|
||||
|
||||
.filter-row {
|
||||
display: flex; align-items: center; gap: 6px; margin-bottom: 8px; flex-wrap: wrap;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
margin-bottom: 10px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.filter-label { font-size: 13px; color: #6b6375; font-weight: 500; white-space: nowrap; }
|
||||
|
||||
.filter-label {
|
||||
font-size: 13px;
|
||||
color: #6b6375;
|
||||
font-weight: 500;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.filter-btn {
|
||||
padding: 4px 12px; border-radius: 16px; border: 1.5px solid #e5e4e7;
|
||||
background: #fff; font-size: 12px; cursor: pointer; font-family: inherit; color: #6b6375;
|
||||
padding: 5px 14px;
|
||||
border-radius: 16px;
|
||||
border: 1.5px solid #e5e4e7;
|
||||
background: #fff;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
font-family: inherit;
|
||||
color: #6b6375;
|
||||
transition: all 0.15s;
|
||||
}
|
||||
|
||||
.filter-btn.active {
|
||||
background: #e8f5e9;
|
||||
border-color: #7ec6a4;
|
||||
color: #2e7d5a;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.filter-btn:hover {
|
||||
border-color: #d4cfc7;
|
||||
}
|
||||
|
||||
.log-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
}
|
||||
.filter-btn.active { background: #e8f5e9; border-color: #7ec6a4; color: #2e7d5a; font-weight: 600; }
|
||||
.filter-btn:hover { border-color: #d4cfc7; }
|
||||
|
||||
.log-list { display: flex; flex-direction: column; gap: 4px; }
|
||||
.log-item {
|
||||
padding: 10px 14px; background: #fff; border: 1.5px solid #e5e4e7; border-radius: 10px;
|
||||
padding: 12px 14px;
|
||||
background: #fff;
|
||||
border: 1.5px solid #e5e4e7;
|
||||
border-radius: 10px;
|
||||
transition: border-color 0.15s;
|
||||
}
|
||||
|
||||
.log-item:hover {
|
||||
border-color: #d4cfc7;
|
||||
}
|
||||
|
||||
.log-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
.log-item:hover { border-color: #d4cfc7; }
|
||||
|
||||
.log-header { display: flex; align-items: center; gap: 8px; }
|
||||
.log-action {
|
||||
padding: 2px 10px; border-radius: 10px; font-size: 11px; font-weight: 600;
|
||||
background: #f0eeeb; color: #6b6375; white-space: nowrap;
|
||||
padding: 2px 10px;
|
||||
border-radius: 10px;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
background: #f0eeeb;
|
||||
color: #6b6375;
|
||||
}
|
||||
.color-create { background: #e8f5e9; color: #2e7d5a; }
|
||||
.color-update { background: #e3f2fd; color: #1565c0; }
|
||||
.color-delete { background: #ffebee; color: #c62828; }
|
||||
.color-approve { background: #f3e5f5; color: #7b1fa2; }
|
||||
|
||||
.log-user { font-size: 13px; font-weight: 500; color: #3e3a44; }
|
||||
.log-time { font-size: 11px; color: #b0aab5; margin-left: auto; white-space: nowrap; }
|
||||
.log-detail { font-size: 13px; color: #6b6375; margin-top: 2px; }
|
||||
.log-target-name { font-weight: 500; color: #3e3a44; margin-right: 8px; }
|
||||
.log-extra { color: #999; font-size: 12px; }
|
||||
.action-create { background: #e8f5e9; color: #2e7d5a; }
|
||||
.action-update { background: #e3f2fd; color: #1565c0; }
|
||||
.action-delete { background: #ffebee; color: #c62828; }
|
||||
.action-login { background: #fff3e0; color: #e65100; }
|
||||
.action-approve { background: #f3e5f5; color: #7b1fa2; }
|
||||
|
||||
.log-user {
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: #3e3a44;
|
||||
}
|
||||
|
||||
.log-time {
|
||||
font-size: 11px;
|
||||
color: #b0aab5;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.log-detail {
|
||||
font-size: 13px;
|
||||
color: #6b6375;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.log-target {
|
||||
font-weight: 500;
|
||||
color: #3e3a44;
|
||||
}
|
||||
|
||||
.log-changes {
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
.changes-pre {
|
||||
font-size: 11px;
|
||||
background: #f8f7f5;
|
||||
padding: 8px 10px;
|
||||
border-radius: 6px;
|
||||
overflow-x: auto;
|
||||
margin: 0;
|
||||
color: #6b6375;
|
||||
font-family: ui-monospace, Consolas, monospace;
|
||||
line-height: 1.5;
|
||||
max-height: 120px;
|
||||
}
|
||||
|
||||
.btn-undo {
|
||||
margin-top: 8px;
|
||||
padding: 4px 12px;
|
||||
border: 1.5px solid #e5e4e7;
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
font-family: inherit;
|
||||
color: #6b6375;
|
||||
}
|
||||
|
||||
.btn-undo:hover {
|
||||
border-color: #7ec6a4;
|
||||
color: #4a9d7e;
|
||||
}
|
||||
|
||||
.load-more {
|
||||
text-align: center;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.load-more { text-align: center; margin-top: 16px; }
|
||||
.btn-outline {
|
||||
background: #fff; color: #6b6375; border: 1.5px solid #d4cfc7; border-radius: 10px;
|
||||
padding: 9px 28px; font-size: 13px; cursor: pointer; font-family: inherit;
|
||||
background: #fff;
|
||||
color: #6b6375;
|
||||
border: 1.5px solid #d4cfc7;
|
||||
border-radius: 10px;
|
||||
padding: 9px 28px;
|
||||
font-size: 13px;
|
||||
cursor: pointer;
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.btn-outline:hover {
|
||||
background: #f8f7f5;
|
||||
}
|
||||
|
||||
.btn-outline:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.empty-hint {
|
||||
text-align: center;
|
||||
color: #b0aab5;
|
||||
font-size: 13px;
|
||||
padding: 32px 0;
|
||||
}
|
||||
.btn-outline:hover { background: #f8f7f5; }
|
||||
.btn-outline:disabled { opacity: 0.5; cursor: default; }
|
||||
.empty-hint { text-align: center; color: #b0aab5; font-size: 13px; padding: 32px 0; }
|
||||
</style>
|
||||
|
||||
@@ -16,21 +16,22 @@
|
||||
<span class="bug-status" :class="'s-' + (bug.status || 'open')">{{ statusLabel(bug.status) }}</span>
|
||||
<span class="bug-date">{{ formatDate(bug.created_at) }}</span>
|
||||
</div>
|
||||
<div class="bug-title">{{ bug.content }}</div>
|
||||
<div v-if="bug.display_name" class="bug-reporter">{{ bug.display_name || bug.username }}</div>
|
||||
<div class="bug-title">{{ bug.title }}</div>
|
||||
<div v-if="bug.description" class="bug-desc">{{ bug.description }}</div>
|
||||
<div v-if="bug.reporter" class="bug-reporter">报告者: {{ bug.reporter }}</div>
|
||||
|
||||
<!-- Status workflow: is_resolved: 0=open, 1=testing, 2=fixed, 3=tested -->
|
||||
<!-- Status workflow -->
|
||||
<div class="bug-actions">
|
||||
<template v-if="bug.is_resolved === 0">
|
||||
<button class="btn-sm btn-status" @click="updateStatus(bug, 1)">待测试</button>
|
||||
<template v-if="bug.status === 'open'">
|
||||
<button class="btn-sm btn-status" @click="updateStatus(bug, 'testing')">开始测试</button>
|
||||
</template>
|
||||
<template v-else-if="bug.is_resolved === 1">
|
||||
<button class="btn-sm btn-status" @click="updateStatus(bug, 2)">已修复</button>
|
||||
<button class="btn-sm btn-reopen" @click="updateStatus(bug, 0)">重新打开</button>
|
||||
<template v-else-if="bug.status === 'testing'">
|
||||
<button class="btn-sm btn-status" @click="updateStatus(bug, 'fixed')">标记修复</button>
|
||||
<button class="btn-sm btn-reopen" @click="updateStatus(bug, 'open')">重新打开</button>
|
||||
</template>
|
||||
<template v-else-if="bug.is_resolved === 2">
|
||||
<button class="btn-sm btn-status" @click="updateStatus(bug, 3)">已测试</button>
|
||||
<button class="btn-sm btn-reopen" @click="updateStatus(bug, 0)">重新打开</button>
|
||||
<template v-else-if="bug.status === 'fixed'">
|
||||
<button class="btn-sm btn-status" @click="updateStatus(bug, 'tested')">验证通过</button>
|
||||
<button class="btn-sm btn-reopen" @click="updateStatus(bug, 'open')">重新打开</button>
|
||||
</template>
|
||||
<button class="btn-sm btn-delete" @click="removeBug(bug)">删除</button>
|
||||
</div>
|
||||
@@ -39,11 +40,10 @@
|
||||
<div class="comments-section" v-if="expandedBugId === (bug._id || bug.id)">
|
||||
<div v-for="comment in (bug.comments || [])" :key="comment._id || comment.id" class="comment-item">
|
||||
<div class="comment-meta">
|
||||
<span class="comment-author">{{ comment.display_name || comment.username || '系统' }}</span>
|
||||
<span class="comment-action" v-if="comment.action">{{ comment.action }}</span>
|
||||
<span class="comment-author">{{ comment.author || comment.user_name || '匿名' }}</span>
|
||||
<span class="comment-time">{{ formatDate(comment.created_at) }}</span>
|
||||
</div>
|
||||
<div class="comment-text">{{ comment.content }}</div>
|
||||
<div class="comment-text">{{ comment.text || comment.content }}</div>
|
||||
</div>
|
||||
<div class="comment-add">
|
||||
<input
|
||||
@@ -75,9 +75,9 @@
|
||||
<span class="bug-status s-tested">已解决</span>
|
||||
<span class="bug-date">{{ formatDate(bug.created_at) }}</span>
|
||||
</div>
|
||||
<div class="bug-title">{{ bug.content }}</div>
|
||||
<div class="bug-title">{{ bug.title }}</div>
|
||||
<div class="bug-actions">
|
||||
<button class="btn-sm btn-reopen" @click="updateStatus(bug, 0)">重新打开</button>
|
||||
<button class="btn-sm btn-reopen" @click="updateStatus(bug, 'open')">重新打开</button>
|
||||
<button class="btn-sm btn-delete" @click="removeBug(bug)">删除</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -92,8 +92,12 @@
|
||||
<button class="btn-close" @click="showAddBug = false">✕</button>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Bug 内容</label>
|
||||
<textarea v-model="bugForm.content" class="form-textarea" rows="4" placeholder="描述问题、复现步骤等..."></textarea>
|
||||
<label>标题</label>
|
||||
<input v-model="bugForm.title" class="form-input" placeholder="Bug标题" />
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>描述</label>
|
||||
<textarea v-model="bugForm.description" class="form-textarea" rows="4" placeholder="Bug描述，复现步骤等..."></textarea>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>优先级</label>
|
||||
@@ -109,7 +113,7 @@
|
||||
</div>
|
||||
<div class="overlay-footer">
|
||||
<button class="btn-outline" @click="showAddBug = false">取消</button>
|
||||
<button class="btn-primary" @click="createBug" :disabled="!bugForm.content.trim()">提交</button>
|
||||
<button class="btn-primary" @click="createBug" :disabled="!bugForm.title.trim()">提交</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -133,35 +137,38 @@ const expandedBugId = ref(null)
|
||||
const newComment = ref('')
|
||||
|
||||
const bugForm = reactive({
|
||||
content: '',
|
||||
priority: 2,
|
||||
title: '',
|
||||
description: '',
|
||||
priority: 'normal',
|
||||
})
|
||||
|
||||
// priority: 0=urgent, 1=high, 2=normal
|
||||
const priorities = [
|
||||
{ value: 0, label: '紧急' },
|
||||
{ value: 1, label: '高' },
|
||||
{ value: 2, label: '中' },
|
||||
{ value: 'low', label: '低' },
|
||||
{ value: 'normal', label: '中' },
|
||||
{ value: 'high', label: '高' },
|
||||
{ value: 'critical', label: '紧急' },
|
||||
]
|
||||
|
||||
// is_resolved: 0=open, 1=testing, 2=fixed, 3=tested
|
||||
const activeBugs = computed(() =>
|
||||
bugs.value.filter(b => b.is_resolved !== 2 && b.is_resolved !== 3)
|
||||
.sort((a, b) => (a.priority ?? 2) - (b.priority ?? 2))
|
||||
bugs.value.filter(b => b.status !== 'tested' && b.status !== 'closed')
|
||||
.sort((a, b) => {
|
||||
const order = { critical: 0, high: 1, normal: 2, low: 3 }
|
||||
return (order[a.priority] ?? 2) - (order[b.priority] ?? 2)
|
||||
})
|
||||
)
|
||||
|
||||
const resolvedBugs = computed(() =>
|
||||
bugs.value.filter(b => b.is_resolved === 2 || b.is_resolved === 3)
|
||||
bugs.value.filter(b => b.status === 'tested' || b.status === 'closed')
|
||||
)
|
||||
|
||||
function priorityLabel(p) {
|
||||
const map = { 0: '紧急', 1: '高', 2: '中' }
|
||||
return map[p] ?? '中'
|
||||
const map = { low: '低', normal: '中', high: '高', critical: '紧急' }
|
||||
return map[p] || '中'
|
||||
}
|
||||
|
||||
function statusLabel(s) {
|
||||
const map = { 0: '待处理', 1: '待测试', 2: '已修复', 3: '已测试' }
|
||||
return map[s] ?? '待处理'
|
||||
const map = { open: '待处理', testing: '测试中', fixed: '已修复', tested: '已验证', closed: '已关闭' }
|
||||
return map[s] || s
|
||||
}
|
||||
|
||||
function formatDate(d) {
|
||||
@@ -181,7 +188,7 @@ function toggleComments(bug) {
|
||||
|
||||
async function loadBugs() {
|
||||
try {
|
||||
const res = await api('/api/bug-reports')
|
||||
const res = await api('/api/bugs')
|
||||
if (res.ok) {
|
||||
bugs.value = await res.json()
|
||||
}
|
||||
@@ -191,19 +198,23 @@ async function loadBugs() {
|
||||
}
|
||||
|
||||
async function createBug() {
|
||||
if (!bugForm.content.trim()) return
|
||||
if (!bugForm.title.trim()) return
|
||||
try {
|
||||
const res = await api('/api/bug-report', {
|
||||
const res = await api('/api/bugs', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({
|
||||
content: bugForm.content.trim(),
|
||||
title: bugForm.title.trim(),
|
||||
description: bugForm.description.trim(),
|
||||
priority: bugForm.priority,
|
||||
status: 'open',
|
||||
reporter: auth.user.display_name || auth.user.username,
|
||||
}),
|
||||
})
|
||||
if (res.ok) {
|
||||
showAddBug.value = false
|
||||
bugForm.content = ''
|
||||
bugForm.priority = 2
|
||||
bugForm.title = ''
|
||||
bugForm.description = ''
|
||||
bugForm.priority = 'normal'
|
||||
await loadBugs()
|
||||
ui.showToast('Bug已提交')
|
||||
}
|
||||
@@ -213,14 +224,14 @@ async function createBug() {
|
||||
}
|
||||
|
||||
async function updateStatus(bug, newStatus) {
|
||||
const id = bug.id
|
||||
const id = bug._id || bug.id
|
||||
try {
|
||||
const res = await api(`/api/bug-reports/${id}`, {
|
||||
const res = await api(`/api/bugs/${id}`, {
|
||||
method: 'PUT',
|
||||
body: JSON.stringify({ status: newStatus }),
|
||||
})
|
||||
if (res.ok) {
|
||||
bug.is_resolved = newStatus
|
||||
bug.status = newStatus
|
||||
ui.showToast(`状态已更新: ${statusLabel(newStatus)}`)
|
||||
}
|
||||
} catch {
|
||||
@@ -229,11 +240,11 @@ async function updateStatus(bug, newStatus) {
|
||||
}
|
||||
|
||||
async function removeBug(bug) {
|
||||
const ok = await showConfirm(`确定删除 "${bug.content}"？`)
|
||||
const ok = await showConfirm(`确定删除 "${bug.title}"？`)
|
||||
if (!ok) return
|
||||
const id = bug._id || bug.id
|
||||
try {
|
||||
const res = await api(`/api/bug-reports/${id}`, { method: 'DELETE' })
|
||||
const res = await api(`/api/bugs/${id}`, { method: 'DELETE' })
|
||||
if (res.ok) {
|
||||
bugs.value = bugs.value.filter(b => (b._id || b.id) !== id)
|
||||
ui.showToast('已删除')
|
||||
@@ -247,10 +258,11 @@ async function addComment(bug) {
|
||||
if (!newComment.value.trim()) return
|
||||
const id = bug._id || bug.id
|
||||
try {
|
||||
const res = await api(`/api/bug-reports/${id}/comment`, {
|
||||
const res = await api(`/api/bugs/${id}/comments`, {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({
|
||||
content: newComment.value.trim(),
|
||||
text: newComment.value.trim(),
|
||||
author: auth.user.display_name || auth.user.username,
|
||||
}),
|
||||
})
|
||||
if (res.ok) {
|
||||
|
||||
@@ -2,8 +2,9 @@
|
||||
<div class="my-diary">
|
||||
<!-- Sub Tabs -->
|
||||
<div class="sub-tabs">
|
||||
<button class="sub-tab" :class="{ active: activeTab === 'brand' }" @click="activeTab = 'brand'">🏷 我的品牌</button>
|
||||
<button class="sub-tab" :class="{ active: activeTab === 'account' }" @click="activeTab = 'account'">👤 我的账户</button>
|
||||
<button class="sub-tab" :class="{ active: activeTab === 'diary' }" @click="activeTab = 'diary'">📖 配方日记</button>
|
||||
<button class="sub-tab" :class="{ active: activeTab === 'brand' }" @click="activeTab = 'brand'">🏷️ Brand</button>
|
||||
<button class="sub-tab" :class="{ active: activeTab === 'account' }" @click="activeTab = 'account'">👤 Account</button>
|
||||
</div>
|
||||
|
||||
<!-- Diary Tab -->
|
||||
@@ -107,101 +108,38 @@
|
||||
|
||||
<!-- Brand Tab -->
|
||||
<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">
|
||||
<p style="font-size:13px;color:var(--text-light);margin-bottom:16px">分享配方卡片时，二维码、背景图、Logo 会自动展示在卡片上</p>
|
||||
<h4>🏷️ 品牌设置</h4>
|
||||
|
||||
<!-- Three upload areas side by side -->
|
||||
<div style="display:flex;gap:20px;flex-wrap:wrap;margin-bottom:16px">
|
||||
<!-- QR Code -->
|
||||
<div>
|
||||
<label class="form-label">📱 二维码</label>
|
||||
<p style="font-size:11px;color:var(--text-light);margin-bottom:6px">卡片右上角展示</p>
|
||||
<div class="upload-box" @click="triggerUpload('qr')">
|
||||
<img v-if="brandQrImage" :src="brandQrImage" class="upload-box-img" />
|
||||
<span v-else class="upload-box-hint">点击上传</span>
|
||||
</div>
|
||||
<input ref="qrInput" type="file" accept="image/*" style="display:none" @change="handleUpload('qr', $event)" />
|
||||
<button v-if="brandQrImage" class="btn-clear" @click="clearBrandImage('qr')">清除</button>
|
||||
</div>
|
||||
|
||||
<!-- Background -->
|
||||
<div>
|
||||
<label class="form-label">🖼 背景图</label>
|
||||
<p style="font-size:11px;color:var(--text-light);margin-bottom:6px">铺满整张卡片，半透明</p>
|
||||
<div class="upload-box" @click="triggerUpload('bg')">
|
||||
<img v-if="brandBg" :src="brandBg" class="upload-box-img" />
|
||||
<span v-else class="upload-box-hint">点击上传</span>
|
||||
</div>
|
||||
<input ref="bgInput" type="file" accept="image/*" style="display:none" @change="handleUpload('bg', $event)" />
|
||||
<button v-if="brandBg" class="btn-clear" @click="clearBrandImage('bg')">清除</button>
|
||||
</div>
|
||||
|
||||
<!-- Logo -->
|
||||
<div>
|
||||
<label class="form-label">🏷 Logo</label>
|
||||
<p style="font-size:11px;color:var(--text-light);margin-bottom:6px">卡片左下角水印</p>
|
||||
<div class="upload-box" @click="triggerUpload('logo')">
|
||||
<img v-if="brandLogo" :src="brandLogo" class="upload-box-img" />
|
||||
<span v-else class="upload-box-hint">点击上传</span>
|
||||
</div>
|
||||
<input ref="logoInput" type="file" accept="image/*" style="display:none" @change="handleUpload('logo', $event)" />
|
||||
<button v-if="brandLogo" class="btn-clear" @click="clearBrandImage('logo')">清除</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Brand name -->
|
||||
<div class="form-group">
|
||||
<label class="form-label">✍ 品牌名称或标语</label>
|
||||
<p style="font-size:11px;color:var(--text-light);margin-bottom:6px">显示在二维码下方</p>
|
||||
<textarea v-model="brandName" class="form-control" rows="2" placeholder="扫码申请成为优惠顾客 我的精油小屋" style="max-width:350px;font-size:13px" @blur="saveBrandSettings"></textarea>
|
||||
<div style="display:flex;gap:6px;margin-top:6px">
|
||||
<button class="btn-align" :class="{ active: brandAlign === 'left' }" @click="brandAlign='left'; saveBrandSettings()">靠左</button>
|
||||
<button class="btn-align" :class="{ active: brandAlign === 'center' }" @click="brandAlign='center'; saveBrandSettings()">居中</button>
|
||||
<button class="btn-align" :class="{ active: brandAlign === 'right' }" @click="brandAlign='right'; saveBrandSettings()">靠右</button>
|
||||
<label>品牌名称</label>
|
||||
<input v-model="brandName" class="form-input" placeholder="您的品牌名称" @blur="saveBrandSettings" />
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label>二维码链接</label>
|
||||
<input v-model="brandQrUrl" class="form-input" placeholder="https://..." @blur="saveBrandSettings" />
|
||||
<div v-if="brandQrUrl" class="qr-preview">
|
||||
<img :src="'https://api.qrserver.com/v1/create-qr-code/?size=120x120&data=' + encodeURIComponent(brandQrUrl)" alt="QR" class="qr-img" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Card Preview -->
|
||||
<div style="margin-bottom:16px">
|
||||
<label class="form-label">📋 配方卡片预览</label>
|
||||
<div class="card-preview-mini">
|
||||
<!-- Background overlay -->
|
||||
<div v-if="brandBg" style="position:absolute;inset:0;background-size:cover;background-position:center;opacity:0.12;pointer-events:none" :style="{ backgroundImage: 'url(' + brandBg + ')' }"></div>
|
||||
<!-- Logo: shown in bottom row, not as watermark -->
|
||||
<!-- QR: top-right -->
|
||||
<div v-if="brandQrImage" style="position:absolute;top:16px;right:12px;display:flex;flex-direction:column;gap:2px;z-index:2" :style="{ alignItems: brandAlign === 'left' ? 'flex-start' : brandAlign === 'right' ? 'flex-end' : 'center' }">
|
||||
<img :src="brandQrImage" style="width:36px;height:36px;object-fit:cover;border-radius:4px;box-shadow:0 1px 4px rgba(0,0,0,0.1)" />
|
||||
<div v-if="brandName" :style="{ textAlign: brandAlign }" style="font-size:5px;color:var(--text-light);line-height:1.2;max-width:42px;white-space:pre-line">{{ brandName }}</div>
|
||||
</div>
|
||||
<!-- Content -->
|
||||
<div style="position:relative;z-index:1">
|
||||
<div style="font-size:7px;letter-spacing:1.5px;color:var(--sage);margin-bottom:3px">doTERRA · 来自大地的礼物</div>
|
||||
<div style="font-size:13px;font-weight:700;color:var(--text-dark);margin-bottom:3px;line-height:1.3">配方名称</div>
|
||||
<div style="width:30px;height:1px;background:linear-gradient(90deg,var(--sage),var(--gold));margin:6px 0"></div>
|
||||
<div style="font-size:9px;color:var(--text-light);margin-bottom:6px">薰衣草 · 乳香 · 茶树</div>
|
||||
<!-- Total cost bar -->
|
||||
<div style="background:linear-gradient(135deg,var(--sage),#5a7d5e);border-radius:6px;padding:6px 10px;display:flex;justify-content:space-between;align-items:center">
|
||||
<span style="color:rgba(255,255,255,0.85);font-size:8px;letter-spacing:0.5px">配方总成本</span>
|
||||
<span style="color:white;font-size:12px;font-weight:700">¥12.50</span>
|
||||
</div>
|
||||
<!-- Logo left + Date right -->
|
||||
<div style="display:flex;justify-content:space-between;align-items:flex-end;margin-top:8px">
|
||||
<img v-if="brandLogo" :src="brandLogo" style="height:18px;object-fit:contain" />
|
||||
<span v-else></span>
|
||||
<span style="font-size:7px;color:var(--text-light);letter-spacing:0.5px">制作日期：{{ new Date().toLocaleDateString('zh-CN') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>品牌Logo</label>
|
||||
<div class="upload-area" @click="triggerUpload('logo')">
|
||||
<img v-if="brandLogo" :src="brandLogo" class="upload-preview" />
|
||||
<span v-else class="upload-hint">点击上传Logo</span>
|
||||
</div>
|
||||
<input ref="logoInput" type="file" accept="image/*" style="display:none" @change="handleUpload('logo', $event)" />
|
||||
</div>
|
||||
|
||||
<div style="display:flex;gap:8px;align-items:center">
|
||||
<span class="auto-save-hint">所有修改自动保存</span>
|
||||
<button v-if="returnRecipeId" class="btn btn-outline" @click="goBackToRecipe">← 返回配方卡片</button>
|
||||
<div class="form-group">
|
||||
<label>卡片背景</label>
|
||||
<div class="upload-area" @click="triggerUpload('bg')">
|
||||
<img v-if="brandBg" :src="brandBg" class="upload-preview wide" />
|
||||
<span v-else class="upload-hint">点击上传背景图</span>
|
||||
</div>
|
||||
<input ref="bgInput" type="file" accept="image/*" style="display:none" @change="handleUpload('bg', $event)" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -222,6 +160,10 @@
|
||||
<div class="form-static">{{ auth.user.username }}</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label>角色</label>
|
||||
<div class="form-static role-badge">{{ roleLabel }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section-card">
|
||||
@@ -242,67 +184,25 @@
|
||||
</div>
|
||||
|
||||
<!-- Business Verification -->
|
||||
<div ref="bizCertRef" class="section-card biz-card">
|
||||
<h4>🏢 商业用户认证</h4>
|
||||
|
||||
<!-- 已认证 -->
|
||||
<div v-if="auth.isBusiness" class="biz-status-bar biz-approved">
|
||||
<span>✅ 已认证商业用户</span>
|
||||
<div v-if="!auth.isBusiness" class="section-card">
|
||||
<h4>💼 商业认证</h4>
|
||||
<p class="hint-text">申请商业认证后可使用商业核算功能。</p>
|
||||
<div class="form-group">
|
||||
<label>申请说明</label>
|
||||
<textarea v-model="businessReason" class="form-textarea" rows="3" placeholder="请说明您的申请理由..."></textarea>
|
||||
</div>
|
||||
|
||||
<!-- 审核中 -->
|
||||
<div v-else-if="bizApp.status === 'pending'" class="biz-status-bar biz-pending">
|
||||
<span>⏳ 认证申请审核中</span>
|
||||
<div class="biz-status-detail">商户名：{{ bizApp.business_name }} · 提交时间：{{ formatDate(bizApp.created_at) }}</div>
|
||||
</div>
|
||||
|
||||
<!-- 被拒绝 -->
|
||||
<template v-else-if="bizApp.status === 'rejected'">
|
||||
<div class="biz-status-bar biz-rejected">
|
||||
<span>❌ 认证申请未通过</span>
|
||||
<div v-if="bizApp.reject_reason" class="biz-status-detail">原因：{{ bizApp.reject_reason }}</div>
|
||||
</div>
|
||||
<p class="hint-text">你可以修改信息后重新申请。</p>
|
||||
</template>
|
||||
|
||||
<!-- 申请表单（首次或被拒后重新申请） -->
|
||||
<template v-if="!auth.isBusiness && bizApp.status !== 'pending'">
|
||||
<div class="biz-form">
|
||||
<div class="form-group">
|
||||
<label class="form-label">认证类型 *</label>
|
||||
<select v-model="bizType" class="form-select">
|
||||
<option value="">请选择</option>
|
||||
<option value="individual">个体经营户</option>
|
||||
<option value="company">公司</option>
|
||||
<option value="studio">工作室/美容院</option>
|
||||
<option value="distributor">代理商</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">企业/商户名称 *</label>
|
||||
<input v-model="businessName" class="form-input" placeholder="你的企业或品牌名称" />
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">联系电话 *</label>
|
||||
<input v-model="bizPhone" class="form-input" type="tel" placeholder="联系电话" />
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">业务描述</label>
|
||||
<textarea v-model="businessReason" class="form-textarea" rows="3" placeholder="描述你的业务范围和计划..."></textarea>
|
||||
</div>
|
||||
<div style="display:flex;gap:10px;margin-top:12px">
|
||||
<button class="btn-primary" @click="applyBusiness" :disabled="!businessName.trim() || !bizType">💾 提交申请</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<button class="btn-primary" @click="applyBusiness" :disabled="!businessReason.trim()">提交申请</button>
|
||||
</div>
|
||||
<div v-else class="section-card">
|
||||
<h4>💼 商业认证</h4>
|
||||
<div class="verified-badge">✅ 已认证商业用户</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, nextTick, onMounted, watch } from 'vue'
|
||||
import { useRouter, useRoute } from 'vue-router'
|
||||
import { ref, computed, onMounted, watch } from 'vue'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
import { useOilsStore } from '../stores/oils'
|
||||
import { useDiaryStore } from '../stores/diary'
|
||||
@@ -315,63 +215,44 @@ const auth = useAuthStore()
|
||||
const oils = useOilsStore()
|
||||
const diaryStore = useDiaryStore()
|
||||
const ui = useUiStore()
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
const bizCertRef = ref(null)
|
||||
|
||||
const activeTab = ref(route.query.tab || 'brand')
|
||||
const activeTab = ref('diary')
|
||||
const pasteText = ref('')
|
||||
const selectedDiaryId = ref(null)
|
||||
const returnRecipeId = ref(null)
|
||||
const selectedDiary = ref(null)
|
||||
const newEntryText = ref('')
|
||||
|
||||
// Brand settings
|
||||
const brandName = ref('')
|
||||
const brandQrUrl = ref('')
|
||||
const brandQrImage = ref('')
|
||||
const brandLogo = ref('')
|
||||
const brandBg = ref('')
|
||||
const brandAlign = ref('center')
|
||||
const logoInput = ref(null)
|
||||
const bgInput = ref(null)
|
||||
const qrInput = ref(null)
|
||||
|
||||
// Account settings
|
||||
const displayName = ref('')
|
||||
const oldPassword = ref('')
|
||||
const newPassword = ref('')
|
||||
const confirmPassword = ref('')
|
||||
const businessName = ref('')
|
||||
const businessReason = ref('')
|
||||
const bizType = ref('')
|
||||
const bizPhone = ref('')
|
||||
const bizApp = ref({ status: null })
|
||||
|
||||
const roleLabel = computed(() => {
|
||||
const roles = {
|
||||
admin: '管理员',
|
||||
senior_editor: '高级编辑',
|
||||
editor: '编辑',
|
||||
viewer: '查看者',
|
||||
}
|
||||
return roles[auth.user.role] || auth.user.role
|
||||
})
|
||||
|
||||
onMounted(async () => {
|
||||
await diaryStore.loadDiary()
|
||||
displayName.value = auth.user.display_name || ''
|
||||
await loadBrandSettings()
|
||||
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() {
|
||||
if (returnRecipeId.value) {
|
||||
localStorage.removeItem('oil_return_recipe_id')
|
||||
router.push('/?openRecipe=' + encodeURIComponent(returnRecipeId.value))
|
||||
}
|
||||
}
|
||||
|
||||
function selectDiary(d) {
|
||||
const id = d._id || d.id
|
||||
selectedDiaryId.value = id
|
||||
@@ -460,15 +341,13 @@ function formatDate(d) {
|
||||
// Brand settings
|
||||
async function loadBrandSettings() {
|
||||
try {
|
||||
const res = await api('/api/brand')
|
||||
const res = await api('/api/brand-settings')
|
||||
if (res.ok) {
|
||||
const data = await res.json()
|
||||
brandName.value = data.brand_name || ''
|
||||
brandQrUrl.value = data.qr_url || ''
|
||||
brandQrImage.value = data.qr_code || ''
|
||||
brandLogo.value = data.brand_logo || ''
|
||||
brandBg.value = data.brand_bg || ''
|
||||
brandAlign.value = data.brand_align || 'center'
|
||||
brandLogo.value = data.logo_url || ''
|
||||
brandBg.value = data.bg_url || ''
|
||||
}
|
||||
} catch {
|
||||
// no brand settings yet
|
||||
@@ -477,194 +356,51 @@ async function loadBrandSettings() {
|
||||
|
||||
async function saveBrandSettings() {
|
||||
try {
|
||||
const res = await api('/api/brand', {
|
||||
await api('/api/brand-settings', {
|
||||
method: 'PUT',
|
||||
body: JSON.stringify({
|
||||
brand_name: brandName.value,
|
||||
brand_align: brandAlign.value,
|
||||
qr_url: brandQrUrl.value,
|
||||
}),
|
||||
})
|
||||
if (res.ok) ui.showToast('已保存')
|
||||
} catch {
|
||||
ui.showToast('保存失败')
|
||||
// silent
|
||||
}
|
||||
}
|
||||
|
||||
function triggerUpload(type) {
|
||||
if (type === 'logo') logoInput.value?.click()
|
||||
else if (type === 'bg') bgInput.value?.click()
|
||||
else if (type === 'qr') qrInput.value?.click()
|
||||
}
|
||||
|
||||
function readFileAsBase64(file) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const reader = new FileReader()
|
||||
reader.onload = e => resolve(e.target.result)
|
||||
reader.onerror = reject
|
||||
reader.readAsDataURL(file)
|
||||
})
|
||||
}
|
||||
|
||||
// Compress image if too large
|
||||
function compressImage(base64, maxSize = 500000, maxDim = 800) {
|
||||
return new Promise((resolve) => {
|
||||
if (base64.length <= maxSize) { resolve(base64); return }
|
||||
const img = new Image()
|
||||
img.onload = () => {
|
||||
const canvas = document.createElement('canvas')
|
||||
let w = img.width, h = img.height
|
||||
// Shrink progressively until it fits
|
||||
let scale = 1
|
||||
if (w > maxDim || h > maxDim) {
|
||||
scale = Math.min(maxDim / w, maxDim / h)
|
||||
}
|
||||
for (let attempt = 0; attempt < 5; attempt++) {
|
||||
const cw = Math.round(w * scale)
|
||||
const ch = Math.round(h * scale)
|
||||
canvas.width = cw
|
||||
canvas.height = ch
|
||||
canvas.getContext('2d').drawImage(img, 0, 0, cw, ch)
|
||||
let quality = 0.8
|
||||
let result = canvas.toDataURL('image/jpeg', quality)
|
||||
while (result.length > maxSize && quality > 0.2) {
|
||||
quality -= 0.15
|
||||
result = canvas.toDataURL('image/jpeg', quality)
|
||||
}
|
||||
if (result.length <= maxSize) { resolve(result); return }
|
||||
scale *= 0.7 // shrink more
|
||||
}
|
||||
// Last resort
|
||||
resolve(canvas.toDataURL('image/jpeg', 0.3))
|
||||
}
|
||||
img.onerror = () => resolve(base64)
|
||||
img.src = base64
|
||||
})
|
||||
}
|
||||
|
||||
// Crop image to square from center
|
||||
function cropToSquare(base64) {
|
||||
return new Promise((resolve) => {
|
||||
const img = new Image()
|
||||
img.onload = () => {
|
||||
const size = Math.min(img.width, img.height)
|
||||
const x = (img.width - size) / 2
|
||||
const y = (img.height - size) / 2
|
||||
const canvas = document.createElement('canvas')
|
||||
canvas.width = size
|
||||
canvas.height = size
|
||||
canvas.getContext('2d').drawImage(img, x, y, size, size, 0, 0, size, size)
|
||||
resolve(canvas.toDataURL('image/png'))
|
||||
}
|
||||
img.onerror = () => resolve(base64)
|
||||
img.src = base64
|
||||
})
|
||||
}
|
||||
|
||||
// Check if image is roughly square
|
||||
function checkSquare(base64) {
|
||||
return new Promise((resolve) => {
|
||||
const img = new Image()
|
||||
img.onload = () => {
|
||||
const ratio = img.width / img.height
|
||||
resolve(ratio > 0.85 && ratio < 1.15) // within 15% of square
|
||||
}
|
||||
img.onerror = () => resolve(true)
|
||||
img.src = base64
|
||||
})
|
||||
else bgInput.value?.click()
|
||||
}
|
||||
|
||||
async function handleUpload(type, event) {
|
||||
let file = event.target.files[0]
|
||||
const file = event.target.files[0]
|
||||
if (!file) return
|
||||
const formData = new FormData()
|
||||
formData.append('file', file)
|
||||
formData.append('type', type)
|
||||
try {
|
||||
// Convert HEIC/HEIF to JPEG
|
||||
const isHeic = file.name.toLowerCase().match(/\.hei[cf]$/) ||
|
||||
file.type === 'image/heic' || file.type === 'image/heif'
|
||||
if (isHeic) {
|
||||
ui.showToast('正在转换格式...')
|
||||
try {
|
||||
const heic2any = (await import('heic2any')).default
|
||||
let blob = await heic2any({ blob: file, toType: 'image/jpeg', quality: 0.8 })
|
||||
if (Array.isArray(blob)) blob = blob[0]
|
||||
file = new File([blob], 'photo.jpg', { type: 'image/jpeg' })
|
||||
} catch {
|
||||
// Fallback: try createImageBitmap (works on some browsers)
|
||||
try {
|
||||
const bmp = await createImageBitmap(file)
|
||||
const canvas = document.createElement('canvas')
|
||||
canvas.width = bmp.width
|
||||
canvas.height = bmp.height
|
||||
canvas.getContext('2d').drawImage(bmp, 0, 0)
|
||||
const jpegBlob = await new Promise(r => canvas.toBlob(r, 'image/jpeg', 0.8))
|
||||
file = new File([jpegBlob], 'photo.jpg', { type: 'image/jpeg' })
|
||||
} catch {
|
||||
ui.showToast('该格式暂不支持，请在相册中选择"自动"格式或转为JPG后上传')
|
||||
return
|
||||
}
|
||||
}
|
||||
}
|
||||
let base64 = await readFileAsBase64(file)
|
||||
|
||||
// QR: check if square, offer to crop
|
||||
if (type === 'qr') {
|
||||
const isSquare = await checkSquare(base64)
|
||||
if (!isSquare) {
|
||||
const { showConfirm: confirm } = await import('../composables/useDialog')
|
||||
const ok = await confirm('图片非正方形，自动裁剪？')
|
||||
if (ok) {
|
||||
base64 = await cropToSquare(base64)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const maxSize = type === 'bg' ? 600000 : 300000
|
||||
const maxDim = type === 'bg' ? 1000 : 600
|
||||
base64 = await compressImage(base64, maxSize, maxDim)
|
||||
const fieldMap = { logo: 'brand_logo', bg: 'brand_bg', qr: 'qr_code' }
|
||||
const field = fieldMap[type]
|
||||
if (!field) return
|
||||
ui.showToast('正在上传...')
|
||||
const res = await api('/api/brand', {
|
||||
method: 'PUT',
|
||||
body: JSON.stringify({ [field]: base64 }),
|
||||
const token = localStorage.getItem('oil_auth_token') || ''
|
||||
const res = await fetch('/api/brand-upload', {
|
||||
method: 'POST',
|
||||
headers: token ? { Authorization: 'Bearer ' + token } : {},
|
||||
body: formData,
|
||||
})
|
||||
if (res.ok) {
|
||||
if (type === 'logo') brandLogo.value = base64
|
||||
else if (type === 'bg') brandBg.value = base64
|
||||
else if (type === 'qr') brandQrImage.value = base64
|
||||
ui.showToast('上传成功 ✓')
|
||||
} else {
|
||||
const err = await res.json().catch(() => ({}))
|
||||
ui.showToast('上传失败: ' + (err.detail || res.status))
|
||||
const data = await res.json()
|
||||
if (type === 'logo') brandLogo.value = data.url
|
||||
else brandBg.value = data.url
|
||||
ui.showToast('上传成功')
|
||||
}
|
||||
} catch (e) {
|
||||
ui.showToast('上传出错: ' + (e.message || '网络错误'))
|
||||
}
|
||||
// Reset input so same file can be re-selected
|
||||
event.target.value = ''
|
||||
}
|
||||
|
||||
async function clearBrandImage(type) {
|
||||
const fieldMap = { logo: 'brand_logo', bg: 'brand_bg', qr: 'qr_code' }
|
||||
const field = fieldMap[type]
|
||||
try {
|
||||
await api('/api/brand', {
|
||||
method: 'PUT',
|
||||
body: JSON.stringify({ [field]: null }),
|
||||
})
|
||||
if (type === 'logo') brandLogo.value = ''
|
||||
else if (type === 'bg') brandBg.value = ''
|
||||
else if (type === 'qr') brandQrImage.value = ''
|
||||
ui.showToast('已清除')
|
||||
} catch {
|
||||
ui.showToast('清除失败')
|
||||
ui.showToast('上传失败')
|
||||
}
|
||||
}
|
||||
|
||||
// Account
|
||||
async function updateDisplayName() {
|
||||
try {
|
||||
await api('/api/me', {
|
||||
await api('/api/me/display-name', {
|
||||
method: 'PUT',
|
||||
body: JSON.stringify({ display_name: displayName.value }),
|
||||
})
|
||||
@@ -703,36 +439,13 @@ async function changePassword() {
|
||||
}
|
||||
|
||||
async function applyBusiness() {
|
||||
if (!businessName.value.trim() || !bizType.value) {
|
||||
ui.showToast('请填写必填项')
|
||||
return
|
||||
}
|
||||
const typeLabels = { individual: '个体经营户', company: '公司', studio: '工作室/美容院', distributor: '代理商' }
|
||||
const info = [
|
||||
`认证类型：${typeLabels[bizType.value] || bizType.value}`,
|
||||
bizPhone.value ? `联系电话：${bizPhone.value}` : '',
|
||||
businessReason.value ? `业务描述：${businessReason.value}` : '',
|
||||
].filter(Boolean).join('\n')
|
||||
try {
|
||||
const res = await api('/api/business-apply', {
|
||||
await api('/api/business-apply', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({
|
||||
business_name: businessName.value.trim(),
|
||||
document: info,
|
||||
}),
|
||||
body: JSON.stringify({ reason: businessReason.value }),
|
||||
})
|
||||
if (res.ok) {
|
||||
businessName.value = ''
|
||||
businessReason.value = ''
|
||||
bizType.value = ''
|
||||
bizPhone.value = ''
|
||||
ui.showToast('申请已提交，请等待管理员审核')
|
||||
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 || '提交失败')
|
||||
}
|
||||
businessReason.value = ''
|
||||
ui.showToast('申请已提交，请等待审核')
|
||||
} catch {
|
||||
ui.showToast('提交失败')
|
||||
}
|
||||
@@ -1006,39 +719,6 @@ async function applyBusiness() {
|
||||
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 */
|
||||
.form-group {
|
||||
margin-bottom: 14px;
|
||||
@@ -1060,6 +740,22 @@ async function applyBusiness() {
|
||||
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 {
|
||||
width: 100%;
|
||||
min-height: 80px;
|
||||
@@ -1077,18 +773,6 @@ async function applyBusiness() {
|
||||
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 {
|
||||
max-width: 80px;
|
||||
max-height: 80px;
|
||||
@@ -1100,86 +784,17 @@ async function applyBusiness() {
|
||||
max-height: 100px;
|
||||
}
|
||||
|
||||
.qr-upload-preview {
|
||||
max-width: 120px;
|
||||
max-height: 120px;
|
||||
}
|
||||
|
||||
.field-hint {
|
||||
font-size: 12px;
|
||||
color: #9b94a3;
|
||||
margin-top: 4px;
|
||||
padding-left: 2px;
|
||||
}
|
||||
|
||||
.upload-hint {
|
||||
font-size: 13px;
|
||||
color: #b0aab5;
|
||||
}
|
||||
|
||||
/* Upload box (matching initial commit style) */
|
||||
.upload-box {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: 2px dashed var(--border, #e0d4c0);
|
||||
border-radius: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
background: white;
|
||||
transition: border-color 0.15s;
|
||||
}
|
||||
.upload-box:hover { border-color: var(--sage, #7a9e7e); }
|
||||
.upload-box-img { width: 100%; height: 100%; object-fit: contain; }
|
||||
.upload-box-hint { font-size: 12px; color: var(--text-light, #9a8570); }
|
||||
.btn-clear {
|
||||
margin-top: 6px;
|
||||
font-size: 11px;
|
||||
background: none;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 6px;
|
||||
padding: 2px 8px;
|
||||
cursor: pointer;
|
||||
color: var(--text-light);
|
||||
}
|
||||
.btn-clear:hover { border-color: #c0392b; color: #c0392b; }
|
||||
.btn-align {
|
||||
font-size: 11px;
|
||||
padding: 3px 10px;
|
||||
border: 1.5px solid var(--border);
|
||||
border-radius: 6px;
|
||||
background: white;
|
||||
cursor: pointer;
|
||||
color: var(--text-mid);
|
||||
}
|
||||
.btn-align.active {
|
||||
background: var(--sage-mist);
|
||||
border-color: var(--sage);
|
||||
color: var(--sage-dark);
|
||||
}
|
||||
|
||||
/* Card preview mini */
|
||||
.card-preview-mini {
|
||||
position: relative;
|
||||
width: 280px;
|
||||
background: linear-gradient(145deg, #faf7f0, #f5ede0);
|
||||
border-radius: 14px;
|
||||
border: 1px solid #e0ccaa;
|
||||
overflow: hidden;
|
||||
font-family: 'Noto Serif SC', serif;
|
||||
padding: 18px;
|
||||
}
|
||||
|
||||
.hint-text {
|
||||
font-size: 13px;
|
||||
color: #6b6375;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.auto-save-hint { font-size: 12px; color: #999; font-style: italic; }
|
||||
|
||||
.verified-badge {
|
||||
padding: 12px;
|
||||
background: #e8f5e9;
|
||||
@@ -1189,28 +804,6 @@ async function applyBusiness() {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.biz-card { border-radius: 16px; }
|
||||
.biz-status-bar {
|
||||
padding: 12px 16px;
|
||||
border-radius: 10px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
margin-bottom: 12px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
.biz-status-bar.biz-approved { background: #e8f5e9; color: #2e7d32; border-left: 3px solid #4caf50; }
|
||||
.biz-status-bar.biz-pending { background: #fff3e0; color: #e65100; border-left: 3px solid #ff9800; }
|
||||
.biz-status-bar.biz-rejected { background: #ffebee; color: #c62828; border-left: 3px solid #f44336; }
|
||||
.biz-status-detail { font-size: 12px; margin-top: 4px; opacity: 0.8; }
|
||||
.biz-form { margin-top: 8px; }
|
||||
.biz-form .form-group { margin-bottom: 14px; }
|
||||
.biz-form .form-label { display: block; font-size: 13px; font-weight: 600; color: #3e3a44; margin-bottom: 6px; }
|
||||
.biz-form .form-select {
|
||||
width: 100%; padding: 10px 14px; border: 1.5px solid #d4cfc7; border-radius: 10px;
|
||||
font-size: 14px; font-family: inherit; background: #fff; outline: none; box-sizing: border-box;
|
||||
}
|
||||
.biz-form .form-select:focus { border-color: #7ec6a4; }
|
||||
|
||||
/* Buttons */
|
||||
.btn-primary {
|
||||
background: linear-gradient(135deg, #7ec6a4 0%, #4a9d7e 100%);
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -3,7 +3,7 @@
|
||||
<!-- Project List -->
|
||||
<div class="toolbar">
|
||||
<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 v-if="!selectedProject" class="project-list">
|
||||
@@ -23,7 +23,7 @@
|
||||
成本 {{ oils.fmtPrice(oils.calcCost(p.ingredients)) }}
|
||||
</span>
|
||||
</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>
|
||||
</div>
|
||||
</div>
|
||||
@@ -42,53 +42,26 @@
|
||||
<button class="btn-outline btn-sm" @click="importFromRecipe">📋 从配方导入</button>
|
||||
</div>
|
||||
|
||||
<!-- Ingredients Table -->
|
||||
<!-- Ingredients Editor -->
|
||||
<div class="ingredients-section">
|
||||
<div class="section-header-row">
|
||||
<h4>🧴 配方成分</h4>
|
||||
<div class="section-actions">
|
||||
<button class="btn-outline btn-sm" @click="addIngredient">＋ 添加精油</button>
|
||||
</div>
|
||||
</div>
|
||||
<table class="ingredients-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>精油</th>
|
||||
<th>单次用量(滴)</th>
|
||||
<th>单价/滴</th>
|
||||
<th>小计</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(ing, i) in selectedProject.ingredients" :key="i">
|
||||
<td>
|
||||
<select v-model="ing.oil" class="form-select" @change="saveProject">
|
||||
<option value="">— 选择精油 —</option>
|
||||
<option v-for="name in oils.oilNames" :key="name" :value="name">{{ name }}</option>
|
||||
</select>
|
||||
</td>
|
||||
<td>
|
||||
<input v-model.number="ing.drops" type="number" min="0" step="0.5" class="drops-input" @change="saveProject" />
|
||||
</td>
|
||||
<td class="cell-ppd">{{ ing.oil ? oils.fmtPrice(oils.pricePerDrop(ing.oil)) : '—' }}</td>
|
||||
<td class="cell-subtotal">{{ ing.oil && ing.drops ? oils.fmtPrice(oils.pricePerDrop(ing.oil) * ing.drops) : '—' }}</td>
|
||||
<td><button class="remove-btn" @click="removeIngredient(i)">×</button></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="total-row">
|
||||
<span class="total-label">配方总成本</span>
|
||||
<span class="total-price">{{ oils.fmtPrice(materialCost) }}</span>
|
||||
</div>
|
||||
|
||||
<!-- Pricing -->
|
||||
<div class="pricing-inline">
|
||||
<div class="price-field">
|
||||
<label>定价 ¥</label>
|
||||
<input v-model.number="selectedProject.selling_price" type="number" class="price-input" placeholder="/次" @change="saveProject" />
|
||||
</div>
|
||||
<h4>🧴 配方成分</h4>
|
||||
<div v-for="(ing, i) in selectedProject.ingredients" :key="i" class="ing-row">
|
||||
<select v-model="ing.oil" class="form-select" @change="saveProject">
|
||||
<option value="">选择精油</option>
|
||||
<option v-for="name in oils.oilNames" :key="name" :value="name">{{ name }}</option>
|
||||
</select>
|
||||
<input
|
||||
v-model.number="ing.drops"
|
||||
type="number"
|
||||
min="0"
|
||||
class="form-input-sm"
|
||||
placeholder="滴数"
|
||||
@change="saveProject"
|
||||
/>
|
||||
<span class="ing-cost">{{ ing.oil ? oils.fmtPrice(oils.pricePerDrop(ing.oil) * (ing.drops || 0)) : '--' }}</span>
|
||||
<button class="btn-icon-sm" @click="removeIngredient(i)">✕</button>
|
||||
</div>
|
||||
<button class="btn-outline btn-sm" @click="addIngredient">+ 添加成分</button>
|
||||
</div>
|
||||
|
||||
<!-- Pricing Section -->
|
||||
@@ -204,7 +177,6 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
import { useOilsStore } from '../stores/oils'
|
||||
import { useRecipesStore } from '../stores/recipes'
|
||||
@@ -216,14 +188,6 @@ const auth = useAuthStore()
|
||||
const oils = useOilsStore()
|
||||
const recipeStore = useRecipesStore()
|
||||
const ui = useUiStore()
|
||||
const router = useRouter()
|
||||
|
||||
async function showCertPrompt() {
|
||||
const ok = await showConfirm('此功能需要商业认证，是否前往申请认证？', { okText: '去认证', cancelText: '取消' })
|
||||
if (ok) {
|
||||
router.push('/mydiary?tab=account§ion=biz-cert')
|
||||
}
|
||||
}
|
||||
|
||||
const projects = ref([])
|
||||
const selectedProject = ref(null)
|
||||
@@ -273,10 +237,6 @@ async function createProject() {
|
||||
}
|
||||
|
||||
function selectProject(p) {
|
||||
if (!auth.isBusiness) {
|
||||
showCertPrompt()
|
||||
return
|
||||
}
|
||||
selectedProject.value = {
|
||||
...p,
|
||||
ingredients: (p.ingredients || []).map(i => ({ ...i })),
|
||||
@@ -519,38 +479,12 @@ function formatDate(d) {
|
||||
color: #3e3a44;
|
||||
}
|
||||
|
||||
.section-header-row {
|
||||
display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;
|
||||
.ing-row {
|
||||
display: flex;
|
||||
gap: 6px;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
.section-header-row h4 { margin: 0; }
|
||||
.section-actions { display: flex; gap: 6px; }
|
||||
|
||||
.ingredients-table { width: 100%; border-collapse: collapse; margin-bottom: 12px; }
|
||||
.ingredients-table th {
|
||||
text-align: center; padding: 10px 8px; font-size: 12px; font-weight: 600;
|
||||
color: var(--text-light, #999); border-bottom: 2px solid #e5e4e7;
|
||||
}
|
||||
.ingredients-table td { padding: 10px 8px; border-bottom: 1px solid #f0f0f0; text-align: center; }
|
||||
.ingredients-table .form-select { width: 100%; padding: 6px 8px; border: 1.5px solid #d4cfc7; border-radius: 8px; font-size: 13px; font-family: inherit; background: #fff; }
|
||||
.drops-input { width: 65px; padding: 6px 8px; border: 1.5px solid #d4cfc7; border-radius: 8px; font-size: 13px; text-align: center; outline: none; font-family: inherit; }
|
||||
.drops-input:focus { border-color: #7ec6a4; }
|
||||
.cell-ppd { color: #999; font-size: 12px; }
|
||||
.cell-subtotal { color: #4a9d7e; font-weight: 600; }
|
||||
.remove-btn { border: none; background: none; color: #ccc; cursor: pointer; font-size: 18px; }
|
||||
.remove-btn:hover { color: #c0392b; }
|
||||
|
||||
.total-row {
|
||||
background: #e8f5e9; border-radius: 12px; padding: 14px 18px;
|
||||
display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px;
|
||||
}
|
||||
.total-label { font-size: 14px; color: #3e3a44; font-weight: 500; }
|
||||
.total-price { font-size: 20px; font-weight: 700; color: #2e7d5a; }
|
||||
|
||||
.pricing-inline { margin-top: 12px; }
|
||||
.price-field { display: flex; align-items: center; gap: 8px; }
|
||||
.price-field label { font-size: 13px; font-weight: 600; color: #3e3a44; white-space: nowrap; }
|
||||
.price-input { width: 100px; padding: 8px 10px; border: 1.5px solid #d4cfc7; border-radius: 8px; font-size: 14px; font-family: inherit; outline: none; }
|
||||
.price-input:focus { border-color: #7ec6a4; }
|
||||
|
||||
.form-select {
|
||||
flex: 1;
|
||||
@@ -573,6 +507,14 @@ function formatDate(d) {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ing-cost {
|
||||
font-size: 13px;
|
||||
color: #4a9d7e;
|
||||
font-weight: 500;
|
||||
min-width: 60px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.price-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,38 +1,21 @@
|
||||
<template>
|
||||
<div class="recipe-search">
|
||||
<!-- Category Carousel (full-width image slides) -->
|
||||
<div class="cat-wrap" v-if="categories.length && !selectedCategory" data-no-tab-swipe @touchstart="onCarouselTouchStart" @touchend="onCarouselTouchEnd">
|
||||
<div class="cat-track" :style="{ transform: `translateX(-${catIdx * 100}%)` }">
|
||||
<!-- Category Carousel -->
|
||||
<div class="cat-wrap" v-if="categories.length">
|
||||
<button class="cat-arrow cat-arrow-left" @click="scrollCat(-1)" :disabled="catScrollPos <= 0">‹</button>
|
||||
<div class="cat-track" ref="catTrack">
|
||||
<div
|
||||
v-for="cat in categories"
|
||||
:key="cat.name"
|
||||
class="cat-card"
|
||||
:style="{ backgroundImage: cat.bg_image ? `url(${cat.bg_image})` : `linear-gradient(135deg, ${cat.color_from || '#7a9e7e'}, ${cat.color_to || '#5a7d5e'})` }"
|
||||
@click="selectCategory(cat)"
|
||||
:class="{ active: selectedCategory === cat.name }"
|
||||
@click="toggleCategory(cat.name)"
|
||||
>
|
||||
<div class="cat-inner">
|
||||
<div class="cat-icon">{{ cat.icon || '🌿' }}</div>
|
||||
<div class="cat-name">{{ cat.name }}</div>
|
||||
<div v-if="cat.subtitle" class="cat-sub">{{ cat.subtitle }}</div>
|
||||
</div>
|
||||
<span class="cat-icon">{{ cat.icon || '📁' }}</span>
|
||||
<span class="cat-label">{{ cat.name }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<button class="cat-arrow left" @click="slideCat(-1)">‹</button>
|
||||
<button class="cat-arrow right" @click="slideCat(1)">›</button>
|
||||
</div>
|
||||
<div class="cat-dots" v-if="categories.length > 1 && !selectedCategory">
|
||||
<span
|
||||
v-for="(cat, i) in categories"
|
||||
:key="i"
|
||||
class="cat-dot"
|
||||
:class="{ active: catIdx === i }"
|
||||
@click="catIdx = i"
|
||||
></span>
|
||||
</div>
|
||||
<!-- Category filter active banner -->
|
||||
<div v-if="selectedCategory" class="cat-filter-bar">
|
||||
<span>📂 {{ selectedCategory }}</span>
|
||||
<button @click="selectedCategory = null; catIdx = 0" class="btn-sm btn-outline">✕ 返回全部</button>
|
||||
<button class="cat-arrow cat-arrow-right" @click="scrollCat(1)">›</button>
|
||||
</div>
|
||||
|
||||
<!-- Search Box -->
|
||||
@@ -49,96 +32,56 @@
|
||||
|
||||
<!-- Personal Section (logged in) -->
|
||||
<div v-if="auth.isLoggedIn" class="personal-section">
|
||||
<template v-if="!searchQuery || myDiaryRecipes.length > 0">
|
||||
<div class="section-header" @click="showMyRecipes = !showMyRecipes">
|
||||
<span>📖 我的配方 ({{ myDiaryRecipes.length }})</span>
|
||||
<span v-if="!auth.isAdmin && sharedCount.total > 0" class="contrib-badge">已贡献 {{ sharedCount.adopted }}/{{ sharedCount.total }} 条</span>
|
||||
<span>📖 我的配方</span>
|
||||
<span class="toggle-icon">{{ showMyRecipes ? '▾' : '▸' }}</span>
|
||||
</div>
|
||||
<div v-if="showMyRecipes" class="recipe-grid">
|
||||
<div v-for="d in myDiaryRecipes" :key="'diary-' + d.id" class="diary-card-wrap">
|
||||
<RecipeCard
|
||||
:recipe="diaryAsRecipe(d)"
|
||||
:index="-1"
|
||||
@click="openDiaryDetail(d)"
|
||||
/>
|
||||
<span v-if="getDiaryShareStatus(d) === 'shared'" class="share-status shared">已共享</span>
|
||||
<span v-else-if="getDiaryShareStatus(d) === 'pending'" class="share-status pending">审核中</span>
|
||||
</div>
|
||||
<div v-if="myDiaryRecipes.length === 0" class="empty-hint">暂无个人配方</div>
|
||||
<RecipeCard
|
||||
v-for="(r, i) in myRecipesPreview"
|
||||
:key="r._id"
|
||||
:recipe="r"
|
||||
:index="findGlobalIndex(r)"
|
||||
@click="openDetail(findGlobalIndex(r))"
|
||||
@toggle-fav="handleToggleFav(r)"
|
||||
/>
|
||||
<div v-if="myRecipesPreview.length === 0" class="empty-hint">暂无个人配方</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-if="!searchQuery || favoritesPreview.length > 0">
|
||||
<div class="section-header" @click="showFavorites = !showFavorites">
|
||||
<span>⭐ 收藏配方 ({{ favoritesPreview.length }})</span>
|
||||
<span class="toggle-icon">{{ showFavorites ? '▾' : '▸' }}</span>
|
||||
</div>
|
||||
<div v-if="showFavorites" class="recipe-grid">
|
||||
<RecipeCard
|
||||
v-for="r in favoritesPreview"
|
||||
:key="r._id"
|
||||
:recipe="r"
|
||||
:index="findGlobalIndex(r)"
|
||||
@click="openDetail(findGlobalIndex(r))"
|
||||
@toggle-fav="handleToggleFav(r)"
|
||||
/>
|
||||
<div v-if="favoritesPreview.length === 0" class="empty-hint">暂无收藏配方</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="section-header" @click="showFavorites = !showFavorites">
|
||||
<span>⭐ 收藏配方</span>
|
||||
<span class="toggle-icon">{{ showFavorites ? '▾' : '▸' }}</span>
|
||||
</div>
|
||||
<div v-if="showFavorites" class="recipe-grid">
|
||||
<RecipeCard
|
||||
v-for="(r, i) in favoritesPreview"
|
||||
:key="r._id"
|
||||
:recipe="r"
|
||||
:index="findGlobalIndex(r)"
|
||||
@click="openDetail(findGlobalIndex(r))"
|
||||
@toggle-fav="handleToggleFav(r)"
|
||||
/>
|
||||
<div v-if="favoritesPreview.length === 0" class="empty-hint">暂无收藏配方</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Search Results (public recipes) -->
|
||||
<div v-if="searchQuery" class="search-results-section">
|
||||
<!-- Exact matches -->
|
||||
<template v-if="exactResults.length > 0">
|
||||
<div class="section-label">🔍 搜索结果 ({{ exactResults.length }})</div>
|
||||
<div class="recipe-grid">
|
||||
<RecipeCard
|
||||
v-for="r in exactResults"
|
||||
:key="r._id"
|
||||
:recipe="r"
|
||||
:index="findGlobalIndex(r)"
|
||||
@click="openDetail(findGlobalIndex(r))"
|
||||
@toggle-fav="handleToggleFav(r)"
|
||||
/>
|
||||
</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>
|
||||
<!-- Fuzzy Search Results -->
|
||||
<div v-if="searchQuery && fuzzyResults.length" class="search-results-section">
|
||||
<div class="section-label">🔍 搜索结果 ({{ fuzzyResults.length }})</div>
|
||||
<div class="recipe-grid">
|
||||
<RecipeCard
|
||||
v-for="(r, i) in fuzzyResults"
|
||||
:key="r._id"
|
||||
:recipe="r"
|
||||
:index="findGlobalIndex(r)"
|
||||
@click="openDetail(findGlobalIndex(r))"
|
||||
@toggle-fav="handleToggleFav(r)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Public Recipe Grid -->
|
||||
<div v-if="!searchQuery">
|
||||
<div v-if="!searchQuery || fuzzyResults.length === 0">
|
||||
<div class="section-label">🌿 公共配方库 ({{ filteredRecipes.length }})</div>
|
||||
<div class="recipe-grid">
|
||||
<RecipeCard
|
||||
@@ -155,22 +98,18 @@
|
||||
|
||||
<!-- Recipe Detail Overlay -->
|
||||
<RecipeDetailOverlay
|
||||
v-if="selectedRecipeIndex !== null || selectedDiaryRecipe !== null"
|
||||
v-if="selectedRecipeIndex !== null"
|
||||
:recipeIndex="selectedRecipeIndex"
|
||||
:recipeData="selectedDiaryRecipe"
|
||||
:isDiary="selectedDiaryRecipe !== null"
|
||||
@close="selectedRecipeIndex = null; selectedDiaryRecipe = null"
|
||||
@close="selectedRecipeIndex = null"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted, nextTick, watch } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { ref, computed, onMounted, nextTick } from 'vue'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
import { useOilsStore } from '../stores/oils'
|
||||
import { useRecipesStore } from '../stores/recipes'
|
||||
import { useDiaryStore } from '../stores/diary'
|
||||
import { useUiStore } from '../stores/ui'
|
||||
import { api } from '../composables/useApi'
|
||||
import RecipeCard from '../components/RecipeCard.vue'
|
||||
@@ -179,206 +118,70 @@ import RecipeDetailOverlay from '../components/RecipeDetailOverlay.vue'
|
||||
const auth = useAuthStore()
|
||||
const oils = useOilsStore()
|
||||
const recipeStore = useRecipesStore()
|
||||
const diaryStore = useDiaryStore()
|
||||
const ui = useUiStore()
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
|
||||
const searchQuery = ref('')
|
||||
const selectedCategory = ref(null)
|
||||
const categories = ref([])
|
||||
const selectedRecipeIndex = ref(null)
|
||||
const selectedDiaryRecipe = ref(null)
|
||||
const showMyRecipes = ref(false)
|
||||
const showFavorites = ref(false)
|
||||
const catIdx = ref(0)
|
||||
const sharedCount = ref({ adopted: 0, total: 0 })
|
||||
const showMyRecipes = ref(true)
|
||||
const showFavorites = ref(true)
|
||||
const catScrollPos = ref(0)
|
||||
const catTrack = ref(null)
|
||||
|
||||
onMounted(async () => {
|
||||
try {
|
||||
const res = await api('/api/categories')
|
||||
const res = await api('/api/category-modules')
|
||||
if (res.ok) {
|
||||
categories.value = await res.json()
|
||||
}
|
||||
} catch {}
|
||||
|
||||
// Load personal diary recipes & contribution stats
|
||||
if (auth.isLoggedIn) {
|
||||
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
|
||||
const openRecipeId = route.query.openRecipe
|
||||
if (openRecipeId) {
|
||||
router.replace({ path: '/', query: {} })
|
||||
const tryOpen = () => {
|
||||
const idx = recipeStore.recipes.findIndex(r => String(r._id) === String(openRecipeId))
|
||||
if (idx >= 0) {
|
||||
openDetail(idx)
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
if (!tryOpen()) {
|
||||
// Recipes might not be loaded yet, watch until available
|
||||
const stop = watch(
|
||||
() => recipeStore.recipes.length,
|
||||
() => { if (tryOpen()) stop() },
|
||||
)
|
||||
}
|
||||
} catch {
|
||||
// category modules are optional
|
||||
}
|
||||
})
|
||||
|
||||
function selectCategory(cat) {
|
||||
selectedCategory.value = cat.tag_name || cat.name
|
||||
function toggleCategory(name) {
|
||||
selectedCategory.value = selectedCategory.value === name ? null : name
|
||||
}
|
||||
|
||||
function slideCat(dir) {
|
||||
const len = categories.value.length
|
||||
catIdx.value = (catIdx.value + dir + len) % len
|
||||
function scrollCat(dir) {
|
||||
if (!catTrack.value) return
|
||||
const scrollAmount = 200
|
||||
catTrack.value.scrollLeft += dir * scrollAmount
|
||||
catScrollPos.value = catTrack.value.scrollLeft + dir * scrollAmount
|
||||
}
|
||||
|
||||
// Public recipes (all recipes in the public library)
|
||||
const filteredRecipes = computed(() => {
|
||||
let list = recipeStore.recipes
|
||||
if (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
|
||||
const synonymGroups = [
|
||||
['胸', '乳腺', '乳房', '丰胸', '胸部'],
|
||||
['瘦', '减肥', '减脂', '消脂', '纤体', '塑形', '体重'],
|
||||
['痘', '痤疮', '粉刺', '暗疮', '长痘', '祛痘'],
|
||||
['斑', '色斑', '淡斑', '雀斑', '黑色素', '美白', '亮肤'],
|
||||
['皱', '抗皱', '皱纹', '紧致', '抗衰', '抗老'],
|
||||
['睡', '眠', '失眠', '助眠', '安眠', '好眠', '入睡'],
|
||||
['焦虑', '紧张', '压力', '情绪', '放松', '舒缓', '安神', '宁神'],
|
||||
['头', '头痛', '头疼', '偏头痛', '头晕'],
|
||||
['咳', '咳嗽', '止咳', '清咽'],
|
||||
['鼻', '鼻炎', '鼻塞', '过敏性鼻炎', '打喷嚏'],
|
||||
['感冒', '发烧', '发热', '流感', '风寒', '风热'],
|
||||
['胃', '消化', '肠胃', '胃痛', '胃胀', '积食', '便秘'],
|
||||
['肝', '护肝', '养肝', '肝脏', '排毒'],
|
||||
['肾', '补肾', '养肾', '肾虚'],
|
||||
['腰', '腰痛', '腰酸', '腰椎'],
|
||||
['肩', '肩颈', '颈椎', '肩周'],
|
||||
['关节', '骨骼', '骨质', '风湿', '类风湿'],
|
||||
['肌肉', '酸痛', '疼痛', '拉伤'],
|
||||
['月经', '痛经', '经期', '姨妈', '生理期', '调经'],
|
||||
['子宫', '卵巢', '生殖', '备孕', '怀孕', '孕'],
|
||||
['前列腺', '男性', '阳'],
|
||||
['湿', '祛湿', '排湿', '湿气', '化湿'],
|
||||
['免疫', '免疫力', '抵抗力'],
|
||||
['脱发', '掉发', '生发', '头发', '发际线', '秃'],
|
||||
['过敏', '敏感', '荨麻疹', '湿疹', '皮炎'],
|
||||
['血压', '高血压', '低血压', '血管', '循环'],
|
||||
['血糖', '糖尿病', '降糖'],
|
||||
['淋巴', '排毒', '水肿', '浮肿'],
|
||||
['呼吸', '肺', '支气管', '哮喘', '气管'],
|
||||
['眼', '眼睛', '视力', '近视', '干眼'],
|
||||
['耳', '耳鸣', '中耳炎', '耳朵'],
|
||||
['口', '口腔', '口臭', '牙', '牙龈', '牙疼'],
|
||||
['皮肤', '护肤', '保湿', '修复', '焕肤'],
|
||||
['疤', '疤痕', '伤疤', '妊娠纹'],
|
||||
['心', '心脏', '心悸', '养心'],
|
||||
['甲状腺', '甲亢', '甲减'],
|
||||
['高', '长高', '增高', '个子'],
|
||||
['静脉', '静脉曲张'],
|
||||
['痔', '痔疮'],
|
||||
]
|
||||
|
||||
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(() => {
|
||||
const fuzzyResults = computed(() => {
|
||||
if (!searchQuery.value.trim()) return []
|
||||
const q = searchQuery.value.trim().toLowerCase()
|
||||
return recipeStore.recipes.filter(r => {
|
||||
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))
|
||||
return nameMatch || tagMatch
|
||||
}).sort((a, b) => a.name.localeCompare(b.name, 'zh'))
|
||||
return nameMatch || oilMatch || tagMatch
|
||||
})
|
||||
})
|
||||
|
||||
// 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)
|
||||
const myDiaryRecipes = computed(() => {
|
||||
const myRecipesPreview = computed(() => {
|
||||
if (!auth.isLoggedIn) return []
|
||||
let list = diaryStore.userDiary
|
||||
if (searchQuery.value.trim()) {
|
||||
const q = searchQuery.value.trim().toLowerCase()
|
||||
list = list.filter(d => {
|
||||
return d.name.toLowerCase().includes(q) ||
|
||||
(d.ingredients || []).some(ing => ing.oil?.toLowerCase().includes(q))
|
||||
})
|
||||
}
|
||||
return list
|
||||
return recipeStore.recipes
|
||||
.filter(r => r._owner_id === auth.user.id)
|
||||
.slice(0, 6)
|
||||
})
|
||||
|
||||
const favoritesPreview = computed(() => {
|
||||
if (!auth.isLoggedIn) return []
|
||||
let list = recipeStore.recipes.filter(r => recipeStore.isFavorite(r))
|
||||
if (searchQuery.value.trim()) {
|
||||
const q = searchQuery.value.trim().toLowerCase()
|
||||
list = list.filter(r => {
|
||||
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))
|
||||
return nameMatch || oilMatch || tagMatch
|
||||
})
|
||||
}
|
||||
return list.slice(0, 6)
|
||||
return recipeStore.recipes
|
||||
.filter(r => recipeStore.isFavorite(r))
|
||||
.slice(0, 6)
|
||||
})
|
||||
|
||||
function findGlobalIndex(recipe) {
|
||||
@@ -391,26 +194,6 @@ 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) {
|
||||
selectedDiaryRecipe.value = diaryAsRecipe(diary)
|
||||
}
|
||||
|
||||
async function handleToggleFav(recipe) {
|
||||
if (!auth.isLoggedIn) {
|
||||
ui.openLogin()
|
||||
@@ -419,51 +202,13 @@ async function handleToggleFav(recipe) {
|
||||
await recipeStore.toggleFavorite(recipe._id)
|
||||
}
|
||||
|
||||
async function shareDiaryToPublic(diary) {
|
||||
const { showConfirm } = await import('../composables/useDialog')
|
||||
const ok = await showConfirm(`将「${diary.name}」共享到公共配方库？\n共享后所有用户都能看到。`)
|
||||
if (!ok) return
|
||||
try {
|
||||
await api('/api/recipes', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({
|
||||
name: diary.name,
|
||||
note: diary.note || '',
|
||||
ingredients: (diary.ingredients || []).map(i => ({ oil_name: i.oil, drops: i.drops })),
|
||||
tags: diary.tags || [],
|
||||
}),
|
||||
})
|
||||
if (auth.isAdmin) {
|
||||
ui.showToast('已共享到公共配方库')
|
||||
} else {
|
||||
ui.showToast('已提交，等待管理员审核')
|
||||
}
|
||||
await recipeStore.loadRecipes()
|
||||
} catch {
|
||||
ui.showToast('共享失败')
|
||||
}
|
||||
}
|
||||
|
||||
function onSearch() {
|
||||
reportedMissing.value = false
|
||||
// fuzzyResults computed handles the filtering reactively
|
||||
}
|
||||
|
||||
function clearSearch() {
|
||||
searchQuery.value = ''
|
||||
selectedCategory.value = null
|
||||
reportedMissing.value = false
|
||||
}
|
||||
|
||||
// Carousel swipe
|
||||
const carouselTouchStartX = ref(0)
|
||||
function onCarouselTouchStart(e) {
|
||||
carouselTouchStartX.value = e.touches[0].clientX
|
||||
}
|
||||
function onCarouselTouchEnd(e) {
|
||||
const dx = e.changedTouches[0].clientX - carouselTouchStartX.value
|
||||
if (Math.abs(dx) > 50) {
|
||||
slideCat(dx < 0 ? 1 : -1)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -474,127 +219,81 @@ function onCarouselTouchEnd(e) {
|
||||
|
||||
.cat-wrap {
|
||||
position: relative;
|
||||
margin: 0 -12px 20px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 16px;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.cat-track {
|
||||
display: flex;
|
||||
transition: transform 0.4s ease;
|
||||
will-change: transform;
|
||||
gap: 10px;
|
||||
overflow-x: auto;
|
||||
scroll-behavior: smooth;
|
||||
flex: 1;
|
||||
padding: 8px 0;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.cat-track::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.cat-card {
|
||||
flex: 0 0 100%;
|
||||
min-height: 200px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.cat-card::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: linear-gradient(135deg, rgba(0,0,0,0.45), rgba(0,0,0,0.25));
|
||||
}
|
||||
|
||||
.cat-inner {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 36px 24px;
|
||||
color: white;
|
||||
text-align: center;
|
||||
gap: 4px;
|
||||
padding: 10px 16px;
|
||||
border-radius: 12px;
|
||||
background: #f8f7f5;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
font-size: 13px;
|
||||
transition: all 0.2s;
|
||||
min-width: 64px;
|
||||
border: 1.5px solid transparent;
|
||||
}
|
||||
|
||||
.cat-card:hover {
|
||||
background: #f0eeeb;
|
||||
}
|
||||
|
||||
.cat-card.active {
|
||||
background: linear-gradient(135deg, #e8f5e9, #c8e6c9);
|
||||
border-color: #7ec6a4;
|
||||
color: #2e7d5a;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.cat-icon {
|
||||
font-size: 48px;
|
||||
margin-bottom: 10px;
|
||||
filter: drop-shadow(0 2px 6px rgba(0,0,0,0.3));
|
||||
}
|
||||
|
||||
.cat-name {
|
||||
font-family: 'Noto Serif SC', serif;
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 3px;
|
||||
text-shadow: 0 2px 8px rgba(0,0,0,0.5);
|
||||
}
|
||||
|
||||
.cat-sub {
|
||||
font-size: 13px;
|
||||
margin-top: 6px;
|
||||
opacity: 0.9;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.cat-arrow {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
z-index: 2;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 50%;
|
||||
background: rgba(255,255,255,0.25);
|
||||
border: none;
|
||||
color: white;
|
||||
font-size: 18px;
|
||||
cursor: pointer;
|
||||
backdrop-filter: blur(4px);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
.cat-arrow:hover { background: rgba(255,255,255,0.45); }
|
||||
.cat-arrow.left { left: 12px; }
|
||||
.cat-arrow.right { right: 12px; }
|
||||
|
||||
.cat-dots {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
.cat-dot {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
background: var(--border, #e0d4c0);
|
||||
cursor: pointer;
|
||||
transition: all 0.25s;
|
||||
}
|
||||
.cat-dot.active {
|
||||
background: var(--sage, #7a9e7e);
|
||||
width: 22px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.cat-filter-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background: var(--sage-mist, #eef4ee);
|
||||
border-radius: 10px;
|
||||
padding: 10px 16px;
|
||||
margin-bottom: 16px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: var(--sage-dark, #5a7d5e);
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.cat-label {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.cat-arrow {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border-radius: 50%;
|
||||
border: 1.5px solid #d4cfc7;
|
||||
background: #fff;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
color: #6b6375;
|
||||
}
|
||||
|
||||
.cat-arrow:disabled {
|
||||
opacity: 0.3;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.search-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -664,62 +363,11 @@ function onCarouselTouchEnd(e) {
|
||||
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 {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #3e3a44;
|
||||
padding: 10px 12px;
|
||||
padding: 8px 4px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
@@ -742,89 +390,6 @@ function onCarouselTouchEnd(e) {
|
||||
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 {
|
||||
background: white;
|
||||
border-radius: 14px;
|
||||
padding: 16px;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 2px 10px rgba(0,0,0,0.06);
|
||||
border: 2px solid transparent;
|
||||
border-left: 3px solid var(--sage, #7a9e7e);
|
||||
transition: all 0.2s;
|
||||
}
|
||||
.diary-card:hover {
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 16px rgba(0,0,0,0.1);
|
||||
}
|
||||
.diary-card .card-name {
|
||||
font-family: 'Noto Serif SC', serif;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
color: #2c2416;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
.diary-card .card-oils {
|
||||
font-size: 12px;
|
||||
color: #9a8570;
|
||||
line-height: 1.6;
|
||||
}
|
||||
.diary-card .card-bottom {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 8px;
|
||||
}
|
||||
.diary-card .card-price {
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: var(--sage-dark, #5a7d5e);
|
||||
}
|
||||
|
||||
.share-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
padding: 2px 4px;
|
||||
border-radius: 6px;
|
||||
opacity: 0.5;
|
||||
transition: opacity 0.2s;
|
||||
}
|
||||
.share-btn:hover { opacity: 1; }
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.recipe-grid {
|
||||
grid-template-columns: 1fr;
|
||||
|
||||
@@ -22,39 +22,43 @@
|
||||
</div>
|
||||
|
||||
<!-- Business Application Approval -->
|
||||
<div v-if="groupedBizApps.length > 0" class="review-section">
|
||||
<div v-if="businessApps.length > 0" class="review-section">
|
||||
<h4 class="section-title">💼 商业认证申请</h4>
|
||||
<div class="review-list">
|
||||
<div v-for="group in groupedBizApps" :key="group.user_id" class="biz-app-group">
|
||||
<div class="review-item">
|
||||
<div class="review-info">
|
||||
<span class="review-name">{{ group.latest.display_name || group.latest.username }}</span>
|
||||
<span class="review-reason">商户名：{{ group.latest.business_name }}</span>
|
||||
<span class="biz-status-tag" :class="'biz-' + group.latest.status">{{ { pending: '待审核', approved: '已通过', rejected: '已拒绝' }[group.latest.status] }}</span>
|
||||
</div>
|
||||
<div class="review-actions">
|
||||
<template v-if="group.latest.status === 'pending'">
|
||||
<button class="btn-sm btn-approve" @click="approveBusiness(group.latest)">通过</button>
|
||||
<button class="btn-sm btn-reject" @click="rejectBusiness(group.latest)">拒绝</button>
|
||||
</template>
|
||||
<button v-if="group.history.length > 1" class="btn-sm btn-outline" @click="group.expanded = !group.expanded">
|
||||
{{ group.expanded ? '收起' : `历史 (${group.history.length})` }}
|
||||
</button>
|
||||
</div>
|
||||
<div v-for="app in businessApps" :key="app._id || app.id" class="review-item">
|
||||
<div class="review-info">
|
||||
<span class="review-name">{{ app.user_name || app.display_name }}</span>
|
||||
<span class="review-reason">{{ app.reason }}</span>
|
||||
</div>
|
||||
<div v-if="group.expanded" class="biz-history">
|
||||
<div v-for="app in group.history" :key="app.id" class="biz-history-item">
|
||||
<span class="biz-status-tag small" :class="'biz-' + app.status">{{ { pending: '待审核', approved: '已通过', rejected: '已拒绝' }[app.status] }}</span>
|
||||
<span>{{ app.business_name }}</span>
|
||||
<span v-if="app.reject_reason" class="biz-reject-reason">拒绝原因：{{ app.reject_reason }}</span>
|
||||
<span class="biz-time">{{ formatDate(app.created_at) }}</span>
|
||||
</div>
|
||||
<div class="review-actions">
|
||||
<button class="btn-sm btn-approve" @click="approveBusiness(app)">通过</button>
|
||||
<button class="btn-sm btn-reject" @click="rejectBusiness(app)">拒绝</button>
|
||||
</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 -->
|
||||
<div class="filter-toolbar">
|
||||
@@ -96,14 +100,13 @@
|
||||
:value="u.role"
|
||||
class="role-select"
|
||||
@change="changeRole(u, $event.target.value)"
|
||||
:disabled="u.role === 'admin'"
|
||||
>
|
||||
<option value="viewer">查看者</option>
|
||||
<option value="editor">编辑</option>
|
||||
<option value="senior_editor">高级编辑</option>
|
||||
<option value="admin">管理员</option>
|
||||
</select>
|
||||
<button v-if="!u.business_verified" class="btn-sm btn-outline" @click="grantBusiness(u)" title="开通商业认证">💼</button>
|
||||
<button v-else class="btn-sm btn-outline" @click="revokeBusiness(u)" title="撤销商业认证" style="opacity:0.5">💼✕</button>
|
||||
<button class="btn-sm btn-outline" @click="copyUserLink(u)" title="复制登录链接">🔗</button>
|
||||
<button class="btn-sm btn-delete" @click="removeUser(u)" title="删除用户">🗑️</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -115,11 +118,11 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted } from 'vue'
|
||||
import { ref, computed, reactive, onMounted } from 'vue'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
import { useUiStore } from '../stores/ui'
|
||||
import { api } from '../composables/useApi'
|
||||
import { showConfirm, showPrompt } from '../composables/useDialog'
|
||||
import { showConfirm } from '../composables/useDialog'
|
||||
|
||||
const auth = useAuthStore()
|
||||
const ui = useUiStore()
|
||||
@@ -129,27 +132,15 @@ const searchQuery = ref('')
|
||||
const filterRole = ref('')
|
||||
const translations = ref([])
|
||||
const businessApps = ref([])
|
||||
import { reactive } from 'vue'
|
||||
const createdLink = ref('')
|
||||
|
||||
const groupedBizApps = computed(() => {
|
||||
const map = {}
|
||||
for (const app of businessApps.value) {
|
||||
const uid = app.user_id
|
||||
if (!map[uid]) map[uid] = { user_id: uid, history: [], latest: null, expanded: false }
|
||||
map[uid].history.push(app)
|
||||
}
|
||||
return Object.values(map).map(g => {
|
||||
g.history.sort((a, b) => b.id - a.id)
|
||||
g.latest = g.history[0]
|
||||
return reactive(g)
|
||||
}).filter(g => g.latest)
|
||||
const newUser = reactive({
|
||||
username: '',
|
||||
display_name: '',
|
||||
password: '',
|
||||
role: 'viewer',
|
||||
})
|
||||
|
||||
function formatDate(d) {
|
||||
if (!d) return ''
|
||||
return new Date(d + 'Z').toLocaleString('zh-CN', { month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit' })
|
||||
}
|
||||
|
||||
const roles = [
|
||||
{ value: 'admin', label: '管理员' },
|
||||
{ value: 'senior_editor', label: '高级编辑' },
|
||||
@@ -177,6 +168,10 @@ function roleLabel(role) {
|
||||
return map[role] || role
|
||||
}
|
||||
|
||||
function formatDate(d) {
|
||||
if (!d) return '--'
|
||||
return new Date(d).toLocaleDateString('zh-CN')
|
||||
}
|
||||
|
||||
async function loadUsers() {
|
||||
try {
|
||||
@@ -211,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) {
|
||||
const id = user._id || user.id
|
||||
try {
|
||||
const res = await api(`/api/users/${id}`, {
|
||||
const res = await api(`/api/users/${id}/role`, {
|
||||
method: 'PUT',
|
||||
body: JSON.stringify({ role: newRole }),
|
||||
})
|
||||
@@ -242,33 +270,27 @@ async function removeUser(user) {
|
||||
}
|
||||
}
|
||||
|
||||
async function grantBusiness(user) {
|
||||
const ok = await showConfirm(`直接为「${user.display_name || user.username}」开通商业认证？`)
|
||||
if (!ok) return
|
||||
const id = user._id || user.id
|
||||
async function copyUserLink(user) {
|
||||
try {
|
||||
const res = await api(`/api/business-grant/${id}`, { method: 'POST' })
|
||||
const id = user._id || user.id
|
||||
const res = await api(`/api/users/${id}/token`)
|
||||
if (res.ok) {
|
||||
user.business_verified = 1
|
||||
ui.showToast('已开通商业认证')
|
||||
const data = await res.json()
|
||||
const link = `${window.location.origin}/?token=${data.token}`
|
||||
await navigator.clipboard.writeText(link)
|
||||
ui.showToast('链接已复制')
|
||||
}
|
||||
} catch {
|
||||
ui.showToast('操作失败')
|
||||
ui.showToast('获取链接失败')
|
||||
}
|
||||
}
|
||||
|
||||
async function revokeBusiness(user) {
|
||||
const ok = await showConfirm(`撤销「${user.display_name || user.username}」的商业认证？`)
|
||||
if (!ok) return
|
||||
const id = user._id || user.id
|
||||
async function copyLink(link) {
|
||||
try {
|
||||
const res = await api(`/api/business-revoke/${id}`, { method: 'POST' })
|
||||
if (res.ok) {
|
||||
user.business_verified = 0
|
||||
ui.showToast('已撤销商业认证')
|
||||
}
|
||||
await navigator.clipboard.writeText(link)
|
||||
ui.showToast('已复制')
|
||||
} catch {
|
||||
ui.showToast('操作失败')
|
||||
ui.showToast('复制失败')
|
||||
}
|
||||
}
|
||||
|
||||
@@ -313,13 +335,8 @@ async function approveBusiness(app) {
|
||||
|
||||
async function rejectBusiness(app) {
|
||||
const id = app._id || app.id
|
||||
const reason = await showPrompt('请输入拒绝原因（选填）：')
|
||||
if (reason === null) return
|
||||
try {
|
||||
const res = await api(`/api/business-applications/${id}/reject`, {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({ reason: reason || '' }),
|
||||
})
|
||||
const res = await api(`/api/business-applications/${id}/reject`, { method: 'POST' })
|
||||
if (res.ok) {
|
||||
businessApps.value = businessApps.value.filter(item => (item._id || item.id) !== id)
|
||||
ui.showToast('已拒绝')
|
||||
@@ -417,26 +434,8 @@ onMounted(() => {
|
||||
.review-actions {
|
||||
display: flex;
|
||||
gap: 6px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.biz-app-group { margin-bottom: 6px; }
|
||||
.biz-status-tag {
|
||||
font-size: 11px; padding: 2px 8px; border-radius: 8px; font-weight: 500; white-space: nowrap;
|
||||
}
|
||||
.biz-status-tag.small { font-size: 10px; padding: 1px 6px; }
|
||||
.biz-pending { background: #fff3e0; color: #e65100; }
|
||||
.biz-approved { background: #e8f5e9; color: #2e7d32; }
|
||||
.biz-rejected { background: #fce4ec; color: #c62828; }
|
||||
.biz-history {
|
||||
margin: 4px 0 8px 16px; padding: 8px 12px; background: #fafaf8; border-radius: 8px; border-left: 3px solid #e5e4e7;
|
||||
}
|
||||
.biz-history-item {
|
||||
display: flex; align-items: center; gap: 8px; font-size: 12px; padding: 4px 0; flex-wrap: wrap;
|
||||
}
|
||||
.biz-reject-reason { color: #c62828; font-size: 11px; }
|
||||
.biz-time { color: #bbb; font-size: 11px; margin-left: auto; }
|
||||
|
||||
.btn-approve {
|
||||
background: #4a9d7e;
|
||||
color: #fff;
|
||||
|
||||
@@ -11,9 +11,5 @@ export default defineConfig({
|
||||
},
|
||||
build: {
|
||||
outDir: 'dist'
|
||||
},
|
||||
test: {
|
||||
environment: 'jsdom',
|
||||
globals: true,
|
||||
}
|
||||
})
|
||||
|
||||
1
node_modules/.vite/vitest/da39a3ee5e6b4b0d3255bfef95601890afd80709/results.json
generated
vendored
1
node_modules/.vite/vitest/da39a3ee5e6b4b0d3255bfef95601890afd80709/results.json
generated
vendored
@@ -1 +0,0 @@
|
||||
{"version":"4.1.2","results":[[":frontend/src/__tests__/volumeDilution.test.js",{"duration":6.227510999999993,"failed":false}],[":frontend/src/__tests__/smartPaste.test.js",{"duration":14.144011000000006,"failed":false}],[":frontend/src/__tests__/oilCalculations.test.js",{"duration":18.03941499999999,"failed":false}],[":frontend/src/__tests__/dialog.test.js",{"duration":3.7299579999999963,"failed":false}],[":frontend/src/__tests__/oilTranslation.test.js",{"duration":5.783867999999998,"failed":false}]]}
|
||||
@@ -1,259 +0,0 @@
|
||||
#!/usr/bin/env python3
|
||||
"""Deploy or teardown a PR preview environment on local k3s.
|
||||
|
||||
Runs directly on the oci server (where k3s and docker are local).
|
||||
|
||||
Usage:
|
||||
python3 scripts/deploy-preview.py deploy <PR_ID>
|
||||
python3 scripts/deploy-preview.py teardown <PR_ID>
|
||||
"""
|
||||
|
||||
import subprocess
|
||||
import sys
|
||||
import json
|
||||
import tempfile
|
||||
import textwrap
|
||||
from pathlib import Path
|
||||
|
||||
REGISTRY = "registry.oci.euphon.net"
|
||||
BASE_DOMAIN = "oil.oci.euphon.net"
|
||||
PROD_NS = "oil-calculator"
|
||||
|
||||
|
||||
def run(cmd: list[str] | str, *, check=True, capture=False) -> subprocess.CompletedProcess:
|
||||
"""Run a command, print it, and optionally check for errors."""
|
||||
if isinstance(cmd, str):
|
||||
cmd = ["sh", "-c", cmd]
|
||||
display = " ".join(cmd) if isinstance(cmd, list) else cmd
|
||||
print(f" $ {display}")
|
||||
r = subprocess.run(cmd, text=True, capture_output=capture)
|
||||
if capture and r.stdout.strip():
|
||||
for line in r.stdout.strip().splitlines()[:5]:
|
||||
print(f" {line}")
|
||||
if check and r.returncode != 0:
|
||||
print(f" FAILED (exit {r.returncode})")
|
||||
if capture and r.stderr.strip():
|
||||
print(f" {r.stderr.strip()[:200]}")
|
||||
sys.exit(1)
|
||||
return r
|
||||
|
||||
|
||||
def kubectl(*args, capture=False, check=True) -> subprocess.CompletedProcess:
|
||||
return run(["sudo", "k3s", "kubectl", *args], capture=capture, check=check)
|
||||
|
||||
|
||||
def docker(*args, check=True) -> subprocess.CompletedProcess:
|
||||
return run(["docker", *args], check=check)
|
||||
|
||||
|
||||
def write_temp(content: str, suffix=".yaml") -> Path:
|
||||
"""Write content to a temp file and return its path."""
|
||||
f = tempfile.NamedTemporaryFile(mode="w", suffix=suffix, delete=False)
|
||||
f.write(content)
|
||||
f.close()
|
||||
return Path(f.name)
|
||||
|
||||
|
||||
# ─── Deploy ──────────────────────────────────────────────
|
||||
|
||||
def deploy(pr_id: str):
|
||||
ns = f"oil-pr-{pr_id}"
|
||||
host = f"pr-{pr_id}.{BASE_DOMAIN}"
|
||||
image = f"{REGISTRY}/oil-calculator:pr-{pr_id}"
|
||||
|
||||
print(f"\n{'='*60}")
|
||||
print(f" Deploying: https://{host}")
|
||||
print(f" Namespace: {ns}")
|
||||
print(f"{'='*60}\n")
|
||||
|
||||
# 1. Copy production DB into build context
|
||||
print("[1/5] Copying production database...")
|
||||
Path("data").mkdir(exist_ok=True)
|
||||
prod_pod = kubectl(
|
||||
"get", "pods", "-n", PROD_NS,
|
||||
"-l", "app=oil-calculator",
|
||||
"--field-selector=status.phase=Running",
|
||||
"-o", "jsonpath={.items[0].metadata.name}",
|
||||
capture=True, check=False
|
||||
).stdout.strip()
|
||||
|
||||
if prod_pod:
|
||||
kubectl("cp", f"{PROD_NS}/{prod_pod}:/data/oil_calculator.db", "data/oil_calculator.db")
|
||||
else:
|
||||
print(" WARNING: No running prod pod, using empty DB")
|
||||
Path("data/oil_calculator.db").touch()
|
||||
|
||||
# 2. Build and push image
|
||||
print("[2/5] Building Docker image...")
|
||||
dockerfile = textwrap.dedent("""\
|
||||
FROM node:20-slim AS frontend-build
|
||||
WORKDIR /build
|
||||
COPY frontend/package.json frontend/package-lock.json ./
|
||||
RUN npm ci
|
||||
COPY frontend/ ./
|
||||
RUN npm run build
|
||||
|
||||
FROM python:3.12-slim
|
||||
WORKDIR /app
|
||||
COPY backend/requirements.txt .
|
||||
RUN pip install --no-cache-dir -r requirements.txt
|
||||
COPY backend/ ./backend/
|
||||
COPY --from=frontend-build /build/dist ./frontend/
|
||||
COPY data/oil_calculator.db /data/oil_calculator.db
|
||||
ENV DB_PATH=/data/oil_calculator.db
|
||||
ENV FRONTEND_DIR=/app/frontend
|
||||
EXPOSE 8000
|
||||
CMD ["uvicorn", "backend.main:app", "--host", "0.0.0.0", "--port", "8000"]
|
||||
""")
|
||||
df = write_temp(dockerfile, suffix=".Dockerfile")
|
||||
docker("build", "-f", str(df), "-t", image, ".")
|
||||
df.unlink()
|
||||
docker("push", image)
|
||||
|
||||
# 3. Create namespace + regcred
|
||||
print("[3/5] Creating namespace...")
|
||||
kubectl("create", "namespace", ns, "--dry-run=client", "-o", "yaml",
|
||||
check=False) # just for display
|
||||
run(f"sudo k3s kubectl create namespace {ns} --dry-run=client -o yaml | sudo k3s kubectl apply -f -")
|
||||
|
||||
# Copy regcred from prod namespace
|
||||
r = kubectl("get", "secret", "regcred", "-n", PROD_NS, "-o", "json", capture=True)
|
||||
secret = json.loads(r.stdout)
|
||||
secret["metadata"] = {"name": "regcred", "namespace": ns}
|
||||
p = write_temp(json.dumps(secret), suffix=".json")
|
||||
kubectl("apply", "-f", str(p))
|
||||
p.unlink()
|
||||
|
||||
# 4. Apply manifests
|
||||
print("[4/5] Applying K8s resources...")
|
||||
manifests = textwrap.dedent(f"""\
|
||||
apiVersion: apps/v1
|
||||
kind: Deployment
|
||||
metadata:
|
||||
name: oil-calculator
|
||||
namespace: {ns}
|
||||
spec:
|
||||
replicas: 1
|
||||
selector:
|
||||
matchLabels:
|
||||
app: oil-calculator
|
||||
template:
|
||||
metadata:
|
||||
labels:
|
||||
app: oil-calculator
|
||||
spec:
|
||||
imagePullSecrets:
|
||||
- name: regcred
|
||||
containers:
|
||||
- name: app
|
||||
image: {image}
|
||||
imagePullPolicy: Always
|
||||
ports:
|
||||
- containerPort: 8000
|
||||
resources:
|
||||
requests:
|
||||
cpu: 50m
|
||||
memory: 64Mi
|
||||
limits:
|
||||
cpu: 500m
|
||||
memory: 256Mi
|
||||
---
|
||||
apiVersion: v1
|
||||
kind: Service
|
||||
metadata:
|
||||
name: oil-calculator
|
||||
namespace: {ns}
|
||||
spec:
|
||||
selector:
|
||||
app: oil-calculator
|
||||
ports:
|
||||
- port: 80
|
||||
targetPort: 8000
|
||||
---
|
||||
apiVersion: networking.k8s.io/v1
|
||||
kind: Ingress
|
||||
metadata:
|
||||
name: oil-calculator
|
||||
namespace: {ns}
|
||||
annotations:
|
||||
traefik.ingress.kubernetes.io/router.tls.certresolver: le
|
||||
spec:
|
||||
ingressClassName: traefik
|
||||
tls:
|
||||
- hosts:
|
||||
- {host}
|
||||
rules:
|
||||
- host: {host}
|
||||
http:
|
||||
paths:
|
||||
- path: /
|
||||
pathType: Prefix
|
||||
backend:
|
||||
service:
|
||||
name: oil-calculator
|
||||
port:
|
||||
number: 80
|
||||
""")
|
||||
p = write_temp(manifests)
|
||||
kubectl("apply", "-f", str(p))
|
||||
p.unlink()
|
||||
|
||||
# 5. Restart to pick up new image and wait
|
||||
print("[5/5] Restarting deployment...")
|
||||
kubectl("rollout", "restart", "deploy/oil-calculator", "-n", ns)
|
||||
kubectl("rollout", "status", "deploy/oil-calculator", "-n", ns, "--timeout=120s")
|
||||
|
||||
# Cleanup
|
||||
run("rm -rf data/oil_calculator.db", check=False)
|
||||
|
||||
print(f"\n{'='*60}")
|
||||
print(f" Preview live: https://{host}")
|
||||
print(f"{'='*60}\n")
|
||||
|
||||
|
||||
# ─── Teardown ────────────────────────────────────────────
|
||||
|
||||
def teardown(pr_id: str):
|
||||
ns = f"oil-pr-{pr_id}"
|
||||
image = f"{REGISTRY}/oil-calculator:pr-{pr_id}"
|
||||
|
||||
print(f"\n Tearing down: {ns}")
|
||||
kubectl("delete", "namespace", ns, "--ignore-not-found")
|
||||
docker("rmi", image, check=False)
|
||||
print(" Done.\n")
|
||||
|
||||
|
||||
# ─── Deploy Production ───────────────────────────────────
|
||||
|
||||
def deploy_prod():
|
||||
image = f"{REGISTRY}/oil-calculator:latest"
|
||||
|
||||
print(f"\n{'='*60}")
|
||||
print(f" Deploying production: https://{BASE_DOMAIN}")
|
||||
print(f"{'='*60}\n")
|
||||
|
||||
docker("build", "-t", image, ".")
|
||||
docker("push", image)
|
||||
kubectl("rollout", "restart", "deploy/oil-calculator", "-n", PROD_NS)
|
||||
kubectl("rollout", "status", "deploy/oil-calculator", "-n", PROD_NS, "--timeout=120s")
|
||||
|
||||
print(f"\n Production deployed: https://{BASE_DOMAIN}\n")
|
||||
|
||||
|
||||
# ─── Main ────────────────────────────────────────────────
|
||||
|
||||
if __name__ == "__main__":
|
||||
if len(sys.argv) < 2:
|
||||
print(__doc__)
|
||||
sys.exit(1)
|
||||
|
||||
action = sys.argv[1]
|
||||
if action == "deploy" and len(sys.argv) >= 3:
|
||||
deploy(sys.argv[2])
|
||||
elif action == "teardown" and len(sys.argv) >= 3:
|
||||
teardown(sys.argv[2])
|
||||
elif action == "deploy-prod":
|
||||
deploy_prod()
|
||||
else:
|
||||
print(__doc__)
|
||||
sys.exit(1)
|
||||
@@ -1,56 +0,0 @@
|
||||
#!/bin/bash
|
||||
# Setup Gitea Act Runner on this machine (host mode)
|
||||
# Usage: bash scripts/setup-runner.sh <registration-token>
|
||||
|
||||
set -e
|
||||
|
||||
TOKEN="${1:?Usage: $0 <registration-token>}"
|
||||
INSTANCE="https://git.euphon.cloud"
|
||||
RUNNER_NAME="hera-runner"
|
||||
RUNNER_BIN="$HOME/bin/act_runner"
|
||||
VERSION="v0.2.11"
|
||||
|
||||
echo "=== Installing act_runner ${VERSION} ==="
|
||||
mkdir -p "$HOME/bin"
|
||||
curl -L "https://gitea.com/gitea/act_runner/releases/download/${VERSION}/act_runner-${VERSION}-linux-amd64" \
|
||||
-o "$RUNNER_BIN"
|
||||
chmod +x "$RUNNER_BIN"
|
||||
echo "Installed: $($RUNNER_BIN --version)"
|
||||
|
||||
echo ""
|
||||
echo "=== Registering runner ==="
|
||||
cd "$HOME"
|
||||
$RUNNER_BIN register --no-interactive \
|
||||
--instance "$INSTANCE" \
|
||||
--token "$TOKEN" \
|
||||
--name "$RUNNER_NAME" \
|
||||
--labels "ubuntu-latest:host"
|
||||
|
||||
echo ""
|
||||
echo "=== Setting up systemd user service ==="
|
||||
mkdir -p "$HOME/.config/systemd/user"
|
||||
cat > "$HOME/.config/systemd/user/act-runner.service" << EOF
|
||||
[Unit]
|
||||
Description=Gitea Act Runner
|
||||
After=network.target
|
||||
|
||||
[Service]
|
||||
Type=simple
|
||||
WorkingDirectory=%h
|
||||
ExecStart=%h/bin/act_runner daemon
|
||||
Restart=on-failure
|
||||
RestartSec=10
|
||||
|
||||
[Install]
|
||||
WantedBy=default.target
|
||||
EOF
|
||||
|
||||
systemctl --user daemon-reload
|
||||
systemctl --user enable act-runner
|
||||
systemctl --user start act-runner
|
||||
|
||||
echo ""
|
||||
echo "=== Done! ==="
|
||||
systemctl --user status act-runner --no-pager | head -8
|
||||
echo ""
|
||||
echo "Check Gitea → Settings → Actions → Runners to verify."
|
||||
Reference in New Issue
Block a user