节点表单:24 小时制时间控件、附件可裁剪、保存失败不丢已填内容
1) 时间选择不再出现「上午/下午」 datetime-local 的显示格式由浏览器 UI 语言决定(中文环境渲染成 「下午 03:30」),页面与元素的 lang 都压不住(截图实测)。 拆成「原生 date 控件 + 时下拉(00-23) + 分下拉(00-59)」组合控件 (templates/_datetime.php),24 小时制由控件本身决定,浏览器改不掉。 服务端 read_dt_input() 把三段拼回 Y-m-d H:i:s 并校验,兼容旧单字段。 节点起止时间与成员签到时间一并换掉。 2) 附件可裁剪,不想裁点「确定」就按原图上传 裁剪弹窗抽成 templates/_crop_modal.php 与照片页共用;表单里选完图 自动逐张进入裁剪,整图选框=没裁(保留原文件、不重新编码、省 base64 流量),裁过的走 cropped 通道(隐藏域 JSON,原生表单提交也能带), 没裁的留在 input.files,已裁卡片带角标,可随时重置重来。 3) 节点保存失败不再清空整页 服务端:失败分支 flash_old($_POST),重开的表单按 old()/old_array()/ old_dt() 全字段回填(含勾选删除状态),渲染完即清(layout.php)。 前端:sessionStorage 草稿兜底服务端拿不到 $_POST 的情况 (post_max_size 超限、会话过期),恢复条件收窄到「页面有错误提示条」, 避免陈旧草稿污染新表单。 已验证:本地 php -l 全量 0 错、模板渲染 275 项、表单交互(真实浏览器) 73 项——含真实裁剪一刀、草稿恢复、三段式时间选择;远端 e2e 289 项 0 失败(存储设置测试期间归一为 local,不再写用户真实 OSS 桶,收尾还原); 部署后双 PHP 渲染逐字节一致、59 文件哈希校验一致。
This commit is contained in:
@@ -0,0 +1,35 @@
|
||||
<?php
|
||||
/**
|
||||
* 裁剪弹窗(Cropper.js 的容器)。两个页面共用:
|
||||
* · templates/nodes/attachments.php(照片页)
|
||||
* · templates/nodes/form.php(节点表单)
|
||||
* 抽成一份是为了避免两处漂移——id 改了哪边忘了另一边,弹窗就静默打不开。
|
||||
*
|
||||
* JS 约定(两个页面的脚本都按这套 id 找):
|
||||
* #crop-modal 弹窗容器(.open 时显示)
|
||||
* #crop-title 标题
|
||||
* #crop-hint 提示行
|
||||
* #crop-image 每次打开都要**新建**一个 img 换进去(Cropper 不能复用旧实例,会状态残留)
|
||||
* #crop-cancel / #crop-reset / #crop-apply 三个按钮
|
||||
*
|
||||
* 可覆盖变量:
|
||||
* $cropHint 提示文案(默认为通用文案)
|
||||
*/
|
||||
$cropHint = $cropHint ?? '拖动选框选好范围后点「确定」。不想裁就直接点「确定」——会按原图上传,不会重新压缩。';
|
||||
?>
|
||||
<div class="modal" id="crop-modal" aria-hidden="true">
|
||||
<div class="modal-backdrop" data-close="1"></div>
|
||||
<div class="modal-content modal-content-wide">
|
||||
<h3 class="modal-title" id="crop-title">裁剪照片</h3>
|
||||
<p class="modal-hint" id="crop-hint"><?= e($cropHint) ?></p>
|
||||
<div class="crop-container crop-container-wide">
|
||||
<img id="crop-image" alt="">
|
||||
</div>
|
||||
<div class="modal-actions">
|
||||
<button type="button" class="btn" id="crop-cancel">取消</button>
|
||||
<button type="button" class="btn" id="crop-reset">重置</button>
|
||||
<button type="button" class="btn-primary" id="crop-apply">确定</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php unset($cropHint); ?>
|
||||
Reference in New Issue
Block a user