① 上传图片一律可裁剪,比例由图位决定
新增 app/ImageSlot.php 统一配置(头像 1:1/512×512;题图 16:9 只留注释,
将来启用只加一行)。前端只挑区域、写回归一化矩形 "x,y,w,h",真正裁剪在服务端
Upload::fitRegion():夹回图内 → 在框内居中收缩到目标比例(不外扩)→ 钉住 sx+sw ≤ w。
比例解析单独写 parseRatioAttr():parseFloat('16:9') 得 16,会把题图裁成细长条且不报错。
② 名册按关系分组,顺序每人可自定
分类全家共用(person_groups,另一个人可以自己加分类);「自己的」只体现在顺序上
(user_settings.group_order,每人一份)。persons.group_id 故意不加外键(老库只能
ADD COLUMN),完整性由 PersonGroup 保证:删分类把人置回未分类,人不会从名册消失。
③ 设置分两级:系统设置 / 个人设置
个人设置拆成 templates/settings/me.php + _profile.php + _nicknames.php,
取代 templates/people/me.php(旧路由与旧表单仍兼容)。
④ 右上角「姓名/头像 + 下拉菜单」
原来是两个裸链接,窄屏会被 CSS 藏掉导致改密码/退出不可达;改成 <details> 零 JS 菜单
(app.js 只补「点外面 / Esc」)。菜单项:个人设置 / 系统设置(管理员)/ 修改密码 / 退出登录。
Schema 版本 3 → 4;安装与老库升级共用 PersonGroup::backfillMissing() 一条回填路径。
验证:php -l 全量;e2e 202/0(新增「关系分组」与「图片裁剪」两节);老库升级 49/0;
桌面几何 108/0;移动端几何 192/0(360/375/390/414);交互 76/0;
反向验证 31/31(逐条把修复改回旧写法,指定的目标断言必须变红);
部署后本地↔线上 72 个文件 sha256 逐字节一致。
85 lines
3.3 KiB
PHP
85 lines
3.3 KiB
PHP
<?php
|
||
$navItems = [
|
||
'home' => ['首页', 'home'],
|
||
'kin' => ['家谱', 'kin'],
|
||
'people' => ['名册', 'people'],
|
||
];
|
||
if (\App\Auth::isAdmin()) {
|
||
$navItems['settings'] = ['设置', 'settings'];
|
||
}
|
||
// ⚠️ 变量名不要叫 $me:layout 是在 extract($data) **之后**被 require 的,
|
||
// 这里再赋值会把页面传进来的 $me(当前登录者的完整记录)覆盖掉。
|
||
// home.php 用 $me 画「补充亲属关系」链接,被覆盖成 true 之后
|
||
// 链接就变成 people/show&id=0,还顺带在页首打出一条 Warning。
|
||
// 改名前请先确认所有模板都没有依赖这个布尔值。
|
||
$isLoggedIn = \App\Auth::check();
|
||
?>
|
||
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title><?= e($pageTitle) ?> · 家书</title>
|
||
<link rel="icon" href="/favicon.ico">
|
||
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
|
||
<link rel="manifest" href="/site.webmanifest">
|
||
<meta name="theme-color" content="#A84A28">
|
||
<link rel="stylesheet" href="<?= e(asset('/assets/css/app.css')) ?>">
|
||
</head>
|
||
<body>
|
||
|
||
<?php if ($isLoggedIn): ?>
|
||
<header class="topbar">
|
||
<div class="topbar-inner">
|
||
<a class="brand" href="<?= e(url('home')) ?>">
|
||
<img src="<?= e(asset('/assets/icons/icon-96.png')) ?>" alt="">
|
||
<span>家书</span>
|
||
</a>
|
||
<nav class="nav">
|
||
<?php foreach ($navItems as $route => list($label, $key)): ?>
|
||
<a class="<?= $pageKey === $key ? 'on' : '' ?>" href="<?= e(url($route)) ?>"><?= e($label) ?></a>
|
||
<?php endforeach; ?>
|
||
</nav>
|
||
<div class="topbar-right">
|
||
<?php /* 姓名 + 头像 = 一个下拉菜单,而不是「点名字改资料」+旁边两个裸链接。
|
||
裸链接在窄屏只能靠 display:none 藏起来(一藏入口就没了),
|
||
收进菜单之后同一个入口在手机上也点得到。
|
||
用 <details> 实现:不需要 JS 就能展开/收起,app.js 只额外补
|
||
"点外面"和"Esc"两件事。 */ ?>
|
||
<details class="menu who-menu">
|
||
<summary class="who" title="我的">
|
||
<img src="<?= e(avatar_url($_SESSION['avatar'] ?? null)) ?>" alt="">
|
||
<span class="who-name"><?= e(\App\Auth::name()) ?></span>
|
||
<?php if (\App\Auth::isGuest()): ?><span class="badge">访客</span><?php endif; ?>
|
||
<i class="caret" aria-hidden="true"></i>
|
||
</summary>
|
||
<div class="menu-list">
|
||
<a href="<?= e(url('settings/me')) ?>">个人设置</a>
|
||
<?php if (\App\Auth::isAdmin()): ?>
|
||
<a href="<?= e(url('settings')) ?>">系统设置</a>
|
||
<?php endif; ?>
|
||
<a href="<?= e(url('auth/password')) ?>">修改密码</a>
|
||
<a class="menu-exit" href="<?= e(url('auth/logout', ['_csrf' => csrf_token()])) ?>">退出登录</a>
|
||
</div>
|
||
</details>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
<?php endif; ?>
|
||
|
||
<main class="<?= in_array($pageKey, ['install', 'login'], true) ? 'container-narrow' : 'container' ?>">
|
||
|
||
<?php foreach (take_flash() as $f): ?>
|
||
<div class="flash">
|
||
<div class="flash-item <?= $f['type'] === 'err' ? 'err' : '' ?>"><?= e($f['message']) ?></div>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
|
||
<?php require $tplFile; ?>
|
||
|
||
</main>
|
||
|
||
<script src="<?= e(asset('/assets/js/app.js')) ?>"></script>
|
||
</body>
|
||
</html>
|