easy3wmui 0.0.42-beta2 → 0.0.42-beta21

package/lib/Easy3wMGridPage/index.js

@@ -2,6 +2,10 @@
 
 exports.__esModule = true;
 
+var _button = require('antd-mobile/es/components/button');
+
+var _button2 = _interopRequireDefault(_button);
+
 var _extends2 = require('babel-runtime/helpers/extends');
 
 var _extends3 = _interopRequireDefault(_extends2);
@@ -26,6 +30,10 @@ var _numeral = require('numeral');
 
 var _numeral2 = _interopRequireDefault(_numeral);
 
+var _antdMobile = require('antd-mobile');
+
+var _antdMobileIcons = require('antd-mobile-icons');
+
 var _easy3wmui = require('easy3wmui');
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
@@ -41,254 +49,284 @@ var Panel = _easy3wmui.Easy3wMCollapse.Panel;
 var Item = _easy3wmui.Easy3wMList.Item;
 
 var Easy3wMGridPage = function (_Component) {
-	(0, _inherits3['default'])(Easy3wMGridPage, _Component);
-
-	function Easy3wMGridPage(props) {
-		(0, _classCallCheck3['default'])(this, Easy3wMGridPage);
-
-		var _this = (0, _possibleConstructorReturn3['default'])(this, _Component.call(this, props));
-
-		_this.onChange = function (current) {
-			_this.setState({
-				currentIndex: current
-			});
-		};
-
-		_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 = (0, _numeral2['default'])(dataItem[fieldId]).format('0,0.00');
-					value = thousandthValue;
-				}
-				return value;
-			} else {
-				// value值不存在
-				return '';
-			}
-		};
-
-		_this.renderEasy3wMGridPage = function (dataList) {
-			var currentIndex = _this.state.currentIndex;
-			var _this$props = _this.props,
-			    _this$props$panelProp = _this$props.panelProps,
-			    panelProps = _this$props$panelProp === undefined ? {} : _this$props$panelProp,
-			    _this$props$listProps = _this$props.listProps,
-			    listProps = _this$props$listProps === undefined ? {} : _this$props$listProps,
-			    _this$props$itemProps = _this$props.itemProps,
-			    itemProps = _this$props$itemProps === undefined ? {} : _this$props$itemProps,
-			    _this$props$columns = _this$props.columns,
-			    columns = _this$props$columns === undefined ? [] : _this$props$columns,
-			    panelTitle = _this$props.panelTitle,
-			    panelKey = _this$props.panelKey,
-			    _this$props$expandedR = _this$props.expandedRowRender,
-			    expandedRowRender = _this$props$expandedR === undefined ? function () {} : _this$props$expandedR,
-			    collapseFlag = _this$props.collapseFlag;
-			// collapseProps 折叠面板容器参数
-			// panelProps 折叠面板参数
-			// emptyProps 空状态参数
-			// stepperProps 步进器参数
-			// listProps 列表参数
-			// itemProps 列表项参数
-			// columns 字段列表
-			// dataList 列表数据
-			// totalResult 列表记录数量
-			// panelTitle panel标题 数据类型：string或function
-			// panelKey panel唯一标识 数据类型：string或function
-			// expandedRowRender 可扩展行
-
-			if (collapseFlag) {
-				return dataList.map(function (item, index) {
-					var title = typeof panelTitle === 'function' ? panelTitle(item, index) : item[panelTitle] || '';
-					var key = typeof panelKey === 'function' ? panelKey(item, index) : item[panelKey] || index;
-					return (// 折叠面板
-						_react2['default'].createElement(
-							Panel,
-							(0, _extends3['default'])({}, panelProps, { title: title, key: key }),
-							_this.renderEasy3wMGridPageItem(item, index)
-						)
-					);
-				});
-			} else {
-				return _this.renderEasy3wMGridPageItem(dataList[currentIndex - 1], currentIndex - 1);
-			}
-		};
-
-		_this.renderEasy3wMGridPageItem = function (dataItem, index) {
-			var children = dataItem.children;
-			var _this$props2 = _this.props,
-			    _this$props2$panelPro = _this$props2.panelProps,
-			    panelProps = _this$props2$panelPro === undefined ? {} : _this$props2$panelPro,
-			    _this$props2$listProp = _this$props2.listProps,
-			    listProps = _this$props2$listProp === undefined ? {} : _this$props2$listProp,
-			    _this$props2$itemProp = _this$props2.itemProps,
-			    itemProps = _this$props2$itemProp === undefined ? {} : _this$props2$itemProp,
-			    _this$props2$columns = _this$props2.columns,
-			    columns = _this$props2$columns === undefined ? [] : _this$props2$columns,
-			    panelTitle = _this$props2.panelTitle,
-			    panelKey = _this$props2.panelKey,
-			    _this$props2$expanded = _this$props2.expandedRowRender,
-			    expandedRowRender = _this$props2$expanded === undefined ? function () {} : _this$props2$expanded;
-			// collapseProps 折叠面板容器参数
-			// panelProps 折叠面板参数
-			// emptyProps 空状态参数
-			// stepperProps 步进器参数
-			// listProps 列表参数
-			// itemProps 列表项参数
-			// columns 字段列表
-			// dataList 列表数据
-			// totalResult 列表记录数量
-			// panelTitle panel标题
-			// panelKey panel唯一标识
-			// expandedRowRender 可扩展行
-
-			return (// 单项数据
-				_react2['default'].createElement(
-					_easy3wmui.Easy3wMList,
-					listProps,
-					columns.map(function (column) {
-						if (column.children) {
-							return _react2['default'].createElement(
-								_easy3wmui.Easy3wMList,
-								(0, _extends3['default'])({ mode: 'card' }, listProps, { header: column.title }),
-								column.children.map(function (childrenColumn) {
-									var type = childrenColumn.type;
-
-									var childrenFieldId = childrenColumn.dataIndex || childrenColumn.key;
-									var childrenExtra = childrenColumn.render ? childrenColumn.render(dataItem[childrenFieldId], dataItem, index) : _this.touchFormatData(dataItem, childrenColumn);
-									if (type === 'longText') {
-										return _react2['default'].createElement(Item, (0, _extends3['default'])({ className: 'e3wmLongText' }, itemProps, { title: childrenColumn.title, description: childrenExtra }));
-									} else {
-										return _react2['default'].createElement(Item, (0, _extends3['default'])({}, itemProps, { title: childrenColumn.title, extra: childrenExtra }));
-									}
-								})
-							);
-						} else {
-							var title = column.title,
-							    key = column.key,
-							    dataIndex = column.dataIndex,
-							    type = column.type;
-
-							var fieldId = dataIndex || key;
-							var extra = column.render ? column.render(dataItem[fieldId], dataItem, index) : _this.touchFormatData(dataItem, column);
-							if (type === 'longText') {
-								return _react2['default'].createElement(Item, (0, _extends3['default'])({ className: 'e3wmLongText' }, itemProps, { title: title, description: extra }));
-							} else {
-								return _react2['default'].createElement(Item, (0, _extends3['default'])({}, itemProps, { title: title, extra: extra }));
-							}
-						}
-					}),
-					children ? _this.renderEasy3wMGridPage(children) : '',
-					expandedRowRender ? expandedRowRender(dataItem) : ''
-				)
-			);
-		};
-
-		_this.state = {
-			currentIndex: 1 // 当前显示内容数据的索引
-		};
-		return _this;
-	}
-
-	Easy3wMGridPage.prototype.componentWillUnmount = function componentWillUnmount() {};
-	// 切换行数据
-
-	// 数据格式化
-
-	// 渲染列表
-
-	// 渲染列表单项
-
-
-	Easy3wMGridPage.prototype.render = function render() {
-		var _props = this.props,
-		    _props$collapseProps = _props.collapseProps,
-		    collapseProps = _props$collapseProps === undefined ? {} : _props$collapseProps,
-		    _props$emptyProps = _props.emptyProps,
-		    emptyProps = _props$emptyProps === undefined ? {} : _props$emptyProps,
-		    _props$panelProps = _props.panelProps,
-		    panelProps = _props$panelProps === undefined ? {} : _props$panelProps,
-		    _props$stepperProps = _props.stepperProps,
-		    stepperProps = _props$stepperProps === undefined ? {} : _props$stepperProps,
-		    _props$dataList = _props.dataList,
-		    dataList = _props$dataList === undefined ? [] : _props$dataList,
-		    totalResult = _props.totalResult,
-		    collapseFlag = _props.collapseFlag;
-		// collapseProps 折叠面板容器参数
-		// panelProps 折叠面板参数
-		// emptyProps 空状态参数
-		// stepperProps 步进器参数
-		// listProps 列表参数
-		// itemProps 列表项参数
-		// columns 字段列表
-		// dataList 列表数据
-		// totalResult 列表记录数量
-		// panelTitle panel标题
-		// panelKey panel唯一标识
-		// collapseFlag 是否折叠面板 true 是 false 否
-
-		var currentIndex = this.state.currentIndex;
-
-		return _react2['default'].createElement(
-			'div',
-			{ id: 'Easy3wMGridPage' },
-			dataList && dataList.length ? _react2['default'].createElement(
-				'div',
-				null,
-				collapseFlag ? _react2['default'].createElement(
-					_easy3wmui.Easy3wMCollapse,
-					collapseProps,
-					this.renderEasy3wMGridPage(dataList)
-				) : _react2['default'].createElement(
-					'div',
-					null,
-					this.renderEasy3wMGridPage(dataList)
-				)
-			) : // 空状态
-			_react2['default'].createElement(
-				_easy3wmui.Easy3wMCard,
-				null,
-				_react2['default'].createElement(_easy3wmui.Easy3wMEmpty, (0, _extends3['default'])({}, emptyProps, { description: emptyProps.description || '暂无数据' }))
-			),
-			dataList && dataList.length && !collapseFlag ? _react2['default'].createElement(
-				_easy3wmui.Easy3wMCard,
-				null,
-				_react2['default'].createElement(
-					'div',
-					{ className: 'easy3wMGridPageStepper' },
-					_react2['default'].createElement(
-						_easy3wmui.Easy3wMSpace,
-						null,
-						_react2['default'].createElement(
-							'span',
-							null,
-							'\u5171',
-							dataList.length,
-							'\u6761'
-						),
-						_react2['default'].createElement(_easy3wmui.Easy3wMStepper, (0, _extends3['default'])({}, stepperProps, {
-							step: 1 // 每次改变步数，可以为小数
-							, digits: 0 // 格式化到小数点后固定位数，设置为 0 表示格式化到整数
-							, min: 1 // 最小值
-							, max: dataList.length // 最大值
-							, inputReadOnly: true // 输入框是否只读
-							, onChange: this.onChange // 变化时的回调
-							, value: currentIndex // 当前数，受控值
-						}))
-					)
-				)
-			) : null
-		);
-	};
-
-	return Easy3wMGridPage;
+  (0, _inherits3['default'])(Easy3wMGridPage, _Component);
+
+  function Easy3wMGridPage(props) {
+    (0, _classCallCheck3['default'])(this, Easy3wMGridPage);
+
+    var _this = (0, _possibleConstructorReturn3['default'])(this, _Component.call(this, props));
+
+    _initialiseProps.call(_this);
+
+    var collapseFlag = _this.props.collapseFlag;
+
+    _this.state = {
+      // 分页信息 折叠面板形式每页10条，非折叠面板每页1条
+      offset: 1, // 当前分页
+      limit: collapseFlag ? 10 : 1 // 每页条数
+      // paginationInfo: { // 分页
+      //   offset: 1,
+      //   limit: 10,
+      // },
+    };
+    return _this;
+  }
+
+  Easy3wMGridPage.prototype.componentWillUnmount = function componentWillUnmount() {};
+  // --------------------------------------------- 分页 start ---------------------------------------------
+  // 切换页数
+
+  // 触发查询
+
+  // --------------------------------------------- 分页 end -----------------------------------------------
+  // 数据格式化
+
+  // 渲染列表
+
+  // 渲染列表单项
+
+
+  Easy3wMGridPage.prototype.render = function render() {
+    var _this2 = this;
+
+    var _props = this.props,
+        _props$collapseProps = _props.collapseProps,
+        collapseProps = _props$collapseProps === undefined ? {} : _props$collapseProps,
+        _props$emptyProps = _props.emptyProps,
+        emptyProps = _props$emptyProps === undefined ? {} : _props$emptyProps,
+        _props$dataList = _props.dataList,
+        dataList = _props$dataList === undefined ? [] : _props$dataList,
+        collapseFlag = _props.collapseFlag,
+        needPaginationFlag = _props.needPaginationFlag;
+    var totalResult = this.props.totalResult;
+
+    if (totalResult) {
+      // 有总数就使用总数，无总数直接使用数组长度
+    } else if (dataList && dataList.length) {
+      totalResult = dataList.length;
+    }
+    // collapseProps 折叠面板容器参数
+    // panelProps 折叠面板参数
+    // emptyProps 空状态参数
+    // stepperProps 步进器参数
+    // listProps 列表参数
+    // itemProps 列表项参数
+    // columns 字段列表
+    // dataList 列表数据
+    // totalResult 列表记录数量
+    // panelTitle panel标题
+    // panelKey panel唯一标识
+    // collapseFlag 是否折叠面板 true 是 false 否
+    var _state = this.state,
+        offset = _state.offset,
+        limit = _state.limit;
+
+    return _react2['default'].createElement(
+      'div',
+      { id: 'Easy3wMGridPage' },
+      dataList && dataList.length ? _react2['default'].createElement(
+        'div',
+        null,
+        collapseFlag ? _react2['default'].createElement(
+          _easy3wmui.Easy3wMCollapse,
+          collapseProps,
+          this.renderEasy3wMGridPage(dataList)
+        ) : _react2['default'].createElement(
+          'div',
+          null,
+          this.renderEasy3wMGridPage(dataList)
+        )
+      ) : // 空状态
+      _react2['default'].createElement(
+        _easy3wmui.Easy3wMCard,
+        null,
+        _react2['default'].createElement(_easy3wmui.Easy3wMEmpty, (0, _extends3['default'])({}, emptyProps, { description: emptyProps.description || '暂无数据' }))
+      ),
+      totalResult && !collapseFlag || collapseFlag && needPaginationFlag && totalResult ? _react2['default'].createElement(
+        'div',
+        { className: 'easy3wMGridPageStepper' },
+        _react2['default'].createElement(
+          _button2['default'],
+          { color: 'default', fill: 'none', onClick: function onClick() {
+              return _this2.onChange('minus');
+            }, disabled: offset === 1 },
+          _react2['default'].createElement(_antdMobileIcons.LeftOutline, null)
+        ),
+        _react2['default'].createElement(
+          'span',
+          null,
+          offset,
+          '/',
+          Math.ceil(totalResult / limit),
+          '  \u5171',
+          totalResult,
+          '\u6761'
+        ),
+        _react2['default'].createElement(
+          _button2['default'],
+          { color: 'default', fill: 'none', onClick: function onClick() {
+              return _this2.onChange('add');
+            }, disabled: offset === Math.ceil(totalResult / limit) },
+          _react2['default'].createElement(_antdMobileIcons.RightOutline, null)
+        )
+      ) : ''
+    );
+  };
+
+  return Easy3wMGridPage;
 }(_react.Component);
 
+var _initialiseProps = function _initialiseProps() {
+  var _this3 = this;
+
+  this.onChange = function (operationType) {
+    var offset = _this3.state.offset;
+
+    if (operationType === 'minus') {
+      offset -= 1;
+    } else if (operationType === 'add') {
+      offset += 1;
+    }
+    _this3.setState({
+      offset: offset // 当前页
+    }, _this3.touchSearch);
+  };
+
+  this.touchSearch = function () {
+    var handleSearch = _this3.props.handleSearch;
+    var _state2 = _this3.state,
+        offset = _state2.offset,
+        limit = _state2.limit;
+
+    if (handleSearch && typeof handleSearch === 'function') {
+      handleSearch({ offset: offset, limit: limit });
+    }
+  };
+
+  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 = (0, _numeral2['default'])(dataItem[fieldId]).format('0,0.00');
+        value = thousandthValue;
+      }
+      return value;
+    } else {
+      // value值不存在
+      return '';
+    }
+  };
+
+  this.renderEasy3wMGridPage = function (dataList) {
+    var offset = _this3.state.offset;
+    var _props2 = _this3.props,
+        _props2$panelProps = _props2.panelProps,
+        panelProps = _props2$panelProps === undefined ? {} : _props2$panelProps,
+        panelTitle = _props2.panelTitle,
+        panelKey = _props2.panelKey,
+        collapseFlag = _props2.collapseFlag;
+    // collapseProps 折叠面板容器参数
+    // panelProps 折叠面板参数
+    // emptyProps 空状态参数
+    // stepperProps 步进器参数
+    // listProps 列表参数
+    // itemProps 列表项参数
+    // columns 字段列表
+    // dataList 列表数据
+    // totalResult 列表记录数量
+    // panelTitle panel标题 数据类型：string或function
+    // panelKey panel唯一标识 数据类型：string或function
+    // expandedRowRender 可扩展行
+
+    if (collapseFlag) {
+      return dataList.map(function (item, index) {
+        var title = typeof panelTitle === 'function' ? panelTitle(item, index) : item[panelTitle] || '';
+        var key = typeof panelKey === 'function' ? panelKey(item, index) : item[panelKey] || index;
+        return (// 折叠面板
+          _react2['default'].createElement(
+            Panel,
+            (0, _extends3['default'])({}, panelProps, { title: title, key: key }),
+            _this3.renderEasy3wMGridPageItem(item, index)
+          )
+        );
+      });
+    } else {
+      return _this3.renderEasy3wMGridPageItem(dataList[offset - 1], offset - 1);
+    }
+  };
+
+  this.renderEasy3wMGridPageItem = function (dataItem, index) {
+    var children = dataItem.children;
+    var _props3 = _this3.props,
+        _props3$listProps = _props3.listProps,
+        listProps = _props3$listProps === undefined ? {} : _props3$listProps,
+        _props3$itemProps = _props3.itemProps,
+        itemProps = _props3$itemProps === undefined ? {} : _props3$itemProps,
+        _props3$columns = _props3.columns,
+        columns = _props3$columns === undefined ? [] : _props3$columns,
+        _props3$expandedRowRe = _props3.expandedRowRender,
+        expandedRowRender = _props3$expandedRowRe === undefined ? function () {} : _props3$expandedRowRe;
+    // collapseProps 折叠面板容器参数
+    // panelProps 折叠面板参数
+    // emptyProps 空状态参数
+    // stepperProps 步进器参数
+    // listProps 列表参数
+    // itemProps 列表项参数
+    // columns 字段列表
+    // dataList 列表数据
+    // totalResult 列表记录数量
+    // panelTitle panel标题
+    // panelKey panel唯一标识
+    // expandedRowRender 可扩展行
+
+    return (// 单项数据
+      _react2['default'].createElement(
+        _easy3wmui.Easy3wMList,
+        listProps,
+        columns.map(function (column) {
+          if (column.children) {
+            return _react2['default'].createElement(
+              _easy3wmui.Easy3wMList,
+              (0, _extends3['default'])({ mode: 'card' }, listProps, { header: column.title }),
+              column.children.map(function (childrenColumn) {
+                var type = childrenColumn.type;
+
+                var childrenFieldId = childrenColumn.dataIndex || childrenColumn.key;
+                var childrenExtra = childrenColumn.render ? childrenColumn.render(dataItem[childrenFieldId], dataItem, index) : _this3.touchFormatData(dataItem, childrenColumn);
+                if (type === 'longText') {
+                  return _react2['default'].createElement(Item, (0, _extends3['default'])({ className: 'e3wmLongText' }, itemProps, { title: childrenColumn.title, description: childrenExtra }));
+                } else {
+                  return _react2['default'].createElement(Item, (0, _extends3['default'])({}, itemProps, { title: childrenColumn.title, extra: childrenExtra }));
+                }
+              })
+            );
+          } else {
+            var title = column.title,
+                key = column.key,
+                dataIndex = column.dataIndex,
+                type = column.type;
+
+            var fieldId = dataIndex || key;
+            var extra = column.render ? column.render(dataItem[fieldId], dataItem, index) : _this3.touchFormatData(dataItem, column);
+            if (type === 'longText') {
+              return _react2['default'].createElement(Item, (0, _extends3['default'])({ className: 'e3wmLongText' }, itemProps, { title: title, description: extra }));
+            } else {
+              return _react2['default'].createElement(Item, (0, _extends3['default'])({}, itemProps, { title: title, extra: extra }));
+            }
+          }
+        }),
+        children ? _this3.renderEasy3wMGridPage(children) : '',
+        expandedRowRender ? expandedRowRender(dataItem) : ''
+      )
+    );
+  };
+};
+
 exports['default'] = Easy3wMGridPage;
 module.exports = exports['default'];

package/lib/Easy3wMGridPage/index.less

@@ -1,7 +1,7 @@
 #Easy3wMGridPage {
-	.easy3wMGridPageStepper {
-		display: flex;
-		flex-direction: column;
-		align-items: flex-end;
-	}
+  .easy3wMGridPageStepper {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-end;
+  }
 }

package/lib/Easy3wMInsideLayout/index.js

@@ -80,7 +80,8 @@ var Easy3wMInsideLayout = function (_Component) {
         includeCopyRightFlag = _props.includeCopyRightFlag,
         links = _props.links,
         copyrightContent = _props.copyrightContent,
-        routeDataLayout = _props.routeDataLayout;
+        routeDataLayout = _props.routeDataLayout,
+        bottomFixed = _props.bottomFixed;
 
     var hadHaederFlag = includeHeaderFlag !== '0';
     var copyRightFlag = includeCopyRightFlag !== '0';
@@ -120,6 +121,7 @@ var Easy3wMInsideLayout = function (_Component) {
         )
       ),
       copyRightFlag ? _react2['default'].createElement(_Easy3wMGlobalFooter2['default'], {
+        bottomFixed: bottomFixed,
         links: links,
         copyright: copyright
       }) : ''