From a9bbed19739376ab2bf67a14b04e872f14ca84cc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E6=9C=A8?= <netfan@foxmail.com>
Date: Fri, 9 Jul 2021 16:39:50 +0800
Subject: [PATCH] fix(form):  fix `suffix` slot style
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

修复suffix插槽的样式问题
---
 .../Form/src/components/FormAction.vue        | 70 ++++++++++---------
 .../Form/src/components/FormItem.vue          |  6 +-
 2 files changed, 39 insertions(+), 37 deletions(-)

diff --git a/src/components/Form/src/components/FormAction.vue b/src/components/Form/src/components/FormAction.vue
index 1666dfe8..60d84e7f 100644
--- a/src/components/Form/src/components/FormAction.vue
+++ b/src/components/Form/src/components/FormAction.vue
@@ -1,40 +1,42 @@
 <template>
   <a-col v-bind="actionColOpt" :style="{ textAlign: 'right' }" v-if="showActionButtonGroup">
-    <FormItem>
-      <slot name="resetBefore"></slot>
-      <Button
-        type="default"
-        class="mr-2"
-        v-bind="getResetBtnOptions"
-        @click="resetAction"
-        v-if="showResetButton"
-      >
-        {{ getResetBtnOptions.text }}
-      </Button>
-      <slot name="submitBefore"></slot>
+    <div style="width: 100%; text-align: right">
+      <FormItem>
+        <slot name="resetBefore"></slot>
+        <Button
+          type="default"
+          class="mr-2"
+          v-bind="getResetBtnOptions"
+          @click="resetAction"
+          v-if="showResetButton"
+        >
+          {{ getResetBtnOptions.text }}
+        </Button>
+        <slot name="submitBefore"></slot>
 
-      <Button
-        type="primary"
-        class="mr-2"
-        v-bind="getSubmitBtnOptions"
-        @click="submitAction"
-        v-if="showSubmitButton"
-      >
-        {{ getSubmitBtnOptions.text }}
-      </Button>
+        <Button
+          type="primary"
+          class="mr-2"
+          v-bind="getSubmitBtnOptions"
+          @click="submitAction"
+          v-if="showSubmitButton"
+        >
+          {{ getSubmitBtnOptions.text }}
+        </Button>
 
-      <slot name="advanceBefore"></slot>
-      <Button
-        type="link"
-        size="small"
-        @click="toggleAdvanced"
-        v-if="showAdvancedButton && !hideAdvanceBtn"
-      >
-        {{ isAdvanced ? t('component.form.putAway') : t('component.form.unfold') }}
-        <BasicArrow class="ml-1" :expand="!isAdvanced" up />
-      </Button>
-      <slot name="advanceAfter"></slot>
-    </FormItem>
+        <slot name="advanceBefore"></slot>
+        <Button
+          type="link"
+          size="small"
+          @click="toggleAdvanced"
+          v-if="showAdvancedButton && !hideAdvanceBtn"
+        >
+          {{ isAdvanced ? t('component.form.putAway') : t('component.form.unfold') }}
+          <BasicArrow class="ml-1" :expand="!isAdvanced" up />
+        </Button>
+        <slot name="advanceAfter"></slot>
+      </FormItem>
+    </div>
   </a-col>
 </template>
 <script lang="ts">
@@ -43,7 +45,7 @@
   import { defineComponent, computed, PropType } from 'vue';
   import { Form, Col } from 'ant-design-vue';
   import { Button, ButtonProps } from '/@/components/Button';
-  import { BasicArrow } from '/@/components/Basic/index';
+  import { BasicArrow } from '/@/components/Basic';
   import { useFormContext } from '../hooks/useFormContext';
   import { useI18n } from '/@/hooks/web/useI18n';
   import { propTypes } from '/@/utils/propTypes';
diff --git a/src/components/Form/src/components/FormItem.vue b/src/components/Form/src/components/FormItem.vue
index c8adf9e3..92359542 100644
--- a/src/components/Form/src/components/FormItem.vue
+++ b/src/components/Form/src/components/FormItem.vue
@@ -326,10 +326,10 @@
             labelCol={labelCol}
             wrapperCol={wrapperCol}
           >
-            <>
-              {getContent()}
+            <div style="display:flex">
+              <div style="flex:1">{getContent()}</div>
               {showSuffix && <span class="suffix">{getSuffix}</span>}
-            </>
+            </div>
           </Form.Item>
         );
       }