fix(Dialog): could custom margin-bottom when no footer fix alibaba-fusion#3799 (alibaba-fusion#3809)

Author: guoyunhe

docs/dialog/theme/index.jsx

@@ -54,6 +54,17 @@ class FunctionDemo extends Component {
                     value: 'false'
                 }]
             },
+            footer: {
+                label: '按钮',
+                value: 'true',
+                enum: [{
+                    label: '显示',
+                    value: 'true'
+                }, {
+                    label: '隐藏',
+                    value: 'false'
+                }]
+            },
             footerAlign: {
                 label: '按钮对齐方式',
                 value: 'right',
@@ -102,6 +113,7 @@ class FunctionDemo extends Component {
         const locale = (lang === 'en-us' ? enUS : zhCN).Dialog;
         const hasTitle = this.state.demoFunction.hasTitle.value === 'true';
         const hasMask = this.state.demoFunction.hasMask.value === 'true';
+        const footer = this.state.demoFunction.footer.value === 'true';
         const footerAlign = this.state.demoFunction.footerAlign.value;
         const okIsLeft = this.state.demoFunction.okPosition.value === 'left';
         const style = hasMask ?
@@ -111,6 +123,7 @@ class FunctionDemo extends Component {
             <Dialog.Inner
                 style={style}
                 title={hasTitle ? i18n.title : null}
+                footer={footer}
                 footerAlign={footerAlign}
                 footerActions={okIsLeft ? ['ok', 'cancel'] : ['cancel', 'ok']}
                 locale={locale}>
@@ -122,6 +135,7 @@ class FunctionDemo extends Component {
             <Dialog.Inner
                 className="next-dialog-quick"
                 style={style}
+                footer={footer}
                 footerAlign={footerAlign}
                 footerActions={okIsLeft ? ['ok', 'cancel'] : ['cancel', 'ok']}
                 locale={locale}>
@@ -137,6 +151,7 @@ class FunctionDemo extends Component {
             <Dialog.Inner
                 className="next-dialog-quick"
                 style={style}
+                footer={footer}
                 footerAlign={footerAlign}
                 footerActions={okIsLeft ? ['ok', 'cancel'] : ['cancel', 'ok']}
                 locale={locale}>

src/dialog/inner.jsx

@@ -109,10 +109,15 @@ export default class Inner extends Component {
     }
 
     renderBody() {
-        const { prefix, children } = this.props;
+        const { prefix, children, footer } = this.props;
         if (children) {
             return (
-                <div className={`${prefix}dialog-body`} ref={this.getNode.bind(this, 'bodyNode')}>
+                <div
+                    className={cx(`${prefix}dialog-body`, {
+                        [`${prefix}dialog-body-no-footer`]: footer === false
+                    })}
+                    ref={this.getNode.bind(this, 'bodyNode')}
+                >
                     {children}
                 </div>
             );

src/dialog/main.scss

@@ -30,6 +30,10 @@
         color: $dialog-content-color;
     }
 
+    &-body-no-footer {
+        margin-bottom: $dialog-content-margin-bottom-no-footer;
+    }
+
     /* 让用户自己设置 */
     /* &.#{$css-prefix}closeable &-header, */
     /* &.#{$css-prefix}closeable &-body, { */
@@ -164,6 +168,9 @@
         #{$dialog-prefix}-header + #{$dialog-prefix}-body {
             padding: $dialog-content-padding-top $dialog-content-padding-left-right $dialog-content-padding-bottom $dialog-content-padding-left-right;
         }
+        #{$dialog-prefix}-header + #{$dialog-prefix}-body-no-footer {
+            margin-bottom: $dialog-content-margin-bottom-no-footer;
+        }
     }
 
     &#{$dialog-prefix}-v2 {

src/dialog/scss/variable.scss

@@ -60,6 +60,9 @@ $dialog-content-padding-bottom: $s-5 !default;
 /// padding (l, r)
 /// @namespace size/content
 $dialog-content-padding-left-right: $s-5 !default;
+/// margin (b) no footer
+/// @namespace size/content
+$dialog-content-margin-bottom-no-footer: $s-0 !default;
 /// divider
 /// @namespace size/footer
 $dialog-footer-border-width: $line-zero !default;