@kp-ui/lowcode-pc-v2 0.0.1

package/src/components/public/CustomerModal/CustomerModal.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,138 @@
+import { useI18n } from "../../../../core/src/utils/i18n.js";
+import { useLowcode } from "../../../../core/src/hooks/useLowcode.js";
+import ActionButtonListRender_default from "../ActionButtonListRender.js";
+import render_default from "../../../render/index.js";
+import { computed, createBlock, createVNode, defineComponent, mergeProps, nextTick, onMounted, openBlock, ref, unref, useAttrs, withCtx } from "vue";
+import _objectSpread from "@oxc-project/runtime/helpers/objectSpread2";
+import { Skeleton } from "ant-design-vue";
+import { TpfConfigProvider, TpfModal } from "tmgc2-share";
+import _asyncToGenerator from "@oxc-project/runtime/helpers/asyncToGenerator";
+//#region src/components/public/CustomerModal/CustomerModal.vue?vue&type=script&setup=true&lang.tsx
+var CustomerModal_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "CustomerModal",
+	props: {
+		title: {},
+		type: {},
+		formCode: {},
+		width: { default: "800px" },
+		height: { default: "500px" },
+		mask: {
+			type: Boolean,
+			default: true
+		}
+	},
+	emits: ["cancel"],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const { i18nt } = useI18n();
+		const attrs = useAttrs() || {};
+		const visible = ref(false);
+		const props = __props;
+		const emit = __emit;
+		const vfCtx = computed(() => {
+			var _attrs$row;
+			return _objectSpread({
+				_id: (attrs === null || attrs === void 0 || (_attrs$row = attrs.row) === null || _attrs$row === void 0 || (_attrs$row = _attrs$row.record) === null || _attrs$row === void 0 ? void 0 : _attrs$row._id) || null,
+				type: props.type
+			}, attrs);
+		});
+		const isDisabled = ref(false);
+		const { vfdRef, formConfig, getPageJson, isLoading } = useLowcode();
+		const leftNum = ref(null);
+		const modalTitle = computed(() => {
+			if (props.title) return props.title;
+			if (props.type === "add") return "新增";
+			if (props.type === "edit") return "编辑";
+			if (props.type === "view") return "查看";
+			return "新增";
+		});
+		const show = function() {
+			var _ref = _asyncToGenerator(function* () {
+				visible.value = true;
+				yield nextTick();
+				yield getPageJson(props.formCode);
+			});
+			return function show() {
+				return _ref.apply(this, arguments);
+			};
+		}();
+		const setleftText = (number) => {
+			leftNum.value = number;
+		};
+		const setDisabled = (status) => {
+			isDisabled.value = status;
+		};
+		onMounted(() => {
+			show();
+		});
+		const handleCloseDialog = () => {
+			visible.value = false;
+			emit("cancel");
+		};
+		const handleButtonClick = function() {
+			var _ref2 = _asyncToGenerator(function* ({ item, result }) {
+				if (item.name === "cancelButton") return handleCloseDialog();
+				if (result !== false) handleCloseDialog();
+			});
+			return function handleButtonClick(_x) {
+				return _ref2.apply(this, arguments);
+			};
+		}();
+		__expose({
+			handleCloseDialog,
+			i18nt,
+			setDisabled,
+			setleftText
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(TpfConfigProvider), null, {
+				default: withCtx(() => [createVNode(unref(TpfModal), mergeProps({
+					visible: visible.value,
+					"onUpdate:visible": _cache[0] || (_cache[0] = ($event) => visible.value = $event)
+				}, _ctx.$attrs, {
+					title: modalTitle.value,
+					"left-num": leftNum.value,
+					width: _ctx.width,
+					height: _ctx.height,
+					mask: _ctx.mask,
+					onCancel: handleCloseDialog
+				}), {
+					footerRight: withCtx(() => {
+						var _unref2, _unref3;
+						return [createVNode(ActionButtonListRender_default, {
+							buttonList: ((_unref2 = unref(formConfig)) === null || _unref2 === void 0 ? void 0 : _unref2.buttonList) || [],
+							ctx: (_unref3 = unref(vfdRef)) === null || _unref3 === void 0 ? void 0 : _unref3.context,
+							onOnClick: handleButtonClick,
+							disabled: isDisabled.value
+						}, null, 8, [
+							"buttonList",
+							"ctx",
+							"disabled"
+						])];
+					}),
+					default: withCtx(() => [createVNode(unref(Skeleton), {
+						active: "",
+						loading: unref(isLoading)
+					}, {
+						default: withCtx(() => [createVNode(render_default, {
+							vfCtx: vfCtx.value,
+							ref_key: "vfdRef",
+							ref: vfdRef
+						}, null, 8, ["vfCtx"])]),
+						_: 1
+					}, 8, ["loading"])]),
+					_: 1
+				}, 16, [
+					"visible",
+					"title",
+					"left-num",
+					"width",
+					"height",
+					"mask"
+				])]),
+				_: 1
+			});
+		};
+	}
+});
+//#endregion
+export { CustomerModal_vue_vue_type_script_setup_true_lang_default as default };

package/src/components/public/CustomerModal/useCustomerModal.js

@@ -0,0 +1,23 @@
+import { createVNode, defineAsyncComponent, render } from "vue";
+import _objectSpread from "@oxc-project/runtime/helpers/objectSpread2";
+import _objectWithoutProperties from "@oxc-project/runtime/helpers/objectWithoutProperties";
+//#region src/components/public/CustomerModal/useCustomerModal.tsx
+var _excluded = ["type", "formCode"];
+var openCustomerModal = (ops, app) => {
+	const { type, formCode } = ops, args = _objectWithoutProperties(ops, _excluded);
+	const div = document.createElement("div");
+	document.body.appendChild(div);
+	const Com = defineAsyncComponent(() => import("./CustomerModal.js"));
+	const hide = () => {
+		render(null, div);
+		div.remove();
+	};
+	const vnode = createVNode(Com, _objectSpread(_objectSpread({
+		type,
+		formCode
+	}, args), {}, { onCancel: hide }));
+	vnode.appContext = app._context;
+	render(vnode, div);
+};
+//#endregion
+export { openCustomerModal };

package/src/components/public/DataTableColumnDialog.js

@@ -0,0 +1,7 @@
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.js";
+import DataTableColumnDialog_vue_vue_type_script_setup_true_name_DataTableColumnDialog_lang_default from "./DataTableColumnDialog.vue_vue_type_script_setup_true_name_DataTableColumnDialog_lang.js";
+/* empty css                                                                      */
+//#region src/components/public/DataTableColumnDialog.vue
+var DataTableColumnDialog_default = /* @__PURE__ */ _plugin_vue_export_helper_default(DataTableColumnDialog_vue_vue_type_script_setup_true_name_DataTableColumnDialog_lang_default, [["__scopeId", "data-v-30a82eb1"]]);
+//#endregion
+export { DataTableColumnDialog_default as default };

package/src/components/public/DataTableColumnDialog.vue_vue_type_script_setup_true_name_DataTableColumnDialog_lang.js

@@ -0,0 +1,330 @@
+import { useTableColumnStore } from "../../../core/src/store/useTableColumnStore.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeModels, normalizeClass, normalizeStyle, openBlock, ref, renderList, resolveComponent, toDisplayString, unref, useModel, watch, withCtx } from "vue";
+import _objectSpread from "@oxc-project/runtime/helpers/objectSpread2";
+import { message } from "ant-design-vue";
+import { SvgIcon, TpfModal } from "tmgc2-share";
+import draggable from "vuedraggable";
+import { cloneDeep } from "lodash-es";
+import _asyncToGenerator from "@oxc-project/runtime/helpers/asyncToGenerator";
+import { useI18n } from "@kp-ui/i18n";
+import { SearchOutlined } from "@ant-design/icons-vue";
+import TpfDelConfirm$1 from "tmgc2-share/src/components/TpfModal/TpfDelConfirm";
+//#region src/components/public/DataTableColumnDialog.vue?vue&type=script&setup=true&name=DataTableColumnDialog&lang.ts
+var _hoisted_1 = { class: "col-left-title" };
+var _hoisted_2 = { class: "title" };
+var _hoisted_3 = { class: "search" };
+var _hoisted_4 = { class: "col-left-content" };
+var _hoisted_5 = { class: "col-right-title" };
+var _hoisted_6 = { class: "title" };
+var _hoisted_7 = { class: "col-right-content-item-left" };
+var _hoisted_8 = { class: "title" };
+var _hoisted_9 = { class: "col-right-content-item-right" };
+var DataTableColumnDialog_vue_vue_type_script_setup_true_name_DataTableColumnDialog_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "DataTableColumnDialog",
+	props: /* @__PURE__ */ mergeModels({
+		columns: { default: () => [] },
+		pageCode: { default: "" },
+		tableId: { default: "" }
+	}, {
+		"visible": _objectSpread({ type: Boolean }, { default: false }),
+		"visibleModifiers": {}
+	}),
+	emits: /* @__PURE__ */ mergeModels(["update"], ["update:visible"]),
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const { t } = useI18n();
+		const tableColumnStore = useTableColumnStore();
+		const props = __props;
+		const emit = __emit;
+		const visible = useModel(__props, "visible");
+		const searchKey = ref("");
+		const tableColumns = ref([]);
+		const rightShowColumns = ref([]);
+		const initColumn = ref([]);
+		const saveColumnConfig = () => {
+			const storageKey = props.pageCode || props.tableId;
+			if (!storageKey) return;
+			const columnList = mergeColumns();
+			tableColumnStore.saveColumnList(storageKey, columnList);
+		};
+		const leftShowColumns = computed(() => {
+			if (!searchKey.value) return tableColumns.value;
+			return tableColumns.value.filter((item) => {
+				return item.title && item.title.toLowerCase().includes(searchKey.value.toLowerCase());
+			});
+		});
+		const checkAll = ref(false);
+		const indeterminate = ref(false);
+		const updateCheckAll = () => {
+			const visibleColumns = leftShowColumns.value.filter((item) => item.visible);
+			checkAll.value = visibleColumns.length === leftShowColumns.value.length && leftShowColumns.value.length > 0;
+			indeterminate.value = visibleColumns.length > 0 && visibleColumns.length < leftShowColumns.value.length;
+		};
+		const getRightShowColumns = () => {
+			rightShowColumns.value = [];
+			tableColumns.value.forEach((item) => {
+				if (item.visible) rightShowColumns.value.push(item);
+			});
+		};
+		const sortRightColumns = () => {
+			rightShowColumns.value.sort((a, b) => {
+				if (a.fixed === "left" && b.fixed !== "left") return -1;
+				if (a.fixed !== "left" && b.fixed === "left") return 1;
+				return 0;
+			});
+		};
+		const mergeColumns = () => {
+			const selectList = unref(rightShowColumns);
+			const unSelectList = [];
+			unref(initColumn).forEach((item) => {
+				if (!unref(selectList).some((it) => it.dataIndex === item.dataIndex)) unSelectList.push(_objectSpread(_objectSpread({}, item), {}, { visible: false }));
+			});
+			return [...selectList, ...unSelectList].map((item, index) => _objectSpread(_objectSpread({}, item), {}, { displayOrdinal: index }));
+		};
+		const restColum = () => {
+			tableColumns.value = cloneDeep(unref(initColumn));
+			getRightShowColumns();
+			updateCheckAll();
+		};
+		const restPageJson = function() {
+			var _ref = _asyncToGenerator(function* () {
+				const storageKey = props.pageCode || props.tableId;
+				if (!storageKey) {
+					message.warning(t("lang.未配置 pageCode 或 tableId"));
+					return;
+				}
+				yield TpfDelConfirm$1({ content: t("lang.确定清除缓存记录吗") });
+				tableColumnStore.clearTableConfig(storageKey);
+				message.success(t("lang.清除成功"));
+				window.location.reload();
+			});
+			return function restPageJson() {
+				return _ref.apply(this, arguments);
+			};
+		}();
+		const onCancel = () => {
+			visible.value = false;
+		};
+		const handleOk = () => {
+			saveColumnConfig();
+			emit("update", mergeColumns());
+			visible.value = false;
+		};
+		const changeCheckAll = (e) => {
+			const checked = e.target.checked;
+			checkAll.value = checked;
+			indeterminate.value = false;
+			tableColumns.value.forEach((item) => {
+				item.visible = checked;
+			});
+			getRightShowColumns();
+		};
+		const onchangeCheck = (row) => {
+			const index = rightShowColumns.value.findIndex((item) => item.dataIndex === row.dataIndex);
+			if (row.visible) {
+				if (index === -1) rightShowColumns.value.push(row);
+			} else if (index > -1) rightShowColumns.value.splice(index, 1);
+			updateCheckAll();
+		};
+		const removeColumn = (row, index) => {
+			row.visible = false;
+			delete row.fixed;
+			rightShowColumns.value.splice(index, 1);
+			updateCheckAll();
+		};
+		const toggleFixed = (row) => {
+			if (row.fixed === "left") delete row.fixed;
+			else {
+				if (rightShowColumns.value.filter((item) => item.fixed === "left").length >= 2) return;
+				row.fixed = "left";
+			}
+			sortRightColumns();
+		};
+		const open = () => {
+			visible.value = true;
+		};
+		const restoreColumnFromStorage = () => {
+			const storageKey = props.pageCode || props.tableId;
+			if (!storageKey || !tableColumnStore.hasTableConfig(storageKey)) return cloneDeep(props.columns);
+			const storedColumnList = tableColumnStore.getColumnList(storageKey);
+			if (storedColumnList.length === 0) return cloneDeep(props.columns);
+			return cloneDeep(props.columns).map((col) => {
+				const stored = storedColumnList.find((item) => item.dataIndex === col.dataIndex);
+				if (stored) return _objectSpread(_objectSpread({}, col), {}, {
+					visible: stored.visible !== false,
+					fixed: stored.fixed,
+					displayOrdinal: stored.displayOrdinal
+				});
+				return col;
+			});
+		};
+		watch(() => visible.value, function() {
+			var _ref2 = _asyncToGenerator(function* (val) {
+				if (val) {
+					const columnsConfig = restoreColumnFromStorage();
+					tableColumns.value = columnsConfig;
+					initColumn.value = columnsConfig;
+					getRightShowColumns();
+					sortRightColumns();
+					updateCheckAll();
+				}
+			});
+			return function(_x) {
+				return _ref2.apply(this, arguments);
+			};
+		}(), { immediate: true });
+		__expose({
+			open,
+			restColum
+		});
+		return (_ctx, _cache) => {
+			const _component_a_input = resolveComponent("a-input");
+			const _component_a_checkbox = resolveComponent("a-checkbox");
+			const _component_a_tooltip = resolveComponent("a-tooltip");
+			const _component_a_col = resolveComponent("a-col");
+			const _component_a_row = resolveComponent("a-row");
+			const _component_a_button = resolveComponent("a-button");
+			return openBlock(), createBlock(unref(TpfModal), {
+				visible: visible.value,
+				"onUpdate:visible": _cache[2] || (_cache[2] = ($event) => visible.value = $event),
+				title: unref(t)("lang.列管理"),
+				width: "800px",
+				destroyOnClose: ""
+			}, {
+				footerLeft: withCtx(() => [createVNode(_component_a_button, {
+					class: "tpf-button",
+					onClick: restColum
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("lang.重置")), 1)]),
+					_: 1
+				}), createVNode(_component_a_button, {
+					class: "tpf-button",
+					onClick: restPageJson
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("lang.清除缓存记录")), 1)]),
+					_: 1
+				})]),
+				footerRight: withCtx(() => [createVNode(_component_a_button, {
+					class: "tpf-button",
+					onClick: onCancel
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("lang.取消")), 1)]),
+					_: 1
+				}), createVNode(_component_a_button, {
+					class: "tpf-button",
+					type: "primary",
+					onClick: handleOk
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("lang.保存")), 1)]),
+					_: 1
+				})]),
+				default: withCtx(() => [createVNode(_component_a_row, {
+					gutter: 10,
+					class: "column-row"
+				}, {
+					default: withCtx(() => [createVNode(_component_a_col, {
+						span: 17,
+						class: "col-left"
+					}, {
+						default: withCtx(() => [createElementVNode("div", _hoisted_1, [createElementVNode("div", _hoisted_2, [createElementVNode("span", null, toDisplayString(unref(t)("lang.可选字段")), 1), createElementVNode("span", null, "（" + toDisplayString(leftShowColumns.value.length) + toDisplayString(unref(t)("lang.个")) + "） ", 1)]), createElementVNode("div", _hoisted_3, [createVNode(_component_a_input, {
+							placeholder: unref(t)("lang.请搜索"),
+							size: "small",
+							"allow-clear": "",
+							value: searchKey.value,
+							"onUpdate:value": _cache[0] || (_cache[0] = ($event) => searchKey.value = $event)
+						}, {
+							prefix: withCtx(() => [createVNode(unref(SearchOutlined))]),
+							_: 1
+						}, 8, ["placeholder", "value"])])]), createElementVNode("div", _hoisted_4, [!!tableColumns.value.length ? (openBlock(), createBlock(_component_a_checkbox, {
+							key: 0,
+							checked: checkAll.value,
+							"onUpdate:checked": _cache[1] || (_cache[1] = ($event) => checkAll.value = $event),
+							onChange: changeCheckAll,
+							indeterminate: indeterminate.value
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("lang.全选")), 1)]),
+							_: 1
+						}, 8, ["checked", "indeterminate"])) : createCommentVNode("", true), createVNode(_component_a_row, {
+							gutter: [10, 10],
+							class: "checkbox-row"
+						}, {
+							default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(leftShowColumns.value, (item) => {
+								return openBlock(), createBlock(_component_a_col, {
+									key: item.dataIndex,
+									span: 6
+								}, {
+									default: withCtx(() => [createVNode(_component_a_checkbox, {
+										checked: item.visible,
+										"onUpdate:checked": ($event) => item.visible = $event,
+										onChange: ($event) => onchangeCheck(item)
+									}, {
+										default: withCtx(() => [createVNode(_component_a_tooltip, { title: item.title }, {
+											default: withCtx(() => [createTextVNode(toDisplayString(item.title), 1)]),
+											_: 2
+										}, 1032, ["title"])]),
+										_: 2
+									}, 1032, [
+										"checked",
+										"onUpdate:checked",
+										"onChange"
+									])]),
+									_: 2
+								}, 1024);
+							}), 128))]),
+							_: 1
+						})])]),
+						_: 1
+					}), createVNode(_component_a_col, {
+						span: 7,
+						class: "col-right"
+					}, {
+						default: withCtx(() => [createElementVNode("div", _hoisted_5, [createElementVNode("div", _hoisted_6, [createElementVNode("span", null, toDisplayString(unref(t)("lang.已选字段")), 1), createElementVNode("span", null, "（" + toDisplayString(rightShowColumns.value.length) + toDisplayString(unref(t)("lang.个")) + "） ", 1)])]), createVNode(unref(draggable), {
+							tag: "div",
+							list: rightShowColumns.value,
+							class: "col-right-content",
+							"item-key": "dataIndex",
+							handle: ".drag-handle",
+							animation: "150"
+						}, {
+							item: withCtx(({ element: item, index }) => [(openBlock(), createElementBlock("div", {
+								class: "col-right-content-item",
+								key: item.dataIndex
+							}, [createElementVNode("div", _hoisted_7, [createVNode(unref(SvgIcon), {
+								size: "24",
+								type: "icon-move1",
+								class: "drag-handle icon-move1",
+								move: "",
+								shadow: ""
+							}), createElementVNode("span", _hoisted_8, toDisplayString(item.title), 1)]), createElementVNode("div", _hoisted_9, [createVNode(unref(SvgIcon), {
+								size: "24",
+								type: "icon-ding",
+								class: normalizeClass(["icon-ding", item.fixed === "left" && "showIcon"]),
+								cursor: "",
+								shadow: "",
+								activeBackGround: item.fixed === "left" ? "" : "#e8e9e9",
+								style: normalizeStyle(`color:${item.fixed === "left" ? "var(--ant-primary-color)" : "#b0b4b7"}`),
+								onClick: ($event) => toggleFixed(item)
+							}, null, 8, [
+								"class",
+								"activeBackGround",
+								"style",
+								"onClick"
+							]), createVNode(unref(SvgIcon), {
+								size: "24",
+								type: "icon-guanbi",
+								cursor: "",
+								shadow: "",
+								onClick: ($event) => removeColumn(item, index)
+							}, null, 8, ["onClick"])])]))]),
+							_: 1
+						}, 8, ["list"])]),
+						_: 1
+					})]),
+					_: 1
+				})]),
+				_: 1
+			}, 8, ["visible", "title"]);
+		};
+	}
+});
+//#endregion
+export { DataTableColumnDialog_vue_vue_type_script_setup_true_name_DataTableColumnDialog_lang_default as default };