laoyang
4060c18f86
需求三点： 1. 观影模块「⚙ 设置」与「记一场电影」按钮高度不一致 → 统一页头动作区 四个选择器的 padding/font-size（.btn 与 .btn-sm 混用是根因）；并把设置 下拉推广到观影全部页面（详情/影院/搜索/统计/报告/表单），落在返回按钮旁。 2. 家谱连线「线乱」→ 根因三条：每代各建一个网格（列宽最小值由内容决定， 各代不一致，窄屏实测 93.5px vs 164/78/78/78px）；落点用百分比算而 grid 间距不参与百分比；连线行与卡片行不是同一套列。 改法：整棵树只留一个网格，辈分行/卡片行/连线行全是它的行，连线元素本身 也是网格项（靠 justify-self 落位）；列宽固定为一卡之宽（不用 minmax/1fr， 否则宽屏卡片中心 ≠ 列中心）。 3. 亲属关系接口改白名单（parent/child/spouse）——原先未知 kind 被静默记成 配偶，夹具传 kind=sibling 让家谱断言长期拿错数据自证。 设置下拉抽成可复用片段 _settings_menu.php（$setCurrent 高亮当前页、 $setCanWrite 控「影院管理」显隐），六七个页头不再各抄一份。 验证：e2e 456/0、桌面几何 268/0、移动端几何 504/0、交互 97/0、 家谱连线诊断 0 失败、静态空跑 exit=0、静态断言证伪 13/13、 反向验证 68/68 全抓住。
126 lines
5.3 KiB
PHP
126 lines
5.3 KiB
PHP
<?php
|
||
/**
|
||
* 观影统计仪表板（v11，从 MovieLog stats.php 迁入）。
|
||
*
|
||
* 版式对齐家书的暖纸配色（MovieLog 是深色卡片风 —— 只搬功能、不搬皮肤，
|
||
* 免得进到观影模块里突然变成另一个站点）。
|
||
* 条形图是纯 CSS 宽度百分比，不引任何图表库（线上不依赖 CDN）。
|
||
*/
|
||
$fmtPct = static function (int $v, int $max): float {
|
||
return $max > 0 ? round($v / $max * 100, 2) : 0.0;
|
||
};
|
||
$maxCinema = 1;
|
||
foreach ($byCinema as $r) { $maxCinema = max($maxCinema, (int)$r['cnt']); }
|
||
$maxPerson = 1;
|
||
foreach ($byPerson as $r) { $maxPerson = max($maxPerson, (int)$r['cnt']); }
|
||
$maxMonth = 1;
|
||
foreach ($byMonth as $r) { $maxMonth = max($maxMonth, (int)$r['cnt']); }
|
||
$maxYear = 1;
|
||
foreach ($byYear as $r) { $maxYear = max($maxYear, (int)$r['cnt']); }
|
||
$wd = static function (?string $d): string {
|
||
return ($d !== null && $d !== '') ? date('Y年n月j日', strtotime($d)) : '—';
|
||
};
|
||
?>
|
||
<div class="page-head">
|
||
<h1>观影统计</h1>
|
||
<span class="sub">一家人的观影概览</span>
|
||
<div class="actions">
|
||
<?php $setCurrent = 'stats'; $setCanWrite = \App\Auth::canWrite(); require __DIR__ . '/_settings_menu.php'; ?>
|
||
<a class="btn btn-ghost" href="<?= e(url('movies')) ?>">返回观影</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="stats-grid">
|
||
<div class="stat-card"><div class="number"><?= (int)$ov['movies'] ?></div><div class="label">电影总数</div></div>
|
||
<div class="stat-card"><div class="number"><?= (int)$ov['cinemas'] ?></div><div class="label">影院数</div></div>
|
||
<div class="stat-card"><div class="number"><?= (int)$ov['persons'] ?></div><div class="label">观影人数</div></div>
|
||
<div class="stat-card"><div class="number"><?= (int)$ov['viewership'] ?></div><div class="label">总观影人次</div></div>
|
||
</div>
|
||
|
||
<?php if ($ov['first_date'] !== null && $ov['last_date'] !== null): ?>
|
||
<div class="card card-pad stats-span">
|
||
<span class="label">观影跨度</span>
|
||
<span class="value"><?= e($wd($ov['first_date'])) ?> ～ <?= e($wd($ov['last_date'])) ?></span>
|
||
</div>
|
||
<?php endif; ?>
|
||
|
||
<div class="chart-card">
|
||
<h3>按影院统计 <span class="hint">电影数量</span></h3>
|
||
<?php if ($byCinema): ?>
|
||
<div class="bar-chart">
|
||
<?php foreach ($byCinema as $r): $c = (string)($r['color'] ?: '#888888'); ?>
|
||
<div class="bar-item">
|
||
<span class="bar-label">
|
||
<span class="color-dot" style="background: <?= e($c) ?>"></span>
|
||
<?= e((string)$r['name']) ?><?php if (trim((string)$r['place']) !== ''): ?><span class="bar-sub"><?= e((string)$r['place']) ?></span><?php endif; ?>
|
||
</span>
|
||
<span class="bar-track"><span class="bar-fill" style="width: <?= e((string)$fmtPct((int)$r['cnt'], $maxCinema)) ?>%; background: <?= e($c) ?>"></span></span>
|
||
<span class="bar-count"><?= (int)$r['cnt'] ?></span>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
</div>
|
||
<?php else: ?>
|
||
<p class="empty-hint">还没有影院数据。到「影院管理」加几家影院，记观影时就能选了。</p>
|
||
<?php endif; ?>
|
||
</div>
|
||
|
||
<div class="two-col">
|
||
<div class="chart-card">
|
||
<h3>按观影人统计 <span class="hint">参与场次</span></h3>
|
||
<?php if ($byPerson): ?>
|
||
<div class="bar-chart">
|
||
<?php foreach ($byPerson as $r): ?>
|
||
<div class="bar-item">
|
||
<span class="bar-label">
|
||
<img class="bar-avatar" src="<?= e(avatar_url($r['avatar'] ?? null)) ?>" alt="">
|
||
<?= e((string)$r['name']) ?>
|
||
</span>
|
||
<span class="bar-track"><span class="bar-fill" style="width: <?= e((string)$fmtPct((int)$r['cnt'], $maxPerson)) ?>%"></span></span>
|
||
<span class="bar-count"><?= (int)$r['cnt'] ?></span>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
</div>
|
||
<?php else: ?>
|
||
<p class="empty-hint">还没有观影人数据。</p>
|
||
<?php endif; ?>
|
||
</div>
|
||
|
||
<div class="chart-card">
|
||
<h3>按年统计 <span class="hint">观影数量</span></h3>
|
||
<?php if ($byYear): ?>
|
||
<div class="bar-chart">
|
||
<?php foreach ($byYear as $r): ?>
|
||
<div class="bar-item">
|
||
<span class="bar-label"><?= e((string)$r['y']) ?> 年</span>
|
||
<span class="bar-track"><span class="bar-fill bar-fill-alt" style="width: <?= e((string)$fmtPct((int)$r['cnt'], $maxYear)) ?>%"></span></span>
|
||
<span class="bar-count"><?= (int)$r['cnt'] ?></span>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
</div>
|
||
<?php else: ?>
|
||
<p class="empty-hint">还没有年份数据。</p>
|
||
<?php endif; ?>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="chart-card">
|
||
<h3>月度趋势 <span class="hint">最近 12 个月</span></h3>
|
||
<?php if ($byMonth): ?>
|
||
<div class="bar-chart">
|
||
<?php foreach ($byMonth as $r): ?>
|
||
<div class="bar-item">
|
||
<span class="bar-label"><?= e((string)$r['ym']) ?></span>
|
||
<span class="bar-track"><span class="bar-fill bar-fill-green" style="width: <?= e((string)$fmtPct((int)$r['cnt'], $maxMonth)) ?>%"></span></span>
|
||
<span class="bar-count"><?= (int)$r['cnt'] ?></span>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
</div>
|
||
<?php else: ?>
|
||
<p class="empty-hint">还没有月度数据。</p>
|
||
<?php endif; ?>
|
||
</div>
|
||
|
||
<div class="btn-row">
|
||
<a class="btn btn-ghost" href="<?= e(url('movies/report')) ?>">看年度报告</a>
|
||
<a class="btn btn-ghost" href="<?= e(url('movies/search')) ?>">高级搜索</a>
|
||
</div>
|