fmui-base 2.3.74 → 2.3.75

package/README.md

@@ -3,6 +3,7 @@
 ---npm publish
 
 ## 更新日志 
+- 2.3.75：移动端表单能支持自定义上下边距
 - 2.3.74：移动端流程办理支持流程办理人增加由所选活动指定办理人员
 - 2.3.73：移动端流程表单增加退回后重新提交前的批示意见在表单下方显示
 - 2.3.72：移动端表单设置自定义样式时图标乱码问题

package/lib/form/form.js

@@ -601,8 +601,10 @@ var PageHome = function (_React$Component) {
       var formStyle = t.props.formStyle; //统一样式
       var subStyle = form.itemStyle; //每个样式
 
-      var style = { contentStyle: {}, titleStyle: {} };
+      var style = { contentStyle: {}, titleStyle: {}, fieldPadding: 18 };
       if (formStyle != null && formStyle != '' && formStyle != undefined) {
+        // 表单级控件上下内边距（默认18，最大24）
+        style.fieldPadding = this.normalizeFieldPadding(formStyle.fieldPadding);
         if (formStyle.contentStyle != null && formStyle.contentStyle != '' && formStyle.contentStyle != undefined) {
           if (formStyle.contentStyle.color != null && formStyle.contentStyle.color != undefined) {
             style.contentStyle.color = formStyle.contentStyle.color;
@@ -2108,6 +2110,34 @@ var PageHome = function (_React$Component) {
       return !!(styleObj.fontFamily || styleObj.fontSize || styleObj.color || styleObj.fontWeight || styleObj.fontStyle);
     }
 
+    /** 控件上下内边距：默认 18，最大 24 */
+
+  }, {
+    key: 'normalizeFieldPadding',
+    value: function normalizeFieldPadding(val) {
+      var n = parseInt(val, 10);
+      if (isNaN(n)) {
+        n = 18;
+      }
+      if (n < 0) {
+        n = 0;
+      }
+      if (n > 24) {
+        n = 24;
+      }
+      return n;
+    }
+
+    /** 覆盖标签/内容区上下内边距，左右 padding 保持原样式 */
+
+  }, {
+    key: 'buildFieldPaddingCss',
+    value: function buildFieldPaddingCss(scope, formStyleObj) {
+      var padding = this.normalizeFieldPadding(formStyleObj && formStyleObj.fieldPadding);
+      var px = padding + 'px';
+      return [[scope + ' .t-field-layout-h-label', scope + ' .t-field-layout-v-label', scope + ' .t-field-layout-v-label-left'].join(',') + '{padding-top:' + px + ' !important;padding-bottom:' + px + ' !important;}', [scope + ' .t-field .t-field-layout-h-label+.t-field-multi', scope + ' .t-field-layout-h-label+.t-field-multi'].join(',') + '{padding-top:' + px + ' !important;padding-bottom:' + px + ' !important;}'].join('');
+    }
+
     // 组装 CSS 声明；important=true 用于压过 SaltUI 固定字号
     // options.skipFontFamily：避免字段字体覆盖 iconfont 图标
 
@@ -2172,6 +2202,7 @@ var PageHome = function (_React$Component) {
       var cssParts = [];
       var subColumnCount = parseInt(this.props.subColumnCount, 10);
       var isSubFormMultiCol = this.props.dataType === 'sub' && !isNaN(subColumnCount) && subColumnCount > 1;
+      cssParts.push(this.buildFieldPaddingCss(scope, formStyleObj));
 
       if (this.hasFormStyleProps(ts)) {
         var labelCss = this.buildFormCssDecls(ts, { important: true, withLineHeight: true });

package/lib/form/table.js

@@ -479,6 +479,34 @@ var PageHome = function (_React$Component) {
 			}
 			return !!(styleObj.fontFamily || styleObj.fontSize || styleObj.color || styleObj.fontWeight || styleObj.fontStyle);
 		}
+
+		/** 控件上下内边距：默认 18，最大 24 */
+
+	}, {
+		key: 'normalizeFieldPadding',
+		value: function normalizeFieldPadding(val) {
+			var n = parseInt(val, 10);
+			if (isNaN(n)) {
+				n = 18;
+			}
+			if (n < 0) {
+				n = 0;
+			}
+			if (n > 24) {
+				n = 24;
+			}
+			return n;
+		}
+
+		/** 覆盖标签/内容区上下内边距，左右 padding 保持原样式 */
+
+	}, {
+		key: 'buildFieldPaddingCss',
+		value: function buildFieldPaddingCss(scope, formStyleObj) {
+			var padding = this.normalizeFieldPadding(formStyleObj && formStyleObj.fieldPadding);
+			var px = padding + 'px';
+			return [[scope + ' .t-field-layout-h-label', scope + ' .t-field-layout-v-label', scope + ' .t-field-layout-v-label-left'].join(',') + '{padding-top:' + px + ' !important;padding-bottom:' + px + ' !important;}', [scope + ' .t-field .t-field-layout-h-label+.t-field-multi', scope + ' .t-field-layout-h-label+.t-field-multi'].join(',') + '{padding-top:' + px + ' !important;padding-bottom:' + px + ' !important;}'].join('');
+		}
 	}, {
 		key: 'buildFormCssDecls',
 		value: function buildFormCssDecls(styleObj, options) {
@@ -541,6 +569,7 @@ var PageHome = function (_React$Component) {
 			var cs = formStyleObj.contentStyle || {};
 			var scope = '.fmui-form-style-root';
 			var cssParts = [];
+			cssParts.push(this.buildFieldPaddingCss(scope, formStyleObj));
 			if (this.hasFormStyleProps(ts)) {
 				var labelCss = this.buildFormCssDecls(ts, { important: true, withLineHeight: true });
 				var fontSizeNum = parseInt(ts.fontSize, 10);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fmui-base",
-  "version": "2.3.74",
+  "version": "2.3.75",
   "title": "fmui-base",
   "description": "fmui移动端组件",
   "main": "lib/index.js",