@gct-paas/core-web 0.1.6-dev.9 → 6.0.0-dev.10

package/es/components/design-step-check/design-step-check.css

@@ -0,0 +1,133 @@
+@charset "UTF-8";
+/* stylelint-disable scss/no-global-function-names */
+/* bem('block', 'element', 'modifier') => 'ibiz-block__element--modifier' */
+/**
+ * 定义 Block 块
+ * @param {String} $block - Block 块名称
+ * @example
+ *   @include b('button') {
+ *     padding: 10px;
+ *   }
+ */
+/**
+ * 定义 Element 元素
+ * @param {String|List} $element - Element 元素名称，支持单个或多个
+ * @example
+ *   @include b('button') {
+ *     @include e('text') {
+ *       color: #000;
+ *     }
+ *   }
+ *   // 或传入多个元素
+ *   @include b('button') {
+ *     @include e(('text', 'icon')) {
+ *       margin: 5px;
+ *     }
+ *   }
+ */
+/**
+ * 定义 Modifier 修饰符
+ * @param {String|List} $modifier - Modifier 修饰符名称，支持单个或多个
+ * @example
+ *   @include b('button') {
+ *     @include m('primary') {
+ *       background: blue;
+ *     }
+ *   }
+ *   // 或传入多个修饰符
+ *   @include b('button') {
+ *     @include m(('primary', 'large')) {
+ *       background: blue;
+ *       font-size: 16px;
+ *     }
+ *   }
+ */
+/**
+ * 定义状态选择器
+ * @param {String} $state - 状态名称
+ * @example
+ *   @include b('button') {
+ *     @include when('disabled') {
+ *       opacity: 0.5;
+ *     }
+ *   }
+ */
+/**
+ * 深色主题样式
+ * @param {String} $block - Block 块名称
+ * @example
+ *   @include dark('button') {
+ *     background: #333;
+ *     color: #fff;
+ *   }
+ */
+/* stylelint-disable scss/no-global-function-names */
+.gct-design-step-check {
+  position: relative;
+  display: flex;
+  align-items: center;
+  height: 40px;
+  padding: 3px 2px;
+  overflow: hidden;
+  background-color: rgb(232, 235, 240);
+  border-radius: 20px;
+}
+.gct-design-step-check::before {
+  position: absolute;
+  top: 2px;
+  left: var(--indicator-left, 3px);
+  z-index: 1;
+  display: var(--indicator-display, block);
+  width: var(--indicator-width, 130px);
+  height: 36px;
+  pointer-events: none;
+  content: "";
+  background-color: rgb(255, 255, 255);
+  border-radius: 18px;
+}
+.gct-design-step-check__item {
+  position: relative;
+  z-index: 2;
+  display: flex;
+  align-items: center;
+  min-width: 131px;
+  max-width: max-content;
+  height: 36px;
+  padding: 3px;
+  padding-right: 26px;
+  color: var(--gct-color-text-1);
+  cursor: pointer;
+  background-color: transparent;
+  border-radius: 18px;
+}
+.gct-design-step-check__item.is-selected .gct-design-step-check__item-number {
+  color: #fff;
+  background-color: var(--gct-color-primary);
+}
+
+.gct-design-step-check__item.is-selected .gct-design-step-check__item-name {
+  font-weight: bold;
+  color: rgb(33, 37, 40);
+}
+
+.gct-design-step-check__item-number {
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  width: 30px;
+  height: 30px;
+  margin-right: 8px;
+  font-weight: normal;
+  color: #5A5F6B;
+  border-radius: 50%;
+}
+
+.gct-design-step-check__item-name {
+  flex: 1;
+  font-size: 16px;
+  font-weight: normal;
+  line-height: 22px;
+  color: #5A5F6B;
+  white-space: nowrap;
+}

package/es/components/design-step-check/design-step-check.d.ts

@@ -0,0 +1,30 @@
+import { PropType } from 'vue';
+import { IViewStep } from '../../interface';
+/**
+ * 设计界面步骤选择
+ */
+export declare const DesignStepCheck: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    steps: {
+        type: PropType<IViewStep[]>;
+        default: () => never[];
+    };
+    currentStep: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("stepChange" | "update:currentStep")[], "stepChange" | "update:currentStep", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    steps: {
+        type: PropType<IViewStep[]>;
+        default: () => never[];
+    };
+    currentStep: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+}>> & Readonly<{
+    onStepChange?: ((...args: any[]) => any) | undefined;
+    "onUpdate:currentStep"?: ((...args: any[]) => any) | undefined;
+}>, {
+    steps: IViewStep[];
+    currentStep: string | number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/es/components/design-step-check/design-step-check.mjs

@@ -0,0 +1,96 @@
+import './design-step-check.css';/* empty css                        */
+import { createVNode, defineComponent, nextTick, onMounted, ref, toRefs, watch } from "vue";
+import { useNamespace } from "@gct-paas/core";
+//#region src/components/design-step-check/design-step-check.tsx
+/**
+* 设计界面步骤选择
+*/
+var DesignStepCheck = /* @__PURE__ */ defineComponent({
+	name: "DesignStepCheck",
+	props: {
+		steps: {
+			type: Array,
+			default: () => []
+		},
+		currentStep: {
+			type: [String, Number],
+			default: ""
+		}
+	},
+	emits: ["update:currentStep", "stepChange"],
+	setup(props, { emit, expose }) {
+		const ns = useNamespace("design-step-check");
+		const { steps, currentStep } = toRefs(props);
+		const containerRef = ref();
+		const innerCurrentStep = ref(currentStep.value);
+		const offsetLeft = ref(0);
+		const width = ref(0);
+		const updateIndicatorPosition = async () => {
+			await new Promise((resolve) => setTimeout(resolve, 100));
+			await nextTick();
+			if (!containerRef.value) return;
+			const selectedIndex = steps.value.findIndex((step) => step.tag === innerCurrentStep.value);
+			if (selectedIndex === -1) return;
+			const items = containerRef.value.querySelectorAll(`.${ns.e("item")}`);
+			const selectedItem = items[selectedIndex];
+			if (selectedItem) {
+				offsetLeft.value = 2;
+				for (let i = 0; i < selectedIndex; i++) {
+					const item = items[i];
+					offsetLeft.value += item.offsetWidth;
+				}
+				width.value = selectedItem.offsetWidth;
+			}
+		};
+		watch(currentStep, (newValue) => {
+			innerCurrentStep.value = newValue;
+			updateIndicatorPosition();
+		});
+		watch(steps, (newSteps) => {
+			if (newSteps.length > 0 && !innerCurrentStep.value) {
+				innerCurrentStep.value = newSteps[0].tag;
+				emit("update:currentStep", innerCurrentStep.value);
+				emit("stepChange", innerCurrentStep.value, newSteps[0]);
+			}
+			updateIndicatorPosition();
+		});
+		const handleStepClick = (step) => {
+			innerCurrentStep.value = step.tag;
+			emit("update:currentStep", step.tag);
+			emit("stepChange", step.tag, step);
+			updateIndicatorPosition();
+		};
+		onMounted(() => {
+			updateIndicatorPosition();
+		});
+		/**
+		* 设置当前步骤，用于外部控制，不需要触发事件
+		*
+		* @param {string} tag
+		*/
+		function setStep(tag) {
+			if (steps.value.some((step) => step.tag === tag)) {
+				innerCurrentStep.value = tag;
+				updateIndicatorPosition();
+			}
+		}
+		expose({ setStep });
+		return () => {
+			return createVNode("div", {
+				"ref": containerRef,
+				"class": ns.b(),
+				"style": {
+					"--indicator-display": currentStep.value ? "block" : "none",
+					"--indicator-left": `${offsetLeft.value || -40}px`,
+					"--indicator-width": `${width.value || -131}px`
+				}
+			}, [props.steps.map((step) => createVNode("div", {
+				"key": step.tag,
+				"class": [ns.e("item"), ns.is("selected", step.tag === innerCurrentStep.value)],
+				"onClick": () => handleStepClick(step)
+			}, [createVNode("div", { "class": ns.e("item-number") }, [props.steps.findIndex((s) => s.tag === step.tag) + 1]), createVNode("div", { "class": ns.e("item-name") }, [step.name])]))]);
+		};
+	}
+});
+//#endregion
+export { DesignStepCheck };

package/es/components/design-view-layout/design-view-layout.css

@@ -0,0 +1,184 @@
+@charset "UTF-8";
+/* stylelint-disable scss/no-global-function-names */
+/* bem('block', 'element', 'modifier') => 'ibiz-block__element--modifier' */
+/**
+ * 定义 Block 块
+ * @param {String} $block - Block 块名称
+ * @example
+ *   @include b('button') {
+ *     padding: 10px;
+ *   }
+ */
+/**
+ * 定义 Element 元素
+ * @param {String|List} $element - Element 元素名称，支持单个或多个
+ * @example
+ *   @include b('button') {
+ *     @include e('text') {
+ *       color: #000;
+ *     }
+ *   }
+ *   // 或传入多个元素
+ *   @include b('button') {
+ *     @include e(('text', 'icon')) {
+ *       margin: 5px;
+ *     }
+ *   }
+ */
+/**
+ * 定义 Modifier 修饰符
+ * @param {String|List} $modifier - Modifier 修饰符名称，支持单个或多个
+ * @example
+ *   @include b('button') {
+ *     @include m('primary') {
+ *       background: blue;
+ *     }
+ *   }
+ *   // 或传入多个修饰符
+ *   @include b('button') {
+ *     @include m(('primary', 'large')) {
+ *       background: blue;
+ *       font-size: 16px;
+ *     }
+ *   }
+ */
+/**
+ * 定义状态选择器
+ * @param {String} $state - 状态名称
+ * @example
+ *   @include b('button') {
+ *     @include when('disabled') {
+ *       opacity: 0.5;
+ *     }
+ *   }
+ */
+/**
+ * 深色主题样式
+ * @param {String} $block - Block 块名称
+ * @example
+ *   @include dark('button') {
+ *     background: #333;
+ *     color: #fff;
+ *   }
+ */
+/* stylelint-disable scss/no-global-function-names */
+/**
+* 设计视图布局组件样式
+* 使用 BEM 命名规范
+*/
+.gct-design-view-layout {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+.gct-design-view-layout .gct-modal-name-editor__input .ant-input.ant-input-sm {
+  color: rgb(26, 29, 35);
+}
+.gct-design-view-layout__header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  height: 69px;
+  padding: 0 24px;
+  background-color: #fff;
+  border-bottom: 1px solid #E0E3EB;
+}
+
+.gct-design-view-layout__header-back {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 20px;
+  height: 20px;
+  font-size: 20px;
+  cursor: pointer;
+}
+
+.gct-design-view-layout__header-info {
+  display: inline-block;
+  margin-left: 16px;
+}
+
+.gct-design-view-layout__header-sub-title {
+  font-size: 12px;
+  color: rgb(90, 95, 107);
+}
+
+.gct-design-view-layout__header-title {
+  font-size: 14px;
+  font-weight: 600;
+}
+
+.gct-design-view-layout__header-left {
+  display: flex;
+  align-items: center;
+  height: 100%;
+}
+
+.gct-design-view-layout__header-center {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.gct-design-view-layout__header-right {
+  display: flex;
+  align-items: center;
+  height: 100%;
+}
+
+.gct-design-view-layout__header-actions {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  height: 100%;
+}
+
+.gct-design-view-layout__header-action-btn {
+  display: flex;
+  align-items: center;
+}
+.gct-design-view-layout__header-action-btn:focus {
+  color: rgba(0, 0, 0, 0.85);
+  border-color: #E0E3EB;
+}
+.gct-design-view-layout__header-action-btn.ant-btn-primary:focus {
+  color: #fff;
+}
+.gct-design-view-layout__header-action-btn .gct-iconfont {
+  margin-right: 6px;
+  font-size: 14px;
+}
+.gct-design-view-layout__header-action-btn span {
+  height: 22px;
+}
+
+.gct-design-view-layout__content {
+  display: flex;
+  height: calc(100% - 70px);
+  background-color: var(--gct-color-bg-3);
+}
+
+.gct-design-view-layout__body-left {
+  flex-shrink: 0;
+  transition: all 0.3s ease;
+}
+.gct-design-view-layout__body-left.is-collapsed {
+  flex-shrink: 0;
+}
+
+.gct-design-view-layout__body-center {
+  flex-grow: 1;
+  width: calc(100% - 280px);
+  transition: all 0.3s ease;
+}
+.gct-design-view-layout__body-center.is-expanded {
+  flex-grow: 1;
+  width: calc(100% - 42px);
+}
+
+.gct-design-view-layout__body-right {
+  flex-shrink: 0;
+}

package/es/components/design-view-layout/design-view-layout.d.ts

@@ -0,0 +1 @@
+export declare const DesignViewLayout: any;

package/es/components/design-view-layout/design-view-layout.mjs

@@ -0,0 +1,159 @@
+import { DesignStepCheck } from "../design-step-check/design-step-check.mjs";
+import './design-view-layout.css';/* empty css                         */
+import { ModalNameEditor } from "../modal-name-editor/modal-name-editor.mjs";
+import { Fragment, computed, createVNode, defineComponent, isVNode, mergeProps, ref, resolveComponent, toRefs } from "vue";
+import { t, useNamespace } from "@gct-paas/core";
+import { AssetsSvgIcon } from "@gct-paas/core-components";
+//#region src/components/design-view-layout/design-view-layout.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+var DesignViewLayout = /* @__PURE__ */ defineComponent({
+	name: "DesignViewLayout",
+	props: {
+		name: {
+			type: String,
+			default: "未命名"
+		},
+		defaultName: {
+			type: String,
+			default: "未命名卡片名称"
+		},
+		editName: {
+			type: Boolean,
+			default: true
+		},
+		subTitle: {
+			type: String,
+			default: ""
+		},
+		step: {
+			type: String,
+			default: ""
+		},
+		steps: {
+			type: Array,
+			default: () => []
+		},
+		actions: {
+			type: Array,
+			default: () => []
+		},
+		save: { type: Function },
+		next: { type: Function },
+		leftPanelExpanded: {
+			type: Boolean,
+			default: true
+		}
+	},
+	emits: [
+		"changeName",
+		"back",
+		"stepChange"
+	],
+	setup(props, { slots, emit, expose }) {
+		const ns = useNamespace("design-view-layout");
+		const stepCheckRef = ref();
+		const nameInputRef = ref();
+		const { name, subTitle, step, steps } = toRefs(props);
+		const isLoading = ref(false);
+		const val = computed({
+			get() {
+				return name.value;
+			},
+			set(val) {
+				if (name.value !== val) {
+					name.value = val;
+					emit("changeName", val);
+				}
+			}
+		});
+		const isBack = computed(() => {
+			return history.length > 1 || !!window.$wujie;
+		});
+		const isLastStep = computed(() => {
+			return steps.value.length === 0 || steps.value[steps.value.length - 1]?.tag === step.value;
+		});
+		function onBack(e) {
+			e.stopPropagation();
+			emit("back", e);
+		}
+		async function onNext() {
+			if (props.next) try {
+				isLoading.value = true;
+				await props.next();
+			} catch (error) {
+				console.error("DesignViewLayout: next function error", error);
+			} finally {
+				isLoading.value = false;
+			}
+		}
+		async function onSave() {
+			if (props.save) try {
+				isLoading.value = true;
+				await props.save();
+			} catch (error) {
+				console.error("DesignViewLayout: save function error", error);
+			} finally {
+				isLoading.value = false;
+			}
+		}
+		function setStep(stepId) {
+			if (stepCheckRef.value) stepCheckRef.value.setStep(stepId);
+		}
+		function validate() {
+			let isValid = true;
+			if (nameInputRef.value) isValid = nameInputRef.value.validate();
+			return isValid;
+		}
+		expose({
+			setStep,
+			validate
+		});
+		return () => {
+			let _slot, _slot2;
+			const isSingleContent = !!slots.default && !slots.bodyLeft && !slots.bodyRight;
+			return createVNode("div", { "class": ns.b() }, [createVNode("div", { "class": ns.e("header") }, [
+				createVNode("div", { "class": ns.e("header-left") }, [isBack.value ? createVNode("div", {
+					"class": ns.e("header-back"),
+					"onClick": onBack
+				}, [createVNode(AssetsSvgIcon, { "src": "/extras-assets/card-design/arrow_back.svg" }, null)]) : null, props.editName ? createVNode("div", { "class": ns.e("header-info") }, [createVNode("div", { "class": ns.e("header-sub-title") }, [subTitle.value]), createVNode("div", { "class": ns.e("header-title") }, [createVNode(ModalNameEditor, {
+					"ref": (ref) => nameInputRef.value = ref,
+					"value": val.value,
+					"onUpdate:value": ($event) => val.value = $event,
+					"defaultName": props.defaultName
+				}, null)])]) : null]),
+				createVNode("div", { "class": ns.e("header-center") }, [slots.headerCenter?.(), steps.value.length > 0 ? createVNode(DesignStepCheck, {
+					"ref": (ref) => stepCheckRef.value = ref,
+					"steps": steps.value,
+					"currentStep": step.value,
+					"onStepChange": (stepId, stepData) => {
+						emit("stepChange", stepId, stepData);
+					}
+				}, null) : null]),
+				createVNode("div", { "class": ns.e("header-right") }, [slots.headerRight ? slots.headerRight() : null, createVNode("div", { "class": ns.e("header-actions") }, [props.steps.length > 0 ? isLastStep.value ? createVNode(Fragment, null, [
+					slots.headerActions ? slots.headerActions() : null,
+					props.actions.map((actionProps) => {
+						createVNode(resolveComponent("a-button"), mergeProps({ "class": ns.e("header-action-btn") }, actionProps), { default: () => [actionProps.title] });
+					}),
+					createVNode(resolveComponent("a-button"), {
+						"class": ns.e("header-action-btn"),
+						"type": "primary",
+						"loading": isLoading.value,
+						"onClick": onSave,
+						"icon": createVNode("i", { "class": "gct-iconfont icon-icon_baocun_btn" }, null)
+					}, _isSlot(_slot = t("sys.saveText")) ? _slot : { default: () => [_slot] })
+				]) : createVNode(resolveComponent("a-button"), {
+					"type": "primary",
+					"onClick": onNext
+				}, _isSlot(_slot2 = t("sys.nextStep")) ? _slot2 : { default: () => [_slot2] }) : null])])
+			]), createVNode("div", { "class": ns.e("content") }, [
+				slots.bodyLeft && !isSingleContent ? createVNode("div", { "class": [ns.e("body-left"), ns.is("collapsed", !props.leftPanelExpanded)] }, [slots.bodyLeft()]) : null,
+				!isSingleContent ? createVNode("div", { "class": [ns.e("body-center"), ns.is("expanded", !props.leftPanelExpanded)] }, [slots.default?.()]) : slots.default?.(),
+				slots.bodyRight && !isSingleContent ? createVNode("div", { "class": ns.e("body-right") }, [slots.bodyRight()]) : null
+			])]);
+		};
+	}
+});
+//#endregion
+export { DesignViewLayout };

package/es/components/field-cascader/index.d.ts

@@ -1,2 +1,3 @@
 import { default as FieldCascader } from './src/FieldCascader.vue';
-export { FieldCascader };
+import { comPropsType } from './src/hooks';
+export { FieldCascader, type comPropsType };

package/es/components/field-cascader/src/hooks.d.ts

@@ -9,6 +9,7 @@ export declare function useFieldCascader(props: comPropsType, { onFieldClick }:
         isLeaf?: boolean | undefined;
         __props: {
             backendOnly?: number | undefined;
+            belongingObject?: string | undefined;
             bindFieldKey?: string | undefined;
             bindInfo?: string | undefined;
             bizType?: string | undefined;
@@ -48,6 +49,7 @@ export declare function useFieldCascader(props: comPropsType, { onFieldClick }:
                 deleted?: number | undefined;
                 description?: string | undefined;
                 displayField?: string | undefined;
+                foreignTable?: string | undefined;
                 hidden?: boolean | undefined;
                 id?: string | undefined;
                 initCommitId?: string | undefined;
@@ -61,6 +63,7 @@ export declare function useFieldCascader(props: comPropsType, { onFieldClick }:
                 permissionEnabled?: number | undefined;
                 recycled?: number | undefined;
                 refModelKey?: string | undefined;
+                shared?: number | undefined;
                 source?: string | undefined;
                 specificConfig?: IObject | undefined;
                 subModel?: number | undefined;

package/es/components/field-tree-select/field-tree-select.vue.mjs

@@ -1,7 +1,7 @@
 import _plugin_vue_export_helper_default from "../../_virtual/_plugin-vue_export-helper.mjs";
 import field_tree_select_vue_vue_type_script_setup_true_lang_default from "./field-tree-select.vue_vue_type_script_setup_true_lang.mjs";
-import './field-tree-select.vue_vue_type_style_index_0_scoped_898030d3_lang.css';/* empty css                                                                        */
+import './field-tree-select.vue_vue_type_style_index_0_scoped_24efd443_lang.css';/* empty css                                                                        */
 //#region src/components/field-tree-select/field-tree-select.vue
-var field_tree_select_default = /* @__PURE__ */ _plugin_vue_export_helper_default(field_tree_select_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-898030d3"]]);
+var field_tree_select_default = /* @__PURE__ */ _plugin_vue_export_helper_default(field_tree_select_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-24efd443"]]);
 //#endregion
 export { field_tree_select_default as default };

package/es/components/field-tree-select/field-tree-select.vue_vue_type_script_setup_true_lang.mjs

@@ -1,6 +1,6 @@
 import { createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, nextTick, normalizeClass, openBlock, ref, resolveComponent, toDisplayString, unref, withCtx } from "vue";
 import { cloneDeep } from "lodash-es";
-import { FieldIconMap } from "@gct-paas/core";
+import { FieldIconMap, t } from "@gct-paas/core";
 import { SvgIcon } from "@gct-paas/core-components";
 //#region src/components/field-tree-select/field-tree-select.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "w230px m--14px" };
@@ -280,7 +280,7 @@ var field_tree_select_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 						isGroup ? (openBlock(), createBlock(_component_a_popconfirm, {
 							key: 0,
 							placement: "topLeft",
-							title: _ctx.$t("sys.pageDesigner.confirmTodo"),
+							title: unref(t)("sys.pageDesigner.confirmTodo"),
 							onConfirm: () => deleteFieldByid(key)
 						}, {
 							default: withCtx(() => [createVNode(_component_a_tooltip, { title: "删除" }, {