@gct-paas/design-web 0.1.4-dev.9 → 0.1.5-dev.1

package/es/components/form-component/field-label/ref-card-label-design.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,122 @@
+import tag_span_default from "./tag-span.vue.mjs";
+import tag_layout_default from "./tag-layout.vue.mjs";
+import { Fragment, computed, createBlock, createElementBlock, createElementVNode, createVNode, defineComponent, inject, normalizeClass, normalizeStyle, openBlock, reactive, ref, renderList, resolveComponent, toDisplayString, toRef, unref, withCtx, withModifiers } from "vue";
+import { CARD_TRIGGER_ENUM, t } from "@gct-paas/core";
+import { schemaToStyle, transformField2Component } from "@gct-paas/design";
+//#region src/components/form-component/field-label/ref-card-label-design.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["src"];
+var _hoisted_2 = ["src"];
+var _hoisted_3 = ["onMouseup"];
+var _hoisted_4 = { key: 1 };
+var ref_card_label_design_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "ref-card-label-design",
+	props: {
+		tagWidgetStyle: {},
+		disabled: { type: Boolean },
+		trigger: {},
+		modelKey: {},
+		refCardId: {},
+		type: {}
+	},
+	setup(__props) {
+		const props = __props;
+		const imgSrc = ref("");
+		const classData = toRef(() => props.trigger === CARD_TRIGGER_ENUM.HOVER ? "primary-gct-hover" : "primary-gct");
+		const labelLayout = inject("labelLayout", {});
+		const tipMap = reactive({});
+		const showLabel = computed(() => {
+			const example = props.type ? transformField2Component(props.type)?.example : [];
+			return (example ? typeof example === "string" ? [t(example)] : example.map((e) => t(e)) : []).map((i) => {
+				return {
+					value: i,
+					label: i
+				};
+			});
+		});
+		const comStyle = toRef(() => {
+			const contentFont = props.tagWidgetStyle?.contentFont;
+			if (!contentFont) return {};
+			return schemaToStyle(contentFont);
+		});
+		const getMsgColor = toRef(() => {
+			if (comStyle.value?.color) return comStyle.value;
+			return {
+				wordBreak: "break-all",
+				...comStyle.value
+			};
+		});
+		const visibleChange = async (visible, row) => {
+			if (visible) imgSrc.value = (await _api.apaas.commonInfoCard.getGetById({
+				id: props.refCardId,
+				modelKey: props.modelKey,
+				type: "CARD"
+			})).screenShoot ?? "";
+			tipMap[row.value] = visible;
+		};
+		function mouseup(row) {
+			visibleChange(true, row);
+		}
+		return (_ctx, _cache) => {
+			const _component_a_popover = resolveComponent("a-popover");
+			return !!showLabel.value.length ? (openBlock(), createBlock(tag_layout_default, {
+				key: 0,
+				disabled: !!__props.disabled,
+				"label-layout": unref(labelLayout)
+			}, {
+				default: withCtx(() => [__props.tagWidgetStyle?.tagStyleOpen ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(showLabel.value, (i, index) => {
+					return openBlock(), createBlock(_component_a_popover, {
+						key: index,
+						trigger: __props.trigger,
+						visible: !!tipMap[i.value],
+						placement: "bottomLeft",
+						color: "#fff",
+						"overlay-class-name": "gct-ref-card-popover min-w100px min-h30px max-h96vh",
+						onVisibleChange: (v) => visibleChange(v, i)
+					}, {
+						content: withCtx(() => [createElementVNode("img", { src: imgSrc.value }, null, 8, _hoisted_1)]),
+						default: withCtx(() => [createVNode(tag_span_default, {
+							"tag-style": __props.tagWidgetStyle.tagStyle,
+							onMouseup: withModifiers(($event) => mouseup(i), ["stop"])
+						}, {
+							default: withCtx(() => [createElementVNode("span", {
+								class: normalizeClass(["select-text cursor-pointer", classData.value]),
+								style: normalizeStyle(getMsgColor.value)
+							}, toDisplayString(i.label), 7)]),
+							_: 2
+						}, 1032, ["tag-style", "onMouseup"])]),
+						_: 2
+					}, 1032, [
+						"trigger",
+						"visible",
+						"onVisibleChange"
+					]);
+				}), 128)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(showLabel.value, (i, index) => {
+					return openBlock(), createElementBlock(Fragment, { key: index }, [createElementVNode("span", null, toDisplayString(!!index ? "，" : ""), 1), createVNode(_component_a_popover, {
+						"overlay-class-name": "gct-ref-card-popover min-w100px min-h30px max-h96vh",
+						visible: !!tipMap[i.value],
+						trigger: __props.trigger,
+						color: "#fff",
+						placement: "bottomLeft",
+						onVisibleChange: (v) => visibleChange(v, i)
+					}, {
+						content: withCtx(() => [createElementVNode("img", { src: imgSrc.value }, null, 8, _hoisted_2)]),
+						default: withCtx(() => [createElementVNode("span", {
+							class: normalizeClass(["select-text cursor-pointer", classData.value]),
+							style: normalizeStyle(getMsgColor.value),
+							onClick: _cache[0] || (_cache[0] = withModifiers(() => {}, ["stop"])),
+							onMouseup: withModifiers(($event) => mouseup(i), ["stop"])
+						}, toDisplayString(i.label), 47, _hoisted_3)]),
+						_: 2
+					}, 1032, [
+						"visible",
+						"trigger",
+						"onVisibleChange"
+					])], 64);
+				}), 128))]),
+				_: 1
+			}, 8, ["disabled", "label-layout"])) : (openBlock(), createElementBlock("span", _hoisted_4, "\xA0"));
+		};
+	}
+});
+//#endregion
+export { ref_card_label_design_vue_vue_type_script_setup_true_lang_default as default };

package/es/components/form-component/field-label/ref-card-label-design.vue_vue_type_style_index_0_lang.css

@@ -0,0 +1,9 @@
+.gct-ref-card-popover {
+  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
+}
+.gct-ref-card-popover .ant-popover-inner-content {
+  padding: 0;
+}
+.gct-ref-card-popover .ant-popover-arrow {
+  display: none;
+}

package/es/components/form-component/field-label/selectTag.vue.d.ts

@@ -0,0 +1,10 @@
+import { LowCodeWidget } from '@gct-paas/schema';
+export interface Props {
+    tagWidgetStyle: {
+        tagStyleOpen: boolean;
+        contentFont: LowCodeWidget.FontStyle;
+        tagStyle?: LowCodeWidget.TagConfigStyle;
+    };
+}
+declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;

package/es/components/form-component/field-label/selectTag.vue.mjs

@@ -0,0 +1,5 @@
+import selectTag_vue_vue_type_script_setup_true_lang_default from "./selectTag.vue_vue_type_script_setup_true_lang.mjs";
+//#region src/components/form-component/field-label/selectTag.vue
+var selectTag_default = selectTag_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { selectTag_default as default };

package/es/components/form-component/field-label/selectTag.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,22 @@
+import tag_label_default from "./tag-label.vue.mjs";
+import { createBlock, defineComponent, openBlock, toRef } from "vue";
+//#region src/components/form-component/field-label/selectTag.vue?vue&type=script&setup=true&lang.ts
+var selectTag_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "selectTag",
+	props: { tagWidgetStyle: {} },
+	setup(__props) {
+		const props = __props;
+		const tagWidgetStyle = toRef(() => {
+			if (!props.tagWidgetStyle.tagStyleOpen) return {
+				tagStyleOpen: true,
+				contentFont: props.tagWidgetStyle?.contentFont
+			};
+			else return props.tagWidgetStyle;
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(tag_label_default, { "tag-widget-style": tagWidgetStyle.value }, null, 8, ["tag-widget-style"]);
+		};
+	}
+});
+//#endregion
+export { selectTag_vue_vue_type_script_setup_true_lang_default as default };

package/es/components/form-component/field-label/tag-label.vue.d.ts

@@ -0,0 +1,36 @@
+import { LowCodeWidget } from '@gct-paas/schema';
+import { FIELD_TYPE } from '@gct-paas/core';
+export interface Props {
+    tagWidgetStyle?: {
+        tagStyleOpen?: boolean;
+        contentFont?: LowCodeWidget.FontStyle;
+        tagStyle?: LowCodeWidget.TagConfigStyle;
+    };
+    type?: FIELD_TYPE | undefined;
+    disabled?: boolean;
+    label?: string | (string | number)[];
+    isDesign?: boolean;
+    closable?: boolean;
+    /** 外部控制是否显示标签样式 */
+    showTagStyle?: boolean;
+    /** 头像 */
+    avatar?: string;
+    iconExtraProps?: Record<string, {
+        icon?: string;
+        iconColor?: string;
+        textColor?: string;
+    }>;
+    iconProps?: {
+        icon: string;
+        iconColor: string;
+        textColor: string;
+    };
+}
+declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "on-close": (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    "onOn-close"?: ((...args: any[]) => any) | undefined;
+}>, {
+    showTagStyle: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;

package/es/components/form-component/field-label/tag-label.vue.mjs

@@ -0,0 +1,7 @@
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.mjs";
+import tag_label_vue_vue_type_script_setup_true_lang_default from "./tag-label.vue_vue_type_script_setup_true_lang.mjs";
+import './tag-label.vue_vue_type_style_index_0_scoped_a1ded441_lang.css';/* empty css                                                                */
+//#region src/components/form-component/field-label/tag-label.vue
+var tag_label_default = /* @__PURE__ */ _plugin_vue_export_helper_default(tag_label_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-a1ded441"]]);
+//#endregion
+export { tag_label_default as default };

package/es/components/form-component/field-label/tag-label.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,143 @@
+import tag_span_default from "./tag-span.vue.mjs";
+import tag_layout_default from "./tag-layout.vue.mjs";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, h, inject, normalizeStyle, openBlock, renderList, toDisplayString, toRef, unref, withCtx, withModifiers } from "vue";
+import { Avatar } from "ant-design-vue";
+import { FIELD_TYPE, t } from "@gct-paas/core";
+import { isString } from "lodash-es";
+import { IconNext, transformUrl } from "@gct-paas/core-web";
+import { schemaToStyle, transformField2Component } from "@gct-paas/design";
+//#region src/components/form-component/field-label/tag-label.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "select-text" };
+var _hoisted_2 = { class: "select-text" };
+var _hoisted_3 = { key: 0 };
+var tag_label_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "tag-label",
+	props: {
+		tagWidgetStyle: {},
+		type: {},
+		disabled: { type: Boolean },
+		label: {},
+		isDesign: { type: Boolean },
+		closable: { type: Boolean },
+		showTagStyle: {
+			type: Boolean,
+			default: true
+		},
+		avatar: {},
+		iconExtraProps: {},
+		iconProps: {}
+	},
+	emits: ["on-close"],
+	setup(__props) {
+		const props = __props;
+		const themeSetting = _gct.platformStore.themeSetting;
+		const labelLayout = inject("labelLayout", {});
+		const showLabel = computed(() => {
+			let showMsg = props.label ?? "";
+			if ((!showMsg || showMsg.length <= 0) && props.isDesign) {
+				const example = props.type ? transformField2Component(props.type)?.example || "" : "";
+				showMsg = example ? isString(example) ? t(example) : example.map((e) => t(e)) : "";
+			}
+			if (props.showTagStyle && props.tagWidgetStyle?.tagStyleOpen || props.type === FIELD_TYPE.ENUM_MULTI || props.type === FIELD_TYPE.ENUM) return showMsg ? isString(showMsg) ? showMsg.split(",") : showMsg : [];
+			else if (showMsg instanceof Array) return showMsg.join("，");
+			else return showMsg + "";
+		});
+		const comStyle = toRef(() => {
+			const contentFont = props.tagWidgetStyle?.contentFont;
+			if (!contentFont) return {};
+			return schemaToStyle(contentFont);
+		});
+		const getMsgColor = (key = "") => {
+			const iconAttrs = props.iconExtraProps?.[key] || {};
+			const color = {};
+			if (iconAttrs?.textColor) Object.assign(color, { color: iconAttrs?.textColor });
+			if (comStyle.value?.color) return comStyle.value;
+			return {
+				wordBreak: "break-all",
+				...comStyle.value,
+				...color
+			};
+		};
+		const iconNode = { render: ({ $attrs }) => {
+			if ($attrs.labelName) {
+				const iconAttrs = props.iconExtraProps?.[$attrs.labelName] || props.iconProps || {};
+				if (!iconAttrs?.icon) return;
+				return h(IconNext, {
+					size: 16,
+					value: iconAttrs?.icon,
+					color: iconAttrs?.iconColor || themeSetting.themeColor,
+					style: "vertical-align: text-bottom; margin-right: 3px"
+				});
+			}
+		} };
+		return (_ctx, _cache) => {
+			return __props.showTagStyle && __props.tagWidgetStyle?.tagStyleOpen ? (openBlock(), createBlock(tag_layout_default, {
+				key: 0,
+				disabled: !!__props.disabled,
+				"label-layout": unref(labelLayout)
+			}, {
+				default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(showLabel.value, (i, index) => {
+					return openBlock(), createBlock(tag_span_default, {
+						key: index,
+						"tag-style": __props.tagWidgetStyle.tagStyle,
+						style: normalizeStyle(getMsgColor(i))
+					}, {
+						default: withCtx(() => [
+							props.avatar ? (openBlock(), createBlock(unref(Avatar), {
+								key: 0,
+								src: unref(transformUrl)(props.avatar),
+								size: 20,
+								style: { "margin-top": "-5px" },
+								class: "mr4px"
+							}, null, 8, ["src"])) : createCommentVNode("", true),
+							createVNode(iconNode, { "label-name": i }, null, 8, ["label-name"]),
+							createElementVNode("span", _hoisted_1, toDisplayString(i), 1),
+							__props.closable ? (openBlock(), createBlock(unref(IconNext), {
+								key: 1,
+								size: 15,
+								value: "icon-park:close-small",
+								style: {
+									verticalAlign: "text-bottom",
+									"--color": "rgba(0,0,0,.45)",
+									lineHeight: "1",
+									marginLeft: "2px"
+								},
+								onClick: _cache[0] || (_cache[0] = withModifiers(($event) => _ctx.$emit("on-close"), ["prevent", "stop"]))
+							})) : createCommentVNode("", true)
+						]),
+						_: 2
+					}, 1032, ["tag-style", "style"]);
+				}), 128))]),
+				_: 1
+			}, 8, ["disabled", "label-layout"])) : __props.type === unref(FIELD_TYPE).ENUM_MULTI || __props.type === unref(FIELD_TYPE).ENUM ? (openBlock(), createBlock(tag_layout_default, {
+				key: 1,
+				disabled: !!__props.disabled,
+				"label-layout": unref(labelLayout)
+			}, {
+				default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(showLabel.value, (i, index) => {
+					return openBlock(), createElementBlock("span", {
+						key: index,
+						style: normalizeStyle(getMsgColor(i)),
+						class: "mr-5px"
+					}, [createVNode(iconNode, { "label-name": i }, null, 8, ["label-name"]), createElementVNode("span", _hoisted_2, toDisplayString(i) + toDisplayString(!__props.tagWidgetStyle?.tagStyleOpen && index < showLabel.value.length - 1 ? "，" : ""), 1)], 4);
+				}), 128)), !showLabel.value.length ? (openBlock(), createElementBlock("span", _hoisted_3, "\xA0")) : createCommentVNode("", true)]),
+				_: 1
+			}, 8, ["disabled", "label-layout"])) : (openBlock(), createBlock(tag_layout_default, {
+				key: 2,
+				style: normalizeStyle(getMsgColor(showLabel.value)),
+				disabled: !!__props.disabled,
+				"label-layout": unref(labelLayout),
+				class: "select-text leading-none ell"
+			}, {
+				default: withCtx(() => [createTextVNode(toDisplayString(showLabel.value || "\xA0"), 1)]),
+				_: 1
+			}, 8, [
+				"style",
+				"disabled",
+				"label-layout"
+			]));
+		};
+	}
+});
+//#endregion
+export { tag_label_vue_vue_type_script_setup_true_lang_default as default };

package/es/components/form-component/field-label/tag-label.vue_vue_type_style_index_0_scoped_a1ded441_lang.css

@@ -0,0 +1,15 @@
+.tag-label-disabled[data-v-a1ded441] {
+  opacity: 0.5;
+}
+.label-ellipsis[data-v-a1ded441] {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.label-wrap[data-v-a1ded441] {
+  word-break: break-all;
+  white-space: wrap;
+}
+.select-text[data-v-a1ded441] {
+  min-width: 16px;
+}

package/es/components/form-component/field-label/tag-layout.vue.d.ts

@@ -0,0 +1,21 @@
+interface Props {
+    labelLayout?: IObject;
+    disabled: boolean;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLSpanElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLSpanElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/es/components/form-component/field-label/tag-layout.vue.mjs

@@ -0,0 +1,7 @@
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.mjs";
+import tag_layout_vue_vue_type_script_setup_true_lang_default from "./tag-layout.vue_vue_type_script_setup_true_lang.mjs";
+import './tag-layout.vue_vue_type_style_index_0_scoped_85e6a8f5_lang.css';/* empty css                                                                 */
+//#region src/components/form-component/field-label/tag-layout.vue
+var tag_layout_default = /* @__PURE__ */ _plugin_vue_export_helper_default(tag_layout_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-85e6a8f5"]]);
+//#endregion
+export { tag_layout_default as default };

package/es/components/form-component/field-label/tag-layout.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,16 @@
+import { createElementBlock, defineComponent, normalizeClass, openBlock, renderSlot } from "vue";
+//#region src/components/form-component/field-label/tag-layout.vue?vue&type=script&setup=true&lang.ts
+var tag_layout_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "tag-layout",
+	props: {
+		labelLayout: {},
+		disabled: { type: Boolean }
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("span", { class: normalizeClass([__props.disabled ? "tag-label-disabled" : null, !!__props.labelLayout?.hasLabelWidth && (__props.labelLayout?.layout.label === "left" || __props.labelLayout?.layout == "horizontal") ? __props.labelLayout?.overLabelDisplay == "ellipsis" ? "label-ellipsis" : "label-wrap" : ""]) }, [renderSlot(_ctx.$slots, "default", {}, void 0, true)], 2);
+		};
+	}
+});
+//#endregion
+export { tag_layout_vue_vue_type_script_setup_true_lang_default as default };

package/es/components/form-component/field-label/tag-layout.vue_vue_type_style_index_0_scoped_85e6a8f5_lang.css

@@ -0,0 +1,12 @@
+.tag-label-disabled[data-v-85e6a8f5] {
+  opacity: 0.5;
+}
+.label-ellipsis[data-v-85e6a8f5] {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.label-wrap[data-v-85e6a8f5] {
+  word-break: break-all;
+  white-space: wrap;
+}

package/es/components/form-component/field-label/tag-span.vue.d.ts

@@ -0,0 +1,21 @@
+import { LowCodeWidget } from '@gct-paas/schema';
+type __VLS_Props = {
+    tagStyle?: LowCodeWidget.TagConfigStyle;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLSpanElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLSpanElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/es/components/form-component/field-label/tag-span.vue.mjs

@@ -0,0 +1,7 @@
+import tag_span_vue_vue_type_script_setup_true_lang_default from "./tag-span.vue_vue_type_script_setup_true_lang.mjs";
+import './tag-span.vue_vue_type_style_index_0_scoped_3bf855f6_lang.css';/* empty css                                                               */
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.mjs";
+//#region src/components/form-component/field-label/tag-span.vue
+var tag_span_default = /* @__PURE__ */ _plugin_vue_export_helper_default(tag_span_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-3bf855f6"]]);
+//#endregion
+export { tag_span_default as default };

package/es/components/form-component/field-label/tag-span.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,25 @@
+import { createElementBlock, defineComponent, normalizeClass, openBlock, renderSlot, toRef, useCssVars } from "vue";
+import { TagTypeEnum } from "@gct-paas/core";
+//#region src/components/form-component/field-label/tag-span.vue?vue&type=script&setup=true&lang.ts
+var tag_span_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "tag-span",
+	props: { tagStyle: {} },
+	setup(__props) {
+		useCssVars((_ctx) => ({ "v650d3ac5": tagStyleColor.value }));
+		const props = __props;
+		const tagType = toRef(() => {
+			return props.tagStyle?.tagType || TagTypeEnum.RADIUS;
+		});
+		const tagStyleColor = toRef(() => {
+			return props.tagStyle?.color || "#f0f0f0";
+		});
+		const getTagClass = toRef(() => {
+			return `tag-${tagType.value}`;
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("span", { class: normalizeClass(["tag cursor-pointer", getTagClass.value]) }, [renderSlot(_ctx.$slots, "default", {}, void 0, true)], 2);
+		};
+	}
+});
+//#endregion
+export { tag_span_vue_vue_type_script_setup_true_lang_default as default };

package/es/components/form-component/field-label/tag-span.vue_vue_type_style_index_0_scoped_3bf855f6_lang.css

@@ -0,0 +1,31 @@
+.tag[data-v-3bf855f6] {
+  padding: 4px 6px;
+  line-height: 1;
+}
+.tag + .tag[data-v-3bf855f6] {
+  margin-left: 5px;
+}
+.tag-radius[data-v-3bf855f6] {
+  border-radius: 4px;
+  background: var(--v650d3ac5);
+}
+.tag-linear_radius[data-v-3bf855f6] {
+  border: 1px solid var(--v650d3ac5);
+  border-radius: 4px;
+}
+.tag-big_radius[data-v-3bf855f6] {
+  border-radius: 100px;
+  background: var(--v650d3ac5);
+}
+.tag-linear_big_radius[data-v-3bf855f6] {
+  border: 1px solid var(--v650d3ac5);
+  border-radius: 100px;
+}
+.tag-dashed_radius[data-v-3bf855f6] {
+  border: 1px dashed var(--v650d3ac5);
+  border-radius: 4px;
+}
+.tag-status[data-v-3bf855f6] {
+  border-radius: 14px 4px 4px;
+  background: var(--v650d3ac5);
+}

package/es/components/form-component/field-readonly.vue.d.ts

@@ -0,0 +1,22 @@
+import { LowCodeWidget } from '@gct-paas/schema';
+/** 与 FieldRadio 传入的 tagStyle 一致，避免依赖 @gct-paas/schema */
+interface TagWidgetStyle {
+    tagStyleOpen?: boolean;
+    contentFont?: LowCodeWidget.FontStyle;
+    tagStyle?: LowCodeWidget.TagConfigStyle;
+}
+type __VLS_Props = {
+    isTooltip?: boolean;
+    label?: string | (string | number)[];
+    type?: string;
+    modelValue?: string;
+    tagWidgetStyle?: TagWidgetStyle;
+    disabled?: boolean;
+    iconExtraProps?: Record<string, {
+        icon?: string;
+        iconColor?: string;
+        textColor?: string;
+    }>;
+};
+declare const _default: 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>;
+export default _default;

package/es/components/form-component/field-readonly.vue.mjs

@@ -0,0 +1,5 @@
+import field_readonly_vue_vue_type_script_setup_true_lang_default from "./field-readonly.vue_vue_type_script_setup_true_lang.mjs";
+//#region src/components/form-component/field-readonly.vue
+var field_readonly_default = field_readonly_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { field_readonly_default as default };

package/es/components/form-component/field-readonly.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,81 @@
+import tag_label_default from "./field-label/tag-label.vue.mjs";
+import { computed, createBlock, createCommentVNode, createElementBlock, createTextVNode, createVNode, defineComponent, mergeProps, openBlock, ref, resolveComponent, toDisplayString, unref, withCtx } from "vue";
+import { FIELD_TYPE } from "@gct-paas/core";
+//#region src/components/form-component/field-readonly.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	key: 0,
+	class: "w100% ell"
+};
+var _hoisted_2 = {
+	key: 0,
+	class: "gct-custom-tag ml8px"
+};
+var field_readonly_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "field-readonly",
+	props: {
+		isTooltip: { type: Boolean },
+		label: {},
+		type: {},
+		modelValue: {},
+		tagWidgetStyle: {},
+		disabled: { type: Boolean },
+		iconExtraProps: {}
+	},
+	setup(__props) {
+		const props = __props;
+		const visible = ref(false);
+		const showLabel = computed(() => {
+			if (Array.isArray(props.label)) return props.label.join(",");
+			else return props.label;
+		});
+		const FieldLabel = computed(() => {
+			return tag_label_default;
+		});
+		/**超出内容出现tip显示全部 */
+		function onMouseenter(e) {
+			if (!props.isTooltip) return;
+			const el = e.target?.parentNode;
+			if (el.scrollWidth > el.clientWidth) visible.value = true;
+		}
+		function onMouseleave() {
+			visible.value = false;
+		}
+		return (_ctx, _cache) => {
+			const _component_a_tooltip = resolveComponent("a-tooltip");
+			return openBlock(), createBlock(_component_a_tooltip, {
+				placement: "topLeft",
+				visible: visible.value
+			}, {
+				title: withCtx(() => [createTextVNode(toDisplayString(showLabel.value), 1)]),
+				default: withCtx(() => [props.type === unref(FIELD_TYPE).RDO_REF ? (openBlock(), createElementBlock("div", _hoisted_1, [createVNode(unref(FieldLabel), mergeProps(_ctx.$attrs, {
+					label: __props.label,
+					"tag-widget-style": props.tagWidgetStyle,
+					disabled: props.disabled,
+					"icon-extra-props": props.iconExtraProps,
+					onMouseenter,
+					onMouseleave
+				}), null, 16, [
+					"label",
+					"tag-widget-style",
+					"disabled",
+					"icon-extra-props"
+				]), props.type === unref(FIELD_TYPE).RDO_REF && props.modelValue && !props.modelValue?.includes(":") ? (openBlock(), createElementBlock("span", _hoisted_2, " 默认 ")) : createCommentVNode("", true)])) : (openBlock(), createBlock(unref(FieldLabel), mergeProps({ key: 1 }, _ctx.$attrs, {
+					label: __props.label,
+					"tag-widget-style": props.tagWidgetStyle,
+					disabled: props.disabled,
+					"icon-extra-props": props.iconExtraProps,
+					onMouseenter,
+					onMouseleave
+				}), null, 16, [
+					"label",
+					"tag-widget-style",
+					"disabled",
+					"icon-extra-props"
+				]))]),
+				_: 1
+			}, 8, ["visible"]);
+		};
+	}
+});
+//#endregion
+export { field_readonly_vue_vue_type_script_setup_true_lang_default as default };