CMO report 2026-02-13
This commit is contained in:
Rodribm10
parent
4891a3f3c4
commit
4d79444f53
225
reports/2026-02-13.html
Normal file
225
reports/2026-02-13.html
Normal file
@ -0,0 +1,225 @@
|
||||
<!doctype html>
|
||||
<html lang="pt-BR">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>CMO Dashboard — 2026-02-13</title>
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.1/dist/chart.umd.min.js"></script>
|
||||
<style>
|
||||
body{margin:0;background:#050914;color:#e5e7eb;font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial}
|
||||
.wrap{max-width:1100px;margin:0 auto;padding:18px}
|
||||
h1{font-size:18px;margin:0}
|
||||
.muted{opacity:.75}
|
||||
.grid{display:grid;gap:12px}
|
||||
.grid4{grid-template-columns:repeat(4,minmax(0,1fr))}
|
||||
.grid1{grid-template-columns:1fr}
|
||||
@media (max-width:900px){.grid4{grid-template-columns:repeat(2,minmax(0,1fr))}}
|
||||
@media (max-width:520px){.grid4{grid-template-columns:1fr}}
|
||||
.card{background:#0b1220;border:1px solid #1f2a44;border-radius:16px;padding:14px}
|
||||
table{width:100%;border-collapse:collapse}
|
||||
th,td{padding:10px;border-bottom:1px solid #1f2a44;text-align:left;font-size:13px}
|
||||
th{opacity:.8;font-weight:600}
|
||||
.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;border:1px solid #1f2a44;background:#0f1a33}
|
||||
.alert{padding:10px;border-radius:12px;margin:8px 0;border:1px solid #2a3658}
|
||||
.high{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.35)}
|
||||
.med{background:rgba(234,179,8,.10);border-color:rgba(234,179,8,.30)}
|
||||
.low{background:rgba(59,130,246,.10);border-color:rgba(59,130,246,.28)}
|
||||
a{color:#93c5fd}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrap">
|
||||
<div style="display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap">
|
||||
<div>
|
||||
<h1>CMO Dashboard — Hotéis 1001 Noites</h1>
|
||||
<div class="muted">Data: <b>2026-02-13</b> · Atualizado: 2026-02-14T14:28:06.751Z</div>
|
||||
</div>
|
||||
<div class="badge">Gerado automaticamente pelo Agente CMO</div>
|
||||
</div>
|
||||
|
||||
<div style="height:14px"></div>
|
||||
|
||||
<div class="grid grid4">
|
||||
|
||||
<div style="background:#0b1220;border:1px solid #1f2a44;border-radius:16px;padding:14px">
|
||||
<div style="opacity:.8;font-size:12px">Spend total do dia</div>
|
||||
<div style="font-size:22px;margin-top:6px">R$ 0.00</div>
|
||||
<div style="margin-top:6px;color:#22c55e;font-weight:600">↑ 0.0% vs dia anterior</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div style="background:#0b1220;border:1px solid #1f2a44;border-radius:16px;padding:14px">
|
||||
<div style="opacity:.8;font-size:12px">Conversões</div>
|
||||
<div style="font-size:22px;margin-top:6px">0</div>
|
||||
<div style="margin-top:6px;color:#22c55e;font-weight:600">↑ 0.0% vs dia anterior</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div style="background:#0b1220;border:1px solid #1f2a44;border-radius:16px;padding:14px">
|
||||
<div style="opacity:.8;font-size:12px">CPA médio</div>
|
||||
<div style="font-size:22px;margin-top:6px">R$ 0.00</div>
|
||||
<div style="margin-top:6px;color:#22c55e;font-weight:600">↑ 0.0% vs dia anterior</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div style="background:#0b1220;border:1px solid #1f2a44;border-radius:16px;padding:14px">
|
||||
<div style="opacity:.8;font-size:12px">CTR médio</div>
|
||||
<div style="font-size:22px;margin-top:6px">0.00%</div>
|
||||
<div style="margin-top:6px;color:#22c55e;font-weight:600">↑ 0.0% vs dia anterior</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div style="height:14px"></div>
|
||||
|
||||
<div class="card">
|
||||
<div style="display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap">
|
||||
<div><b>Alertas</b> <span class="muted">(0)</span></div>
|
||||
</div>
|
||||
<div style="margin-top:8px">
|
||||
<div class="muted">Nenhum alerta.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="height:14px"></div>
|
||||
|
||||
<div class="grid grid1">
|
||||
|
||||
<div class="card">
|
||||
<div style="display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap">
|
||||
<div><b>CA01 DF</b> <span class="muted">(act_676569760488007)</span></div>
|
||||
<div class="badge">Spend: R$ 0.00 · Conv: 0 · CTR: 0.00% · CPA: R$ 0.00</div>
|
||||
</div>
|
||||
|
||||
<div style="height:10px"></div>
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Campanha</th>
|
||||
<th>Adset</th>
|
||||
<th>Spend</th>
|
||||
<th>Imp</th>
|
||||
<th>Clicks</th>
|
||||
<th>CTR</th>
|
||||
<th>Conv</th>
|
||||
<th>CPA</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div style="display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap">
|
||||
<div><b>Hotel Prime</b> <span class="muted">(act_2116534078538656)</span></div>
|
||||
<div class="badge">Spend: R$ 0.00 · Conv: 0 · CTR: 0.00% · CPA: R$ 0.00</div>
|
||||
</div>
|
||||
|
||||
<div style="height:10px"></div>
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Campanha</th>
|
||||
<th>Adset</th>
|
||||
<th>Spend</th>
|
||||
<th>Imp</th>
|
||||
<th>Clicks</th>
|
||||
<th>CTR</th>
|
||||
<th>Conv</th>
|
||||
<th>CPA</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div style="display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap">
|
||||
<div><b>CA02 LVM</b> <span class="muted">(act_245760618304957)</span></div>
|
||||
<div class="badge">Spend: R$ 0.00 · Conv: 0 · CTR: 0.00% · CPA: R$ 0.00</div>
|
||||
</div>
|
||||
|
||||
<div style="height:10px"></div>
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Campanha</th>
|
||||
<th>Adset</th>
|
||||
<th>Spend</th>
|
||||
<th>Imp</th>
|
||||
<th>Clicks</th>
|
||||
<th>CTR</th>
|
||||
<th>Conv</th>
|
||||
<th>CPA</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div style="height:14px"></div>
|
||||
|
||||
<div class="card">
|
||||
<b>Tendência (últimos 7 dias)</b>
|
||||
<div class="muted" style="margin-top:6px">Spend diário por conta + conversões.</div>
|
||||
<div style="height:10px"></div>
|
||||
<canvas id="trend" height="120"></canvas>
|
||||
</div>
|
||||
|
||||
<div style="height:14px"></div>
|
||||
|
||||
<div class="muted" style="font-size:12px">
|
||||
Dados embutidos no HTML (offline). <a href="../index.html">Ver histórico</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const DATA = {"reportDate":"2026-02-13","updatedAtISO":"2026-02-14T14:28:06.751Z","accounts":[{"id":"act_676569760488007","name":"CA01 DF","spend":0,"conversions":0,"clicks":0,"ctrAvg":0,"cpaAvg":0},{"id":"act_2116534078538656","name":"Hotel Prime","spend":0,"conversions":0,"clicks":0,"ctrAvg":0,"cpaAvg":0},{"id":"act_245760618304957","name":"CA02 LVM","spend":0,"conversions":0,"clicks":0,"ctrAvg":0,"cpaAvg":0}],"topRows":[],"alerts":[],"trend7d":[{"date":"2026-02-07","byAccount":{}},{"date":"2026-02-08","byAccount":{}},{"date":"2026-02-09","byAccount":{}},{"date":"2026-02-10","byAccount":{}},{"date":"2026-02-11","byAccount":{}},{"date":"2026-02-12","byAccount":{}},{"date":"2026-02-13","byAccount":{}},{"date":"2026-02-13","byAccount":{}}],"totals":{"spend":0,"conversions":0,"ctr":0,"cpa":0},"deltas":{"spendPct":0,"convPct":0,"ctrPct":0,"cpaPct":0}};
|
||||
const labels = DATA.trend7d.map(d => d.date);
|
||||
const accounts = DATA.accounts.map(a => a.id);
|
||||
|
||||
const spendDatasets = accounts.map((id, idx) => ({
|
||||
label: DATA.accounts.find(a => a.id===id)?.name + " — Spend",
|
||||
data: DATA.trend7d.map(d => (d.byAccount[id]?.spend ?? 0)),
|
||||
tension: 0.2,
|
||||
borderWidth: 2,
|
||||
yAxisID: "y"
|
||||
}));
|
||||
|
||||
const convDatasets = accounts.map((id, idx) => ({
|
||||
label: DATA.accounts.find(a => a.id===id)?.name + " — Conv",
|
||||
data: DATA.trend7d.map(d => (d.byAccount[id]?.conversions ?? 0)),
|
||||
tension: 0.2,
|
||||
borderWidth: 2,
|
||||
borderDash: [6,4],
|
||||
yAxisID: "y1"
|
||||
}));
|
||||
|
||||
const ctx = document.getElementById("trend");
|
||||
new Chart(ctx, {
|
||||
type: "line",
|
||||
data: { labels, datasets: [...spendDatasets, ...convDatasets] },
|
||||
options: {
|
||||
responsive: true,
|
||||
plugins: { legend: { labels: { color: "#cbd5e1" } } },
|
||||
scales: {
|
||||
x: { ticks: { color: "#94a3b8" }, grid: { color: "rgba(148,163,184,.15)" } },
|
||||
y: { ticks: { color: "#94a3b8" }, grid: { color: "rgba(148,163,184,.15)" }, title:{display:true,text:"Spend",color:"#94a3b8"} },
|
||||
y1: { position:"right", ticks: { color: "#94a3b8" }, grid: { drawOnChartArea: false }, title:{display:true,text:"Conv",color:"#94a3b8"} }
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue
Block a user