@guodun/antdv 1.3.1 → 1.4.0

package/dist/es/components/pro-contract-template-designer/src/ProContractTemplateRenderer.vue.mjs

@@ -1,21 +1,18 @@
-import e from "../../../node_modules/@ant-design/icons-vue/es/icons/LeftOutlined.mjs";
-import t from "../../../node_modules/@ant-design/icons-vue/es/icons/RightOutlined.mjs";
-import { isContractTemplateFieldType as n } from "./types.mjs";
-import { buildInitialRenderValues as r, buildTemplateRenderPages as ee, isEmptyRenderValue as i, normalizeRenderValues as a, resolveTemplateRenderSubmitErrors as te, validateTemplateRenderStructure as ne, validateTemplateRenderValues as re } from "./utils/template-renderer.mjs";
-import ie from "./ContractTemplateRendererField.mjs";
-import ae from "./ContractTemplateRendererHeader.mjs";
-import oe from "./ContractTemplateRendererPage.mjs";
-import { Fragment as se, computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createTextVNode as ce, createVNode as d, defineComponent as f, mergeProps as le, nextTick as ue, normalizeClass as p, onBeforeUnmount as de, openBlock as m, ref as h, renderList as g, renderSlot as fe, toDisplayString as _, unref as v, watch as y, withCtx as b } from "vue";
-import { Button as pe, Empty as x, Progress as me, Tooltip as he } from "ant-design-vue";
-import { useElementSize as ge } from "@vueuse/core";
+import { isContractTemplateFieldType as e } from "./types.mjs";
+import { buildInitialRenderValues as t, buildTemplateRenderPages as n, isEmptyRenderValue as r, normalizeRenderValues as i, resolveTemplateRenderSubmitErrors as ee, validateTemplateRenderStructure as te, validateTemplateRenderValues as ne } from "./utils/template-renderer.mjs";
+import re from "./ContractTemplateRendererField.mjs";
+import ie from "./ContractTemplateRendererHeader.mjs";
+import ae from "./ContractTemplateRendererPage.mjs";
+import oe from "./ContractTemplateRendererValidation.mjs";
+import { Fragment as se, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createTextVNode as ce, createVNode as u, defineComponent as d, mergeProps as le, nextTick as ue, normalizeClass as f, onBeforeUnmount as de, openBlock as p, ref as m, renderList as fe, renderSlot as pe, toDisplayString as h, unref as g, watch as _, withCtx as v } from "vue";
+import { Button as me, Empty as y, Progress as he, Tooltip as ge } from "ant-design-vue";
+import { useElementSize as _e } from "@vueuse/core";
+import { LeftOutlined as ve, RightOutlined as ye } from "@ant-design/icons-vue";
 //#region src/components/pro-contract-template-designer/src/ProContractTemplateRenderer.vue?vue&type=script&setup=true&lang.ts
-var _e = { class: "gd-contract-template-renderer__validation-bar" }, ve = ["aria-expanded"], ye = {
-	key: 0,
-	class: "gd-contract-template-renderer__validation-list"
-}, be = ["onClick"], xe = {
+var be = {
 	key: 2,
 	class: "gd-contract-template-renderer__empty"
-}, Se = ["data-highlighted-variable-key"], Ce = { class: "gd-contract-template-renderer__pages" }, we = ["aria-label", "aria-expanded"], Te = { class: "gd-contract-template-renderer__panel-clip" }, Ee = { class: "gd-contract-template-renderer__panel" }, De = { class: "gd-contract-template-renderer__panel-head" }, Oe = { class: "gd-contract-template-renderer__panel-head-row" }, ke = { class: "gd-contract-template-renderer__panel-head-actions" }, Ae = ["data-field-key"], je = .5, Me = 1.5, S = .1, Ne = 3e3, Pe = /* @__PURE__ */ f({
+}, xe = ["data-highlighted-variable-key"], Se = { class: "gd-contract-template-renderer__pages" }, Ce = ["aria-label", "aria-expanded"], we = { class: "gd-contract-template-renderer__panel-clip" }, Te = { class: "gd-contract-template-renderer__panel" }, Ee = { class: "gd-contract-template-renderer__panel-head" }, De = { class: "gd-contract-template-renderer__panel-head-row" }, Oe = { class: "gd-contract-template-renderer__panel-head-actions" }, ke = ["data-field-key"], Ae = .5, je = 1.5, b = .1, Me = 3e3, Ne = /* @__PURE__ */ d({
 	name: "ProContractTemplateRenderer",
 	__name: "ProContractTemplateRenderer",
 	props: {
@@ -68,265 +65,265 @@ var _e = { class: "gd-contract-template-renderer__validation-bar" }, ve = ["aria
 		"submit",
 		"update:zoom"
 	],
-	setup(f, { expose: Pe, emit: Fe }) {
-		let C = f, w = Fe, Ie = h(), T = h(), Le = h(), E = h(a(C.template, C.values)), D = h({ ...E.value }), O = h(!1), k = h([]), A = h(!1), j = h(!1), Re = h(""), M = h(""), N = h(""), P = h(ht(C.zoom)), F = h(!1), I = h(!1), { width: ze } = ge(T), Be = o(() => C.readonly || C.disabled), L = o(() => ne(C.template)), R = o(() => O.value ? k.value : L.value), z = o(() => (Array.isArray(C.template?.variables) ? C.template.variables : []).filter((e) => !!e?.key && n(e.type ?? "text"))), B = o(() => F.value ? z.value.filter((e) => i(E.value[e.key])) : z.value), Ve = o(() => z.value.filter((e) => i(E.value[e.key])).length), He = o(() => {
+	setup(d, { expose: Ne, emit: Pe }) {
+		let x = d, S = Pe, Fe = m(), C = m(), Ie = m(), w = m(i(x.template, x.values)), T = m({ ...w.value }), E = m(!1), D = m([]), O = m(!1), k = m(!1), A = m(""), j = m(""), M = m(""), N = m(ft(x.zoom)), P = m(!1), F = m(!1), { width: Le } = _e(C), Re = a(() => x.readonly || x.disabled), I = a(() => te(x.template)), L = a(() => E.value ? D.value : I.value), R = a(() => (Array.isArray(x.template?.variables) ? x.template.variables : []).filter((t) => !!t?.key && e(t.type ?? "text"))), z = a(() => P.value ? R.value.filter((e) => r(w.value[e.key])) : R.value), ze = a(() => R.value.filter((e) => r(w.value[e.key])).length), Be = a(() => {
 			let e = /* @__PURE__ */ new Map();
-			return R.value.forEach((t) => {
+			return L.value.forEach((t) => {
 				t.variableKey && e.set(t.variableKey, [...e.get(t.variableKey) ?? [], t]);
 			}), e;
-		}), V = o(() => {
-			let e = C.interactionMode === "panel";
-			return ee(C.template, e ? E.value : D.value, {
-				readonly: C.readonly,
-				disabled: C.disabled,
+		}), B = a(() => {
+			let e = x.interactionMode === "panel";
+			return n(x.template, e ? w.value : T.value, {
+				readonly: x.readonly,
+				disabled: x.disabled,
 				mode: e ? "display" : "control",
-				activeKey: e ? M.value : ""
+				activeKey: e ? j.value : ""
 			});
-		}), H = o(() => V.value.length > 0), U = o(() => z.value.filter((e) => !i(E.value[e.key])).length), W = o(() => z.value.filter((e) => e.required && i(E.value[e.key])).length), Ue = o(() => z.value.length ? Math.round(U.value / z.value.length * 100) : 0), We = o(() => O.value && k.value.length === 0), Ge = o(() => O.value ? We.value ? "校验通过，模板与填写值均符合规则" : `发现 ${k.value.length} 个模板或填写问题` : L.value.length ? `模板存在 ${L.value.length} 个问题，已安全降级展示` : ""), Ke = o(() => O.value ? R.value.length > 0 || j.value : L.value.length > 0);
-		y(() => C.template, (e) => {
-			G(a(e, C.values), !1), $e();
+		}), V = a(() => B.value.length > 0), H = a(() => R.value.filter((e) => !r(w.value[e.key])).length), U = a(() => R.value.filter((e) => e.required && r(w.value[e.key])).length), Ve = a(() => R.value.length ? Math.round(H.value / R.value.length * 100) : 0), He = a(() => E.value && D.value.length === 0), Ue = a(() => E.value ? He.value ? "校验通过，模板与填写值均符合规则" : `发现 ${D.value.length} 个模板或填写问题` : I.value.length ? `模板存在 ${I.value.length} 个问题，已安全降级展示` : ""), We = a(() => E.value ? L.value.length > 0 || k.value : I.value.length > 0);
+		_(() => x.template, (e) => {
+			W(i(e, x.values), !1), J();
 			let t = Array.isArray(e?.pages) ? e.pages.map((e) => e?.id) : [];
-			t.includes(N.value) || (N.value = t.find(Boolean) ?? ""), M.value && !z.value.some((e) => e.key === M.value) && it();
-		}, { deep: !0 }), y(() => C.values, (e) => {
-			let t = a(C.template, e);
-			gt(t, E.value) || (G(t, !1), $e());
-		}, { deep: !0 }), y(() => C.interactionMode, (e) => {
-			e === "inline" && (D.value = { ...E.value });
-		}), y(() => C.collapsiblePanel, (e) => {
-			e || (I.value = !1);
-		}), y(() => C.zoom, (e) => P.value = ht(e)), y(V, (e) => {
-			!N.value && e.length && (N.value = e[0].id);
+			t.includes(M.value) || (M.value = t.find(Boolean) ?? ""), j.value && !R.value.some((e) => e.key === j.value) && tt();
+		}, { deep: !0 }), _(() => x.values, (e) => {
+			let t = i(x.template, e);
+			mt(t, w.value) || (W(t, !1), J());
+		}, { deep: !0 }), _(() => x.interactionMode, (e) => {
+			e === "inline" && (T.value = { ...w.value });
+		}), _(() => x.collapsiblePanel, (e) => {
+			e || (F.value = !1);
+		}), _(() => x.zoom, (e) => N.value = ft(e)), _(B, (e) => {
+			!M.value && e.length && (M.value = e[0].id);
 		}, { immediate: !0 });
-		function G(e, t = !0, n = {}) {
-			E.value = { ...e }, n.refreshInlineHtml !== !1 && (D.value = { ...e }), t && (w("update:values", { ...E.value }), w("change", { ...E.value }));
+		function W(e, t = !0, n = {}) {
+			w.value = { ...e }, n.refreshInlineHtml !== !1 && (T.value = { ...e }), t && (S("update:values", { ...w.value }), S("change", { ...w.value }));
 		}
-		function K(e, t) {
-			!e || Be.value || (G({
-				...E.value,
+		function G(e, t) {
+			!e || Re.value || (W({
+				...w.value,
 				[e]: t
-			}, !0, { refreshInlineHtml: C.interactionMode !== "inline" }), O.value && J());
+			}, !0, { refreshInlineHtml: x.interactionMode !== "inline" }), E.value && q());
 		}
-		function qe(e) {
-			if (C.interactionMode !== "inline") return;
+		function Ge(e) {
+			if (x.interactionMode !== "inline") return;
 			let t = e.target;
 			if (!(t instanceof HTMLInputElement) && !(t instanceof HTMLTextAreaElement)) return;
 			let n = t.dataset.key || "";
-			n && (t instanceof HTMLInputElement && t.type === "checkbox" ? K(n, t.checked) : t instanceof HTMLInputElement && t.type === "number" ? K(n, t.value === "" ? void 0 : t.valueAsNumber) : K(n, t.value));
+			n && (t instanceof HTMLInputElement && t.type === "checkbox" ? G(n, t.checked) : t instanceof HTMLInputElement && t.type === "number" ? G(n, t.value === "" ? void 0 : t.valueAsNumber) : G(n, t.value));
 		}
-		function Je(e) {
+		function Ke(e) {
 			let t = e.target;
 			if (!(t instanceof Element)) return;
 			let n = t.closest("[data-render-page-id]");
-			n?.dataset.renderPageId && (N.value = n.dataset.renderPageId);
+			n?.dataset.renderPageId && (M.value = n.dataset.renderPageId);
 			let r = t.closest("[data-contract-render-wrapper], [data-contract-render-control]")?.dataset.key || "";
-			r && rt(r);
+			r && et(r);
 		}
-		function Ye(e) {
+		function qe(e) {
 			if (e.key !== "Enter" && e.key !== " ") return;
 			let t = e.target;
-			!(t instanceof HTMLElement) || !t.dataset.key || (e.preventDefault(), rt(t.dataset.key));
+			!(t instanceof HTMLElement) || !t.dataset.key || (e.preventDefault(), et(t.dataset.key));
 		}
-		function q() {
-			return { ...E.value };
+		function K() {
+			return { ...w.value };
 		}
-		function Xe(e) {
-			G(a(C.template, e));
+		function Je(e) {
+			W(i(x.template, e));
 		}
-		function J() {
-			let e = re(C.template, E.value);
-			return et(e), w("validate", e), e;
+		function q() {
+			let e = ne(x.template, w.value);
+			return Ze(e), S("validate", e), e;
 		}
-		function Ze() {
-			let e = te(C.template, E.value, C.validateOnSubmit);
-			if ((C.validateOnSubmit || e.length) && (et(e), w("validate", e)), e.length) return ot(e[0]), !1;
-			let t = q();
-			return w("submit", t), t;
+		function Ye() {
+			let e = ee(x.template, w.value, x.validateOnSubmit);
+			if ((x.validateOnSubmit || e.length) && (Ze(e), S("validate", e)), e.length) return rt(e[0]), !1;
+			let t = K();
+			return S("submit", t), t;
 		}
-		function Qe() {
-			return G(r(C.template)), $e(), q();
+		function Xe() {
+			return W(t(x.template)), J(), K();
 		}
-		function $e() {
-			O.value = !1, k.value = [], A.value = !1, j.value = !1, X();
+		function J() {
+			E.value = !1, D.value = [], O.value = !1, k.value = !1, X();
 		}
-		function et(e) {
-			if (k.value = e, O.value = !0, A.value = !1, e.length) {
-				j.value = !1, X();
+		function Ze(e) {
+			if (D.value = e, E.value = !0, O.value = !1, e.length) {
+				k.value = !1, X();
 				return;
 			}
-			tt();
+			Qe();
 		}
 		let Y;
 		function X() {
 			Y &&= (clearTimeout(Y), void 0);
 		}
-		function tt() {
-			X(), j.value = !0, Y = setTimeout(() => {
-				j.value = !1, Y = void 0;
-			}, Ne);
+		function Qe() {
+			X(), k.value = !0, Y = setTimeout(() => {
+				k.value = !1, Y = void 0;
+			}, Me);
 		}
 		function Z(e) {
-			rt(e, !0);
+			et(e, !0);
 		}
-		function nt(e) {
-			C.interactionMode === "panel" && (I.value &&= !1, F.value && z.value.some((t) => t.key === e) && !B.value.some((t) => t.key === e) && (F.value = !1));
+		function $e(e) {
+			x.interactionMode === "panel" && (F.value &&= !1, P.value && R.value.some((t) => t.key === e) && !z.value.some((t) => t.key === e) && (P.value = !1));
 		}
-		function rt(e, t = !1) {
-			e && (nt(e), M.value = e, Re.value = e, ue(() => {
-				at(e);
-				let n = T.value?.querySelector(`[data-key="${$(e)}"]`), r = n?.closest("[data-render-page-id]");
-				r?.dataset.renderPageId && (N.value = r.dataset.renderPageId), t && n?.scrollIntoView({
+		function et(e, t = !1) {
+			e && ($e(e), j.value = e, A.value = e, ue(() => {
+				nt(e);
+				let n = C.value?.querySelector(`[data-key="${pt(e)}"]`), r = n?.closest("[data-render-page-id]");
+				r?.dataset.renderPageId && (M.value = r.dataset.renderPageId), t && n?.scrollIntoView({
 					behavior: "smooth",
 					block: "center",
 					inline: "center"
-				}), C.interactionMode === "panel" && Le.value?.querySelector(`[data-field-key="${$(e)}"]`)?.scrollIntoView({
+				}), x.interactionMode === "panel" && Ie.value?.querySelector(`[data-field-key="${pt(e)}"]`)?.scrollIntoView({
 					behavior: "smooth",
 					block: "nearest"
 				});
 			}));
 		}
-		function it() {
-			M.value = "", Re.value = "", at("");
+		function tt() {
+			j.value = "", A.value = "", nt("");
 		}
-		function at(e) {
-			T.value?.querySelectorAll("[data-contract-render-wrapper], [data-contract-render-control]").forEach((t) => t.classList.toggle("is-active", !!e && t.dataset.key === e));
+		function nt(e) {
+			C.value?.querySelectorAll("[data-contract-render-wrapper], [data-contract-render-control]").forEach((t) => t.classList.toggle("is-active", !!e && t.dataset.key === e));
 		}
-		function ot(e) {
-			e.variableKey ? Z(e.variableKey) : e.pageId && mt(e.pageId);
+		function rt(e) {
+			e.variableKey ? Z(e.variableKey) : e.pageId && dt(e.pageId);
 		}
-		function st(e) {
-			return He.value.get(e) ?? [];
+		function it(e) {
+			return Be.value.get(e) ?? [];
 		}
-		function ct(e) {
+		function at(e) {
 			return {
 				variable: e,
-				value: E.value[e.key],
-				errors: st(e.key),
-				active: M.value === e.key,
-				readonly: C.readonly,
-				disabled: C.disabled,
-				updateValue: (t) => K(e.key, t),
+				value: w.value[e.key],
+				errors: it(e.key),
+				active: j.value === e.key,
+				readonly: x.readonly,
+				disabled: x.disabled,
+				updateValue: (t) => G(e.key, t),
 				focusVariable: () => Z(e.key)
 			};
 		}
-		function lt() {
-			let e = z.value;
+		function ot() {
+			let e = R.value;
 			if (!e.length) return;
-			let t = e.findIndex((e) => e.key === M.value), n = t < 0 ? 0 : t + 1;
+			let t = e.findIndex((e) => e.key === j.value), n = t < 0 ? 0 : t + 1;
 			for (let t = 0; t < e.length; t += 1) {
-				let r = e[(n + t) % e.length];
-				if (i(E.value[r.key])) {
-					Z(r.key);
+				let i = e[(n + t) % e.length];
+				if (r(w.value[i.key])) {
+					Z(i.key);
 					return;
 				}
 			}
 		}
-		function ut() {
-			!C.collapsiblePanel || C.interactionMode !== "panel" || (I.value = !I.value);
+		function st() {
+			!x.collapsiblePanel || x.interactionMode !== "panel" || (F.value = !F.value);
 		}
 		function Q(e) {
-			let t = ht(e);
-			return P.value = t, w("update:zoom", t), t;
+			let t = ft(e);
+			return N.value = t, S("update:zoom", t), t;
 		}
-		function dt() {
+		function ct() {
 			return Q(1);
 		}
-		function ft() {
-			return P.value;
+		function lt() {
+			return N.value;
 		}
-		function pt() {
-			let e = Math.max(...V.value.map((e) => e.width), 1);
-			return Q(Math.max(0, ze.value - 48) / e);
+		function ut() {
+			let e = Math.max(...B.value.map((e) => e.width), 1);
+			return Q(Math.max(0, Le.value - 48) / e);
 		}
-		function mt(e) {
-			e && (N.value = e, ue(() => {
-				T.value?.querySelector(`[data-render-page-id="${$(e)}"]`)?.scrollIntoView({
+		function dt(e) {
+			e && (M.value = e, ue(() => {
+				C.value?.querySelector(`[data-render-page-id="${pt(e)}"]`)?.scrollIntoView({
 					behavior: "smooth",
 					block: "start",
 					inline: "center"
 				});
 			}));
 		}
-		function ht(e) {
+		function ft(e) {
 			let t = Number(e);
-			return Number.isFinite(t) ? Math.min(Me, Math.max(je, Math.round(t * 100) / 100)) : 1;
+			return Number.isFinite(t) ? Math.min(je, Math.max(Ae, Math.round(t * 100) / 100)) : 1;
 		}
-		function $(e) {
+		function pt(e) {
 			return e.replaceAll("\\", "\\\\").replaceAll("\"", "\\\"");
 		}
-		function gt(e, t) {
+		function mt(e, t) {
 			let n = new Set([...Object.keys(e), ...Object.keys(t)]);
 			return Array.from(n).every((n) => e[n] === t[n]);
 		}
-		function _t(e) {
-			!(e.ctrlKey || e.metaKey) || !H.value || (e.preventDefault(), Q(e.deltaY > 0 ? P.value - S : P.value + S));
+		function ht(e) {
+			!(e.ctrlKey || e.metaKey) || !V.value || (e.preventDefault(), Q(e.deltaY > 0 ? N.value - b : N.value + b));
 		}
-		let vt;
-		function yt() {
-			vt?.removeEventListener("wheel", _t), vt = void 0;
+		let $;
+		function gt() {
+			$?.removeEventListener("wheel", ht), $ = void 0;
 		}
-		function bt(e) {
-			yt(), e && (e.addEventListener("wheel", _t, { passive: !1 }), vt = e);
+		function _t(e) {
+			gt(), e && (e.addEventListener("wheel", ht, { passive: !1 }), $ = e);
 		}
-		return y(T, (e) => {
-			bt(e);
+		return _(C, (e) => {
+			_t(e);
 		}, { immediate: !0 }), de(() => {
-			yt(), X();
-		}), Pe({
-			getValues: q,
-			setValues: Xe,
-			validate: J,
-			submit: Ze,
-			resetValues: Qe,
+			gt(), X();
+		}), Ne({
+			getValues: K,
+			setValues: Je,
+			validate: q,
+			submit: Ye,
+			resetValues: Xe,
 			scrollToVariable: Z,
 			setZoom: Q,
-			resetZoom: dt,
-			getZoom: ft,
-			fitWidth: pt,
-			scrollToPage: mt
-		}), (n, r) => (m(), l("section", {
+			resetZoom: ct,
+			getZoom: lt,
+			fitWidth: ut,
+			scrollToPage: dt
+		}), (e, t) => (p(), c("section", {
 			ref_key: "rendererElement",
-			ref: Ie,
-			class: p(["gd-contract-template-renderer", {
-				"is-disabled": f.disabled,
-				"is-readonly": f.readonly,
-				"is-panel": f.interactionMode === "panel",
-				"is-inline": f.interactionMode === "inline"
+			ref: Fe,
+			class: f(["gd-contract-template-renderer", {
+				"is-disabled": d.disabled,
+				"is-readonly": d.readonly,
+				"is-panel": d.interactionMode === "panel",
+				"is-inline": d.interactionMode === "inline"
 			}]),
-			onClick: Je,
-			onKeydown: Ye,
-			onInput: qe,
-			onChange: qe
+			onClick: Ke,
+			onKeydown: qe,
+			onInput: Ge,
+			onChange: Ge
 		}, [
-			H.value ? (m(), s(ae, {
+			V.value ? (p(), o(ie, {
 				key: 0,
-				title: f.title,
-				"filled-count": U.value,
-				"total-count": z.value.length,
-				"required-missing-count": W.value,
-				zoom: P.value,
-				pages: V.value,
-				"active-page-id": N.value,
-				"min-zoom": je,
-				"max-zoom": Me,
-				"show-toolbar": f.showToolbar,
-				"show-validate-button": f.showValidateButton,
-				"show-reset-button": f.showResetButton,
-				"show-submit-button": f.showSubmitButton,
-				"show-panel-toggle": f.interactionMode === "panel" && f.collapsiblePanel,
-				"panel-collapsed": I.value,
-				readonly: f.readonly,
-				disabled: f.disabled,
-				onZoomIn: r[0] ||= (e) => Q(P.value + S),
-				onZoomOut: r[1] ||= (e) => Q(P.value - S),
-				onResetZoom: dt,
-				onFitWidth: pt,
-				onSelectPage: mt,
-				onValidate: J,
-				onReset: Qe,
-				onSubmit: Ze,
-				onTogglePanel: ut
+				title: d.title,
+				"filled-count": H.value,
+				"total-count": R.value.length,
+				"required-missing-count": U.value,
+				zoom: N.value,
+				pages: B.value,
+				"active-page-id": M.value,
+				"min-zoom": Ae,
+				"max-zoom": je,
+				"show-toolbar": d.showToolbar,
+				"show-validate-button": d.showValidateButton,
+				"show-reset-button": d.showResetButton,
+				"show-submit-button": d.showSubmitButton,
+				"show-panel-toggle": d.interactionMode === "panel" && d.collapsiblePanel,
+				"panel-collapsed": F.value,
+				readonly: d.readonly,
+				disabled: d.disabled,
+				onZoomIn: t[0] ||= (e) => Q(N.value + b),
+				onZoomOut: t[1] ||= (e) => Q(N.value - b),
+				onResetZoom: ct,
+				onFitWidth: ut,
+				onSelectPage: dt,
+				onValidate: q,
+				onReset: Xe,
+				onSubmit: Ye,
+				onTogglePanel: st
 			}, {
-				extra: b(() => [fe(n.$slots, "headerExtra")]),
+				extra: v(() => [pe(e.$slots, "headerExtra")]),
 				_: 3
 			}, 8, [
 				"title",
@@ -344,104 +341,102 @@ var _e = { class: "gd-contract-template-renderer__validation-bar" }, ve = ["aria
 				"panel-collapsed",
 				"readonly",
 				"disabled"
-			])) : c("", !0),
-			Ke.value ? (m(), l("div", {
+			])) : s("", !0),
+			We.value ? (p(), o(oe, {
 				key: 1,
-				class: p(["gd-contract-template-renderer__validation", We.value ? "is-success" : "is-error"]),
-				role: "status"
-			}, [u("div", _e, [u("span", null, _(Ge.value), 1), R.value.length ? (m(), l("button", {
-				key: 0,
-				type: "button",
-				class: "gd-contract-template-renderer__validation-toggle",
-				"aria-expanded": A.value,
-				onClick: r[2] ||= (e) => A.value = !A.value
-			}, _(A.value ? "收起" : `展开 ${R.value.length} 个问题`), 9, ve)) : c("", !0)]), A.value && R.value.length ? (m(), l("div", ye, [(m(!0), l(se, null, g(R.value, (e) => (m(), l("button", {
-				key: `${e.code}-${e.id}-${e.message}`,
-				type: "button",
-				class: "gd-contract-template-renderer__validation-item",
-				onClick: (t) => ot(e)
-			}, _(e.message), 9, be))), 128))])) : c("", !0)], 2)) : c("", !0),
-			H.value ? (m(), l("div", {
+				passed: He.value,
+				summary: Ue.value,
+				errors: L.value,
+				expanded: O.value,
+				onToggle: t[2] ||= (e) => O.value = !O.value,
+				onFocusError: rt
+			}, null, 8, [
+				"passed",
+				"summary",
+				"errors",
+				"expanded"
+			])) : s("", !0),
+			V.value ? (p(), c("div", {
 				key: 3,
-				class: p(["gd-contract-template-renderer__workspace", { "is-inline": f.interactionMode === "inline" }])
-			}, [u("div", {
+				class: f(["gd-contract-template-renderer__workspace", { "is-inline": d.interactionMode === "inline" }])
+			}, [l("div", {
 				ref_key: "pagesViewportElement",
-				ref: T,
+				ref: C,
 				class: "gd-contract-template-renderer__pages-viewport",
-				"data-highlighted-variable-key": Re.value
-			}, [u("div", Ce, [(m(!0), l(se, null, g(V.value, (e, t) => (m(), s(oe, {
+				"data-highlighted-variable-key": A.value
+			}, [l("div", Se, [(p(!0), c(se, null, fe(B.value, (e, t) => (p(), o(ae, {
 				key: e.id,
 				page: e,
 				index: t,
-				total: V.value.length,
-				zoom: P.value,
-				"show-meta": f.showPageMeta
+				total: B.value.length,
+				zoom: N.value,
+				"show-meta": d.showPageMeta
 			}, null, 8, [
 				"page",
 				"index",
 				"total",
 				"zoom",
 				"show-meta"
-			]))), 128))])], 8, Se), f.interactionMode === "panel" ? (m(), l("div", {
+			]))), 128))])], 8, xe), d.interactionMode === "panel" ? (p(), c("div", {
 				key: 0,
-				class: p(["gd-contract-template-renderer__panel-wrap", { "is-collapsed": I.value && f.collapsiblePanel }])
-			}, [f.collapsiblePanel ? (m(), s(v(he), {
+				class: f(["gd-contract-template-renderer__panel-wrap", { "is-collapsed": F.value && d.collapsiblePanel }])
+			}, [d.collapsiblePanel ? (p(), o(g(ge), {
 				key: 0,
-				title: I.value ? "展开填写面板" : "收起填写面板"
+				title: F.value ? "展开填写面板" : "收起填写面板"
 			}, {
-				default: b(() => [u("button", {
+				default: v(() => [l("button", {
 					type: "button",
 					class: "gd-contract-template-renderer__panel-handle",
-					"aria-label": I.value ? "展开填写面板" : "收起填写面板",
-					"aria-expanded": !I.value,
-					onClick: r[3] ||= (e) => I.value = !I.value
-				}, [I.value ? (m(), s(v(e), {
+					"aria-label": F.value ? "展开填写面板" : "收起填写面板",
+					"aria-expanded": !F.value,
+					onClick: t[3] ||= (e) => F.value = !F.value
+				}, [F.value ? (p(), o(g(ve), {
 					key: 0,
 					"aria-hidden": "true"
-				})) : (m(), s(v(t), {
+				})) : (p(), o(g(ye), {
 					key: 1,
 					"aria-hidden": "true"
-				}))], 8, we)]),
+				}))], 8, Ce)]),
 				_: 1
-			}, 8, ["title"])) : c("", !0), u("div", Te, [u("aside", Ee, [u("div", De, [
-				u("div", Oe, [u("div", null, [r[5] ||= u("strong", null, "填写项", -1), u("span", null, _(U.value) + " / " + _(z.value.length) + " 已填写", 1)]), u("span", null, _(W.value ? `${W.value} 项必填未完成` : "必填项已完成"), 1)]),
-				u("div", ke, [d(v(pe), {
+			}, 8, ["title"])) : s("", !0), l("div", we, [l("aside", Te, [l("div", Ee, [
+				l("div", De, [l("div", null, [t[5] ||= l("strong", null, "填写项", -1), l("span", null, h(H.value) + " / " + h(R.value.length) + " 已填写", 1)]), l("span", null, h(U.value ? `${U.value} 项必填未完成` : "必填项已完成"), 1)]),
+				l("div", Oe, [u(g(me), {
 					size: "small",
-					type: F.value ? "primary" : "default",
-					onClick: r[4] ||= (e) => F.value = !F.value
+					type: P.value ? "primary" : "default",
+					onClick: t[4] ||= (e) => P.value = !P.value
 				}, {
-					default: b(() => [...r[6] ||= [ce(" 仅看未填 ", -1)]]),
+					default: v(() => [...t[6] ||= [ce(" 仅看未填 ", -1)]]),
 					_: 1
-				}, 8, ["type"]), d(v(pe), {
+				}, 8, ["type"]), u(g(me), {
 					size: "small",
-					disabled: !Ve.value,
-					onClick: lt
+					disabled: !ze.value,
+					onClick: ot
 				}, {
-					default: b(() => [...r[7] ||= [ce(" 下一个未填项 ", -1)]]),
+					default: v(() => [...t[7] ||= [ce(" 下一个未填项 ", -1)]]),
 					_: 1
 				}, 8, ["disabled"])]),
-				d(v(me), {
-					percent: Ue.value,
+				u(g(he), {
+					percent: Ve.value,
 					size: "small",
 					"show-info": !1
 				}, null, 8, ["percent"])
-			]), B.value.length ? (m(), l("div", {
+			]), z.value.length ? (p(), c("div", {
 				key: 1,
 				ref_key: "fieldListElement",
-				ref: Le,
+				ref: Ie,
 				class: "gd-contract-template-renderer__field-list"
-			}, [(m(!0), l(se, null, g(B.value, (e) => (m(), l("div", {
-				key: e.id || e.key,
-				"data-field-key": e.key
-			}, [fe(n.$slots, "field", le({ ref_for: !0 }, ct(e)), () => [d(ie, {
-				variable: e,
-				value: E.value[e.key],
-				errors: st(e.key),
-				active: M.value === e.key,
-				readonly: f.readonly,
-				disabled: f.disabled,
-				onUpdateValue: (t) => K(e.key, t),
-				onFocusVariable: (t) => Z(e.key)
+			}, [(p(!0), c(se, null, fe(z.value, (t) => (p(), c("div", {
+				key: t.id || t.key,
+				"data-field-key": t.key
+			}, [pe(e.$slots, "field", le({ ref_for: !0 }, at(t)), () => [u(re, {
+				variable: t,
+				value: w.value[t.key],
+				errors: it(t.key),
+				active: j.value === t.key,
+				readonly: d.readonly,
+				disabled: d.disabled,
+				onUpdateValue: (e) => G(t.key, e),
+				onFocusVariable: (e) => Z(t.key)
 			}, null, 8, [
 				"variable",
 				"value",
@@ -451,16 +446,16 @@ var _e = { class: "gd-contract-template-renderer__validation-bar" }, ve = ["aria
 				"disabled",
 				"onUpdateValue",
 				"onFocusVariable"
-			])])], 8, Ae))), 128))], 512)) : (m(), s(v(x), {
+			])])], 8, ke))), 128))], 512)) : (p(), o(g(y), {
 				key: 0,
-				description: z.value.length ? "暂无未填项" : "暂无填写项",
-				image: v(x).PRESENTED_IMAGE_SIMPLE
-			}, null, 8, ["description", "image"]))])])], 2)) : c("", !0)], 2)) : (m(), l("div", xe, [d(v(x), {
+				description: R.value.length ? "暂无未填项" : "暂无填写项",
+				image: g(y).PRESENTED_IMAGE_SIMPLE
+			}, null, 8, ["description", "image"]))])])], 2)) : s("", !0)], 2)) : (p(), c("div", be, [u(g(y), {
 				description: "暂无可渲染的合同页面",
-				image: v(x).PRESENTED_IMAGE_SIMPLE
+				image: g(y).PRESENTED_IMAGE_SIMPLE
 			}, null, 8, ["image"])]))
 		], 34));
 	}
 });
 //#endregion
-export { Pe as default };
+export { Ne as default };