$k, 'content' => $c]; } $tagsStr = implode(' ', array_map(static fn($t): string => '#' . $t, (array)$editing['tags'])); } if (!$blocks) { // 新建时给一个空段落块打底（否则页面上一片空白，用户不知道从哪写） $blocks = [['kind' => 'text', 'content' => '']]; } /** 图片块内容 → [key, 宽度百分比]。内容形如 `abc123` 或 `abc123|50`。 */ $imgParts = static function (string $c): array { $p = explode('|', $c); $w = isset($p[1]) ? (int)$p[1] : 0; if ($w < 20 || $w > 100) { $w = 0; } return [trim((string)$p[0]), $w]; }; ?>
，见 View::render 的 title 参数）—— 由路由传进来，见 index.php 的 notes/form 分支。 */ $noteTitle = trim((string)($editing['title'] ?? '')); $headText = (!$editMode && $isEditing && $noteTitle !== '') ? $noteTitle : ($editMode ? ($isEditing ? '改笔记' : '写笔记') : '看笔记'); ?>

· 作者 · 你的权限：
编辑 返回列表

只读账号不能写笔记。

` 包：宽度可调（第 8 条），且要与正文有间距。 ⚠️ 附件（`$editing['files']`）**排在正文之后、页面最下方** —— 用户原话「附件在最下方」。 */ ?>
` 删掉。 ⚠️ 背景：v52 已经把**页头**改成笔记自己的标题（见本文件上面那段）， 而正文这里**又写了一遍同一个标题** ⇒ 同一页同一个名字出现两次 （页头一行、正文开头一行），用户看到的就是这个重复。 ⚠️ **页头那份保留**（那是"这一页叫什么"，也参与 与浏览器标签）； 删的只是正文里的副本。 ⚠️ 编辑态不受影响（本段只在阅读态渲染）。 */ ?> <?php if (!empty($editing['tags'])): ?> <div class="note-tags note-read-tags"> <?php foreach ((array)$editing['tags'] as $t): ?> <a class="note-tag" href="<?= e(url('notes', ['tag' => (string)$t])) ?>">#<?= e((string)$t) ?></a> <?php endforeach; ?> </div> <?php endif; ?> <div class="note-read-body" data-note-id="<?= (int)($editing['id'] ?? 0) ?>"> <?php foreach ((array)$editing['blocks'] as $b): ?> <?php $k = (string)$b['kind']; $c = (string)$b['content']; /* 🔴 v52（用户第 4 条）：每一块包一层 `.note-read-item`，带**块主键** —— 详情页的"分段编辑"要靠它定位改哪一块（AJAX 按主键改一行）。 ⚠️ 加 `data-block` 的**同时**保留原来的类名（`note-read-fig` / `note-read-block`）—— 现有 e2e 与 CSS 都按它们断言，改类名会静默弄坏那些检查。 */ ?> <div class="note-read-item" data-block="<?= (int)($b['id'] ?? 0) ?>" data-kind="<?= e($k) ?>" data-raw="<?= e($c) ?>"> <?php if ($k === 'image'): ?> <?php [$key, $w] = $imgParts($c); ?> <?php if ($key !== ''): ?> <figure class="note-read-fig"> <a href="<?= e(media_url($key)) ?>" data-prev> <img src="<?= e(media_url($key)) ?>" alt="" <?= $w > 0 ? 'style="width:' . (int)$w . '%"' : '' ?> loading="lazy" decoding="async"> </a> </figure> <?php endif; ?> <?php else: ?> <div class="note-read-block md-body"><?= (string)($b['html'] ?? '') ?></div> <?php endif; ?> <?php /* 鼠标划过才出现的「编辑」——只在能写且这一块真的有主键时给 （`$b['id']` 为 0 的块理论上不该有；给了也改不了，不如不给）。 */ ?> <?php if ($canEdit && $canWrite && (int)($b['id'] ?? 0) > 0): ?> <button type="button" class="note-item-edit" data-item-edit="<?= (int)$b['id'] ?>" title="只改这一段">编辑</button> <?php endif; ?> </div> <?php endforeach; ?> <?php if (!$editing['blocks']): ?> <p class="empty-hint">（这条笔记没有正文）</p> <?php endif; ?> </div> <?php /* ---- 附件：永远在最后 ---- */ ?> <?php if (!empty($editing['files'])): ?> <section class="note-read-files"> <h2 class="note-read-h2">附件</h2> <div class="note-files"> <?php foreach ((array)$editing['files'] as $f): ?> <?php $fk = \App\Attachment::kind($f); ?> <div class="note-file"> <span class="note-file-ico"><?= e(\App\Attachment::kindWord($fk)) ?></span> <a class="note-file-nm" href="<?= e(media_url((string)$f['key'], ['dl' => 1])) ?>"> <?= e((string)($f['name'] ?? '附件')) ?> </a> <span class="small muted"><?= e(\App\Attachment::sizeWord($f['size'] ?? 0)) ?></span> </div> <?php endforeach; ?> </div> </section> <?php endif; ?> </article> <?php /* ==================== 共享（v29 第 9 条：选人 + 权限，同资源）==================== 🔴 只在**作者**视角显示：共享范围是作者的决定，拿到只读的人不该看到名单。 交互与资源页完全一致：选人 → 选权限 → 共享；已共享的逐个可「取消共享」。 */ ?> <?php if ($isMine && $canWrite): ?> <div class="card card-pad"> <h2 class="cinema-h2">共享 <span class="hint">默认只有自己看得到；共享出去给别人看或改</span></h2> <form method="post" action="<?= e(url('notes/share')) ?>"> <?= csrf_field() ?> <input type="hidden" name="id" value="<?= (int)$editing['id'] ?>"> <div class="field"> <label>共享给谁</label> <?php $ppName = 'person_id'; $ppPeople = $people ?? []; $ppSelected = []; $ppMode = 'single'; $ppOpenBtn = '选择要共享给谁'; $ppTitle = '共享给谁'; $ppEmptyText = '未选择'; require __DIR__ . '/../_person_picker.php'; ?> <span class="tip">你自己本来就有全部权限，不用（也不能）共享给自己。</span> </div> <div class="field"> <label>权限</label> <select class="select" name="perm"> <option value="read">只读</option> <option value="write">可读写</option> </select> </div> <div class="btn-row" style="margin-top:0"> <button class="btn btn-ok" type="submit">共享</button> </div> </form> <div class="note-share-now"> <h3 class="note-read-h2">已共享给</h3> <?php if ($shares): ?> <div class="note-files"> <?php foreach ($shares as $s): ?> <div class="note-file"> <span class="note-file-ico"><?= e(\App\Note::permWord((string)$s['perm'])) ?></span> <span class="note-file-nm"><?= e((string)$s['name']) ?></span> <form method="post" action="<?= e(url('notes/unshare')) ?>" class="inline-form"> <?= csrf_field() ?> <input type="hidden" name="id" value="<?= (int)$editing['id'] ?>"> <input type="hidden" name="person_id" value="<?= (int)$s['person_id'] ?>"> <button type="submit" class="note-file-del" title="取消共享">取消共享</button> </form> </div> <?php endforeach; ?> </div> <?php else: ?> <p class="empty-hint">还没有共享给谁。</p> <?php endif; ?> </div> </div> <?php endif; ?> <?php else: ?> <?php /* ==================== ✏️ 编辑态 ==================== */ ?> <form method="post" action="<?= e(url('notes/save')) ?>" id="noteForm" class="note-form"> <?php /* ⚠️ media 地址**不在表单上注入**：`media_url('')` 返回的是默认头像 （见 helpers.php 里 `$key === ''` 那一支），拿它当基址会拼出 `avatar-default.svgabc123` 这种地址。基址统一由 layout 的 `<body data-media-base="media.php?k=">` 提供，脚本读它就行。 */ ?> <?= csrf_field() ?> <?php if ($isEditing): ?> <input type="hidden" name="id" value="<?= (int)$editing['id'] ?>"> <?php endif; ?> <?php /* 块的真实载荷（由页尾脚本维护） */ ?> <input type="hidden" name="blocks" id="noteBlocks" value=""> <div class="card card-pad"> <div class="field"> <label for="noteTitle">标题</label> <input class="input" id="noteTitle" name="title" maxlength="200" value="<?= e((string)($editing['title'] ?? '')) ?>" placeholder="一句话概括（也可以不写，只写正文）" autocomplete="off"> </div> </div> <?php /* ---------------- 分块编辑区 ---------------- */ ?> <div class="card card-pad"> <div class="note-block-head"> <h2 class="cinema-h2">正文</h2> <div class="note-add"> <button class="btn btn-ghost btn-sm" type="button" data-add="text">+ 段落</button> <button class="btn btn-ghost btn-sm" type="button" data-add="image">+ 图片</button> </div> </div> <?php /* 🔴 v29 第 7 条：**工具条**（点一下插到光标处）+ 斜线命令提示。 工具条按钮与斜线菜单是**同一份命令表**（见 note_editor.js 的 CMDS）， 避免"按钮能插、斜线插不了"这种两套实现。 🔴 v61（用户 2026-10-18）：按成熟软件的块清单补齐 —— 标题一/二/三、有序列表、待办清单、删除线、行内代码、表格、分割线。 工具条只摆**高频**的；全部命令（含标题三、行内代码）斜线 `/` 都能调出。 */ ?> <div class="note-cmdbar" data-cmdbar> <button type="button" class="cmd" data-cmd="b" title="粗体 **文字**"><b>B</b></button> <button type="button" class="cmd" data-cmd="i" title="斜体 *文字*"><i>I</i></button> <button type="button" class="cmd" data-cmd="s" title="删除线 ~~文字~~"><s>S</s></button> <span class="cmd-sep"></span> <button type="button" class="cmd" data-cmd="h1" title="标题一 # 文字">H1</button> <button type="button" class="cmd" data-cmd="h2" title="标题二 ## 文字">H2</button> <button type="button" class="cmd" data-cmd="h3" title="标题三 ### 文字（全部命令见斜线）">H3</button> <span class="cmd-sep"></span> <button type="button" class="cmd" data-cmd="ul" title="无序列表 - 项目">≡</button> <button type="button" class="cmd" data-cmd="ol" title="有序列表 1. 项目">1.</button> <button type="button" class="cmd" data-cmd="todo" title="待办清单 - [ ] 项目">☑</button> <button type="button" class="cmd" data-cmd="quote" title="引用 > 文字">❝</button> <span class="cmd-sep"></span> <button type="button" class="cmd" data-cmd="code" title="代码块 ```"></></button> <button type="button" class="cmd" data-cmd="table" title="表格 | 列 | 列 |">▦</button> <button type="button" class="cmd" data-cmd="hr" title="分割线 ---">—</button> <button type="button" class="cmd" data-cmd="link" title="链接 [文字](地址)">🔗</button> <span class="cmd-sep"></span> <span class="small muted">行首打 <code>/</code> 也能选命令</span> <label class="note-live"> <input type="checkbox" id="noteLivePreview" checked> <span>实时预览</span> </label> </div> <div id="noteBlockList" class="note-blocks"></div> <?php /* 无 JS 兜底：脚本没跑时用户仍能写一条纯文字笔记 */ ?> <noscript> <div class="field" style="margin-top:10px"> <label for="notePlain">正文（纯文本）</label> <textarea class="input" id="notePlain" name="body_plain" rows="8" placeholder="没有启用脚本时，可以在这里写纯文字正文"><?php echo e(implode("\n\n", array_map( static fn($b): string => (string)$b['content'], $blocks))); ?></textarea> </div> </noscript> <?php /* 图片上传用的隐藏 file 框（点"+ 图片"时程序化触发） */ ?> <input type="file" id="noteImgInput" accept="image/*" hidden> </div> <?php /* ---------------- 标签 ---------------- */ ?> <div class="card card-pad"> <div class="field"> <label for="noteTags">标签</label> <input class="input" id="noteTags" name="tags" maxlength="300" value="<?= e($tagsStr) ?>" placeholder="用空格分开，如：读书 灵感 待办（可写 # 也可不写）" autocomplete="off"> <?php if ($tagSuggest): ?> <div class="note-tags note-tags-suggest"> <span class="small muted">用过的：</span> <?php foreach ($tagSuggest as $t): ?> <button type="button" class="note-tag" data-tag="<?= e((string)$t) ?>"> #<?= e((string)$t) ?> </button> <?php endforeach; ?> </div> <?php endif; ?> </div> <?php /* ⚠️ v29：原来的「共享给全家」勾选框**删掉**了 —— 共享改成"保存后在阅读态选人 + 选权限"（与资源一致，见第 9 条）。 */ ?> </div> <?php /* 🔴 v28 用户第 12 条：「再加上附件上传功能，附件，都放在笔记最下面就行了。」 ⇒ 附件区放在**整张表单的最下面**。 ⚠️ 附件要挂在**已存在的笔记**上（attachments.target_id 要真实 id）， 所以新建时这一区是**禁用并说明**的 —— 保存之后进入编辑态就能传了。 */ ?> <?php if ($isEditing): ?> <div class="card card-pad" id="noteFilesCard"> <h2 class="cinema-h2">附件 <span class="hint">放最后，与正文分开</span></h2> <?php if (!empty($editing['files'])): ?> <div class="note-files"> <?php foreach ((array)$editing['files'] as $f): ?> <?php $fk = \App\Attachment::kind($f); ?> <div class="note-file"> <span class="note-file-ico"><?= e(\App\Attachment::kindWord($fk)) ?></span> <a class="note-file-nm" href="<?= e(media_url((string)$f['key'], ['dl' => 1])) ?>"> <?= e((string)($f['name'] ?? '附件')) ?> </a> <span class="small muted"><?= e(\App\Attachment::sizeWord($f['size'] ?? 0)) ?></span> <button type="button" class="note-file-del" data-note-file-del="<?= (int)$f['id'] ?>" title="删掉这个附件">✕</button> </div> <?php endforeach; ?> </div> <?php else: ?> <p class="empty-hint" id="noteFilesEmpty">还没有附件。</p> <?php endif; ?> <?php /* 🔴🔴 v47（用户 2026-10-13）：「编辑一个笔记，点击编辑，然后这时候点保存 是没有任何反应的。」——真因就是**这里原来是一个嵌套 <form>**。 HTML 不允许 form 套 form：浏览器解析时会把**内层** `<form>` 标签丢掉， 但**保留**它后面的 `</form>`。于是那个 `</form>` 提前把外层的 `#noteForm`（整页的保存表单）关掉了 —— 结果「保存」按钮落入**没有任何表单**的区域： · `button.form === null`； · 点它既不提交、也不报错（**所以"没有任何反应"**）。 ⚠️ 页面里其它字段看着都正常，只有"提交"这条链断了 —— 这类 bug 不打开真浏览器量 `btn.form` 是看不出来的。 改法：内层不再用 `<form>`，改成 `<div>`，把"上传所选文件"这个按钮 用 HTML5 的 `formaction` / `formenctype` **指向自己的端点**。 —— 这样仍然只有**一个**表单（保存表单），上传按钮却能提交到 `notes/attach_add` 且是 multipart。既修了 bug，又不牺牲上传。 ⚠️ 隐藏域 `id` 与 `_csrf` 与保存表单同名同值（都是这条笔记的 id / 同一个令牌），合进一个表单不会冲突 —— 已在探针里断言过。 */ ?> <div id="noteAttForm"> <?= csrf_field() ?> <input type="hidden" name="id" value="<?= (int)$editing['id'] ?>"> <div class="note-att-drop" id="noteAttDrop"> <input type="file" name="file[]" id="noteAttInput" multiple accept="image/*,.pdf,.txt,.md,.zip,.doc,.docx,.xls,.xlsx,.ppt,.pptx"> <span class="note-att-tip">把文件拖到这里，或<label for="noteAttInput">点这里选文件</label></span> </div> <div class="btn-row"> <?php /* ⚠️ formaction/formenctype 必须写在**按钮**上：表单主体是"保存"， 只有这一个按钮走附件端点。 */ ?> <button class="btn btn-ghost btn-sm" type="submit" formaction="<?= e(url('notes/attach_add')) ?>" formenctype="multipart/form-data">上传所选文件</button> </div> </div> </div> <?php else: ?> <div class="card card-pad"> <h2 class="cinema-h2">附件</h2> <p class="empty-hint">先「记下来」，保存之后回到这一页就能传附件了。</p> </div> <?php endif; ?> <div class="note-actions"> <button class="btn" type="submit"><?= $isEditing ? '保存' : '记下来' ?></button> <?php /* 取消：编辑已有笔记时回它的阅读态；新建时回列表 */ ?> <a class="btn btn-ghost" href="<?= e($isEditing ? url('notes/form', ['id' => (int)$editing['id']]) : url('notes')) ?>">取消</a> </div> </form> <?php if ($isEditing): ?> <?php /* 删附件：全页唯一的一份表单，脚本填 id 后提交（沿用项目既有做法， 避免"每行一份 form"那种页面膨胀）。 */ ?> <form method="post" action="<?= e(url('notes/attach_del')) ?>" id="noteFileDelForm" hidden> <?= csrf_field() ?> <input type="hidden" name="id" value=""> </form> <?php endif; ?> <?php /* 初始块数据：JSON 塞进 <script type="application/json"> 而不是 data-* —— 属性里的引号/换行会被 HTML 实体化，读出来还得反转义一次；JSON 块原样读。 */ ?> <script type="application/json" id="noteSeed"><?= json_encode( $blocks, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES | JSON_HEX_TAG | JSON_HEX_AMP ) ?></script> <?php endif; ?>