feat: 去除 slotName 使用input upload

apps/web-antd/src/views/pay/app/modules/data.ts

@@ -1,5 +1,8 @@
 import type { VbenFormSchema } from '#/adapter/form';
 
+import { h } from 'vue';
+
+import { InputUpload } from '#/components/upload';
 import { DICT_TYPE, getDictOptions } from '#/utils/dict';
 
 export function channelSchema(formType: string): VbenFormSchema[] {
@@ -147,13 +150,14 @@ export function channelSchema(formType: string): VbenFormSchema[] {
         {
           label: '商户公钥应用证书',
           fieldName: 'config.appCertContent',
-          slotName: 'appCertContent',
-          component: 'Textarea',
+          component: h(InputUpload, {
+            inputType: 'textarea',
+            textareaProps: { rows: 8, placeholder: '请上传商户公钥应用证书' },
+            fileUploadProps: {
+              accept: ['crt'],
+            },
+          }),
           rules: 'required',
-          componentProps: {
-            placeholder: '请上传商户公钥应用证书',
-            rows: 8,
-          },
           dependencies: {
             show(values) {
               return values?.config?.mode === 1;
@@ -164,13 +168,14 @@ export function channelSchema(formType: string): VbenFormSchema[] {
         {
           label: '支付宝公钥证书',
           fieldName: 'config.alipayPublicCertContent',
-          slotName: 'alipayPublicCertContent',
-          component: 'Textarea',
+          component: h(InputUpload, {
+            inputType: 'textarea',
+            textareaProps: { rows: 8, placeholder: '请上传支付宝公钥证书' },
+            fileUploadProps: {
+              accept: ['crt'],
+            },
+          }),
           rules: 'required',
-          componentProps: {
-            placeholder: '请上传支付宝公钥证书',
-            rows: 8,
-          },
           dependencies: {
             show(values) {
               return values?.config?.mode === 1;
@@ -181,13 +186,14 @@ export function channelSchema(formType: string): VbenFormSchema[] {
         {
           label: '根证书',
           fieldName: 'config.rootCertContent',
-          slotName: 'rootCertContent',
-          component: 'Textarea',
+          component: h(InputUpload, {
+            inputType: 'textarea',
+            textareaProps: { rows: 8, placeholder: '请上传根证书' },
+            fileUploadProps: {
+              accept: ['crt'],
+            },
+          }),
           rules: 'required',
-          componentProps: {
-            placeholder: '请上传根证书',
-            rows: 8,
-          },
           dependencies: {
             show(values) {
               return values?.config?.mode === 1;
@@ -453,12 +459,17 @@ export function channelSchema(formType: string): VbenFormSchema[] {
         {
           label: 'apiclient_cert.p12 证书',
           fieldName: 'config.keyContent',
-          slotName: 'keyContent',
-          component: 'Input',
+          component: h(InputUpload, {
+            inputType: 'textarea',
+            textareaProps: {
+              rows: 8,
+              placeholder: '请上传 apiclient_cert.p12 证书',
+            },
+            fileUploadProps: {
+              accept: ['p12 '],
+            },
+          }),
           rules: 'required',
-          componentProps: {
-            placeholder: '请上传 apiclient_cert.p12 证书',
-          },
           dependencies: {
             show(values) {
               return values?.config?.apiVersion === 'v2';
@@ -484,12 +495,17 @@ export function channelSchema(formType: string): VbenFormSchema[] {
         {
           label: 'apiclient_key.pem 证书',
           fieldName: 'config.privateKeyContent',
-          slotName: 'privateKeyContent',
-          component: 'Input',
+          component: h(InputUpload, {
+            inputType: 'textarea',
+            textareaProps: {
+              rows: 8,
+              placeholder: '请上传 apiclient_key.pem 证书',
+            },
+            fileUploadProps: {
+              accept: ['pem'],
+            },
+          }),
           rules: 'required',
-          componentProps: {
-            placeholder: '请上传 apiclient_key.pem 证书',
-          },
           dependencies: {
             show(values) {
               return values?.config?.apiVersion === 'v3';

docs/src/components/common-ui/vben-form.md

@@ -557,16 +557,4 @@ import { z } from '#/adapter/form';
 
 除了以上内置插槽之外，`schema`属性中每个字段的`fieldName`都可以作为插槽名称，这些字段插槽的优先级高于`component`定义的组件。也就是说，当提供了与`fieldName`同名的插槽时，这些插槽的内容将会作为这些字段的组件，此时`component`的值将会被忽略。
 
-如果需要使用自定义的插槽名而不是使用`fieldName`，可以在schema中添加`slotName`属性。当提供了`slotName`属性时，将优先使用`slotName`作为插槽名。
-
-```ts
-// 使用自定义插槽名的例子
-{
-  component: 'Textarea',
-  fieldName: 'config.appCertContent',
-  slotName: 'appCertSlot',
-  label: '商户公钥应用证书',
-}
-```
-
 :::

packages/@core/ui-kit/form-ui/src/form-render/form.vue

@@ -155,11 +155,7 @@ const computedSchema = computed(
           :rules="cSchema.rules"
         >
           <template #default="slotProps">
-            <slot
-              v-bind="slotProps"
-              :name="cSchema.slotName || cSchema.fieldName"
-            >
-            </slot>
+            <slot v-bind="slotProps" :name="cSchema.fieldName"> </slot>
           </template>
         </FormField>
       </template>

packages/@core/ui-kit/form-ui/src/types.ts

@@ -263,8 +263,6 @@ export interface FormSchema<
   renderComponentContent?: RenderComponentContentType;
   /** 字段规则 */
   rules?: FormSchemaRuleType;
-  /** 自定义插槽名，如果不指定则使用fieldName */
-  slotName?: string;
   /** 后缀 */
   suffix?: CustomRenderType;
 }

packages/@core/ui-kit/popup-ui/src/modal/modal-api.ts

@@ -124,14 +124,6 @@ export class ModalApi {
     return this.setState({ submitting: isLocked });
   }
 
-  modalLoading(loading: boolean) {
-    this.store.setState((prev) => ({
-      ...prev,
-      confirmLoading: loading,
-      loading,
-    }));
-  }
-
   /**
    * 取消操作
    */