@pisell/materials 2.2.53 → 2.2.55
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.
- package/build/lowcode/assets-daily.json +11 -11
- package/build/lowcode/assets-dev.json +2 -2
- package/build/lowcode/assets-prod.json +11 -11
- package/build/lowcode/index.js +1 -1
- package/build/lowcode/meta.js +5 -5
- package/build/lowcode/preview.js +164 -148
- package/build/lowcode/render/default/view.css +1 -1
- package/build/lowcode/render/default/view.js +39 -25
- package/build/lowcode/view.css +1 -1
- package/build/lowcode/view.js +39 -25
- package/es/components/Pagination/index.d.ts +1 -1
- package/es/components/appVersionControl/index.d.ts +0 -1
- package/es/components/colorPicker/index.d.ts +1 -0
- package/es/components/dataSourceComponents/dataSourceForm/utils.d.ts +1 -1
- package/es/components/dataSourceComponents/dataSourceMenu/Basic.d.ts +8 -2
- package/es/components/dataSourceComponents/dataSourceMenu/Basic.js +13 -3
- package/es/components/dataSourceComponents/dataSourceMenu/index.d.ts +8 -2
- package/es/components/dataSourceComponents/dataSourceTable/hooks/useDrawerState.d.ts +0 -1
- package/es/components/dataSourceComponents/dataSourceTable/hooks/useTableProps.d.ts +1 -1
- package/es/components/dataSourceComponents/fields/Input.Subdomain/index.d.ts +1 -1
- package/es/components/dataSourceComponents/fields/Input.Url/ReadPretty.less +2 -0
- package/es/components/dataSourceComponents/fields/Select/index.d.ts +1 -1
- package/es/components/dataSourceComponents/fields/index.d.ts +10 -10
- package/es/components/drag-sort-tree/index.d.ts +0 -1
- package/es/components/filter/components/items/index.d.ts +1 -0
- package/es/components/filter/components/items/text/Editor/index.d.ts +1 -0
- package/es/components/filter/components/items/text/Preview/index.d.ts +1 -0
- package/es/components/filter/components/items/text/index.d.ts +1 -0
- package/es/components/iconfont/index.js +1 -1
- package/es/components/login-and-register/index.js +23 -21
- package/es/components/login-and-register/index.less +7 -7
- package/es/components/page/index.js +23 -57
- package/es/components/pisellAnchor/index.d.ts +1 -1
- package/es/components/pisellAnchor/index.js +109 -199
- package/es/components/pisellAnchor/index.less +3 -5
- package/es/components/pisellAvatar/index.js +2 -1
- package/es/components/pisellAvatar/index.less +2 -1
- package/es/components/pisellCustomCheckboxGroup/index.js +3 -0
- package/es/components/pisellGoodPassCard/index.d.ts +47 -0
- package/es/components/pisellGoodPassCard/index.js +115 -0
- package/es/components/pisellGoodPassCard/index.less +52 -0
- package/es/components/pisellModal/components/MobileModal/index.less +4 -0
- package/es/components/pisellNavigationMenu/PisellNavigationMenu.js +18 -2
- package/es/components/pisellWalletPassCard/index.d.ts +0 -1
- package/es/components/productCard/components/MultiDay/index.js +2 -1
- package/es/components/productCard/components/Packages/components/collapsibleList/utils.js +4 -3
- package/es/components/productCard/components/Time/components/SelectResource/index.d.ts +3 -0
- package/es/components/productCard/components/Time/components/SelectResource/index.js +53 -0
- package/es/components/productCard/components/Time/index.d.ts +1 -1
- package/es/components/productCard/components/Time/index.js +21 -7
- package/es/components/productCard/components/Time/index.less +29 -0
- package/es/components/productCard/index.js +5 -2
- package/es/components/productCard/locales.d.ts +6 -0
- package/es/components/productCard/locales.js +19 -1
- package/es/components/productCard/types.d.ts +4 -0
- package/es/components/productCard/utils.js +18 -2
- package/es/components/table/Actions/component/ExportImport/index.d.ts +0 -1
- package/es/components/table/Table/SelectField/index.d.ts +1 -0
- package/es/components/table/Table/tableConfig/summary/index.d.ts +1 -0
- package/es/components/table/Table/utils.d.ts +1 -1
- package/es/components/tabs/index.js +6 -1
- package/es/index.d.ts +10 -11
- package/es/index.js +11 -12
- package/es/locales/en-US.d.ts +28 -2
- package/es/locales/en-US.js +43 -10
- package/es/locales/zh-CN.d.ts +26 -0
- package/es/locales/zh-CN.js +29 -1
- package/es/locales/zh-TW.d.ts +26 -0
- package/es/locales/zh-TW.js +28 -1
- package/lib/components/Pagination/index.d.ts +1 -1
- package/lib/components/appVersionControl/index.d.ts +0 -1
- package/lib/components/colorPicker/index.d.ts +1 -0
- package/lib/components/dataSourceComponents/dataSourceForm/utils.d.ts +1 -1
- package/lib/components/dataSourceComponents/dataSourceMenu/Basic.d.ts +8 -2
- package/lib/components/dataSourceComponents/dataSourceMenu/Basic.js +12 -3
- package/lib/components/dataSourceComponents/dataSourceMenu/index.d.ts +8 -2
- package/lib/components/dataSourceComponents/dataSourceTable/hooks/useDrawerState.d.ts +0 -1
- package/lib/components/dataSourceComponents/dataSourceTable/hooks/useTableProps.d.ts +1 -1
- package/lib/components/dataSourceComponents/fields/Input.Subdomain/index.d.ts +1 -1
- package/lib/components/dataSourceComponents/fields/Input.Url/ReadPretty.less +2 -0
- package/lib/components/dataSourceComponents/fields/Select/index.d.ts +1 -1
- package/lib/components/dataSourceComponents/fields/index.d.ts +10 -10
- package/lib/components/drag-sort-tree/index.d.ts +0 -1
- package/lib/components/filter/components/items/index.d.ts +1 -0
- package/lib/components/filter/components/items/text/Editor/index.d.ts +1 -0
- package/lib/components/filter/components/items/text/Preview/index.d.ts +1 -0
- package/lib/components/filter/components/items/text/index.d.ts +1 -0
- package/lib/components/iconfont/index.js +1 -1
- package/lib/components/login-and-register/index.js +23 -21
- package/lib/components/login-and-register/index.less +7 -7
- package/lib/components/page/index.js +37 -65
- package/lib/components/pisellAnchor/index.d.ts +1 -1
- package/lib/components/pisellAnchor/index.js +64 -131
- package/lib/components/pisellAnchor/index.less +3 -5
- package/lib/components/pisellAvatar/index.js +1 -1
- package/lib/components/pisellAvatar/index.less +2 -1
- package/lib/components/pisellCustomCheckboxGroup/index.js +1 -1
- package/lib/components/pisellEmpty/index.js +9 -1
- package/lib/components/pisellGoodPassCard/index.d.ts +47 -0
- package/lib/components/pisellGoodPassCard/index.js +109 -0
- package/lib/components/pisellGoodPassCard/index.less +52 -0
- package/lib/components/pisellModal/components/MobileModal/index.less +4 -0
- package/lib/components/pisellNavigationMenu/PisellNavigationMenu.js +24 -3
- package/lib/components/pisellWalletPassCard/index.d.ts +0 -1
- package/lib/components/productCard/components/MultiDay/index.js +3 -2
- package/lib/components/productCard/components/Packages/components/collapsibleList/utils.js +5 -4
- package/lib/components/productCard/components/Time/components/SelectResource/index.d.ts +3 -0
- package/lib/components/productCard/components/Time/components/SelectResource/index.js +63 -0
- package/lib/components/productCard/components/Time/index.d.ts +1 -1
- package/lib/components/productCard/components/Time/index.js +38 -14
- package/lib/components/productCard/components/Time/index.less +29 -0
- package/lib/components/productCard/index.js +4 -1
- package/lib/components/productCard/locales.d.ts +6 -0
- package/lib/components/productCard/locales.js +7 -1
- package/lib/components/productCard/types.d.ts +4 -0
- package/lib/components/productCard/utils.js +14 -2
- package/lib/components/table/Actions/component/ExportImport/index.d.ts +0 -1
- package/lib/components/table/Table/SelectField/index.d.ts +1 -0
- package/lib/components/table/Table/tableConfig/summary/index.d.ts +1 -0
- package/lib/components/table/Table/utils.d.ts +1 -1
- package/lib/components/tabs/index.js +1 -0
- package/lib/index.d.ts +10 -11
- package/lib/index.js +12 -15
- package/lib/locales/en-US.d.ts +28 -2
- package/lib/locales/en-US.js +29 -3
- package/lib/locales/zh-CN.d.ts +26 -0
- package/lib/locales/zh-CN.js +29 -1
- package/lib/locales/zh-TW.d.ts +26 -0
- package/lib/locales/zh-TW.js +28 -1
- package/lowcode/pisell-good-pass-card/meta.ts +38 -0
- package/lowcode/pisell-good-pass-card/snippets.ts +9 -0
- package/lowcode/product-card/meta.ts +28 -0
- package/package.json +1 -1
|
@@ -5,27 +5,25 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
|
|
|
5
5
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
6
6
|
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
7
7
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
8
|
-
import React, { useState,
|
|
8
|
+
import React, { useState, useRef, useEffect } from 'react';
|
|
9
9
|
import classNames from 'classnames';
|
|
10
|
-
import { useDebounceFn
|
|
10
|
+
import { useDebounceFn } from 'ahooks';
|
|
11
11
|
import ChevronLeft from '@pisell/icon/es/ChevronLeft';
|
|
12
12
|
import ChevronRight from '@pisell/icon/es/ChevronRight';
|
|
13
13
|
import "./index.less";
|
|
14
|
-
var PisellAnchor =
|
|
15
|
-
var
|
|
16
|
-
options =
|
|
17
|
-
tab =
|
|
18
|
-
className =
|
|
19
|
-
style =
|
|
20
|
-
onChange =
|
|
21
|
-
onTabClick =
|
|
22
|
-
containerRef =
|
|
23
|
-
|
|
24
|
-
platform =
|
|
14
|
+
var PisellAnchor = function PisellAnchor(_ref) {
|
|
15
|
+
var _ref$options = _ref.options,
|
|
16
|
+
options = _ref$options === void 0 ? [] : _ref$options,
|
|
17
|
+
tab = _ref.tab,
|
|
18
|
+
className = _ref.className,
|
|
19
|
+
style = _ref.style,
|
|
20
|
+
onChange = _ref.onChange,
|
|
21
|
+
onTabClick = _ref.onTabClick,
|
|
22
|
+
containerRef = _ref.containerRef,
|
|
23
|
+
_ref$platform = _ref.platform,
|
|
24
|
+
platform = _ref$platform === void 0 ? 'pc' : _ref$platform;
|
|
25
25
|
var contentRef = useRef(null);
|
|
26
|
-
var scrollTimeoutRef = useRef(null);
|
|
27
26
|
var isClickScrolling = useRef(false);
|
|
28
|
-
var clickedTabRef = useRef(null);
|
|
29
27
|
var _useState = useState(0),
|
|
30
28
|
_useState2 = _slicedToArray(_useState, 2),
|
|
31
29
|
leftWidth = _useState2[0],
|
|
@@ -38,12 +36,8 @@ var PisellAnchor = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
38
36
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
39
37
|
showButtons = _useState6[0],
|
|
40
38
|
setShowButtons = _useState6[1];
|
|
41
|
-
var _useState7 = useState(null),
|
|
42
|
-
_useState8 = _slicedToArray(_useState7, 2),
|
|
43
|
-
hoveredTab = _useState8[0],
|
|
44
|
-
setHoveredTab = _useState8[1];
|
|
45
39
|
|
|
46
|
-
//
|
|
40
|
+
// 检查是否需要显示左右滚动按钮
|
|
47
41
|
useEffect(function () {
|
|
48
42
|
if (contentRef.current) {
|
|
49
43
|
var _contentRef$current = contentRef.current,
|
|
@@ -53,199 +47,124 @@ var PisellAnchor = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
53
47
|
}
|
|
54
48
|
}, [options]);
|
|
55
49
|
|
|
56
|
-
// 清理定时器
|
|
57
|
-
useEffect(function () {
|
|
58
|
-
return function () {
|
|
59
|
-
if (scrollTimeoutRef.current) {
|
|
60
|
-
clearTimeout(scrollTimeoutRef.current);
|
|
61
|
-
}
|
|
62
|
-
};
|
|
63
|
-
}, []);
|
|
64
|
-
|
|
65
50
|
// 处理水平滚动
|
|
66
|
-
var
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
var
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
// 检查是否滚动到底部
|
|
91
|
-
var isAtBottom = scrollTop + containerHeight >= scrollHeight - 50;
|
|
92
|
-
if (isAtBottom) {
|
|
93
|
-
var lastOption = options[options.length - 1];
|
|
94
|
-
// 不要切回到之前点击的 tab
|
|
95
|
-
if (tab !== lastOption.id && lastOption.id !== clickedTabRef.current) {
|
|
96
|
-
onChange === null || onChange === void 0 || onChange(lastOption.id);
|
|
97
|
-
}
|
|
98
|
-
return;
|
|
51
|
+
var handleHorizontalScroll = useDebounceFn(function (e) {
|
|
52
|
+
var target = e.target;
|
|
53
|
+
var scrollLeft = target.scrollLeft,
|
|
54
|
+
scrollWidth = target.scrollWidth,
|
|
55
|
+
clientWidth = target.clientWidth;
|
|
56
|
+
setLeftWidth(scrollLeft > 0 ? 40 : 0);
|
|
57
|
+
setRightWidth(scrollLeft + clientWidth >= scrollWidth ? 0 : 40);
|
|
58
|
+
}, {
|
|
59
|
+
wait: 200
|
|
60
|
+
}).run;
|
|
61
|
+
|
|
62
|
+
// 处理内容区域滚动
|
|
63
|
+
var handleContentScroll = useDebounceFn(function () {
|
|
64
|
+
if (isClickScrolling.current || !(containerRef !== null && containerRef !== void 0 && containerRef.current)) return;
|
|
65
|
+
var container = containerRef.current;
|
|
66
|
+
var scrollTop = container.scrollTop;
|
|
67
|
+
var containerHeight = container.clientHeight;
|
|
68
|
+
var scrollHeight = container.scrollHeight;
|
|
69
|
+
// 优先检查是否滚动到底部
|
|
70
|
+
var isAtBottom = Math.abs(scrollTop + containerHeight - scrollHeight) < 1;
|
|
71
|
+
if (isAtBottom) {
|
|
72
|
+
var lastOption = options[options.length - 1];
|
|
73
|
+
if (lastOption && tab !== lastOption.id) {
|
|
74
|
+
onChange === null || onChange === void 0 || onChange(lastOption.id);
|
|
99
75
|
}
|
|
76
|
+
return; // 如果在底部,直接返回,不再计算可视占比
|
|
77
|
+
}
|
|
100
78
|
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
var
|
|
112
|
-
var
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
// 计算可见度
|
|
122
|
-
var elementTopRelativeToViewport = elementOffsetTop - scrollTop;
|
|
123
|
-
var isTopVisible = elementTopRelativeToViewport >= headerHeight && elementTopRelativeToViewport <= containerHeight;
|
|
124
|
-
var isBottomVisible = elementTopRelativeToViewport + elementHeight >= headerHeight && elementTopRelativeToViewport + elementHeight <= containerHeight;
|
|
125
|
-
var isElementPartiallyVisible = isTopVisible || isBottomVisible || elementTopRelativeToViewport < headerHeight && elementTopRelativeToViewport + elementHeight > containerHeight;
|
|
126
|
-
var distance = Math.abs(elementTopRelativeToViewport - headerHeight);
|
|
127
|
-
if (distance < minDistance) {
|
|
128
|
-
minDistance = distance;
|
|
129
|
-
closestOption = option;
|
|
130
|
-
}
|
|
79
|
+
// 如果不在底部,再计算可视占比
|
|
80
|
+
var maxVisibleRatio = 0;
|
|
81
|
+
var activeOption = null;
|
|
82
|
+
var _iterator = _createForOfIteratorHelper(options),
|
|
83
|
+
_step;
|
|
84
|
+
try {
|
|
85
|
+
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
86
|
+
var option = _step.value;
|
|
87
|
+
var element = document.querySelector("[data-section=\"".concat(option.id, "\"]"));
|
|
88
|
+
if (element instanceof HTMLElement) {
|
|
89
|
+
var elementTop = element.offsetTop;
|
|
90
|
+
var elementHeight = element.offsetHeight;
|
|
91
|
+
var elementBottom = elementTop + elementHeight;
|
|
92
|
+
var visibleTop = Math.max(elementTop, scrollTop);
|
|
93
|
+
var visibleBottom = Math.min(elementBottom, scrollTop + containerHeight);
|
|
94
|
+
var visibleHeight = Math.max(0, visibleBottom - visibleTop);
|
|
95
|
+
var visibleRatio = visibleHeight / elementHeight;
|
|
96
|
+
if (visibleRatio > maxVisibleRatio) {
|
|
97
|
+
maxVisibleRatio = visibleRatio;
|
|
98
|
+
activeOption = option;
|
|
131
99
|
}
|
|
132
100
|
}
|
|
133
|
-
|
|
134
|
-
// 不要切回到之前点击的 tab
|
|
135
|
-
} catch (err) {
|
|
136
|
-
_iterator.e(err);
|
|
137
|
-
} finally {
|
|
138
|
-
_iterator.f();
|
|
139
|
-
}
|
|
140
|
-
if (closestOption && tab !== closestOption.id && closestOption.id !== clickedTabRef.current && minDistance < 50) {
|
|
141
|
-
onChange === null || onChange === void 0 || onChange(closestOption.id);
|
|
142
101
|
}
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
}
|
|
146
|
-
|
|
102
|
+
} catch (err) {
|
|
103
|
+
_iterator.e(err);
|
|
104
|
+
} finally {
|
|
105
|
+
_iterator.f();
|
|
106
|
+
}
|
|
107
|
+
if (activeOption && tab !== activeOption.id) {
|
|
108
|
+
onChange === null || onChange === void 0 || onChange(activeOption.id);
|
|
109
|
+
}
|
|
110
|
+
}, {
|
|
111
|
+
wait: 100
|
|
112
|
+
}).run;
|
|
147
113
|
|
|
148
114
|
// 监听容器滚动
|
|
149
115
|
useEffect(function () {
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
handleScrollThrottled();
|
|
154
|
-
}
|
|
155
|
-
};
|
|
156
|
-
var container = containerRef.current;
|
|
157
|
-
container.addEventListener('scroll', handleScroll);
|
|
116
|
+
var container = containerRef === null || containerRef === void 0 ? void 0 : containerRef.current;
|
|
117
|
+
if (!container) return;
|
|
118
|
+
container.addEventListener('scroll', handleContentScroll);
|
|
158
119
|
return function () {
|
|
159
|
-
container.removeEventListener('scroll',
|
|
120
|
+
return container.removeEventListener('scroll', handleContentScroll);
|
|
160
121
|
};
|
|
161
|
-
}, [
|
|
122
|
+
}, [handleContentScroll]);
|
|
162
123
|
|
|
163
|
-
//
|
|
124
|
+
// 点击锚点,滚动到对应位置
|
|
164
125
|
var handleOptionClick = function handleOptionClick(item) {
|
|
165
|
-
// 添加调试日志
|
|
166
|
-
console.log('PisellAnchor: Tab clicked', item.id);
|
|
167
|
-
if (scrollTimeoutRef.current) {
|
|
168
|
-
clearTimeout(scrollTimeoutRef.current);
|
|
169
|
-
}
|
|
170
|
-
|
|
171
|
-
// 更新选中项
|
|
172
126
|
onChange === null || onChange === void 0 || onChange(item.id);
|
|
173
|
-
|
|
174
|
-
// 触发点击事件回调
|
|
175
127
|
onTabClick === null || onTabClick === void 0 || onTabClick();
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
// 尝试多种方式查找目标元素
|
|
179
|
-
var elementById = document.getElementById(String(item.id));
|
|
180
|
-
var elementByDataAttr = document.querySelector("[data-section=\"".concat(String(item.id), "\"]"));
|
|
181
|
-
var element = elementById || elementByDataAttr;
|
|
182
|
-
|
|
183
|
-
// 添加调试日志
|
|
184
|
-
console.log('PisellAnchor: Target element found?', !!element);
|
|
185
|
-
console.log('PisellAnchor: Container ref exists?', !!(containerRef !== null && containerRef !== void 0 && containerRef.current));
|
|
186
|
-
if (element && containerRef !== null && containerRef !== void 0 && containerRef.current) {
|
|
128
|
+
var targetElement = document.querySelector("[data-section=\"".concat(item.id, "\"]"));
|
|
129
|
+
if (targetElement instanceof HTMLElement && containerRef !== null && containerRef !== void 0 && containerRef.current) {
|
|
187
130
|
isClickScrolling.current = true;
|
|
188
|
-
clickedTabRef.current = item.id;
|
|
189
|
-
|
|
190
|
-
// 使用requestAnimationFrame确保DOM更新后再滚动
|
|
191
|
-
requestAnimationFrame(function () {
|
|
192
|
-
if (!(containerRef !== null && containerRef !== void 0 && containerRef.current)) return;
|
|
193
|
-
|
|
194
|
-
// 使用类型断言解决TS错误
|
|
195
|
-
var htmlElement = element;
|
|
196
|
-
|
|
197
|
-
// 更准确的滚动位置计算
|
|
198
|
-
var headerHeight = 65; // 使用一致的头部高度
|
|
199
|
-
var elementOffsetTop = htmlElement.offsetTop; // 使用offsetTop而不是getBoundingClientRect()
|
|
200
|
-
|
|
201
|
-
// 添加调试日志
|
|
202
|
-
console.log('PisellAnchor: Scrolling using offsetTop', {
|
|
203
|
-
elementOffsetTop: elementOffsetTop,
|
|
204
|
-
targetScrollTop: elementOffsetTop - headerHeight
|
|
205
|
-
});
|
|
206
|
-
|
|
207
|
-
// 执行滚动 - 使用更直接的offsetTop定位
|
|
208
|
-
containerRef.current.scrollTo({
|
|
209
|
-
top: elementOffsetTop - headerHeight,
|
|
210
|
-
behavior: 'smooth'
|
|
211
|
-
});
|
|
212
|
-
|
|
213
|
-
// 添加备份滚动机制
|
|
214
|
-
setTimeout(function () {
|
|
215
|
-
if (!(containerRef !== null && containerRef !== void 0 && containerRef.current)) return;
|
|
216
131
|
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
132
|
+
// 计算目标元素之前所有元素的高度总和
|
|
133
|
+
var scrollDistance = 0;
|
|
134
|
+
var _iterator2 = _createForOfIteratorHelper(options),
|
|
135
|
+
_step2;
|
|
136
|
+
try {
|
|
137
|
+
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
|
|
138
|
+
var option = _step2.value;
|
|
139
|
+
if (option.id === item.id) break;
|
|
140
|
+
var element = document.querySelector("[data-section=\"".concat(option.id, "\"]"));
|
|
141
|
+
if (element instanceof HTMLElement) {
|
|
142
|
+
scrollDistance += element.offsetHeight;
|
|
143
|
+
}
|
|
144
|
+
}
|
|
145
|
+
} catch (err) {
|
|
146
|
+
_iterator2.e(err);
|
|
147
|
+
} finally {
|
|
148
|
+
_iterator2.f();
|
|
149
|
+
}
|
|
150
|
+
containerRef.current.scrollTo({
|
|
151
|
+
top: scrollDistance,
|
|
152
|
+
behavior: 'smooth'
|
|
223
153
|
});
|
|
224
|
-
|
|
225
|
-
// 延迟重置状态
|
|
226
|
-
scrollTimeoutRef.current = setTimeout(function () {
|
|
154
|
+
setTimeout(function () {
|
|
227
155
|
isClickScrolling.current = false;
|
|
228
|
-
clickedTabRef.current = null;
|
|
229
156
|
}, 1000);
|
|
230
|
-
} else {
|
|
231
|
-
console.warn('PisellAnchor: Cannot scroll, element or container not found', {
|
|
232
|
-
elementId: item.id,
|
|
233
|
-
elementByIdExists: !!elementById,
|
|
234
|
-
elementByDataAttrExists: !!elementByDataAttr,
|
|
235
|
-
containerExists: !!(containerRef !== null && containerRef !== void 0 && containerRef.current)
|
|
236
|
-
});
|
|
237
157
|
}
|
|
238
158
|
};
|
|
239
159
|
|
|
240
160
|
// 左右按钮点击处理
|
|
241
|
-
var
|
|
161
|
+
var handlePageChange = function handlePageChange(type) {
|
|
242
162
|
if (contentRef.current) {
|
|
243
163
|
var _contentRef$current2 = contentRef.current,
|
|
244
164
|
scrollLeft = _contentRef$current2.scrollLeft,
|
|
245
165
|
clientWidth = _contentRef$current2.clientWidth;
|
|
246
|
-
var newScrollLeft = scrollLeft + (type === 'left' ? -clientWidth : clientWidth);
|
|
247
166
|
contentRef.current.scrollTo({
|
|
248
|
-
left:
|
|
167
|
+
left: scrollLeft + (type === 'left' ? -clientWidth : clientWidth),
|
|
249
168
|
behavior: 'smooth'
|
|
250
169
|
});
|
|
251
170
|
}
|
|
@@ -259,34 +178,25 @@ var PisellAnchor = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
259
178
|
width: leftWidth
|
|
260
179
|
},
|
|
261
180
|
onClick: function onClick() {
|
|
262
|
-
return
|
|
181
|
+
return handlePageChange('left');
|
|
263
182
|
}
|
|
264
183
|
}, /*#__PURE__*/React.createElement(ChevronLeft, {
|
|
265
184
|
className: "pisell-anchor-tabs-btn-icon"
|
|
266
185
|
})), /*#__PURE__*/React.createElement("div", {
|
|
267
186
|
ref: contentRef,
|
|
268
187
|
className: "pisell-anchor-tabs-content",
|
|
269
|
-
|
|
270
|
-
onScroll: onScrollDebounced
|
|
188
|
+
onScroll: handleHorizontalScroll
|
|
271
189
|
}, options.map(function (item) {
|
|
272
190
|
return /*#__PURE__*/React.createElement("div", {
|
|
273
191
|
key: item.id,
|
|
274
|
-
id: "tab-".concat(item.id),
|
|
275
192
|
className: classNames('pisell-anchor-tabs-tab', {
|
|
276
193
|
'pisell-anchor-tabs-tab-active': tab === item.id
|
|
277
194
|
}),
|
|
278
195
|
onClick: function onClick() {
|
|
279
|
-
|
|
280
|
-
handleOptionClick(item);
|
|
196
|
+
return handleOptionClick(item);
|
|
281
197
|
}
|
|
282
198
|
}, /*#__PURE__*/React.createElement("span", {
|
|
283
|
-
className: "pisell-anchor-tabs-tab-content"
|
|
284
|
-
onClick: function onClick(e) {
|
|
285
|
-
// 防止事件冒泡问题
|
|
286
|
-
e.stopPropagation();
|
|
287
|
-
console.log('PisellAnchor: Tab span clicked', item.id);
|
|
288
|
-
handleOptionClick(item);
|
|
289
|
-
}
|
|
199
|
+
className: "pisell-anchor-tabs-tab-content"
|
|
290
200
|
}, item.name));
|
|
291
201
|
})), showButtons && /*#__PURE__*/React.createElement("div", {
|
|
292
202
|
className: "pisell-anchor-tabs-btn-right",
|
|
@@ -294,10 +204,10 @@ var PisellAnchor = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
294
204
|
width: rightWidth
|
|
295
205
|
},
|
|
296
206
|
onClick: function onClick() {
|
|
297
|
-
return
|
|
207
|
+
return handlePageChange('right');
|
|
298
208
|
}
|
|
299
209
|
}, /*#__PURE__*/React.createElement(ChevronRight, {
|
|
300
210
|
className: "pisell-anchor-tabs-btn-icon"
|
|
301
211
|
})));
|
|
302
|
-
}
|
|
212
|
+
};
|
|
303
213
|
export default PisellAnchor;
|
|
@@ -114,7 +114,7 @@
|
|
|
114
114
|
display: flex;
|
|
115
115
|
align-items: center;
|
|
116
116
|
justify-content: center;
|
|
117
|
-
background:
|
|
117
|
+
background:none;
|
|
118
118
|
cursor: pointer;
|
|
119
119
|
transition: width 300ms ease;
|
|
120
120
|
user-select: none;
|
|
@@ -134,12 +134,10 @@
|
|
|
134
134
|
|
|
135
135
|
.pisell-anchor-tabs-btn-left {
|
|
136
136
|
left: 0;
|
|
137
|
-
background: linear-gradient(270deg, rgba(255, 255, 255, 0.8) 0%, #fff 70%);
|
|
138
137
|
}
|
|
139
138
|
|
|
140
139
|
.pisell-anchor-tabs-btn-right {
|
|
141
140
|
right: 0;
|
|
142
|
-
background: linear-gradient(90deg, rgba(255, 255, 255, 0.8) 0%, #fff 70%);
|
|
143
141
|
}
|
|
144
142
|
|
|
145
143
|
.pisell-anchor-tabs-content {
|
|
@@ -172,7 +170,7 @@
|
|
|
172
170
|
border-radius: 100px;
|
|
173
171
|
|
|
174
172
|
&:hover:not(.pisell-anchor-tabs-tab-active) {
|
|
175
|
-
color:
|
|
173
|
+
color: inherit;
|
|
176
174
|
}
|
|
177
175
|
|
|
178
176
|
&.pisell-anchor-tabs-tab-active {
|
|
@@ -189,7 +187,7 @@
|
|
|
189
187
|
}
|
|
190
188
|
|
|
191
189
|
.pisell-anchor {
|
|
192
|
-
border-bottom: 1px solid #
|
|
190
|
+
border-bottom: 1px solid #eaecf0;
|
|
193
191
|
|
|
194
192
|
&.pisell-anchor-no-border {
|
|
195
193
|
border-bottom: none;
|
|
@@ -73,7 +73,8 @@ var PisellAvatar = function PisellAvatar(_ref) {
|
|
|
73
73
|
return children;
|
|
74
74
|
}
|
|
75
75
|
return /*#__PURE__*/React.createElement(Iconfont, {
|
|
76
|
-
type: "pisell2-user-01"
|
|
76
|
+
type: "pisell2-user-01",
|
|
77
|
+
className: "pisell-avatar-icon"
|
|
77
78
|
});
|
|
78
79
|
}, [useTextAvatar, children]);
|
|
79
80
|
return /*#__PURE__*/React.createElement(Avatar, _extends({}, restProps, {
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
align-items: center;
|
|
6
6
|
justify-content: center;
|
|
7
7
|
background: var(--Gray-100, #f2f4f7); // 默认背景色
|
|
8
|
-
border: 1px solid #
|
|
8
|
+
border: 1px solid #d0d5dd; // 移除默认边框
|
|
9
9
|
box-sizing: border-box;
|
|
10
10
|
|
|
11
11
|
img {
|
|
@@ -14,6 +14,7 @@
|
|
|
14
14
|
|
|
15
15
|
.anticon {
|
|
16
16
|
font-size: inherit !important;
|
|
17
|
+
color: var(--Gray-600, #475467) !important;
|
|
17
18
|
}
|
|
18
19
|
|
|
19
20
|
// 文本头像样式
|
|
@@ -58,6 +58,9 @@ var PisellCustomCheckboxGroup = function PisellCustomCheckboxGroup(_ref) {
|
|
|
58
58
|
return /*#__PURE__*/React.createElement("div", {
|
|
59
59
|
onClick: function onClick() {
|
|
60
60
|
return _onClick(item);
|
|
61
|
+
},
|
|
62
|
+
style: {
|
|
63
|
+
height: '100%'
|
|
61
64
|
}
|
|
62
65
|
}, item !== null && item !== void 0 && item.isAddCard && renderAddItem ? renderAddItem(item) : rest === null || rest === void 0 || (_rest$renderItem = rest.renderItem) === null || _rest$renderItem === void 0 ? void 0 : _rest$renderItem.call(rest, item, index));
|
|
63
66
|
};
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './index.less';
|
|
3
|
+
interface ApplicableProductDetails {
|
|
4
|
+
amount: string;
|
|
5
|
+
type: string;
|
|
6
|
+
resource_id: number;
|
|
7
|
+
title: string;
|
|
8
|
+
original_amount: string;
|
|
9
|
+
}
|
|
10
|
+
interface Discount {
|
|
11
|
+
id: number;
|
|
12
|
+
product_name: string;
|
|
13
|
+
encoded: string;
|
|
14
|
+
code: string;
|
|
15
|
+
tag: string;
|
|
16
|
+
expire_time?: string;
|
|
17
|
+
product_id: number;
|
|
18
|
+
relation_type: string;
|
|
19
|
+
par_value: string;
|
|
20
|
+
used_par_value: string;
|
|
21
|
+
limit_status: string;
|
|
22
|
+
limited_relation_product_data: any;
|
|
23
|
+
balance: string;
|
|
24
|
+
format_title: any;
|
|
25
|
+
product: any;
|
|
26
|
+
savedAmount: number;
|
|
27
|
+
isDisabled: boolean;
|
|
28
|
+
isSelected?: boolean;
|
|
29
|
+
isAvailable?: boolean;
|
|
30
|
+
isUsed?: boolean;
|
|
31
|
+
applicableProductIds?: number[];
|
|
32
|
+
applicableProductDetails: ApplicableProductDetails[];
|
|
33
|
+
appliedProductDetails: any[];
|
|
34
|
+
}
|
|
35
|
+
export interface PisellGoodPassCardProps {
|
|
36
|
+
/**数据源 */
|
|
37
|
+
dataSource: Array<Discount>;
|
|
38
|
+
/**事件 */
|
|
39
|
+
onChange?: (current: {
|
|
40
|
+
id: string | number;
|
|
41
|
+
isSelected: boolean;
|
|
42
|
+
}) => void;
|
|
43
|
+
/**样式 */
|
|
44
|
+
style: React.CSSProperties;
|
|
45
|
+
}
|
|
46
|
+
declare const index: (props: PisellGoodPassCardProps) => JSX.Element;
|
|
47
|
+
export default index;
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
7
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
8
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
9
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
10
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
11
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
12
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
13
|
+
import React, { useState } from 'react';
|
|
14
|
+
import { Checkbox, Divider, Typography } from 'antd';
|
|
15
|
+
import { PisellText, PisellCard, PisellModal } from "../../index";
|
|
16
|
+
import { getText } from "../../locales";
|
|
17
|
+
import useEngineContext from "../../hooks/useEngineContext";
|
|
18
|
+
import "./index.less";
|
|
19
|
+
var clsPrefix = 'pisell-good-pass-card';
|
|
20
|
+
var index = function index(props) {
|
|
21
|
+
var _context$appHelper;
|
|
22
|
+
var context = useEngineContext();
|
|
23
|
+
var _context$appHelper$ut = (_context$appHelper = context.appHelper) === null || _context$appHelper === void 0 ? void 0 : _context$appHelper.utils,
|
|
24
|
+
translation = _context$appHelper$ut.translation;
|
|
25
|
+
var _props$dataSource = props.dataSource,
|
|
26
|
+
dataSource = _props$dataSource === void 0 ? [] : _props$dataSource,
|
|
27
|
+
onChange = props.onChange,
|
|
28
|
+
_props$style = props.style,
|
|
29
|
+
style = _props$style === void 0 ? {} : _props$style;
|
|
30
|
+
var _useState = useState(false),
|
|
31
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
32
|
+
showModal = _useState2[0],
|
|
33
|
+
setShowModal = _useState2[1];
|
|
34
|
+
console.log('pisell good card datasource', dataSource);
|
|
35
|
+
var handleChange = function handleChange(newValue) {
|
|
36
|
+
if (onChange) {
|
|
37
|
+
onChange(newValue);
|
|
38
|
+
}
|
|
39
|
+
};
|
|
40
|
+
var handleItemChange = function handleItemChange(item, checked) {
|
|
41
|
+
handleChange({
|
|
42
|
+
id: item.id,
|
|
43
|
+
isSelected: checked
|
|
44
|
+
});
|
|
45
|
+
};
|
|
46
|
+
var renderVoucherContent = function renderVoucherContent(item) {
|
|
47
|
+
return /*#__PURE__*/React.createElement("span", null, getText('pisell2.text.goodpass.save'), " ", /*#__PURE__*/React.createElement(PisellText.Amount, {
|
|
48
|
+
value: item.savedAmount
|
|
49
|
+
}));
|
|
50
|
+
};
|
|
51
|
+
var renderActionElement = function renderActionElement(item) {
|
|
52
|
+
var isChecked = item.isSelected;
|
|
53
|
+
return /*#__PURE__*/React.createElement(Checkbox, {
|
|
54
|
+
disabled: item.isDisabled,
|
|
55
|
+
style: {
|
|
56
|
+
marginLeft: 8
|
|
57
|
+
},
|
|
58
|
+
checked: isChecked,
|
|
59
|
+
onChange: function onChange(e) {
|
|
60
|
+
return handleItemChange(item, e.target.checked);
|
|
61
|
+
}
|
|
62
|
+
});
|
|
63
|
+
};
|
|
64
|
+
var renderVoucherItem = function renderVoucherItem(item) {
|
|
65
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
66
|
+
key: item.id,
|
|
67
|
+
className: "".concat(clsPrefix, "-voucher-item")
|
|
68
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
69
|
+
className: "item-title"
|
|
70
|
+
}, translation(item.format_title)), /*#__PURE__*/React.createElement("div", {
|
|
71
|
+
className: "item-content"
|
|
72
|
+
}, renderVoucherContent(item), renderActionElement(item)));
|
|
73
|
+
};
|
|
74
|
+
var renderModal = function renderModal() {
|
|
75
|
+
return /*#__PURE__*/React.createElement(PisellModal, {
|
|
76
|
+
title: getText('pisell2.text.goodpass.product-vouchers'),
|
|
77
|
+
footer: null,
|
|
78
|
+
open: showModal,
|
|
79
|
+
onCancel: function onCancel() {
|
|
80
|
+
return setShowModal(false);
|
|
81
|
+
},
|
|
82
|
+
className: "".concat(clsPrefix, "-all-items-modal")
|
|
83
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
84
|
+
style: {
|
|
85
|
+
padding: '10px 0'
|
|
86
|
+
}
|
|
87
|
+
}, dataSource.map(renderVoucherItem)));
|
|
88
|
+
};
|
|
89
|
+
var renderMixedMode = function renderMixedMode() {
|
|
90
|
+
var list = dataSource.length > 3 ? dataSource.slice(0, 3) : dataSource;
|
|
91
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
92
|
+
className: "".concat(clsPrefix, "-header")
|
|
93
|
+
}, /*#__PURE__*/React.createElement("div", null, getText('pisell2.text.goodpass.product-vouchers')), /*#__PURE__*/React.createElement(Typography.Text, {
|
|
94
|
+
underline: true,
|
|
95
|
+
onClick: function onClick() {
|
|
96
|
+
return setShowModal(true);
|
|
97
|
+
}
|
|
98
|
+
}, getText('pisell2.text.goodpass.view-more'))), /*#__PURE__*/React.createElement(Divider, {
|
|
99
|
+
style: {
|
|
100
|
+
margin: 4
|
|
101
|
+
}
|
|
102
|
+
}), /*#__PURE__*/React.createElement("div", {
|
|
103
|
+
className: "".concat(clsPrefix, "-body")
|
|
104
|
+
}, list.map(renderVoucherItem)));
|
|
105
|
+
};
|
|
106
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, renderModal(), /*#__PURE__*/React.createElement(PisellCard, {
|
|
107
|
+
padding: 8,
|
|
108
|
+
borderRadius: 8,
|
|
109
|
+
style: _objectSpread({
|
|
110
|
+
width: 378
|
|
111
|
+
}, style),
|
|
112
|
+
className: clsPrefix
|
|
113
|
+
}, renderMixedMode()));
|
|
114
|
+
};
|
|
115
|
+
export default index;
|