@para-ui/core 4.0.44 → 4.0.45

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.
@@ -48,7 +48,9 @@ export interface CollapseLayoutProps {
48
48
  * */
49
49
  minDragLength?: number;
50
50
  /** 点击回调 bol 显示/展开 */
51
- onClickBtn?: (bol?: boolean) => void;
51
+ onClickBtn?: (bol?: boolean, duration?: number) => void;
52
+ /** 拖拽结束事件 */
53
+ onDragEnd?: () => void;
52
54
  }
53
55
  /**
54
56
  * @author zhanzl
@@ -37,7 +37,8 @@ const CollapseLayout = props => {
37
37
  unit = 'px',
38
38
  style,
39
39
  className = '',
40
- onClickBtn
40
+ onClickBtn,
41
+ onDragEnd
41
42
  } = props;
42
43
  const constData = useRef({
43
44
  zoomLength: zoomLength || 0,
@@ -169,7 +170,7 @@ const CollapseLayout = props => {
169
170
  /** 点击切换按钮 */
170
171
  const clickBtn = () => {
171
172
  setShowBox(!showBox);
172
- onClickBtn && onClickBtn(!showBox);
173
+ onClickBtn && onClickBtn(!showBox, duration);
173
174
  };
174
175
  /** 鼠标按下事件 */
175
176
  const onmousedown = e => {
@@ -248,6 +249,7 @@ const CollapseLayout = props => {
248
249
  const onmouseup = () => {
249
250
  const comRefDom = comRef.current;
250
251
  comRefDom.classList.remove("".concat($prefixCls, "-collapse-layout-move"));
252
+ onDragEnd && onDragEnd();
251
253
  window.removeEventListener('mousemove', onmousemove);
252
254
  window.removeEventListener('mouseup', onmouseup);
253
255
  };
@@ -24,6 +24,8 @@ import { $ as $prefixCls } from '../_verture/constant-5317fc89.js';
24
24
  import { Search } from '../Search/index.js';
25
25
  import LoadingOutlined from '@para-ui/icons/LoadingF';
26
26
  import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
27
+ import '../_verture/defineProperty-f0e15205.js';
28
+ import '../_verture/slicedToArray-75fa4188.js';
27
29
  import '../Checkbox/index.js';
28
30
  import '../Help/index.js';
29
31
  import '@para-ui/icons/Help';
@@ -60,8 +62,6 @@ import '@para-ui/icons/Right';
60
62
  import '@para-ui/icons/DoubleLeft';
61
63
  import '@para-ui/icons/DoubleRight';
62
64
  import '../_verture/toConsumableArray-c7a8028f.js';
63
- import '../_verture/slicedToArray-75fa4188.js';
64
- import '../_verture/defineProperty-f0e15205.js';
65
65
  import '../_verture/index-8ac46bd9.js';
66
66
  import '../_verture/typeof-6ec38efd.js';
67
67
  import 'rc-tree';
@@ -52,6 +52,8 @@ import '@para-ui/icons/Up';
52
52
  import '../MultiBox/index.js';
53
53
  import '@para-ui/icons/Internet';
54
54
  import '../Table/index.js';
55
+ import '../_verture/defineProperty-f0e15205.js';
56
+ import '../_verture/slicedToArray-75fa4188.js';
55
57
  import '../Button/index.js';
56
58
  import '@para-ui/icons/ScreenF';
57
59
  import '@para-ui/icons/UpTriangleF';
@@ -72,8 +74,6 @@ import '@para-ui/icons/DoubleLeft';
72
74
  import '@para-ui/icons/DoubleRight';
73
75
  import '../_verture/index-5f0bfdcf.js';
74
76
  import '../_verture/toConsumableArray-c7a8028f.js';
75
- import '../_verture/slicedToArray-75fa4188.js';
76
- import '../_verture/defineProperty-f0e15205.js';
77
77
  import '../_verture/index-8ac46bd9.js';
78
78
  import '../_verture/typeof-6ec38efd.js';
79
79
  import 'rc-tree';
package/Form/index.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { jsx } from 'react/jsx-runtime';
2
2
  import { DeepClone } from '@paraview/lib';
3
3
  import React__default from 'react';
4
- import { F as FormItem, l as localeJson, v as validate } from '../_verture/index-fd0727b2.js';
4
+ import { F as FormItem, l as localeJson, v as validate } from '../_verture/index-95e30df5.js';
5
5
  import { $ as $prefixCls } from '../_verture/constant-5317fc89.js';
6
6
  import { u as useFormatMessage } from '../_verture/useFormatMessage-1fc7c957.js';
7
7
  import '../TextField/index.js';
@@ -51,6 +51,7 @@ import 'rc-input-number';
51
51
  import '@para-ui/icons/Up';
52
52
  import '../ComboSelect/index.js';
53
53
  import '../Table/index.js';
54
+ import '../_verture/defineProperty-f0e15205.js';
54
55
  import '@para-ui/icons/ScreenF';
55
56
  import '@para-ui/icons/UpTriangleF';
56
57
  import '@para-ui/icons/DownTriangleF';
@@ -73,7 +74,6 @@ import '@para-ui/icons/DoubleLeft';
73
74
  import '@para-ui/icons/DoubleRight';
74
75
  import '../_verture/index-5f0bfdcf.js';
75
76
  import '../_verture/toConsumableArray-c7a8028f.js';
76
- import '../_verture/defineProperty-f0e15205.js';
77
77
  import '../_verture/index-8ac46bd9.js';
78
78
  import '../_verture/typeof-6ec38efd.js';
79
79
  import 'rc-tree';
package/FormItem/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import 'react/jsx-runtime';
2
2
  import 'react';
3
- export { F as default } from '../_verture/index-fd0727b2.js';
3
+ export { F as default } from '../_verture/index-95e30df5.js';
4
4
  import 'clsx';
5
5
  import '../Label/index.js';
6
6
  import '../_verture/constant-5317fc89.js';
@@ -51,6 +51,7 @@ import 'rc-input-number';
51
51
  import '@para-ui/icons/Up';
52
52
  import '../ComboSelect/index.js';
53
53
  import '../Table/index.js';
54
+ import '../_verture/defineProperty-f0e15205.js';
54
55
  import '@para-ui/icons/ScreenF';
55
56
  import '@para-ui/icons/UpTriangleF';
56
57
  import '@para-ui/icons/DownTriangleF';
@@ -73,7 +74,6 @@ import '@para-ui/icons/DoubleLeft';
73
74
  import '@para-ui/icons/DoubleRight';
74
75
  import '../_verture/index-5f0bfdcf.js';
75
76
  import '../_verture/toConsumableArray-c7a8028f.js';
76
- import '../_verture/defineProperty-f0e15205.js';
77
77
  import '../_verture/index-8ac46bd9.js';
78
78
  import '../_verture/typeof-6ec38efd.js';
79
79
  import 'rc-tree';
@@ -26,6 +26,8 @@ export interface PaginationProps {
26
26
  flippingArrow?: PaginationFlippingArrow[];
27
27
  /** 自适应模式 只有type=complex生效,默认true */
28
28
  autoType?: boolean;
29
+ /** 重新计算换行不换行 只有type=complex生效 */
30
+ resizeLine?: string | number;
29
31
  /** 总数 */
30
32
  total?: number;
31
33
  /** 每页行数 */
@@ -64,7 +64,7 @@ var localeJson = {
64
64
  en
65
65
  };
66
66
 
67
- var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2021/10/26 13:57\n* @description 分页样式\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-pagination {\n font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n font-size: 14px;\n color: rgb(29, 33, 38);\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n opacity: 1;\n}\n.paraui-v4-pagination.paraui-v4-pagination-over {\n overflow: hidden;\n height: 32px;\n opacity: 0;\n transition: all 0.3s;\n}\n.paraui-v4-pagination.paraui-v4-pagination-no-left-arrow > .pagination-content {\n padding-left: 0;\n}\n.paraui-v4-pagination.paraui-v4-pagination-no-right-arrow > .pagination-content {\n padding-right: 0;\n}\n.paraui-v4-pagination > .pagination-space {\n margin-right: 10px;\n}\n.paraui-v4-pagination > .pagination-space:last-child {\n margin-right: 0;\n}\n.paraui-v4-pagination > .pagination-content {\n display: flex;\n border-radius: 4px;\n height: 32px;\n background-color: rgb(255, 255, 255);\n}\n.paraui-v4-pagination > .pagination-content > .left-page, .paraui-v4-pagination > .pagination-content > .right-page {\n display: inline-block;\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div, .paraui-v4-pagination > .pagination-content > .right-page > div {\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n width: 32px;\n height: 32px;\n border-radius: 4px;\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div.disabled-btn, .paraui-v4-pagination > .pagination-content > .right-page > div.disabled-btn {\n cursor: not-allowed;\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div.disabled-btn > svg, .paraui-v4-pagination > .pagination-content > .right-page > div.disabled-btn > svg {\n color: rgb(161, 168, 179);\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div.disabled-btn:hover, .paraui-v4-pagination > .pagination-content > .right-page > div.disabled-btn:hover {\n background-color: rgb(255, 255, 255);\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div.disabled-btn:hover > svg, .paraui-v4-pagination > .pagination-content > .right-page > div.disabled-btn:hover > svg {\n color: rgb(161, 168, 179);\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div:last-child, .paraui-v4-pagination > .pagination-content > .right-page > div:last-child {\n margin-right: 0;\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div:hover, .paraui-v4-pagination > .pagination-content > .right-page > div:hover {\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div:hover > svg, .paraui-v4-pagination > .pagination-content > .right-page > div:hover > svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div > svg, .paraui-v4-pagination > .pagination-content > .right-page > div > svg {\n font-size: 16px;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination {\n height: 100%;\n display: inline-block;\n box-shadow: none;\n vertical-align: top;\n line-height: 30px;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li {\n min-width: 32px;\n height: 32px;\n line-height: 32px;\n display: inline-block;\n text-align: center;\n cursor: pointer;\n border-radius: 4px;\n margin-right: 6px;\n padding: 0 6px;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li:first-child, .paraui-v4-pagination > .pagination-content > .component-pagination > li:last-child, .paraui-v4-pagination > .pagination-content > .component-pagination > li.component-pagination-next {\n display: none;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li.component-pagination-jump-next, .paraui-v4-pagination > .pagination-content > .component-pagination > li.component-pagination-jump-prev {\n padding: 0;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-prev-icon svg, .paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-next-icon svg {\n display: none;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-prev-icon span, .paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-next-icon span {\n display: inline-block;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-prev-icon:hover svg, .paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-next-icon:hover svg {\n display: inline-block;\n vertical-align: middle;\n color: rgb(46, 101, 230);\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-prev-icon:hover span, .paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-next-icon:hover span {\n display: none;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li:hover {\n background-color: rgb(247, 248, 250);\n color: rgb(46, 101, 230);\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li.component-pagination-item-active {\n color: rgb(46, 101, 230);\n border: 1px solid;\n border-color: rgb(46, 101, 230);\n line-height: 30px;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li.component-pagination-item-active:hover {\n background: rgb(255, 255, 255);\n border-color: rgb(46, 101, 230);\n}\n.paraui-v4-pagination > .pagination-btn-content button:first-child {\n margin-right: 10px;\n}\n.paraui-v4-pagination > .page-line-memo > span {\n display: inline-block;\n margin-right: 8px;\n vertical-align: middle;\n}\n.paraui-v4-pagination > .page-line-memo .page-line-select {\n width: 110px;\n vertical-align: middle;\n}\n.paraui-v4-pagination > .skip-page-memo {\n display: flex;\n align-items: center;\n}\n.paraui-v4-pagination > .skip-page-memo > span {\n color: rgb(92, 101, 115);\n}\n.paraui-v4-pagination > .skip-page-memo > .skip-page-text-field {\n width: 50px;\n margin: 0 4px;\n}\n.paraui-v4-pagination > .skip-page-memo > .skip-page-text-field .right-icon {\n margin-right: 8px;\n}";
67
+ var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2021/10/26 13:57\n* @description 分页样式\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-pagination {\n font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n font-size: 14px;\n color: rgb(29, 33, 38);\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n opacity: 1;\n}\n.paraui-v4-pagination.paraui-v4-pagination-over {\n overflow: hidden;\n height: 32px;\n}\n.paraui-v4-pagination.paraui-v4-pagination-no-left-arrow > .pagination-content {\n padding-left: 0;\n}\n.paraui-v4-pagination.paraui-v4-pagination-no-right-arrow > .pagination-content {\n padding-right: 0;\n}\n.paraui-v4-pagination .total-num {\n height: 32px;\n line-height: 32px;\n}\n.paraui-v4-pagination > .pagination-space {\n margin-right: 10px;\n}\n.paraui-v4-pagination > .pagination-space:last-child {\n margin-right: 0;\n}\n.paraui-v4-pagination > .pagination-content {\n display: flex;\n border-radius: 4px;\n height: 32px;\n background-color: rgb(255, 255, 255);\n}\n.paraui-v4-pagination > .pagination-content > .left-page, .paraui-v4-pagination > .pagination-content > .right-page {\n display: inline-block;\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div, .paraui-v4-pagination > .pagination-content > .right-page > div {\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n width: 32px;\n height: 32px;\n border-radius: 4px;\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div.disabled-btn, .paraui-v4-pagination > .pagination-content > .right-page > div.disabled-btn {\n cursor: not-allowed;\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div.disabled-btn > svg, .paraui-v4-pagination > .pagination-content > .right-page > div.disabled-btn > svg {\n color: rgb(161, 168, 179);\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div.disabled-btn:hover, .paraui-v4-pagination > .pagination-content > .right-page > div.disabled-btn:hover {\n background-color: rgb(255, 255, 255);\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div.disabled-btn:hover > svg, .paraui-v4-pagination > .pagination-content > .right-page > div.disabled-btn:hover > svg {\n color: rgb(161, 168, 179);\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div:last-child, .paraui-v4-pagination > .pagination-content > .right-page > div:last-child {\n margin-right: 0;\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div:hover, .paraui-v4-pagination > .pagination-content > .right-page > div:hover {\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div:hover > svg, .paraui-v4-pagination > .pagination-content > .right-page > div:hover > svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-pagination > .pagination-content > .left-page > div > svg, .paraui-v4-pagination > .pagination-content > .right-page > div > svg {\n font-size: 16px;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination {\n height: 100%;\n display: inline-block;\n box-shadow: none;\n vertical-align: top;\n line-height: 30px;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li {\n min-width: 32px;\n height: 32px;\n line-height: 32px;\n display: inline-block;\n text-align: center;\n cursor: pointer;\n border-radius: 4px;\n margin-right: 6px;\n padding: 0 6px;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li:first-child, .paraui-v4-pagination > .pagination-content > .component-pagination > li:last-child, .paraui-v4-pagination > .pagination-content > .component-pagination > li.component-pagination-next {\n display: none;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li.component-pagination-jump-next, .paraui-v4-pagination > .pagination-content > .component-pagination > li.component-pagination-jump-prev {\n padding: 0;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-prev-icon svg, .paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-next-icon svg {\n display: none;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-prev-icon span, .paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-next-icon span {\n display: inline-block;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-prev-icon:hover svg, .paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-next-icon:hover svg {\n display: inline-block;\n vertical-align: middle;\n color: rgb(46, 101, 230);\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-prev-icon:hover span, .paraui-v4-pagination > .pagination-content > .component-pagination > li > .jump-next-icon:hover span {\n display: none;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li:hover {\n background-color: rgb(247, 248, 250);\n color: rgb(46, 101, 230);\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li.component-pagination-item-active {\n color: rgb(46, 101, 230);\n border: 1px solid;\n border-color: rgb(46, 101, 230);\n line-height: 30px;\n}\n.paraui-v4-pagination > .pagination-content > .component-pagination > li.component-pagination-item-active:hover {\n background: rgb(255, 255, 255);\n border-color: rgb(46, 101, 230);\n}\n.paraui-v4-pagination > .pagination-btn-content button:first-child {\n margin-right: 10px;\n}\n.paraui-v4-pagination > .page-line-memo > span {\n display: inline-block;\n margin-right: 8px;\n vertical-align: middle;\n}\n.paraui-v4-pagination > .page-line-memo .page-line-select {\n width: 110px;\n vertical-align: middle;\n}\n.paraui-v4-pagination > .skip-page-memo {\n display: flex;\n align-items: center;\n}\n.paraui-v4-pagination > .skip-page-memo > span {\n color: rgb(92, 101, 115);\n}\n.paraui-v4-pagination > .skip-page-memo > .skip-page-text-field {\n width: 50px;\n margin: 0 4px;\n}\n.paraui-v4-pagination > .skip-page-memo > .skip-page-text-field .right-icon {\n margin-right: 8px;\n}";
68
68
  styleInject(css_248z);
69
69
 
70
70
  const Pagination = props => {
@@ -83,34 +83,33 @@ const Pagination = props => {
83
83
  skipFunc,
84
84
  changePage,
85
85
  changeRowsPerPage,
86
- getPopupContainer
86
+ getPopupContainer,
87
+ resizeLine
87
88
  } = props;
89
+ const intl = useFormatMessage('Pagination', localeJson);
88
90
  const {
89
91
  language,
90
92
  locale
91
93
  } = React__default.useContext(GlobalContext);
92
- const intl = useFormatMessage('Pagination', localeJson);
93
94
  const [currentRowsPerPageCom, setCurrentRowsPerPageCom] = useState(currentRowsPerPage); // 当前选中每页行数
94
95
  const [rowsPerPageCom, setRowsPerPageCom] = useState([]); // 每页显示的行数
95
96
  const [pageCom, setPageCom] = useState(page); // 当前页数
96
97
  const [totalPage, setTotalPage] = useState(); // 总页数
97
98
  const [skipValue, setSkipValue] = useState(); // 跳转页数
98
- const [typeCom, setTypeCom] = useState(); // 组件类型
99
- const refDom = useRef();
100
- const constData = useRef({});
99
+ const [morePos, setMorePos] = useState(null); // 超出在原始位置
100
+ const refDom = useRef(null);
101
+ const constData = useRef({
102
+ layoutArr: ['jumper', 'pageRow', 'pager-btn', 'sizes', 'pager-num']
103
+ });
101
104
  constData.current.type = type;
102
105
  constData.current.autoType = autoType;
103
106
  useEffect(() => {
104
107
  return () => {
105
108
  window.removeEventListener('resize', changeSize);
106
109
  clearTimeout(constData.current.timer);
107
- clearTimeout(constData.current.timerClass);
108
110
  clearTimeout(constData.current.changePagination);
109
111
  };
110
112
  }, []);
111
- useEffect(() => {
112
- setTypeCom(type);
113
- }, [type]);
114
113
  useEffect(() => {
115
114
  setPageCom(page);
116
115
  }, [page]);
@@ -151,61 +150,59 @@ const Pagination = props => {
151
150
  window.addEventListener('resize', changeSize);
152
151
  } else {
153
152
  window.removeEventListener('resize', changeSize);
154
- setTypeCom(type);
155
153
  }
156
154
  }, [type, autoType]);
157
155
  useEffect(() => {
158
156
  if (constData.current.type === 'complex' && constData.current.autoType) {
159
- changePagination();
157
+ changeSize();
160
158
  }
161
- }, [total, currentRowsPerPageCom, pageCom, language]);
162
- /**
163
- * 改变了分页数据,需要判断当前是否换行了
164
- * */
165
- const changePagination = () => {
166
- clearTimeout(constData.current.changePagination);
167
- constData.current.changePagination = setTimeout(() => {
168
- const current = refDom.current;
169
- const skipDom = current && current.querySelector('.skip-page-memo');
170
- // 简单模式,不存在跳转
171
- if (skipDom) {
172
- // 复杂模式,换行了 -> 变成简单模式
173
- if (current.offsetTop !== skipDom.offsetTop) {
174
- setTypeCom('simple');
175
- }
176
- } else {
177
- setTypeCom('complex');
178
- // 简单模式 -> 复杂, 需要再次判断是否换行了
179
- changePagination();
180
- }
181
- });
182
- };
159
+ }, [total, currentRowsPerPageCom, pageCom, language, resizeLine]);
183
160
  /** 改变屏幕大小 */
184
161
  const changeSize = () => {
185
162
  clearTimeout(constData.current.timer);
186
- clearTimeout(constData.current.timerClass);
187
163
  const current = refDom.current;
188
164
  if (!current) return;
189
165
  current.classList.add("".concat($prefixCls, "-pagination-over"));
190
166
  constData.current.timer = setTimeout(() => {
191
- if (!current) return;
192
- const moduleDom = current.querySelector('.pagination-content');
193
- const skipDom = current.querySelector('.skip-page-memo');
194
- // 简单模式,不存在跳转
195
- if (moduleDom) {
196
- // 复杂模式,换行了 -> 变成简单模式
197
- if (current.offsetTop !== skipDom.offsetTop) {
198
- setTypeCom('simple');
167
+ setMorePos(constData.current.layoutArr.length);
168
+ if (constData.current.layoutArr.length > 1) handMultiline();
169
+ }, 100);
170
+ };
171
+ /**
172
+ * 判断是否换行
173
+ * true 换行
174
+ * */
175
+ const isMultiline = () => {
176
+ const arr = ['.total-num', '.component-pagination', '.pagination-btn-content', '.page-line-memo', '.skip-page-memo'];
177
+ let num;
178
+ let bol = false;
179
+ arr.forEach(str => {
180
+ const dom = refDom.current.querySelector(str);
181
+ if (dom) {
182
+ if (num === undefined) {
183
+ num = dom.offsetTop;
184
+ } else {
185
+ if (dom.offsetTop !== num) {
186
+ bol = true;
187
+ }
199
188
  }
200
- } else {
201
- setTypeCom('complex');
202
- // 简单模式 -> 复杂, 需要再次判断是否换行了
203
- changeSize();
204
189
  }
205
- constData.current.timerClass = setTimeout(() => {
206
- current.classList.remove("".concat($prefixCls, "-pagination-over"));
207
- }, 200);
208
- }, 200);
190
+ });
191
+ return bol;
192
+ };
193
+ const handMultiline = index => {
194
+ if (index === null || index === 0) return;
195
+ if (index === undefined) index = constData.current.layoutArr.length;
196
+ if (isMultiline()) {
197
+ const num = Number(index) - 1;
198
+ // 超出
199
+ setMorePos(num);
200
+ if (num > 3) handMultiline(num);else refDom.current.classList.remove("".concat($prefixCls, "-pagination-over"));
201
+ } else {
202
+ // 一行
203
+ //if (list.length <= index) handleCloseMore();
204
+ refDom.current.classList.remove("".concat($prefixCls, "-pagination-over"));
205
+ }
209
206
  };
210
207
  /**
211
208
  * 是否存在当前类型
@@ -213,6 +210,28 @@ const Pagination = props => {
213
210
  const notLayout = layout => {
214
211
  return constData.current.type instanceof Array && constData.current.type.indexOf(layout) === -1;
215
212
  };
213
+ /**
214
+ * 判断超出是否显示
215
+ * false 显示
216
+ * true 不显示
217
+ * */
218
+ const overShowDom = type => {
219
+ if (morePos === null) return false;
220
+ switch (type) {
221
+ case 'jumper':
222
+ return morePos <= 0;
223
+ case 'pageRow':
224
+ return morePos <= 1;
225
+ case 'pager-btn':
226
+ return morePos <= 2 || morePos > 4;
227
+ case 'sizes':
228
+ return morePos <= 3;
229
+ case 'pager-num':
230
+ return morePos <= 4;
231
+ default:
232
+ return false;
233
+ }
234
+ };
216
235
  // 点击分页
217
236
  const clickPage = type => value => {
218
237
  let num = pageCom;
@@ -281,7 +300,7 @@ const Pagination = props => {
281
300
  };
282
301
  /* 总数量 */
283
302
  const TotalMemo = useMemo(() => {
284
- if (typeCom === 'simple' || notLayout('sizes')) {
303
+ if (type === 'simple' || notLayout('sizes') || overShowDom('sizes')) {
285
304
  return null;
286
305
  }
287
306
  // 共{total}条
@@ -295,10 +314,10 @@ const Pagination = props => {
295
314
  total: totalFormat
296
315
  })
297
316
  }));
298
- }, [total, language, locale, typeCom]);
317
+ }, [total, language, locale, morePos]);
299
318
  /* 每页行数 */
300
319
  const PageLineMemo = useMemo(() => {
301
- if (notLayout('pageRow')) {
320
+ if (notLayout('pageRow') || overShowDom('pageRow')) {
302
321
  return null;
303
322
  }
304
323
  return jsx("div", Object.assign({
@@ -315,7 +334,7 @@ const Pagination = props => {
315
334
  getPopupContainer: getPopupContainer
316
335
  })
317
336
  }));
318
- }, [rowsPerPageCom, currentRowsPerPageCom, getPopupContainer, language, locale, typeCom]);
337
+ }, [rowsPerPageCom, currentRowsPerPageCom, getPopupContainer, language, locale, morePos]);
319
338
  /** 分页上一页 */
320
339
  const jumpPrevIcon = () => {
321
340
  return jsxs("div", Object.assign({
@@ -336,9 +355,23 @@ const Pagination = props => {
336
355
  }), jsx(DoubleRight, {})]
337
356
  }));
338
357
  };
358
+ /**
359
+ * 判断显示分页
360
+ * true 不显示
361
+ * */
362
+ const isPaginationMemo = () => {
363
+ if (pagerType !== 'num') return true;
364
+ if (type === 'simple') {
365
+ return true;
366
+ } else if (type === 'complex') {
367
+ return overShowDom('pager-num');
368
+ } else {
369
+ return notLayout('pager');
370
+ }
371
+ };
339
372
  /* 页码 */
340
373
  const PaginationMemo = useMemo(() => {
341
- if (typeCom === 'simple' || pagerType !== 'num' || notLayout('pager')) {
374
+ if (isPaginationMemo()) {
342
375
  return null;
343
376
  }
344
377
  return jsxs("div", Object.assign({
@@ -373,10 +406,24 @@ const Pagination = props => {
373
406
  }))
374
407
  }))]
375
408
  }));
376
- }, [total, pageCom, totalPage, currentRowsPerPageCom, typeCom, props.flippingArrow, pagerType]);
409
+ }, [total, pageCom, totalPage, currentRowsPerPageCom, props.flippingArrow, pagerType, morePos]);
410
+ /**
411
+ * 判断显示按钮分页
412
+ * true 不显示
413
+ * */
414
+ const isPaginationBtnMemo = () => {
415
+ if (pagerType === 'btn') return false;
416
+ if (type === 'simple') {
417
+ return false;
418
+ } else if (type === 'complex') {
419
+ return overShowDom('pager-btn');
420
+ } else {
421
+ return notLayout('pager');
422
+ }
423
+ };
377
424
  /** 页码btn */
378
425
  const PaginationBtnMemo = useMemo(() => {
379
- if (notLayout('pager') || typeCom !== 'simple' && pagerType !== 'btn') {
426
+ if (isPaginationBtnMemo()) {
380
427
  return null;
381
428
  }
382
429
  return jsxs("div", Object.assign({
@@ -404,10 +451,10 @@ const Pagination = props => {
404
451
  })
405
452
  }))]
406
453
  }));
407
- }, [pageCom, totalPage, pagerType, typeCom, locale]);
454
+ }, [pageCom, totalPage, pagerType, locale, morePos]);
408
455
  /* 跳转页数 */
409
456
  const SkipPageMemo = useMemo(() => {
410
- if (notLayout('jumper')) {
457
+ if (notLayout('jumper') || overShowDom('jumper')) {
411
458
  return null;
412
459
  }
413
460
  return jsxs("div", Object.assign({
@@ -432,7 +479,7 @@ const Pagination = props => {
432
479
  })]
433
480
  })]
434
481
  }));
435
- }, [skipValue, totalPage, language, locale, typeCom]);
482
+ }, [skipValue, totalPage, language, locale, morePos]);
436
483
  // 处理class
437
484
  const handClass = () => {
438
485
  let str = "".concat($prefixCls, "-pagination");
package/README.md CHANGED
@@ -1,4 +1,11 @@
1
- ## 🎉 para-ui/core@4.0.44 发布
1
+ ## 🎉 para-ui/core@4.0.43 发布
2
+
3
+ 🔧【Bugfix】
4
+ - 【分页-Pagination】重构复杂模式下,超出换行显示内容,逐个减少
5
+ - 【表格-Table】增加resizePaginationLine参数,重新计算分页换行不换行
6
+ - 【分栏收缩容器-CollapseLayout】onClickBtn增加duration动画时间参数,新增onDragEnd拖拽结束事件
7
+
8
+ ## 🎉 para-ui/core@4.0.45 发布
2
9
 
3
10
  🎁【Feature】
4
11
  - 【代码编辑器-CodeEditor】新增组件-代码编辑器
package/Stepper/index.js CHANGED
@@ -24,7 +24,7 @@ import '@para-ui/icons/Forbid';
24
24
  import '@paraview/lib';
25
25
 
26
26
  //默认图标
27
- var Icons = {
27
+ const Icons = {
28
28
  1: jsx(One, {
29
29
  size: "medium"
30
30
  }),