@vue-ui-kit/ant 2.4.6 → 2.5.1

package/src/packages/renders/Icon.ts

@@ -1,13 +1,13 @@
-import { createVNode } from 'vue';
+import { createVNode, type VNode } from 'vue';
 import * as $Icon from '@ant-design/icons-vue';
 import { getUIKitConfig } from '@/utils/config';
 
-const Icon = (props: { icon: string }) => {
+const Icon = (props: { icon: string }): VNode | null => {
   const { icon } = props;
   const customRender = getUIKitConfig().icon?.render;
   if (customRender) {
     const custom = customRender(icon);
-    if (custom) return custom;
+    if (custom) return custom as VNode;
   }
   const antIcon: { [key: string]: any } = $Icon;
   if (antIcon[icon]) return createVNode(antIcon[icon]);

package/src/packages/store/renderStore.tsx

@@ -1,4 +1,9 @@
-import { RenderFormParams, RenderOptions, RenderTableParams } from '#/antProxy';
+import {
+  RenderFormParams,
+  RenderOptions,
+  RenderReadonlyParams,
+  RenderTableParams,
+} from '#/antProxy';
 import {
   Button,
   Dropdown,
@@ -49,6 +54,11 @@ export interface RenderWorkshop {
     params: RenderTableParams,
     defaultHandler: Recordable,
   ) => any;
+  renderReadonly?: (
+    options: RenderOptions,
+    params: RenderReadonlyParams,
+    defaultHandler: Recordable,
+  ) => any;
   renderEdit?: (
     model: Ref<any>,
     options: RenderOptions,
@@ -191,6 +201,21 @@ const renderBasic = (name: string) => {
         <DynamicComponent is={name} {...props} />
       );
     },
+    renderReadonly(
+      { props = {}, attrs = {} }: RenderOptions,
+      { data, field }: RenderReadonlyParams,
+    ) {
+      return field ? (
+        <DynamicComponent
+          is={name}
+          v-model:value={data[field]}
+          {...attrs}
+          {...merge({}, antDefaultProps[name], { disabled: true }, props)}
+        />
+      ) : (
+        <DynamicComponent is={name} {...merge({}, { disabled: true }, props)} />
+      );
+    },
     renderEdit(
       model: Ref<any>,
       { props = antDefaultProps[name] ?? {}, attrs = {}, events = {} }: RenderOptions,
@@ -516,6 +541,15 @@ const renders: RenderFactory = {
         />
       ) : null;
     },
+    renderReadonly({ props = {}, options }: RenderOptions, { data, field }: RenderReadonlyParams) {
+      return valued(field) ? (
+        <RadioGroup
+          v-model:value={data[field!]}
+          {...merge({}, { disabled: true }, props)}
+          options={props.options ?? options ?? []}
+        />
+      ) : null;
+    },
   },
   $autoComplete: {
     renderItemContent(
@@ -559,6 +593,11 @@ const renders: RenderFactory = {
         />
       ) : null;
     },
+    renderReadonly({ props = {} }: RenderOptions, { data, field }: RenderReadonlyParams) {
+      return valued(field) ? (
+        <Switch v-model:checked={data[field!]} {...merge({}, { disabled: true }, props)} />
+      ) : null;
+    },
   },
   $checkbox: {
     renderItemContent(
@@ -588,6 +627,15 @@ const renders: RenderFactory = {
         />
       ) : null;
     },
+    renderReadonly({ props = {}, options }: RenderOptions, { data, field }: RenderReadonlyParams) {
+      return valued(field) ? (
+        <CheckboxGroup
+          v-model:value={data[field!]}
+          {...merge({}, { disabled: true }, props)}
+          options={props.options ?? options ?? []}
+        />
+      ) : null;
+    },
   },
   $paragraph: {
     renderDefault({ props = {} }: RenderOptions, { row, field }: RenderTableParams) {
@@ -690,7 +738,7 @@ const renders: RenderFactory = {
 };
 export const addRender = (
   name: string,
-  { renderItemContent, renderDefault, renderEdit }: RenderWorkshop,
+  { renderItemContent, renderDefault, renderReadonly, renderEdit }: RenderWorkshop,
 ) => {
   if (renders.hasOwnProperty(name)) {
     console.warn(`render ${name} already exists, you are trying to override it`);
@@ -698,6 +746,7 @@ export const addRender = (
   renders[name] = {
     renderItemContent,
     renderDefault,
+    renderReadonly,
     renderEdit,
   };
 };