From 265627fcc8a197861aea2f04641f457548180177 Mon Sep 17 00:00:00 2001
From: Electrolux <59329360+electroluxcode@users.noreply.github.com>
Date: Mon, 13 May 2024 18:29:42 +0800
Subject: [PATCH] feat(BasicForm): add prefix slot for schema (#3840)

---
 src/components/Form/src/BasicForm.vue           | 14 +++++++++++---
 src/components/Form/src/components/FormItem.vue | 15 ++++++++++++---
 src/components/Form/src/types/form.ts           |  4 ++--
 3 files changed, 25 insertions(+), 8 deletions(-)

diff --git a/src/components/Form/src/BasicForm.vue b/src/components/Form/src/BasicForm.vue
index 4f015e99..3dc5468b 100644
--- a/src/components/Form/src/BasicForm.vue
+++ b/src/components/Form/src/BasicForm.vue
@@ -339,11 +339,19 @@
       //   margin-bottom: 20px;
       // }
 
-      &.suffix-item {
+      &.suffix-item, &.prefix-item {
         .ant-form-item-children {
           display: flex;
+        } 
+      }
+      &.suffix-item, &.prefix-item{
+        .prefix {
+          display: inline-flex;
+          align-items: center;
+          margin-top: 1px;
+          padding-right: 6px;
+          line-height: 1;
         }
-
         .suffix {
           display: inline-flex;
           align-items: center;
@@ -353,7 +361,7 @@
         }
       }
     }
-
+   
     .ant-form-explain {
       font-size: 14px;
     }
diff --git a/src/components/Form/src/components/FormItem.vue b/src/components/Form/src/components/FormItem.vue
index 91315848..1f84f706 100644
--- a/src/components/Form/src/components/FormItem.vue
+++ b/src/components/Form/src/components/FormItem.vue
@@ -367,7 +367,7 @@
       }
 
       function renderItem() {
-        const { itemProps, slot, render, field, suffix, component } = props.schema;
+        const { itemProps, slot, render, field, suffix, component, prefix } = props.schema;
         const { labelCol, wrapperCol } = unref(itemLabelWidthProp);
         const { colon } = props.formProps;
         const opts = { disabled: unref(getDisable), readonly: unref(getReadonly) };
@@ -383,7 +383,10 @@
               labelCol={labelCol}
               wrapperCol={wrapperCol}
               name={field}
-              class={{ 'suffix-item': !!suffix }}
+              class={{ 
+                'suffix-item': !!suffix, 
+                'prefix-item': !!prefix 
+              }}
             >
               <BasicTitle {...unref(getComponentsProps)}>{renderLabelHelpMessage()}</BasicTitle>
             </Form.Item>
@@ -400,6 +403,8 @@
           const showSuffix = !!suffix;
           const getSuffix = isFunction(suffix) ? suffix(unref(getValues)) : suffix;
 
+          const showPrefix = !!prefix;
+          const getPrefix = isFunction(prefix) ? prefix(unref(getValues)) : prefix;
           // TODO 自定义组件验证会出现问题，因此这里框架默认将自定义组件设置手动触发验证，如果其他组件还有此问题请手动设置autoLink=false
           if (component && NO_AUTO_LINK_COMPONENTS.includes(component)) {
             props.schema &&
@@ -413,7 +418,10 @@
             <Form.Item
               name={field}
               colon={colon}
-              class={{ 'suffix-item': showSuffix }}
+              class={{
+                'suffix-item': showSuffix,
+                'prefix-item': showPrefix,
+              }}
               {...(itemProps as Recordable<any>)}
               label={renderLabelHelpMessage()}
               rules={handleRules()}
@@ -421,6 +429,7 @@
               wrapperCol={wrapperCol}
             >
               <div style="display:flex">
+                {showPrefix && <span class="prefix">{getPrefix}</span>}
                 <div style="flex:1;">{getContent()}</div>
                 {showSuffix && <span class="suffix">{getSuffix}</span>}
               </div>
diff --git a/src/components/Form/src/types/form.ts b/src/components/Form/src/types/form.ts
index c7f53ebd..0445fdd2 100644
--- a/src/components/Form/src/types/form.ts
+++ b/src/components/Form/src/types/form.ts
@@ -167,8 +167,8 @@ interface BaseFormSchema<T extends ComponentType = any> {
   // Required
   required?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean);
 
-  suffix?: string | number | ((values: RenderCallbackParams) => string | number);
-
+  suffix?: string | number |  VNode | ((renderCallbackParams: RenderCallbackParams) => string | VNode | number)
+  prefix?: string | number | VNode |  ((renderCallbackParams: RenderCallbackParams) => string | VNode | number)
   // Validation rules
   rules?: Rule[];
   // Check whether the information is added to the label