feat(前端界面): 恢复原版界面，保留全属性编辑

2026-10-29 08:46:55 +08:00 · 2026-10-25 22:38:31 +08:00
1 parent 4573cb942b
commit 7414a00305
@@ -801,116 +801,79 @@
 				</div>
 			</section>

-			<aside class="meta-panel" data-empty="true">
-				<div id="metaDocumentPanel">
-					<div class="panel-row">
-						<div class="panel-title compact">文档</div>
-						<div class="panel-actions">
-							<button id="resourceManageButton" class="small-button" type="button" disabled>资源</button>
-							<button id="settingsButton" class="small-button" type="button" disabled>配置</button>
-							<button id="invoiceButton" class="small-button" type="button" hidden disabled>发票</button>
-							<button id="documentManageButton" class="small-button" type="button" hidden>管理</button>
-							<button id="versionManageButton" class="small-button" type="button" hidden>版本</button>
-						</div>
+			<aside class="meta-panel">
+				<div class="panel-row">
+					<div class="panel-title compact">文档</div>
+					<div class="panel-actions">
+						<button id="resourceManageButton" class="small-button" type="button" disabled>资源</button>
+						<button id="settingsButton" class="small-button" type="button" disabled>配置</button>
+						<button id="invoiceButton" class="small-button" type="button" hidden disabled>发票</button>
+						<button id="documentManageButton" class="small-button" type="button" hidden>管理</button>
+						<button id="versionManageButton" class="small-button" type="button" hidden>版本</button>
 					</div>
-					<div id="editNotice" class="font-permission-hint" hidden></div>
-					<div id="documentRow" class="document-row" hidden>
-						<select id="documentSelect" class="document-select" title="切换文档"></select>
-					</div>
-					<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="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>
-								<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>
-							</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>
-					</details>
-					<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>
 				</div>
+				<div id="editNotice" class="font-permission-hint" hidden></div>
+				<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 hidden>
+						<dt>主题</dt>
+						<dd id="metaSubject"></dd>
+					</div>
+					<div>
+						<dt>作者</dt>
+						<dd id="metaAuthor">-</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>
+						<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 id="conversionNotice" class="conversion-notice" hidden>
+					<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="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>
@@ -918,7 +881,7 @@
 					</div>
 					<div id="signatureList" class="signature-list"></div>
 				</section>
-				<section id="docFontPanel" class="doc-font-panel" hidden>
+				<section class="doc-font-panel">
 					<div class="panel-row">
 						<div id="docFontPanelTitle" class="panel-title compact">文档字体</div>
 						<span id="docFontSummary" class="count-pill">0</span>
@@ -935,7 +898,7 @@
 							<button id="fontDirectoryButton" class="small-button" type="button">目录</button>
 						</div>
 					</div>
-					<div id="fontPermissionHint" class="font-permission-hint" hidden>系统字体未授权</div>
+						<div id="fontPermissionHint" class="font-permission-hint" hidden>系统字体未授权</div>
 					<div id="fontList" class="font-list"></div>
 				</section>
 			</aside>
@@ -1885,43 +1885,6 @@ body[data-hide-meta] .meta-panel {
 	border-left: 1px solid var(--line);
 }

-.meta-panel[data-empty="true"] #metaDocumentPanel {
-	display: none;
-}
-
-.meta-panel[data-empty="true"] > .font-panel {
-	margin-top: 0;
-	padding-top: 0;
-	border-top: 0;
-}
-
-.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;
@@ -3833,52 +3796,24 @@ audio.page-media {

 .meta-list {
 	display: grid;
-	gap: 8px;
+	gap: 12px;
 	margin: 0;
-	font-size: 12px;
-	line-height: 1.5;
 }

-.meta-list > div {
+.meta-list div {
 	display: grid;
-	grid-template-columns: 4em minmax(0, 1fr);
-	align-items: start;
-	gap: 8px;
-}
-
-.security-panel .meta-list > div {
-	grid-template-columns: 2em minmax(0, 1fr);
+	gap: 3px;
 }

 .meta-list dt {
+	font-size: 12px;
 	color: var(--text-muted);
-	overflow-wrap: anywhere;
-}
-
-.meta-list:not(#metaCustomData) dt {
-	white-space: nowrap;
 }

 .meta-list dd {
 	margin: 0;
 	overflow-wrap: anywhere;
-	white-space: pre-wrap;
-}
-
-.document-info .meta-list:not(#metaCustomData) dt {
-	text-align-last: justify;
-}
-
-.document-info details:not(:has(.meta-list > div:not([hidden]))) {
-	display: none;
-}
-
-.document-info details[open] > .meta-list {
-	margin-top: 8px;
-}
-
-#metaKeywords > span {
-	display: block;
+	line-height: 1.35;
 }

 .font-panel,
@@ -3886,7 +3821,7 @@ audio.page-media {
 .signature-panel,
 .structure-panel,
 .security-panel {
-	margin-top: 12px;
+	margin-top: 18px;
 	padding-top: 12px;
 	border-top: 1px solid var(--line);
 }
@@ -3930,7 +3865,6 @@ audio.page-media {
 	gap: 8px;
 }

-.document-info,
 .doc-font-row,
 .signature-row {
 	display: grid;
@@ -4125,19 +4059,16 @@ audio.page-media {

 .meta-panel .info-line {
 	grid-template-columns: 4em minmax(0, 1fr);
-	gap: 8px;
 }

-.signature-row .info-label {
+.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);
@@ -597,20 +597,13 @@ const el = {
 	refreshAppButton: document.querySelector("#refreshAppButton"),
 	metaFile: document.querySelector("#metaFile"),
 	metaTitle: document.querySelector("#metaTitle"),
-	metaAuthor: document.querySelector("#metaAuthor"),
+	conversionNotice: document.querySelector("#conversionNotice"),
+	conversionWarnings: document.querySelector("#conversionWarnings"),
 	metaSubject: document.querySelector("#metaSubject"),
-	metaAbstract: document.querySelector("#metaAbstract"),
-	metaKeywords: document.querySelector("#metaKeywords"),
+	metaAuthor: document.querySelector("#metaAuthor"),
 	metaCreationDate: document.querySelector("#metaCreationDate"),
 	metaModDate: document.querySelector("#metaModDate"),
 	metaCreator: document.querySelector("#metaCreator"),
-	metaCreatorVersion: document.querySelector("#metaCreatorVersion"),
-	metaDocId: document.querySelector("#metaDocId"),
-	metaDocUsage: document.querySelector("#metaDocUsage"),
-	metaCover: document.querySelector("#metaCover"),
-	metaCustomData: document.querySelector("#metaCustomData"),
-	conversionNotice: document.querySelector("#conversionNotice"),
-	conversionWarnings: document.querySelector("#conversionWarnings"),
 	metaType: document.querySelector("#metaType"),
 	metaVersion: document.querySelector("#metaVersion"),
 	metaSignatures: document.querySelector("#metaSignatures"),
@@ -665,7 +658,6 @@ const el = {
 	annotationClose: document.querySelector("#annotationClose"),
 	annotationSubmit: document.querySelector("#annotationSubmit"),
 	annotationDetail: document.querySelector("#annotationDetail"),
-	docFontPanel: document.querySelector("#docFontPanel"),
 	docFontList: document.querySelector("#docFontList"),
 	docFontSummary: document.querySelector("#docFontSummary"),
 	availableFontSummary: document.querySelector("#availableFontSummary"),
@@ -2944,6 +2936,7 @@ async function mountDocumentTab(tab) {
 		if (view?.anchor) restoreScaleAnchor(view.anchor);
 		showNavigation(view?.navigation || el.pagesTab);
 		el.navigationContent.scrollTop = view?.navigationTop || 0;
+		el.metaPanel.scrollTop = view?.metaTop || 0;
 		canvasEditor.setTool(view?.tool || "");
 	} else {
 		renderPageList();
@@ -2954,7 +2947,6 @@ async function mountDocumentTab(tab) {
 	}
 	renderFontList();
 	updateFontSummary();
-	el.metaPanel.scrollTop = tab.view?.metaTop || 0;
 	updateControls();
 	tab.controlsPending = false;
 	setStatus(tab.status);
@@ -12638,43 +12630,23 @@ function renderMeta(keepDetails = false) {
 	el.metaPanel.setAttribute("data-busy", String(!!doc.detailsPending));
 	document.title = `${nativeHost ? "OFDGo" : "OFDGo WebUI"} - ${state.doc ? state.fileName : "OFD编辑器"}`;
 	el.metaFile.textContent = state.doc ? state.fileName : "-";
+	el.metaTitle.textContent = doc.title || "-";
+	el.metaAuthor.textContent = doc.author || "-";
 	for (const [field, value] of [
-		[el.metaTitle, doc.title || ""],
-		[el.metaAuthor, doc.author || ""],
-		[el.metaSubject, doc.subject || ""],
-		[el.metaAbstract, doc.abstract || ""],
+		[el.metaSubject, (doc.subject || "").trim()],
 		[el.metaCreationDate, formatDocumentTime(doc.creationDate)],
 		[el.metaModDate, formatDocumentTime(doc.modDate)],
-		[el.metaCreator, doc.creator || ""],
-		[el.metaCreatorVersion, doc.creatorVersion || ""],
-		[el.metaDocId, doc.docId || ""],
-		[el.metaDocUsage, doc.docUsage || ""],
-		[el.metaCover, doc.cover || ""],
-		[el.metaType, doc.docType || ""],
-		[el.metaVersion, doc.version || ""],
+		[el.metaCreator, [doc.creator, doc.creatorVersion].filter(Boolean).join(" ")],
 	]) {
 		field.textContent = value;
 		field.parentElement.hidden = !value;
 	}
-	el.metaKeywords.replaceChildren(...(doc.keywords || []).map(keyword => {
-		const item = document.createElement("span");
-		item.textContent = keyword || "-";
-		return item;
-	}));
-	el.metaKeywords.parentElement.hidden = !doc.keywords?.length;
-	el.metaCustomData.replaceChildren(...(doc.customData || []).map(field => {
-		const row = document.createElement("div"), name = document.createElement("dt"), value = document.createElement("dd");
-		name.textContent = field.Name || "-";
-		value.textContent = field.Value || "-";
-		row.append(name, value);
-		return row;
-	}));
-	el.metaCustomData.hidden = !doc.customData?.length;
+	el.metaType.textContent = doc.docType || "-";
+	el.metaVersion.textContent = doc.version || "-";
+	el.metaFonts.textContent = String(doc.fontCount || 0);
 	el.pageTotal.textContent = String(doc.pageCount || 0);
 	if (keepDetails && doc.detailsPending) return;
-	const detailsStatus = doc.detailsPending ? "读取中" : doc.detailsError ? "读取失败" : "";
-	el.metaSignatures.textContent = detailsStatus || String(doc.signatureCount || 0);
-	el.metaFonts.textContent = detailsStatus || String(doc.fontCount || 0);
+	el.metaSignatures.textContent = doc.detailsPending ? "正在检查签名" : doc.detailsError ? "读取失败" : String(doc.signatureCount || 0);
 	renderMetaContent(el.signatureList, [doc.signatures, doc.signatureError], renderSignatures);
 	updateStructureControls();
 	renderMetaContent(el.docFontList, doc.fonts || [], renderDocumentFonts);
@@ -13266,10 +13238,15 @@ function mountAnnotationNotes(index, surface, annotations) {

 function renderDocumentFonts() {
 	const fonts = state.doc?.fonts || [];
-	el.docFontPanel.hidden = !fonts.length;
 	el.docFontList.replaceChildren();
 	el.docFontSummary.textContent = fontSummary(fonts);
-	if (!fonts.length) return;
+	if (!fonts.length) {
+		const empty = document.createElement("div");
+		empty.className = "font-empty";
+		empty.textContent = "暂无字体";
+		el.docFontList.append(empty);
+		return;
+	}
 	const fragment = document.createDocumentFragment();
 	for (const font of fonts) {
 		const row = document.createElement("div");
@@ -13718,7 +13695,6 @@ function updateInvoiceControl(disabled) {

 function updateDocumentControls() {
 	const count = state.doc?.documents?.length || 0, index = managedDocumentIndex(), manager = state.documentManagement;
-	el.metaPanel.setAttribute("data-empty", String(!state.doc));
 	const busy = document.body.hasAttribute("data-busy");
 	const disabled = !state.doc || !state.ready || state.exporting || busy;
 	el.printButton.disabled = disabled;