| | |
| | | import type { UnwrapRef } from 'vue'; |
| | | import { reactive, readonly, computed, getCurrentInstance } from 'vue'; |
| | | import type { UnwrapRef, Ref } from 'vue'; |
| | | import { |
| | | reactive, |
| | | readonly, |
| | | computed, |
| | | getCurrentInstance, |
| | | watchEffect, |
| | | unref, |
| | | nextTick, |
| | | toRaw, |
| | | } from 'vue'; |
| | | |
| | | import { isEqual } from 'lodash-es'; |
| | | |
| | | export function useRuleFormItem<T extends Indexable>( |
| | | export function useRuleFormItem<T extends Recordable>( |
| | | props: T, |
| | | key: keyof T = 'value', |
| | | changeEvent = 'change' |
| | | changeEvent = 'change', |
| | | emitData?: Ref<any[]>, |
| | | ) { |
| | | const instance = getCurrentInstance(); |
| | | const emit = instance?.emit; |
| | |
| | | |
| | | const defaultState = readonly(innerState); |
| | | |
| | | const setState = (val: UnwrapRef<T[keyof T]>) => { |
| | | const setState = (val: UnwrapRef<T[keyof T]>): void => { |
| | | innerState.value = val as T[keyof T]; |
| | | }; |
| | | const state = computed({ |
| | | |
| | | watchEffect(() => { |
| | | innerState.value = props[key]; |
| | | }); |
| | | |
| | | const state: any = computed({ |
| | | get() { |
| | | return innerState.value; |
| | | }, |
| | | set(value) { |
| | | if (isEqual(value, defaultState.value)) return; |
| | | |
| | | innerState.value = value as T[keyof T]; |
| | | emit?.(changeEvent, value); |
| | | nextTick(() => { |
| | | emit?.(changeEvent, value, ...(toRaw(unref(emitData)) || [])); |
| | | }); |
| | | }, |
| | | }); |
| | | |