From f77899e5763431df1c3ec459ae89c2c5fd63d813 Mon Sep 17 00:00:00 2001
From: xiaoqidun <xiaoqidun@gmail.com>
Date: Sun, 25 Oct 2026 21:12:09 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E5=89=8D=E7=AB=AF=E7=95=8C=E9=9D=A2):=20?=
 =?UTF-8?q?=E6=81=A2=E5=A4=8D=E7=AE=80=E7=9F=AD=E6=A0=87=E7=AD=BE=E5=B9=B6?=
 =?UTF-8?q?=E5=88=86=E7=BB=84=E5=B1=95=E7=A4=BA=E5=B1=9E=E6=80=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 assets/webui/index.html | 162 +++++++++++++++++++++-------------------
 assets/webui/ofdgo.css  |  58 +++++++++++---
 2 files changed, 133 insertions(+), 87 deletions(-)

diff --git a/assets/webui/index.html b/assets/webui/index.html
index 40d87b4..8e11c9f 100644
--- a/assets/webui/index.html
+++ b/assets/webui/index.html
@@ -816,79 +816,87 @@
 				<div id="documentRow" class="document-row" hidden>
 					<select id="documentSelect" class="document-select" title="切换文档"></select>
 				</div>
-				<dl class="meta-list">
-					<div>
-						<dt>文件名称</dt>
-						<dd id="metaFile">-</dd>
-					</div>
-					<div>
-						<dt>标题</dt>
-						<dd id="metaTitle">-</dd>
-					</div>
-					<div>
-						<dt>作者</dt>
-						<dd id="metaAuthor">-</dd>
-					</div>
-					<div hidden>
-						<dt>主题</dt>
-						<dd id="metaSubject"></dd>
-					</div>
-					<div hidden>
-						<dt>摘要</dt>
-						<dd id="metaAbstract"></dd>
-					</div>
-					<div hidden>
-						<dt>关键词</dt>
-						<dd id="metaKeywords"></dd>
-					</div>
-					<div hidden>
-						<dt>文档标识</dt>
-						<dd id="metaDocId"></dd>
-					</div>
-					<div hidden>
-						<dt>文档用途</dt>
-						<dd id="metaDocUsage"></dd>
-					</div>
-					<div hidden>
-						<dt>封面路径</dt>
-						<dd id="metaCover"></dd>
-					</div>
-					<div hidden>
-						<dt>创建日期</dt>
-						<dd id="metaCreationDate"></dd>
-					</div>
-					<div hidden>
-						<dt>修改日期</dt>
-						<dd id="metaModDate"></dd>
-					</div>
-					<div hidden>
-						<dt>制作软件</dt>
-						<dd id="metaCreator"></dd>
-					</div>
-					<div hidden>
-						<dt>软件版本</dt>
-						<dd id="metaCreatorVersion"></dd>
-					</div>
-				</dl>
-				<dl id="metaCustomData" class="meta-list" hidden></dl>
-				<dl class="meta-list">
-					<div>
-						<dt>文档类型</dt>
-						<dd id="metaType">-</dd>
-					</div>
-					<div>
-						<dt>格式版本</dt>
-						<dd id="metaVersion">-</dd>
-					</div>
-					<div>
-						<dt>签名数量</dt>
-						<dd id="metaSignatures">0</dd>
-					</div>
-					<div>
-						<dt>字体数量</dt>
-						<dd id="metaFonts">0</dd>
-					</div>
-				</dl>
+				<div class="document-info">
+					<dl class="meta-list">
+						<div>
+							<dt>文件</dt>
+							<dd id="metaFile">-</dd>
+						</div>
+						<div>
+							<dt>标题</dt>
+							<dd id="metaTitle">-</dd>
+						</div>
+						<div>
+							<dt>作者</dt>
+							<dd id="metaAuthor">-</dd>
+						</div>
+						<div hidden>
+							<dt>主题</dt>
+							<dd id="metaSubject"></dd>
+						</div>
+						<div hidden>
+							<dt>摘要</dt>
+							<dd id="metaAbstract"></dd>
+						</div>
+						<div hidden>
+							<dt>关键词</dt>
+							<dd id="metaKeywords"></dd>
+						</div>
+					</dl>
+					<details><summary>文档属性</summary>
+						<dl class="meta-list">
+							<div hidden>
+								<dt>标识</dt>
+								<dd id="metaDocId"></dd>
+							</div>
+							<div hidden>
+								<dt>用途</dt>
+								<dd id="metaDocUsage"></dd>
+							</div>
+							<div hidden>
+								<dt>封面</dt>
+								<dd id="metaCover"></dd>
+							</div>
+							<div hidden>
+								<dt>创建</dt>
+								<dd id="metaCreationDate"></dd>
+							</div>
+							<div hidden>
+								<dt>修改</dt>
+								<dd id="metaModDate"></dd>
+							</div>
+							<div hidden>
+								<dt>软件</dt>
+								<dd id="metaCreator"></dd>
+							</div>
+							<div hidden>
+								<dt>版本</dt>
+								<dd id="metaCreatorVersion"></dd>
+							</div>
+						</dl>
+					</details>
+					<details><summary>扩展字段</summary><dl id="metaCustomData" class="meta-list" hidden></dl></details>
+					<details><summary>格式信息</summary>
+						<dl class="meta-list">
+							<div>
+								<dt>类型</dt>
+								<dd id="metaType">-</dd>
+							</div>
+							<div>
+								<dt>版本</dt>
+								<dd id="metaVersion">-</dd>
+							</div>
+							<div>
+								<dt>签名</dt>
+								<dd id="metaSignatures">0</dd>
+							</div>
+							<div>
+								<dt>字体</dt>
+								<dd id="metaFonts">0</dd>
+							</div>
+						</dl>
+					</details>
+				</div>
 				<details id="conversionNotice" class="conversion-notice" hidden>
 					<summary>提示</summary>
 					<div id="conversionWarnings" class="panel-detail"></div>
@@ -897,10 +905,6 @@
 					<div class="panel-row"><div id="securityPanelTitle" class="panel-title compact">安全</div><div class="panel-actions"><button id="encryptSaveButton" class="small-button" type="button" disabled>加密</button><button id="signButton" class="small-button" type="button" disabled>签章</button><button id="verifyButton" class="small-button" type="button" disabled>验签</button></div></div>
 					<dl class="meta-list"><div><dt>加密</dt><dd id="securityEncryption">未加密</dd></div><div id="securitySchemeRow" hidden><dt>方式</dt><dd id="securityScheme"></dd></div><div id="securityMethodRow" hidden><dt>算法</dt><dd id="securityMethod"></dd></div></dl>
 				</section>
-				<section id="structurePanel" class="structure-panel" hidden>
-					<div class="panel-row"><div id="structurePanelTitle" class="panel-title compact">结构</div><div class="panel-actions"><span id="structureSummary" class="count-pill">0</span><button id="structureManage" class="small-button" type="button" hidden>管理</button></div></div>
-					<div id="structureList" class="structure-list"></div>
-				</section>
 				<section id="signaturePanel" class="signature-panel" hidden>
 					<div class="panel-row">
 						<div id="signaturePanelTitle" class="panel-title compact">签名</div>
@@ -908,6 +912,10 @@
 					</div>
 					<div id="signatureList" class="signature-list"></div>
 				</section>
+				<section id="structurePanel" class="structure-panel" hidden>
+					<div class="panel-row"><div id="structurePanelTitle" class="panel-title compact">结构</div><div class="panel-actions"><span id="structureSummary" class="count-pill">0</span><button id="structureManage" class="small-button" type="button" hidden>管理</button></div></div>
+					<div id="structureList" class="structure-list"></div>
+				</section>
 				<section class="doc-font-panel">
 					<div class="panel-row">
 						<div id="docFontPanelTitle" class="panel-title compact">文档字体</div>
diff --git a/assets/webui/ofdgo.css b/assets/webui/ofdgo.css
index c893b98..d250943 100644
--- a/assets/webui/ofdgo.css
+++ b/assets/webui/ofdgo.css
@@ -1889,6 +1889,33 @@ body[data-hide-meta] .meta-panel {
 	border-left: 1px solid var(--line);
 }
 
+.meta-panel .panel-row {
+	display: grid;
+	grid-template-columns: auto minmax(0, 1fr);
+	align-items: start;
+	margin-bottom: 8px;
+}
+
+.meta-panel .panel-title {
+	display: flex;
+	align-items: center;
+	min-height: 26px;
+}
+
+.meta-panel .panel-actions {
+	min-width: 0;
+	justify-self: end;
+}
+
+.meta-panel .count-pill {
+	justify-self: end;
+	max-width: 100%;
+	min-height: 26px;
+	height: auto;
+	white-space: normal;
+	overflow-wrap: anywhere;
+}
+
 .panel-title {
 	margin-bottom: 10px;
 	font-size: 12px;
@@ -3800,7 +3827,7 @@ audio.page-media {
 
 .meta-list {
 	display: grid;
-	gap: 7px;
+	gap: 8px;
 	margin: 0;
 	font-size: 12px;
 	line-height: 1.5;
@@ -3810,7 +3837,11 @@ audio.page-media {
 	display: grid;
 	grid-template-columns: 4em minmax(0, 1fr);
 	align-items: start;
-	gap: 7px;
+	gap: 8px;
+}
+
+.security-panel .meta-list > div {
+	grid-template-columns: 2em minmax(0, 1fr);
 }
 
 .meta-list dt {
@@ -3819,7 +3850,6 @@ audio.page-media {
 }
 
 .meta-list:not(#metaCustomData) dt {
-	text-align-last: justify;
 	white-space: nowrap;
 }
 
@@ -3829,8 +3859,16 @@ audio.page-media {
 	white-space: pre-wrap;
 }
 
-.meta-list + .meta-list:not([hidden]) {
-	margin-top: 12px;
+.document-info .meta-list > div {
+	grid-template-columns: 3em minmax(0, 1fr);
+}
+
+.document-info details:not(:has(.meta-list > div:not([hidden]))) {
+	display: none;
+}
+
+.document-info details[open] > .meta-list {
+	margin-top: 8px;
 }
 
 #metaKeywords > span {
@@ -3842,7 +3880,7 @@ audio.page-media {
 .signature-panel,
 .structure-panel,
 .security-panel {
-	margin-top: 18px;
+	margin-top: 12px;
 	padding-top: 12px;
 	border-top: 1px solid var(--line);
 }
@@ -3886,6 +3924,7 @@ audio.page-media {
 	gap: 8px;
 }
 
+.document-info,
 .doc-font-row,
 .signature-row {
 	display: grid;
@@ -4080,16 +4119,15 @@ audio.page-media {
 
 .meta-panel .info-line {
 	grid-template-columns: 4em minmax(0, 1fr);
+	gap: 8px;
 }
 
-.meta-panel .info-label {
-	text-align-last: justify;
-}
-
+.document-info details,
 .signature-row details {
 	font-size: 12px;
 }
 
+.document-info summary,
 .signature-row summary {
 	cursor: pointer;
 	color: var(--accent-strong);