feat(创建写入): 支持对象复制与层级调整

assets/webui/index.html

@@ -58,7 +58,15 @@
 			<div class="editor-group">
 				<button id="selectObjectButton" class="button" type="button" aria-pressed="true">选择</button>
 				<button id="editTextButton" class="button" type="button" aria-label="修改文字" disabled>修改</button>
+				<button id="copyObjectButton" class="button" type="button" aria-label="复制对象" disabled>复制</button>
 				<button id="deleteObjectButton" class="button" type="button" disabled>删除</button>
+				<select id="objectOrder" class="order-select" aria-label="对象层级" disabled>
+					<option value="" hidden>层级</option>
+					<option value="up">上移</option>
+					<option value="down">下移</option>
+					<option value="top">置顶</option>
+					<option value="bottom">置底</option>
+				</select>
 				<span>对象</span>
 			</div>
 			<div class="editor-group">

assets/webui/ofdgo.css

@@ -104,6 +104,10 @@ a:focus-visible {
 	border-right: 1px solid var(--line);
 }
 
+.editor-group:has(#selectObjectButton) {
+	grid-template-columns: repeat(5, max-content);
+}
+
 .editor-group:has(#insertTextButton) {
 	grid-template-columns: repeat(2, max-content);
 }
@@ -116,12 +120,14 @@ a:focus-visible {
 	border-right: 0;
 }
 
-.editor-group > button {
+.editor-group > button,
+.editor-group > select {
 	grid-row: 1;
 }
 
 .editor-group > span {
 	grid-column: 1 / -1;
+	align-self: end;
 	text-align: center;
 	font-size: 12px;
 	color: var(--text-muted);
@@ -314,7 +320,8 @@ button:not(:disabled):hover {
 	margin: 0;
 }
 
-.format-select {
+.format-select,
+.order-select {
 	width: 58px;
 	height: var(--control-height);
 	min-width: 0;
@@ -424,8 +431,26 @@ button:not(:disabled):hover {
 }
 
 .form-row input[type="file"] {
-	height: auto;
-	padding: 4px;
+	padding: 0;
+	color: var(--text-muted);
+}
+
+.form-row input[type="file"]::file-selector-button {
+	height: 100%;
+	margin: 0 8px 0 0;
+	padding: 0 8px;
+	border: 0;
+	border-right: 1px solid var(--line);
+	border-radius: 0;
+	background: var(--panel);
+	color: #1f2428;
+	font: inherit;
+	cursor: pointer;
+}
+
+.form-row input[type="file"]::file-selector-button:hover {
+	background: #e4f3ef;
+	color: var(--accent-strong);
 }
 
 .form-unit {
@@ -475,13 +500,16 @@ button:not(:disabled):hover {
 }
 
 .format-select:focus,
-.format-select:focus-visible {
+.format-select:focus-visible,
+.order-select:focus,
+.order-select:focus-visible {
 	border-color: var(--accent);
 	outline: 2px solid var(--accent);
 	outline-offset: 2px;
 }
 
-.format-select option:checked {
+.format-select option:checked,
+.order-select option:checked {
 	background-color: #e4f3ef;
 	color: var(--accent-strong);
 }

assets/webui/ofdgo.js

@@ -1,4 +1,4 @@
-import { CanvasEditor } from "./ofdgo_edit.js";
+import { CanvasEditor, objectTransform } from "./ofdgo_edit.js";
 import { FontManager } from "./ofdgo_font.js";
 
 const MM_TO_PX = 96 / 25.4;
@@ -87,6 +87,8 @@ const el = {
 	selectObjectButton: document.querySelector("#selectObjectButton"),
 	deleteObjectButton: document.querySelector("#deleteObjectButton"),
 	editTextButton: document.querySelector("#editTextButton"),
+	copyObjectButton: document.querySelector("#copyObjectButton"),
+	objectOrder: document.querySelector("#objectOrder"),
 	undoButton: document.querySelector("#undoButton"),
 	redoButton: document.querySelector("#redoButton"),
 	insertTextButton: document.querySelector("#insertTextButton"),
@@ -247,6 +249,27 @@ el.editTextButton.addEventListener("click", () => {
 		openInsertPanel(true, canvasEditor.selected);
 	}
 });
+el.copyObjectButton.addEventListener("click", () => {
+	const item = canvasEditor.selected;
+	if (!item) {
+		return;
+	}
+	let change = objectTransform(item, item.page, 3, 3);
+	if (!change.x && !change.y) {
+		change = objectTransform(item, item.page, -3, -3);
+	}
+	return changeDocument("ofdgoCopyObject", item, change.x, change.y);
+});
+el.objectOrder.addEventListener("change", () => {
+	const action = el.objectOrder.value;
+	el.objectOrder.value = "";
+	const item = canvasEditor.selected;
+	if (!item || !action) {
+		return;
+	}
+	const targets = { up: item.order + 1, down: item.order - 1, top: item.count - 1, bottom: 0 };
+	return changeDocument("ofdgoMoveObject", item, targets[action]);
+});
 el.undoButton.addEventListener("click", () => changeDocument("ofdgoUndo"));
 el.redoButton.addEventListener("click", () => changeDocument("ofdgoRedo"));
 el.addPageButton.addEventListener("click", () => {
@@ -720,6 +743,9 @@ async function changeDocument(name, item, ...args) {
 		if (!item || name === "ofdgoDeleteObject") {
 			canvasEditor.clear();
 		}
+		if (name === "ofdgoCopyObject") {
+			canvasEditor.selectLast = true;
+		}
 		openSeq = ++state.openSeq;
 		if (item) {
 			await refreshEditorPage(doc, item.index, openSeq);
@@ -3771,8 +3797,13 @@ function updateEditorTools() {
 }
 
 function updateObjectControls(item) {
-	el.deleteObjectButton.disabled = !item || !state.ready || state.exporting;
+	const disabled = !item || !state.ready || state.exporting;
+	el.deleteObjectButton.disabled = el.copyObjectButton.disabled = disabled;
 	el.editTextButton.disabled = !item || item.image || !state.ready || state.exporting;
+	el.objectOrder.disabled = disabled || item.count <= 1;
+	for (const option of el.objectOrder.options) {
+		option.disabled = disabled || (["up", "top"].includes(option.value) ? item.order === item.count - 1 : item.order === 0);
+	}
 }
 
 function updateAnnotationButton() {