@pisell/materials 2.2.91 → 2.2.93
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 +4 -4
- package/build/lowcode/preview.js +164 -148
- package/build/lowcode/render/default/view.css +1 -1
- package/build/lowcode/render/default/view.js +39 -34
- package/build/lowcode/view.css +1 -1
- package/build/lowcode/view.js +39 -34
- package/es/components/colorPicker/index.d.ts +0 -1
- package/es/components/dataSourceComponents/fields/Select/index.d.ts +0 -1
- package/es/components/dataSourceComponents/fields/index.d.ts +0 -1
- package/es/components/filter/components/items/index.d.ts +0 -1
- package/es/components/filter/components/items/text/Editor/index.d.ts +0 -1
- package/es/components/filter/components/items/text/Preview/index.d.ts +0 -1
- package/es/components/filter/components/items/text/index.d.ts +0 -1
- package/es/components/pisellGoodPassCard/index.d.ts +1 -0
- package/es/components/pisellGoodPassCard/index.js +13 -2
- package/es/components/productCard/cartSkuCard/components/basicInfo/index.js +17 -5
- package/es/components/productCard/cartSkuCard/components/basicInfo/index.less +15 -0
- package/es/components/productCard/cartSkuCard/components/swipeAction/index.d.ts +43 -0
- package/es/components/productCard/cartSkuCard/components/swipeAction/index.js +282 -0
- package/es/components/productCard/cartSkuCard/components/swipeAction/index.less +35 -0
- package/es/components/productCard/cartSkuCard/index.d.ts +1 -0
- package/es/components/productCard/cartSkuCard/index.js +28 -9
- package/es/components/productCard/cartSkuCard/index.less +1 -1
- package/es/components/productCard/components/Header/index.js +17 -5
- package/es/components/productCard/components/Header/index.less +15 -0
- package/es/components/productCard/index.js +3 -2
- package/es/components/productCard/index.less +6 -0
- package/es/components/table/Table/SelectField/index.d.ts +0 -1
- package/es/components/table/Table/tableConfig/summary/index.d.ts +0 -1
- package/lib/components/colorPicker/index.d.ts +0 -1
- package/lib/components/dataSourceComponents/fields/Select/index.d.ts +0 -1
- package/lib/components/dataSourceComponents/fields/index.d.ts +0 -1
- package/lib/components/filter/components/items/index.d.ts +0 -1
- package/lib/components/filter/components/items/text/Editor/index.d.ts +0 -1
- package/lib/components/filter/components/items/text/Preview/index.d.ts +0 -1
- package/lib/components/filter/components/items/text/index.d.ts +0 -1
- package/lib/components/pisellGoodPassCard/index.d.ts +1 -0
- package/lib/components/pisellGoodPassCard/index.js +6 -2
- package/lib/components/productCard/cartSkuCard/components/basicInfo/index.js +10 -2
- package/lib/components/productCard/cartSkuCard/components/basicInfo/index.less +15 -0
- package/lib/components/productCard/cartSkuCard/components/swipeAction/index.d.ts +43 -0
- package/lib/components/productCard/cartSkuCard/components/swipeAction/index.js +330 -0
- package/lib/components/productCard/cartSkuCard/components/swipeAction/index.less +35 -0
- package/lib/components/productCard/cartSkuCard/index.d.ts +1 -0
- package/lib/components/productCard/cartSkuCard/index.js +29 -13
- package/lib/components/productCard/cartSkuCard/index.less +1 -1
- package/lib/components/productCard/components/Header/index.js +16 -8
- package/lib/components/productCard/components/Header/index.less +15 -0
- package/lib/components/productCard/index.js +4 -2
- package/lib/components/productCard/index.less +6 -0
- package/lib/components/table/Table/SelectField/index.d.ts +0 -1
- package/lib/components/table/Table/tableConfig/summary/index.d.ts +0 -1
- package/package.json +6 -4
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
declare const SelectWithDataSource: (props: import("antd").SelectProps<any, import("antd/es/select").DefaultOptionType> & import("../../dataSourceForm/utils").WithModeProps & import("../../dataSourceForm/utils").WithFormItemProps & {
|
|
3
2
|
options?: any;
|
|
4
3
|
optionSourceType?: "default" | "custom" | "api" | undefined;
|
|
@@ -44,6 +44,7 @@ export interface PisellGoodPassCardProps {
|
|
|
44
44
|
style: React.CSSProperties;
|
|
45
45
|
/**快捷展示排序 */
|
|
46
46
|
mixedSort?: (val: Discount[]) => Discount[];
|
|
47
|
+
isInModal: boolean;
|
|
47
48
|
}
|
|
48
49
|
declare const index: (props: PisellGoodPassCardProps) => JSX.Element;
|
|
49
50
|
export default index;
|
|
@@ -110,13 +110,24 @@ var index = function index(props) {
|
|
|
110
110
|
className: "".concat(clsPrefix, "-body")
|
|
111
111
|
}, list.map(renderVoucherItem)));
|
|
112
112
|
};
|
|
113
|
-
|
|
113
|
+
var renderModalMode = function renderModalMode() {
|
|
114
|
+
var sortList = (mixedSort === null || mixedSort === void 0 ? void 0 : mixedSort(dataSource)) || dataSource;
|
|
115
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
116
|
+
style: {
|
|
117
|
+
padding: '10px 0',
|
|
118
|
+
display: "flex",
|
|
119
|
+
flexDirection: "column",
|
|
120
|
+
gap: 12
|
|
121
|
+
}
|
|
122
|
+
}, sortList.map(renderVoucherItem));
|
|
123
|
+
};
|
|
124
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, !props.isInModal ? renderModal() : null, /*#__PURE__*/React.createElement(PisellCard, {
|
|
114
125
|
padding: 8,
|
|
115
126
|
borderRadius: 8,
|
|
116
127
|
style: _objectSpread({
|
|
117
128
|
width: 378
|
|
118
129
|
}, style),
|
|
119
130
|
className: clsPrefix
|
|
120
|
-
}, renderMixedMode()));
|
|
131
|
+
}, props.isInModal ? renderModalMode() : renderMixedMode()));
|
|
121
132
|
};
|
|
122
133
|
export default index;
|
|
@@ -28,17 +28,29 @@ var BasicInfo = function BasicInfo(props) {
|
|
|
28
28
|
className: classNames("num-tag", {
|
|
29
29
|
'is-main': isMainProduct
|
|
30
30
|
})
|
|
31
|
-
}, num <
|
|
31
|
+
}, num < 100 ? num : '99+');
|
|
32
32
|
return null;
|
|
33
33
|
};
|
|
34
34
|
var hasSpecs = (bundle === null || bundle === void 0 ? void 0 : bundle.length) || (options === null || options === void 0 ? void 0 : options.length) || product_option_string;
|
|
35
|
+
var renderImage = function renderImage() {
|
|
36
|
+
if (!isShowImage) return null;
|
|
37
|
+
if (image) {
|
|
38
|
+
return /*#__PURE__*/React.createElement("img", {
|
|
39
|
+
src: imageAli.ali(image, 64),
|
|
40
|
+
className: "product-cover"
|
|
41
|
+
});
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
// 如果没有图片,显示文字图片
|
|
45
|
+
var displayText = name ? name.slice(0, 2) : '';
|
|
46
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
47
|
+
className: "product-cover-text"
|
|
48
|
+
}, displayText);
|
|
49
|
+
};
|
|
35
50
|
return /*#__PURE__*/React.createElement("div", {
|
|
36
51
|
className: "".concat(PREFIX, "__basic-info"),
|
|
37
52
|
style: style || {}
|
|
38
|
-
}, renderNumTag(), isShowImage
|
|
39
|
-
src: imageAli.ali(image, 64),
|
|
40
|
-
className: "product-cover"
|
|
41
|
-
}), (!isShowImage || !image) && num > 1 ? /*#__PURE__*/React.createElement("div", {
|
|
53
|
+
}, renderNumTag(), renderImage(), (!isShowImage || !image && !name) && num > 1 ? /*#__PURE__*/React.createElement("div", {
|
|
42
54
|
style: {
|
|
43
55
|
width: 26
|
|
44
56
|
}
|
|
@@ -36,6 +36,21 @@
|
|
|
36
36
|
border-radius: 6px;
|
|
37
37
|
}
|
|
38
38
|
|
|
39
|
+
.product-cover-text {
|
|
40
|
+
width: 48px;
|
|
41
|
+
height: 48px;
|
|
42
|
+
flex-shrink: 0;
|
|
43
|
+
border-radius: 8px;
|
|
44
|
+
background-color: #DEDEDE;
|
|
45
|
+
color: #7E7E7E;
|
|
46
|
+
display: flex;
|
|
47
|
+
align-items: center;
|
|
48
|
+
justify-content: center;
|
|
49
|
+
font-size: 22px;
|
|
50
|
+
font-weight: 500;
|
|
51
|
+
line-height: 1;
|
|
52
|
+
}
|
|
53
|
+
|
|
39
54
|
.product-info {
|
|
40
55
|
flex: 1;
|
|
41
56
|
display: flex;
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
declare type NativeProps<S extends string = never> = {
|
|
4
|
+
className?: string;
|
|
5
|
+
style?: React.CSSProperties & Partial<Record<S, string>>;
|
|
6
|
+
};
|
|
7
|
+
declare type PropagationEvent = 'click';
|
|
8
|
+
import './index.less';
|
|
9
|
+
declare type SideType = 'left' | 'right';
|
|
10
|
+
export declare type SwipeActionRef = {
|
|
11
|
+
close: () => void;
|
|
12
|
+
show: (side?: SideType) => void;
|
|
13
|
+
};
|
|
14
|
+
declare type ActionColor = 'light' | 'weak' | 'primary' | 'success' | 'warning' | 'danger';
|
|
15
|
+
export declare type Action = {
|
|
16
|
+
key: string | number;
|
|
17
|
+
text: ReactNode;
|
|
18
|
+
color?: ActionColor | string;
|
|
19
|
+
onClick?: (e: React.MouseEvent) => void;
|
|
20
|
+
};
|
|
21
|
+
export declare type SwipeActionProps = {
|
|
22
|
+
rightActions?: Action[];
|
|
23
|
+
leftActions?: Action[];
|
|
24
|
+
onAction?: (action: Action, e: React.MouseEvent) => void;
|
|
25
|
+
closeOnTouchOutside?: boolean;
|
|
26
|
+
closeOnAction?: boolean;
|
|
27
|
+
children: ReactNode;
|
|
28
|
+
stopPropagation?: PropagationEvent[];
|
|
29
|
+
onActionsReveal?: (side: SideType) => void;
|
|
30
|
+
onClose?: () => void;
|
|
31
|
+
} & NativeProps<'--background'>;
|
|
32
|
+
export declare const SwipeAction: React.ForwardRefExoticComponent<{
|
|
33
|
+
rightActions?: Action[] | undefined;
|
|
34
|
+
leftActions?: Action[] | undefined;
|
|
35
|
+
onAction?: ((action: Action, e: React.MouseEvent) => void) | undefined;
|
|
36
|
+
closeOnTouchOutside?: boolean | undefined;
|
|
37
|
+
closeOnAction?: boolean | undefined;
|
|
38
|
+
children: ReactNode;
|
|
39
|
+
stopPropagation?: "click"[] | undefined;
|
|
40
|
+
onActionsReveal?: ((side: SideType) => void) | undefined;
|
|
41
|
+
onClose?: (() => void) | undefined;
|
|
42
|
+
} & NativeProps<"--background"> & React.RefAttributes<SwipeActionRef>>;
|
|
43
|
+
export {};
|
|
@@ -0,0 +1,282 @@
|
|
|
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 _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
3
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
4
|
+
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."); }
|
|
5
|
+
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); }
|
|
6
|
+
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; }
|
|
7
|
+
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; } }
|
|
8
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
9
|
+
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; }
|
|
10
|
+
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; }
|
|
11
|
+
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; }
|
|
12
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
13
|
+
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); }
|
|
14
|
+
import { animated, useSpring } from '@react-spring/web';
|
|
15
|
+
import { useDrag } from '@use-gesture/react/dist/use-gesture-react.cjs';
|
|
16
|
+
import React, { forwardRef, useEffect, useImperativeHandle, useRef } from 'react';
|
|
17
|
+
// 本地实现的工具函数和类型
|
|
18
|
+
|
|
19
|
+
// withNativeProps 工具函数
|
|
20
|
+
function withNativeProps(props, element) {
|
|
21
|
+
var p = _objectSpread({}, element.props);
|
|
22
|
+
if (props.className) {
|
|
23
|
+
p.className = props.className + (element.props.className ? " ".concat(element.props.className) : '');
|
|
24
|
+
}
|
|
25
|
+
if (props.style) {
|
|
26
|
+
p.style = _objectSpread(_objectSpread({}, props.style), element.props.style);
|
|
27
|
+
}
|
|
28
|
+
return /*#__PURE__*/React.cloneElement(element, p);
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
// nearest 工具函数
|
|
32
|
+
function nearest(arr, target) {
|
|
33
|
+
return arr.reduce(function (prev, curr) {
|
|
34
|
+
return Math.abs(curr - target) < Math.abs(prev - target) ? curr : prev;
|
|
35
|
+
});
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
// mergeProps 工具函数
|
|
39
|
+
function mergeProps(a, b) {
|
|
40
|
+
return _objectSpread(_objectSpread({}, a), b);
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
// withStopPropagation 工具函数
|
|
44
|
+
function withStopPropagation(events, element) {
|
|
45
|
+
if (!events.includes('click')) {
|
|
46
|
+
return element;
|
|
47
|
+
}
|
|
48
|
+
var onClick = function onClick(e) {
|
|
49
|
+
var _element$props$onClic, _element$props;
|
|
50
|
+
e.stopPropagation();
|
|
51
|
+
(_element$props$onClic = (_element$props = element.props).onClick) === null || _element$props$onClic === void 0 || _element$props$onClic.call(_element$props, e);
|
|
52
|
+
};
|
|
53
|
+
return /*#__PURE__*/React.cloneElement(element, _objectSpread(_objectSpread({}, element.props), {}, {
|
|
54
|
+
onClick: onClick
|
|
55
|
+
}));
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
// Button 组件实现
|
|
59
|
+
|
|
60
|
+
var Button = function Button(_ref) {
|
|
61
|
+
var children = _ref.children,
|
|
62
|
+
className = _ref.className,
|
|
63
|
+
style = _ref.style,
|
|
64
|
+
onClick = _ref.onClick;
|
|
65
|
+
return /*#__PURE__*/React.createElement("button", {
|
|
66
|
+
className: className,
|
|
67
|
+
style: _objectSpread({
|
|
68
|
+
border: 'none',
|
|
69
|
+
background: (style === null || style === void 0 ? void 0 : style['--background-color']) || 'transparent'
|
|
70
|
+
}, style),
|
|
71
|
+
onClick: onClick
|
|
72
|
+
}, children);
|
|
73
|
+
};
|
|
74
|
+
import "./index.less";
|
|
75
|
+
var classPrefix = "pisell-custom-swipe-action";
|
|
76
|
+
var defaultProps = {
|
|
77
|
+
rightActions: [],
|
|
78
|
+
leftActions: [],
|
|
79
|
+
closeOnTouchOutside: true,
|
|
80
|
+
closeOnAction: true,
|
|
81
|
+
stopPropagation: []
|
|
82
|
+
};
|
|
83
|
+
export var SwipeAction = /*#__PURE__*/forwardRef(function (p, ref) {
|
|
84
|
+
var props = mergeProps(defaultProps, p);
|
|
85
|
+
var rootRef = useRef(null);
|
|
86
|
+
var leftRef = useRef(null);
|
|
87
|
+
var rightRef = useRef(null);
|
|
88
|
+
function getWidth(ref) {
|
|
89
|
+
var element = ref.current;
|
|
90
|
+
if (!element) return 0;
|
|
91
|
+
return element.offsetWidth;
|
|
92
|
+
}
|
|
93
|
+
function getLeftWidth() {
|
|
94
|
+
return getWidth(leftRef);
|
|
95
|
+
}
|
|
96
|
+
function getRightWidth() {
|
|
97
|
+
return getWidth(rightRef);
|
|
98
|
+
}
|
|
99
|
+
var _useSpring = useSpring(function () {
|
|
100
|
+
return {
|
|
101
|
+
x: 0,
|
|
102
|
+
config: {
|
|
103
|
+
tension: 200,
|
|
104
|
+
friction: 30
|
|
105
|
+
}
|
|
106
|
+
};
|
|
107
|
+
}, []),
|
|
108
|
+
_useSpring2 = _slicedToArray(_useSpring, 2),
|
|
109
|
+
x = _useSpring2[0].x,
|
|
110
|
+
api = _useSpring2[1];
|
|
111
|
+
var draggingRef = useRef(false);
|
|
112
|
+
var dragCancelRef = useRef(null);
|
|
113
|
+
function forceCancelDrag() {
|
|
114
|
+
var _dragCancelRef$curren;
|
|
115
|
+
(_dragCancelRef$curren = dragCancelRef.current) === null || _dragCancelRef$curren === void 0 || _dragCancelRef$curren.call(dragCancelRef);
|
|
116
|
+
draggingRef.current = false;
|
|
117
|
+
}
|
|
118
|
+
var bind = useDrag(function (state) {
|
|
119
|
+
dragCancelRef.current = state.cancel;
|
|
120
|
+
if (!state.intentional) return;
|
|
121
|
+
if (state.down) {
|
|
122
|
+
draggingRef.current = true;
|
|
123
|
+
}
|
|
124
|
+
if (!draggingRef.current) return;
|
|
125
|
+
var _state$offset = _slicedToArray(state.offset, 1),
|
|
126
|
+
offsetX = _state$offset[0];
|
|
127
|
+
if (state.last) {
|
|
128
|
+
var leftWidth = getLeftWidth();
|
|
129
|
+
var rightWidth = getRightWidth();
|
|
130
|
+
var position = offsetX + state.velocity[0] * state.direction[0] * 50;
|
|
131
|
+
if (offsetX > 0) {
|
|
132
|
+
position = Math.max(0, position);
|
|
133
|
+
} else if (offsetX < 0) {
|
|
134
|
+
position = Math.min(0, position);
|
|
135
|
+
} else {
|
|
136
|
+
position = 0;
|
|
137
|
+
}
|
|
138
|
+
var targetX = nearest([-rightWidth, 0, leftWidth], position);
|
|
139
|
+
api.start({
|
|
140
|
+
x: targetX
|
|
141
|
+
});
|
|
142
|
+
if (targetX !== 0) {
|
|
143
|
+
var _p$onActionsReveal;
|
|
144
|
+
(_p$onActionsReveal = p.onActionsReveal) === null || _p$onActionsReveal === void 0 || _p$onActionsReveal.call(p, targetX > 0 ? 'left' : 'right');
|
|
145
|
+
}
|
|
146
|
+
window.setTimeout(function () {
|
|
147
|
+
draggingRef.current = false;
|
|
148
|
+
});
|
|
149
|
+
} else {
|
|
150
|
+
api.start({
|
|
151
|
+
x: offsetX,
|
|
152
|
+
immediate: true
|
|
153
|
+
});
|
|
154
|
+
}
|
|
155
|
+
}, {
|
|
156
|
+
from: function from() {
|
|
157
|
+
return [x.get(), 0];
|
|
158
|
+
},
|
|
159
|
+
bounds: function bounds() {
|
|
160
|
+
var leftWidth = getLeftWidth();
|
|
161
|
+
var rightWidth = getRightWidth();
|
|
162
|
+
return {
|
|
163
|
+
left: -rightWidth,
|
|
164
|
+
right: leftWidth
|
|
165
|
+
};
|
|
166
|
+
},
|
|
167
|
+
axis: 'x',
|
|
168
|
+
preventScroll: true,
|
|
169
|
+
pointer: {
|
|
170
|
+
touch: true
|
|
171
|
+
},
|
|
172
|
+
triggerAllEvents: true
|
|
173
|
+
});
|
|
174
|
+
var close = function close() {
|
|
175
|
+
var _props$onClose;
|
|
176
|
+
api.start({
|
|
177
|
+
x: 0
|
|
178
|
+
});
|
|
179
|
+
forceCancelDrag();
|
|
180
|
+
(_props$onClose = props.onClose) === null || _props$onClose === void 0 || _props$onClose.call(props);
|
|
181
|
+
};
|
|
182
|
+
useImperativeHandle(ref, function () {
|
|
183
|
+
return {
|
|
184
|
+
show: function show() {
|
|
185
|
+
var _p$onActionsReveal2;
|
|
186
|
+
var side = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'right';
|
|
187
|
+
if (side === 'right') {
|
|
188
|
+
api.start({
|
|
189
|
+
x: -getRightWidth()
|
|
190
|
+
});
|
|
191
|
+
} else if (side === 'left') {
|
|
192
|
+
api.start({
|
|
193
|
+
x: getLeftWidth()
|
|
194
|
+
});
|
|
195
|
+
}
|
|
196
|
+
(_p$onActionsReveal2 = p.onActionsReveal) === null || _p$onActionsReveal2 === void 0 || _p$onActionsReveal2.call(p, side);
|
|
197
|
+
},
|
|
198
|
+
close: close
|
|
199
|
+
};
|
|
200
|
+
});
|
|
201
|
+
useEffect(function () {
|
|
202
|
+
if (!props.closeOnTouchOutside) return;
|
|
203
|
+
function handle(e) {
|
|
204
|
+
if (x.get() === 0) {
|
|
205
|
+
return;
|
|
206
|
+
}
|
|
207
|
+
var root = rootRef.current;
|
|
208
|
+
if (root && !root.contains(e.target)) {
|
|
209
|
+
close();
|
|
210
|
+
}
|
|
211
|
+
}
|
|
212
|
+
document.addEventListener('touchstart', handle);
|
|
213
|
+
return function () {
|
|
214
|
+
document.removeEventListener('touchstart', handle);
|
|
215
|
+
};
|
|
216
|
+
}, [props.closeOnTouchOutside]);
|
|
217
|
+
function renderAction(action) {
|
|
218
|
+
var _action$color, _colorRecord$color;
|
|
219
|
+
var color = (_action$color = action.color) !== null && _action$color !== void 0 ? _action$color : 'light';
|
|
220
|
+
var _style = action.style || {};
|
|
221
|
+
return /*#__PURE__*/React.createElement(Button, {
|
|
222
|
+
key: action.key,
|
|
223
|
+
className: "".concat(classPrefix, "-action-button"),
|
|
224
|
+
style: _objectSpread({
|
|
225
|
+
'--background-color': (_colorRecord$color = colorRecord[color]) !== null && _colorRecord$color !== void 0 ? _colorRecord$color : color
|
|
226
|
+
}, _style),
|
|
227
|
+
onClick: function onClick(e) {
|
|
228
|
+
var _action$onClick, _props$onAction;
|
|
229
|
+
if (props.closeOnAction) {
|
|
230
|
+
close();
|
|
231
|
+
}
|
|
232
|
+
(_action$onClick = action.onClick) === null || _action$onClick === void 0 || _action$onClick.call(action, e);
|
|
233
|
+
(_props$onAction = props.onAction) === null || _props$onAction === void 0 || _props$onAction.call(props, action, e);
|
|
234
|
+
}
|
|
235
|
+
}, action.text);
|
|
236
|
+
}
|
|
237
|
+
return withNativeProps(props, /*#__PURE__*/React.createElement("div", _extends({
|
|
238
|
+
className: classPrefix
|
|
239
|
+
}, bind(), {
|
|
240
|
+
ref: rootRef,
|
|
241
|
+
onClickCapture: function onClickCapture(e) {
|
|
242
|
+
if (draggingRef.current) {
|
|
243
|
+
e.stopPropagation();
|
|
244
|
+
e.preventDefault();
|
|
245
|
+
}
|
|
246
|
+
}
|
|
247
|
+
}), /*#__PURE__*/React.createElement(animated.div, {
|
|
248
|
+
className: "".concat(classPrefix, "-track"),
|
|
249
|
+
style: {
|
|
250
|
+
x: x
|
|
251
|
+
}
|
|
252
|
+
}, withStopPropagation(props.stopPropagation, /*#__PURE__*/React.createElement("div", {
|
|
253
|
+
className: "".concat(classPrefix, "-actions ").concat(classPrefix, "-actions-left"),
|
|
254
|
+
ref: leftRef
|
|
255
|
+
}, props.leftActions.map(renderAction))), /*#__PURE__*/React.createElement("div", {
|
|
256
|
+
className: "".concat(classPrefix, "-content"),
|
|
257
|
+
onClickCapture: function onClickCapture(e) {
|
|
258
|
+
if (x.goal !== 0) {
|
|
259
|
+
e.preventDefault();
|
|
260
|
+
e.stopPropagation();
|
|
261
|
+
close();
|
|
262
|
+
}
|
|
263
|
+
}
|
|
264
|
+
}, /*#__PURE__*/React.createElement(animated.div, {
|
|
265
|
+
style: {
|
|
266
|
+
pointerEvents: x.to(function (v) {
|
|
267
|
+
return v !== 0 && x.goal !== 0 ? 'none' : 'auto';
|
|
268
|
+
})
|
|
269
|
+
}
|
|
270
|
+
}, props.children)), withStopPropagation(props.stopPropagation, /*#__PURE__*/React.createElement("div", {
|
|
271
|
+
className: "".concat(classPrefix, "-actions ").concat(classPrefix, "-actions-right"),
|
|
272
|
+
ref: rightRef
|
|
273
|
+
}, props.rightActions.map(renderAction))))));
|
|
274
|
+
});
|
|
275
|
+
var colorRecord = {
|
|
276
|
+
light: '#ccc',
|
|
277
|
+
weak: '#999',
|
|
278
|
+
primary: '#1677ff',
|
|
279
|
+
success: '#00b578',
|
|
280
|
+
warning: '#ff8f1f',
|
|
281
|
+
danger: '#ff3141'
|
|
282
|
+
};
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
.pisell-custom-swipe-action {
|
|
2
|
+
cursor: grab;
|
|
3
|
+
overflow: hidden;
|
|
4
|
+
touch-action: pan-y;
|
|
5
|
+
&-track {
|
|
6
|
+
position: relative;
|
|
7
|
+
overflow: visible;
|
|
8
|
+
}
|
|
9
|
+
&-content {
|
|
10
|
+
}
|
|
11
|
+
&-actions {
|
|
12
|
+
position: absolute;
|
|
13
|
+
display: flex;
|
|
14
|
+
justify-content: center;
|
|
15
|
+
align-items: stretch;
|
|
16
|
+
width: auto;
|
|
17
|
+
white-space: nowrap;
|
|
18
|
+
&-right {
|
|
19
|
+
left: 100%;
|
|
20
|
+
top: 0;
|
|
21
|
+
height: 100%;
|
|
22
|
+
}
|
|
23
|
+
&-left {
|
|
24
|
+
right: 100%;
|
|
25
|
+
top: 0;
|
|
26
|
+
height: 100%;
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
&-action-button {
|
|
30
|
+
--border-radius: 0;
|
|
31
|
+
--border-width: 0;
|
|
32
|
+
padding-left: 4px;
|
|
33
|
+
padding-right: 4px;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
@@ -2,6 +2,7 @@ import './index.less';
|
|
|
2
2
|
import { ProductCardTypes } from '../types';
|
|
3
3
|
interface ISKUCardProps extends ProductCardTypes {
|
|
4
4
|
type: 'a2' | 'a5';
|
|
5
|
+
rightActions: any[];
|
|
5
6
|
}
|
|
6
7
|
export declare const PREFIX = "pisell-cart-sku-card";
|
|
7
8
|
declare const CartSkuCard: (props: ISKUCardProps) => JSX.Element;
|
|
@@ -1,16 +1,21 @@
|
|
|
1
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
|
-
var _excluded = ["dataSource", "isShowImage", "isShowHolder", "isShowNote", "isShowDelete", "isShowPackageNote", "isShowEditProduct", "onEditProduct", "onAction", "onDelete", "onNote", "onLike", "onCard", "onChangeResource", "onChangeHolder", "type"];
|
|
2
|
+
var _excluded = ["dataSource", "isShowImage", "isShowHolder", "isShowNote", "isShowDelete", "isShowPackageNote", "isShowEditProduct", "onEditProduct", "onAction", "onDelete", "onNote", "onLike", "onCard", "onChangeResource", "onChangeHolder", "type", "rightActions"];
|
|
3
3
|
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; }
|
|
4
4
|
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; }
|
|
5
5
|
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; }
|
|
6
6
|
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
7
7
|
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); }
|
|
8
8
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
9
|
+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
10
|
+
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
11
|
+
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); }
|
|
12
|
+
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
13
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
14
|
+
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; }
|
|
9
15
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
10
16
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
11
17
|
import React, { useMemo, useRef } from 'react';
|
|
12
18
|
import classNames from 'classnames';
|
|
13
|
-
import { SwipeAction } from 'antd-mobile';
|
|
14
19
|
import { image as imageAli, locales } from '@pisell/utils';
|
|
15
20
|
import localeTexts from "./locales";
|
|
16
21
|
import BasicInfo from "./components/basicInfo";
|
|
@@ -20,6 +25,7 @@ import TimeRange from "./components/timeRange";
|
|
|
20
25
|
import Resources from "./components/resources";
|
|
21
26
|
import Packages from "./components/packages";
|
|
22
27
|
import Sales from "./components/sales";
|
|
28
|
+
import { SwipeAction } from "./components/swipeAction";
|
|
23
29
|
import "./index.less";
|
|
24
30
|
import Iconfont from "../../iconfont";
|
|
25
31
|
import useEngineContext from "../../../hooks/useEngineContext";
|
|
@@ -55,6 +61,8 @@ var CartSkuCard = function CartSkuCard(props) {
|
|
|
55
61
|
onChangeResource = props.onChangeResource,
|
|
56
62
|
onChangeHolder = props.onChangeHolder,
|
|
57
63
|
type = props.type,
|
|
64
|
+
_props$rightActions = props.rightActions,
|
|
65
|
+
rightActions = _props$rightActions === void 0 ? [] : _props$rightActions,
|
|
58
66
|
other = _objectWithoutProperties(props, _excluded);
|
|
59
67
|
var useOpenNoteRef = useRef();
|
|
60
68
|
var context = useEngineContext();
|
|
@@ -62,10 +70,19 @@ var CartSkuCard = function CartSkuCard(props) {
|
|
|
62
70
|
console.log('prodcut props', props);
|
|
63
71
|
var isShowAction = dataSource.isShowAction,
|
|
64
72
|
actionText = dataSource.actionText;
|
|
65
|
-
var
|
|
73
|
+
var _rightActions = useMemo(function () {
|
|
66
74
|
var deleteAction = {
|
|
67
75
|
key: 'delete',
|
|
68
|
-
text: /*#__PURE__*/React.createElement(
|
|
76
|
+
text: /*#__PURE__*/React.createElement("div", {
|
|
77
|
+
style: {
|
|
78
|
+
display: 'flex',
|
|
79
|
+
justifyContent: 'center',
|
|
80
|
+
alignItems: 'center',
|
|
81
|
+
color: 'white',
|
|
82
|
+
cursor: 'pointer',
|
|
83
|
+
padding: '10px 0px'
|
|
84
|
+
}
|
|
85
|
+
}, /*#__PURE__*/React.createElement(Iconfont, {
|
|
69
86
|
type: "pisell2-trash-01",
|
|
70
87
|
style: {
|
|
71
88
|
fontSize: 20,
|
|
@@ -73,7 +90,8 @@ var CartSkuCard = function CartSkuCard(props) {
|
|
|
73
90
|
}
|
|
74
91
|
}), /*#__PURE__*/React.createElement("span", {
|
|
75
92
|
style: {
|
|
76
|
-
fontSize: 12
|
|
93
|
+
fontSize: 12,
|
|
94
|
+
fontWeight: 500
|
|
77
95
|
}
|
|
78
96
|
}, locales.getText('pisell2.cart.sku-card.actions.delete'))),
|
|
79
97
|
color: 'danger',
|
|
@@ -83,12 +101,12 @@ var CartSkuCard = function CartSkuCard(props) {
|
|
|
83
101
|
onDelete === null || onDelete === void 0 || onDelete(dataSource);
|
|
84
102
|
}
|
|
85
103
|
};
|
|
86
|
-
var actions =
|
|
104
|
+
var actions = _toConsumableArray(rightActions);
|
|
87
105
|
if (isShowDelete) {
|
|
88
|
-
actions.
|
|
106
|
+
actions.unshift(deleteAction);
|
|
89
107
|
}
|
|
90
108
|
return actions;
|
|
91
|
-
}, [dataSource, onDelete, isShowDelete]);
|
|
109
|
+
}, [dataSource, onDelete, isShowDelete, rightActions]);
|
|
92
110
|
var hideDivider = useMemo(function () {
|
|
93
111
|
var bundle = dataSource.bundle,
|
|
94
112
|
relation_products = dataSource.relation_products;
|
|
@@ -174,8 +192,9 @@ var CartSkuCard = function CartSkuCard(props) {
|
|
|
174
192
|
return renderA2();
|
|
175
193
|
};
|
|
176
194
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SwipeAction, {
|
|
195
|
+
closeOnAction: false,
|
|
177
196
|
className: classNames("".concat(PREFIX, "-wrapper")),
|
|
178
|
-
rightActions:
|
|
197
|
+
rightActions: _rightActions
|
|
179
198
|
}, /*#__PURE__*/React.createElement("div", {
|
|
180
199
|
className: classNames(PREFIX, "".concat(PREFIX, "--").concat(type)),
|
|
181
200
|
onClick: function onClick(e) {
|
|
@@ -13,7 +13,7 @@ var prefix = 'pisell-lowcode-';
|
|
|
13
13
|
var Header = function Header(props) {
|
|
14
14
|
var isShowDelete = props.isShowDelete,
|
|
15
15
|
item = props.item,
|
|
16
|
-
|
|
16
|
+
isShowImage = props.isShowImage,
|
|
17
17
|
onDelete = props.onDelete,
|
|
18
18
|
disabledEdit = props.disabledEdit,
|
|
19
19
|
onEditProduct = props.onEditProduct,
|
|
@@ -66,14 +66,26 @@ var Header = function Header(props) {
|
|
|
66
66
|
var showDelete = useMemo(function () {
|
|
67
67
|
return isShowDelete && !disabledEdit && !disabled;
|
|
68
68
|
}, [isShowDelete, disabledEdit, disabled]);
|
|
69
|
+
var renderImage = function renderImage() {
|
|
70
|
+
if (!isShowImage) return null;
|
|
71
|
+
if (image) {
|
|
72
|
+
return /*#__PURE__*/React.createElement("img", {
|
|
73
|
+
src: imageAli.ali(image, 64),
|
|
74
|
+
className: "".concat(prefix, "product-header-cover")
|
|
75
|
+
});
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
// 如果没有图片,显示文字图片
|
|
79
|
+
var displayText = name ? name.slice(0, 2) : '';
|
|
80
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
81
|
+
className: "".concat(prefix, "product-header-cover-text")
|
|
82
|
+
}, displayText);
|
|
83
|
+
};
|
|
69
84
|
return /*#__PURE__*/React.createElement("div", {
|
|
70
85
|
className: classNames("".concat(prefix, "product-header"), headerCenterStyle && "".concat(prefix, "product-options-header"))
|
|
71
86
|
}, showDelete ? /*#__PURE__*/React.createElement(DeleteButton, {
|
|
72
87
|
onDelete: onDelete
|
|
73
|
-
}) : null,
|
|
74
|
-
src: imageAli.ali(image, 64),
|
|
75
|
-
className: "".concat(prefix, "product-header-cover")
|
|
76
|
-
}) : null, id ? /*#__PURE__*/React.createElement("div", {
|
|
88
|
+
}) : null, renderImage(), id ? /*#__PURE__*/React.createElement("div", {
|
|
77
89
|
className: classNames("".concat(prefix, "product-right-wrap"), _defineProperty({}, "".concat(prefix, "product-right-wrap-stretch"), isShowEditProduct))
|
|
78
90
|
}, /*#__PURE__*/React.createElement("div", {
|
|
79
91
|
className: "".concat(prefix, "product-title")
|