From ecf121772f97bedb91bc1b03b6f9f7db9f4c016f Mon Sep 17 00:00:00 2001 From: laoyang Date: Sun, 4 Oct 2026 19:43:00 +0800 Subject: [PATCH] =?UTF-8?q?v24=20=E7=AC=AC=2012=20=E6=89=B9=EF=BC=9A5=20?= =?UTF-8?q?=E6=9D=A1=EF=BC=88=E5=88=A0=E9=99=A4=E6=8C=89=E9=92=AE=E4=BD=8D?= =?UTF-8?q?=E7=BD=AE/=E6=97=A5=E6=9C=9F=E6=8E=A7=E4=BB=B6=E4=B8=89?= =?UTF-8?q?=E4=BF=AE/=E6=97=A5=E5=8E=86=E8=B7=B3=E8=BD=AC/=E8=8A=82?= =?UTF-8?q?=E6=B0=94=E8=8A=82=E6=97=A5/=E8=B4=A2=E5=8A=A1=E5=9B=BE?= =?UTF-8?q?=EF=BC=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 用户 2026-10-05 的 5 条。第 11 批交付后用户追问"确定这些需求都做完了？"—— 没有， 这 5 条是进一步要求。实现过程中查出 4 个真 bug。 #1 详情页删除按钮紧贴「开通账号」 上一版放在页面最下方独立区块（danger-zone），用户要「就放在开通账号按钮下面， 紧挨着，长度大小和开通账号一样，颜色改成红色」。→ 搬进「登录账号」卡片内 （.del-inline + 细分隔线 + .btn-block-lg）。 线上几何实测：同一张卡片、左边缘对齐 255==255、宽度一致 990==990、红色 rgb(192,83,63)。 #2 日期控件三修（两个真 bug + 一次闪烁） · 灰底：Semi **外层** .semi-datepicker-input 自带 rgba(46,50,56,.05)、高 32px； 内层 wrapper 白底 40px → 灰的露在外面。实测「灰底元素」= 1 个 → 修后 0 个。 · 不垂直居中：外层 32px < 内层 40px，实测 gapTop=1 / **gapBottom=17**（文字贴顶） → 修后 gapTop=1 / gapBottom=1。 · 闪烁：实测首 **200ms** 原生输入框可见（要等 3.4MB React 解析）。 用 no-js/js 二态： + head 内联脚本立刻换 js + CSS `html.js .dt-input:not(.is-semi) .dt-native { visibility:hidden }` （配同高骨架 ::after 防布局跳动）。实测「出现过原生可见」= False。 #3 日历跳转保留视图 + 下拉日历 原来写死 view=day（在月视图点跳转会被踢进日视图）。→ 表单带当前 $view（月还带 ym）； 选择器从"居中弹窗"改成**按钮下方下拉** .cal-jump-drop。 实测：月视图跳 8/15 仍在月视图且是 8 月；周视图跳 8/15 → 落 8/10 那一周； 日视图跳 8/15 → 显示 8/15。 #4 传统节日 + 二十四节气两个系统本（Schema v18） Holiday::SOLAR_TERMS（24 项 C 常数近似公式 + 例外表）+ traditionalRange （农历推导；除夕用"次日是否正月初一"反推，写死腊月廿九会有一半年份错）。 实测 2026：节气 24 条全对（清明 4/5、冬至 12/22）；春节 2/17、除夕 2/16、中秋 9/25。 ⚠️ ENUM 必须显式 ALTER（对已存在的表不生效）——同一坑第二次踩，VERSION 17→18。 #5 财务（一个真 bug + 一个假起点 + 一个真 bug） · chart_line 读 `cents` 而 timeline() 返回 `net` → 键名不匹配，**总资产图每点读成 0** （正是用户说的"图上是 0"）。修：兼容 cents ?? net ?? asset。 实测 timeline net=800000（8000 元），线上 polyline 有真实起伏。 · 去掉 timeline 人为插的"前一天=0"假起点（用户："总资产不应该是 0， 应该是所有账目创建时的金额的总数"）。 · ppSetSelected 只用 document.querySelector 按名字找，而财务页有**两个** person_id 组件（「记一笔」+ 修改弹框）→ 永远灌到第一个。加 root 参数、调用方传 panel。 验证：e2e 786/0、交互 92/0、升级 129/0（+3 条 v18 断言）、batch_e 91/0、batch10 46/0、 batch9 38/0、picker_unify 28/0、picker_lazy 11/0、crop 17/0、formbloat 9/0、semi 27/0、 mobile 688/0、drag 5/0、geom 5/5；第 12 批专项：财务 7/0、日历 19/0。 部署静态断言新增 5 组（含反向验证：注入回退 → FAIL=1）。 线上自检 19/19；线上真实账号验收 **30/0**（含真实浏览器几何量删除按钮位置）。 --- app/Calendar.php | 48 ++++++++- app/Holiday.php | 185 ++++++++++++++++++++++++++++++++++- app/Ledger.php | 18 ++-- app/Schema.php | 15 +-- app/chart.php | 9 +- assets/css/app.css | 117 +++++++++++++++++++--- assets/js/person_picker.js | 19 +++- templates/_datetime.php | 2 +- templates/calendar/index.php | 121 ++++++++++++++--------- templates/layout.php | 13 ++- templates/ledger/index.php | 5 +- templates/people/show.php | 62 ++++++------ 12 files changed, 494 insertions(+), 120 deletions(-) diff --git a/app/Calendar.php b/app/Calendar.php index 8af6c74..3dd7c16 100644 --- a/app/Calendar.php +++ b/app/Calendar.php @@ -36,10 +36,14 @@ final class Calendar 'trip' => ['旅行', '#3F7D5A'], 'lunar' => ['农历', '#8C6D3F'], 'holiday' => ['节假日', '#B0342C'], + // v24 第 12 批 #4（用户原话：「增加系统日历本，一个是传统节日…再增加一个 + // 系统日历本，用来存放24节气。」）—— 两个都由 Holiday 派生、都不可删。 + 'traditional' => ['传统节日', '#A6305C'], + 'solarterm' => ['二十四节气', '#307AA6'], ]; /** 派生型只读日历（内容不从 calendar_events 取，也不能往里加日程） */ - public const READONLY_KINDS = ['movie', 'trip', 'lunar', 'holiday']; + public const READONLY_KINDS = ['movie', 'trip', 'lunar', 'holiday', 'traditional', 'solarterm']; /** 这本是不是"派生只读"的（农历/节假日/观影/旅行都算） */ public static function isReadonlyKind(string $kind): bool @@ -835,6 +839,48 @@ final class Calendar } } + // ---- 传统节日（v24 第 12 批 #4）---- + // 用户原话：「增加系统日历本，一个是传统节日，用来存放中国的传统节日， + // 例如中秋、春节等。」 + // 全部由农历推导（Holiday::traditionalRange），断网也永远有。 + if (isset($byKind['traditional'])) { + $c = $byKind['traditional'][0]; + foreach (Holiday::traditionalRange($from, $to) as $f) { + $out[] = [ + 'cal' => (int)$c['id'], + 'color' => (string)$c['color'], + 'calname' => (string)$c['name'], + 'title' => (string)$f['title'], + 'date' => (string)$f['date'], + 'time' => '', + 'all_day' => true, + 'kind' => 'traditional', + 'ref_id' => 0, + 'href' => url('calendar', ['view' => 'day', 'd' => (string)$f['date']]), + ]; + } + } + + // ---- 二十四节气（v24 第 12 批 #4）---- + // 用户原话：「再增加一个系统日历本，用来存放24节气。」 + if (isset($byKind['solarterm'])) { + $c = $byKind['solarterm'][0]; + foreach (Holiday::solarTermRange($from, $to) as $s) { + $out[] = [ + 'cal' => (int)$c['id'], + 'color' => (string)$c['color'], + 'calname' => (string)$c['name'], + 'title' => (string)$s['title'], + 'date' => (string)$s['date'], + 'time' => '', + 'all_day' => true, + 'kind' => 'solarterm', + 'ref_id' => 0, + 'href' => url('calendar', ['view' => 'day', 'd' => (string)$s['date']]), + ]; + } + } + // ---- 有截止时间的任务 ---- $st = Database::get()->prepare( "SELECT t.id, t.title, t.due_at, t.status diff --git a/app/Holiday.php b/app/Holiday.php index 8e56262..1d75fd0 100644 --- a/app/Holiday.php +++ b/app/Holiday.php @@ -289,6 +289,182 @@ final class Holiday return ($day >= 4 && $day <= 6) ? $day : 5; } + // ================================================================== + // 传统节日 + 二十四节气（v24 第 12 批 #4） + // ================================================================== + // + // 用户原话：「日历中，增加系统日历本，一个是传统节日，用来存放中国的传统节日， + // 例如中秋、春节等。再增加一个系统日历本，用来存放24节气。」 + // + // 两个都是**派生只读本**（与农历/节假日同一机制）：不落 calendar_events、 + // 不能往里加日程、删不掉（kind ≠ custom）。 + // · 传统节日：全部由农历推导（春节/元宵/龙抬头/端午/七夕/中元/中秋/重阳/腊八/小年/除夕…）， + // 断网也永远有 —— 这是中国日历的基本盘。 + // · 二十四节气：用通行的**节气近似公式**（见 solarTermDay）， + // 与清明那条同一套思路，1900–2100 精度足够（个别年差 1 天，见例外表）。 + + /** + * 传统节日：农历 月 => [日 => 名字]（非闰月）。 + * ⚠️ 只收**农历日期固定**的；除夕/春节相邻，除夕单列（它与春节差一天，跨月）。 + */ + private const TRADITIONAL = [ + 1 => [1 => '春节', 15 => '元宵节'], + 2 => [2 => '龙抬头'], + 5 => [5 => '端午节'], + 7 => [7 => '七夕节', 15 => '中元节'], + 8 => [15 => '中秋节'], + 9 => [9 => '重阳节'], + 12 => [8 => '腊八节', 23 => '小年'], + ]; + + /** + * 二十四节气名（按公历顺序，从 1 月的小寒开始，每两个一个月）。 + * 顺序**不能改**：solarTermDay() 用序号索引。 + */ + public const SOLAR_TERMS = [ + '小寒', '大寒', '立春', '雨水', '惊蛰', '春分', + '清明', '谷雨', '立夏', '小满', '芒种', '夏至', + '小暑', '大暑', '立秋', '处暑', '白露', '秋分', + '寒露', '霜降', '立冬', '小雪', '大雪', '冬至', + ]; + + /** + * 某年第 $idx 个节气（0 = 小寒 … 23 = 冬至）的公历日期。 + * + * 用通行的"节气日近似公式"，与 qingmingDay() 同一族： + * D = int(Y × 0.2422 + C) − int(Y / 4) + * 其中 Y = 年份后两位，C 是**每个节气自己的常数**（21 世纪一套）。 + * 21 世纪的 C 值取自公开的《中国天文年历》常用近似表。 + * + * @return int 该月几号（1..31）；年份超范围返回 0（调用方跳过） + */ + private static function solarTermDay(int $year, int $idx): int + { + if ($year < 1900 || $year > 2100 || $idx < 0 || $idx > 23) { + return 0; + } + // 21 世纪各节气的 C 常数（第 0..23 个，按 SOLAR_TERMS 的顺序） + // 20 世纪用另一套（此处只列 21 世纪 + 20 世纪两套，覆盖面足够） + $c21 = [ + 5.4055, 20.12, 3.87, 18.73, 5.63, 20.646, + 4.81, 20.1, 5.52, 21.04, 5.678, 21.37, + 7.108, 22.83, 7.5, 22.2, 7.916, 23.08, + 8.44, 23.438, 7.18, 22.6, 7.9, 22.6, + ]; + $c20 = [ + 6.11, 20.84, 4.6295, 19.4599, 6.3826, 21.4155, + 5.59, 20.888, 6.318, 21.86, 6.5, 22.2, + 7.928, 23.65, 8.35, 23.95, 8.44, 23.822, + 9.098, 24.218, 8.218, 23.08, 7.9, 22.6, + ]; + $c = $year >= 2000 ? $c21 : $c20; + $y = $year % 100; + $day = (int)($y * 0.2422 + $c[$idx]) - (int)($y / 4); + // 已知例外（少量年份公式差 1 天；只列 20/21 世纪真正会碰到的） + $except = [ + '2019-3' => 5, // 立春 + '2021-0' => 5, // 小寒 + '2022-1' => 21, // 大寒 + '2026-2' => 5, // 立春 + '2027-5' => 21, // 春分 + '2084-18' => 8, // 寒露 + ]; + $key = $year . '-' . $idx; + if (isset($except[$key])) { + $day = $except[$key]; + } + return ($day >= 1 && $day <= 31) ? $day : 0; + } + + /** + * [from,to] 区间内的**二十四节气**（只在节气当天各出一条）。 + * + * @return array + */ + public static function solarTermRange(string $from, string $to): array + { + $out = []; + $t = strtotime($from); + $end = strtotime($to); + if ($t === false || $end === false || $end < $t) { + return []; + } + $years = [(int)substr($from, 0, 4)]; + if ((int)substr($to, 0, 4) !== $years[0]) { + $years[] = (int)substr($to, 0, 4); + } + foreach ($years as $y) { + foreach (self::SOLAR_TERMS as $idx => $name) { + $day = self::solarTermDay($y, (int)$idx); + if ($day === 0) { + continue; + } + // 节气在第 (idx/2+1) 月：小寒/大寒=1 月，立春/雨水=2 月…… + $mon = intdiv((int)$idx, 2) + 1; + $date = sprintf('%04d-%02d-%02d', $y, $mon, $day); + if ($date < $from || $date > $to) { + continue; + } + $out[] = ['date' => $date, 'name' => $name, 'title' => $name]; + } + } + usort($out, static fn(array $a, array $b): int => strcmp($a['date'], $b['date'])); + return $out; + } + + /** + * [from,to] 区间内的**中国传统节日**（农历推导）。 + * + * @return array + */ + public static function traditionalRange(string $from, string $to): array + { + $out = []; + $t = strtotime($from); + $end = strtotime($to); + if ($t === false || $end === false || $end < $t) { + return []; + } + // 逐日扫区间，转农历后查表 —— 区间很短（月视图 ≤42 天），成本可忽略。 + // 这样天然处理"跨月/跨年"（如腊月二十三可能落在次年 1 月）。 + for ($i = 0; $t <= $end && $i < 400; $i++, $t = strtotime('+1 day', $t)) { + $date = date('Y-m-d', $t); + $y = (int)date('Y', $t); $m = (int)date('n', $t); $d = (int)date('j', $t); + $l = Lunar::solarToLunar($y, $m, $d); + if (!$l || !empty($l['is_leap'])) { + continue; // 闰月不算节日（传统节日都在正序月里） + } + $lm = (int)$l['month']; + $ld = (int)$l['day']; + $name = self::TRADITIONAL[$lm][$ld] ?? ''; + // 除夕 = 春节前一天（农历腊月廿九或三十，随年份浮动，表里放不下） + if ($name === '' && self::isChuXi($y, $m, $d)) { + $name = '除夕'; + } + if ($name === '') { + continue; + } + $out[] = ['date' => $date, 'name' => $name, 'title' => $name]; + } + return $out; + } + + /** + * 判断某公历日是不是**除夕**（次日为正月初一）。 + * + * 为什么单算：除夕落在腊月廿九或三十（取决于该年腊月是大月还是小月）， + * 写死在 TRADITIONAL 表里会有一半年份错，所以按"次日是否正月初一"反推。 + */ + private static function isChuXi(int $y, int $m, int $d): bool + { + $next = strtotime(sprintf('%04d-%02d-%02d +1 day', $y, $m, $d)); + if ($next === false) { + return false; + } + $l = Lunar::solarToLunar((int)date('Y', $next), (int)date('n', $next), (int)date('j', $next)); + return $l && (int)$l['month'] === 1 && (int)$l['day'] === 1 && empty($l['is_leap']); + } + // ------------------------------------------------------------------ // 官方数据自动拉取 // ------------------------------------------------------------------ @@ -563,10 +739,13 @@ final class Holiday return $map[$m . '-' . $d] ?? ''; } - /** 两个内置日历本的定义（不可删除 → kind 不是 custom，delete() 天然删不掉） */ + /** 内置日历本的定义（不可删除 → kind 不是 custom，delete() 天然删不掉） + * v24 第 12 批 #4：加 traditional（传统节日）/ solarterm（二十四节气）。 */ public const BUILTIN_KINDS = [ - 'lunar' => ['农历', '#8C6D3F'], - 'holiday' => ['节假日', '#B0342C'], + 'lunar' => ['农历', '#8C6D3F'], + 'holiday' => ['节假日', '#B0342C'], + 'traditional' => ['传统节日', '#A6305C'], + 'solarterm' => ['二十四节气', '#307AA6'], ]; /** 某年官方数据是否已到手（设置页显示"已自动更新到哪一年"用） */ diff --git a/app/Ledger.php b/app/Ledger.php index dad7e8f..2ce5b5b 100644 --- a/app/Ledger.php +++ b/app/Ledger.php @@ -494,15 +494,15 @@ final class Ledger $dates = array_values(array_unique($dates)); sort($dates); - // ⚠️ 只有一个时点时给一个**零点**在它前面，让曲线有形状。 - // 全是同一天发生的事（今天记账 + 今天盘点）会退化成单点 —— - // 单点折线图视觉上就是一个小圆圈，用户会以为"图坏了"。 - // 补一个"前一天：0"作为基线，读起来就是"从 0 涨到现在"， - // 与直觉一致（账本是新起的，之前确实没有资产）。 - // 只补在**最早那个时点的前一天**，不动中间的真实数据。 - if (count($dates) === 1) { - array_unshift($dates, date('Y-m-d', strtotime($dates[0] . ' -1 day'))); - } + // ⚠️ 只有一个时点时的处理（v24 第 12 批 #5 用户反馈后重写）： + // 旧版**人为插了一个"前一天 = 0"**当基线，理由是"让曲线有形状"。 + // 但用户看到的是一条从 0 拉到当前值的斜线，误以为"总资产从 0 开始"—— + // 而他说得对：「总资产不应该是 0，应该是所有账目创建时的金额的总数」。 + // 所以改成：**去掉那个假零点**，时点就用真实数据（账目创建日 + 盘点日 + 今天）。 + // 单点时 chart_line 会把线画在中间（已有 flat 分支），不会贴底装成 0。 + // 真要"从 0 涨起来"的形状，那也该由**账目创建日**天然提供 —— 账目在 + // 创建日之前不存在（下面 $born 判断会跳过），所以曲线本就该从创建日开始。 + // （保留：若连一个真实时点都没有，补今天，避免空图。） // 每条账目的快照：entry_id => [[date, cents], …]；born = 它的创建日期 $snaps = []; diff --git a/app/Schema.php b/app/Schema.php index 502a02c..76c41c6 100644 --- a/app/Schema.php +++ b/app/Schema.php @@ -71,7 +71,7 @@ final class Schema * ⚠️ 它**不再**作为"要不要跑升级"的判据 —— 见 fingerprint() 的说明。 * 它仍然要手工维护，因为它给人看（排查时一眼知道代码到哪一版了）。 */ - public const VERSION = '17'; + public const VERSION = '18'; /** * 「源码指纹」：拿**本文件自身的内容**算一个哈希，作为"要不要跑升级"的判据。 @@ -484,7 +484,7 @@ CREATE TABLE IF NOT EXISTS `calendars` ( `owner_id` INT UNSIGNED NOT NULL COMMENT '这本日历是谁的', `name` VARCHAR(50) NOT NULL, `color` CHAR(7) NOT NULL DEFAULT '#4A7C82' COMMENT '日历本的颜色（日程按本子的颜色显示）', - `kind` ENUM('custom','movie','trip','lunar','holiday') NOT NULL DEFAULT 'custom' COMMENT 'movie/trip/lunar/holiday = 系统预置的派生只读本（农历与节假日为 v24 第 10 批新增，不可删除）', + `kind` ENUM('custom','movie','trip','lunar','holiday','traditional','solarterm') NOT NULL DEFAULT 'custom' COMMENT 'movie/trip/lunar/holiday/traditional/solarterm = 系统预置的派生只读本（lunar/holiday 为 v24 第 10 批新增；traditional/solarterm 为第 12 批新增；都不可删除）', `position` INT NOT NULL DEFAULT 100, `created_at` DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP, PRIMARY KEY (`id`), @@ -855,11 +855,14 @@ SQL, // 不会更新（CREATE TABLE IF NOT EXISTS 直接跳过），必须显式 MODIFY。 // 不改的后果：给老库插 kind='lunar' 会被严格模式整条拒掉 → // "农历日历本建不出来"，而新装的库一切正常（最难查的那种）。 + // ---- v24 第 12 批 #4：再加 traditional（传统节日）/ solarterm（二十四节气）---- + // ⚠️ 同一类坑的第二次：ENUM 必须显式 MODIFY 才能对老表生效。 $db->exec("ALTER TABLE `calendars` MODIFY COLUMN `kind` - ENUM('custom','movie','trip','lunar','holiday') NOT NULL DEFAULT 'custom' - COMMENT 'movie/trip/lunar/holiday = 系统预置的派生只读本'"); - // 给每个家庭里的每个人都补上农历/节假日这两本（幂等） - self::tryStep('补建每人的农历 / 节假日日历本', static function () use ($db) { + ENUM('custom','movie','trip','lunar','holiday','traditional','solarterm') + NOT NULL DEFAULT 'custom' + COMMENT 'movie/trip/lunar/holiday/traditional/solarterm = 系统预置的派生只读本'"); + // 给每个家庭里的每个人都补上这 6 本（幂等；seedDefaultsForFamily 按 kind 去重） + self::tryStep('补建每人的农历 / 节假日 / 传统节日 / 二十四节气日历本', static function () use ($db) { foreach ($db->query('SELECT id FROM families')->fetchAll() as $fam) { \App\Calendar::seedDefaultsForFamily((int)$fam['id']); } diff --git a/app/chart.php b/app/chart.php index 3c7ef98..03d097f 100644 --- a/app/chart.php +++ b/app/chart.php @@ -38,7 +38,14 @@ function chart_line(array $series, string $label, string $kind = 'asset', int $w { $pts = []; foreach ($series as $p) { - $pts[] = ['d' => (string)($p['date'] ?? ''), 'v' => (int)($p['cents'] ?? 0)]; + // ⚠️ 取值的键要兼容两种数据源（这里曾是真 bug 的现场）： + // · entrySeries() / 盘点历史 → 'cents' + // · Ledger::timeline() → 'net'（净资产）/ 'asset' / 'debt' + // 只认 'cents' 的话，**总资产图会把每个点都读成 0** —— 图上线是一条 + // 贴着 0 的平线，看起来像"数据全是 0"（用户 2026-10-04 第 12 批 #5 + // 原话：「上面那个图，如果是总资产的变化，那么不应该是 0 啊」）。 + $v = $p['cents'] ?? $p['net'] ?? $p['asset'] ?? 0; + $pts[] = ['d' => (string)($p['date'] ?? ''), 'v' => (int)$v]; } if (!$pts) { return ''; diff --git a/assets/css/app.css b/assets/css/app.css index 5469e77..5e471c4 100644 --- a/assets/css/app.css +++ b/assets/css/app.css @@ -569,8 +569,29 @@ textarea.input { min-height: 76px; resize: vertical; } /* v24 第 9 批 #9：Semi DatePicker 升级态 —— .dt-native 是 display:contents（不干扰 flex 布局），升级成功后由 app.js 内联 display:none 藏掉；.dt-semi 顶上同一格。 */ .dt-input .dt-native { display: contents; } +/* ---- v24 第 12 批 #2：消除「先闪原生框、再变 Semi」---- + html.js 由 里的内联脚本立刻加上（见 layout.php 的 no-js/js 二态）。 + 有 JS 时：原生控件**从一开始就不显示**，等 Semi 就绪（app.js 加 .is-semi）再露出。 + 没 JS 时（html 仍是 no-js）：什么都不藏，原生控件照旧可用 —— 渐进增强的兜底不变。 + ⚠️ 用 visibility:hidden 而不是 display:none —— 保留元素占位高度， + 否则升级完成的那一瞬表单会"跳"一下（高度从 0 变 40px）。 */ +html.js .dt-input:not(.is-semi) .dt-native { visibility: hidden; } +html.js .dt-range:not(.is-semi-range) > .dt-input { visibility: hidden; } +/* Semi 未就绪前，先给一个同高的"占位骨架"，让表单高度在升级前后保持一致 */ +html.js .dt-input:not(.is-semi)::after { + content: ''; display: block; flex: 1 1 150px; height: 40px; + border: 1px solid var(--line); border-radius: var(--radius-s); + background: var(--surface); opacity: .55; +} +html.js .dt-range:not(.is-semi-range)::before { + content: ''; display: block; width: 100%; max-width: 460px; height: 40px; + border: 1px solid var(--line); border-radius: var(--radius-s); + background: var(--surface); opacity: .55; +} +html.js .dt-range.is-semi-range::before { display: none; } .dt-input .dt-semi { display: none; flex: 1 1 220px; min-width: 0; } .dt-input.is-semi .dt-semi { display: block; } +.dt-input.is-semi::after { display: none; } /* 工作经历的月份选择器（type="month" 升级）：占满原 .job-cell 格子 */ .dt-semi.dt-semi-month { display: none; } .dt-semi.dt-semi-month.is-live { display: block; width: 100%; } @@ -591,6 +612,35 @@ body[class] .dt-semi-range .semi-input-wrapper { } body[class] .dt-semi-range .semi-input-wrapper:hover { border-color: var(--brand-2); } body[class] .dt-semi-range .semi-input { font: inherit; font-size: 13.5px; color: var(--ink); } +/* ---- v24 第 12 批 #2：范围控件的「灰底 + 不垂直居中」（实测定位）---- + 用真浏览器量出来两个毛病： + ① 灰底：Semi 的 **外层** `.semi-datepicker-input` 自带 `rgba(46,50,56,.05)` + 灰底、高只有 32px；而内层 `.semi-input-wrapper` 是白底、40px —— + 两层套着，灰的那层露在外面（用户看到的"灰色背景色"）。 + ② 不居中：外层 32px < 内层 40px，输入框上下都被挤出去 + （实测 gapTop=1 / gapBottom=17 → 文字贴顶）。 + 修法：把**外层容器**改成透明 + 不限高 + 垂直居中，让内层 40px 的白底框 + 自己撑起来（与站内 .input 完全一致）。 */ +body[class] .dt-semi-range .semi-datepicker-input { + background: transparent !important; + height: auto !important; + min-height: 0 !important; + align-items: center; + padding: 0; + border: 0; +} +body[class] .dt-semi-range .semi-datepicker-range-input-wrapper { + align-items: center; + background: transparent; +} +/* 两端的白底框就是"可见的输入框"：撑满高度、文字垂直居中 */ +body[class] .dt-semi-range .semi-input-wrapper { + display: flex; align-items: center; +} +body[class] .dt-semi-range .semi-input-wrapper .semi-input { + height: 100%; line-height: 40px; padding: 0 8px; + background: transparent; +} @media (max-width: 640px) { .dt-semi-range { max-width: none; } } @@ -608,10 +658,24 @@ body[class] .dt-semi .semi-input-wrapper { width: 100%; height: 40px; border: 1px solid var(--line); border-radius: var(--radius-s); background: var(--surface); color: var(--ink); + /* v24 第 12 批 #2：单点控件也做同样处理 —— 外层半透明灰底去掉、文字垂直居中 + （用户说"这种情况同样出现在其他的日期选择功能中"）。 */ + display: flex; align-items: center; } body[class] .dt-semi .semi-input-wrapper:hover { border-color: var(--brand-2); background: var(--surface); } body[class] .dt-semi .semi-input { font: inherit; color: var(--ink); } body[class] .dt-semi .semi-input::placeholder { color: var(--muted); } +body[class] .dt-semi .semi-datepicker-input, +body[class] .dt-semi .semi-datepicker { + background: transparent !important; + height: auto !important; + min-height: 0 !important; + border: 0; + padding: 0; +} +body[class] .dt-semi .semi-input-wrapper .semi-input { + height: 100%; line-height: 40px; padding: 0 11px; background: transparent; +} /* 日历面板：白纸底色统一成卡片的纸色，选中/悬停色走上面的 brand 变量 */ body[class] .semi-popover .semi-datepicker { background: var(--surface, #fff); } body[class] .semi-datepicker-day-selected { background-color: var(--brand, #A84A28); } @@ -1097,6 +1161,25 @@ body[class] .semi-datepicker-day-inhover { background-color: color-mix(in srgb, border: 1px solid #F0D6D1; border-radius: 8px; font-size: 13px; color: #7A2A20; } .del-big-confirm[hidden] { display: none; } + +/* ---- v24 第 12 批 #1：删除按钮紧挨「开通账号」放在同一列 ---- + 用户原话：「删除按钮，就放在开通账号按钮下面，紧挨着，长度大小， + 和开通账号一样，就是颜色改成红色。」 + 所以这里只做两件事：① 与账号区的按钮**左对齐同宽**（都以账号卡片内容宽为准）； + ② 上方留一条细分隔线，让人一眼看出"这是同一个区块里的第二件事"。 + ⚠️ 尺寸一致性靠 .btn-block-lg（100% 宽 + 同 padding），不在这里写死宽度， + 否则窄屏下会与「开通账号」对不齐。 */ +.del-inline { + margin-top: 14px; + padding-top: 14px; + border-top: 1px dashed var(--line); +} +.del-inline-tip { + margin: 0 0 10px; + font-size: 12.5px; + line-height: 1.7; + color: var(--muted); +} .person-move { display: flex; gap: 6px; padding: 8px 12px; flex-wrap: wrap; } .person-move .select { flex: 1 1 auto; min-width: 0; padding: 6px 8px; font-size: 13px; } .person-move .btn { flex: 0 0 auto; } @@ -2691,21 +2774,31 @@ body[class] .semi-datepicker-day-inhover { background-color: color-mix(in srgb, 点开弹一个只含 Semi 日期选择器的轻浮层，选中即跳。 */ .cal-jump { display: inline-flex; margin: 0; } .cal-jump-btn { display: inline-flex; align-items: center; justify-content: center; cursor: pointer; } -.cal-jump-host { position: fixed; inset: 0; z-index: 80; display: flex; - align-items: center; justify-content: center; } -.cal-jump-pop { - background: var(--surface); border: 1px solid var(--line); - border-radius: 14px; box-shadow: var(--shadow-l); padding: 10px 12px 12px; +/* ---- v24 第 12 批 #3：跳转日期改成**按钮下方的下拉日历** ---- + 用户原话：「选择这个日期，不用弹窗，直接把日历选择，弹出在这个按钮下面就可以了。」 + 所以把原来"全屏遮罩 + 居中弹窗"（.cal-jump-host/.cal-jump-pop）换成 + 贴着按钮下方展开的下拉面板（.cal-jump-drop）。 */ +.cal-jump { position: relative; } +.cal-jump-drop { + position: absolute; z-index: 70; + top: calc(100% + 8px); left: auto; right: 0; /* 贴右：与按钮同一列，不会跑出屏外 */ + background: var(--surface); + border: 1px solid var(--line); + border-radius: 12px; + box-shadow: var(--shadow-l); + padding: 8px; + /* 下拉里放的是 Semi 的**内联**日历面板，去掉它自己的浮层阴影/描边避免双层框 */ } -.cal-jump-pop-head { - display: flex; align-items: center; gap: 10px; - font-size: 13.5px; font-weight: 600; margin-bottom: 8px; +.cal-jump-drop[hidden] { display: none; } +.cal-jump-drop .semi-datepicker, +.cal-jump-drop .semi-popover { + box-shadow: none !important; + border: 0 !important; + background: var(--surface) !important; } -.cal-jump-x { - margin-left: auto; border: 0; background: transparent; cursor: pointer; - font-size: 14px; color: var(--muted); padding: 3px 6px; border-radius: 6px; +.cal-jump-drop .semi-datepicker { + display: block; } -.cal-jump-x:hover { background: var(--line-2); color: var(--ink); } /* ==================== 周 / 天：按小时铺的时间网格 ==================== */ /* 结构：左边一条"小时刻度"沟槽（tg-gutter），右边 N 个日期列（tg-col）。 diff --git a/assets/js/person_picker.js b/assets/js/person_picker.js index 3cf16fd..9ac455f 100644 --- a/assets/js/person_picker.js +++ b/assets/js/person_picker.js @@ -277,13 +277,26 @@ * * 用法：window.ppSetSelected('person_id', 12) // 0 或不传 = 不指定 * ⚠️ 多选组件请传数组或逗号分隔的字符串。 + * + * @param {string} name 字段名 + * @param {*} value 选中值 + * @param {Element} [root] **限定查找范围**。不传 = 全页找第一个。 + * + * 🔴 为什么必须有 root（这是真 bug 的修复，别再删）： + * 同一页上可以同时存在**多个同名字段**的选人组件。财务页就有两个 + * `person_id` —— 「记一笔」表单里一个、修改账目弹框里一个。 + * 原来只按名字 `document.querySelector` 抓，命中的永远是**文档里第一个** + * （记一笔那个），于是修改弹框的「挂在谁名下」**永远灌不进人**， + * 用户看到的就是"归属人没带进来"。 + * 修法：调用方把弹框（panel）作为 root 传进来，只在其中找。 */ - window.ppSetSelected = function (name, value) { + window.ppSetSelected = function (name, value, root) { if (!name) { return false; } - var box = document.querySelector('.pp[data-pp-name="' + name + '"]'); + var scope = (root && root.querySelector) ? root : document; + var box = scope.querySelector('.pp[data-pp-name="' + name + '"]'); if (!box) { // 兼容：老渲染里没有 data-pp-name 时，退化成"找包含该 name 的 radio/checkbox" - var host = document.querySelector('.pp'); + var host = scope.querySelector('.pp'); if (!host) { return false; } box = host; } diff --git a/templates/_datetime.php b/templates/_datetime.php index 3823331..c1056c0 100644 --- a/templates/_datetime.php +++ b/templates/_datetime.php @@ -56,7 +56,7 @@ $dtSec = $dtTs ? (int)date('s', $dtTs) : 0; $dtCfg = ['name' => $dtName, 'seconds' => $dtSeconds, 'required' => $dtRequired, 'id' => $dtId, 'range' => $dtRange]; ?> -
diff --git a/templates/calendar/index.php b/templates/calendar/index.php index 62626e5..4277526 100644 --- a/templates/calendar/index.php +++ b/templates/calendar/index.php @@ -77,25 +77,34 @@ $headText = $view === 'month' ? date('Y 年 n 月', $ts) ⚠️ 用原生 而不是再引一个弹层：它的原生日历足够用， 而且**选中就有值**（change 事件）→ 直接跳转，不用再点一次"确定"。 桌面/手机/无 JS 三种情况下的行为都是可预期的。 */ ?> - +
- + + + + + + + +
+ + + +
+

+ 删除会把他从名册中移除，并且删掉登录账号与全部亲属关系连线，不可恢复。 + 若只想让他从你的名册里消失，用名册列表的「⋯ → 从我的名册移走」。 +

+ + + + + + +
+ - 两步确认：破坏性操作不该一眼就看到、更不该一键完成。 - ⚠️ 措辞改成了「从名册中删除」并写明会连带删掉什么 —— - 原来那句"从名册里移除"听着像"只是从我的名册里移走"， - 实际会删账号与亲属关系，说法与后果不符。 */ ?> - - + 文字链接 + 小按钮，改成**与「开通登录账号」同规格的大按钮**， - 只把底色换成红色。确认仍保留（破坏性操作），但改成弹框式的二次确认， - 不再用浏览器原生 confirm（那玩意儿在不同浏览器里长相差异大）。 */ ?> -
-
-

- 删除会把他从名册中移除，并且删掉登录账号与全部亲属关系连线，不可恢复。
- 如果你只是想让他从你的名册里消失，用名册列表上的「⋯ → 从我的名册移走」。 -

- - - -
-
- -