@oiij/naive-ui 0.0.63 → 0.0.65

package/dist/components/preset-picker/index.d.ts

@@ -1,52 +1,58 @@
-import { BadgeProps, ButtonProps, DataTableColumns, ModalProps } from 'naive-ui';
-import { TableSelectionColumn } from 'naive-ui/es/data-table/src/interface';
-import { Ref } from 'vue';
-import { DataObject } from '../../composables/useDataRequest';
-import { ClassStyle } from '../data-table-plus/index';
-export { default as NPresetPicker } from './PresetPicker.vue';
-export type PresetPickerValue = string | number | (string | number)[] | null;
-export type PresetPickerExpose<R extends DataObject = DataObject> = {
-    showModalFlag: Ref<boolean, boolean>;
-    checkedRowKeys: Ref<(string | number)[], (string | number)[]>;
-    checkedRows: Ref<R[], R[]>;
-    columns: DataTableColumns<any>;
-    showModal: () => void;
-    updateCheckedRowKeysEffect: (keys: (string | number)[], rows: (R | undefined)[], meta: {
-        row: R | undefined;
-        action: 'check' | 'uncheck' | 'checkAll' | 'uncheckAll';
-    }, currentData: R[]) => void;
-    clickRowEffect: (row: R) => void;
-    clearValue: () => void;
-    setCheckedRowKeys: (keys: (string | number)[]) => void;
-    setCheckedRows: (rows: R[]) => void;
+import { DataObject } from "../../composables/useDataRequest.js";
+import { ClassStyle } from "../data-table-plus/index.js";
+import { _default } from "./PresetPicker.vue.js";
+import { Ref } from "vue";
+import { BadgeProps, ButtonProps, DataTableColumns, ModalProps } from "naive-ui";
+import { ComponentExposed } from "vue-component-type-helpers";
+import { TableSelectionColumn } from "naive-ui/es/data-table/src/interface";
+
+//#region src/components/preset-picker/index.d.ts
+type PresetPickerValue = string | number | (string | number)[] | null;
+type PresetPickerExpose<R extends DataObject = DataObject> = {
+  showModalFlag: Ref<boolean, boolean>;
+  checkedRowKeys: Ref<(string | number)[], (string | number)[]>;
+  checkedRows: Ref<R[], R[]>;
+  columns: DataTableColumns<any>;
+  showModal: () => void;
+  updateCheckedRowKeysEffect: (keys: (string | number)[], rows: (R | undefined)[], meta: {
+    row: R | undefined;
+    action: 'check' | 'uncheck' | 'checkAll' | 'uncheckAll';
+  }, currentData: R[]) => void;
+  clickRowEffect: (row: R) => void;
+  clearValue: () => void;
+  setCheckedRowKeys: (keys: (string | number)[]) => void;
+  setCheckedRows: (rows: R[]) => void;
 };
-export type PresetPickerProps<V extends PresetPickerValue, R extends DataObject = DataObject> = {
-    value?: V;
-    fallbackLabel?: string | ((val: string | number) => string);
-    multiple?: boolean;
-    disabled?: boolean;
-    clearable?: boolean;
-    placeholder?: string;
-    type?: ButtonProps['type'];
-    columns?: DataTableColumns<R>;
-    selectionOptions?: TableSelectionColumn;
-    fields?: {
-        label?: string;
-        value?: string;
-    };
-    buttonProps?: ButtonProps & ClassStyle;
-    clearButtonProps?: ButtonProps & ClassStyle;
-    badgeProps?: BadgeProps & ClassStyle;
-    modalProps?: ModalProps & ClassStyle;
+type PresetPickerProps<V extends PresetPickerValue, R extends DataObject = DataObject> = {
+  value?: V;
+  fallbackLabel?: string | ((val: string | number) => string);
+  multiple?: boolean;
+  disabled?: boolean;
+  clearable?: boolean;
+  placeholder?: string;
+  type?: ButtonProps['type'];
+  columns?: DataTableColumns<R>;
+  selectionOptions?: TableSelectionColumn;
+  fields?: {
+    label?: string;
+    value?: string;
+  };
+  buttonProps?: ButtonProps & ClassStyle;
+  clearButtonProps?: ButtonProps & ClassStyle;
+  badgeProps?: BadgeProps & ClassStyle;
+  modalProps?: ModalProps & ClassStyle;
 };
-export type PresetPickerEmits<V extends PresetPickerValue, R extends DataObject = DataObject> = {
-    (e: 'update:value', val: V | null, raw: R | R[] | null): void;
-    (e: 'afterEnter'): void;
-    (e: 'afterLeave'): void;
-    (e: 'esc'): void;
-    (e: 'maskClick'): void;
-    (e: 'update:show', value: boolean): void;
-    (e: 'close'): void;
-    (e: 'negativeClick'): void;
-    (e: 'positiveClick'): void;
+type PresetPickerEmits<V extends PresetPickerValue, R extends DataObject = DataObject> = {
+  (e: 'update:value', val: V | null, raw: R | R[] | null): void;
+  (e: 'afterEnter'): void;
+  (e: 'afterLeave'): void;
+  (e: 'esc'): void;
+  (e: 'maskClick'): void;
+  (e: 'update:show', value: boolean): void;
+  (e: 'close'): void;
+  (e: 'negativeClick'): void;
+  (e: 'positiveClick'): void;
 };
+type PresetPickerInst = ComponentExposed<typeof _default>;
+//#endregion
+export { PresetPickerEmits, PresetPickerExpose, PresetPickerInst, PresetPickerProps, PresetPickerValue };

package/dist/components/preset-select/PresetSelect.js

@@ -0,0 +1,274 @@
+import { useDataRequest } from "../../composables/useDataRequest.js";
+import { useDebounceFn } from "@vueuse/core";
+import { computed, createBlock, createCommentVNode, createVNode, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, reactive, ref, renderSlot, toRaw, toValue, unref, useTemplateRef, withCtx } from "vue";
+import { NFlex, NPagination, NSelect } from "naive-ui";
+
+//#region src/components/preset-select/PresetSelect.vue
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	__name: "PresetSelect",
+	props: {
+		api: { type: Function },
+		defaultParams: {},
+		manual: {
+			type: Boolean,
+			default: true
+		},
+		fields: {},
+		requestOptions: {},
+		requestPlugins: {},
+		value: {},
+		fallbackLabel: { type: [String, Function] },
+		multiple: {
+			type: Boolean,
+			default: false
+		},
+		disabled: { type: Boolean },
+		clearable: { type: Boolean },
+		debounce: {
+			type: [Boolean, Number],
+			default: true
+		},
+		optionFormat: { type: Function },
+		selectProps: {},
+		pagination: { type: [Object, Boolean] }
+	},
+	emits: [
+		"before",
+		"success",
+		"error",
+		"finally",
+		"blur",
+		"clear",
+		"create",
+		"focus",
+		"scroll",
+		"search",
+		"update:value",
+		"update:page",
+		"update:pageSize"
+	],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const emit = __emit;
+		const selectRef = useTemplateRef("select-ref");
+		const _fields = {
+			page: "page",
+			pageSize: "pageSize",
+			search: "search",
+			list: "list",
+			count: "count",
+			label: "label",
+			value: "value",
+			rowKey: "id",
+			children: "children",
+			...__props.fields
+		};
+		const paginationProps = reactive({ ...__props.pagination && typeof __props.pagination === "boolean" ? {} : __props.pagination });
+		const _dataCache = [];
+		const { loading, data, error, params, list, pagination: paginationRef, run, runAsync, refresh, refreshAsync, cancel, mutate, setParams, runParams, runParamsAsync, onBefore, onSuccess, onError, onFinally } = useDataRequest(__props.api, {
+			defaultParams: {
+				[_fields.search]: null,
+				...__props.defaultParams
+			},
+			manual: __props.manual,
+			fields: _fields,
+			requestOptions: __props.requestOptions,
+			requestPlugins: __props.requestPlugins
+		});
+		onBefore((params$1) => {
+			emit("before", params$1);
+		});
+		onSuccess((data$1, params$1) => {
+			emit("success", data$1, params$1);
+			data$1?.[_fields.list]?.forEach((f) => {
+				if (!_dataCache.some((s) => s?.[_fields.rowKey] === f?.[_fields.rowKey])) _dataCache.push(f);
+			});
+		});
+		onError((err, params$1) => {
+			emit("error", err, params$1);
+		});
+		onFinally((params$1, data$1, err) => {
+			emit("finally", params$1, data$1, err);
+		});
+		const optionsReactive = computed(() => {
+			return typeof __props.optionFormat === "function" ? list.value.map((m) => __props.optionFormat(m)).filter((f) => !!f) : list.value.map((m) => {
+				return {
+					[_fields.label]: m?.[_fields.label],
+					[_fields.value]: m?.[_fields.value],
+					[_fields.children]: m?.[_fields.children]
+				};
+			});
+		});
+		const searchValue = ref("");
+		const debounceSearch = useDebounceFn(() => {
+			runParams({
+				[_fields.page]: 1,
+				[_fields.search]: searchValue.value
+			});
+		}, typeof __props.debounce === "number" ? __props.debounce : 500);
+		const vOnSelect = {
+			onBlur: (ev) => {
+				emit("blur", ev);
+			},
+			onClear: () => {
+				emit("clear");
+			},
+			onCreate: (label) => {
+				return emit("create", label);
+			},
+			onFocus: (ev) => {
+				emit("focus", ev);
+			},
+			onScroll: (ev) => {
+				emit("scroll", ev);
+			},
+			onUpdateValue: (val, option) => {
+				emit("update:value", val, option, toRaw(toValue(Array.isArray(val) ? list.value.filter((f) => val.includes(f?.[_fields.value])) : list.value.find((f) => f?.[_fields.value] === val) ?? null)));
+			},
+			onSearch: (val) => {
+				searchValue.value = val;
+				if (loading.value) return;
+				__props.debounce ? debounceSearch() : runParams({
+					[_fields.page]: 1,
+					[_fields.search]: searchValue.value
+				});
+			},
+			onUpdateShow: (show) => {
+				if (show) {
+					if (!data.value) {
+						if (__props.manual) runParams({
+							[_fields.page]: 1,
+							[_fields.pageSize]: 10,
+							[_fields.search]: null,
+							...__props.defaultParams ?? {}
+						});
+					}
+				}
+			}
+		};
+		const vOnPagination = {
+			onUpdatePage: (page) => {
+				emit("update:page", page);
+				if (loading.value) return;
+				runParams({ [_fields.page]: page });
+			},
+			onUpdatePageSize: (pageSize) => {
+				emit("update:pageSize", pageSize);
+				if (loading.value) return;
+				runParams({ [_fields.pageSize]: pageSize });
+			}
+		};
+		function fallbackOption(val) {
+			return typeof __props.fallbackLabel === "function" ? __props.fallbackLabel(val) : {
+				[_fields.label]: __props.fallbackLabel ?? `${val}`,
+				[_fields.value]: val
+			};
+		}
+		const expose = {
+			loading,
+			data,
+			error,
+			params,
+			list,
+			pagination: paginationRef,
+			run,
+			runAsync,
+			refresh,
+			refreshAsync,
+			cancel,
+			mutate,
+			setParams,
+			runParams,
+			runParamsAsync,
+			onBefore,
+			onSuccess,
+			onError,
+			onFinally,
+			selectRef
+		};
+		const templateBind = computed(() => {
+			return {
+				...expose,
+				loading: toValue(loading),
+				data: toValue(data),
+				error: toValue(error),
+				params: toValue(params),
+				list: toValue(list),
+				pagination: toValue(paginationRef),
+				selectRef: toValue(selectRef)
+			};
+		});
+		__expose(expose);
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(NSelect), mergeProps({
+				ref: "select-ref",
+				remote: "",
+				filterable: "",
+				multiple: __props.multiple,
+				disabled: __props.disabled,
+				clearable: __props.clearable,
+				options: optionsReactive.value,
+				"label-field": _fields.label,
+				"value-field": _fields.value,
+				"children-field": _fields.children,
+				value: __props.value,
+				"fallback-option": fallbackOption,
+				loading: unref(loading)
+			}, __props.selectProps, {
+				onBlur: vOnSelect.onBlur,
+				onClear: vOnSelect.onClear,
+				onCreate: vOnSelect.onCreate,
+				onFocus: vOnSelect.onFocus,
+				onScroll: vOnSelect.onScroll,
+				onSearch: vOnSelect.onSearch,
+				"onUpdate:show": vOnSelect.onUpdateShow,
+				"onUpdate:value": vOnSelect.onUpdateValue
+			}), {
+				header: withCtx(() => [renderSlot(_ctx.$slots, "header", normalizeProps(guardReactiveProps(templateBind.value)))]),
+				action: withCtx(() => [renderSlot(_ctx.$slots, "footer", normalizeProps(guardReactiveProps(templateBind.value)), () => [createVNode(unref(NFlex), null, {
+					default: withCtx(() => [renderSlot(_ctx.$slots, "footer-extra", normalizeProps(guardReactiveProps(templateBind.value))), __props.pagination ? (openBlock(), createBlock(unref(NPagination), mergeProps({
+						key: 0,
+						style: { marginLeft: "auto" },
+						simple: "",
+						disabled: unref(loading)
+					}, {
+						...paginationProps,
+						...unref(paginationRef)
+					}, {
+						"onUpdate:page": vOnPagination.onUpdatePage,
+						"onUpdate:pageSize": vOnPagination.onUpdatePageSize
+					}), null, 16, [
+						"disabled",
+						"onUpdate:page",
+						"onUpdate:pageSize"
+					])) : createCommentVNode("v-if", true)]),
+					_: 3
+				})])]),
+				empty: withCtx(() => [renderSlot(_ctx.$slots, "empty", normalizeProps(guardReactiveProps(templateBind.value)))]),
+				arrow: withCtx(() => [renderSlot(_ctx.$slots, "arrow", normalizeProps(guardReactiveProps(templateBind.value)))]),
+				_: 3
+			}, 16, [
+				"multiple",
+				"disabled",
+				"clearable",
+				"options",
+				"label-field",
+				"value-field",
+				"children-field",
+				"value",
+				"loading",
+				"onBlur",
+				"onClear",
+				"onCreate",
+				"onFocus",
+				"onScroll",
+				"onSearch",
+				"onUpdate:show",
+				"onUpdate:value"
+			]);
+		};
+	}
+});
+var PresetSelect_default = _sfc_main;
+
+//#endregion
+export { PresetSelect_default as default };