Files
ofdgo/assets/webui/index.html
T

917 lines
76 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#fbfcfd">
<title>OFDGo WebUI - OFD编辑器</title>
<link rel="manifest" href="./ofdgo.json">
<link rel="icon" type="image/x-icon" sizes="16x16 32x32 48x48 64x64 128x128 256x256" href="./ofdgo.ico">
<link rel="icon" type="image/svg+xml" href="./ofdgo.svg">
<link rel="stylesheet" href="./ofdgo.css">
</head>
<body>
<div class="app">
<div id="documentTitleBar" class="document-titlebar">
<div id="documentTabs" class="document-tabs"></div>
<button id="documentNewTab" class="document-new-tab" type="button" title="新建"><span class="new-icon"></span></button>
<div class="document-title-drag"></div>
<button id="refreshAppButton" class="app-update" type="button" title="更新" hidden><span class="update-icon"></span></button>
</div>
<header class="toolbar-frame">
<div class="toolbar app-bar">
<input id="ofdInput" class="file-input" type="file" accept=".ofd,.pdf" multiple>
<input id="fontInput" class="file-input" type="file" accept=".ttf,.otf,.ttc,font/*" multiple>
<input id="fontDirectoryInput" class="file-input" type="file" webkitdirectory multiple>
<div class="tool-group">
<button id="ofdButton" class="icon-button" type="button" title="打开"><span class="open-icon"></span></button>
<button id="closeButton" class="icon-button" type="button" title="关闭文档" disabled><span class="close-icon"></span></button>
<button id="newButton" class="icon-button" type="button" title="新建"><span class="new-icon"></span></button>
<button id="saveButton" class="icon-button" type="button" title="保存" disabled><span class="save-icon"></span></button>
<button id="saveAsButton" class="icon-button" type="button" title="另存" disabled><span class="save-as-icon"></span></button>
<button id="editButton" class="icon-button" type="button" title="编辑" data-pressed="false" disabled><span class="edit-icon"></span></button>
<button id="convertButton" class="icon-button" type="button" title="转换"><span class="convert-icon"></span></button>
<button id="printButton" class="icon-button" type="button" title="打印" disabled><span class="print-icon"></span></button>
<button id="togglePagesButton" class="icon-button" type="button" title="页面栏" data-pressed="true"><span class="pages-icon"></span></button>
<button id="toggleMetaButton" class="icon-button" type="button" title="信息栏" data-pressed="true"><span class="info-icon"></span></button>
</div>
<div class="toolbar-space"></div>
<div class="tool-group">
<button id="prevButton" class="icon-button arrow-prev" type="button" title="上一页" disabled></button>
<label class="page-control">
<input id="pageInput" type="number" min="1" value="0" disabled>
<span>/</span>
<span id="pageTotal">0</span>
</label>
<button id="nextButton" class="icon-button arrow-next" type="button" title="下一页" disabled></button>
</div>
<div class="tool-group">
<button id="zoomOutButton" class="icon-button" type="button" title="缩小" disabled>-</button>
<span id="zoomLabel" class="zoom-label">100%</span>
<button id="zoomInButton" class="icon-button" type="button" title="放大" disabled>+</button>
<button id="fitButton" class="button" type="button" data-short="宽" disabled>适宽</button>
<button id="fitHeightButton" class="button" type="button" data-short="高" disabled>适高</button>
<button id="rotateButton" class="button" type="button" data-short="转" disabled>旋转</button>
<button id="panButton" class="button" type="button" data-short="拖" data-pressed="false" disabled>拖动</button>
</div>
<div class="tool-group">
<button id="pageLayoutButton" class="button" type="button" data-short="单" disabled>单页</button>
<button id="continuousButton" class="button" type="button" data-short="连" data-pressed="false" disabled>连续</button>
<button id="annotationButton" class="button" type="button" data-short="注" data-pressed="true">注解</button>
<button id="renderVectorButton" class="button" type="button" data-short="矢" data-pressed="true" disabled>矢量</button>
<button id="renderRasterButton" class="button" type="button" data-short="位" data-pressed="false" disabled>位图</button>
</div>
<div class="tool-group">
<label class="toolbar-select"><select id="exportFormat" class="format-select" title="导出格式" disabled></select><span id="formatValue"></span></label>
<label class="toolbar-select"><select id="imageDPI" class="format-select" title="输出精度" disabled>
<option value="96">96 DPI</option>
<option value="150">150 DPI</option>
<option value="300" selected>300 DPI</option>
<option value="600">600 DPI</option>
</select><span id="dpiValue">300</span></label>
<label class="toolbar-select"><select id="outputCompression" class="format-select" title="压缩模式" disabled><option value="0">原始</option><option value="1">无损</option><option value="2">轻压</option><option value="3">均衡</option><option value="4">强压</option></select><span id="compressionValue" data-short="原">原始</span></label>
<button id="exportPageButton" class="button" type="button" data-short="单" disabled>单页</button>
<button id="exportButton" class="button" type="button" data-short="多" disabled>文档</button>
</div>
</div>
</header>
<div id="editorTools" class="editor-toolbar" hidden>
<div class="editor-group editor-actions">
<button id="undoButton" class="button" type="button" disabled>撤销</button>
<button id="redoButton" class="button" type="button" disabled>重做</button>
<span>操作</span>
</div>
<div class="editor-group editor-objects">
<button id="selectObjectButton" class="button" type="button" data-pressed="true">选择</button>
<button id="multiSelectButton" class="button" type="button" data-pressed="false">多选</button>
<button id="editObjectButton" class="button" type="button" disabled>修改</button>
<button id="copyObjectButton" class="button" type="button" disabled>复制</button>
<button id="deleteObjectButton" class="button" type="button" disabled>删除</button>
<select id="objectOrder" class="order-select" disabled>
<option value="" hidden>层级</option>
<option value="up">上移</option>
<option value="down">下移</option>
<option value="top">置顶</option>
<option value="bottom">置底</option>
</select>
<select id="objectAlign" class="order-select" disabled>
<option value="" hidden>对齐</option>
<option value="left">左侧</option>
<option value="center">水平</option>
<option value="right">右侧</option>
<option value="top">顶部</option>
<option value="middle">垂直</option>
<option value="bottom">底部</option>
</select>
<select id="objectDistribute" class="order-select" disabled>
<option value="" hidden>分布</option>
<option value="horizontal">水平</option>
<option value="vertical">垂直</option>
</select>
<button id="objectStyleButton" class="editor-group-action" type="button" disabled>对象</button>
</div>
<div class="editor-group">
<button id="insertTextButton" class="button" type="button" data-pressed="false">文字</button>
<button id="insertImageButton" class="button" type="button">图片</button>
<button id="drawLineButton" class="button" type="button" data-pressed="false">直线</button>
<button id="drawRectangleButton" class="button" type="button" data-pressed="false">矩形</button>
<button id="drawEllipseButton" class="button" type="button" data-pressed="false">椭圆</button>
<select id="arrowTool" title="箭头"><option value="" hidden>箭头</option><option value="line">直线</option><option value="arrow">单向</option><option value="double-arrow">双向</option></select>
<select id="penTool" title="画笔"><option value="" hidden>画笔</option><option value="pen-round">圆笔</option><option value="pen-pressure">钢笔</option></select>
<select id="annotationTool" title="注解"><option value="" hidden>注解</option><option value="note">批注</option><option value="watermark">水印</option><option value="stamp">印章</option><option value="link">链接</option><option value="details">说明</option><option value="replace">替换</option><option value="objects">选取</option></select>
<span>插入</span>
</div>
<div class="editor-group">
<div class="text-font"><div class="font-picker"><input id="textFont" type="text" title="字体" autocomplete="off" spellcheck="false" disabled><button id="textFontToggle" type="button" title="选择字体" tabindex="-1" disabled></button></div><button id="textFontAdd" class="icon-button" type="button" title="添加字体">+</button></div>
<div id="textFontList" class="font-listbox" popover="manual"></div>
<label class="editor-field"><span>字号</span><span class="editor-number"><input id="textSize" type="number" min="1" step="any" required disabled><span>pt</span></span></label>
<button id="textBold" class="button text-format-bold" data-text-format="bold" type="button" title="粗体" data-pressed="false" disabled>B</button>
<button id="textItalic" class="button text-format-italic" data-text-format="italic" type="button" title="斜体" data-pressed="false" disabled>I</button>
<button id="textUnderline" class="button text-format-underline" data-text-format="underline" type="button" title="下划线" data-pressed="false" disabled>U</button>
<button id="textStrikeout" class="button text-format-strikeout" data-text-format="strikeout" type="button" title="删除线" data-pressed="false" disabled>S</button>
<button id="textShadow" class="button text-format-shadow" data-text-format="shadow" type="button" title="阴影" data-pressed="false" disabled>A</button>
<div class="text-highlight"><button id="textHighlight" class="button" data-text-format="background" type="button" title="底色" data-pressed="false" disabled><span>A</span></button><input id="textBackground" class="color-input" type="color" value="#ffff00" title="选择底色" disabled></div>
<input id="textColor" class="color-input" type="color" value="#000000" title="文字颜色" disabled>
<span>文字</span>
</div>
<div class="editor-group editor-paragraph">
<select id="textAlign" title="段落对齐" disabled>
<option value="" hidden>原文</option>
<option value="left">左齐</option>
<option value="center">居中</option>
<option value="right">右齐</option>
<option value="justify">两端</option><option value="distributed">分散</option>
</select>
<label class="editor-field"><span>行距</span><span class="editor-number"><input id="textLineHeight" type="number" min="0" step="any" placeholder="自动" title="行距,0为自动" disabled><span>pt</span></span></label>
<button id="textWrap" class="button" type="button" data-pressed="false" disabled>折行</button>
<button id="textReflow" class="button" type="button" hidden>重排</button>
<label class="editor-field"><span>字距</span><span class="editor-number"><input id="textSpacing" type="number" step="any" placeholder="0" title="字距" disabled><span>pt</span></span></label>
<button id="paragraphButton" class="editor-group-action" type="button" disabled>段落</button>
</div>
<div class="editor-group">
<div class="shape-paint"><label><input id="shapeFill" type="checkbox">填充</label><input id="shapeFillColor" class="color-input" type="color" value="#dcefeb" title="填充颜色"></div>
<div class="shape-paint"><label><input id="shapeStroke" type="checkbox" checked>描边</label><input id="shapeStrokeColor" class="color-input" type="color" value="#000000" title="描边颜色"></div>
<label class="editor-field"><span>线宽</span><span class="editor-number"><input id="shapeWidth" type="number" value="1" min="0" step="any" required title="线宽"><span>pt</span></span></label>
<span>图形</span>
</div>
<div class="editor-group editor-image">
<select id="imageFit" disabled>
<option value="" hidden>缩放</option>
<option value="contain">适应</option>
<option value="cover">填充</option>
</select>
<button id="saveImageButton" class="button" type="button" disabled>另存</button>
<button id="cropImageButton" class="button" type="button" data-pressed="false" disabled>裁剪</button>
<button id="resetCropButton" class="button" type="button" disabled>还原</button>
<span>图片</span>
</div>
<div class="editor-group editor-transform">
<select id="objectRotate" class="order-select" disabled>
<option value="" hidden>旋转</option>
<option value="90">右转90°</option>
<option value="-90">左转90°</option>
</select>
<select id="objectFlip" class="order-select" disabled>
<option value="" hidden>翻转</option>
<option value="horizontal">水平</option>
<option value="vertical">垂直</option>
</select>
<button id="objectBoundsButton" class="editor-group-action" type="button" disabled>变换</button>
</div>
<div class="editor-group editor-erase">
<button id="eraseButton" class="button" type="button" data-pressed="false">擦除</button>
<select id="eraseMode" title="擦除方式,矩形和套索为视觉裁剪"><option value="erase-object">对象</option><option value="erase-region">矩形</option><option value="erase-path">套索</option></select>
<span>擦除</span>
</div>
<div class="editor-group">
<select id="addPageButton" title="新增页面"><option value="" hidden>新增</option><option value="blank">空白</option><option value="import">插页</option><option value="images">图片</option></select>
<button id="copyPageButton" class="button" type="button">复制</button>
<button id="deletePageButton" class="button" type="button">删除</button>
<button id="movePagePrevButton" class="button" type="button">前移</button>
<button id="movePageNextButton" class="button" type="button">后移</button>
<button id="pageSettingsButton" class="button" type="button">设置</button>
<button id="batchPagesButton" class="editor-group-action" type="button">页面</button>
</div>
</div>
<dialog id="aboutPanel" class="form-dialog about-dialog">
<form method="dialog">
<h2 id="aboutTitle" class="form-title">软件信息</h2>
<div class="about-row"><span>构建版本</span><span id="aboutVersion">develop</span></div>
<div class="about-row"><span>项目官网</span><a href="https://ofdgo.aite.me/" target="_blank" rel="noreferrer">https://ofdgo.aite.me/</a></div>
<div class="about-row"><span>桌面软件</span><a href="https://ofdgo.aite.me/releases/" target="_blank" rel="noreferrer">https://ofdgo.aite.me/releases/</a></div>
<div class="about-row"><span>项目仓库</span><a href="https://github.com/xiaoqidun/ofdgo" target="_blank" rel="noreferrer">https://github.com/xiaoqidun/ofdgo</a></div>
</form>
<section id="associationSection" class="about-associations" hidden>
<div class="association-heading">文件关联</div>
<div class="association-row" data-scope="user"><span>当前用户</span><span class="association-state"></span><div class="association-actions"><button class="small-button" type="button" data-action="register">注册</button><button class="small-button" type="button" data-action="remove">撤销</button></div></div>
<div class="association-row" data-scope="machine"><span>所有用户</span><span class="association-state"></span><div class="association-actions"><button class="small-button" type="button" data-action="register">注册</button><button class="small-button" type="button" data-action="remove">撤销</button></div></div>
<div id="associationMessage" class="form-status" hidden></div>
</section>
</dialog>
<dialog id="closePanel" class="form-dialog confirm-dialog">
<form method="dialog">
<h2 id="closeTitle" class="form-title">关闭文档</h2>
<p class="confirm-message">文档尚未保存</p>
<div class="form-actions"><button class="button" value="cancel" autofocus>取消</button><button class="button" value="discard">放弃</button><button class="button" value="save">保存</button></div>
</form>
</dialog>
<dialog id="convertPanel" class="form-dialog convert-dialog">
<form id="convertForm">
<h2 id="convertTitle" class="form-title">批量转换<span id="convertCount"></span></h2>
<input id="convertInput" class="file-input" type="file" accept=".pdf,.ofd" multiple>
<div class="convert-table"><table><thead><tr><th scope="col">文件</th><th scope="col">页码</th><th scope="col">格式</th><th scope="col">状态</th><th scope="col">操作</th></tr></thead><tbody id="convertList"></tbody></table><div id="convertEmpty" class="convert-empty">暂无文件</div></div>
<div class="convert-progress"><progress id="convertProgress" max="1" value="0"></progress><div id="convertStatus"></div></div>
<div class="form-actions">
<button id="convertAdd" class="button" type="button">添加</button><button id="convertClear" class="button" type="button">清空</button>
<div class="convert-options">
<div class="form-row"><label for="convertFormat">格式</label><select id="convertFormat" required></select></div>
<div class="form-row"><label for="convertCompression">压缩</label><select id="convertCompression"><option value="0">原始</option><option value="1">无损</option><option value="2">轻压</option><option value="3">均衡</option><option value="4">强压</option></select></div>
<div id="convertFontRow" class="form-row" hidden><label for="convertFontMode">字体</label><select id="convertFontMode"><option value="0">保持</option><option value="1">内嵌</option><option value="2">外部</option></select></div>
<div id="convertDPIRow" class="form-row" hidden><label for="convertDPI">精度</label><div class="form-select"><select id="convertDPI"><option value="96">96 DPI</option><option value="150">150 DPI</option><option value="300" selected>300 DPI</option><option value="600">600 DPI</option></select><span id="convertDPIValue">300</span></div></div>
<div class="form-row"><label for="convertDestination">输出</label><select id="convertDestination"><option value="directory">目录</option><option value="archive">打包</option></select></div>
</div>
<button id="convertClose" class="button" type="button">关闭</button><button id="convertCancel" class="button" type="button" hidden>取消</button><button id="convertStart" class="button" type="submit" disabled>转换</button>
</div>
</form>
</dialog>
<dialog id="batchPagesPanel" class="form-dialog">
<form id="batchPagesForm">
<h2 id="batchPagesTitle" class="form-title">复制页面</h2>
<div class="form-row"><label for="batchPageAction">操作</label><select id="batchPageAction"><option value="copy">复制</option><option value="move">移动</option><option value="delete">删除</option><option value="save">另存</option></select></div>
<div class="form-row"><label for="batchPageRange">页码</label><input id="batchPageRange" type="text" required autocomplete="off" spellcheck="false" autofocus></div>
<div id="batchPagePositionRow" class="form-row" hidden><label for="batchPagePosition">位置</label><select id="batchPagePosition"><option value="before">页前</option><option value="after">页后</option><option value="first">开头</option><option value="last">末尾</option></select></div>
<div class="form-actions"><div id="batchPagesStatus" class="form-status"></div><button id="batchPagesCancel" class="button" type="button">取消</button><button id="batchPagesSubmit" class="button" type="submit">复制</button></div>
</form>
</dialog>
<dialog id="objectStylePanel" class="form-dialog">
<form id="objectStyleForm">
<h2 id="objectStyleTitle" class="form-title">对象样式</h2>
<div class="form-row"><span>组合</span><div class="form-format"><button id="groupObjectsButton" class="button" type="button">组合</button><button id="ungroupObjectButton" class="button" type="button">解组</button></div></div>
<div class="form-row"><span>格式</span><div class="form-format"><button id="copyStyleButton" class="button" type="button">复制</button><button id="pasteStyleButton" class="button" type="button">粘贴</button></div></div>
<details id="objectLinkFields" hidden>
<summary>链接</summary>
<div class="form-row"><label for="objectLinkKind">目标</label><div class="form-unit object-link-target"><select id="objectLinkKind"><option value="none">不设</option><option value="uri">网址</option><option value="page">页面</option><option value="keep">原有</option></select><button id="objectActionsButton" class="button" type="button">动作</button></div></div>
<div class="form-row" id="objectLinkAddressRow" hidden><label for="objectLinkAddress">地址</label><input id="objectLinkAddress" type="text"></div>
<div class="form-row" id="objectLinkPageRow" hidden><label for="objectLinkPage">页码</label><input id="objectLinkPage" type="number" min="1" step="1"></div>
</details>
<div class="form-row"><label for="objectOpacity">透明</label><div class="form-unit"><input id="objectOpacity" type="number" min="0" max="100" step="any" autofocus><span>%</span></div></div>
<details id="objectBorderFields" hidden>
<summary>边框</summary>
<div class="form-row"><label for="borderEnabled">显示</label><input id="borderEnabled" type="checkbox"></div>
<div class="form-pair">
<div class="form-row"><label for="borderWidth">线宽</label><div class="form-unit"><input id="borderWidth" type="number" min="0" step="any"><span>mm</span></div></div>
<div class="form-row"><label for="borderColor">颜色</label><input id="borderColor" class="color-input" type="color"><span id="borderColorOriginal" hidden>原样</span></div>
</div>
<div class="form-pair">
<div class="form-row"><label for="borderHorizontal">横径</label><div class="form-unit"><input id="borderHorizontal" type="number" min="0" step="any"><span>mm</span></div></div>
<div class="form-row"><label for="borderVertical">纵径</label><div class="form-unit"><input id="borderVertical" type="number" min="0" step="any"><span>mm</span></div></div>
</div>
</details>
<details id="objectGradientFields" hidden>
<summary>渐变</summary>
<div class="form-pair">
<div class="form-row"><label for="gradientTarget">应用</label><select id="gradientTarget"><option value="fill">填充</option><option value="stroke">描边</option></select></div>
<div class="form-row"><label for="gradientKind">类型</label><select id="gradientKind"><option value="keep">保持</option><option value="linear">线性</option><option value="radial">径向</option></select></div>
</div>
<div id="gradientControls" hidden>
<div class="form-row"><label for="gradientAngle">角度</label><div class="form-unit"><input id="gradientAngle" type="number" step="any" value="0"><span>°</span></div></div>
<div class="gradient-stop-row gradient-stop-head"><span>颜色</span><span>位置%</span><span>透明%</span><span></span></div>
<div id="gradientStops"></div>
<button id="gradientAdd" class="icon-button" type="button" title="添加色标">+</button>
</div>
</details>
<details id="objectPatternFields" hidden>
<summary>图案</summary>
<div class="form-row"><label for="patternTarget">应用</label><select id="patternTarget"><option value="fill">填充</option><option value="stroke">描边</option></select></div>
<div class="form-pair">
<div class="form-row"><label for="patternWidth">宽度</label><div class="form-unit"><input id="patternWidth" type="number" min="0" step="any"><span>mm</span></div></div>
<div class="form-row"><label for="patternHeight">高度</label><div class="form-unit"><input id="patternHeight" type="number" min="0" step="any"><span>mm</span></div></div>
</div>
<div class="form-pair">
<div class="form-row"><label for="patternXStep">横距</label><div class="form-unit"><input id="patternXStep" type="number" min="0" step="any"><span>mm</span></div></div>
<div class="form-row"><label for="patternYStep">纵距</label><div class="form-unit"><input id="patternYStep" type="number" min="0" step="any"><span>mm</span></div></div>
</div>
<div class="form-row"><label for="patternCTM">矩阵</label><input id="patternCTM" type="text" spellcheck="false" autocomplete="off"></div>
</details>
<div id="objectStrokeFields">
<div class="form-row"><label for="objectDash">线型</label><select id="objectDash"><option value="mixed" hidden>混合</option><option value="solid">实线</option><option value="dash">虚线</option><option value="dot">点线</option><option value="dashdot">点划</option><option value="custom">自定</option></select></div>
<div id="objectDashRow" class="form-row" hidden><label for="objectDashPattern">间隔</label><div class="form-unit"><input id="objectDashPattern" type="text" autocomplete="off" spellcheck="false"><span>mm</span></div></div>
<div class="form-row"><label for="objectDashOffset">偏移</label><div class="form-unit"><input id="objectDashOffset" type="number" step="any"><span>mm</span></div></div>
<div class="form-pair">
<div class="form-row"><label for="objectCap">端点</label><select id="objectCap"><option value="mixed" hidden>混合</option><option value="Butt">平头</option><option value="Round">圆头</option><option value="Square">方头</option></select></div>
<div class="form-row"><label for="objectJoin">转角</label><select id="objectJoin"><option value="mixed" hidden>混合</option><option value="Miter">尖角</option><option value="Round">圆角</option><option value="Bevel">斜角</option></select></div>
</div>
</div>
<div class="form-actions"><div id="objectStyleStatus" class="form-status"></div><button id="objectStyleCancel" class="button" type="button">取消</button><button class="button" type="submit">确定</button></div>
</form>
</dialog>
<dialog id="structureDialog" class="form-dialog structure-dialog">
<form id="structureForm">
<h2 id="structureTitle" class="form-title">结构标引</h2>
<div class="form-row"><label for="structureEntry">标引</label><select id="structureEntry"></select></div>
<div id="structureNodeRow" class="form-row"><label for="structureNodeSelect">节点</label><select id="structureNodeSelect"></select></div>
<div id="structureActionRow" class="form-row"><label for="structureAction">操作</label><select id="structureAction"><option value="update">修改</option><option value="add">新增</option><option value="bind">绑定</option><option value="delete">删除</option></select></div>
<div id="structureFields">
<div id="structureTypeRow" class="form-row"><label for="structureType">类型</label><input id="structureType" type="text" required></div>
<div class="form-row"><label for="structureName">名称</label><input id="structureName" type="text" required></div>
<div class="form-row"><label for="structureNamespace">命名空间</label><input id="structureNamespace" type="text"></div>
<div class="form-row"><label for="structureText">内容</label><textarea id="structureText" rows="2"></textarea></div>
<div class="panel-row"><span>属性</span><button id="structureAttributeAdd" class="icon-button" type="button" title="添加属性">+</button></div>
<div id="structureAttributes" class="structure-edit-list"></div>
</div>
<div id="structureBinding" hidden>
<div class="panel-row"><span>引用</span><div class="panel-actions"><button id="structureSelection" class="button" type="button">选区</button><button id="structureReferenceAdd" class="icon-button" type="button" title="添加引用">+</button></div></div>
<div id="structureReferences" class="structure-edit-list"></div>
</div>
<div class="form-actions"><div id="structureStatus" class="form-status"></div><button id="structureCancel" class="button" type="button">取消</button><button id="structureSubmit" class="button" type="submit">确定</button></div>
</form>
</dialog>
<dialog id="outlinePanel" class="form-dialog">
<form id="outlineForm">
<h2 id="outlinePanelTitle" class="form-title">新增目录</h2>
<div class="form-row"><label for="outlineTitle">标题</label><input id="outlineTitle" type="text" required autofocus></div>
<div class="form-row"><label for="outlineParent">上级</label><select id="outlineParent"></select></div>
<div class="form-row"><label for="outlinePage">页码</label><input id="outlinePage" type="number" min="1" step="1" placeholder="无"></div>
<div id="outlinePositionRow" class="form-row" hidden><label for="outlinePosition">顺序</label><input id="outlinePosition" type="number" min="1" step="1" required value="1"></div>
<div class="form-actions"><div id="outlineStatus" class="form-status"></div><button id="outlineCancel" class="button" type="button">取消</button><button id="outlineSubmit" class="button" type="submit">新增</button></div>
</form>
</dialog>
<dialog id="objectBoundsPanel" class="form-dialog">
<form id="objectBoundsForm">
<h2 id="objectBoundsTitle" class="form-title">位置尺寸</h2>
<div class="form-pair">
<div class="form-row"><label for="objectX">横向</label><div class="form-unit"><input id="objectX" type="number" step="any" required autofocus><span>mm</span></div></div>
<div class="form-row"><label for="objectY">纵向</label><div class="form-unit"><input id="objectY" type="number" step="any" required><span>mm</span></div></div>
</div>
<div class="form-pair">
<div class="form-row"><label for="objectWidth">宽度</label><div class="form-unit"><input id="objectWidth" type="number" min="0" step="any" required><span>mm</span></div></div>
<div class="form-row"><label for="objectHeight">高度</label><div class="form-unit"><input id="objectHeight" type="number" min="0" step="any" required><span>mm</span></div></div>
</div>
<div class="form-row"><span>比例</span><label class="form-check"><input id="objectAspect" type="checkbox" checked>锁定</label></div>
<div class="form-actions"><div id="objectBoundsStatus" class="form-status"></div><button id="objectBoundsCancel" class="button" type="button">取消</button><button class="button" type="submit">确定</button></div>
</form>
</dialog>
<dialog id="createPanel" class="form-dialog">
<form id="createForm">
<h2 id="createTitle" class="form-title">新建文档</h2>
<div id="createModeRow" class="form-row"><label for="createMode">来源</label><select id="createMode"><option value="blank">空白</option><option value="images">图片</option></select></div>
<div class="form-row">
<label for="createName">名称</label>
<input id="createName" type="text" value="未命名" required autofocus>
</div>
<div id="createImagesRow" class="form-row" hidden><label for="createImages">图片</label><input id="createImages" type="file" accept=".png,.jpg,.jpeg,.bmp,.tif,.tiff,.jb2,.jbig2" multiple disabled></div>
<div id="createSizeRow" class="form-row" hidden><label for="createSize">尺寸</label><select id="createSize" disabled><option value="image">随图</option><option value="custom">自定</option></select></div>
<div id="createDimensions" class="form-pair">
<div class="form-row">
<label for="createWidth">宽度</label>
<div class="form-unit"><input id="createWidth" type="number" value="210" min="1" step="any" required><span>mm</span></div>
</div>
<div class="form-row">
<label for="createHeight">高度</label>
<div class="form-unit"><input id="createHeight" type="number" value="297" min="1" step="any" required><span>mm</span></div>
</div>
</div>
<div id="createMarginRow" class="form-row" hidden><label for="createMargin">边距</label><div class="form-unit"><input id="createMargin" type="number" value="0" min="0" step="any" required disabled><span>mm</span></div></div>
<div id="createPositionRow" class="form-row" hidden><label for="createPosition">位置</label><select id="createPosition" disabled><option value="before">页前</option><option value="after" selected>页后</option><option value="first">开头</option><option value="last">末尾</option></select></div>
<div class="form-actions">
<div id="createStatus" class="form-status"></div>
<button id="createCancel" class="button" type="button">取消</button>
<button id="createSubmit" class="button" type="submit">新建</button>
</div>
</form>
</dialog>
<dialog id="importPanel" class="form-dialog">
<form id="importForm">
<h2 id="importTitle" class="form-title">插入页面</h2>
<div class="form-row"><label for="importFile">文档</label><input id="importFile" type="file" accept=".ofd" required autofocus></div>
<div class="form-row"><label for="importRange">范围</label><select id="importRange"><option value="all">全部</option><option value="custom">指定</option></select></div>
<div id="importDocuments" class="document-list" hidden></div>
<div id="importPagesRow" class="form-row" hidden><label id="importPagesLabel" for="importPages">页码</label><input id="importPages" type="text" autocomplete="off" spellcheck="false" disabled></div>
<div id="importPositionRow" class="form-row"><label for="importPosition">位置</label><select id="importPosition"><option value="before">页前</option><option value="after" selected>页后</option><option value="first">开头</option><option value="last">末尾</option></select></div>
<div id="importOutlinesRow" class="form-row"><label for="importOutlines">目录</label><input id="importOutlines" type="checkbox" title="导入对应目录"></div>
<div class="form-actions"><div id="importStatus" class="form-status"></div><button id="importCancel" class="button" type="button">取消</button><button id="importSubmit" class="button" type="submit" disabled>插入</button></div>
</form>
</dialog>
<dialog id="paragraphPanel" class="form-dialog">
<form id="paragraphForm">
<h2 id="paragraphTitle" class="form-title">段落设置</h2>
<div class="form-row"><label for="firstLineIndent">首行</label><div class="form-unit"><input id="firstLineIndent" type="number" step="any" required autofocus><span>mm</span></div></div>
<div class="form-pair">
<div class="form-row"><label for="leftIndent">左侧</label><div class="form-unit"><input id="leftIndent" type="number" step="any" required><span>mm</span></div></div>
<div class="form-row"><label for="rightIndent">右侧</label><div class="form-unit"><input id="rightIndent" type="number" step="any" required><span>mm</span></div></div>
</div>
<div class="form-actions"><div id="paragraphStatus" class="form-status"></div><button id="paragraphCancel" class="button" type="button">取消</button><button class="button" type="submit">确定</button></div>
</form>
</dialog>
<dialog id="resourcePanel" class="form-dialog resource-dialog">
<form id="resourceForm">
<h2 id="resourceTitle" class="form-title">资源管理</h2>
<div id="resourceTabs" class="panel-tabs"></div>
<div class="resource-list-container">
<div class="resource-heading"><span>名称</span><span>大小</span><span>引用</span></div>
<div class="resource-list-body">
<div id="resourceList" class="resource-list"></div>
<div id="resourceEmpty" class="resource-empty" hidden>暂无资源</div>
</div>
</div>
<div class="form-row"><label for="resourceReference">引用</label><div class="resource-target"><select id="resourceReference"></select><select id="resourceReferenceGroup" title="引用分组" hidden></select><button id="resourceLocate" class="button" type="button">定位</button></div></div>
<div id="resourceActions" class="resource-actions">
<button id="resourceAdd" class="button" type="button">添加</button>
<button id="resourcePreview" class="button" type="button">预览</button>
<button id="resourceExport" class="button" type="button">导出</button>
<button id="resourceRename" class="button" type="button" hidden>改名</button>
<button id="resourceReplace" class="button" type="button">替换</button>
<button id="resourceDelete" class="button" type="button">删除</button>
<div id="resourceStatus" class="form-status"></div>
<button id="resourceClose" class="button" type="button">关闭</button>
</div>
<div id="resourceBinding" class="resource-binding" hidden>
<div class="form-row"><label for="resourcePage">页码</label><select id="resourcePage"></select></div>
<div class="form-row"><label for="resourceObject">图元</label><div class="resource-target"><select id="resourceObject"></select><button id="resourcePick" class="button" type="button">选取</button></div></div>
<div id="resourceBindingActions" class="form-actions"><button id="resourceUnbind" class="button" type="button">解绑</button><button id="resourceBind" class="button" type="button">绑定</button></div>
</div>
<div id="resourceViewer" class="resource-viewer" hidden></div>
<input id="resourceFile" type="file" hidden>
</form>
</dialog>
<dialog id="documentPanel" class="form-dialog document-dialog">
<form id="documentForm">
<h2 id="documentTitle" class="form-title">文档管理</h2>
<div id="documentList" class="document-list"></div>
<div id="documentActions" class="document-actions">
<button id="documentAddButton" class="button" type="button">新增</button>
<button id="documentImportButton" class="button" type="button">导入</button>
<button id="infoButton" class="button" type="button">修改</button>
<button id="documentDeleteButton" class="button" type="button">删除</button>
<button id="documentUpButton" class="button" type="button">前移</button>
<button id="documentDownButton" class="button" type="button">后移</button>
<div id="documentStatus" class="form-status"></div>
<button id="documentClose" class="button" type="button">关闭</button>
</div>
</form>
</dialog>
<dialog id="settingsPanel" class="form-dialog settings-dialog">
<form id="settingsForm">
<header class="settings-header">
<h2 id="settingsTitle" class="form-title">文档配置</h2>
<span id="settingsLocation" class="settings-location"></span>
</header>
<div id="settingsTabs" class="panel-tabs"></div>
<div id="settingsBody" class="settings-body">
<div id="settingsContext"></div>
<div id="settingsContent"></div>
</div>
<div class="settings-footer">
<div id="settingsStatus" class="form-status"></div>
<div id="settingsActions" class="form-actions"></div>
</div>
</form>
</dialog>
<dialog id="versionPanel" class="form-dialog document-dialog">
<form id="versionForm">
<h2 id="versionTitle" class="form-title">版本管理</h2>
<div id="versionNotice" class="font-permission-hint" hidden></div>
<div id="versionList" class="document-list"></div>
<label id="versionNameRow" class="form-row"><span>名称</span><input id="versionName" type="text" autocomplete="off"></label>
<div id="versionActions" class="document-actions">
<button id="versionAdd" class="button" type="button">新增</button>
<button id="versionRename" class="button" type="button">改名</button>
<button id="versionDefault" class="button" type="button">默认</button>
<button id="versionDelete" class="button" type="button">删除</button>
<button id="versionSelect" class="button" type="button">切换</button>
<button id="versionExport" class="button" type="button">另存</button>
<div id="versionStatus" class="form-status"></div>
<button id="versionClose" class="button" type="button">关闭</button>
</div>
</form>
</dialog>
<dialog id="infoPanel" class="form-dialog">
<form id="infoForm">
<h2 id="infoPanelTitle" class="form-title">文档信息</h2>
<label class="form-row"><span>文档标识</span><input id="infoDocId" type="text"></label>
<label class="form-row"><span>标题</span><textarea id="infoTitle" rows="1" autofocus></textarea></label>
<label class="form-row"><span>作者</span><textarea id="infoAuthor" rows="1"></textarea></label>
<label class="form-row"><span>主题</span><textarea id="infoSubject" rows="1"></textarea></label>
<label class="form-row"><span>摘要</span><textarea id="infoAbstract" rows="2"></textarea></label>
<details><summary><span>文档属性</span></summary>
<label class="form-row"><span>创建日期</span><input id="infoCreationDate" type="text"></label>
<label class="form-row"><span>修改日期</span><input id="infoModDate" type="text"></label>
<label class="form-row"><span>文档用途</span><input id="infoDocUsage" type="text"></label>
<label class="form-row"><span>封面路径</span><input id="infoCover" type="text"></label>
<details><summary><span>关键词</span></summary><div id="infoKeywordRows" class="info-rows"></div><button id="infoKeywordAdd" class="icon-button" type="button" title="添加词条">+</button></details>
<label class="form-row"><span>制作软件</span><input id="infoCreator" type="text"></label>
<label class="form-row"><span>软件版本</span><input id="infoCreatorVersion" type="text"></label>
</details>
<details><summary><span>扩展属性</span></summary><div id="infoCustomRows" class="info-rows"></div><button id="infoCustomAdd" class="icon-button" type="button" title="添加属性">+</button></details>
<div class="form-actions"><div id="infoStatus" class="form-status"></div><button id="infoCancel" class="button" type="button">取消</button><button class="button" type="submit">确定</button></div>
</form>
</dialog>
<dialog id="annotationCreate" class="form-dialog">
<form id="annotationCreateForm">
<h2 id="annotationCreateTitle" class="form-title">添加批注</h2>
<label class="form-row" data-annotation="watermark"><span>类型</span><select id="annotationContent"><option value="text">文字</option><option value="image">图片</option></select></label>
<label class="form-row" data-annotation="replace"><span>原文</span><select id="annotationOld"></select></label>
<label class="form-row" data-annotation="replace"><span>字体</span><select id="annotationFont"><option value="keep">原有</option><option value="current">当前</option></select></label>
<label class="form-row" id="annotationTextRow"><span>内容</span><textarea id="annotationText" rows="2" required></textarea></label>
<label class="form-row" id="annotationImageRow" hidden><span>图片</span><input id="annotationImage" type="file" accept="image/png,image/jpeg,image/bmp,image/tiff,image/gif,image/webp"></label>
<label class="form-row" data-annotation="note watermark stamp link"><span>作者</span><input id="annotationAuthor" type="text"></label>
<label class="form-row" data-annotation="link"><span>目标</span><select id="annotationLinkKind"><option value="uri">网址</option><option value="page">页面</option><option value="keep" hidden>原有</option></select></label>
<label class="form-row" data-annotation="link" id="annotationAddressRow"><span>网址</span><input id="annotationAddress" type="text"></label>
<label class="form-row" data-annotation="link" id="annotationTargetRow"><span>页码</span><input id="annotationTarget" type="number" min="1" value="1"></label>
<div class="form-pair" data-annotation="note watermark stamp link">
<label class="form-row"><span>横向</span><span class="form-unit"><input id="annotationX" type="number" step="any" value="10" required><span>mm</span></span></label>
<label class="form-row"><span>纵向</span><span class="form-unit"><input id="annotationY" type="number" step="any" value="10" required><span>mm</span></span></label>
</div>
<div class="form-pair" data-annotation="watermark stamp link">
<label class="form-row"><span>宽度</span><span class="form-unit"><input id="annotationWidth" type="number" min="1" step="any" value="60" required><span>mm</span></span></label>
<label class="form-row"><span>高度</span><span class="form-unit"><input id="annotationHeight" type="number" min="1" step="any" value="12" required><span>mm</span></span></label>
</div>
<div class="form-pair" data-annotation="watermark stamp">
<label class="form-row"><span>角度</span><span class="form-unit"><input id="annotationAngle" type="number" min="-180" max="180" step="any" value="-30" required><span>°</span></span></label>
<label class="form-row"><span>透明</span><span class="form-unit"><input id="annotationOpacity" type="number" min="0" max="100" step="any" value="80" required><span>%</span></span></label>
</div>
<label class="form-row" data-annotation="watermark"><span>排列</span><select id="annotationTile"><option value="single">单个</option><option value="tile">平铺</option></select></label>
<div class="form-row" data-annotation="watermark"><label id="annotationPlacementLabel" for="annotationPlacement">位置</label><div class="annotation-placement"><select id="annotationPlacement"><option value="page">居中</option><option value="custom">指定</option></select><button id="annotationPick" class="button" type="button">定位</button></div></div>
<label class="form-row" data-annotation="watermark"><span>应用</span><select id="annotationScope"><option value="current">本页</option><option value="all">全部</option><option value="custom">指定</option></select></label>
<label class="form-row" data-annotation="note watermark stamp link"><span>页码</span><input id="annotationPages" type="text" required></label>
<div class="form-actions"><div id="annotationCreateStatus" class="form-status"></div><button id="annotationCreateCancel" class="button" type="button">取消</button><button class="button" type="submit">确定</button></div>
</form>
</dialog>
<dialog id="objectPicker" class="form-dialog">
<form method="dialog">
<h2 id="objectPickerTitle" class="form-title">选择对象</h2>
<div id="objectPickerList" class="object-picker-list"></div>
<div class="form-actions"><button class="button" type="submit">关闭</button></div>
</form>
</dialog>
<dialog id="annotationNote" class="form-dialog">
<form id="annotationForm" method="dialog">
<h2 id="annotationNoteTitle" class="form-title">注解详情</h2>
<div id="annotationDetail" class="annotation-detail"></div>
<div id="annotationFields" hidden>
<div class="form-row"><label for="annotationRemark">说明</label><textarea id="annotationRemark" rows="4"></textarea></div>
<div class="form-row"><label for="annotationCreator">作者</label><input id="annotationCreator" type="text"></div>
</div>
<div class="form-actions"><div id="annotationStatus" class="form-status"></div><button id="annotationClose" class="button" type="button" autofocus>关闭</button><button id="annotationSubmit" class="button" type="submit" hidden>确定</button></div>
</form>
</dialog>
<dialog id="pagePanel" class="form-dialog">
<form id="pageForm">
<h2 id="pageTitle" class="form-title">页面设置</h2>
<div id="pageRangeRow" class="form-row" hidden><span>范围</span><output id="pageRange"></output></div>
<div class="form-row">
<span id="pageDirectionLabel">方向</span>
<div class="form-options">
<label><input id="pagePortrait" type="radio" name="direction" value="portrait" autofocus><span>竖向</span></label>
<label><input id="pageLandscape" type="radio" name="direction" value="landscape"><span>横向</span></label>
</div>
</div>
<div class="form-pair">
<div class="form-row">
<label for="pageWidth">宽度</label>
<div class="form-unit"><input id="pageWidth" type="number" min="1" step="any" required><span>mm</span></div>
</div>
<div class="form-row">
<label for="pageHeight">高度</label>
<div class="form-unit"><input id="pageHeight" type="number" min="1" step="any" required><span>mm</span></div>
</div>
</div>
<div class="form-actions">
<div id="pageStatus" class="form-status"></div>
<button id="pageCancel" class="button" type="button">取消</button>
<button class="button" type="submit">确定</button>
</div>
</form>
</dialog>
<dialog id="fontBindingPanel" class="form-dialog">
<form id="fontBindingForm">
<h2 id="fontBindingTitle" class="form-title">嵌入字体</h2>
<div class="form-row"><span>字体</span><output id="fontBindingName"></output></div>
<div id="fontBindingSourceRow" class="form-row"><label for="fontBindingSource">来源</label><select id="fontBindingSource" required></select></div>
<input id="fontBindingFile" type="file" accept=".ttf,.otf,.ttc,.otc" hidden>
<div id="fontBindingHint" class="form-status">外置后,其他设备需具备此字体</div>
<div class="form-actions"><div id="fontBindingStatus" class="form-status"></div><button id="fontBindingCancel" class="button" type="button">取消</button><button id="fontBindingSubmit" class="button" type="submit">嵌入</button></div>
</form>
</dialog>
<dialog id="insertPanel" class="form-dialog">
<form id="insertForm">
<h2 id="insertTitle" class="form-title">添加图片</h2>
<div class="form-row">
<label for="insertImage">图片</label>
<input id="insertImage" type="file" accept=".png,.jpg,.jpeg,.bmp,.tif,.tiff,image/png,image/jpeg,image/bmp,image/tiff" required autofocus>
</div>
<div id="insertFitRow" class="form-row" hidden>
<label for="insertFit">缩放</label>
<select id="insertFit"><option value="contain">适应</option><option value="cover">填充</option></select>
</div>
<div class="form-actions">
<div id="insertStatus" class="form-status"></div>
<button id="insertCancel" class="button" type="button">取消</button>
<button id="insertSubmit" class="button" type="submit">添加</button>
</div>
</form>
</dialog>
<dialog id="signPanel" class="form-dialog security-dialog">
<form id="signForm" autocomplete="off">
<h2 id="signTitle" class="form-title">签署文档</h2>
<div class="form-row"><label for="signCertificate">证书</label><input id="signCertificate" type="file" accept=".pem,.cer,.crt,.der" required></div>
<div class="form-row"><label for="signKey">私钥</label><input id="signKey" type="file" accept=".pem,.key,.der" required></div>
<div class="form-row"><label for="signKeyPassword">私钥口令</label><input id="signKeyPassword" type="password" autocomplete="off"></div>
<div class="form-row"><label for="signRoots">信任根</label><input id="signRoots" type="file" accept=".pem,.cer,.crt,.der" multiple required></div>
<div class="form-row"><label for="signIntermediates">中间证书</label><input id="signIntermediates" type="file" accept=".pem,.cer,.crt,.der" multiple></div>
<div class="form-row"><label for="signSeal">电子印章</label><input id="signSeal" type="file" accept=".esl,.ses,.der"></div>
<div id="signPlacementFields" hidden>
<div class="form-row"><span>预览</span><div class="seal-position-options"><button id="signPick" class="button" type="button">定位</button><label><input id="signKeepRatio" type="checkbox" checked>等比</label></div></div>
<div class="form-row"><label for="signPlacement">位置</label><select id="signPlacement"><option value="normal">页面</option><option value="seam">骑缝</option></select></div>
<div class="form-row"><label for="signPages">页码</label><input id="signPages" type="text" autocomplete="off" spellcheck="false"></div>
<div class="form-row"><label for="signX">横向</label><div class="form-unit"><input id="signX" type="number" min="0" step="any" value="10"><span>mm</span></div></div>
<div class="form-row"><label for="signY">纵向</label><div class="form-unit"><input id="signY" type="number" min="0" step="any" value="10"><span>mm</span></div></div>
<div class="form-row"><label for="signWidth">宽度</label><div class="form-unit"><input id="signWidth" type="number" min="0.01" step="any" value="40"><span>mm</span></div></div>
<div class="form-row"><label for="signHeight">高度</label><div class="form-unit"><input id="signHeight" type="number" min="0.01" step="any" value="40"><span>mm</span></div></div>
</div>
<div class="form-row"><label for="signMode">方式</label><select id="signMode"><option value="append">追加</option><option value="replace">替换</option></select></div>
<div class="form-row"><label for="signLock">禁止追加</label><input id="signLock" type="checkbox"></div>
<div class="form-actions"><div id="signStatus" class="form-status"></div><button id="signCancel" class="button" type="button">取消</button><button class="button" type="submit">签署</button></div>
</form>
</dialog>
<div hidden>
<div id="signPositionLayer" class="seal-position-layer">
<div id="signPositionStamp" class="seal-position-stamp" hidden><img id="signPositionImage" alt="" draggable="false"></div>
</div>
</div>
<dialog id="verifyPanel" class="form-dialog security-dialog">
<form id="verifyForm">
<h2 id="verifyTitle" class="form-title">验证签名</h2>
<div class="form-row"><label for="verifyRoots">信任根</label><input id="verifyRoots" type="file" accept=".pem,.cer,.crt,.der" multiple></div>
<div class="form-row"><label for="verifyCerts">证书</label><input id="verifyCerts" type="file" accept=".pem,.cer,.crt,.der" multiple></div>
<div class="form-row"><label for="verifyTimeRoots">时间戳根</label><input id="verifyTimeRoots" type="file" accept=".pem,.cer,.crt,.der" multiple></div>
<div class="form-row"><label for="verifyTokens">时间戳</label><input id="verifyTokens" type="file" accept=".tsr,.tst,.der" multiple></div>
<div class="form-row"><label for="verifyCRLs">撤销表</label><input id="verifyCRLs" type="file" accept=".crl,.der" multiple></div>
<div class="form-row"><label for="verifyOCSP">OCSP响应</label><input id="verifyOCSP" type="file" accept=".ocsp,.der" multiple></div>
<div class="form-row"><span>要求</span><div class="form-options"><label><input id="verifyRequireTime" type="checkbox"><span>时间戳</span></label><label><input id="verifyRequireRevocation" type="checkbox"><span>撤销检查</span></label></div></div>
<div class="form-actions"><div id="verifyStatus" class="form-status"></div><button id="verifyCancel" class="button" type="button">取消</button><button class="button" type="submit">验签</button></div>
</form>
</dialog>
<dialog id="credentialsPanel" class="form-dialog security-dialog">
<form id="credentialsForm" autocomplete="off">
<h2 id="credentialsTitle" class="form-title">解锁文档</h2>
<div id="credentialsTypeRow" class="form-row"><label for="credentialsType">方式</label><select id="credentialsType"><option value="password">口令</option><option value="certificate">证书</option></select></div>
<div id="credentialsUserRow" class="form-row"><label for="credentialsUser">用户</label><input id="credentialsUser" type="text" autocomplete="off" spellcheck="false"></div>
<div id="credentialsPasswordRow" class="form-row"><label for="credentialsPassword">口令</label><input id="credentialsPassword" type="password" autocomplete="off" required autofocus></div>
<div id="credentialsCertificateRow" class="form-row" hidden><label for="credentialsCertificate">证书</label><input id="credentialsCertificate" type="file" accept=".pem,.cer,.crt,.der"></div>
<div id="credentialsKeyRow" class="form-row" hidden><label for="credentialsKey">私钥</label><input id="credentialsKey" type="file" accept=".pem,.key,.der"></div>
<div id="credentialsKeyPasswordRow" class="form-row" hidden><label for="credentialsKeyPassword">私钥口令</label><input id="credentialsKeyPassword" type="password" autocomplete="off"></div>
<div class="form-actions"><div id="credentialsStatus" class="form-status"></div><button id="credentialsCancel" class="button" type="button">取消</button><button class="button" type="submit">解锁</button></div>
</form>
</dialog>
<dialog id="attachmentDialog" class="form-dialog">
<form id="attachmentForm">
<h2 id="attachmentTitle" class="form-title">添加附件</h2>
<div id="attachmentFileRow" class="form-row"><label for="attachmentFile">文件</label><input id="attachmentFile" type="file" multiple required></div>
<div id="attachmentNameRow" class="form-row" hidden><label for="attachmentName">名称</label><input id="attachmentName" type="text" autocomplete="off" spellcheck="false"></div>
<div class="form-actions">
<div id="attachmentStatus" class="form-status"></div>
<button id="attachmentCancel" class="button" type="button">取消</button>
<button id="attachmentSubmit" class="button" type="submit">添加</button>
</div>
</form>
</dialog>
<dialog id="encryptionPanel" class="form-dialog">
<form id="encryptionForm">
<h2 id="encryptionTitle" class="form-title">加密文档</h2>
<div class="form-row"><label for="encryptionType">方式</label><select id="encryptionType" autofocus><option value="none">明文</option><option value="password">口令</option><option value="certificate">证书</option><option id="encryptionKeep" value="keep" hidden>保留</option></select></div>
<div id="encryptionCurrentRow" class="form-row" hidden><span>状态</span><div class="encryption-current"><span id="encryptionCurrent"></span><button id="encryptionChange" class="button" type="button">修改</button></div></div>
<div id="encryptionUserRow" class="form-row"><label for="encryptionUser">用户</label><input id="encryptionUser" type="text" placeholder="可选" autocomplete="off" spellcheck="false"></div>
<div id="encryptionPasswordRow" class="form-row"><label for="encryptionPassword">口令</label><input id="encryptionPassword" type="password" autocomplete="new-password"></div>
<div id="encryptionConfirmRow" class="form-row"><label for="encryptionConfirm">确认</label><input id="encryptionConfirm" type="password" autocomplete="new-password"></div>
<div id="encryptionCertificatesRow" class="form-row" hidden><label for="encryptionCertificates">证书</label><input id="encryptionCertificates" type="file" accept=".pem,.cer,.crt,.der" multiple></div>
<div class="form-actions"><div id="encryptionStatus" class="form-status"></div><button id="encryptionCancel" class="button" type="button">取消</button><button id="encryptionSubmit" class="button" type="submit">确定</button></div>
</form>
</dialog>
<dialog id="printPanel" class="form-dialog print-dialog">
<form id="printForm">
<h2 id="printTitle" class="form-title">文档打印</h2>
<div class="print-content">
<div class="print-settings-panel">
<fieldset id="printSettings" class="print-settings">
<div class="form-row"><label for="printPrinter">打印设备</label><div class="print-field"><select id="printPrinter"><option value="browser">系统打印</option><option value="pdf">另存输出</option></select><button id="printProperties" class="small-button" type="button" hidden>设备属性</button></div></div>
<div class="form-row" data-print-row="device" hidden><label for="printCopies">打印份数</label><div class="print-field"><input id="printCopies" type="number" min="1" max="999" value="1"><label class="print-check"><input id="printCollation" type="checkbox" checked>逐份打印</label></div></div>
<div class="form-row"><label for="printScope">打印范围</label><select id="printScope"><option value="all">全部页面</option><option value="current">当前页面</option><option value="selected">所选页面</option><option value="range">指定页码</option></select></div>
<div class="form-row" data-print-row="range" hidden><label for="printRange">指定页码</label><input id="printRange" type="text" placeholder="1-3,5" autocomplete="off" spellcheck="false"></div>
<div class="form-row"><label for="printParity">奇偶筛选</label><div class="print-field"><select id="printParity"><option value="all">全部页面</option><option value="odd">奇数页面</option><option value="even">偶数页面</option></select><label class="print-check"><input id="printReverse" type="checkbox">逆序打印</label></div></div>
<div class="form-row"><label for="printMode">页面排版</label><select id="printMode"><option value="single">单页打印</option><option value="multiple">多页合印</option><option value="booklet">小册打印</option><option value="poster">海报拼接</option></select></div>
<div class="form-row"><label for="printPaper">纸张大小</label><select id="printPaper"><option value="210,297">A4</option><option value="297,420">A3</option><option value="148,210">A5</option><option value="176,250">B5</option><option value="215.9,279.4">Letter</option><option value="215.9,355.6">Legal</option><option value="source">原页尺寸</option><option value="custom">自定尺寸</option></select></div>
<div class="form-row" data-print-row="paper" hidden><label for="printWidth">纸张尺寸</label><div class="print-field"><input id="printWidth" type="number" value="210" min="1" max="5000" step="any" title="纸张宽度"><span>×</span><input id="printHeight" type="number" value="297" min="1" max="5000" step="any" title="纸张高度"><span>mm</span></div></div>
<div class="form-row"><label for="printOrientation">纸张方向</label><select id="printOrientation"><option value="portrait">纵向纸张</option><option value="landscape">横向纸张</option></select></div>
<div class="form-row"><label for="printScaling">页面缩放</label><select id="printScaling"><option value="shrink">缩小大页</option><option value="fit">适合纸张</option><option value="actual">实际大小</option><option value="custom">自定比例</option></select></div>
<div class="form-row" data-print-row="scale" hidden><label for="printScale">缩放比例</label><div class="print-field"><input id="printScale" type="number" min="1" max="10000" value="100" step="1"><span>%</span></div></div>
<div class="form-row"><span>额外边距</span><div class="print-field print-margins"><input id="printMarginTop" type="number" min="0" value="0" step="0.1" title="上边距"><input id="printMarginRight" type="number" min="0" value="0" step="0.1" title="右边距"><input id="printMarginBottom" type="number" min="0" value="0" step="0.1" title="下边距"><input id="printMarginLeft" type="number" min="0" value="0" step="0.1" title="左边距"><span>mm</span></div></div>
<div class="form-row" data-print-row="multiple" hidden><label for="printGrid">每面页数</label><select id="printGrid"><option value="1,2">2 页</option><option value="2,2">4 页</option><option value="2,3">6 页</option><option value="3,3">9 页</option><option value="4,4">16 页</option></select></div>
<div class="form-row" data-print-row="multiple" hidden><label for="printPageOrder">排列顺序</label><select id="printPageOrder"><option value="horizontal">横向顺序</option><option value="horizontalReverse">横向逆序</option><option value="vertical">纵向顺序</option><option value="verticalReverse">纵向逆序</option></select></div>
<div class="form-row" data-print-row="gap" hidden><label for="printGap">页面间距</label><div class="print-field"><input id="printGap" type="number" min="0" value="4" step="0.1"><span>mm</span></div></div>
<div class="form-row" data-print-row="booklet" hidden><label for="printBinding">装订方向</label><select id="printBinding"><option value="left">左侧装订</option><option value="right">右侧装订</option></select></div>
<div class="form-row" data-print-row="booklet" hidden><label for="printBookletSheets">每册纸数</label><input id="printBookletSheets" type="number" min="0" max="2500" placeholder="不分册" title="0表示不分册"></div>
<div class="form-row" data-print-row="booklet" hidden><label for="printSheetFrom">纸张范围</label><div class="print-field"><input id="printSheetFrom" type="number" min="1" placeholder="起始" title="起始纸张编号"><span>至</span><input id="printSheetTo" type="number" min="1" placeholder="结束" title="结束纸张编号"></div></div>
<div class="form-row" data-print-row="poster" hidden><label for="printOverlap">重叠宽度</label><div class="print-field"><input id="printOverlap" type="number" min="0" value="5" step="0.1"><span>mm</span></div></div>
<div class="form-row"><label for="printDuplex">双面方式</label><select id="printDuplex"><option value="simplex">单面打印</option><option value="longEdge">自动长边</option><option value="shortEdge">自动短边</option><option value="manualLongEdge">手动长边</option><option value="manualShortEdge">手动短边</option></select></div>
<div class="form-row" data-print-row="sides" hidden><label for="printSides">打印纸面</label><select id="printSides"><option value="all">正反两面</option><option value="front">只印正面</option><option value="back">只印背面</option></select></div>
<div class="form-row" data-print-row="manual" hidden><span>背面处理</span><div class="print-field"><label class="print-check"><input id="printBackReverse" type="checkbox">倒序送纸</label><label class="print-check" title="背面旋转180°"><input id="printBackRotate" type="checkbox">背面旋转</label></div></div>
<div class="form-row"><label for="printContents">打印内容</label><select id="printContents"><option value="documentAndAnnotations">文档注解</option><option value="document">文档表单</option><option value="annotations">仅限注解</option><option value="forms">仅限表单</option></select></div>
<div class="print-options"><label><input id="printRotate" type="checkbox" checked>自动旋转</label><label><input id="printGrayscale" type="checkbox">灰度打印</label><label><input id="printBorders" type="checkbox">页面边框</label><label><input id="printCropMarks" type="checkbox">裁切标记</label><label><input id="printRaster" type="checkbox">图像打印</label><div class="form-select"><select id="printDPI" title="图像精度"><option value="96">96 DPI</option><option value="150">150 DPI</option><option value="300" selected>300 DPI</option><option value="600">600 DPI</option></select><span id="printDPIValue">300</span></div><label data-print-row="poster" title="仅拼接超出纸面的页面" hidden><input id="printTileOnlyLarge" type="checkbox" checked>仅拼大页</label><label data-print-row="poster" hidden><input id="printLabels" type="checkbox" checked>拼接标签</label></div>
</fieldset>
<div class="form-actions"><button id="printCancel" class="button" type="button">关闭</button><button id="printSubmit" class="button" type="submit" disabled>打印</button></div>
</div>
<div class="print-preview"><div class="print-preview-stage"><div id="printPreview" class="print-preview-page"></div><div id="printProgress" class="progress-panel print-progress"><div id="printSpinner" class="progress-spinner" hidden></div><div id="printStatus" class="progress-label"></div><div id="printProgressTrack" class="progress-track" hidden><div id="printProgressBar" class="progress-bar"></div></div></div></div><div class="print-preview-tools"><button id="printPrevious" class="icon-button arrow-prev" type="button" title="上一页"></button><label id="printPageControl" class="page-control"><input id="printPreviewNumber" type="number" min="1" value="1" title="预览纸面"><span>/</span><span id="printPageCount">0</span></label><button id="printNext" class="icon-button arrow-next" type="button" title="下一页"></button></div></div>
</div>
</form>
</dialog>
<dialog id="exportPanel" class="form-dialog">
<form id="exportForm">
<h2 id="exportTitle" class="form-title">导出文档</h2>
<div class="form-row">
<span id="exportScopeLabel">范围</span>
<div class="form-options">
<label><input id="exportAll" type="radio" name="scope" value="all" checked autofocus><span>全部</span></label>
<label><input id="exportSpecified" type="radio" name="scope" value="specified"><span>指定</span></label>
</div>
</div>
<div id="exportRangeRow" class="form-row" hidden>
<label for="exportRange">页码</label>
<input id="exportRange" type="text" autocomplete="off" spellcheck="false">
</div>
<div class="form-actions">
<div id="exportRangeStatus" class="form-status"></div>
<button id="exportCancel" class="button" type="button">取消</button>
<button id="exportSubmit" class="button" type="submit">导出</button>
</div>
</form>
</dialog>
<main class="workspace">
<aside class="page-list-panel">
<div id="pageListTitle" class="panel-title">页面</div>
<div id="navigationTabs" class="navigation-tabs" hidden>
<button id="pagesTab" type="button" data-selected="true">页面</button>
<button id="outlinesTab" type="button" data-selected="false" tabindex="-1">目录</button>
<button id="annotationsTab" type="button" data-selected="false" tabindex="-1">注解</button>
<button id="searchTab" type="button" data-selected="false" tabindex="-1">搜索</button>
</div>
<div id="pageSelectionTools" class="page-selection-tools" hidden>
<span id="pageSelectionCount"></span>
<button id="selectAllPages" class="small-button" type="button">全选</button>
<button id="finishPageSelection" class="small-button" type="button">完成</button>
</div>
<div id="navigationContent" class="navigation-content">
<div id="pageList" class="page-list"></div>
<div id="outlineList" hidden></div>
<div id="annotationsPanel" hidden>
<div class="search-form"><input id="annotationsFilter" type="search" placeholder="搜索文字" autocomplete="off"><select id="annotationsKind"><option value="">全部</option></select></div>
<div id="annotationsStatus" class="form-status"></div>
<div id="annotationsList" class="annotation-summary-list"></div>
</div>
<div id="searchPanel" hidden>
<form id="searchForm" class="search-form">
<input id="searchInput" type="search" placeholder="搜索文字" autocomplete="off">
<button type="submit" class="button">搜索</button>
</form>
<div class="search-tools">
<span id="searchStatus"></span>
<span id="searchCount">0 / 0</span>
<button id="searchPrev" type="button" class="icon-button arrow-prev" title="上一处" disabled></button>
<button id="searchNext" type="button" class="icon-button arrow-next" title="下一处" disabled></button>
</div>
<div id="searchResults" class="search-results"></div>
</div>
</div>
</aside>
<section class="viewer-panel" tabindex="0">
<div id="emptyState" class="empty-state">选择 OFD、PDF 文件</div>
<div id="progressPanel" class="progress-panel" hidden>
<div class="progress-spinner"></div>
<div id="progressLabel" class="progress-label">加载中</div>
<button id="cancelExportButton" class="small-button" type="button" hidden>取消</button>
<div class="progress-track">
<div id="progressBar" class="progress-bar"></div>
</div>
</div>
<div id="pageFrame" class="page-frame" hidden>
<div id="svgHost" class="svg-host"></div>
</div>
</section>
<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>
<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>
<div class="panel-actions"><span id="signatureSummary" class="count-pill">0</span><button id="signatureClear" class="small-button" type="button" hidden>清空</button></div>
</div>
<div id="signatureList" class="signature-list"></div>
</section>
<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>
</div>
<div id="docFontList" class="doc-font-list"></div>
</section>
<section class="font-panel">
<div class="panel-row">
<div id="fontPanelTitle" class="panel-title compact">可用字体</div>
<div class="panel-actions">
<span id="availableFontSummary" class="count-pill">0</span>
<button id="localFontButton" class="small-button" type="button">系统</button>
<button id="fontAddButton" class="small-button" type="button">添加</button>
<button id="fontDirectoryButton" class="small-button" type="button">目录</button>
</div>
</div>
<div id="fontPermissionHint" class="font-permission-hint" hidden>系统字体未授权</div>
<div id="fontList" class="font-list"></div>
</section>
</aside>
</main>
<footer class="app-footer app-bar">
<div class="footer-side"><a class="footer-action" href="https://aite.me/" target="_blank" rel="noreferrer">官方网站</a></div>
<div id="statusText" class="status-text">正在准备引擎</div>
<div class="footer-side footer-side-right"><button id="aboutButton" class="footer-action" type="button">软件信息</button></div>
</footer>
</div>
<div id="ofdgoPrintDocument">请先在OFDGo中打开打印预览,准备完整文档后打印。</div>
<script type="module" src="./ofdgo.js"></script>
</body>
</html>