@peng_kai/kit 0.2.6 → 0.2.8

package/admin/components/settings/src/Settings.vue

@@ -1,5 +1,4 @@
 <script lang="ts">
-import { reactiveComputed } from '@vueuse/core';
 import { cloneDeep, mapKeys, mapValues } from 'lodash-es';
 import { Button, Card, CheckboxGroup, DatePicker, type DatePickerProps, Form, FormItem, Input, InputNumber, RadioGroup, RangePicker, Select, Textarea } from 'ant-design-vue';
 import { computed, ref, toRef } from 'vue';
@@ -196,7 +195,7 @@ const settingMutator = useMutation({
     queryClient.invalidateQueries({ queryKey: [props.configApi.id], exact: false });
   },
 });
-const formSchema = reactiveComputed(() => {
+const formSchema = computed(() => {
   const _configList = configList.value ?? [];
   const entries = _configList.map(config => [
     config.key,

package/antd/hooks/useAntdDrawer.ts

@@ -4,7 +4,7 @@ import type { Component } from 'vue';
 import type { ButtonProps, DrawerProps } from 'ant-design-vue';
 import type { ComponentProps } from 'vue-component-type-helpers';
 import type { Writable } from 'type-fest';
-import { useComponentRef } from '../../vue';
+import { useTemplateRefs } from '../../vue';
 
 const defaultDrawerProps: DrawerProps = { open: false, destroyOnClose: true, rootClassName: 'antd-cover__basic-drawer' };
 
@@ -19,7 +19,9 @@ export function useAntdDrawer<Comp extends Component>(
 ) {
   const _comp = ({ props: {}, ...((comp as any)?.is ? comp : { is: comp }) }) as Required<IComponentConfig<Comp>>;
   const compProps = reactive(_comp.props);
-  const compRef = useComponentRef(_comp.is);
+  const [refs, setRefs] = useTemplateRefs<{
+    comp: typeof _comp.is
+  }>();
   const _drawerProps: DrawerProps = reactive({
     ...defaultDrawerProps,
     ...isProxy(drawerProps) ? toRefs(drawerProps) : drawerProps,
@@ -39,8 +41,8 @@ export function useAntdDrawer<Comp extends Component>(
       const cancelBtnProps: ButtonProps = reactive({ onClick: close });
       const confirmBtnProps: ButtonProps = reactive({
         type: 'primary',
-        loading: toRef(() => (compRef as any)?.loading),
-        onClick: () => (compRef as any)?.confirm?.(),
+        loading: toRef(() => (refs.comp as any)?.loading),
+        onClick: () => (refs.comp as any)?.confirm?.(),
       });
 
       return { cancelBtnProps, confirmBtnProps };
@@ -66,8 +68,16 @@ export function useAntdDrawer<Comp extends Component>(
   _drawerProps['onUpdate:open'] = (visiable) => {
     _drawerProps.open = visiable;
   };
-  (compProps as any).ref = compRef;
+  (compProps as any).ref = setRefs.comp;
   (compProps as any).onClose = close;
 
-  return { PresetComponent, drawerProps: _drawerProps, open, close };
+  return {
+    PresetComponent,
+    drawerProps: _drawerProps,
+    get $comp() {
+      return refs.comp;
+    },
+    open,
+    close,
+  };
 }

package/antd/hooks/useAntdForm.ts

@@ -82,7 +82,20 @@ function useAntdForm<S extends Record<string, unknown>, TS = S>(schemas: MaybeRe
 
   watch(itemProps, () => $form.clearValidate?.(), { flush: 'post', deep: true });
 
-  watchEffect(() => {
+  // watchEffect(() => {
+  //   const _state: any = {};
+
+  //   for (const k in schemasR.value) {
+  //     const item = schemasR.value[k];
+  //     _state[k] = (k in state.value) ? toRef(state.value, k) : toRef(item, 'value');
+  //   }
+
+  //   console.log('🤡 / _state:', _state);
+  //   state.value = _state;
+  // });
+
+  // 为什么之前用 watchEffect？
+  watch(schemasR, () => {
     const _state: any = {};
 
     for (const k in schemasR.value) {
@@ -91,7 +104,7 @@ function useAntdForm<S extends Record<string, unknown>, TS = S>(schemas: MaybeRe
     }
 
     state.value = _state;
-  });
+  }, { immediate: true });
 
   return reactive({ state, stateTF, show, props, itemProps, $form });
 }

package/antd/hooks/useAntdModal.ts

@@ -4,7 +4,7 @@ import type { Component } from 'vue';
 import type { ModalProps } from 'ant-design-vue';
 import type { ComponentProps } from 'vue-component-type-helpers';
 import type { Writable } from 'type-fest';
-import { useComponentRef } from '../../vue';
+import { useTemplateRefs } from '../../vue';
 
 const defaultModalProps: ModalProps = { open: false, destroyOnClose: true, wrapClassName: 'antd-cover__basic-modal' };
 
@@ -28,13 +28,15 @@ export function useAntdModal<Comp extends Component>(
 ) {
   const _comp = ({ props: {}, type: 'body', ...((comp as any)?.is ? comp : { is: comp }) }) as Required<IComponentConfig<Comp>>;
   const compProps = reactive(_comp.props);
-  const compRef = useComponentRef(_comp.is);
+  const [refs, setRefs] = useTemplateRefs<{
+    comp: typeof _comp.is
+  }>();
   const _modalProps: ModalProps = reactive({
     ...defaultModalProps,
     ...isProxy(modalProps) ? toRefs(modalProps) : modalProps,
-    confirmLoading: toRef(() => (compRef as any)?.loading),
+    confirmLoading: toRef(() => (refs.comp as any)?.loading),
     onOk: (e: MouseEvent) => {
-      (compRef as any)?.confirm?.(e);
+      (refs.comp as any)?.confirm?.(e);
       modalProps.onOk?.(e);
     },
   });
@@ -61,8 +63,17 @@ export function useAntdModal<Comp extends Component>(
   _modalProps['onUpdate:open'] = (visiable) => {
     _modalProps.open = visiable;
   };
-  (compProps as any).ref = compRef;
+  (compProps as any).ref = setRefs.comp;
   (compProps as any).onClose = close;
 
-  return { PresetComponent, modalProps: _modalProps, compProps, $comp: compRef, open, close };
+  return {
+    PresetComponent,
+    modalProps: _modalProps,
+    compProps,
+    get $comp() {
+      return refs.comp;
+    },
+    open,
+    close,
+  };
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@peng_kai/kit",
   "type": "module",
-  "version": "0.2.6",
+  "version": "0.2.8",
   "description": "",
   "author": "",
   "license": "ISC",