wooo/ewoooc
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat(frontend): 新增廠商缺貨 V2 feature flag

Browse Source
This commit is contained in:
OoO
2026-05-01 00:06:46 +08:00
parent 6c73c57a91
commit c9247f7a79
7 changed files with 276 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
CONSTITUTION.md
View File

@@ -2,8 +2,8 @@
> 本文件定義專案開發的核心準則與不可違反的規範
> **建立日期**: 2026-01-12
> **當前版本**: V10.36 (EDM dashboard v2 feature flag)
> **最後更新**: 2026-04-30
> **當前版本**: V10.37 (Vendor stockout v2 feature flag)
> **最後更新**: 2026-05-01
---

2
app.py
View File

@@ -95,7 +95,7 @@ except Exception as e:
sys_log.error(f"無法檢測磁碟空間: {e}")
# 🚩 系統版本定義 (備份與顯示用)
# 🚩 2026-04-30 V10.37: Vendor stockout v2 feature flag
# 🚩 2026-05-01 V10.37: Vendor stockout v2 feature flag
SYSTEM_VERSION = "V10.37"
# ==========================================

2
config.py
View File

@@ -254,7 +254,7 @@ YOUTUBE_API_KEY = os.getenv('YOUTUBE_API_KEY', '')
# ==========================================
# 系統版本與路徑
# ==========================================
SYSTEM_VERSION = "V10.36"
SYSTEM_VERSION = "V10.37"
LOG_FILE_PATH = os.path.join(BASE_DIR, 'logs/system.log')
public_url = PUBLIC_URL # 用於模板顯示

3
docs/memory/history_logs.md
View File

@@ -60,6 +60,9 @@
- **Frontend V2 static mount**: `momo-app` 補 `./web/static:/app/web/static:ro`，確保 Flask `url_for('static', filename='css/ewoooc-*.css')` 會從實際 `STATIC_DIR=/app/web/static` 讀到 V2 CSS；保留 `./static:/app/static:ro` 供 local-dev Nginx/舊資產相容。
- **EDM Dashboard V2 feature flag**: 五個活動看板入口預設仍走既有 `edm_dashboard.html`，加上 `?ui=v2` 才渲染 `edm_dashboard_v2.html`；新版頁沿用既有活動真實 `grouped_items/slot_stats/scheduler_stats`。
### 2026-05-01：Frontend V2 營運頁推進
- **Vendor Stockout V2 feature flag**: `/vendor-stockout` 預設仍走既有頁；`/vendor-stockout?ui=v2` 才渲染 `vendor_stockout_index_v2.html`，統計來自正式 `VendorStockout/VendorList/VendorEmail/EmailSendLog` 查詢，不建立假資料。
### 2026-04-28~29：Phase 3e 重構大戰 + daily_sales cache 隱形 bug 根除
- **app.py 縮減 -10.8%**: 7,386 → 6,590 行，11 commits 全綠零 502。
- **抽 Blueprint**: `/api/categories` → `category_routes.py` (8fce73b)；`/api/test_url` + `/brand_assets` → `misc_routes.py` (e676840)。

15
routes/vendor_routes.py
View File

@@ -43,16 +43,16 @@ def _get_vendor_dashboard_stats():
total_stockouts = session.query(VendorStockout).count()
pending_stockouts = session.query(VendorStockout).filter(or_(
VendorStockout.status == 'pending',
VendorStockout.status == None
VendorStockout.status.is_(None)
)).count()
sent_stockouts = session.query(VendorStockout).filter(VendorStockout.status == 'sent').count()
failed_stockouts = session.query(VendorStockout).filter(VendorStockout.status == 'failed').count()
duplicate_stockouts = session.query(VendorStockout).filter(VendorStockout.is_duplicate == True).count()
duplicate_stockouts = session.query(VendorStockout).filter(VendorStockout.is_duplicate.is_(True)).count()
distinct_vendor_count = session.query(VendorStockout.vendor_code).distinct().count()
active_vendors = session.query(VendorList).filter(VendorList.is_active == True).count()
inactive_vendors = session.query(VendorList).filter(VendorList.is_active == False).count()
active_emails = session.query(VendorEmail).filter(VendorEmail.is_active == True).count()
active_vendors = session.query(VendorList).filter(VendorList.is_active.is_(True)).count()
inactive_vendors = session.query(VendorList).filter(VendorList.is_active.is_(False)).count()
active_emails = session.query(VendorEmail).filter(VendorEmail.is_active.is_(True)).count()
email_total = session.query(EmailSendLog).count()
email_success = session.query(EmailSendLog).filter(EmailSendLog.status == 'sent').count()
@@ -62,11 +62,12 @@ def _get_vendor_dashboard_stats():
latest_import = session.query(VendorStockout).order_by(desc(VendorStockout.created_at)).first()
latest_email = session.query(EmailSendLog).order_by(desc(EmailSendLog.created_at)).first()
latest_batch_time = func.max(VendorStockout.created_at).label('latest_date')
latest_batch = session.query(
VendorStockout.batch_id,
func.count(VendorStockout.id).label('record_count'),
func.max(VendorStockout.created_at).label('latest_date')
).group_by(VendorStockout.batch_id).order_by(desc('latest_date')).first()
latest_batch_time
).group_by(VendorStockout.batch_id).order_by(desc(latest_batch_time)).first()
return {
'total_stockouts': total_stockouts,

15
tests/test_frontend_v2_assets.py
View File

@@ -63,3 +63,18 @@ def test_edm_dashboard_v2_is_feature_flagged_and_uses_real_campaign_data():
assert "scheduler_stats.get(task_key, [])" in template
assert "mock" not in template.lower()
assert "假商品" not in template
def test_vendor_stockout_v2_is_feature_flagged_and_uses_real_vendor_data():
route_source = (ROOT / "routes/vendor_routes.py").read_text(encoding="utf-8")
template = (ROOT / "web/templates/vendor_stockout_index_v2.html").read_text(encoding="utf-8")
assert "request.args.get('ui') == 'v2'" in route_source
assert "vendor_stockout_index_v2.html" in route_source
assert "_get_vendor_dashboard_stats()" in route_source
assert "session.query(VendorStockout).count()" in route_source
assert "EmailSendLog" in route_source
assert "stats.get('pending_stockouts'" in template
assert "stats.get('email_success_rate'" in template
assert "mock" not in template.lower()
assert "假" not in template

246
web/templates/vendor_stockout_index_v2.html Normal file
View File

@@ -0,0 +1,246 @@
{% extends 'ewoooc_base.html' %}
{% block title %}EwoooC 廠商缺貨{% endblock %}
{% block extra_css %}
<style>
.vendor-v2-stack { display: grid; gap: 24px; }
.vendor-hero { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, 0.9fr); gap: 12px; }
.vendor-hero-main, .vendor-panel, .vendor-action-card {
background: var(--momo-bg-surface);
border: 1px solid var(--momo-border-light);
border-radius: 8px;
}
.vendor-hero-main {
position: relative;
min-height: 260px;
overflow: hidden;
padding: 28px;
color: var(--momo-text-inverse);
background: var(--momo-ink-strong);
}
.vendor-hero-main::before {
position: absolute;
inset: 0;
content: "";
background-image: radial-gradient(circle, rgba(201, 100, 66, 0.14) 1px, transparent 1px);
background-size: 9px 9px;
}
.vendor-hero-main > * { position: relative; }
.vendor-eyebrow, .vendor-section-label { display: flex; align-items: baseline; gap: 10px; }
.vendor-eyebrow { margin-bottom: 20px; }
.vendor-eyebrow span:first-child {
padding: 3px 10px;
border: 1px solid rgba(250, 247, 240, 0.24);
border-radius: var(--momo-radius-pill);
color: rgba(250, 247, 240, 0.76);
font-size: 10px;
font-weight: 800;
letter-spacing: 0.10em;
}
.vendor-title {
max-width: 720px;
margin: 0 0 18px;
color: var(--momo-text-inverse);
font-size: clamp(34px, 5vw, 58px);
font-weight: 800;
letter-spacing: -0.05em;
line-height: 0.95;
}
.vendor-subtitle {
max-width: 680px;
margin: 0;
color: rgba(250, 247, 240, 0.68);
font-size: 14px;
line-height: 1.7;
}
.vendor-hero-actions { display: flex; gap: 10px; margin-top: 26px; flex-wrap: wrap; }
.vendor-button {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
min-height: 36px;
padding: 8px 14px;
color: var(--momo-text-primary);
background: var(--momo-bg-surface);
border: 1px solid var(--momo-border);
border-radius: 4px;
font-size: 13px;
font-weight: 800;
text-decoration: none;
transition: var(--momo-transition-base);
}
.vendor-button:hover { color: var(--momo-text-primary); background: var(--momo-bg-paper); }
.vendor-button.is-inverse { color: var(--momo-ink); background: var(--momo-text-inverse); border-color: var(--momo-text-inverse); }
.vendor-button.is-ghost { color: var(--momo-text-inverse); background: rgba(250, 247, 240, 0.10); border-color: rgba(250, 247, 240, 0.24); }
.vendor-kpi-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 0; overflow: hidden; }
.vendor-kpi { min-height: 130px; padding: 20px; border-right: 1px solid var(--momo-border-light); border-bottom: 1px solid var(--momo-border-light); }
.vendor-kpi:nth-child(2n) { border-right: 0; }
.vendor-kpi:nth-last-child(-n + 2) { border-bottom: 0; }
.vendor-kpi-label {
margin-bottom: 8px;
color: var(--momo-text-tertiary);
font-size: 10px;
font-weight: 800;
letter-spacing: 0.10em;
text-transform: uppercase;
}
.vendor-kpi-value { margin-bottom: 8px; color: var(--momo-text-primary); font-size: 36px; font-weight: 800; letter-spacing: -0.04em; line-height: 1; }
.vendor-kpi-sub, .vendor-action-desc, .vendor-panel-meta { color: var(--momo-text-secondary); font-size: 12px; line-height: 1.6; }
.vendor-section-label { margin-bottom: 12px; }
.vendor-section-label .num { color: var(--momo-text-tertiary); font-size: 11px; font-weight: 800; letter-spacing: 0.08em; }
.vendor-section-label .title, .vendor-action-title, .vendor-panel-title { color: var(--momo-text-primary); font-size: 15px; font-weight: 800; }
.vendor-section-label .title { font-size: 13px; }
.vendor-action-grid, .vendor-signal-grid { display: grid; gap: 12px; }
.vendor-action-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.vendor-signal-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vendor-action-card, .vendor-panel { padding: 18px; }
.vendor-action-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 38px;
height: 38px;
margin-bottom: 16px;
color: var(--momo-text-inverse);
background: var(--momo-ink);
border-radius: 6px;
}
.vendor-action-title, .vendor-panel-title { margin-bottom: 8px; }
.vendor-action-card .vendor-button { width: 100%; margin-top: 16px; }
.vendor-status-row { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--momo-border-light); }
.vendor-status-row:last-child { border-bottom: 0; }
.vendor-status-label { color: var(--momo-text-secondary); font-size: 12px; }
.vendor-status-value { color: var(--momo-text-primary); font-size: 12px; font-weight: 800; text-align: right; }
@media (max-width: 1100px) {
.vendor-hero, .vendor-signal-grid { grid-template-columns: 1fr; }
.vendor-action-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
.vendor-action-grid, .vendor-kpi-panel { grid-template-columns: 1fr; }
.vendor-kpi, .vendor-kpi:nth-child(2n) { border-right: 0; border-bottom: 1px solid var(--momo-border-light); }
.vendor-kpi:last-child { border-bottom: 0; }
}
</style>
{% endblock %}
{% block ewooo_content %}
{% set stats = stats or {} %}
<div class="vendor-v2-stack">
<section class="vendor-hero">
<div class="vendor-hero-main">
<div class="vendor-eyebrow momo-mono">
<span>OPERATIONS</span>
<span>Vendor Stockout Control</span>
</div>
<h1 class="vendor-title">廠商缺貨通知自動化系統</h1>
<p class="vendor-subtitle">
串接正式缺貨匯入、廠商郵件與發送紀錄資料，集中追蹤待處理缺貨、通知成功率、廠商聯絡覆蓋與最近批次狀態。
</p>
<div class="vendor-hero-actions">
<a class="vendor-button is-inverse" href="/vendor-stockout/list"><i class="fas fa-list-ul"></i> 查看缺貨清單</a>
<a class="vendor-button is-ghost" href="/vendor-stockout/vendor-management"><i class="fas fa-building"></i> 管理廠商</a>
</div>
</div>
<aside class="vendor-kpi-panel vendor-panel">
<div class="vendor-kpi">
<div class="vendor-kpi-label momo-mono">待處理缺貨</div>
<div class="vendor-kpi-value momo-mono">{{ stats.get('pending_stockouts', 0) | number_format }}</div>
<div class="vendor-kpi-sub momo-mono">總缺貨 {{ stats.get('total_stockouts', 0) | number_format }}</div>
</div>
<div class="vendor-kpi">
<div class="vendor-kpi-label momo-mono">已發送</div>
<div class="vendor-kpi-value momo-mono" style="color:var(--momo-success);">{{ stats.get('sent_stockouts', 0) | number_format }}</div>
<div class="vendor-kpi-sub momo-mono">失敗 {{ stats.get('failed_stockouts', 0) | number_format }}</div>
</div>
<div class="vendor-kpi">
<div class="vendor-kpi-label momo-mono">活躍廠商</div>
<div class="vendor-kpi-value momo-mono">{{ stats.get('active_vendors', 0) | number_format }}</div>
<div class="vendor-kpi-sub momo-mono">停用 {{ stats.get('inactive_vendors', 0) | number_format }}</div>
</div>
<div class="vendor-kpi">
<div class="vendor-kpi-label momo-mono">郵件成功率</div>
<div class="vendor-kpi-value momo-mono" style="color:var(--momo-accent);">{{ stats.get('email_success_rate', 0) }}%</div>
<div class="vendor-kpi-sub momo-mono">寄送紀錄 {{ stats.get('email_total', 0) | number_format }}</div>
</div>
</aside>
</section>
<section>
<div class="vendor-section-label">
<span class="num momo-mono">02</span>
<span class="title">功能入口</span>
</div>
<div class="vendor-action-grid">
<article class="vendor-action-card">
<div class="vendor-action-icon"><i class="fas fa-file-import"></i></div>
<div class="vendor-action-title">匯入缺貨資料</div>
<div class="vendor-action-desc">使用正式 Excel 匯入流程，建立批次缺貨紀錄並標記重複資料。</div>
<a class="vendor-button" href="/vendor-stockout/import">前往匯入</a>
</article>
<article class="vendor-action-card">
<div class="vendor-action-icon"><i class="fas fa-table-list"></i></div>
<div class="vendor-action-title">缺貨清單</div>
<div class="vendor-action-desc">篩選、編輯、批次發信與追蹤缺貨商品處理狀態。</div>
<a class="vendor-button" href="/vendor-stockout/list">查看清單</a>
</article>
<article class="vendor-action-card">
<div class="vendor-action-icon"><i class="fas fa-address-book"></i></div>
<div class="vendor-action-title">廠商管理</div>
<div class="vendor-action-desc">維護廠商主檔與多組收件、CC、BCC 郵件地址。</div>
<a class="vendor-button" href="/vendor-stockout/vendor-management">管理廠商</a>
</article>
<article class="vendor-action-card">
<div class="vendor-action-icon"><i class="fas fa-clock-rotate-left"></i></div>
<div class="vendor-action-title">發送歷史</div>
<div class="vendor-action-desc">檢查成功、失敗、待發送郵件紀錄與錯誤訊息。</div>
<a class="vendor-button" href="/vendor-stockout/history">查看歷史</a>
</article>
</div>
</section>
<section>
<div class="vendor-section-label">
<span class="num momo-mono">03</span>
<span class="title">真實資料訊號</span>
</div>
<div class="vendor-signal-grid">
<article class="vendor-panel">
<div class="vendor-panel-title">最近匯入</div>
<div class="vendor-panel-meta">
{% if stats.get('latest_import_time') %}
<div class="vendor-status-row"><span class="vendor-status-label">時間</span><span class="vendor-status-value momo-mono">{{ stats.get('latest_import_time').strftime('%Y-%m-%d %H:%M') }}</span></div>
<div class="vendor-status-row"><span class="vendor-status-label">廠商</span><span class="vendor-status-value">{{ stats.get('latest_import_vendor') or '未提供' }}</span></div>
<div class="vendor-status-row"><span class="vendor-status-label">商品</span><span class="vendor-status-value">{{ stats.get('latest_import_product') or '未提供' }}</span></div>
{% else %}
尚未讀到缺貨匯入紀錄。
{% endif %}
</div>
</article>
<article class="vendor-panel">
<div class="vendor-panel-title">最近批次</div>
<div class="vendor-panel-meta">
{% if stats.get('latest_batch_id') %}
<div class="vendor-status-row"><span class="vendor-status-label">批次</span><span class="vendor-status-value momo-mono">{{ stats.get('latest_batch_id') }}</span></div>
<div class="vendor-status-row"><span class="vendor-status-label">筆數</span><span class="vendor-status-value momo-mono">{{ stats.get('latest_batch_count', 0) | number_format }}</span></div>
<div class="vendor-status-row"><span class="vendor-status-label">時間</span><span class="vendor-status-value momo-mono">{{ stats.get('latest_batch_time').strftime('%Y-%m-%d %H:%M') if stats.get('latest_batch_time') else '--' }}</span></div>
{% else %}
尚未讀到批次資訊。
{% endif %}
</div>
</article>
<article class="vendor-panel">
<div class="vendor-panel-title">郵件狀態</div>
<div class="vendor-panel-meta">
<div class="vendor-status-row"><span class="vendor-status-label">成功</span><span class="vendor-status-value momo-mono">{{ stats.get('email_success', 0) | number_format }}</span></div>
<div class="vendor-status-row"><span class="vendor-status-label">失敗</span><span class="vendor-status-value momo-mono">{{ stats.get('email_failed', 0) | number_format }}</span></div>
<div class="vendor-status-row"><span class="vendor-status-label">待發送</span><span class="vendor-status-value momo-mono">{{ stats.get('email_pending', 0) | number_format }}</span></div>
<div class="vendor-status-row"><span class="vendor-status-label">活躍 Email</span><span class="vendor-status-value momo-mono">{{ stats.get('active_emails', 0) | number_format }}</span></div>
</div>
</article>
</div>
</section>
</div>
{% endblock %}