canrd-outside / order-erp-front · Commits

Commit a9bbed19739376ab2bf67a14b04e872f14ca84cc

Authored by 无木
1 parent 0595a72d

fix(form): fix `suffix` slot style 

修复suffix插槽的样式问题
Inline Side-by-side
Showing 2 changed files with 39 additions and 37 deletions
src/components/Form/src/components/FormAction.vue
  View file @a9bbed1
1 <template> 1 <template>
2 <a-col v-bind="actionColOpt" :style="{ textAlign: 'right' }" v-if="showActionButtonGroup"> 2 <a-col v-bind="actionColOpt" :style="{ textAlign: 'right' }" v-if="showActionButtonGroup">
3 - <FormItem>  
4 - <slot name="resetBefore"></slot>  
5 - <Button  
6 - type="default"  
7 - class="mr-2"  
8 - v-bind="getResetBtnOptions"  
9 - @click="resetAction"  
10 - v-if="showResetButton"  
11 - >  
12 - {{ getResetBtnOptions.text }}  
13 - </Button>  
14 - <slot name="submitBefore"></slot> 3 + <div style="width: 100%; text-align: right">
  4 + <FormItem>
  5 + <slot name="resetBefore"></slot>
  6 + <Button
  7 + type="default"
  8 + class="mr-2"
  9 + v-bind="getResetBtnOptions"
  10 + @click="resetAction"
  11 + v-if="showResetButton"
  12 + >
  13 + {{ getResetBtnOptions.text }}
  14 + </Button>
  15 + <slot name="submitBefore"></slot>
15 16
16 - <Button  
17 - type="primary"  
18 - class="mr-2"  
19 - v-bind="getSubmitBtnOptions"  
20 - @click="submitAction"  
21 - v-if="showSubmitButton"  
22 - >  
23 - {{ getSubmitBtnOptions.text }}  
24 - </Button> 17 + <Button
  18 + type="primary"
  19 + class="mr-2"
  20 + v-bind="getSubmitBtnOptions"
  21 + @click="submitAction"
  22 + v-if="showSubmitButton"
  23 + >
  24 + {{ getSubmitBtnOptions.text }}
  25 + </Button>
25 26
26 - <slot name="advanceBefore"></slot>  
27 - <Button  
28 - type="link"  
29 - size="small"  
30 - @click="toggleAdvanced"  
31 - v-if="showAdvancedButton && !hideAdvanceBtn"  
32 - >  
33 - {{ isAdvanced ? t('component.form.putAway') : t('component.form.unfold') }}  
34 - <BasicArrow class="ml-1" :expand="!isAdvanced" up />  
35 - </Button>  
36 - <slot name="advanceAfter"></slot>  
37 - </FormItem> 27 + <slot name="advanceBefore"></slot>
  28 + <Button
  29 + type="link"
  30 + size="small"
  31 + @click="toggleAdvanced"
  32 + v-if="showAdvancedButton && !hideAdvanceBtn"
  33 + >
  34 + {{ isAdvanced ? t('component.form.putAway') : t('component.form.unfold') }}
  35 + <BasicArrow class="ml-1" :expand="!isAdvanced" up />
  36 + </Button>
  37 + <slot name="advanceAfter"></slot>
  38 + </FormItem>
  39 + </div>
38 </a-col> 40 </a-col>
39 </template> 41 </template>
40 <script lang="ts"> 42 <script lang="ts">
@@ -43,7 +45,7 @@ @@ -43,7 +45,7 @@
43 import { defineComponent, computed, PropType } from 'vue'; 45 import { defineComponent, computed, PropType } from 'vue';
44 import { Form, Col } from 'ant-design-vue'; 46 import { Form, Col } from 'ant-design-vue';
45 import { Button, ButtonProps } from '/@/components/Button'; 47 import { Button, ButtonProps } from '/@/components/Button';
46 - import { BasicArrow } from '/@/components/Basic/index'; 48 + import { BasicArrow } from '/@/components/Basic';
47 import { useFormContext } from '../hooks/useFormContext'; 49 import { useFormContext } from '../hooks/useFormContext';
48 import { useI18n } from '/@/hooks/web/useI18n'; 50 import { useI18n } from '/@/hooks/web/useI18n';
49 import { propTypes } from '/@/utils/propTypes'; 51 import { propTypes } from '/@/utils/propTypes';
src/components/Form/src/components/FormItem.vue
  View file @a9bbed1
@@ -326,10 +326,10 @@ @@ -326,10 +326,10 @@
326 labelCol={labelCol} 326 labelCol={labelCol}
327 wrapperCol={wrapperCol} 327 wrapperCol={wrapperCol}
328 > 328 >
329 - <>  
330 - {getContent()} 329 + <div style="display:flex">
  330 + <div style="flex:1">{getContent()}</div>
331 {showSuffix && <span class="suffix">{getSuffix}</span>} 331 {showSuffix && <span class="suffix">{getSuffix}</span>}
332 - </> 332 + </div>
333 </Form.Item> 333 </Form.Item>
334 ); 334 );
335 } 335 }