fmui-base 2.3.70 → 2.3.72

package/README.md

@@ -3,6 +3,8 @@
 ---npm publish
 
 ## 更新日志 
+- 2.3.72：移动端表单设置自定义样式时图标乱码问题
+- 2.3.71：移动端办理列表缓急标签样式
 - 2.3.70：移动端支持表单的规则设置校验
 - 2.3.69：移动端批示意见字段落款支持表单上的自定义样式
 - 2.3.68：批示意见字段支持根据节点设置控制显示隐藏

package/lib/form/form.js

@@ -2109,6 +2109,7 @@ var PageHome = function (_React$Component) {
     }
 
     // 组装 CSS 声明；important=true 用于压过 SaltUI 固定字号
+    // options.skipFontFamily：避免字段字体覆盖 iconfont 图标
 
   }, {
     key: 'buildFormCssDecls',
@@ -2119,7 +2120,7 @@ var PageHome = function (_React$Component) {
       options = options || {};
       var important = options.important ? ' !important' : '';
       var parts = [];
-      if (styleObj.fontFamily) {
+      if (!options.skipFontFamily && styleObj.fontFamily) {
         parts.push("font-family:'" + styleObj.fontFamily + "'" + important);
       }
       if (!options.skipColor && styleObj.color) {
@@ -2143,6 +2144,15 @@ var PageHome = function (_React$Component) {
       return parts.join(';');
     }
 
+    // 字段样式注入后恢复图标字体，防止 font-family !important 导致 icon 乱码
+
+  }, {
+    key: 'buildIconFontRestoreCss',
+    value: function buildIconFontRestoreCss(scope) {
+      var base = '{font-style:normal !important;font-weight:normal !important;}';
+      return [[scope + ' .iconfont', scope + ' .iconfont:before', scope + ' .iconfont:after', scope + ' i.iconfont', scope + ' span.iconfont'].join(',') + '{font-family:"iconfont" !important;' + base.slice(1), [scope + ' .iconfont-ywtb', scope + ' .iconfont-ywtb:before', scope + ' .iconfont-ywtb:after'].join(',') + '{font-family:"iconfont-ywtb" !important;' + base.slice(1)].join('');
+    }
+
     // 字段名称+字段内容统一用 style 标签落地，避免各控件默认字号不一致、jQuery 被 React 冲掉
 
   }, {
@@ -2177,15 +2187,26 @@ var PageHome = function (_React$Component) {
       }
 
       if (this.hasFormStyleProps(cs)) {
+        // 普通文本内容：完整字体样式
         var contentCss = this.buildFormCssDecls(cs, { important: true, withLineHeight: true });
-        cssParts.push([scope + ' .t-text-field-input', scope + ' .t-text-field-content-main', scope + ' .t-text-field-content-main span', scope + ' .t-field-content-box > .t-FB1', scope + ' .t-field-content-box > .t-FB1 span', scope + ' .t-field-multi', scope + ' .t-field-multi span', scope + ' .t-select-field-value', scope + ' .t-select-field-value span', scope + ' .t-radio-field-value', scope + ' .t-radio-field-value span', scope + ' .t-radio-field-value .t-FB1', scope + ' .t-radio-field-value .t-omit', scope + ' .t-datetime-field-value', scope + ' .t-datetime-field-value span', scope + ' .t-textarea-field-content', scope + ' .t-textarea-field-content textarea', scope + ' .t-checkbox-field-content', scope + ' .t-checkbox-field-label', scope + ' .t-checkbox-field-value-list', scope + ' .t-checkbox-field-value-list span', scope + ' .dd-select-input-option-text', scope + ' .t-popuser-value', scope + ' .t-popuser-value span', scope + ' .t-popuser-placeholder', scope + ' .t-poppage-value', scope + ' .t-poppage-value span', scope + ' .t-poppage-placeholder',
+        // 含图标的选人/选页等：不写 font-family，避免盖住 iconfont
+        var contentCssNoFont = this.buildFormCssDecls(cs, { important: true, withLineHeight: true, skipFontFamily: true });
+        cssParts.push([scope + ' .t-text-field-input', scope + ' .t-text-field-content-main', scope + ' .t-text-field-content-main span:not(.iconfont)', scope + ' .t-field-content-box > .t-FB1', scope + ' .t-field-content-box > .t-FB1 span:not(.iconfont)', scope + ' .t-field-multi', scope + ' .t-field-multi span:not(.iconfont)', scope + ' .t-select-field-value', scope + ' .t-select-field-value span:not(.iconfont)', scope + ' .t-radio-field-value', scope + ' .t-radio-field-value span:not(.iconfont)', scope + ' .t-radio-field-value .t-FB1', scope + ' .t-radio-field-value .t-omit', scope + ' .t-datetime-field-value', scope + ' .t-datetime-field-value span:not(.iconfont)', scope + ' .t-textarea-field-content', scope + ' .t-textarea-field-content textarea', scope + ' .t-checkbox-field-content', scope + ' .t-checkbox-field-label', scope + ' .t-checkbox-field-value-list', scope + ' .t-checkbox-field-value-list span:not(.iconfont)', scope + ' .dd-select-input-option-text', scope + ' .t-popuser-placeholder', scope + ' .t-poppage-placeholder',
         // 月日自定义、意见、html 等非 SaltUI 标准内容节点
         scope + ' .t-FL', scope + ' .flex-comment .t-PT10', scope + ' .flex-comment .t-textarea-field-content',
         // 批示意见落款与内容字体颜色一致
-        scope + ' .comment-html', scope + ' .comment-html span', scope + ' .comment-content', scope + ' .ueditor-content', scope + ' .t-FB1.t-FAL', scope + ' .t-FB1.t-omit', scope + ' .t-omit', scope + ' .t-LH1_4', scope + ' .t-FS16', scope + ' .t-field-box.t-FS16', scope + ' .t-field-box.t-FS16 .t-FB1', scope + ' .section-content .t-FB1'].join(',') + '{' + contentCss + '}');
+        scope + ' .comment-html', scope + ' .comment-html span:not(.iconfont)', scope + ' .comment-content', scope + ' .ueditor-content', scope + ' .t-FB1.t-FAL', scope + ' .t-FB1.t-omit', scope + ' .t-omit', scope + ' .t-LH1_4', scope + ' .t-FS16', scope + ' .t-field-box.t-FS16', scope + ' .t-field-box.t-FS16 .t-FB1', scope + ' .section-content .t-FB1'].join(',') + '{' + contentCss + '}');
+
+        // 选人/选页标签：只同步颜色字号，不改 font-family
+        if (contentCssNoFont) {
+          cssParts.push([scope + ' .t-popuser-value', scope + ' .t-popuser-value span:not(.iconfont)', scope + ' .t-poppage-value', scope + ' .t-poppage-value span:not(.iconfont)'].join(',') + '{' + contentCssNoFont + '}');
+        }
 
         var placeholderCss = this.buildFormCssDecls(cs, { important: true, skipColor: true, withLineHeight: true });
         cssParts.push([scope + ' .t-text-field-placeholder', scope + ' .t-select-field-placeholder', scope + ' .t-datetime-field-placeholder', scope + ' .t-checkbox-field-placeholder'].join(',') + '{' + placeholderCss + '}');
+
+        // 兜底恢复图标字体
+        cssParts.push(this.buildIconFontRestoreCss(scope));
       }
 
       var styleEl = document.getElementById(styleId);

package/lib/form/table.js

@@ -488,7 +488,7 @@ var PageHome = function (_React$Component) {
 			options = options || {};
 			var important = options.important ? ' !important' : '';
 			var parts = [];
-			if (styleObj.fontFamily) {
+			if (!options.skipFontFamily && styleObj.fontFamily) {
 				parts.push("font-family:'" + styleObj.fontFamily + "'" + important);
 			}
 			if (!options.skipColor && styleObj.color) {
@@ -512,6 +512,15 @@ var PageHome = function (_React$Component) {
 			return parts.join(';');
 		}
 
+		// 字段样式注入后恢复图标字体，防止 font-family !important 导致 icon 乱码
+
+	}, {
+		key: 'buildIconFontRestoreCss',
+		value: function buildIconFontRestoreCss(scope) {
+			var base = '{font-style:normal !important;font-weight:normal !important;}';
+			return [[scope + ' .iconfont', scope + ' .iconfont:before', scope + ' .iconfont:after', scope + ' i.iconfont', scope + ' span.iconfont'].join(',') + '{font-family:"iconfont" !important;' + base.slice(1), [scope + ' .iconfont-ywtb', scope + ' .iconfont-ywtb:before', scope + ' .iconfont-ywtb:after'].join(',') + '{font-family:"iconfont-ywtb" !important;' + base.slice(1)].join('');
+		}
+
 		// 表单级统一样式：覆盖主表/子表/编辑/只读，避免依赖 fieldId class（UUID 数字开头选择器会失效）
 
 	}, {
@@ -542,13 +551,19 @@ var PageHome = function (_React$Component) {
 			}
 			if (this.hasFormStyleProps(cs)) {
 				var contentCss = this.buildFormCssDecls(cs, { important: true, withLineHeight: true });
-				cssParts.push([scope + ' .t-text-field-input', scope + ' .t-text-field-content-main', scope + ' .t-text-field-content-main span', scope + ' .t-field-content-box > .t-FB1', scope + ' .t-field-content-box > .t-FB1 span', scope + ' .t-field-multi', scope + ' .t-field-multi span', scope + ' .t-select-field-value', scope + ' .t-select-field-value span', scope + ' .t-radio-field-value', scope + ' .t-radio-field-value span', scope + ' .t-radio-field-value .t-FB1', scope + ' .t-radio-field-value .t-omit', scope + ' .t-datetime-field-value', scope + ' .t-datetime-field-value span', scope + ' .t-textarea-field-content', scope + ' .t-textarea-field-content textarea', scope + ' .t-checkbox-field-content', scope + ' .t-checkbox-field-label', scope + ' .t-checkbox-field-value-list', scope + ' .t-checkbox-field-value-list span', scope + ' .dd-select-input-option-text', scope + ' .t-popuser-value', scope + ' .t-popuser-value span', scope + ' .t-popuser-placeholder', scope + ' .t-poppage-value', scope + ' .t-poppage-value span', scope + ' .t-poppage-placeholder', scope + ' .t-FL', scope + ' .flex-comment .t-textarea-field-content', scope + ' .flex-comment .t-PT10',
+				var contentCssNoFont = this.buildFormCssDecls(cs, { important: true, withLineHeight: true, skipFontFamily: true });
+				cssParts.push([scope + ' .t-text-field-input', scope + ' .t-text-field-content-main', scope + ' .t-text-field-content-main span:not(.iconfont)', scope + ' .t-field-content-box > .t-FB1', scope + ' .t-field-content-box > .t-FB1 span:not(.iconfont)', scope + ' .t-field-multi', scope + ' .t-field-multi span:not(.iconfont)', scope + ' .t-select-field-value', scope + ' .t-select-field-value span:not(.iconfont)', scope + ' .t-radio-field-value', scope + ' .t-radio-field-value span:not(.iconfont)', scope + ' .t-radio-field-value .t-FB1', scope + ' .t-radio-field-value .t-omit', scope + ' .t-datetime-field-value', scope + ' .t-datetime-field-value span:not(.iconfont)', scope + ' .t-textarea-field-content', scope + ' .t-textarea-field-content textarea', scope + ' .t-checkbox-field-content', scope + ' .t-checkbox-field-label', scope + ' .t-checkbox-field-value-list', scope + ' .t-checkbox-field-value-list span:not(.iconfont)', scope + ' .dd-select-input-option-text', scope + ' .t-popuser-placeholder', scope + ' .t-poppage-placeholder', scope + ' .t-FL', scope + ' .flex-comment .t-textarea-field-content', scope + ' .flex-comment .t-PT10',
 				// 批示意见落款与内容字体颜色一致
-				scope + ' .comment-html', scope + ' .comment-html span', scope + ' .comment-content', scope + ' .ueditor-content',
+				scope + ' .comment-html', scope + ' .comment-html span:not(.iconfont)', scope + ' .comment-content', scope + ' .ueditor-content',
 				// 弹出选择/只读展示：常带 t-FS16 等工具类，需一并覆盖
 				scope + ' .t-FB1.t-FAL', scope + ' .t-FB1.t-omit', scope + ' .t-omit', scope + ' .t-LH1_4', scope + ' .t-FS16', scope + ' .t-field-box.t-FS16', scope + ' .t-field-box.t-FS16 .t-FB1', scope + ' .section-content .t-FB1'].join(',') + '{' + contentCss + '}');
+				// 选人/选页标签：只同步颜色字号，不改 font-family
+				if (contentCssNoFont) {
+					cssParts.push([scope + ' .t-popuser-value', scope + ' .t-popuser-value span:not(.iconfont)', scope + ' .t-poppage-value', scope + ' .t-poppage-value span:not(.iconfont)'].join(',') + '{' + contentCssNoFont + '}');
+				}
 				var placeholderCss = this.buildFormCssDecls(cs, { important: true, skipColor: true, withLineHeight: true });
 				cssParts.push([scope + ' .t-text-field-placeholder', scope + ' .t-select-field-placeholder', scope + ' .t-datetime-field-placeholder', scope + ' .t-checkbox-field-placeholder'].join(',') + '{' + placeholderCss + '}');
+				cssParts.push(this.buildIconFontRestoreCss(scope));
 			}
 			if (!styleEl) {
 				styleEl = document.createElement('style');

package/lib/msg_list/msgList.js

@@ -184,7 +184,25 @@ var ListItem = function (_React$Component) {
       }
     }
 
-    /** 办理缓急：文字/边框用配置色，背景同色透明度 0.1 */
+    /** 历史枚举未配 fieldColor 时的默认色（对齐原 label-primary/warn/danger） */
+
+  }, {
+    key: 'getDefaultUrgencyColor',
+    value: function getDefaultUrgencyColor(urgencyCode) {
+      var code = urgencyCode != null ? String(urgencyCode) : '';
+      if (code === '60') {
+        return '#5688ed';
+      }
+      if (code === '70') {
+        return '#ff802c';
+      }
+      if (code === '80' || code === '90') {
+        return '#ff3a39';
+      }
+      return '';
+    }
+
+    /** 办理缓急：文字/边框用配置色，背景同色透明度 0.12 */
 
   }, {
     key: 'buildUrgencyLabelStyle',
@@ -197,14 +215,14 @@ var ListItem = function (_React$Component) {
       var m;
       if (/^#([0-9a-fA-F]{3})$/.test(color)) {
         m = color.substring(1);
-        bg = 'rgba(' + parseInt(m.charAt(0) + m.charAt(0), 16) + ',' + parseInt(m.charAt(1) + m.charAt(1), 16) + ',' + parseInt(m.charAt(2) + m.charAt(2), 16) + ',0.1)';
+        bg = 'rgba(' + parseInt(m.charAt(0) + m.charAt(0), 16) + ',' + parseInt(m.charAt(1) + m.charAt(1), 16) + ',' + parseInt(m.charAt(2) + m.charAt(2), 16) + ',0.12)';
       } else if (/^#([0-9a-fA-F]{6})$/.test(color)) {
         m = color.substring(1);
-        bg = 'rgba(' + parseInt(m.substring(0, 2), 16) + ',' + parseInt(m.substring(2, 4), 16) + ',' + parseInt(m.substring(4, 6), 16) + ',0.1)';
+        bg = 'rgba(' + parseInt(m.substring(0, 2), 16) + ',' + parseInt(m.substring(2, 4), 16) + ',' + parseInt(m.substring(4, 6), 16) + ',0.12)';
       } else {
         m = color.match(/^rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/i);
         if (m) {
-          bg = 'rgba(' + m[1] + ',' + m[2] + ',' + m[3] + ',0.1)';
+          bg = 'rgba(' + m[1] + ',' + m[2] + ',' + m[3] + ',0.12)';
         }
       }
       if (!bg) {
@@ -224,21 +242,13 @@ var ListItem = function (_React$Component) {
         //待办
         checkIsNotComplete = true;
         // 枚举禁用时后端不回填 urgencyName，此时不渲染角标（避免空 label 色块）
-        // 有 fieldColor：文字/边框用配置色，背景同色透明；无配置时回退 60/70/80/90 样式
+        // 统一：文字/边框用色，背景同色透明；无 fieldColor 时用 60/70/80/90 默认色
         if (data.urgencyName) {
-          if (data.fieldColor) {
+          var urgencyColor = data.fieldColor || this.getDefaultUrgencyColor(data.urgency);
+          if (urgencyColor) {
             urgencyTag = true;
             tagClass = 'label';
-            urgencyStyle = this.buildUrgencyLabelStyle(data.fieldColor);
-          } else if (data.urgency == '90' || data.urgency == '80') {
-            urgencyTag = true;
-            tagClass = 'label label-danger';
-          } else if (data.urgency == '70') {
-            urgencyTag = true;
-            tagClass = 'label label-warn';
-          } else if (data.urgency == '60') {
-            urgencyTag = true;
-            tagClass = 'label label-primary';
+            urgencyStyle = this.buildUrgencyLabelStyle(urgencyColor);
           }
         }
       } else if (data.type == 1) {

package/lib/process_list/processList.js

@@ -379,7 +379,25 @@ var ListItem = function (_React$Component) {
       }
     }
 
-    /** 办理缓急：文字/边框用配置色，背景同色透明度 0.1 */
+    /** 历史枚举未配 fieldColor 时的默认色（对齐原 label-primary/warn/danger） */
+
+  }, {
+    key: 'getDefaultUrgencyColor',
+    value: function getDefaultUrgencyColor(urgencyCode) {
+      var code = urgencyCode != null ? String(urgencyCode) : '';
+      if (code === '60') {
+        return '#5688ed';
+      }
+      if (code === '70') {
+        return '#ff802c';
+      }
+      if (code === '80' || code === '90') {
+        return '#ff3a39';
+      }
+      return '';
+    }
+
+    /** 办理缓急：文字/边框用配置色，背景同色透明度 0.12 */
 
   }, {
     key: 'buildUrgencyLabelStyle',
@@ -392,14 +410,14 @@ var ListItem = function (_React$Component) {
       var m;
       if (/^#([0-9a-fA-F]{3})$/.test(color)) {
         m = color.substring(1);
-        bg = 'rgba(' + parseInt(m.charAt(0) + m.charAt(0), 16) + ',' + parseInt(m.charAt(1) + m.charAt(1), 16) + ',' + parseInt(m.charAt(2) + m.charAt(2), 16) + ',0.1)';
+        bg = 'rgba(' + parseInt(m.charAt(0) + m.charAt(0), 16) + ',' + parseInt(m.charAt(1) + m.charAt(1), 16) + ',' + parseInt(m.charAt(2) + m.charAt(2), 16) + ',0.12)';
       } else if (/^#([0-9a-fA-F]{6})$/.test(color)) {
         m = color.substring(1);
-        bg = 'rgba(' + parseInt(m.substring(0, 2), 16) + ',' + parseInt(m.substring(2, 4), 16) + ',' + parseInt(m.substring(4, 6), 16) + ',0.1)';
+        bg = 'rgba(' + parseInt(m.substring(0, 2), 16) + ',' + parseInt(m.substring(2, 4), 16) + ',' + parseInt(m.substring(4, 6), 16) + ',0.12)';
       } else {
         m = color.match(/^rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/i);
         if (m) {
-          bg = 'rgba(' + m[1] + ',' + m[2] + ',' + m[3] + ',0.1)';
+          bg = 'rgba(' + m[1] + ',' + m[2] + ',' + m[3] + ',0.12)';
         }
       }
       if (!bg) {
@@ -425,21 +443,13 @@ var ListItem = function (_React$Component) {
           checkIsNotComplete = true;
         }
         // 枚举禁用时后端不回填 urgencyName，此时不渲染角标（避免空 label 色块）
-        // 有 fieldColor：文字/边框用配置色，背景同色透明；无配置时回退 60/70/80/90 样式
+        // 统一：文字/边框用色，背景同色透明；无 fieldColor 时用 60/70/80/90 默认色（不再用无边框的 label-* 类）
         if (data.urgencyName) {
-          if (data.fieldColor) {
+          var urgencyColor = data.fieldColor || this.getDefaultUrgencyColor(data.urgency);
+          if (urgencyColor) {
             urgencyTag = true;
             tagClass = 'label';
-            urgencyStyle = this.buildUrgencyLabelStyle(data.fieldColor);
-          } else if (data.urgency == '90' || data.urgency == '80') {
-            urgencyTag = true;
-            tagClass = 'label label-danger';
-          } else if (data.urgency == '70') {
-            urgencyTag = true;
-            tagClass = 'label label-warn';
-          } else if (data.urgency == '60') {
-            urgencyTag = true;
-            tagClass = 'label label-primary';
+            urgencyStyle = this.buildUrgencyLabelStyle(urgencyColor);
           }
         }
       } else if (data.listTabType == 1) {

package/package.json

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