easy3wui 2.0.13 → 2.0.16

package/assets/index.css

@@ -1455,7 +1455,7 @@ s {
 #Easy3wMButton {
   background: #fff;
 }
-#Easy3wMButton :global .adm-space-item {
+#Easy3wMButton .adm-space-item {
   -ms-flex-positive: 1;
       flex-grow: 1;
 }
@@ -1500,7 +1500,7 @@ s {
   bottom: 0;
   left: 0;
   right: 0;
-  z-index: 999;
+  z-index: 9999;
 }
 #Easy3wMSpin .spinLoading {
   position: relative;
@@ -1518,5 +1518,5 @@ s {
   padding: 40px 0 0 0;
 }
 #Easy3wMCard .adm-card-header-title {
-  --adm-font-size-7: 14;
+  --adm-font-size-7: 14px;
 }

package/assets/mButton.css

@@ -1,7 +1,7 @@
 #Easy3wMButton {
   background: #fff;
 }
-#Easy3wMButton :global .adm-space-item {
+#Easy3wMButton .adm-space-item {
   -ms-flex-positive: 1;
       flex-grow: 1;
 }

package/assets/mCard.css

@@ -1,3 +1,3 @@
 #Easy3wMCard .adm-card-header-title {
-  --adm-font-size-7: 14;
+  --adm-font-size-7: 14px;
 }

package/assets/mFormPage.css

@@ -0,0 +1,44 @@
+#Easy3wMFormPage .pointer {
+  cursor: pointer;
+}
+#Easy3wMFormPage .pointerGray {
+  cursor: pointer;
+  color: #999;
+}
+#Easy3wMFormPage .adm-input-element {
+  border: 1px solid #d9d9d9;
+}
+#Easy3wMFormPage .adm-input-element:focus,
+#Easy3wMFormPage .adm-input-element:hover {
+  border-color: var(--adm-color-primary);
+}
+#Easy3wMFormPage .adm-text-area-element {
+  border: 1px solid #d9d9d9;
+}
+#Easy3wMFormPage .adm-text-area-element:focus,
+#Easy3wMFormPage .adm-text-area-element:hover {
+  border-color: var(--adm-color-primary);
+}
+#Easy3wMFormPage .adm-rate {
+  --star-size: 14px;
+}
+#Easy3wMFormPage .adm-radio,
+#Easy3wMFormPage .adm-checkbox {
+  --icon-size: 14px;
+  --font-size: 14px;
+}
+#Easy3wMFormPage .adm-switch {
+  --height: 20.8px;
+}
+#Easy3wMFormPage .adm-slider {
+  padding: 0;
+}
+#Easy3wMFormPage .adm-list-item {
+  border-top: var(--border-top);
+  margin: 0 12px;
+  padding-left: 0;
+}
+#Easy3wMFormPage .adm-list-item-content {
+  border-top: 0;
+  padding-right: 0;
+}

package/assets/mGridPage.css

@@ -0,0 +1,6 @@
+#Easy3wMGridPage .adm-list-item {
+  padding-left: 0;
+}
+#Easy3wMGridPage .adm-list-item .adm-list-item-content {
+  padding-right: 0;
+}

package/assets/mSpin.css

@@ -5,7 +5,7 @@
   bottom: 0;
   left: 0;
   right: 0;
-  z-index: 999;
+  z-index: 9999;
 }
 #Easy3wMSpin .spinLoading {
   position: relative;

package/lib/Easy3wMButton/index.less

@@ -1,7 +1,5 @@
 #Easy3wMButton {
-	:global {
-		.adm-space-item {
-			flex-grow: 1;
-		}
+	.adm-space-item {
+		flex-grow: 1;
 	}
 }

package/lib/Easy3wMFormPage/index.js

@@ -24,10 +24,29 @@ var _react2 = _interopRequireDefault(_react);
 
 var _antdMobile = require('antd-mobile');
 
+var _moment = require('moment');
+
+var _moment2 = _interopRequireDefault(_moment);
+
+var _numeral = require('numeral');
+
+var _numeral2 = _interopRequireDefault(_numeral);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
 
 var Item = _antdMobile.Form.Item;
 
+var dateYearFormat = 'YYYY'; // 精度：年 2022
+var dateMonthFormat = 'YYYY-MM'; // 精度：月 2022-07
+var dateDayFormat = 'YYYY-MM-DD'; // 精度：日 2022-07-15
+var dateHourFormat = 'YYYY-MM-DD HH'; // 精度：小时 2022-07-15 08
+var dateMinuteFormat = 'YYYY-MM-DD HH:mm'; // 精度：分 2022-07-15 08:00
+var dateSecondFormat = 'YYYY-MM-DD HH:mm:ss'; // 精度：秒 2022-07-15 08:00:00
+var dateWeekFormat = 'YYYY-ww'; // 精度：周 2022-28
+var dateWeekDayFormat = 'YYYY-ww-dddd'; // 精度：周-星期 2022-28-星期五
+var dateWeekZHCNFormat = 'YYYY年ww周'; // 精度：周 2022-28
+var dateWeekDayZHCNFormat = 'YYYY年ww周dddd'; // 精度：周-星期 2022-28-星期五
+
 var Easy3wMFormPage = function (_Component) {
 	(0, _inherits3['default'])(Easy3wMFormPage, _Component);
 
@@ -36,20 +55,148 @@ var Easy3wMFormPage = function (_Component) {
 
 		var _this = (0, _possibleConstructorReturn3['default'])(this, _Component.call(this, props));
 
-		_this.renderItemChildren = function (item) {
+		_this.touchFormatData = function (item) {
 			var fieldType = item.fieldType,
-			    childrenProps = item.childrenProps,
+			    readFlag = item.readFlag,
+			    _item$childrenProps = item.childrenProps,
+			    childrenProps = _item$childrenProps === undefined ? {} : _item$childrenProps,
+			    numberFormat = item.numberFormat;
+			var value = item.value;
+			var precision = childrenProps.precision;
+
+			if (value || value === false || value === 0) {
+				// value值存在  Boolean()值为false的7个特殊值   undefined， null， false， NaN， ''， 0， -0
+				if (readFlag) {
+					// 只读
+					if (precision === 'year') {
+						// 时间：年
+						value = (0, _moment2['default'])(value).format(dateYearFormat);
+					} else if (precision === 'month') {
+						// 时间：月
+						value = (0, _moment2['default'])(value).format(dateMonthFormat);
+					} else if (precision === 'day') {
+						// 时间：天
+						value = (0, _moment2['default'])(value).format(dateDayFormat);
+					} else if (precision === 'hour') {
+						// 时间：时
+						value = (0, _moment2['default'])(value).format(dateHourFormat);
+					} else if (precision === 'minute') {
+						// 时间：分
+						value = (0, _moment2['default'])(value).format(dateMinuteFormat);
+					} else if (precision === 'second') {
+						// 时间：秒
+						value = (0, _moment2['default'])(value).format(dateSecondFormat);
+					} else if (precision === 'week') {
+						// 时间：周
+						value = (0, _moment2['default'])(value, dateWeekFormat).format(dateWeekZHCNFormat);
+					} else if (precision === 'week-day') {
+						// 时间：周-星期
+						value = (0, _moment2['default'])(value, dateWeekDayFormat).format(dateWeekDayZHCNFormat);
+					} else if (numberFormat) {
+						// 数字格式化千分位化
+						(0, _numeral2['default'])(value).format('0,0.00');
+					}
+				} else {
+					// 编辑
+					if (fieldType === 'datePicker' || fieldType === 'datePickerView') {
+						if (precision === 'week') {
+							// 时间：周
+							value = (0, _moment2['default'])(value, dateWeekFormat).format(dateDayFormat);
+						} else if (precision === 'week-day') {
+							// 时间：周-星期
+							value = (0, _moment2['default'])(value, dateWeekDayFormat).format(dateDayFormat);
+						}
+						value = new Date(value);
+					}
+				}
+				return value;
+			} else {
+				// value值不存在
+				return '';
+			}
+		};
+
+		_this.touchCascaderConfirm = function (value, fieldId) {
+			var _form$setFieldsValue;
+
+			var form = _this.props.form;
+
+			form.setFieldsValue((_form$setFieldsValue = {}, _form$setFieldsValue[fieldId] = value, _form$setFieldsValue));
+		};
+
+		_this.touchPickerConfirm = function (value, fieldId) {
+			var _form$setFieldsValue2;
+
+			var form = _this.props.form;
+
+			form.setFieldsValue((_form$setFieldsValue2 = {}, _form$setFieldsValue2[fieldId] = value, _form$setFieldsValue2));
+		};
+
+		_this.touchCascadePickerConfirm = function (value, fieldId) {
+			var _form$setFieldsValue3;
+
+			var form = _this.props.form;
+
+			form.setFieldsValue((_form$setFieldsValue3 = {}, _form$setFieldsValue3[fieldId] = value, _form$setFieldsValue3));
+		};
+
+		_this.touchDatePickerConfirm = function (value, fieldId) {
+			var _form$setFieldsValue4;
+
+			var form = _this.props.form;
+
+			form.setFieldsValue((_form$setFieldsValue4 = {}, _form$setFieldsValue4[fieldId] = value, _form$setFieldsValue4));
+		};
+
+		_this.renderItemChildren = function (item) {
+			var fieldId = item.fieldId,
+			    fieldType = item.fieldType,
+			    _item$childrenProps2 = item.childrenProps,
+			    childrenProps = _item$childrenProps2 === undefined ? {} : _item$childrenProps2,
 			    label = item.label,
 			    options = item.options,
 			    element = item.element;
 
 			if (fieldType === 'input') {
+				// 输入框
 				return _react2['default'].createElement(_antdMobile.Input, (0, _extends3['default'])({ placeholder: '\u8BF7\u8F93\u5165' + label }, childrenProps));
 			} else if (fieldType === 'cascaderView') {
+				// 都是单选，只有value
 				return _react2['default'].createElement(_antdMobile.CascaderView, childrenProps);
 			} else if (fieldType === 'cascader') {
-				return _react2['default'].createElement(_antdMobile.Cascader, childrenProps);
+				// 都是单选，只有value
+				return _react2['default'].createElement(
+					_antdMobile.Cascader,
+					(0, _extends3['default'])({
+						onConfirm: function onConfirm(value) {
+							return _this.touchCascaderConfirm(value, fieldId);
+						} // 确认时触发
+					}, childrenProps),
+					function (items, actions) {
+						var labelValue = '';
+						var arrLabelValue = [];
+						items.map(function (obj) {
+							arrLabelValue.push(obj.label);
+							return '';
+						});
+						labelValue = arrLabelValue.join('-');
+						if (labelValue) {
+							return _react2['default'].createElement(
+								'div',
+								{ className: 'pointer', onClick: actions.open },
+								labelValue
+							);
+						} else {
+							return _react2['default'].createElement(
+								'div',
+								{ className: 'pointerGray', onClick: actions.open },
+								'\u8BF7\u9009\u62E9'
+							);
+						}
+					}
+				);
 			} else if (fieldType === 'checkList') {
+				// 可单选可多选 multiple false(单选) true(多选)
 				return _react2['default'].createElement(
 					_antdMobile.CheckList,
 					childrenProps,
@@ -64,6 +211,7 @@ var Easy3wMFormPage = function (_Component) {
 					})
 				);
 			} else if (fieldType === 'checkbox') {
+				// 多选
 				return _react2['default'].createElement(
 					_antdMobile.Checkbox.Group,
 					childrenProps,
@@ -80,15 +228,96 @@ var Easy3wMFormPage = function (_Component) {
 			} else if (fieldType === 'pickerView') {
 				return _react2['default'].createElement(_antdMobile.PickerView, childrenProps);
 			} else if (fieldType === 'picker') {
-				return _react2['default'].createElement(_antdMobile.Picker, childrenProps);
+				return _react2['default'].createElement(
+					_antdMobile.Picker,
+					(0, _extends3['default'])({
+						onConfirm: function onConfirm(value) {
+							return _this.touchPickerConfirm(value, fieldId);
+						} // 确认时触发
+					}, childrenProps),
+					function (items, actions) {
+						var labelValue = '';
+						var arrLabelValue = [];
+						items.map(function (obj) {
+							arrLabelValue.push(obj.label);
+							return '';
+						});
+						labelValue = arrLabelValue.join('-');
+						if (labelValue) {
+							return _react2['default'].createElement(
+								'div',
+								{ className: 'pointer', onClick: actions.open },
+								labelValue
+							);
+						} else {
+							return _react2['default'].createElement(
+								'div',
+								{ className: 'pointerGray', onClick: actions.open },
+								'\u8BF7\u9009\u62E9'
+							);
+						}
+					}
+				);
 			} else if (fieldType === 'cascadePickerView') {
 				return _react2['default'].createElement(_antdMobile.CascadePickerView, childrenProps);
 			} else if (fieldType === 'cascadePicker') {
-				return _react2['default'].createElement(_antdMobile.CascadePicker, childrenProps);
+				return _react2['default'].createElement(
+					_antdMobile.CascadePicker,
+					(0, _extends3['default'])({
+						onConfirm: function onConfirm(value) {
+							return _this.touchCascadePickerConfirm(value, fieldId);
+						} // 确认时触发
+					}, childrenProps),
+					function (items, actions) {
+						var labelValue = '';
+						var arrLabelValue = [];
+						items.map(function (obj) {
+							arrLabelValue.push(obj.label);
+							return '';
+						});
+						labelValue = arrLabelValue.join('-');
+						if (labelValue) {
+							return _react2['default'].createElement(
+								'div',
+								{ className: 'pointer', onClick: actions.open },
+								labelValue
+							);
+						} else {
+							return _react2['default'].createElement(
+								'div',
+								{ className: 'pointerGray', onClick: actions.open },
+								'\u8BF7\u9009\u62E9'
+							);
+						}
+					}
+				);
 			} else if (fieldType === 'datePickerView') {
 				return _react2['default'].createElement(_antdMobile.DatePickerView, childrenProps);
 			} else if (fieldType === 'datePicker') {
-				return _react2['default'].createElement(_antdMobile.DatePicker, childrenProps);
+				return _react2['default'].createElement(
+					_antdMobile.DatePicker,
+					(0, _extends3['default'])({
+						onConfirm: function onConfirm(value) {
+							return _this.touchDatePickerConfirm(value, fieldId);
+						} // 确认时触发
+					}, childrenProps),
+					function (items, actions) {
+						var strValue = _this.touchFormatData((0, _extends3['default'])({}, item, { value: items, readFlag: true }));
+						if (items) {
+							return _react2['default'].createElement(
+								'div',
+								{ className: 'pointer', onClick: actions.open },
+								strValue
+							);
+						} else {
+							return _react2['default'].createElement(
+								'div',
+								{ className: 'pointerGray', onClick: actions.open },
+								'\u8BF7\u9009\u62E9'
+							);
+						}
+					}
+				);
 			} else if (fieldType === 'radio') {
 				return _react2['default'].createElement(
 					_antdMobile.Radio.Group,
@@ -106,15 +335,16 @@ var Easy3wMFormPage = function (_Component) {
 			} else if (fieldType === 'rate') {
 				return _react2['default'].createElement(_antdMobile.Rate, childrenProps);
 			} else if (fieldType === 'selector') {
+				// 可多选，可单选 multiple true(多选) flase(单选)
 				return _react2['default'].createElement(_antdMobile.Selector, childrenProps);
 			} else if (fieldType === 'slider') {
 				return _react2['default'].createElement(_antdMobile.Slider, childrenProps);
 			} else if (fieldType === 'stepper') {
 				return _react2['default'].createElement(_antdMobile.Stepper, childrenProps);
 			} else if (fieldType === 'switch') {
-				return _react2['default'].createElement(_antdMobile.Switch, childrenProps);
+				return _react2['default'].createElement(_antdMobile.Switch, (0, _extends3['default'])({ defaultChecked: item.value }, childrenProps));
 			} else if (fieldType === 'textArea') {
-				return _react2['default'].createElement(_antdMobile.TextArea, childrenProps);
+				return _react2['default'].createElement(_antdMobile.TextArea, (0, _extends3['default'])({ placeholder: '\u8BF7\u8F93\u5165' + label, showCount: true, maxLength: 50 }, childrenProps));
 			} else if (fieldType === 'else') {
 				return element;
 			}
@@ -125,6 +355,24 @@ var Easy3wMFormPage = function (_Component) {
 	}
 
 	Easy3wMFormPage.prototype.componentWillUnmount = function componentWillUnmount() {};
+	// 数据格式化
+
+	// ------------------------------------- Cascader start ------------------------------------------------------
+	// 确认时触发
+
+	// ------------------------------------- Cascader end --------------------------------------------------------
+	// ------------------------------------- Picker start ------------------------------------------------------
+	// 确认时触发
+
+	// ------------------------------------- Picker end --------------------------------------------------------
+	// ------------------------------------- CascadePicker start ------------------------------------------------------
+	// 确认时触发
+
+	// ------------------------------------- CascadePicker end --------------------------------------------------------
+	// ------------------------------------- DatePicker start ------------------------------------------------------
+	// 确认时触发
+
+	// ------------------------------------- DatePicker end --------------------------------------------------------
 	// 渲染item的子内容
 
 
@@ -142,21 +390,21 @@ var Easy3wMFormPage = function (_Component) {
 		    form = _props.form;
 		// fromProps 表单参数
 		// itemProps 表单项参数
+		// childrenProps 输入框参数
 		// rowItems 显示字段
 		// hiddenItems 隐藏字段
-		// <Easy3wFormPage rowItems={rowItems} form={form} hiddenItems={hiddenItems} mixColFlag />
 
 		return _react2['default'].createElement(
 			_antdMobile.Form,
-			(0, _extends3['default'])({ layout: 'horizontal', form: form }, formProps),
+			(0, _extends3['default'])({ id: 'Easy3wMFormPage', layout: 'horizontal', form: form }, formProps),
 			rowItems.map(function (item) {
 				var label = item.label,
 				    fieldId = item.fieldId,
-				    value = item.value,
 				    required = item.required,
 				    readFlag = item.readFlag,
 				    disableFlag = item.disableFlag,
 				    cmptPros = item.cmptPros;
+				var value = item.value;
 
 				var addrules = [{ required: required, message: requiredMessage || '\u8BF7\u586B\u5199' + label }];
 				if (cmptPros && cmptPros.rules) {
@@ -164,6 +412,7 @@ var Easy3wMFormPage = function (_Component) {
 
 					addrules.push.apply(addrules, rules);
 				}
+				value = _this2.touchFormatData(item);
 				if (readFlag) {
 					return _react2['default'].createElement(
 						Item,

package/lib/Easy3wMFormPage/index.less

@@ -0,0 +1,43 @@
+#Easy3wMFormPage {
+	.pointer { // 鼠标形状：手形
+		cursor: pointer;
+	}
+	.pointerGray { // 鼠标形状：手形 文字：灰色
+		cursor: pointer;
+		color: #999
+	}
+	.adm-input-element {
+		border: 1px solid #d9d9d9;
+	}
+	.adm-input-element:focus, .adm-input-element:hover {
+		border-color: var(--adm-color-primary);
+	}
+	.adm-text-area-element {
+		border: 1px solid #d9d9d9;
+	}
+	.adm-text-area-element:focus, .adm-text-area-element:hover {
+		border-color: var(--adm-color-primary);
+	}
+	.adm-rate {
+		--star-size: 14px
+	}
+	.adm-radio, .adm-checkbox {
+		--icon-size: 14px;
+		--font-size: 14px;
+	}
+	.adm-switch {
+		--height: 20.8px;
+	}
+	.adm-slider {
+		padding: 0;
+	}
+	.adm-list-item {
+		border-top: var(--border-top);
+		margin: 0 12px;
+		padding-left: 0;
+	}
+	.adm-list-item-content {
+		border-top: 0;
+		padding-right: 0;
+	}
+}

package/lib/Easy3wMGridPage/index.js

@@ -51,6 +51,26 @@ var Easy3wMGridPage = function (_Component) {
 
 		var _this = (0, _possibleConstructorReturn3['default'])(this, _Component.call(this, props));
 
+		_this.touchFormatData = function (dataItem, columnItem) {
+			var key = columnItem.key,
+			    dataIndex = columnItem.dataIndex,
+			    numberFormat = columnItem.numberFormat;
+
+			var fieldId = dataIndex || key;
+			var value = dataItem[fieldId];
+			if (value || value === false || value === 0) {
+				// value值存在  Boolean()值为false的7个特殊值   undefined， null， false， NaN， ''， 0， -0
+				if (numberFormat) {
+					var thousandthValue = numeral(dataItem[fieldId]).format('0,0.00');
+					value = thousandthValue;
+				}
+				return value;
+			} else {
+				// value值不存在
+				return '';
+			}
+		};
+
 		_this.renderEasy3wMGridPage = function (dataList) {
 			var _this$props = _this.props,
 			    _this$props$panelProp = _this$props.panelProps,
@@ -88,14 +108,14 @@ var Easy3wMGridPage = function (_Component) {
 							    dataIndex = column.dataIndex;
 
 							var fieldId = dataIndex || key;
-							var extra = column.render ? column.render(item[fieldId], item) : item[fieldId];
+							var extra = column.render ? column.render(item[fieldId], item) : _this.touchFormatData(item, column);
 							if (column.children) {
 								return _react2['default'].createElement(
 									_Easy3wMList2['default'],
 									(0, _extends3['default'])({}, listProps, { header: title }),
 									column.children.map(function (childrenColumn) {
-										var childrenFieldId = dataIndex || key;
-										var childrenExtra = childrenColumn.render ? childrenColumn.render(item[fieldId], item) : item[childrenFieldId];
+										var childrenFieldId = childrenColumn.dataIndex || childrenColumn.key;
+										var childrenExtra = childrenColumn.render ? childrenColumn.render(item[childrenFieldId], item) : _this.touchFormatData(item, childrenColumn);
 										// const {} = childrenItem;
 										return _react2['default'].createElement(
 											Item,
@@ -127,6 +147,8 @@ var Easy3wMGridPage = function (_Component) {
 	}
 
 	Easy3wMGridPage.prototype.componentWillUnmount = function componentWillUnmount() {};
+	// 数据格式化
+
 	// 渲染列表
 
 
@@ -156,7 +178,7 @@ var Easy3wMGridPage = function (_Component) {
 		// panelKey panel唯一标识
 		return _react2['default'].createElement(
 			'div',
-			null,
+			{ id: 'Easy3wMGridPage' },
 			_react2['default'].createElement(
 				_Easy3wMCollapse2['default'],
 				collapseProps,

package/lib/Easy3wMGridPage/index.less

@@ -0,0 +1,8 @@
+#Easy3wMGridPage {
+	.adm-list-item {
+		padding-left: 0;
+		.adm-list-item-content {
+			padding-right: 0;
+		}
+	}
+}

package/lib/Easy3wMSpin/index.less

@@ -5,7 +5,7 @@
 	bottom: 0;
 	left: 0;
 	right: 0;
-	z-index: 999;
+	z-index: 9999;
 	.spinLoading { // 内容
 		position: relative;
 		left: 50%;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "easy3wui",
-  "version": "2.0.13",
+  "version": "2.0.16",
   "description": "easy3wui components for react",
   "keywords": [
     "react",
@@ -95,7 +95,8 @@
     "roadhog-api-doc": "^1.0.3",
     "rollbar": "^2.3.1",
     "stylelint": "^8.1.0",
-    "stylelint-config-standard": "^17.0.0"
+    "stylelint-config-standard": "^17.0.0",
+    "sockjs-client": "1.1.5"
   },
   "pre-commit": [
     "lint"