@lemon-fe/components 0.1.46 → 0.1.52

package/es/BaseTable/index.js

@@ -1,5 +1,5 @@
 var _excluded = ["onWidthChange", "width", "fullTableRef", "children", "className"],
-    _excluded2 = ["id", "columns", "defaultColumnProps", "rowKey", "children", "summaryTitle", "summaryRecord", "dataSource", "onSortChange", "sort", "scroll", "virtual", "components", "pagination", "rowHeight", "tableLayout", "rowActions", "style"];
+    _excluded2 = ["id", "columns", "defaultColumnProps", "rowKey", "children", "summaryTitle", "summaryRecord", "dataSource", "onSortChange", "sort", "scroll", "virtual", "components", "pagination", "rowHeight", "tableLayout", "rowActions", "style", "locale"];
 
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 
@@ -34,7 +34,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 /// <reference path="../../typings.d.ts" />
-import React, { useMemo, useState, useEffect, useRef, useLayoutEffect } from 'react';
+import React, { useMemo, useState, useEffect, useRef } from 'react';
 import { Table as AntdTable } from 'antd';
 import { get } from 'lodash';
 import ResizeObserver from 'rc-resize-observer';
@@ -121,6 +121,7 @@ function BaseTable(props) {
       tableLayout = _props$tableLayout === void 0 ? 'fixed' : _props$tableLayout,
       rowActions = props.rowActions,
       style = props.style,
+      localeProp = props.locale,
       restProps = _objectWithoutProperties(props, _excluded2);
 
   var fullTableRef = useRef(null);
@@ -204,8 +205,8 @@ function BaseTable(props) {
     hasPagination = paginationProp !== undefined && !!paginationProp.total || dataSource.length > 0;
   }
 
-  useLayoutEffect(function () {
-    setScrollY(calcScrollY() || undefined);
+  useEffect(function () {
+    setScrollY(calcScrollY() || 0);
   }, [hasPagination]);
   useEffect(function () {
     if (scrollYProp !== true) {
@@ -416,13 +417,13 @@ function BaseTable(props) {
     style: scrollYProp === true ? _objectSpread(_objectSpread({}, style), {}, {
       height: '100%'
     }) : style,
-    locale: {
+    locale: _objectSpread({
       emptyText: /*#__PURE__*/React.createElement("div", {
         className: "".concat(PREFIX_CLS, "-table-empty")
       }, /*#__PURE__*/React.createElement("img", {
         src: empty
       }), /*#__PURE__*/React.createElement("div", null, "\u6682\u65E0\u6570\u636E"))
-    }
+    }, localeProp)
   }, restProps), {}, {
     pagination: paginationProp !== false ? _objectSpread({
       size: 'small',
@@ -439,7 +440,7 @@ function BaseTable(props) {
   if (scrollYProp === true) {
     tableNode = /*#__PURE__*/React.createElement(ResizeObserver, {
       onResize: function onResize(size) {
-        return changeScrollY(size.height);
+        changeScrollY(size.height);
       }
     }, tableNode);
   }

package/es/BaseTable/index.less

@@ -172,9 +172,9 @@
     text-align: center;
 
     & > img {
-      display: block;
       width: 120px;
       height: 120px;
+      vertical-align: top;
     }
   }
 }

package/es/Filter/index.js

@@ -172,39 +172,18 @@ function Filter(props) {
       width = _useState12[0],
       setWidth = _useState12[1];
 
-  var _useState13 = useState(false),
+  var _useState13 = useState(true),
       _useState14 = _slicedToArray(_useState13, 2),
       collapsed = _useState14[0],
       setCollapsed = _useState14[1];
 
-  var _useRequest = useRequest( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
-    var tabsData;
-    return regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            if (storageKey) {
-              _context.next = 2;
-              break;
-            }
-
-            return _context.abrupt("return", null);
-
-          case 2:
-            _context.next = 4;
-            return getStorageData(storageKey);
-
-          case 4:
-            tabsData = _context.sent;
-            return _context.abrupt("return", tabsData);
+  var _useRequest = useRequest(function () {
+    if (!storageKey) {
+      return null;
+    }
 
-          case 6:
-          case "end":
-            return _context.stop();
-        }
-      }
-    }, _callee);
-  })), {
+    return getStorageData(storageKey);
+  }, {
     loadingState: false,
     onSuccess: function onSuccess(res) {
       if (res !== null) {
@@ -236,8 +215,8 @@ function Filter(props) {
     onValuesChange === null || onValuesChange === void 0 ? void 0 : onValuesChange(changedValues, allValues, form);
   };
 
-  var handleSave = function handleSave(_ref2) {
-    var title = _ref2.name;
+  var handleSave = function handleSave(_ref) {
+    var title = _ref.name;
     var index = tabs.findIndex(function (item) {
       return item.title === title;
     });
@@ -266,36 +245,36 @@ function Filter(props) {
   };
 
   var handleOk = /*#__PURE__*/function () {
-    var _ref3 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
       var values;
-      return regeneratorRuntime.wrap(function _callee2$(_context2) {
+      return regeneratorRuntime.wrap(function _callee$(_context) {
         while (1) {
-          switch (_context2.prev = _context2.next) {
+          switch (_context.prev = _context.next) {
             case 0:
-              _context2.prev = 0;
-              _context2.next = 3;
+              _context.prev = 0;
+              _context.next = 3;
               return modalForm.validateFields();
 
             case 3:
-              values = _context2.sent;
+              values = _context.sent;
               handleSave(values);
-              _context2.next = 9;
+              _context.next = 9;
               break;
 
             case 7:
-              _context2.prev = 7;
-              _context2.t0 = _context2["catch"](0);
+              _context.prev = 7;
+              _context.t0 = _context["catch"](0);
 
             case 9:
             case "end":
-              return _context2.stop();
+              return _context.stop();
           }
         }
-      }, _callee2, null, [[0, 7]]);
+      }, _callee, null, [[0, 7]]);
     }));
 
     return function handleOk() {
-      return _ref3.apply(this, arguments);
+      return _ref2.apply(this, arguments);
     };
   }();
 
@@ -574,18 +553,48 @@ function Filter(props) {
     style: {
       visibility: showCollapse ? 'visible' : 'hidden'
     },
-    className: "".concat(prefixCls, "-btn"),
     onClick: function onClick() {
       return setCollapsed(function (prev) {
         return !prev;
       });
     },
-    icon: /*#__PURE__*/React.createElement(Icons.CollapseUp, {
-      style: {
-        transform: collapsed ? 'rotateX(180deg)' : undefined
-      }
-    })
-  })))))));
+    type: "link",
+    className: "".concat(prefixCls, "-collapse")
+  }, collapsed ? '高级搜索' : '收起搜索', /*#__PURE__*/React.createElement("svg", {
+    width: "10",
+    height: "10",
+    viewBox: "0 0 10 10",
+    xmlns: "http://www.w3.org/2000/svg",
+    xmlnsXlink: "http://www.w3.org/1999/xlink",
+    style: collapsed ? {
+      transform: 'rotate(180deg)'
+    } : undefined
+  }, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("path", {
+    id: "a",
+    d: "M0 0h10v10H0z"
+  })), /*#__PURE__*/React.createElement("g", {
+    transform: "matrix(1 0 0 -1 0 10)",
+    fill: "none",
+    fillRule: "evenodd"
+  }, /*#__PURE__*/React.createElement("mask", {
+    id: "b",
+    fill: "#fff"
+  }, /*#__PURE__*/React.createElement("use", {
+    xlinkHref: "#a",
+    transform: "rotate(-90 5 5)"
+  })), /*#__PURE__*/React.createElement("use", {
+    fillOpacity: "0",
+    fill: "#C4C4C4",
+    transform: "rotate(-90 5 5)",
+    xlinkHref: "#a"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M2.172 1.757 5 4.586l2.828-2.829M2.172 5.757 5 8.586l2.828-2.829",
+    stroke: "currentColor",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeDasharray: "0,0",
+    mask: "url(#b)"
+  }))))))))));
 }
 
 Filter.setComponents = setComponents;

package/es/Filter/index.less

@@ -1,6 +1,10 @@
 .@{prefixCls}-filter {
   &-tab-bar {
-    margin-bottom: 16px;
+    margin-bottom: 12px;
+
+    .@{prefixCls}-tab-bar-item {
+      padding: 8px 12px;
+    }
   }
 
   &-btn {
@@ -13,9 +17,19 @@
     }
   }
 
+  &-collapse {
+    padding: 4px 0;
+    font-size: 12px;
+    line-height: 1;
+
+    & > svg {
+      vertical-align: -1px;
+    }
+  }
+
   &-btns {
     display: flex;
-    margin-bottom: 16px;
+    margin-bottom: 8px;
     padding: 0 8px;
   }
 
@@ -52,5 +66,5 @@
 }
 
 .@{prefixCls}-section-body > .@{prefixCls}-filter:not(.@{prefixCls}-filter-simple):first-child {
-  margin-top: -16px;
+  margin-top: -12px;
 }

package/es/FormLayout/index.less

@@ -1,8 +1,9 @@
 @import '../theme.less';
 
 @spaceX: 16px;
-@spaceY: 16px;
-@minWidth: 300px;
+@spaceY: 8px;
+@minWidth: 350px;
+@maxWidth: 94px + 422px;
 
 .wrapper() {
   margin-right: (-@spaceX / 2);
@@ -20,14 +21,15 @@
   flex-wrap: nowrap;
   width: percentage((@colSpan / 24));
   min-width: if((@colSpan >= 12), 2 * @minWidth, @minWidth);
+  max-width: if((@colSpan >= 12), 2 * @maxWidth, @maxWidth);
   padding: 0 (@spaceX / 2);
 }
 
 .@{prefixCls}-form {
   &-layout {
     .ant-form-item {
-      margin-bottom: @spaceY;
       flex-wrap: nowrap;
+      margin-bottom: @spaceY;
 
       &-label {
         flex: 0 0 94px;
@@ -88,5 +90,6 @@
   &-layout-flex > div > .ant-form-item,
   &-layout-flex &-col {
     width: 100%;
+    max-width: 100%;
   }
 }

package/es/Layout/index.less

@@ -7,7 +7,7 @@
   background: #f2f2f2;
 
   &-header {
-    padding: @space 0;
+    padding: 8px 0;
     background-color: #f2f2f2;
   }
 
@@ -16,7 +16,7 @@
     min-height: 0;
 
     &:first-child {
-      margin-top: @space;
+      margin-top: 8px;
     }
   }
 

package/es/Section/index.less

@@ -3,7 +3,7 @@
 .@{prefixCls}-section {
   position: relative;
   width: 100%;
-  padding: @space;
+  padding: 12px 16px;
   color: #333;
 
   & + & {
@@ -24,8 +24,7 @@
   &-header {
     display: flex;
     align-items: flex-end;
-    margin-bottom: @space;
-    padding: 8px 0;
+    margin-bottom: 12px;
   }
 
   &-title {

package/es/SiderTree/index.less

@@ -1,5 +1,5 @@
 @indentWidth: 18px;
-@treeNodeHeight: 40px;
+@treeNodeHeight: 36px;
 
 .@{prefixCls}-tree {
   &-wrapper {

package/es/Table/index.js

@@ -30,6 +30,8 @@ import React, { useMemo, useState, useImperativeHandle, useEffect } from 'react'
 import { useRequest } from '@lemon-fe/hooks';
 import BaseTable from '../BaseTable';
 import { isSortValue } from './utils';
+import empty from '../BaseTable/empty.png';
+import { PREFIX_CLS } from '../constants';
 export default function Table(props) {
   var _props$dataSource = props.dataSource,
       dataSource = _props$dataSource === void 0 ? [] : _props$dataSource,
@@ -115,16 +117,19 @@ export default function Table(props) {
         onLoading(false);
       }
 
-      setRemote(res.result);
+      setRemote(_objectSpread(_objectSpread({}, res.result), {}, {
+        error: undefined
+      }));
     },
-    onError: function onError() {
+    onError: function onError(error) {
       if (onLoading) {
         onLoading(false);
       }
 
       setRemote({
         data: [],
-        total: 0
+        total: 0,
+        error: error
       });
     }
   }),
@@ -215,6 +220,13 @@ export default function Table(props) {
         });
       }
     },
+    locale: remote.error ? {
+      emptyText: /*#__PURE__*/React.createElement("div", {
+        className: "".concat(PREFIX_CLS, "-table-empty")
+      }, /*#__PURE__*/React.createElement("img", {
+        src: empty
+      }), /*#__PURE__*/React.createElement("div", null, remote.error.message))
+    } : undefined,
     pagination: {
       current: current,
       pageSize: pageSize,

package/es/utils.less

@@ -62,8 +62,10 @@
   height: 100%;
 
   & > .ant-tabs-nav {
+    margin-bottom: 12px;
+
     .ant-tabs-tab {
-      padding: 12px 12px 14px;
+      padding: 8px 12px;
 
       &.ant-tabs-tab-active .ant-tabs-tab-btn {
         text-shadow: unset;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lemon-fe/components",
-  "version": "0.1.46",
+  "version": "0.1.52",
   "description": "> TODO: description",
   "author": "鲁盛杰 <lusj@cnlemon.net>",
   "homepage": "",
@@ -41,5 +41,5 @@
     "react": "^17.0.2",
     "react-dom": "^17.0.2"
   },
-  "gitHead": "e040d5b608a4786e7c3fd7e335f15cc57f4152cf"
+  "gitHead": "68713e81d8cf4c82bae68564ae4c2e70c4a8cc27"
 }