@l1yp/file-viewer 0.1.0

package/dist/components/XlsxChart.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,240 @@
+import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, openBlock as o, renderList as s, toDisplayString as c, vShow as l, withDirectives as u } from "vue";
+//#region src/components/XlsxChart.vue?vue&type=script&setup=true&lang.ts
+var d = [
+	"width",
+	"height",
+	"viewBox",
+	"aria-label"
+], f = ["width", "height"], p = ["x"], m = { class: "xc__grid" }, h = [
+	"x1",
+	"x2",
+	"y1",
+	"y2"
+], g = { class: "xc__ylabels" }, _ = ["x", "y"], v = { class: "xc__xlabels" }, y = ["x", "y"], b = ["points", "fill"], x = ["points", "stroke"], S = [
+	"cx",
+	"cy",
+	"fill"
+], C = [
+	"x",
+	"y",
+	"width",
+	"height",
+	"fill"
+], w = ["d", "fill"], T = ["x", "y"], E = {
+	key: 7,
+	class: "xc__legend"
+}, D = ["transform"], O = ["fill"], k = {
+	x: 12,
+	y: -1
+}, A = 38, j = 8, ee = 26, M = /*@__PURE__*/ a({
+	__name: "XlsxChart",
+	props: { chart: {} },
+	setup(a) {
+		let M = a, N = [
+			"#4472C4",
+			"#ED7D31",
+			"#A5A5A5",
+			"#FFC000",
+			"#5B9BD5",
+			"#70AD47",
+			"#264478",
+			"#9E480E"
+		], P = t(() => Math.max(220, M.chart.anchor.wPx)), F = t(() => Math.max(140, M.chart.anchor.hPx)), I = t(() => M.chart.series.length > 1), L = t(() => M.chart.title ? 18 : 4), R = t(() => I.value ? 16 : 0), z = t(() => {
+			let e = L.value + 4;
+			return {
+				x: A,
+				y: e,
+				w: Math.max(10, P.value - A - j),
+				h: Math.max(10, F.value - e - ee - R.value)
+			};
+		});
+		function B(e) {
+			return M.chart.series[e]?.color || N[e % N.length];
+		}
+		let V = t(() => {
+			let e = M.chart, t = e.series.flatMap((e) => e.values.filter((e) => e != null)), n = e.yMin, r = e.yMax;
+			if (n == null || r == null) {
+				let i = t.length ? Math.min(...t) : 0, a = t.length ? Math.max(...t) : 1;
+				(e.type === "bar" || e.type === "barH" || e.type === "area") && (i > 0 && (i = 0), a < 0 && (a = 0)), i === a && (--i, a += 1);
+				let o = (a - i) * .08;
+				n ??= i - o, r ??= a + o;
+			}
+			return r <= n && (r = n + 1), {
+				lo: n,
+				hi: r
+			};
+		}), H = t(() => {
+			let { lo: e, hi: t } = V.value, n = [];
+			for (let r = 0; r <= 4; r++) {
+				let i = e + (t - e) * r / 4;
+				n.push({
+					v: i,
+					y: z.value.y + z.value.h - z.value.h * r / 4
+				});
+			}
+			return n;
+		});
+		function U(e) {
+			let t = Math.abs(e);
+			return t >= 1e3 ? Math.round(e).toLocaleString("en-US") : t >= 1 ? (Math.round(e * 100) / 100).toString() : (Math.round(e * 1e3) / 1e3).toString();
+		}
+		let W = (e) => {
+			let { lo: t, hi: n } = V.value, r = z.value;
+			return r.y + r.h - (e - t) / (n - t) * r.h;
+		}, G = t(() => M.chart.categories), K = (e) => {
+			let t = z.value, n = Math.max(1, G.value.length);
+			return n === 1 ? t.x + t.w / 2 : t.x + t.w * e / (n - 1);
+		}, q = (e) => z.value.x + z.value.w * e / Math.max(1, G.value.length), J = t(() => z.value.w / Math.max(1, G.value.length));
+		function Y(e) {
+			return M.chart.series[e].values.map((e, t) => e == null ? null : `${K(t).toFixed(1)},${W(e).toFixed(1)}`).filter(Boolean).join(" ");
+		}
+		function X(e) {
+			let t = Y(e);
+			if (!t) return "";
+			z.value;
+			let n = t.split(" ")[0].split(",")[0], r = t.split(" ").at(-1).split(",")[0], i = W(Math.max(V.value.lo, 0)).toFixed(1);
+			return `${n},${i} ${t} ${r},${i}`;
+		}
+		let Z = t(() => {
+			let e = M.chart;
+			if (e.type !== "bar" && e.type !== "barH") return [];
+			let t = e.series.length, n = [], r = J.value * .18, i = (J.value - r) / Math.max(1, t), a = W(Math.max(V.value.lo, 0));
+			for (let o = 0; o < G.value.length; o++) for (let s = 0; s < t; s++) {
+				let t = e.series[s].values[o];
+				if (t == null) continue;
+				let c = q(o) + r / 2 + i * s, l = W(t);
+				n.push({
+					x: c,
+					y: Math.min(l, a),
+					w: Math.max(1, i - 1),
+					h: Math.max(1, Math.abs(a - l)),
+					fill: B(s)
+				});
+			}
+			return n;
+		}), Q = t(() => {
+			let e = M.chart;
+			if (e.type !== "pie") return [];
+			let t = e.series[0];
+			if (!t) return [];
+			let n = t.values.map((e) => e == null ? 0 : Math.abs(e)), r = n.reduce((e, t) => e + t, 0);
+			if (r <= 0) return [];
+			let i = z.value, a = i.x + i.w / 2, o = i.y + i.h / 2, s = Math.max(8, Math.min(i.w, i.h) / 2 - 2), c = -Math.PI / 2, l = [];
+			for (let e = 0; e < n.length; e++) {
+				if (n[e] <= 0) continue;
+				let t = c + n[e] / r * Math.PI * 2, i = +(t - c > Math.PI), u = a + s * Math.cos(c), d = o + s * Math.sin(c), f = a + s * Math.cos(t), p = o + s * Math.sin(t);
+				l.push({
+					d: `M${a.toFixed(1)},${o.toFixed(1)} L${u.toFixed(1)},${d.toFixed(1)} A${s.toFixed(1)},${s.toFixed(1)} 0 ${i} 1 ${f.toFixed(1)},${p.toFixed(1)} Z`,
+					fill: N[e % N.length],
+					label: G.value[e] ?? ""
+				});
+			}
+			return l;
+		}), te = t(() => {
+			let e = Math.max(2, Math.floor(z.value.w / 34));
+			return Math.max(1, Math.ceil(G.value.length / e));
+		}), $ = t(() => [
+			"line",
+			"area",
+			"scatter"
+		].includes(M.chart.type));
+		return (t, A) => (o(), r("svg", {
+			class: "xc",
+			width: P.value,
+			height: F.value,
+			viewBox: `0 0 ${P.value} ${F.value}`,
+			role: "img",
+			"aria-label": a.chart.title || "图表"
+		}, [
+			i("rect", {
+				class: "xc__bg",
+				width: P.value,
+				height: F.value,
+				rx: "3"
+			}, null, 8, f),
+			a.chart.title ? (o(), r("text", {
+				key: 0,
+				class: "xc__title",
+				x: P.value / 2,
+				y: 13,
+				"text-anchor": "middle"
+			}, c(a.chart.title), 9, p)) : n("", !0),
+			a.chart.type !== "pie" && a.chart.type !== "unknown" ? (o(), r(e, { key: 1 }, [
+				i("g", m, [(o(!0), r(e, null, s(H.value, (e, t) => (o(), r("line", {
+					key: t,
+					x1: z.value.x,
+					x2: z.value.x + z.value.w,
+					y1: e.y,
+					y2: e.y
+				}, null, 8, h))), 128))]),
+				i("g", g, [(o(!0), r(e, null, s(H.value, (e, t) => (o(), r("text", {
+					key: t,
+					x: z.value.x - 4,
+					y: e.y + 3,
+					"text-anchor": "end"
+				}, c(U(e.v)), 9, _))), 128))]),
+				i("g", v, [(o(!0), r(e, null, s(G.value, (e, t) => u((o(), r("text", {
+					key: t,
+					x: $.value ? K(t) : q(t) + J.value / 2,
+					y: z.value.y + z.value.h + 12,
+					"text-anchor": "middle"
+				}, c(e), 9, y)), [[l, t % te.value === 0]])), 128))])
+			], 64)) : n("", !0),
+			a.chart.type === "area" ? (o(!0), r(e, { key: 2 }, s(a.chart.series, (e, t) => (o(), r("polygon", {
+				key: "a" + t,
+				points: X(t),
+				fill: B(t),
+				"fill-opacity": "0.25",
+				stroke: "none"
+			}, null, 8, b))), 128)) : n("", !0),
+			$.value ? (o(), r(e, { key: 3 }, [(o(!0), r(e, null, s(a.chart.series, (e, t) => (o(), r("polyline", {
+				key: "l" + t,
+				points: Y(t),
+				fill: "none",
+				stroke: B(t),
+				"stroke-width": "1.6",
+				"stroke-linejoin": "round"
+			}, null, 8, x))), 128)), (o(!0), r(e, null, s(a.chart.series, (t, n) => (o(), r(e, { key: "m" + n }, [(o(!0), r(e, null, s(t.values, (e, t) => u((o(), r("circle", {
+				key: t,
+				cx: K(t),
+				cy: e == null ? 0 : W(e),
+				r: "1.8",
+				fill: B(n)
+			}, null, 8, S)), [[l, e != null]])), 128))], 64))), 128))], 64)) : n("", !0),
+			a.chart.type === "bar" || a.chart.type === "barH" ? (o(!0), r(e, { key: 4 }, s(Z.value, (e, t) => (o(), r("rect", {
+				key: t,
+				x: e.x,
+				y: e.y,
+				width: e.w,
+				height: e.h,
+				fill: e.fill
+			}, null, 8, C))), 128)) : n("", !0),
+			a.chart.type === "pie" ? (o(!0), r(e, { key: 5 }, s(Q.value, (e, t) => (o(), r("path", {
+				key: t,
+				d: e.d,
+				fill: e.fill,
+				stroke: "#fff",
+				"stroke-width": "0.6"
+			}, null, 8, w))), 128)) : n("", !0),
+			a.chart.type === "unknown" ? (o(), r("text", {
+				key: 6,
+				class: "xc__note",
+				x: P.value / 2,
+				y: F.value / 2,
+				"text-anchor": "middle"
+			}, " （暂不支持的图表类型） ", 8, T)) : n("", !0),
+			I.value ? (o(), r("g", E, [(o(!0), r(e, null, s(a.chart.series, (e, t) => (o(), r("g", {
+				key: t,
+				transform: `translate(${z.value.x + t * 84}, ${F.value - 4})`
+			}, [i("rect", {
+				width: 9,
+				height: 9,
+				y: -9,
+				fill: B(t),
+				rx: "1.5"
+			}, null, 8, O), i("text", k, c(e.name), 1)], 8, D))), 128))])) : n("", !0)
+		], 8, d));
+	}
+});
+//#endregion
+export { M as default };

package/dist/components/XlsxViewer.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./XlsxViewer.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                           */
+//#region src/components/XlsxViewer.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-7c63a9a3"]]);
+//#endregion
+export { n as default };

package/dist/components/XlsxViewer.vue.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Side-viewer spreadsheet (`.xlsx`/`.xlsm`) renderer. Fetches the workbook bytes and parses them entirely
+ * in-browser via exceljs (see lib/xlsx.ts), then renders each worksheet as a plain HTML `<table>` — merged
+ * cells, column widths, font sizes and the common cell styling carried over so the preview reads like the
+ * original. On top of the static table it adds the spreadsheet interactions: A/B/C… + row-number headers,
+ * collapsed hidden rows/columns with click-to-expand, frozen panes (with a 2px boundary rule), drag-to-resize
+ * columns/rows, drag-to-select a cell range (with a status-bar sum/avg), and embedded charts rendered as SVG
+ * (see lib/xlsxCharts.ts) overlaid at their drawing anchor. No CDN / network beyond the file fetch; a bottom
+ * tab bar switches sheets.
+ *
+ * Two entry shapes mirror the other viewers (DICOM/docx/zip): a real download URL for a held attachment, or
+ * a blob URL minted by the archive browsers from already-extracted bytes.
+ */
+type __VLS_Props = {
+    /** Download/blob URL of the .xlsx bytes. */
+    url?: string;
+    name: string;
+    size?: number;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;