@antdv-next1/pro-field 1.0.0

package/dist/components/Money/index.js

@@ -0,0 +1,274 @@
+import InputNumberPopover from "./InputNumberPopover.js";
+import { Fragment, computed, createVNode, defineComponent, mergeProps } from "vue";
+import { intlMap, useIntl } from "@antdv-next1/pro-provider";
+import { omit } from "@v-c/util";
+//#region src/components/Money/index.tsx
+const defaultMoneyIntl = new Intl.NumberFormat("zh-Hans-CN", {
+	style: "currency",
+	currency: "CNY"
+});
+const intlMap$1 = {
+	default: defaultMoneyIntl,
+	"zh-Hans-CN": {
+		currency: "CNY",
+		style: "currency"
+	},
+	"en-US": {
+		style: "currency",
+		currency: "USD"
+	},
+	"ru-RU": {
+		style: "currency",
+		currency: "RUB"
+	},
+	"ms-MY": {
+		style: "currency",
+		currency: "MYR"
+	},
+	"sr-RS": {
+		style: "currency",
+		currency: "RSD"
+	},
+	"pt-BR": {
+		style: "currency",
+		currency: "BRL"
+	}
+};
+/**
+* A function that formats the number.
+* @param {string | false} locale - The currency symbol, which is the first parameter of the
+* formatMoney function.
+* @param {number | string | undefined} paramsText - The text to be formatted
+* @param {number} precision - number, // decimal places
+* @param {any} [config] - the configuration of the number format, which is the same as the
+* configuration of the number format in the Intl.NumberFormat method.
+* @param moneySymbol
+* @returns A function that takes in 4 parameters and returns a string.
+*/
+function getTextByLocale(locale, paramsText, precision, config, moneySymbol = "") {
+	let moneyText = paramsText?.toString().replace(/,/g, "");
+	if (typeof moneyText === "string") {
+		const parsedNum = Number(moneyText);
+		if (Number.isNaN(parsedNum)) return moneyText;
+		moneyText = parsedNum;
+	}
+	if (!moneyText && moneyText !== 0) return "";
+	const supportFormat = locale !== false && Intl.NumberFormat.supportedLocalesOf([locale.replace("_", "-")], { localeMatcher: "lookup" }).length > 0;
+	try {
+		const finalMoneyText = new Intl.NumberFormat(supportFormat ? locale?.replace("_", "-") || "zh-Hans-CN" : "zh-Hans-CN", {
+			...intlMap$1[locale || "zh-Hans-CN"] || defaultMoneyIntl,
+			maximumFractionDigits: precision,
+			...config
+		}).format(moneyText);
+		const doubleSymbolFormat = (Text) => {
+			const match = Text.match(/\d+/);
+			if (match) {
+				const number = match[0];
+				return Text.slice(Text.indexOf(number));
+			} else return Text;
+		};
+		const pureMoneyText = doubleSymbolFormat(finalMoneyText);
+		/**
+		* 首字母判断是否是正负符号
+		*/
+		const [operatorSymbol] = finalMoneyText || "";
+		if (["+", "-"].includes(operatorSymbol)) return `${moneySymbol || ""}${operatorSymbol}${pureMoneyText}`;
+		return `${moneySymbol || ""}${pureMoneyText}`;
+	} catch (error) {
+		return moneyText;
+	}
+	return moneyText;
+}
+const DefaultPrecisionCont = 2;
+const FieldMoney = /* @__PURE__ */ defineComponent((props) => {
+	const precision = computed(() => props.fieldProps?.precision ?? DefaultPrecisionCont);
+	const intl = computed(() => {
+		if (props.locale && intlMap[props.locale]) return intlMap[props.locale];
+		return useIntl().value;
+	});
+	/**
+	* 获取货币的符号
+	* 如果 customSymbol 存在直接使用 customSymbol
+	* 如果 moneySymbol 为 false，返回空
+	* 如果没有配置使用默认的
+	*/
+	const moneySymbol = computed(() => {
+		const customSymbol = props.customSymbol || props.fieldProps?.customSymbol;
+		if (customSymbol) return customSymbol;
+		if (props.moneySymbol === false || props.fieldProps?.moneySymbol === false) return;
+		return intl.value.getMessage({
+			id: "moneySymbol",
+			defaultMessage: "¥"
+		});
+	});
+	const getFormateValue = (value) => {
+		const reg = new RegExp(`\\B(?=(\\d{${3 + Math.max(precision.value - DefaultPrecisionCont, 0)}})+(?!\\d))`, "g");
+		const [intStr, floatStr] = String(value).split(".");
+		const resultInt = intStr?.replace(reg, ",");
+		let resultFloat = "";
+		if (floatStr && precision.value > 0) resultFloat = `.${floatStr.slice(0, precision.value === void 0 ? DefaultPrecisionCont : precision.value)}`;
+		return `${resultInt}${resultFloat}`;
+	};
+	return () => {
+		const { text, mode: type, render, formItemRender, fieldProps, placeholder: propsPlaceholder, locale, numberFormatOptions = fieldProps?.numberFormatOptions, numberPopoverRender = fieldProps?.numberPopoverRender || false, moneySymbol: propsMoneySymbol, customSymbol, ...rest } = props;
+		if (type === "read") {
+			const dom = createVNode("span", null, [getTextByLocale(locale || false, text, precision.value, numberFormatOptions ?? fieldProps?.numberFormatOptions, moneySymbol.value)]);
+			if (render) return createVNode(Fragment, null, [render(text, {
+				mode: type,
+				...rest,
+				fieldProps
+			}, dom)]);
+			return dom;
+		}
+		if (type === "edit" || type === "update") {
+			const placeholder = fieldProps?.placeholder || propsPlaceholder || intl.value.getMessage({
+				id: "tableForm.inputPlaceholder",
+				defaultMessage: "请输入"
+			});
+			const dom = createVNode(InputNumberPopover, mergeProps({
+				"contentRender": (props) => {
+					if (numberPopoverRender === false) return null;
+					if (!props.value) return null;
+					const localeText = getTextByLocale(locale || false, `${getFormateValue(props.value)}`, precision.value, {
+						...numberFormatOptions,
+						notation: "compact"
+					}, moneySymbol.value);
+					if (typeof numberPopoverRender === "function") return numberPopoverRender?.(props, (localeText || "").toString());
+					return localeText;
+				},
+				"precision": precision.value,
+				"formatter": (value) => {
+					if (value && moneySymbol.value) return `${moneySymbol.value} ${getFormateValue(value)}`;
+					return value?.toString() || value;
+				},
+				"parser": (value) => {
+					if (moneySymbol.value && value) {
+						const regStr = `\\${moneySymbol.value}\\s?|(,*)`;
+						return value.replace(new RegExp(regStr, "g"), "");
+					}
+					return value;
+				},
+				"placeholder": placeholder
+			}, omit(fieldProps, [
+				"numberFormatOptions",
+				"precision",
+				"numberPopoverRender",
+				"customSymbol",
+				"moneySymbol",
+				"open",
+				"onBlur"
+			]), { "onBlur": fieldProps?.onBlur ? (e) => {
+				let value = e.target?.value;
+				if (moneySymbol.value && value) {
+					const regStr = `\\${moneySymbol.value}\\s?|(,*)`;
+					value = value.replace(new RegExp(regStr, "g"), "");
+				}
+				fieldProps.onBlur?.(e);
+			} : void 0 }), null);
+			if (formItemRender) return createVNode(Fragment, null, [formItemRender(text, {
+				mode: type,
+				...rest,
+				fieldProps,
+				placeholder
+			}, dom)]);
+			return dom;
+		}
+		return null;
+	};
+}, {
+	props: {
+		text: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		"onUpdate:text": {
+			type: Function,
+			required: false
+		},
+		fieldProps: {
+			type: Object,
+			required: false
+		},
+		mode: {
+			type: String,
+			required: false
+		},
+		light: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		label: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		valueEnum: {
+			type: [Object, Map],
+			required: false
+		},
+		proFieldKey: {
+			type: [String, Number],
+			required: false
+		},
+		render: {
+			type: Function,
+			required: false
+		},
+		formItemRender: {
+			type: Function,
+			required: false
+		},
+		moneySymbol: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		locale: {
+			type: String,
+			required: false
+		},
+		placeholder: {
+			type: String,
+			required: false
+		},
+		customSymbol: {
+			type: String,
+			required: false
+		},
+		numberPopoverRender: {
+			type: [Function, Boolean],
+			required: false,
+			default: void 0
+		},
+		numberFormatOptions: {
+			type: Object,
+			required: false
+		},
+		id: {
+			type: String,
+			required: false
+		}
+	},
+	name: "FieldMoney",
+	inheritAttrs: false
+});
+//#endregion
+export { FieldMoney as default };

package/dist/components/Options/index.d.ts

@@ -0,0 +1,18 @@
+import { ProFieldFC } from "../../typing.js";
+import * as _$vue from "vue";
+import * as _$_antdv_next1_pro_provider0 from "@antdv-next1/pro-provider";
+import { CustomSlotsType, VueNode } from "@v-c/util/dist/type";
+
+//#region src/components/Options/index.d.ts
+type FieldOptionsProps = ProFieldFC<{
+  text?: VueNode;
+}>;
+declare const FieldOptions: _$vue.DefineSetupFnComponent<FieldOptionsProps, {}, CustomSlotsType<{
+  default?: () => VueNode;
+}>, _$_antdv_next1_pro_provider0.BaseProFieldFC<any> & _$_antdv_next1_pro_provider0.ProRenderFieldPropsType<any> & {
+  text?: VueNode;
+} & {
+  id?: string;
+} & {}, _$vue.PublicProps>;
+//#endregion
+export { FieldOptionsProps, FieldOptions as default };

package/dist/components/Options/index.js

@@ -0,0 +1,120 @@
+import { Fragment, cloneVNode, computed, createVNode, defineComponent, isVNode } from "vue";
+import { proTheme } from "@antdv-next1/pro-provider";
+import { isSpecialNode } from "@antdv-next1/pro-utils";
+import { useConfig } from "antdv-next/dist/config-provider/context";
+//#region src/components/Options/index.tsx
+function addArrayKeys(doms) {
+	return doms.map((dom, index) => {
+		if (!isVNode(dom) || isVNode(dom) && isSpecialNode(dom)) return createVNode(Fragment, { "key": index }, [dom]);
+		return cloneVNode(dom, {
+			...dom?.props,
+			style: { ...dom?.props?.style }
+		});
+	});
+}
+const FieldOptions = /* @__PURE__ */ defineComponent((props) => {
+	const config = useConfig();
+	const baseClassName = computed(() => config.value.getPrefixCls("pro-field-option"));
+	const { token } = proTheme.useToken();
+	return () => {
+		const { text, render, mode: type, formItemRender, fieldProps, ...rest } = props;
+		if (render) {
+			const doms = render(text, {
+				mode: type,
+				fieldProps,
+				...rest
+			}, createVNode(Fragment, null, null));
+			if (!doms || doms?.length < 1 || !Array.isArray(doms)) return null;
+			return createVNode("div", {
+				"style": {
+					display: "flex",
+					gap: token.value.margin,
+					alignItems: "center"
+				},
+				"class": baseClassName.value
+			}, [addArrayKeys(doms)]);
+		}
+		if (!text || !Array.isArray(text)) {
+			if (!isVNode(text)) return null;
+			return text;
+		}
+		return createVNode("div", {
+			"style": {
+				display: "flex",
+				gap: token.value.margin,
+				alignItems: "center"
+			},
+			"class": baseClassName.value
+		}, [addArrayKeys(text)]);
+	};
+}, {
+	props: {
+		text: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		"onUpdate:text": {
+			type: Function,
+			required: false
+		},
+		fieldProps: {
+			type: Object,
+			required: false
+		},
+		mode: {
+			type: String,
+			required: false
+		},
+		light: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		label: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		valueEnum: {
+			type: [Object, Map],
+			required: false
+		},
+		proFieldKey: {
+			type: [String, Number],
+			required: false
+		},
+		render: {
+			type: Function,
+			required: false
+		},
+		formItemRender: {
+			type: Function,
+			required: false
+		},
+		id: {
+			type: String,
+			required: false
+		}
+	},
+	name: "FieldOptions",
+	inheritAttrs: false
+});
+//#endregion
+export { FieldOptions as default };

package/dist/components/Password/index.d.ts

@@ -0,0 +1,33 @@
+import { ProFieldFC } from "../../typing.js";
+import * as _$vue from "vue";
+import { ComputedRef } from "vue";
+import * as _$_antdv_next1_pro_provider0 from "@antdv-next1/pro-provider";
+import { InputRef } from "antdv-next";
+import { VueNode } from "@v-c/util";
+import { CustomSlotsType } from "@v-c/util/dist/type";
+import { PasswordProps } from "antdv-next/dist/input/Password";
+
+//#region src/components/Password/index.d.ts
+type FieldPasswordProps = ProFieldFC<{
+  text?: VueNode;
+  open?: boolean;
+  'onUpdate:open'?: (open: boolean) => void;
+  placeholder?: string;
+  onOpenChange?: (open: boolean) => void;
+}, PasswordProps>;
+type FieldPasswordExpose = Omit<InputRef, 'input' | 'nativeElement' | 'setSelectionRange' | 'select'> & {
+  input: ComputedRef<InputRef['input']>;
+};
+declare const FieldPassword: _$vue.DefineSetupFnComponent<FieldPasswordProps, {}, CustomSlotsType<{
+  default?: () => VueNode;
+}>, _$_antdv_next1_pro_provider0.BaseProFieldFC<PasswordProps> & _$_antdv_next1_pro_provider0.ProRenderFieldPropsType<PasswordProps> & {
+  text?: VueNode;
+  open?: boolean;
+  'onUpdate:open'?: (open: boolean) => void;
+  placeholder?: string;
+  onOpenChange?: (open: boolean) => void;
+} & {
+  id?: string;
+} & {}, _$vue.PublicProps>;
+//#endregion
+export { FieldPasswordExpose, FieldPasswordProps, FieldPassword as default };

package/dist/components/Password/index.js

@@ -0,0 +1,137 @@
+import { Fragment, computed, createTextVNode, createVNode, defineComponent, mergeProps, shallowRef } from "vue";
+import { useIntl } from "@antdv-next1/pro-provider";
+import { InputPassword, Space } from "antdv-next";
+import { EyeInvisibleOutlined, EyeOutlined } from "@antdv-next/icons";
+import { useMergedState } from "@v-c/util";
+//#region src/components/Password/index.tsx
+const FieldPassword = /* @__PURE__ */ defineComponent((props, { expose }) => {
+	const intl = useIntl();
+	const passwordRef = shallowRef(null);
+	const [open, setOpen] = useMergedState(() => props.open || false, {
+		value: computed(() => props.open),
+		onChange: props.onOpenChange
+	});
+	expose({
+		input: computed(() => passwordRef.value?.input),
+		blur: () => passwordRef.value?.blur(),
+		focus: (options) => passwordRef.value?.focus(options)
+	});
+	return () => {
+		const { text, mode, render, formItemRender, placeholder: propsPlaceholder, open: propsOpen, "onUpdate:open": onUpdateOpen, fieldProps, onOpenChange, ...rest } = props;
+		if (mode === "read") {
+			let dom = createVNode(Fragment, null, [createTextVNode("-")]);
+			if (text) dom = createVNode(Space, null, { default: () => [createVNode("span", null, [open.value ? text : "********"]), createVNode("a", { "onClick": () => setOpen(!open.value) }, [open.value ? createVNode(EyeOutlined, null, null) : createVNode(EyeInvisibleOutlined, null, null)])] });
+			if (render) return createVNode(Fragment, null, [render(text, {
+				mode,
+				...rest,
+				fieldProps
+			}, dom)]);
+			return dom;
+		}
+		if (mode === "edit" || mode === "update") {
+			const placeholder = propsPlaceholder || intl.value.getMessage({
+				id: "tableForm.inputPlaceholder",
+				defaultMessage: "请输入"
+			});
+			const dom = createVNode(InputPassword, mergeProps({
+				"ref": passwordRef,
+				"placeholder": placeholder
+			}, fieldProps), null);
+			if (formItemRender) return createVNode(Fragment, null, [formItemRender(text, {
+				mode,
+				...rest,
+				fieldProps,
+				placeholder
+			}, dom)]);
+			return dom;
+		}
+		return null;
+	};
+}, {
+	props: {
+		text: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		"onUpdate:text": {
+			type: Function,
+			required: false
+		},
+		fieldProps: {
+			type: Object,
+			required: false
+		},
+		mode: {
+			type: String,
+			required: false
+		},
+		light: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		label: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		valueEnum: {
+			type: [Object, Map],
+			required: false
+		},
+		proFieldKey: {
+			type: [String, Number],
+			required: false
+		},
+		render: {
+			type: Function,
+			required: false
+		},
+		formItemRender: {
+			type: Function,
+			required: false
+		},
+		open: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		"onUpdate:open": {
+			type: Function,
+			required: false
+		},
+		placeholder: {
+			type: String,
+			required: false
+		},
+		onOpenChange: {
+			type: Function,
+			required: false
+		},
+		id: {
+			type: String,
+			required: false
+		}
+	},
+	name: "FieldPassword",
+	inheritAttrs: false
+});
+//#endregion
+export { FieldPassword as default };

package/dist/components/Percent/index.d.ts

@@ -0,0 +1,45 @@
+import { ProFieldFC } from "../../typing.js";
+import * as _$vue from "vue";
+import * as _$_antdv_next1_pro_provider0 from "@antdv-next1/pro-provider";
+import { ProFieldFCRenderProps } from "@antdv-next1/pro-provider";
+import { VueNode } from "@antdv-next1/pro-utils";
+import { InputNumberProps } from "antdv-next";
+import { CustomSlotsType } from "@v-c/util/dist/type";
+
+//#region src/components/Percent/index.d.ts
+type FieldPercentProps = ProFieldFC<{
+  prefix?: VueNode;
+  suffix?: VueNode;
+  text?: number | string;
+  precision?: number;
+  showColor?: boolean;
+  showSymbol?: boolean | ((value: any) => boolean);
+  render?: ((text: any, props: Omit<ProFieldFCRenderProps, 'value' | 'onUpdate:value' | 'onChange'> & {
+    prefix?: VueNode;
+    precision?: number;
+    showSymbol?: boolean;
+    suffix?: VueNode;
+  }, dom: VueNode) => VueNode);
+  placeholder?: string;
+}, InputNumberProps>;
+declare const FieldPercent: _$vue.DefineSetupFnComponent<FieldPercentProps, {}, CustomSlotsType<{
+  default?: () => VueNode;
+}>, _$_antdv_next1_pro_provider0.BaseProFieldFC<InputNumberProps> & _$_antdv_next1_pro_provider0.ProRenderFieldPropsType<InputNumberProps> & {
+  prefix?: VueNode;
+  suffix?: VueNode;
+  text?: number | string;
+  precision?: number;
+  showColor?: boolean;
+  showSymbol?: boolean | ((value: any) => boolean);
+  render?: ((text: any, props: Omit<ProFieldFCRenderProps, "value" | "onUpdate:value" | "onChange"> & {
+    prefix?: VueNode;
+    precision?: number;
+    showSymbol?: boolean;
+    suffix?: VueNode;
+  }, dom: VueNode) => VueNode);
+  placeholder?: string;
+} & {
+  id?: string;
+} & {}, _$vue.PublicProps>;
+//#endregion
+export { FieldPercentProps, FieldPercent as default };