nx-sk 0.14.0 → 0.15.1

package/CHANGELOG.md

@@ -4,6 +4,15 @@
 
 ## [Unreleased]
 
+## 0.15.1 (2026-10-20)
+
+### Fixed
+
+- **附件字段里的附件列表改成 5 行高的滚动窗口**：原先是**全部铺开**——20 个附件就把
+  条目表单撑高近 1000px，填别的字段时得拖着整页上下滚。现在默认只露 5 行，
+  窗口内上下滚动查看，下方标「共 N 个附件（窗口内上下滚动查看）」，需要看全时点
+  「展开全部」/「收起到 5 行」。
+
 ## 0.15.0 (2026-10-20)
 
 **原始资料袋：每个栏目都自带一个「乱入区」**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nx-sk",
-  "version": "0.14.0",
+  "version": "0.15.1",
   "description": "nx-sk · 本机个人资源管理器（server-cli-web 骨架）：栏目化存储个人信息与大模型密钥，CLI 与 Web 同源，敏感字段密文落盘。",
   "type": "module",
   "bin": {

package/src/web/frontend/components/fieldEditor.jsx

@@ -81,6 +81,8 @@ export function FileFieldControl({ def, value, onChange }) {
   const { toast, guard, patchUi } = useStore();
   const [data, setData] = useState(null);
   const [dragOver, setDragOver] = useState(false);
+  // 附件多的时候不把表单撑长：默认只露 5 行，窗口内上下滚动；需要看全时一键展开
+  const [expanded, setExpanded] = useState(false);
   const uploadRef = useRef(null);
   // dragenter/dragleave 在子元素间穿梭时会成对触发，用深度计数避免「还没离开就熄掉高亮」
   const dragDepth = useRef(0);
@@ -137,29 +139,41 @@ export function FileFieldControl({ def, value, onChange }) {
       onDragLeave={() => { dragDepth.current -= 1; if (dragDepth.current <= 0) { dragDepth.current = 0; setDragOver(false); } }}
       onDrop={onDrop}
     >
-      {ids.map((id) => {
-        const rec = byId(id);
-        if (!rec) {
-          return (
-            <div className="file-preview" key={id}>
-              <span className="hint bad grow">引用的附件已不存在（{id}）—— 重新上传，或移除。</span>
-              <button type="button" className="btn small ghost" onClick={() => removeAt(id)}>移除</button>
-            </div>
-          );
-        }
-        return (
-          <div className="file-preview" key={id}>
-            {rec.isImage
-              ? <img src={rec.url} alt={rec.name} />
-              : <span className="ext-badge" style={{ fontSize: 13, width: 40, textAlign: 'center' }}>{rec.ext ? rec.ext.slice(1).toUpperCase() : 'FILE'}</span>}
-            <a className="file-preview-name grow" href={rec.url} target="_blank" rel="noreferrer" title={rec.displayPath}>{rec.name}</a>
-            <a className="btn small ghost" href={rec.downloadUrl}>下载</a>
-            <Copyable className="hint" text={rec.path} title="点击复制物理路径">路径</Copyable>
-            <button type="button" className="btn small ghost" onClick={() => removeAt(id)}>移除</button>
-          </div>
-        );
-      })}
+      {ids.length ? (
+        <div className={`file-picker-list${expanded ? ' expanded' : ''}`}>
+          {ids.map((id) => {
+            const rec = byId(id);
+            if (!rec) {
+              return (
+                <div className="file-preview" key={id}>
+                  <span className="hint bad grow">引用的附件已不存在（{id}）—— 重新上传，或移除。</span>
+                  <button type="button" className="btn small ghost" onClick={() => removeAt(id)}>移除</button>
+                </div>
+              );
+            }
+            return (
+              <div className="file-preview" key={id}>
+                {rec.isImage
+                  ? <img src={rec.url} alt={rec.name} />
+                  : <span className="ext-badge" style={{ fontSize: 13, width: 40, textAlign: 'center' }}>{rec.ext ? rec.ext.slice(1).toUpperCase() : 'FILE'}</span>}
+                <a className="file-preview-name grow" href={rec.url} target="_blank" rel="noreferrer" title={rec.displayPath}>{rec.name}</a>
+                <a className="btn small ghost" href={rec.downloadUrl}>下载</a>
+                <Copyable className="hint" text={rec.path} title="点击复制物理路径">路径</Copyable>
+                <button type="button" className="btn small ghost" onClick={() => removeAt(id)}>移除</button>
+              </div>
+            );
+          })}
+        </div>
+      ) : null}
       {!ids.length ? <span className="hint">还没有附件。</span> : null}
+      {ids.length > 5 ? (
+        <div className="file-pick-row">
+          <span className="hint">共 {ids.length} 个附件{expanded ? '（已展开全部）' : '（窗口内上下滚动查看）'}</span>
+          <button type="button" className="btn small ghost" onClick={() => setExpanded((v) => !v)}>
+            {expanded ? '收起到 5 行' : '展开全部'}
+          </button>
+        </div>
+      ) : null}
       <div className="file-pick-row">
         <select value="" disabled={full || !available.length} onChange={(e) => add(e.target.value)}>
           <option value="">{available.length ? '（从附件库选一个，选中即追加）' : '（库里没有可再选的附件）'}</option>

package/src/web/frontend/styles.css

@@ -974,3 +974,16 @@ body.col-resizing, body.col-resizing * { cursor: col-resize !important; user-sel
   transition: background .15s ease;
 }
 .source-old-toggle:hover { background: var(--soft-2); color: var(--ink); }
+
+/* 附件列表：**固定 5 行高的滚动窗口**。
+   附件一多，全铺开会把整页表单撑得很长（每行 ~50px，20 个附件就是 1000px），
+   填别的字段时得拖着整页上下滚。改成窗口内滚动，表单高度就稳住了。 */
+.file-picker-list {
+  display: flex; flex-direction: column; gap: 4px;
+  max-height: 266px;            /* ≈ 5 行（每行 ~50px）+ 间隙 */
+  overflow-y: auto; overflow-x: hidden;
+  padding-right: 2px;           /* 给滚动条留位，滚动条不压住「移除」按钮 */
+  scrollbar-width: thin;
+}
+.file-picker-list.expanded { max-height: none; }
+.file-picker-list .file-preview { flex-shrink: 0; }

package/src/web/public/assets/{files-D5FYZdp3.js → files-Cc9BanTT.js}

@@ -1 +1 @@
-import{a as l}from"./index-CK6204A2.js";let n=null,o=0;const u=1500;function c(t=!1){return!t&&n&&Date.now()-o<u||(o=Date.now(),n=l("/api/files").then(e=>e).catch(e=>{throw n=null,e})),n}function d(){return n=null,c(!0)}function h(t,e){const a=Array.isArray(t)?t:[],r=(Array.isArray(e)?e:[]).filter(Boolean);if(!r.length)return a;const s=new Set(r.map(i=>i.id));return[...r,...a.filter(i=>!s.has(i.id))]}function m(t){return new Promise((e,a)=>{const r=new FileReader;r.onload=()=>e(r.result),r.onerror=()=>a(new Error("读取文件失败")),r.readAsDataURL(t)})}export{m as f,c as l,h as m,d as r};
+import{a as l}from"./index-B1tuW-Bw.js";let n=null,o=0;const u=1500;function c(t=!1){return!t&&n&&Date.now()-o<u||(o=Date.now(),n=l("/api/files").then(e=>e).catch(e=>{throw n=null,e})),n}function d(){return n=null,c(!0)}function h(t,e){const a=Array.isArray(t)?t:[],r=(Array.isArray(e)?e:[]).filter(Boolean);if(!r.length)return a;const s=new Set(r.map(i=>i.id));return[...r,...a.filter(i=>!s.has(i.id))]}function m(t){return new Promise((e,a)=>{const r=new FileReader;r.onload=()=>e(r.result),r.onerror=()=>a(new Error("读取文件失败")),r.readAsDataURL(t)})}export{m as f,c as l,h as m,d as r};