图片可裁剪 · 名册按关系分组 · 个人设置独立 · 顶栏下拉菜单

① 上传图片一律可裁剪，比例由图位决定
   新增 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 逐字节一致。

app/Person.php

@@ -91,8 +91,8 @@ final class Person
                 (family_id, kind, name, gender, birth_rank, birthday,
                  birthday_id_card, birthday_lunar, birthday_lunar_leap, slogan, avatar,
                  phone_hash, phone_encrypted, id_card_encrypted, email, address, note,
-                 is_placeholder, sort_order)
-                VALUES (?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?)';
+                 is_placeholder, group_id, sort_order)
+                VALUES (?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?)';
         $st = Database::get()->prepare($sql);
         $st->execute([
             $familyId,
@@ -113,6 +113,7 @@ final class Person
             ($d['address'] ?? '') !== '' ? $d['address'] : null,
             ($d['note'] ?? '') !== '' ? $d['note'] : null,
             !empty($d['is_placeholder']) ? 1 : 0,
+            !empty($d['group_id']) ? (int)$d['group_id'] : null,
             (int)($d['sort_order'] ?? 1000),
         ]);
         return (int)Database::get()->lastInsertId();
@@ -126,7 +127,7 @@ final class Person
                   name = ?, gender = ?, birth_rank = ?, birthday = ?,
                   birthday_id_card = ?, birthday_lunar = ?, birthday_lunar_leap = ?, slogan = ?, avatar = ?,
                   phone_hash = ?, phone_encrypted = ?, id_card_encrypted = ?,
-                  email = ?, address = ?, note = ?, is_placeholder = ?, sort_order = ?
+                  email = ?, address = ?, note = ?, is_placeholder = ?, group_id = ?, sort_order = ?
                 WHERE id = ?';
         Database::get()->prepare($sql)->execute([
             $d['name'],
@@ -145,11 +146,26 @@ final class Person
             ($d['address'] ?? '') !== '' ? $d['address'] : null,
             ($d['note'] ?? '') !== '' ? $d['note'] : null,
             !empty($d['is_placeholder']) ? 1 : 0,
+            // ⚠️ 这里不能用 `!empty($d['group_id'])` 之外的花样：
+            //    "清空分组"（改成未分类）也是一个合法意图，所以 0/'' 一律落成 NULL。
+            !empty($d['group_id']) ? (int)$d['group_id'] : null,
             (int)($d['sort_order'] ?? 1000),
             $id,
         ]);
     }
 
+    /**
+     * 只改「这个人属于哪一组」（名册上的快捷归类用）。
+     *
+     * 单独一个方法，是为了让名册那一小块表单**不必**把整条记录回传 ——
+     * 否则一次归类提交就要带上姓名/生日/身份证号，任何一处没带全就会把数据改坏。
+     */
+    public static function setGroup(int $id, ?int $groupId): void
+    {
+        Database::get()->prepare('UPDATE persons SET group_id = ? WHERE id = ?')
+            ->execute([$groupId ?: null, $id]);
+    }
+
     /**
      * 自助改自己的资料（个人信息页用）。
      *