@lemon-fe/components 0.1.91 → 0.1.97

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -227,7 +227,7 @@ function Filter(props) {
227
227
 
228
228
  var tab = {
229
229
  title: title,
230
- value: form.getFieldsValue()
230
+ value: _objectSpread(_objectSpread({}, value), form.getFieldsValue())
231
231
  };
232
232
 
233
233
  if (index >= 0) {
@@ -398,7 +398,7 @@ function Filter(props) {
398
398
  var btnsWidth = simple ? 208 : 248;
399
399
  var btnsVisible = false;
400
400
  var size = 0;
401
- var end = result.length;
401
+ var end = 0;
402
402
 
403
403
  for (var i = 0; i < result.length; i++) {
404
404
  var _compMap$get;
@@ -408,20 +408,18 @@ function Filter(props) {
408
408
  size += itemWidth;
409
409
 
410
410
  if (size > width - btnsWidth) {
411
- end = i;
412
411
  btnsVisible = true;
413
412
  break;
414
413
  }
415
- }
416
414
 
417
- end = end || 1;
418
- btnsVisible = btnsVisible && result.length > 1;
415
+ end = i;
416
+ }
419
417
 
420
418
  if (!collapsed) {
421
419
  return [getSet(result), btnsVisible];
422
420
  }
423
421
 
424
- return [getSet(result.slice(0, end)), btnsVisible];
422
+ return [getSet(result.slice(0, end + 1)), btnsVisible];
425
423
  }, [data, width, collapsed, simple, activeKeys]),
426
424
  _useMemo2 = _slicedToArray(_useMemo, 2),
427
425
  cols = _useMemo2[0],
@@ -482,7 +480,7 @@ function Filter(props) {
482
480
  style: getColStyle(item.colSpan),
483
481
  className: className,
484
482
  key: item.key
485
- }, item.renderFormItem());
483
+ }, item.renderFormItem(form));
486
484
  }
487
485
 
488
486
  if (!item.type) {
@@ -1,18 +1,18 @@
1
1
  import type { FormInstance } from 'antd';
2
2
  import type { CSSProperties, ReactElement, ReactNode } from 'react';
3
3
 
4
- export interface FilterItemType {
4
+ export interface FilterItemType<T = any> {
5
5
  key: string;
6
6
  label?: string;
7
7
  type?: string;
8
8
  colSpan?: number;
9
9
  hideLabel?: boolean;
10
10
  extraProps?: Record<string, any>;
11
- renderFormItem?: () => ReactElement;
11
+ renderFormItem?: (form: FormInstance<T>) => ReactElement;
12
12
  }
13
13
 
14
14
  export interface FilterProps<T extends Record<string, any> = Record<string, any>> {
15
- data: FilterItemType[];
15
+ data: FilterItemType<T>[];
16
16
  defaultValue?: T;
17
17
  value?: T;
18
18
  onChange?: (value: T) => void;
@@ -106,6 +106,8 @@
106
106
  flex-direction: column;
107
107
  min-width: 0;
108
108
  overflow: auto;
109
+
110
+ .scrollBar(8px);
109
111
  }
110
112
 
111
113
  &-footer {
@@ -209,6 +209,7 @@ export default function Menu(props) {
209
209
  setPopover = _useState2[1];
210
210
 
211
211
  var popup = useRef(null);
212
+ var popupContainer = useRef(null);
212
213
  var drawer = useRef(null);
213
214
  var clientWidth = useRef(document.body.clientWidth);
214
215
 
@@ -275,9 +276,13 @@ export default function Menu(props) {
275
276
  }, [location.pathname, menus]);
276
277
 
277
278
  var openMenu = function openMenu(item, elm) {
278
- if (item.name === FAVORITES_POPOVER || item.children !== undefined && item.children.length > 0 || collapsed) {
279
+ var isFavorite = item.name === FAVORITES_POPOVER;
280
+
281
+ if (isFavorite || item.children !== undefined && item.children.length > 0 || collapsed) {
282
+ var _popupContainer$curre;
283
+
279
284
  setPopover(item);
280
- setTop(elm.offsetTop);
285
+ setTop(elm.offsetTop - (isFavorite ? 0 : ((_popupContainer$curre = popupContainer.current) === null || _popupContainer$curre === void 0 ? void 0 : _popupContainer$curre.scrollTop) || 0));
281
286
  setTimeout(function () {
282
287
  if (popup.current) {
283
288
  popup.current.classList.add('animated');
@@ -563,12 +568,15 @@ export default function Menu(props) {
563
568
  strokeLinejoin: "round",
564
569
  strokeDasharray: "0,0",
565
570
  transform: "translate(-274.000000, -57.000000) translate(284.000000, 67.000000) scale(-1, 1) translate(-284.000000, -67.000000) translate(274.000000, 57.000000) translate(8.535522, 10.000000) rotate(-45.000000) translate(-8.535522, -10.000000)"
566
- })))))), menus.map(function (item, index) {
571
+ })))))), /*#__PURE__*/React.createElement("div", {
572
+ className: "".concat(prefixCls, "-menu-top-items"),
573
+ ref: popupContainer
574
+ }, menus.map(function (item, index) {
567
575
  var _classNames5;
568
576
 
569
577
  return /*#__PURE__*/React.createElement("div", {
570
578
  key: index,
571
- className: classNames("".concat(prefixCls, "-menu-top-item"), (_classNames5 = {}, _defineProperty(_classNames5, "".concat(prefixCls, "-menu-top-item-active"), activeMenu !== undefined && activeMenu.path[0] === index), _defineProperty(_classNames5, "".concat(prefixCls, "-menu-top-item-popover-active"), item === popover), _classNames5)),
579
+ className: classNames("".concat(prefixCls, "-menu-top-item"), (_classNames5 = {}, _defineProperty(_classNames5, "".concat(prefixCls, "-menu-top-item-active"), (activeMenu === null || activeMenu === void 0 ? void 0 : activeMenu.path[0]) === index), _defineProperty(_classNames5, "".concat(prefixCls, "-menu-top-item-popover-active"), item === popover), _classNames5)),
572
580
  onClick: function onClick() {
573
581
  return handleClick(item);
574
582
  },
@@ -578,6 +586,8 @@ export default function Menu(props) {
578
586
  return openMenu(item, target);
579
587
  });
580
588
  }
589
+ }, /*#__PURE__*/React.createElement("div", {
590
+ className: "".concat(prefixCls, "-menu-top-item-content")
581
591
  }, typeof item.icon === 'string' ? /*#__PURE__*/React.createElement("img", {
582
592
  className: "".concat(prefixCls, "-menu-icon"),
583
593
  src: item.icon
@@ -585,8 +595,8 @@ export default function Menu(props) {
585
595
  className: "".concat(prefixCls, "-menu-icon")
586
596
  }, item.icon), /*#__PURE__*/React.createElement("div", {
587
597
  className: "".concat(prefixCls, "-menu-title")
588
- }, item.name));
589
- }), /*#__PURE__*/React.createElement("div", {
598
+ }, item.name)));
599
+ })), /*#__PURE__*/React.createElement("div", {
590
600
  className: classNames("".concat(prefixCls, "-menu-divider-div"), _defineProperty({}, "".concat(prefixCls, "-menu-divider-div-collapsed"), collapsed))
591
601
  }, /*#__PURE__*/React.createElement(Divider, {
592
602
  className: "".concat(prefixCls, "-menu-divider")
@@ -603,11 +613,13 @@ export default function Menu(props) {
603
613
  }, target);
604
614
  });
605
615
  }
616
+ }, /*#__PURE__*/React.createElement("div", {
617
+ className: "".concat(prefixCls, "-menu-top-item-content")
606
618
  }, /*#__PURE__*/React.createElement("div", {
607
619
  className: "".concat(prefixCls, "-menu-icon")
608
620
  }, favoriteIcon), /*#__PURE__*/React.createElement("div", {
609
621
  className: "".concat(prefixCls, "-menu-title")
610
- }, "\u6536\u85CF"))), false && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
622
+ }, "\u6536\u85CF")))), false && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
611
623
  className: "".concat(prefixCls, "-menu-gutter")
612
624
  }), collapsed ? /*#__PURE__*/React.createElement("div", {
613
625
  className: "".concat(prefixCls, "-menu-top-item"),
@@ -17,8 +17,11 @@
17
17
  &-bar {
18
18
  position: relative;
19
19
  z-index: 3;
20
+ display: flex;
21
+ flex-direction: column;
20
22
  box-sizing: border-box;
21
23
  width: 100%;
24
+ height: 100%;
22
25
  background: #f2f2f2;
23
26
  }
24
27
 
@@ -49,11 +52,17 @@
49
52
  left: 52px;
50
53
  }
51
54
 
55
+ &-top-items {
56
+ overflow-x: hidden;
57
+ overflow-y: auto;
58
+
59
+ .scrollBar();
60
+ }
61
+
52
62
  &-top-item {
53
- display: flex;
54
- align-items: center;
55
63
  box-sizing: border-box;
56
64
  height: 44px;
65
+ min-height: 44px;
57
66
  padding: 0 16px;
58
67
  overflow: hidden;
59
68
  color: #333;
@@ -62,6 +71,15 @@
62
71
  cursor: pointer;
63
72
  .transition();
64
73
 
74
+ &-content {
75
+ position: relative;
76
+ left: 50%;
77
+ display: flex;
78
+ align-items: center;
79
+ height: 100%;
80
+ transform: translateX(-50%);
81
+ }
82
+
65
83
  &:hover,
66
84
  &-popover-active {
67
85
  background: #e6e6e6;
@@ -84,6 +102,12 @@
84
102
  }
85
103
  }
86
104
 
105
+ &-collapsed &-top-item-content {
106
+ width: 100%;
107
+ min-width: 20px;
108
+ overflow: hidden;
109
+ }
110
+
87
111
  &-icon {
88
112
  width: 20px;
89
113
  height: 20px;
package/es/overrides.less CHANGED
@@ -34,18 +34,7 @@ a[title='站长统计'] {
34
34
  }
35
35
 
36
36
  .ant-table-body {
37
- &::-webkit-scrollbar {
38
- width: 8px;
39
- height: 8px;
40
- }
41
-
42
- &::-webkit-scrollbar-thumb {
43
- background-color: #ddd;
44
- }
45
-
46
- &::-webkit-scrollbar-track {
47
- background-color: #fff;
48
- }
37
+ .scrollBar(8px);
49
38
  }
50
39
 
51
40
  .ant-table-tbody > tr.ant-table-row-selected > td {
package/es/utils.less CHANGED
@@ -89,3 +89,22 @@
89
89
  }
90
90
  }
91
91
  }
92
+
93
+ .scrollBar (@width: 6px) {
94
+ scrollbar-width: thin;
95
+
96
+ &::-webkit-scrollbar {
97
+ width: @width;
98
+ height: 8px;
99
+ }
100
+
101
+ &::-webkit-scrollbar-track {
102
+ background-color: #fff;
103
+ border-radius: 10px; // 滑块颜色
104
+ }
105
+
106
+ &::-webkit-scrollbar-thumb {
107
+ background-color: #ddd;
108
+ border-radius: 10px; // 滑块颜色
109
+ }
110
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lemon-fe/components",
3
- "version": "0.1.91",
3
+ "version": "0.1.97",
4
4
  "description": "> TODO: description",
5
5
  "author": "鲁盛杰 <lusj@cnlemon.net>",
6
6
  "homepage": "",
@@ -39,5 +39,5 @@
39
39
  "react": "^17.0.2",
40
40
  "react-dom": "^17.0.2"
41
41
  },
42
- "gitHead": "407f33c49a0de8ae9b3fc07002ee9eace8dbd179"
42
+ "gitHead": "7823b5e252d052d697f8f4c584d39ee3c2014d92"
43
43
  }