feat(前端界面): 新增安全标签，集中加密与签名

assets/webui/index.html

@@ -805,6 +805,7 @@
 				<div id="metaTabs" class="navigation-tabs">
 					<button id="documentMetaTab" type="button" data-selected="true">文档</button>
 					<button id="fontsMetaTab" type="button" data-selected="false" tabindex="-1">字体</button>
+					<button id="securityMetaTab" type="button" data-selected="false" tabindex="-1">安全</button>
 				</div>
 				<div id="metaContent" class="meta-content">
 					<div id="metaDocumentPanel">
@@ -904,17 +905,6 @@
 							<summary>提示</summary>
 							<div id="conversionWarnings" class="panel-detail"></div>
 						</details>
-						<section id="securityPanel" class="security-panel" hidden>
-							<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="signaturePanel" class="signature-panel" hidden>
-							<div class="panel-row">
-								<div id="signaturePanelTitle" class="panel-title compact">签名</div>
-								<span id="signatureSummary" class="count-pill">0</span>
-							</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>
@@ -942,6 +932,19 @@
 							<div id="fontList" class="font-list"></div>
 						</section>
 					</div>
+					<div id="metaSecurityPanel" hidden>
+						<section id="securityPanel" class="security-panel" hidden>
+							<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="signaturePanel" class="signature-panel" hidden>
+							<div class="panel-row">
+								<div id="signaturePanelTitle" class="panel-title compact">签名</div>
+								<span id="signatureSummary" class="count-pill">0</span>
+							</div>
+							<div id="signatureList" class="signature-list"></div>
+						</section>
+					</div>
 				</div>
 			</aside>
 		</main>

assets/webui/ofdgo.css

@@ -1896,7 +1896,8 @@ body[data-hide-meta] .meta-panel {
 	margin-bottom: 12px;
 }
 
-#metaFontsPanel > .doc-font-panel {
+#metaFontsPanel > .doc-font-panel,
+#metaSecurityPanel > .security-panel {
 	margin-top: 0;
 	padding-top: 0;
 	border-top: 0;

assets/webui/ofdgo.js

@@ -184,7 +184,7 @@ function createDocumentState() {
 		showPages: !COMPACT_LAYOUT.matches,
 		showMeta: !COMPACT_LAYOUT.matches,
 		metaTab: "document",
-		metaScroll: {document: 0, fonts: 0},
+		metaScroll: {document: 0, fonts: 0, security: 0},
 	};
 }
 
@@ -598,8 +598,10 @@ const el = {
 	metaContent: document.querySelector("#metaContent"),
 	documentMetaTab: document.querySelector("#documentMetaTab"),
 	fontsMetaTab: document.querySelector("#fontsMetaTab"),
+	securityMetaTab: document.querySelector("#securityMetaTab"),
 	metaDocumentPanel: document.querySelector("#metaDocumentPanel"),
 	metaFontsPanel: document.querySelector("#metaFontsPanel"),
+	metaSecurityPanel: document.querySelector("#metaSecurityPanel"),
 	renderVectorButton: document.querySelector("#renderVectorButton"),
 	renderRasterButton: document.querySelector("#renderRasterButton"),
 	refreshAppButton: document.querySelector("#refreshAppButton"),
@@ -1745,9 +1747,10 @@ el.outlinesTab.addEventListener("click", () => showNavigation(el.outlinesTab));
 el.searchTab.addEventListener("click", focusSearch);
 el.documentMetaTab.addEventListener("click", () => showMetaSection(el.documentMetaTab));
 el.fontsMetaTab.addEventListener("click", () => showMetaSection(el.fontsMetaTab));
+el.securityMetaTab.addEventListener("click", () => showMetaSection(el.securityMetaTab));
 for (const [container, buttons, show] of [
 	[el.navigationTabs, [el.pagesTab, el.outlinesTab, el.annotationsTab, el.searchTab], showNavigation],
-	[el.metaTabs, [el.documentMetaTab, el.fontsMetaTab], showMetaSection],
+	[el.metaTabs, [el.documentMetaTab, el.fontsMetaTab, el.securityMetaTab], showMetaSection],
 ]) container.addEventListener("keydown", (event) => {
 	if (event.isComposing || event.altKey || event.ctrlKey || event.metaKey || event.shiftKey) {
 		return;
@@ -6532,7 +6535,7 @@ async function openDocument(options = {}) {
 			el.navigationContent.scrollLeft = 0;
 			el.navigationContent.scrollTop = 0;
 			state.metaTab = "document";
-			state.metaScroll = {document: 0, fonts: 0};
+			state.metaScroll = {document: 0, fonts: 0, security: 0};
 			el.metaContent.scrollLeft = 0;
 			renderMetaSections();
 		}
@@ -11636,12 +11639,12 @@ function focusSearch() {
 
 function showMetaSection(selected) {
 	state.metaScroll[state.metaTab] = el.metaContent.scrollTop;
-	state.metaTab = selected === el.fontsMetaTab ? "fonts" : "document";
+	state.metaTab = selected === el.securityMetaTab ? "security" : selected === el.fontsMetaTab ? "fonts" : "document";
 	renderMetaSections();
 }
 
 function renderMetaSections() {
-	for (const [tab, panel, name] of [[el.documentMetaTab, el.metaDocumentPanel, "document"], [el.fontsMetaTab, el.metaFontsPanel, "fonts"]]) {
+	for (const [tab, panel, name] of [[el.documentMetaTab, el.metaDocumentPanel, "document"], [el.fontsMetaTab, el.metaFontsPanel, "fonts"], [el.securityMetaTab, el.metaSecurityPanel, "security"]]) {
 		const active = name === state.metaTab;
 		panel.hidden = !active;
 		tab.setAttribute("data-selected", String(active));