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

perf: 收斂活動看板前端事件與圖表載入
All checks were successful
CD Pipeline / deploy (push) Successful in 1m3s
Details

Browse Source
This commit is contained in:
OoO
2026-05-18 09:54:45 +08:00
parent e167ba1497
commit 4e71ed9ecd
4 changed files with 111 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
config.py
View File

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

31
templates/edm_dashboard_v2.html
View File

@@ -38,7 +38,7 @@
<div class="campaign-hero-content">
<div class="campaign-eyebrow">
<span class="campaign-eyebrow-label">CAMPAIGN</span>
<span class="momo-mono" style="font-size:11px;color:var(--momo-text-tertiary);">ID · {{ current_promo_page|upper }}</span>
<span class="campaign-promo-id momo-mono">ID · {{ current_promo_page|upper }}</span>
</div>
<h1 class="campaign-title">{{ page_title }}</h1>
<div class="campaign-meta-grid momo-mono">
@@ -52,20 +52,20 @@
</div>
<div>
<div class="campaign-meta-label">商品總數</div>
<div class="campaign-meta-value" style="font-size:20px;">{{ total_edm_products | number_format }}</div>
<div class="campaign-meta-value campaign-meta-value--total">{{ total_edm_products | number_format }}</div>
</div>
</div>
<div class="campaign-actions">
{% if current_promo_page == 'edm' %}
<button class="campaign-action" type="button" onclick="triggerEdmTask()">
<button class="campaign-action" type="button" data-campaign-task="edm">
<i class="fas fa-rotate"></i> 手動更新
</button>
<button class="campaign-action is-light" type="button" onclick="triggerNotification()">
<button class="campaign-action is-light" type="button" data-campaign-task="notification">
<i class="fas fa-bell"></i> 發送通知
</button>
{% elif current_promo_page == 'festival' %}
<button class="campaign-action" type="button" onclick="triggerFestivalTask()">
<button class="campaign-action" type="button" data-campaign-task="festival">
<i class="fas fa-rotate"></i> 手動更新
</button>
{% endif %}
@@ -85,15 +85,15 @@
</div>
<div class="campaign-kpi">
<div class="campaign-kpi-label">新品</div>
<div class="campaign-kpi-value momo-mono" style="color:var(--momo-info);">{{ current_stats.get('new', 0) | number_format }}</div>
<div class="campaign-kpi-value campaign-kpi-value--info momo-mono">{{ current_stats.get('new', 0) | number_format }}</div>
</div>
<div class="campaign-kpi">
<div class="campaign-kpi-label">漲價</div>
<div class="campaign-kpi-value momo-mono" style="color:var(--momo-danger);">{{ current_stats.get('up', 0) | number_format }}</div>
<div class="campaign-kpi-value campaign-kpi-value--danger momo-mono">{{ current_stats.get('up', 0) | number_format }}</div>
</div>
<div class="campaign-kpi">
<div class="campaign-kpi-label">降價</div>
<div class="campaign-kpi-value momo-mono" style="color:var(--momo-success);">{{ current_stats.get('down', 0) | number_format }}</div>
<div class="campaign-kpi-value campaign-kpi-value--success momo-mono">{{ current_stats.get('down', 0) | number_format }}</div>
</div>
</div>
<div class="campaign-panel-footer momo-mono">
@@ -140,9 +140,9 @@
<div class="tab-pane fade {% if slot == active_tab %}show active{% endif %}" id="slot-{{ slot_id }}" role="tabpanel">
<div class="campaign-table-card">
<div class="campaign-table-head">
<span class="momo-mono" style="font-size:11px;font-weight:800;color:var(--momo-text-tertiary);letter-spacing:.08em;">03</span>
<span class="campaign-section-index momo-mono">03</span>
<strong>商品列表</strong>
<span class="momo-mono" data-campaign-visible-count style="color:var(--momo-text-tertiary);font-size:12px;">
<span class="campaign-visible-count momo-mono" data-campaign-visible-count>
{{ page_window.start_item }}-{{ page_window.end_item }} / {{ page_window.total_items }} 筆
</span>
<div class="campaign-filterbar" aria-label="{{ slot }} 商品狀態篩選">
@@ -200,7 +200,7 @@
{% if item.image_url %}
<img class="campaign-product-thumb" src="{{ item.image_url }}" alt="{{ item.name }}" width="52" height="52" loading="lazy" decoding="async" referrerpolicy="no-referrer">
{% else %}
<div class="campaign-product-thumb d-flex align-items-center justify-content-center" style="color:var(--momo-text-tertiary);font-size:11px;">無圖</div>
<div class="campaign-product-thumb campaign-product-thumb--empty">無圖</div>
{% endif %}
<div>
<a class="campaign-product-name momo-tracked-link" href="{{ item.safe_product_url or '#' }}" target="_blank" rel="noopener noreferrer" data-momo-original-url="{{ item.safe_product_url or '#' }}"
@@ -221,9 +221,9 @@
{% if item.status_change == 'NEW' %}
<span class="campaign-badge">NEW</span>
{% elif item.status_change == 'PRICE_DOWN' %}
<span class="campaign-badge" style="color:var(--momo-success);">降價</span>
<span class="campaign-badge campaign-badge--success">降價</span>
{% elif item.status_change == 'PRICE_UP' %}
<span class="campaign-badge" style="color:var(--momo-danger);">漲價</span>
<span class="campaign-badge campaign-badge--danger">漲價</span>
{% elif item.status_change in ['DELISTED', 'SLOT_END'] %}
<span class="campaign-badge">下架</span>
{% endif %}
@@ -268,7 +268,7 @@
<i class="fas fa-chart-line" aria-hidden="true"></i>
</button>
{% else %}
<span style="color:var(--momo-text-tertiary);">--</span>
<span class="campaign-muted-placeholder">--</span>
{% endif %}
</td>
<td class="text-center momo-mono">
@@ -277,7 +277,7 @@
{% if item.remain_qty is not none %}
<div class="campaign-sales-main">剩 {{ item.remain_qty | number_format }} 組</div>
{% else %}
<div class="campaign-sales-main" style="color:var(--momo-text-tertiary);">--</div>
<div class="campaign-sales-main campaign-sales-main--muted">--</div>
{% endif %}
<div class="campaign-sales-sub">已售 {{ item.total_sold | default(0) | number_format }} 組</div>
{% if item.qty_history and item.qty_history|length > 1 %}
@@ -365,5 +365,6 @@
{% endblock %}
{% block extra_js %}
<script src="{{ url_for('static', filename='js/analysis-chart-theme.js') }}"></script>
<script src="{{ url_for('static', filename='js/page-edm-v2.js') }}"></script>
{% endblock %}

54
web/static/css/page-edm-v2.css
View File

@@ -146,6 +146,11 @@
text-transform: uppercase;
}
.campaign-promo-id {
color: var(--momo-text-tertiary);
font-size: 11px;
}
.campaign-title {
margin: 0;
color: var(--momo-text-primary);
@@ -177,6 +182,10 @@
font-weight: 800;
}
.campaign-meta-value--total {
font-size: 20px;
}
.campaign-actions {
display: flex;
gap: 8px;
@@ -265,6 +274,18 @@
line-height: 1;
}
.campaign-kpi-value--info {
color: var(--momo-info);
}
.campaign-kpi-value--danger {
color: var(--momo-danger);
}
.campaign-kpi-value--success {
color: var(--momo-success);
}
.campaign-panel-footer {
display: flex;
align-items: center;
@@ -359,6 +380,18 @@
flex-wrap: wrap;
}
.campaign-section-index {
color: var(--momo-text-tertiary);
font-size: 11px;
font-weight: 800;
letter-spacing: 0.08em;
}
.campaign-visible-count {
color: var(--momo-text-tertiary);
font-size: 12px;
}
.campaign-stat-badges {
display: flex;
gap: 6px;
@@ -377,6 +410,14 @@
font-weight: 800;
}
.campaign-badge--success {
color: var(--momo-success);
}
.campaign-badge--danger {
color: var(--momo-danger);
}
.campaign-filterbar {
display: inline-flex;
padding: 2px;
@@ -493,6 +534,14 @@
border-radius: 6px;
}
.campaign-product-thumb--empty {
display: flex;
align-items: center;
justify-content: center;
color: var(--momo-text-tertiary);
font-size: 11px;
}
.campaign-product-name {
display: -webkit-box;
overflow: hidden;
@@ -612,6 +661,11 @@
font-weight: 900;
}
.campaign-sales-main--muted,
.campaign-muted-placeholder {
color: var(--momo-text-tertiary);
}
.campaign-sales-sub,
.campaign-track-line {
color: var(--momo-text-tertiary);

75
web/static/js/page-edm-v2.js
View File

@@ -60,17 +60,27 @@ let campaignPriceChartInstance = null;
}
function ensureCampaignChart() {
if (window.EwoooCChartTheme && window.EwoooCChartTheme.loadChartJs) {
return window.EwoooCChartTheme.loadChartJs();
}
if (typeof Chart !== 'undefined') {
return Promise.resolve();
return Promise.resolve(window.Chart);
}
if (campaignChartLoader) {
return campaignChartLoader;
}
campaignChartLoader = new Promise((resolve, reject) => {
const existing = document.querySelector('script[data-chartjs-loader="campaign"]');
if (existing) {
existing.addEventListener('load', () => resolve(window.Chart), { once: true });
existing.addEventListener('error', () => reject(new Error('Chart.js 載入失敗')), { once: true });
return;
}
const script = document.createElement('script');
script.src = 'https://cdn.jsdelivr.net/npm/chart.js';
script.src = 'https://cdn.jsdelivr.net/npm/chart.js@4.4.1/dist/chart.umd.min.js';
script.async = true;
script.onload = resolve;
script.dataset.chartjsLoader = 'campaign';
script.onload = () => resolve(window.Chart);
script.onerror = () => reject(new Error('Chart.js 載入失敗'));
document.head.appendChild(script);
});
@@ -257,41 +267,36 @@ let campaignPriceChartInstance = null;
});
});
function triggerEdmTask() {
if (confirm('確定要手動執行 EDM 爬蟲嗎？')) {
fetch('/api/run_edm_task', {
method: 'POST',
headers: { 'X-CSRFToken': getCSRFToken() }
})
.then(response => response.json())
.then(data => alert(data.message))
.catch(error => alert('錯誤: ' + error));
const campaignTaskMap = {
edm: {
confirmText: '確定要手動執行 EDM 爬蟲嗎？',
url: '/api/run_edm_task'
},
festival: {
confirmText: '確定要手動執行節慶活動爬蟲嗎？',
url: '/api/run_festival_task'
},
notification: {
confirmText: '確定要發送 EDM 活動通知嗎？',
url: '/api/trigger_edm_notification'
}
};
function runCampaignTask(taskName) {
const task = campaignTaskMap[taskName];
if (!task || !confirm(task.confirmText)) return;
fetch(task.url, {
method: 'POST',
headers: { 'X-CSRFToken': getCSRFToken() }
})
.then(response => response.json())
.then(data => alert(data.message))
.catch(error => alert('錯誤: ' + error));
}
function triggerFestivalTask() {
if (confirm('確定要手動執行節慶活動爬蟲嗎？')) {
fetch('/api/run_festival_task', {
method: 'POST',
headers: { 'X-CSRFToken': getCSRFToken() }
})
.then(response => response.json())
.then(data => alert(data.message))
.catch(error => alert('錯誤: ' + error));
}
}
function triggerNotification() {
if (confirm('確定要發送 EDM 活動通知嗎？')) {
fetch('/api/trigger_edm_notification', {
method: 'POST',
headers: { 'X-CSRFToken': getCSRFToken() }
})
.then(response => response.json())
.then(data => alert(data.message))
.catch(error => alert('錯誤: ' + error));
}
}
document.querySelectorAll('[data-campaign-task]').forEach(button => {
button.addEventListener('click', () => runCampaignTask(button.dataset.campaignTask));
});
function trackMomoLinkClick(event) {
const link = event.target.closest('.momo-tracked-link');