@veltra/sheet 2.1.1 → 2.2.0

package/dist/components/report/designer-hub.js

@@ -0,0 +1,177 @@
+import { DEFAULT_CONNECTION_PORTS } from "../../report/connector.js";
+import _sfc_main$1 from "./hub-connection-form.js";
+import _sfc_main$2 from "./hub-dataset-editor.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, ref, renderList, toDisplayString, unref, watch, withCtx } from "vue";
+import { UButton, UTag } from "@veltra/desktop";
+import { bem } from "@veltra/utils";
+//#region src/components/report/designer-hub.vue
+const _hoisted_1 = ["onClick"];
+const _hoisted_2 = ["onClick"];
+const _sfc_main = /*@__PURE__*/ defineComponent({
+	name: "UReportDatasetHub",
+	__name: "designer-hub",
+	props: { hub: {} },
+	emits: ["close"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const cls = bem("report-hub");
+		const connections = computed(() => props.hub.connections.value);
+		const datasets = computed(() => props.hub.datasets.value);
+		function datasetsByConnection(connectionId) {
+			return datasets.value.filter((item) => item.connectionId === connectionId);
+		}
+		const activeConnectionId = ref();
+		const activeDatasetId = ref();
+		const creatingConnection = ref(false);
+		const connectionDraft = ref();
+		watch(connections, () => {
+			if (!activeConnectionId.value && connections.value[0]) {
+				activeConnectionId.value = connections.value[0].id;
+				syncConnectionDraft();
+			}
+		}, { immediate: true });
+		function syncConnectionDraft() {
+			if (activeDatasetId.value) {
+				connectionDraft.value = void 0;
+				return;
+			}
+			if (creatingConnection.value) return;
+			const id = activeConnectionId.value;
+			const conn = id ? connections.value.find((item) => item.id === id) : void 0;
+			connectionDraft.value = conn ? { ...conn } : void 0;
+		}
+		function selectConnection(connectionId) {
+			activeConnectionId.value = connectionId;
+			activeDatasetId.value = void 0;
+			creatingConnection.value = false;
+			syncConnectionDraft();
+		}
+		function selectDataset(datasetId) {
+			activeDatasetId.value = datasetId;
+			const dataset = datasets.value.find((item) => item.id === datasetId);
+			if (dataset) activeConnectionId.value = dataset.connectionId;
+			connectionDraft.value = void 0;
+			creatingConnection.value = false;
+		}
+		let connectionSeq = 0;
+		function startNewConnection() {
+			creatingConnection.value = true;
+			activeDatasetId.value = void 0;
+			connectionDraft.value = {
+				id: `conn-${Date.now()}-${connectionSeq++}`,
+				label: "新连接",
+				type: "mysql",
+				host: "127.0.0.1",
+				port: DEFAULT_CONNECTION_PORTS.mysql,
+				database: "",
+				username: "",
+				password: ""
+			};
+		}
+		function saveConnection(conn) {
+			if (creatingConnection.value) {
+				props.hub.addConnection(conn);
+				creatingConnection.value = false;
+			} else props.hub.updateConnection(conn);
+			activeConnectionId.value = conn.id;
+			syncConnectionDraft();
+		}
+		function removeActiveConnection() {
+			const id = activeConnectionId.value;
+			if (!id) return;
+			props.hub.removeConnection(id);
+			activeDatasetId.value = void 0;
+			activeConnectionId.value = connections.value[0]?.id;
+			creatingConnection.value = false;
+			syncConnectionDraft();
+		}
+		function addDataset(connectionId) {
+			const dataset = props.hub.addDataset(connectionId);
+			activeConnectionId.value = connectionId;
+			activeDatasetId.value = dataset.id;
+			creatingConnection.value = false;
+			connectionDraft.value = void 0;
+		}
+		function removeActiveDataset() {
+			const id = activeDatasetId.value;
+			if (!id) return;
+			props.hub.removeDataset(id);
+			activeDatasetId.value = datasets.value.find((item) => item.connectionId === activeConnectionId.value)?.id;
+			syncConnectionDraft();
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(unref(cls).b) }, [createElementVNode("header", { class: normalizeClass(unref(cls).e("head")) }, [createElementVNode("h3", { class: normalizeClass(unref(cls).e("title")) }, "数据中枢", 2), createVNode(unref(UButton), {
+				size: "small",
+				type: "primary",
+				onClick: _cache[0] || (_cache[0] = ($event) => emit("close"))
+			}, {
+				default: withCtx(() => [..._cache[1] || (_cache[1] = [createTextVNode("完成", -1)])]),
+				_: 1
+			})], 2), createElementVNode("div", { class: normalizeClass(unref(cls).e("body")) }, [createElementVNode("aside", { class: normalizeClass(unref(cls).e("sidebar")) }, [createElementVNode("div", { class: normalizeClass(unref(cls).e("sidebar-head")) }, [createElementVNode("span", { class: normalizeClass(unref(cls).e("sidebar-title")) }, "连接与数据集", 2), createVNode(unref(UButton), {
+				size: "small",
+				plain: "",
+				onClick: startNewConnection
+			}, {
+				default: withCtx(() => [..._cache[2] || (_cache[2] = [createTextVNode("新建连接", -1)])]),
+				_: 1
+			})], 2), createElementVNode("div", { class: normalizeClass(unref(cls).e("tree")) }, [(openBlock(true), createElementBlock(Fragment, null, renderList(connections.value, (conn) => {
+				return openBlock(), createElementBlock("section", {
+					key: conn.id,
+					class: normalizeClass(unref(cls).e("conn-group"))
+				}, [
+					createElementVNode("div", {
+						class: normalizeClass([unref(cls).e("conn"), unref(bem).is("active", activeConnectionId.value === conn.id && !activeDatasetId.value)]),
+						onClick: ($event) => selectConnection(conn.id)
+					}, [createElementVNode("span", { class: normalizeClass(unref(cls).e("conn-label")) }, toDisplayString(conn.label), 3), createVNode(unref(UTag), {
+						size: "small",
+						type: "info"
+					}, {
+						default: withCtx(() => [createTextVNode(toDisplayString(conn.type), 1)]),
+						_: 2
+					}, 1024)], 10, _hoisted_1),
+					createElementVNode("ul", { class: normalizeClass(unref(cls).e("dataset-list")) }, [(openBlock(true), createElementBlock(Fragment, null, renderList(datasetsByConnection(conn.id), (item) => {
+						return openBlock(), createElementBlock("li", {
+							key: item.id,
+							class: normalizeClass([unref(cls).e("dataset-item"), unref(bem).is("active", activeDatasetId.value === item.id)]),
+							onClick: ($event) => selectDataset(item.id)
+						}, [createElementVNode("span", null, toDisplayString(item.label), 1), createElementVNode("span", { class: normalizeClass(unref(cls).e("dataset-id")) }, toDisplayString(item.id), 3)], 10, _hoisted_2);
+					}), 128))], 2),
+					createVNode(unref(UButton), {
+						size: "small",
+						text: "",
+						class: normalizeClass(unref(cls).e("add-dataset")),
+						onClick: ($event) => addDataset(conn.id)
+					}, {
+						default: withCtx(() => [..._cache[3] || (_cache[3] = [createTextVNode(" + 新建数据集 ", -1)])]),
+						_: 1
+					}, 8, ["class", "onClick"])
+				], 2);
+			}), 128)), connections.value.length === 0 ? (openBlock(), createElementBlock("p", {
+				key: 0,
+				class: normalizeClass(unref(cls).e("sidebar-empty"))
+			}, " 尚无连接。点「新建连接」配置 MySQL / PostgreSQL 数据连接。 ", 2)) : createCommentVNode("v-if", true)], 2)], 2), createElementVNode("div", { class: normalizeClass(unref(cls).e("main")) }, [activeDatasetId.value ? (openBlock(), createBlock(_sfc_main$2, {
+				key: 0,
+				hub: __props.hub,
+				"dataset-id": activeDatasetId.value,
+				onRemove: removeActiveDataset
+			}, null, 8, ["hub", "dataset-id"])) : connectionDraft.value ? (openBlock(), createBlock(_sfc_main$1, {
+				key: 1,
+				connection: connectionDraft.value,
+				"is-new": creatingConnection.value,
+				test: __props.hub.testConnection,
+				onSave: saveConnection,
+				onRemove: removeActiveConnection
+			}, null, 8, [
+				"connection",
+				"is-new",
+				"test"
+			])) : (openBlock(), createElementBlock("div", {
+				key: 2,
+				class: normalizeClass(unref(cls).e("empty"))
+			}, [..._cache[4] || (_cache[4] = [createElementVNode("p", null, "选择左侧连接或数据集开始配置；数据集字段解析后即可在字段面板拖拽绑定。", -1)])], 2))], 2)], 2)], 2);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };

package/dist/components/report/field-panel-helpers.js

@@ -0,0 +1,33 @@
+//#region src/components/report/field-panel-helpers.ts
+/** 字段拖拽的 dataTransfer MIME（字段面板 dragstart / 网格 drop 共用） */
+const FIELD_DRAG_MIME = "application/x-sheet-report-field";
+/** 字段拖拽负载：`${datasetId}:${fieldName}` */
+function formatFieldDragPayload(datasetId, fieldName) {
+	return `${datasetId}:${fieldName}`;
+}
+/** 解析字段拖拽负载；非法输入返回 null */
+function parseFieldDragPayload(raw) {
+	const sep = raw.indexOf(":");
+	if (sep <= 0) return null;
+	const fieldName = raw.slice(sep + 1);
+	if (!fieldName) return null;
+	return {
+		datasetId: raw.slice(0, sep),
+		fieldName
+	};
+}
+function fieldTypeGlyph(type) {
+	if (type === "number") return "#";
+	if (type === "date") return "日";
+	return "文";
+}
+function filterDatasetsByQuery(datasets, query) {
+	const keyword = query.trim().toLowerCase();
+	if (!keyword) return datasets;
+	return datasets.map((dataset) => ({
+		...dataset,
+		fields: dataset.fields.filter((field) => field.label.toLowerCase().includes(keyword) || field.name.toLowerCase().includes(keyword))
+	})).filter((dataset) => dataset.fields.length > 0);
+}
+//#endregion
+export { FIELD_DRAG_MIME, fieldTypeGlyph, filterDatasetsByQuery, formatFieldDragPayload, parseFieldDragPayload };

package/dist/components/report/field-panel.js

@@ -0,0 +1,132 @@
+import { FIELD_DRAG_MIME, fieldTypeGlyph, filterDatasetsByQuery, formatFieldDragPayload } from "./field-panel-helpers.js";
+import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, ref, renderList, toDisplayString, unref, vShow, withCtx, withDirectives, withKeys, withModifiers } from "vue";
+import { UButton, UInput, UTag } from "@veltra/desktop";
+import { bem } from "@veltra/utils";
+//#region src/components/report/field-panel.vue
+const _hoisted_1 = [
+	"title",
+	"onClick",
+	"onKeydown",
+	"onDragstart"
+];
+const _hoisted_2 = ["data-type"];
+const _sfc_main = /*@__PURE__*/ defineComponent({
+	name: "UReportFieldPanel",
+	__name: "field-panel",
+	props: {
+		datasets: {},
+		selectionLabel: {},
+		boundKeys: {}
+	},
+	emits: ["bind"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const cls = bem("report-field-panel");
+		const searchQuery = ref("");
+		const collapsedDatasetIds = ref(/* @__PURE__ */ new Set());
+		const visibleDatasets = computed(() => filterDatasetsByQuery(props.datasets, searchQuery.value));
+		/** 折叠集合；搜索时视为全部展开（返回空集） */
+		const effectiveCollapsed = computed(() => {
+			if (!searchQuery.value.trim()) return collapsedDatasetIds.value;
+			return /* @__PURE__ */ new Set();
+		});
+		function isDatasetExpanded(datasetId) {
+			return !effectiveCollapsed.value.has(datasetId);
+		}
+		function isBound(datasetId, fieldName) {
+			return props.boundKeys.has(`${datasetId}:${fieldName}`);
+		}
+		function toggleDataset(datasetId) {
+			const next = new Set(collapsedDatasetIds.value);
+			if (next.has(datasetId)) next.delete(datasetId);
+			else next.add(datasetId);
+			collapsedDatasetIds.value = next;
+		}
+		function onDragStart(event, datasetId, fieldName) {
+			event.dataTransfer?.setData(FIELD_DRAG_MIME, formatFieldDragPayload(datasetId, fieldName));
+			if (event.dataTransfer) event.dataTransfer.effectAllowed = "copy";
+			const target = event.currentTarget;
+			if (event.dataTransfer && target instanceof HTMLElement) event.dataTransfer.setDragImage(target, Math.round(target.offsetWidth / 2), Math.round(target.offsetHeight / 2));
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("aside", { class: normalizeClass(unref(cls).b) }, [
+				createElementVNode("h3", { class: normalizeClass(unref(cls).e("title")) }, "数据集字段", 2),
+				createElementVNode("p", { class: normalizeClass(unref(cls).e("meta")) }, [_cache[1] || (_cache[1] = createTextVNode(" 当前选区： ", -1)), createVNode(unref(UTag), {
+					size: "small",
+					type: "primary"
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(__props.selectionLabel), 1)]),
+					_: 1
+				})], 2),
+				createVNode(unref(UInput), {
+					modelValue: searchQuery.value,
+					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => searchQuery.value = $event),
+					class: normalizeClass(unref(cls).e("search")),
+					size: "small",
+					clearable: "",
+					placeholder: "搜索字段…"
+				}, null, 8, ["modelValue", "class"]),
+				createElementVNode("p", { class: normalizeClass(unref(cls).e("hint")) }, "点击或拖拽字段到网格；中文名为主，英文键为绑定标识。", 2),
+				(openBlock(true), createElementBlock(Fragment, null, renderList(visibleDatasets.value, (dataset) => {
+					return openBlock(), createElementBlock("section", {
+						key: dataset.id,
+						class: normalizeClass(unref(cls).e("dataset"))
+					}, [createVNode(unref(UButton), {
+						text: "",
+						size: "small",
+						class: normalizeClass(unref(cls).e("dataset-toggle")),
+						"aria-expanded": isDatasetExpanded(dataset.id),
+						onClick: ($event) => toggleDataset(dataset.id)
+					}, {
+						default: withCtx(() => [
+							createElementVNode("span", {
+								class: normalizeClass([unref(cls).e("dataset-chevron"), unref(bem).is("expanded", isDatasetExpanded(dataset.id))]),
+								"aria-hidden": "true"
+							}, " ▸ ", 2),
+							createElementVNode("span", { class: normalizeClass(unref(cls).e("dataset-name")) }, toDisplayString(dataset.label), 3),
+							createElementVNode("span", { class: normalizeClass(unref(cls).e("dataset-count")) }, toDisplayString(dataset.fields.length), 3)
+						]),
+						_: 2
+					}, 1032, [
+						"class",
+						"aria-expanded",
+						"onClick"
+					]), withDirectives(createElementVNode("div", { class: normalizeClass(unref(cls).e("fields")) }, [(openBlock(true), createElementBlock(Fragment, null, renderList(dataset.fields, (field) => {
+						return openBlock(), createElementBlock("div", {
+							key: field.name,
+							role: "button",
+							tabindex: "0",
+							class: normalizeClass([unref(cls).e("pill"), unref(bem).is("bound", isBound(dataset.id, field.name))]),
+							draggable: "true",
+							title: `${field.label}（${field.name}）`,
+							onClick: ($event) => emit("bind", dataset.id, field.name),
+							onKeydown: [withKeys(withModifiers(($event) => emit("bind", dataset.id, field.name), ["prevent"]), ["enter"]), withKeys(withModifiers(($event) => emit("bind", dataset.id, field.name), ["prevent"]), ["space"])],
+							onDragstart: ($event) => onDragStart($event, dataset.id, field.name)
+						}, [
+							createElementVNode("span", {
+								class: normalizeClass(unref(cls).e("pill-icon")),
+								"data-type": field.type
+							}, toDisplayString(unref(fieldTypeGlyph)(field.type)), 11, _hoisted_2),
+							createElementVNode("span", { class: normalizeClass(unref(cls).e("pill-label")) }, toDisplayString(field.label), 3),
+							isBound(dataset.id, field.name) ? (openBlock(), createElementBlock("span", {
+								key: 0,
+								class: normalizeClass(unref(cls).e("pill-bound")),
+								title: "已绑定"
+							}, "✓", 2)) : createCommentVNode("v-if", true)
+						], 42, _hoisted_1);
+					}), 128))], 2), [[vShow, isDatasetExpanded(dataset.id)]])], 2);
+				}), 128)),
+				__props.datasets.length === 0 ? (openBlock(), createElementBlock("p", {
+					key: 0,
+					class: normalizeClass(unref(cls).e("empty"))
+				}, " 尚无可用数据集，请点「数据中枢」创建连接与 SQL 数据集。 ", 2)) : visibleDatasets.value.length === 0 ? (openBlock(), createElementBlock("p", {
+					key: 1,
+					class: normalizeClass(unref(cls).e("empty"))
+				}, "没有匹配的字段。", 2)) : createCommentVNode("v-if", true)
+			], 2);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };

package/dist/components/report/filter-bar.js

@@ -0,0 +1,74 @@
+import { parseDateRangeValue, patchParamValues, resolveNumberParamValue } from "../../report/filter-bar.js";
+import { Fragment, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, openBlock, renderList, toDisplayString, unref } from "vue";
+import { UDatePicker, UDateRangePicker, UInput, UNumberInput, USelect } from "@veltra/desktop";
+import { bem } from "@veltra/utils";
+//#region src/components/report/filter-bar.vue
+const _sfc_main = /*@__PURE__*/ defineComponent({
+	name: "UReportFilterBar",
+	__name: "filter-bar",
+	props: {
+		queryParams: {},
+		values: {}
+	},
+	emits: ["update:values"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const cls = bem("report-filter-bar");
+		function dateRangeModel(paramId) {
+			return parseDateRangeValue(props.values[paramId]);
+		}
+		function numberModel(paramId) {
+			return resolveNumberParamValue(props.values[paramId]);
+		}
+		function emitChange(id, value) {
+			emit("update:values", patchParamValues(props.values, id, value));
+		}
+		function emitDateRangeChange(id, value) {
+			emit("update:values", patchParamValues(props.values, id, value ?? ["", ""]));
+		}
+		return (_ctx, _cache) => {
+			return __props.queryParams.length ? (openBlock(), createElementBlock("section", {
+				key: 0,
+				class: normalizeClass(unref(cls).b)
+			}, [createElementVNode("span", { class: normalizeClass(unref(cls).e("label")) }, "筛选参数", 2), createElementVNode("div", { class: normalizeClass(unref(cls).e("fields")) }, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.queryParams, (param) => {
+				return openBlock(), createElementBlock("div", {
+					key: param.id,
+					class: normalizeClass(unref(cls).e("field"))
+				}, [createElementVNode("span", { class: normalizeClass(unref(cls).e("field-label")) }, toDisplayString(param.label), 3), param.type === "date" ? (openBlock(), createBlock(unref(UDatePicker), {
+					key: 0,
+					"model-value": String(__props.values[param.id] ?? ""),
+					size: "small",
+					"onUpdate:modelValue": (v) => emitChange(param.id, v)
+				}, null, 8, ["model-value", "onUpdate:modelValue"])) : param.type === "date-range" ? (openBlock(), createBlock(unref(UDateRangePicker), {
+					key: 1,
+					"model-value": dateRangeModel(param.id),
+					size: "small",
+					"onUpdate:modelValue": (v) => emitDateRangeChange(param.id, v)
+				}, null, 8, ["model-value", "onUpdate:modelValue"])) : param.type === "select" ? (openBlock(), createBlock(unref(USelect), {
+					key: 2,
+					"model-value": String(__props.values[param.id] ?? ""),
+					size: "small",
+					options: param.options ?? [],
+					"onUpdate:modelValue": (v) => emitChange(param.id, v)
+				}, null, 8, [
+					"model-value",
+					"options",
+					"onUpdate:modelValue"
+				])) : param.type === "number" ? (openBlock(), createBlock(unref(UNumberInput), {
+					key: 3,
+					"model-value": numberModel(param.id),
+					size: "small",
+					"onUpdate:modelValue": (v) => emitChange(param.id, v)
+				}, null, 8, ["model-value", "onUpdate:modelValue"])) : (openBlock(), createBlock(unref(UInput), {
+					key: 4,
+					"model-value": String(__props.values[param.id] ?? ""),
+					size: "small",
+					"onUpdate:modelValue": (v) => emitChange(param.id, v)
+				}, null, 8, ["model-value", "onUpdate:modelValue"]))], 2);
+			}), 128))], 2)], 2)) : createCommentVNode("v-if", true);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };

package/dist/components/report/hub-connection-form.js

@@ -0,0 +1,145 @@
+import { DEFAULT_CONNECTION_PORTS, resolvePortOnTypeChange } from "../../report/connector.js";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, reactive, ref, toDisplayString, unref, watch, withCtx } from "vue";
+import { UButton, UInput, USelect } from "@veltra/desktop";
+import { bem } from "@veltra/utils";
+//#region src/components/report/hub-connection-form.vue
+const _sfc_main = /*@__PURE__*/ defineComponent({
+	name: "UReportHubConnectionForm",
+	__name: "hub-connection-form",
+	props: {
+		connection: {},
+		isNew: { type: Boolean },
+		test: { type: Function }
+	},
+	emits: ["save", "remove"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const cls = bem("report-hub-connection-form");
+		/** 连接类型收敛为 MySQL / PostgreSQL（ADR-0003 决策 3） */
+		const typeOptions = [{
+			label: "MySQL",
+			value: "mysql"
+		}, {
+			label: "PostgreSQL",
+			value: "postgresql"
+		}];
+		const draft = reactive({ ...props.connection });
+		const defaultPort = computed(() => DEFAULT_CONNECTION_PORTS[draft.type]);
+		const portText = computed({
+			get: () => String(draft.port),
+			set: (value) => {
+				const n = Number(value);
+				draft.port = Number.isFinite(n) ? n : 0;
+			}
+		});
+		const testing = ref(false);
+		const testMessage = ref("");
+		const testOk = ref(false);
+		watch(() => props.connection, (conn) => {
+			testMessage.value = "";
+			testOk.value = false;
+			Object.assign(draft, conn);
+		}, { immediate: true });
+		watch(() => draft.type, (type, prevType) => {
+			if (!prevType) return;
+			draft.port = resolvePortOnTypeChange(prevType, type, draft.port);
+		});
+		async function onTest() {
+			testing.value = true;
+			testMessage.value = "";
+			const result = await props.test({ ...draft });
+			testing.value = false;
+			testOk.value = result.ok;
+			testMessage.value = result.ok ? `连接成功：${draft.label}（${draft.host}:${draft.port}/${draft.database}）` : result.error.message;
+		}
+		function onSave() {
+			emit("save", { ...draft });
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("section", { class: normalizeClass(unref(cls).b) }, [
+				createElementVNode("h4", { class: normalizeClass(unref(cls).e("title")) }, toDisplayString(__props.isNew ? "新建连接" : "编辑连接"), 3),
+				createElementVNode("div", { class: normalizeClass(unref(cls).e("grid")) }, [
+					createElementVNode("div", { class: normalizeClass(unref(cls).e("field")) }, [createElementVNode("span", { class: normalizeClass(unref(cls).e("label")) }, "显示名", 2), createVNode(unref(UInput), {
+						modelValue: draft.label,
+						"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => draft.label = $event),
+						size: "small",
+						placeholder: "连接名称"
+					}, null, 8, ["modelValue"])], 2),
+					createElementVNode("div", { class: normalizeClass(unref(cls).e("field")) }, [createElementVNode("span", { class: normalizeClass(unref(cls).e("label")) }, "类型", 2), createVNode(unref(USelect), {
+						modelValue: draft.type,
+						"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => draft.type = $event),
+						size: "small",
+						options: typeOptions
+					}, null, 8, ["modelValue"])], 2),
+					createElementVNode("div", { class: normalizeClass(unref(cls).e("field")) }, [createElementVNode("span", { class: normalizeClass(unref(cls).e("label")) }, "主机", 2), createVNode(unref(UInput), {
+						modelValue: draft.host,
+						"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => draft.host = $event),
+						size: "small",
+						placeholder: "127.0.0.1"
+					}, null, 8, ["modelValue"])], 2),
+					createElementVNode("div", { class: normalizeClass(unref(cls).e("field")) }, [createElementVNode("span", { class: normalizeClass(unref(cls).e("label")) }, "端口", 2), createVNode(unref(UInput), {
+						modelValue: portText.value,
+						"onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => portText.value = $event),
+						size: "small",
+						type: "number",
+						placeholder: String(defaultPort.value)
+					}, null, 8, ["modelValue", "placeholder"])], 2),
+					createElementVNode("div", { class: normalizeClass(unref(cls).e("field")) }, [createElementVNode("span", { class: normalizeClass(unref(cls).e("label")) }, "数据库", 2), createVNode(unref(UInput), {
+						modelValue: draft.database,
+						"onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => draft.database = $event),
+						size: "small",
+						placeholder: "数据库名"
+					}, null, 8, ["modelValue"])], 2),
+					createElementVNode("div", { class: normalizeClass(unref(cls).e("field")) }, [createElementVNode("span", { class: normalizeClass(unref(cls).e("label")) }, "用户名", 2), createVNode(unref(UInput), {
+						modelValue: draft.username,
+						"onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => draft.username = $event),
+						size: "small"
+					}, null, 8, ["modelValue"])], 2),
+					createElementVNode("div", { class: normalizeClass(unref(cls).e("field")) }, [createElementVNode("span", { class: normalizeClass(unref(cls).e("label")) }, "密码", 2), createVNode(unref(UInput), {
+						modelValue: draft.password,
+						"onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => draft.password = $event),
+						size: "small",
+						type: "password",
+						"show-password": ""
+					}, null, 8, ["modelValue"])], 2)
+				], 2),
+				testMessage.value ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					class: normalizeClass([unref(cls).e("test"), unref(bem).is("ok", testOk.value)]),
+					role: "status"
+				}, toDisplayString(testMessage.value), 3)) : createCommentVNode("v-if", true),
+				createElementVNode("div", { class: normalizeClass(unref(cls).e("actions")) }, [
+					createVNode(unref(UButton), {
+						size: "small",
+						loading: testing.value,
+						onClick: onTest
+					}, {
+						default: withCtx(() => [..._cache[8] || (_cache[8] = [createTextVNode("测试连接", -1)])]),
+						_: 1
+					}, 8, ["loading"]),
+					!__props.isNew ? (openBlock(), createBlock(unref(UButton), {
+						key: 0,
+						size: "small",
+						type: "danger",
+						plain: "",
+						onClick: _cache[7] || (_cache[7] = ($event) => emit("remove"))
+					}, {
+						default: withCtx(() => [..._cache[9] || (_cache[9] = [createTextVNode(" 删除连接 ", -1)])]),
+						_: 1
+					})) : createCommentVNode("v-if", true),
+					createVNode(unref(UButton), {
+						size: "small",
+						type: "primary",
+						onClick: onSave
+					}, {
+						default: withCtx(() => [..._cache[10] || (_cache[10] = [createTextVNode("保存", -1)])]),
+						_: 1
+					})
+				], 2)
+			], 2);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };