@vtx/components 2.5.7 → 2.5.9
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/lib/_util/filterSpecialCharacters.js +54 -43
- package/lib/_util/filterSpecialCharacters.js.map +1 -1
- package/lib/_util/getComponentProps.js +1 -4
- package/lib/_util/getComponentProps.js.map +1 -1
- package/lib/_util/getUrlParam.js +0 -6
- package/lib/_util/getUrlParam.js.map +1 -1
- package/lib/_util/isFunction.js +0 -1
- package/lib/_util/isFunction.js.map +1 -1
- package/lib/_util/isObject.js +0 -1
- package/lib/_util/isObject.js.map +1 -1
- package/lib/_util/useInterval.js +0 -3
- package/lib/_util/useInterval.js.map +1 -1
- package/lib/_util/useSet.js +16 -34
- package/lib/_util/useSet.js.map +1 -1
- package/lib/config.js.map +1 -1
- package/lib/index.js +40 -62
- package/lib/index.js.map +1 -1
- package/lib/vtx-color-picker/index.js +7 -23
- package/lib/vtx-color-picker/index.js.map +1 -1
- package/lib/vtx-color-picker/style/css.js +0 -2
- package/lib/vtx-color-picker/style/css.js.map +1 -1
- package/lib/vtx-color-picker/style/index.js +0 -2
- package/lib/vtx-color-picker/style/index.js.map +1 -1
- package/lib/vtx-combogrid/Combogrid.js +37 -77
- package/lib/vtx-combogrid/Combogrid.js.map +1 -1
- package/lib/vtx-combogrid/index.js +22 -47
- package/lib/vtx-combogrid/index.js.map +1 -1
- package/lib/vtx-combogrid/style/css.js +0 -7
- package/lib/vtx-combogrid/style/css.js.map +1 -1
- package/lib/vtx-combogrid/style/index.js +0 -7
- package/lib/vtx-combogrid/style/index.js.map +1 -1
- package/lib/vtx-datagrid/Alert.js +3 -11
- package/lib/vtx-datagrid/Alert.js.map +1 -1
- package/lib/vtx-datagrid/ColumnSetting.js +15 -37
- package/lib/vtx-datagrid/ColumnSetting.js.map +1 -1
- package/lib/vtx-datagrid/ResizeableTitle.js +2 -13
- package/lib/vtx-datagrid/ResizeableTitle.js.map +1 -1
- package/lib/vtx-datagrid/index.js +79 -139
- package/lib/vtx-datagrid/index.js.map +1 -1
- package/lib/vtx-datagrid/renderColumnButtons.js +6 -36
- package/lib/vtx-datagrid/renderColumnButtons.js.map +1 -1
- package/lib/vtx-datagrid/style/css.js +0 -10
- package/lib/vtx-datagrid/style/css.js.map +1 -1
- package/lib/vtx-datagrid/style/index.js +0 -10
- package/lib/vtx-datagrid/style/index.js.map +1 -1
- package/lib/vtx-date-picker/QdatePicker.js +18 -48
- package/lib/vtx-date-picker/QdatePicker.js.map +1 -1
- package/lib/vtx-date-picker/YearPicker.js +9 -32
- package/lib/vtx-date-picker/YearPicker.js.map +1 -1
- package/lib/vtx-date-picker/generatePicker.js +16 -57
- package/lib/vtx-date-picker/generatePicker.js.map +1 -1
- package/lib/vtx-date-picker/index.js +2 -8
- package/lib/vtx-date-picker/index.js.map +1 -1
- package/lib/vtx-date-picker/style/css.js +0 -1
- package/lib/vtx-date-picker/style/css.js.map +1 -1
- package/lib/vtx-date-picker/style/index.js +0 -1
- package/lib/vtx-date-picker/style/index.js.map +1 -1
- package/lib/vtx-editor/index.js +7 -25
- package/lib/vtx-editor/index.js.map +1 -1
- package/lib/vtx-editor/style/css.js +0 -2
- package/lib/vtx-editor/style/css.js.map +1 -1
- package/lib/vtx-editor/style/index.js +0 -2
- package/lib/vtx-editor/style/index.js.map +1 -1
- package/lib/vtx-export/index.js +22 -54
- package/lib/vtx-export/index.js.map +1 -1
- package/lib/vtx-export/style/css.js +0 -6
- package/lib/vtx-export/style/css.js.map +1 -1
- package/lib/vtx-export/style/index.js +0 -6
- package/lib/vtx-export/style/index.js.map +1 -1
- package/lib/vtx-form-layout/Card.js +6 -27
- package/lib/vtx-form-layout/Card.js.map +1 -1
- package/lib/vtx-form-layout/Divider.js +0 -5
- package/lib/vtx-form-layout/Divider.js.map +1 -1
- package/lib/vtx-form-layout/FormItem.js +10 -35
- package/lib/vtx-form-layout/FormItem.js.map +1 -1
- package/lib/vtx-form-layout/Pane.js +2 -7
- package/lib/vtx-form-layout/Pane.js.map +1 -1
- package/lib/vtx-form-layout/Row.js +0 -6
- package/lib/vtx-form-layout/Row.js.map +1 -1
- package/lib/vtx-form-layout/context.js +0 -2
- package/lib/vtx-form-layout/context.js.map +1 -1
- package/lib/vtx-form-layout/index.js +8 -22
- package/lib/vtx-form-layout/index.js.map +1 -1
- package/lib/vtx-form-layout/style/css.js +0 -8
- package/lib/vtx-form-layout/style/css.js.map +1 -1
- package/lib/vtx-form-layout/style/index.js +0 -8
- package/lib/vtx-form-layout/style/index.js.map +1 -1
- package/lib/vtx-image/Image.js +57 -93
- package/lib/vtx-image/Image.js.map +1 -1
- package/lib/vtx-image/Preview.js +23 -54
- package/lib/vtx-image/Preview.js.map +1 -1
- package/lib/vtx-image/PreviewGroup.js +13 -42
- package/lib/vtx-image/PreviewGroup.js.map +1 -1
- package/lib/vtx-image/index.js +1 -7
- package/lib/vtx-image/index.js.map +1 -1
- package/lib/vtx-image/style/css.js +0 -1
- package/lib/vtx-image/style/css.js.map +1 -1
- package/lib/vtx-image/style/index.js +0 -1
- package/lib/vtx-image/style/index.js.map +1 -1
- package/lib/vtx-import/index.js +39 -74
- package/lib/vtx-import/index.js.map +1 -1
- package/lib/vtx-import/result.js +8 -25
- package/lib/vtx-import/result.js.map +1 -1
- package/lib/vtx-import/style/css.js +0 -2
- package/lib/vtx-import/style/css.js.map +1 -1
- package/lib/vtx-import/style/index.js +0 -2
- package/lib/vtx-import/style/index.js.map +1 -1
- package/lib/vtx-input/TextArea.js +8 -24
- package/lib/vtx-input/TextArea.js.map +1 -1
- package/lib/vtx-input/index.js +15 -41
- package/lib/vtx-input/index.js.map +1 -1
- package/lib/vtx-input/style/css.js +0 -1
- package/lib/vtx-input/style/css.js.map +1 -1
- package/lib/vtx-input/style/index.js +0 -1
- package/lib/vtx-input/style/index.js.map +1 -1
- package/lib/vtx-input/useLength.js +4 -16
- package/lib/vtx-input/useLength.js.map +1 -1
- package/lib/vtx-modal/Title.js +1 -6
- package/lib/vtx-modal/Title.js.map +1 -1
- package/lib/vtx-modal/index.js +33 -71
- package/lib/vtx-modal/index.js.map +1 -1
- package/lib/vtx-modal/style/css.js +0 -2
- package/lib/vtx-modal/style/css.js.map +1 -1
- package/lib/vtx-modal/style/index.js +0 -2
- package/lib/vtx-modal/style/index.js.map +1 -1
- package/lib/vtx-page-layout/Basic.js +2 -6
- package/lib/vtx-page-layout/Basic.js.map +1 -1
- package/lib/vtx-page-layout/Content.js +9 -21
- package/lib/vtx-page-layout/Content.js.map +1 -1
- package/lib/vtx-page-layout/Pane.js +2 -10
- package/lib/vtx-page-layout/Pane.js.map +1 -1
- package/lib/vtx-page-layout/TableLayout.js +15 -45
- package/lib/vtx-page-layout/TableLayout.js.map +1 -1
- package/lib/vtx-page-layout/TableWrap.js +5 -17
- package/lib/vtx-page-layout/TableWrap.js.map +1 -1
- package/lib/vtx-page-layout/container.js +16 -46
- package/lib/vtx-page-layout/container.js.map +1 -1
- package/lib/vtx-page-layout/index.js +0 -8
- package/lib/vtx-page-layout/index.js.map +1 -1
- package/lib/vtx-page-layout/style/css.js.map +1 -1
- package/lib/vtx-page-layout/style/index.js.map +1 -1
- package/lib/vtx-rps-frame/index.js +52 -63
- package/lib/vtx-rps-frame/index.js.map +1 -1
- package/lib/vtx-rps-frame/style/css.js.map +1 -1
- package/lib/vtx-rps-frame/style/index.js.map +1 -1
- package/lib/vtx-scrollable-row/index.js +23 -59
- package/lib/vtx-scrollable-row/index.js.map +1 -1
- package/lib/vtx-scrollable-row/style/css.js +0 -1
- package/lib/vtx-scrollable-row/style/css.js.map +1 -1
- package/lib/vtx-scrollable-row/style/index.js +0 -1
- package/lib/vtx-scrollable-row/style/index.js.map +1 -1
- package/lib/vtx-search/VtxCol.js +2 -23
- package/lib/vtx-search/VtxCol.js.map +1 -1
- package/lib/vtx-search/VtxRow.js +6 -12
- package/lib/vtx-search/VtxRow.js.map +1 -1
- package/lib/vtx-search/index.js +39 -90
- package/lib/vtx-search/index.js.map +1 -1
- package/lib/vtx-search/style/css.js +0 -5
- package/lib/vtx-search/style/css.js.map +1 -1
- package/lib/vtx-search/style/index.js +0 -5
- package/lib/vtx-search/style/index.js.map +1 -1
- package/lib/vtx-search-map-input/index.js +41 -70
- package/lib/vtx-search-map-input/index.js.map +1 -1
- package/lib/vtx-search-map-input/style/css.js +0 -2
- package/lib/vtx-search-map-input/style/css.js.map +1 -1
- package/lib/vtx-search-map-input/style/index.js +0 -2
- package/lib/vtx-search-map-input/style/index.js.map +1 -1
- package/lib/vtx-select/index.js +24 -68
- package/lib/vtx-select/index.js.map +1 -1
- package/lib/vtx-select/style/css.js +0 -8
- package/lib/vtx-select/style/css.js.map +1 -1
- package/lib/vtx-select/style/index.js +0 -8
- package/lib/vtx-select/style/index.js.map +1 -1
- package/lib/vtx-signature/index.js +15 -29
- package/lib/vtx-signature/index.js.map +1 -1
- package/lib/vtx-signature/style/css.js +0 -2
- package/lib/vtx-signature/style/css.js.map +1 -1
- package/lib/vtx-signature/style/index.js +0 -2
- package/lib/vtx-signature/style/index.js.map +1 -1
- package/lib/vtx-split-pane/Pane.js +5 -17
- package/lib/vtx-split-pane/Pane.js.map +1 -1
- package/lib/vtx-split-pane/Resizer.js +14 -34
- package/lib/vtx-split-pane/Resizer.js.map +1 -1
- package/lib/vtx-split-pane/SplitPane.js +49 -101
- package/lib/vtx-split-pane/SplitPane.js.map +1 -1
- package/lib/vtx-split-pane/index.js +0 -4
- package/lib/vtx-split-pane/index.js.map +1 -1
- package/lib/vtx-split-pane/style/css.js +0 -3
- package/lib/vtx-split-pane/style/css.js.map +1 -1
- package/lib/vtx-split-pane/style/index.js +0 -3
- package/lib/vtx-split-pane/style/index.js.map +1 -1
- package/lib/vtx-statistics-column/Back.js +2 -8
- package/lib/vtx-statistics-column/Back.js.map +1 -1
- package/lib/vtx-statistics-column/Item.js +8 -25
- package/lib/vtx-statistics-column/Item.js.map +1 -1
- package/lib/vtx-statistics-column/Total.js +8 -25
- package/lib/vtx-statistics-column/Total.js.map +1 -1
- package/lib/vtx-statistics-column/context.js +0 -2
- package/lib/vtx-statistics-column/context.js.map +1 -1
- package/lib/vtx-statistics-column/index.js +0 -16
- package/lib/vtx-statistics-column/index.js.map +1 -1
- package/lib/vtx-statistics-column/style/css.js.map +1 -1
- package/lib/vtx-statistics-column/style/index.js.map +1 -1
- package/lib/vtx-time-picker/index.js +4 -17
- package/lib/vtx-time-picker/index.js.map +1 -1
- package/lib/vtx-time-picker/style/css.js.map +1 -1
- package/lib/vtx-time-picker/style/index.js.map +1 -1
- package/lib/vtx-upload/FilePreview.js +11 -30
- package/lib/vtx-upload/FilePreview.js.map +1 -1
- package/lib/vtx-upload/index.js +70 -136
- package/lib/vtx-upload/index.js.map +1 -1
- package/lib/vtx-upload/style/css.js +0 -6
- package/lib/vtx-upload/style/css.js.map +1 -1
- package/lib/vtx-upload/style/index.js +0 -6
- package/lib/vtx-upload/style/index.js.map +1 -1
- package/lib/vtx-ztree/index.js +57 -109
- package/lib/vtx-ztree/index.js.map +1 -1
- package/lib/vtx-ztree/style/css.js +0 -1
- package/lib/vtx-ztree/style/css.js.map +1 -1
- package/lib/vtx-ztree/style/index.js +0 -1
- package/lib/vtx-ztree/style/index.js.map +1 -1
- package/lib/vtx-ztree-select/index.js +46 -105
- package/lib/vtx-ztree-select/index.js.map +1 -1
- package/lib/vtx-ztree-select/style/css.js +0 -4
- package/lib/vtx-ztree-select/style/css.js.map +1 -1
- package/lib/vtx-ztree-select/style/index.js +0 -4
- package/lib/vtx-ztree-select/style/index.js.map +1 -1
- package/package.json +1 -1
package/lib/vtx-image/Image.js
CHANGED
|
@@ -1,110 +1,86 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
function _typeof(obj) { "@babel/helpers - typeof";
|
|
4
|
-
|
|
3
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports["default"] = void 0;
|
|
9
|
-
|
|
10
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
-
|
|
12
9
|
var _classnames2 = _interopRequireDefault(require("classnames"));
|
|
13
|
-
|
|
14
10
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
15
|
-
|
|
16
11
|
var _Preview = _interopRequireDefault(require("./Preview"));
|
|
17
|
-
|
|
18
12
|
var _PreviewGroup = _interopRequireWildcard(require("./PreviewGroup"));
|
|
19
|
-
|
|
20
13
|
var _useSet3 = _interopRequireDefault(require("../_util/useSet"));
|
|
21
|
-
|
|
22
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
23
|
-
|
|
24
15
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
25
|
-
|
|
26
16
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
27
|
-
|
|
28
17
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
29
|
-
|
|
30
18
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
31
|
-
|
|
32
19
|
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."); }
|
|
33
|
-
|
|
34
20
|
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); }
|
|
35
|
-
|
|
36
21
|
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; }
|
|
37
|
-
|
|
38
22
|
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
39
|
-
|
|
40
23
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
41
|
-
|
|
42
24
|
var defaultEmptyImageSrc = '';
|
|
43
25
|
var defaultErrorImageSrc = '';
|
|
44
26
|
var defaultEmptyText = '暂无图片';
|
|
45
27
|
var defaultErrorText = '图片出错';
|
|
46
28
|
var uuid = 0;
|
|
47
|
-
|
|
48
29
|
function VtxImage(props) {
|
|
49
30
|
var _React$useState = _react["default"].useState(function () {
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
31
|
+
uuid += 1;
|
|
32
|
+
return uuid;
|
|
33
|
+
}),
|
|
34
|
+
_React$useState2 = _slicedToArray(_React$useState, 1),
|
|
35
|
+
currentId = _React$useState2[0];
|
|
56
36
|
var _useSet = (0, _useSet3["default"])({
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
37
|
+
isError: false,
|
|
38
|
+
// 图片是否加载失败
|
|
39
|
+
isEmptyImageError: false,
|
|
40
|
+
// 空白图片是否加载失败
|
|
41
|
+
isErrorImageError: false,
|
|
42
|
+
// 报错图片是否加载失败
|
|
43
|
+
viewerVisible: false,
|
|
44
|
+
// 是否查看
|
|
45
|
+
visible: false,
|
|
46
|
+
photo: undefined
|
|
47
|
+
}),
|
|
48
|
+
_useSet2 = _slicedToArray(_useSet, 2),
|
|
49
|
+
state = _useSet2[0],
|
|
50
|
+
setState = _useSet2[1];
|
|
72
51
|
var isError = state.isError,
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
52
|
+
isEmptyImageError = state.isEmptyImageError,
|
|
53
|
+
isErrorImageError = state.isErrorImageError,
|
|
54
|
+
visible = state.visible,
|
|
55
|
+
photo = state.photo;
|
|
77
56
|
var _props$prefixCls = props.prefixCls,
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
57
|
+
prefixCls = _props$prefixCls === void 0 ? 'vtx-image' : _props$prefixCls,
|
|
58
|
+
_props$preview = props.preview,
|
|
59
|
+
preview = _props$preview === void 0 ? true : _props$preview,
|
|
60
|
+
className = props.className,
|
|
61
|
+
style = props.style,
|
|
62
|
+
src = props.src,
|
|
63
|
+
thumb = props.thumb,
|
|
64
|
+
alt = props.alt,
|
|
65
|
+
_props$emptyImageSrc = props.emptyImageSrc,
|
|
66
|
+
emptyImageSrc = _props$emptyImageSrc === void 0 ? defaultEmptyImageSrc : _props$emptyImageSrc,
|
|
67
|
+
_props$errorImageSrc = props.errorImageSrc,
|
|
68
|
+
errorImageSrc = _props$errorImageSrc === void 0 ? defaultErrorImageSrc : _props$errorImageSrc,
|
|
69
|
+
_props$emptyText = props.emptyText,
|
|
70
|
+
emptyText = _props$emptyText === void 0 ? defaultEmptyText : _props$emptyText,
|
|
71
|
+
_props$errorText = props.errorText,
|
|
72
|
+
errorText = _props$errorText === void 0 ? defaultErrorText : _props$errorText,
|
|
73
|
+
_onClick = props.onClick,
|
|
74
|
+
aspectFit = props.aspectFit;
|
|
97
75
|
var _useContext = (0, _react.useContext)(_PreviewGroup.context),
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
76
|
+
isPreviewGroup = _useContext.isPreviewGroup,
|
|
77
|
+
setCurrent = _useContext.setCurrent,
|
|
78
|
+
setGroupShowPreview = _useContext.setShowPreview,
|
|
79
|
+
registerImage = _useContext.registerImage;
|
|
103
80
|
(0, _react.useEffect)(function () {
|
|
104
81
|
setState({
|
|
105
82
|
isError: false
|
|
106
83
|
});
|
|
107
|
-
|
|
108
84
|
if (isPreviewGroup && preview) {
|
|
109
85
|
registerImage({
|
|
110
86
|
id: currentId,
|
|
@@ -112,8 +88,9 @@ function VtxImage(props) {
|
|
|
112
88
|
alt: alt
|
|
113
89
|
});
|
|
114
90
|
}
|
|
115
|
-
}, [src]);
|
|
91
|
+
}, [src]);
|
|
116
92
|
|
|
93
|
+
// 图片props属性
|
|
117
94
|
var imgProps = {
|
|
118
95
|
src: thumb || src,
|
|
119
96
|
className: className,
|
|
@@ -123,9 +100,7 @@ function VtxImage(props) {
|
|
|
123
100
|
if (!src || isError) {
|
|
124
101
|
return null;
|
|
125
102
|
}
|
|
126
|
-
|
|
127
103
|
_onClick && _onClick();
|
|
128
|
-
|
|
129
104
|
if (preview) {
|
|
130
105
|
if (isPreviewGroup) {
|
|
131
106
|
setCurrent(currentId);
|
|
@@ -146,13 +121,13 @@ function VtxImage(props) {
|
|
|
146
121
|
isError: true
|
|
147
122
|
});
|
|
148
123
|
}
|
|
149
|
-
};
|
|
124
|
+
};
|
|
150
125
|
|
|
126
|
+
// 无图片
|
|
151
127
|
if (!src) {
|
|
152
128
|
//有替代图片
|
|
153
129
|
if (emptyImageSrc && !isEmptyImageError) {
|
|
154
130
|
imgProps.src = emptyImageSrc;
|
|
155
|
-
|
|
156
131
|
imgProps.onError = function () {
|
|
157
132
|
setState({
|
|
158
133
|
isEmptyImageError: true
|
|
@@ -165,14 +140,13 @@ function VtxImage(props) {
|
|
|
165
140
|
style: style
|
|
166
141
|
}, /*#__PURE__*/_react["default"].createElement("p", null, emptyText));
|
|
167
142
|
}
|
|
168
|
-
}
|
|
169
|
-
|
|
143
|
+
}
|
|
170
144
|
|
|
145
|
+
// 图片出错
|
|
171
146
|
if (isError) {
|
|
172
147
|
if (errorImageSrc && !isErrorImageError) {
|
|
173
148
|
imgProps['data-error-img'] = src;
|
|
174
149
|
imgProps.src = errorImageSrc;
|
|
175
|
-
|
|
176
150
|
imgProps.onError = function () {
|
|
177
151
|
setState({
|
|
178
152
|
isErrorImageError: true
|
|
@@ -187,16 +161,13 @@ function VtxImage(props) {
|
|
|
187
161
|
}, /*#__PURE__*/_react["default"].createElement("p", null, errorText));
|
|
188
162
|
}
|
|
189
163
|
}
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
164
|
+
var imgRender = /*#__PURE__*/_react["default"].createElement("img", imgProps);
|
|
165
|
+
// 缩放
|
|
194
166
|
if (src && !isError && aspectFit) {
|
|
195
167
|
imgRender = /*#__PURE__*/_react["default"].createElement("div", {
|
|
196
168
|
className: (0, _classnames2["default"])("".concat(prefixCls, "-aspectFit"), _defineProperty({}, "".concat(prefixCls, "-preview"), preview))
|
|
197
169
|
}, /*#__PURE__*/_react["default"].createElement("img", imgProps));
|
|
198
170
|
}
|
|
199
|
-
|
|
200
171
|
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, imgRender, !isPreviewGroup && preview && /*#__PURE__*/_react["default"].createElement(_Preview["default"], {
|
|
201
172
|
visible: visible,
|
|
202
173
|
photo: photo,
|
|
@@ -207,7 +178,6 @@ function VtxImage(props) {
|
|
|
207
178
|
}
|
|
208
179
|
}));
|
|
209
180
|
}
|
|
210
|
-
|
|
211
181
|
VtxImage.propTypes = {
|
|
212
182
|
prefixCls: _propTypes["default"].string,
|
|
213
183
|
className: _propTypes["default"].string,
|
|
@@ -224,30 +194,24 @@ VtxImage.propTypes = {
|
|
|
224
194
|
aspectFit: _propTypes["default"].bool
|
|
225
195
|
};
|
|
226
196
|
VtxImage.setImageConfig = setImageConfig;
|
|
227
|
-
|
|
228
197
|
function setImageConfig(options) {
|
|
229
198
|
var emptyImageSrc = options.emptyImageSrc,
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
199
|
+
errorImageSrc = options.errorImageSrc,
|
|
200
|
+
emptyText = options.emptyText,
|
|
201
|
+
errorText = options.errorText;
|
|
234
202
|
if (emptyImageSrc !== undefined) {
|
|
235
203
|
defaultEmptyImageSrc = emptyImageSrc;
|
|
236
204
|
}
|
|
237
|
-
|
|
238
205
|
if (errorImageSrc !== undefined) {
|
|
239
206
|
defaultErrorImageSrc = errorImageSrc;
|
|
240
207
|
}
|
|
241
|
-
|
|
242
208
|
if (emptyText !== undefined) {
|
|
243
209
|
defaultEmptyText = emptyText;
|
|
244
210
|
}
|
|
245
|
-
|
|
246
211
|
if (errorText !== undefined) {
|
|
247
212
|
defaultErrorText = errorText;
|
|
248
213
|
}
|
|
249
214
|
}
|
|
250
|
-
|
|
251
215
|
VtxImage.PreviewGroup = _PreviewGroup["default"];
|
|
252
216
|
VtxImage.VtxImagePreview = _Preview["default"];
|
|
253
217
|
var _default = VtxImage;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["vtx-image/Image.jsx"],"names":["defaultEmptyImageSrc","defaultErrorImageSrc","defaultEmptyText","defaultErrorText","uuid","VtxImage","props","React","useState","currentId","isError","isEmptyImageError","isErrorImageError","viewerVisible","visible","photo","undefined","state","setState","prefixCls","preview","className","style","src","thumb","alt","emptyImageSrc","errorImageSrc","emptyText","errorText","onClick","aspectFit","context","isPreviewGroup","setCurrent","setGroupShowPreview","setShowPreview","registerImage","id","imgProps","onError","imgRender","propTypes","PropTypes","string","object","bool","func","setImageConfig","options","PreviewGroup","VtxImagePreview","Preview"],"mappings":"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","sourcesContent":["import React, { useEffect, useContext } from 'react';\nimport classnames from 'classnames';\nimport PropTypes from 'prop-types';\n\nimport Preview from './Preview';\nimport PreviewGroup, { context } from './PreviewGroup';\nimport useSet from '../_util/useSet';\n\nlet defaultEmptyImageSrc = '';\nlet defaultErrorImageSrc = '';\nlet defaultEmptyText = '暂无图片';\nlet defaultErrorText = '图片出错';\n\nlet uuid = 0;\n\nfunction VtxImage(props) {\n const [currentId] = React.useState(() => {\n uuid += 1;\n return uuid;\n });\n\n const [state, setState] = useSet({\n isError: false, // 图片是否加载失败\n isEmptyImageError: false, // 空白图片是否加载失败\n isErrorImageError: false, // 报错图片是否加载失败\n viewerVisible: false, // 是否查看\n visible: false,\n photo: undefined,\n });\n const { isError, isEmptyImageError, isErrorImageError, visible, photo } = state;\n\n const {\n prefixCls = 'vtx-image',\n preview = true,\n className,\n style,\n src,\n thumb,\n alt,\n emptyImageSrc = defaultEmptyImageSrc,\n errorImageSrc = defaultErrorImageSrc,\n emptyText = defaultEmptyText,\n errorText = defaultErrorText,\n onClick,\n aspectFit,\n } = props;\n\n const {\n isPreviewGroup,\n setCurrent,\n setShowPreview: setGroupShowPreview,\n registerImage,\n } = useContext(context);\n\n useEffect(() => {\n setState({\n isError: false,\n });\n if (isPreviewGroup && preview) {\n registerImage({ id: currentId, src, alt });\n }\n }, [src]);\n\n // 图片props属性\n let imgProps = {\n src: thumb || src,\n className,\n style,\n alt,\n onClick: () => {\n if (!src || isError) {\n return null;\n }\n onClick && onClick();\n if (preview) {\n if (isPreviewGroup) {\n setCurrent(currentId);\n setGroupShowPreview(true);\n } else {\n setState({\n visible: true,\n photo: {\n src,\n alt,\n },\n });\n }\n }\n },\n onError: () => {\n setState({\n isError: true,\n });\n },\n };\n\n // 无图片\n if (!src) {\n //有替代图片\n if (emptyImageSrc && !isEmptyImageError) {\n imgProps.src = emptyImageSrc;\n imgProps.onError = () => {\n setState({ isEmptyImageError: true });\n };\n } else {\n // 没有替代图片或替代图片无法加载\n return (\n <div className={`${prefixCls}-nodata`} style={style}>\n <p>{emptyText}</p>\n </div>\n );\n }\n }\n\n // 图片出错\n if (isError) {\n if (errorImageSrc && !isErrorImageError) {\n imgProps['data-error-img'] = src;\n imgProps.src = errorImageSrc;\n imgProps.onError = () => {\n setState({ isErrorImageError: true });\n };\n } else {\n // 无法加载报错图片\n return (\n <div className={`${prefixCls}-error`} data-error-img={src} style={style}>\n <p>{errorText}</p>\n </div>\n );\n }\n }\n\n let imgRender = <img {...imgProps} />;\n // 缩放\n if (src && !isError && aspectFit) {\n imgRender = (\n <div\n className={classnames(`${prefixCls}-aspectFit`, {\n [`${prefixCls}-preview`]: preview,\n })}\n >\n <img {...imgProps} />\n </div>\n );\n }\n return (\n <>\n {imgRender}\n {!isPreviewGroup && preview && (\n <Preview\n visible={visible}\n photo={photo}\n onClose={() => setState({ visible: false })}\n />\n )}\n </>\n );\n}\n\nVtxImage.propTypes = {\n prefixCls: PropTypes.string,\n className: PropTypes.string,\n style: PropTypes.object,\n preview: PropTypes.bool,\n src: PropTypes.string,\n thumb: PropTypes.string,\n alt: PropTypes.string,\n emptyImageSrc: PropTypes.string,\n errorImageSrc: PropTypes.string,\n emptyText: PropTypes.string,\n errorText: PropTypes.string,\n onClick: PropTypes.func,\n aspectFit: PropTypes.bool,\n};\n\nVtxImage.setImageConfig = setImageConfig;\n\nfunction setImageConfig(options) {\n const { emptyImageSrc, errorImageSrc, emptyText, errorText } = options;\n\n if (emptyImageSrc !== undefined) {\n defaultEmptyImageSrc = emptyImageSrc;\n }\n if (errorImageSrc !== undefined) {\n defaultErrorImageSrc = errorImageSrc;\n }\n if (emptyText !== undefined) {\n defaultEmptyText = emptyText;\n }\n if (errorText !== undefined) {\n defaultErrorText = errorText;\n }\n}\n\nVtxImage.PreviewGroup = PreviewGroup;\nVtxImage.VtxImagePreview = Preview;\n\nexport default VtxImage;\n"],"file":"Image.js"}
|
|
1
|
+
{"version":3,"file":"Image.js","names":["defaultEmptyImageSrc","defaultErrorImageSrc","defaultEmptyText","defaultErrorText","uuid","VtxImage","props","React","useState","currentId","useSet","isError","isEmptyImageError","isErrorImageError","viewerVisible","visible","photo","undefined","state","setState","prefixCls","preview","className","style","src","thumb","alt","emptyImageSrc","errorImageSrc","emptyText","errorText","onClick","aspectFit","useContext","context","isPreviewGroup","setCurrent","setGroupShowPreview","setShowPreview","registerImage","useEffect","id","imgProps","onError","imgRender","classnames","propTypes","PropTypes","string","object","bool","func","setImageConfig","options","PreviewGroup","VtxImagePreview","Preview"],"sources":["vtx-image/Image.jsx"],"sourcesContent":["import React, { useEffect, useContext } from 'react';\nimport classnames from 'classnames';\nimport PropTypes from 'prop-types';\n\nimport Preview from './Preview';\nimport PreviewGroup, { context } from './PreviewGroup';\nimport useSet from '../_util/useSet';\n\nlet defaultEmptyImageSrc = '';\nlet defaultErrorImageSrc = '';\nlet defaultEmptyText = '暂无图片';\nlet defaultErrorText = '图片出错';\n\nlet uuid = 0;\n\nfunction VtxImage(props) {\n const [currentId] = React.useState(() => {\n uuid += 1;\n return uuid;\n });\n\n const [state, setState] = useSet({\n isError: false, // 图片是否加载失败\n isEmptyImageError: false, // 空白图片是否加载失败\n isErrorImageError: false, // 报错图片是否加载失败\n viewerVisible: false, // 是否查看\n visible: false,\n photo: undefined,\n });\n const { isError, isEmptyImageError, isErrorImageError, visible, photo } = state;\n\n const {\n prefixCls = 'vtx-image',\n preview = true,\n className,\n style,\n src,\n thumb,\n alt,\n emptyImageSrc = defaultEmptyImageSrc,\n errorImageSrc = defaultErrorImageSrc,\n emptyText = defaultEmptyText,\n errorText = defaultErrorText,\n onClick,\n aspectFit,\n } = props;\n\n const {\n isPreviewGroup,\n setCurrent,\n setShowPreview: setGroupShowPreview,\n registerImage,\n } = useContext(context);\n\n useEffect(() => {\n setState({\n isError: false,\n });\n if (isPreviewGroup && preview) {\n registerImage({ id: currentId, src, alt });\n }\n }, [src]);\n\n // 图片props属性\n let imgProps = {\n src: thumb || src,\n className,\n style,\n alt,\n onClick: () => {\n if (!src || isError) {\n return null;\n }\n onClick && onClick();\n if (preview) {\n if (isPreviewGroup) {\n setCurrent(currentId);\n setGroupShowPreview(true);\n } else {\n setState({\n visible: true,\n photo: {\n src,\n alt,\n },\n });\n }\n }\n },\n onError: () => {\n setState({\n isError: true,\n });\n },\n };\n\n // 无图片\n if (!src) {\n //有替代图片\n if (emptyImageSrc && !isEmptyImageError) {\n imgProps.src = emptyImageSrc;\n imgProps.onError = () => {\n setState({ isEmptyImageError: true });\n };\n } else {\n // 没有替代图片或替代图片无法加载\n return (\n <div className={`${prefixCls}-nodata`} style={style}>\n <p>{emptyText}</p>\n </div>\n );\n }\n }\n\n // 图片出错\n if (isError) {\n if (errorImageSrc && !isErrorImageError) {\n imgProps['data-error-img'] = src;\n imgProps.src = errorImageSrc;\n imgProps.onError = () => {\n setState({ isErrorImageError: true });\n };\n } else {\n // 无法加载报错图片\n return (\n <div className={`${prefixCls}-error`} data-error-img={src} style={style}>\n <p>{errorText}</p>\n </div>\n );\n }\n }\n\n let imgRender = <img {...imgProps} />;\n // 缩放\n if (src && !isError && aspectFit) {\n imgRender = (\n <div\n className={classnames(`${prefixCls}-aspectFit`, {\n [`${prefixCls}-preview`]: preview,\n })}\n >\n <img {...imgProps} />\n </div>\n );\n }\n return (\n <>\n {imgRender}\n {!isPreviewGroup && preview && (\n <Preview\n visible={visible}\n photo={photo}\n onClose={() => setState({ visible: false })}\n />\n )}\n </>\n );\n}\n\nVtxImage.propTypes = {\n prefixCls: PropTypes.string,\n className: PropTypes.string,\n style: PropTypes.object,\n preview: PropTypes.bool,\n src: PropTypes.string,\n thumb: PropTypes.string,\n alt: PropTypes.string,\n emptyImageSrc: PropTypes.string,\n errorImageSrc: PropTypes.string,\n emptyText: PropTypes.string,\n errorText: PropTypes.string,\n onClick: PropTypes.func,\n aspectFit: PropTypes.bool,\n};\n\nVtxImage.setImageConfig = setImageConfig;\n\nfunction setImageConfig(options) {\n const { emptyImageSrc, errorImageSrc, emptyText, errorText } = options;\n\n if (emptyImageSrc !== undefined) {\n defaultEmptyImageSrc = emptyImageSrc;\n }\n if (errorImageSrc !== undefined) {\n defaultErrorImageSrc = errorImageSrc;\n }\n if (emptyText !== undefined) {\n defaultEmptyText = emptyText;\n }\n if (errorText !== undefined) {\n defaultErrorText = errorText;\n }\n}\n\nVtxImage.PreviewGroup = PreviewGroup;\nVtxImage.VtxImagePreview = Preview;\n\nexport default VtxImage;\n"],"mappings":"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"}
|
package/lib/vtx-image/Preview.js
CHANGED
|
@@ -1,82 +1,58 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
function _typeof(obj) { "@babel/helpers - typeof";
|
|
4
|
-
|
|
3
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports["default"] = Preview;
|
|
9
|
-
|
|
10
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
-
|
|
12
9
|
var _viewerjs = _interopRequireDefault(require("viewerjs"));
|
|
13
|
-
|
|
14
10
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
15
|
-
|
|
16
11
|
var _isObject = _interopRequireDefault(require("../_util/isObject"));
|
|
17
|
-
|
|
18
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
19
|
-
|
|
20
13
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
21
|
-
|
|
22
14
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
23
|
-
|
|
24
|
-
function
|
|
25
|
-
|
|
26
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
27
|
-
|
|
15
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
16
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
28
17
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
29
|
-
|
|
30
18
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
31
|
-
|
|
32
19
|
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."); }
|
|
33
|
-
|
|
34
20
|
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); }
|
|
35
|
-
|
|
36
21
|
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; }
|
|
37
|
-
|
|
38
22
|
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
39
|
-
|
|
40
23
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
41
|
-
|
|
42
24
|
// 单张
|
|
43
|
-
var VIEWER = 'viewer';
|
|
44
|
-
|
|
25
|
+
var VIEWER = 'viewer';
|
|
26
|
+
// 多张
|
|
45
27
|
var GALLERY = 'gallery';
|
|
46
|
-
|
|
47
28
|
function checkMode(x) {
|
|
48
29
|
var mode = '';
|
|
49
|
-
|
|
50
30
|
if ((0, _isObject["default"])(x)) {
|
|
51
31
|
mode = VIEWER;
|
|
52
32
|
}
|
|
53
|
-
|
|
54
33
|
if (Array.isArray(x)) {
|
|
55
34
|
var len = x.length;
|
|
56
35
|
mode = len == 0 ? '' : len == 1 ? VIEWER : GALLERY;
|
|
57
36
|
}
|
|
58
|
-
|
|
59
37
|
return mode;
|
|
60
38
|
}
|
|
61
|
-
|
|
62
39
|
function Preview(props) {
|
|
63
40
|
var _useState = (0, _react.useState)(),
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
41
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
42
|
+
container = _useState2[0],
|
|
43
|
+
setContainer = _useState2[1];
|
|
68
44
|
var _useState3 = (0, _react.useState)(),
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
45
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
46
|
+
viewer = _useState4[0],
|
|
47
|
+
setViewer = _useState4[1];
|
|
73
48
|
var photo = props.photo,
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
49
|
+
index = props.index,
|
|
50
|
+
visible = props.visible,
|
|
51
|
+
onClose = props.onClose,
|
|
52
|
+
onIndexChange = props.onIndexChange,
|
|
53
|
+
options = props.options;
|
|
79
54
|
|
|
55
|
+
// let container;
|
|
80
56
|
(0, _react.useEffect)(function () {
|
|
81
57
|
var viewerOption = _objectSpread({
|
|
82
58
|
button: true,
|
|
@@ -99,7 +75,6 @@ function Preview(props) {
|
|
|
99
75
|
// 图片是否可翻转
|
|
100
76
|
transition: true
|
|
101
77
|
}, options);
|
|
102
|
-
|
|
103
78
|
var container = document.createElement('div');
|
|
104
79
|
var viewer = new _viewerjs["default"](container, _objectSpread({
|
|
105
80
|
url: function url(image) {
|
|
@@ -124,24 +99,20 @@ function Preview(props) {
|
|
|
124
99
|
if (container.childNodes.length > 0) {
|
|
125
100
|
container.innerHTML = '';
|
|
126
101
|
}
|
|
127
|
-
|
|
128
102
|
var mode = checkMode(photo);
|
|
129
|
-
var newIndex = index;
|
|
130
|
-
|
|
103
|
+
var newIndex = index;
|
|
104
|
+
// 单张
|
|
131
105
|
if (mode === VIEWER) {
|
|
132
106
|
newIndex = 0;
|
|
133
|
-
|
|
134
107
|
var _ref = (0, _isObject["default"])(photo) ? photo : photo[0],
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
108
|
+
src = _ref.src,
|
|
109
|
+
alt = _ref.alt;
|
|
138
110
|
var imgElem = document.createElement('img');
|
|
139
111
|
imgElem.src = src;
|
|
140
112
|
imgElem.alt = alt;
|
|
141
113
|
container.appendChild(imgElem);
|
|
142
|
-
}
|
|
143
|
-
|
|
144
|
-
|
|
114
|
+
}
|
|
115
|
+
// 多张
|
|
145
116
|
if (mode === GALLERY) {
|
|
146
117
|
var len = photo.length - 1;
|
|
147
118
|
newIndex = index < 0 ? 0 : index;
|
|
@@ -157,14 +128,12 @@ function Preview(props) {
|
|
|
157
128
|
});
|
|
158
129
|
container.appendChild(ulElem);
|
|
159
130
|
}
|
|
160
|
-
|
|
161
131
|
viewer.update();
|
|
162
132
|
viewer.view(newIndex);
|
|
163
133
|
}
|
|
164
134
|
}, [visible]);
|
|
165
135
|
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null);
|
|
166
136
|
}
|
|
167
|
-
|
|
168
137
|
Preview.propTypes = {
|
|
169
138
|
photo: _propTypes["default"].oneOfType([_propTypes["default"].object, _propTypes["default"].array]),
|
|
170
139
|
index: _propTypes["default"].number,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"Preview.js","names":["VIEWER","GALLERY","checkMode","x","mode","isObject","Array","isArray","len","length","Preview","props","useState","container","setContainer","viewer","setViewer","photo","index","visible","onClose","onIndexChange","options","useEffect","viewerOption","button","navbar","title","toolbar","tooltip","movable","zoomable","rotatable","scalable","transition","document","createElement","Viewer","url","image","src","hidden","view","e","detail","destroy","childNodes","innerHTML","newIndex","alt","imgElem","appendChild","ulElem","map","item","liElem","update","propTypes","PropTypes","oneOfType","object","array","number","bool","func"],"sources":["vtx-image/Preview.jsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport Viewer from 'viewerjs';\nimport PropTypes from 'prop-types';\n\nimport isObject from '../_util/isObject';\n\n// 单张\nconst VIEWER = 'viewer';\n// 多张\nconst GALLERY = 'gallery';\nfunction checkMode(x) {\n let mode = '';\n if (isObject(x)) {\n mode = VIEWER;\n }\n if (Array.isArray(x)) {\n let len = x.length;\n mode = len == 0 ? '' : len == 1 ? VIEWER : GALLERY;\n }\n return mode;\n}\n\nexport default function Preview(props) {\n const [container, setContainer] = useState();\n const [viewer, setViewer] = useState();\n const { photo, index, visible, onClose, onIndexChange, options } = props;\n\n // let container;\n useEffect(() => {\n const viewerOption = {\n button: true, // 显示右上角关闭按钮\n navbar: false, // 显示缩略图导航\n title: true, // 显示当前图片的标题(现实 alt 属性及图片尺寸)\n toolbar: true, // 是否显示工具栏\n tooltip: true, // 显示缩放百分比\n movable: true, // 图片是否可移动\n zoomable: true, // 图片是否可缩放\n rotatable: true, // 图片是否可旋转\n scalable: true, // 图片是否可翻转\n transition: true, // 使用 CSS3 过度\n ...options,\n };\n\n const container = document.createElement('div');\n const viewer = new Viewer(container, {\n url(image) {\n return image.src;\n },\n // 关闭后\n hidden() {\n onClose && onClose();\n },\n view(e) {\n onIndexChange && onIndexChange(e.detail.index);\n },\n ...viewerOption,\n });\n setContainer(container);\n setViewer(viewer);\n return () => {\n viewer && viewer.destroy();\n };\n }, []);\n\n useEffect(() => {\n if (visible) {\n if (container.childNodes.length > 0) {\n container.innerHTML = '';\n }\n const mode = checkMode(photo);\n let newIndex = index;\n // 单张\n if (mode === VIEWER) {\n newIndex = 0;\n const { src, alt } = isObject(photo) ? photo : photo[0];\n const imgElem = document.createElement('img');\n imgElem.src = src;\n imgElem.alt = alt;\n container.appendChild(imgElem);\n }\n // 多张\n if (mode === GALLERY) {\n let len = photo.length - 1;\n newIndex = index < 0 ? 0 : index;\n newIndex = index > len ? len : index;\n const ulElem = document.createElement('ul');\n photo.map(item => {\n const liElem = document.createElement('li');\n const imgElem = document.createElement('img');\n imgElem.src = item.src;\n imgElem.alt = item.alt;\n liElem.appendChild(imgElem);\n ulElem.appendChild(liElem);\n });\n container.appendChild(ulElem);\n }\n viewer.update();\n viewer.view(newIndex);\n }\n }, [visible]);\n\n return <></>;\n}\n\nPreview.propTypes = {\n photo: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),\n index: PropTypes.number,\n visible: PropTypes.bool,\n onClose: PropTypes.func,\n onIndexChange: PropTypes.func,\n options: PropTypes.object,\n};\n"],"mappings":"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"}
|
|
@@ -1,79 +1,53 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
function _typeof(obj) { "@babel/helpers - typeof";
|
|
4
|
-
|
|
3
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
|
-
exports["default"] = PreviewGroup;
|
|
9
7
|
exports.context = void 0;
|
|
10
|
-
|
|
8
|
+
exports["default"] = PreviewGroup;
|
|
11
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
12
|
-
|
|
13
10
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
14
|
-
|
|
15
11
|
var _Preview = _interopRequireDefault(require("./Preview"));
|
|
16
|
-
|
|
17
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
18
|
-
|
|
19
13
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
20
|
-
|
|
21
14
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
22
|
-
|
|
23
15
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
24
|
-
|
|
25
16
|
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."); }
|
|
26
|
-
|
|
27
17
|
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
28
|
-
|
|
29
18
|
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
30
|
-
|
|
31
19
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
32
|
-
|
|
33
20
|
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."); }
|
|
34
|
-
|
|
35
21
|
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); }
|
|
36
|
-
|
|
37
22
|
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; }
|
|
38
|
-
|
|
39
23
|
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
40
|
-
|
|
41
24
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
42
|
-
|
|
43
25
|
var context = /*#__PURE__*/_react["default"].createContext({});
|
|
44
|
-
|
|
45
26
|
exports.context = context;
|
|
46
27
|
var Provider = context.Provider;
|
|
47
|
-
|
|
48
28
|
function PreviewGroup(props) {
|
|
49
29
|
var _useState = (0, _react.useState)([]),
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
30
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
31
|
+
photo = _useState2[0],
|
|
32
|
+
setPhoto = _useState2[1];
|
|
54
33
|
var _useState3 = (0, _react.useState)(0),
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
34
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
35
|
+
current = _useState4[0],
|
|
36
|
+
setCurrent = _useState4[1];
|
|
59
37
|
var _useState5 = (0, _react.useState)(false),
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
38
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
39
|
+
visible = _useState6[0],
|
|
40
|
+
setVisible = _useState6[1];
|
|
64
41
|
var onIndexChange = props.onIndexChange;
|
|
65
|
-
|
|
66
42
|
var registerImage = function registerImage(_ref) {
|
|
67
43
|
var src = _ref.src,
|
|
68
|
-
|
|
69
|
-
|
|
44
|
+
alt = _ref.alt,
|
|
45
|
+
id = _ref.id;
|
|
70
46
|
setPhoto(function (oldPhoto) {
|
|
71
47
|
var newPhoto = _toConsumableArray(oldPhoto);
|
|
72
|
-
|
|
73
48
|
var index = oldPhoto.findIndex(function (item) {
|
|
74
49
|
return item.id === id;
|
|
75
50
|
});
|
|
76
|
-
|
|
77
51
|
if (index < 0) {
|
|
78
52
|
newPhoto.push({
|
|
79
53
|
src: src,
|
|
@@ -87,11 +61,9 @@ function PreviewGroup(props) {
|
|
|
87
61
|
id: id
|
|
88
62
|
};
|
|
89
63
|
}
|
|
90
|
-
|
|
91
64
|
return newPhoto;
|
|
92
65
|
});
|
|
93
66
|
};
|
|
94
|
-
|
|
95
67
|
return /*#__PURE__*/_react["default"].createElement(Provider, {
|
|
96
68
|
value: {
|
|
97
69
|
isPreviewGroup: true,
|
|
@@ -112,7 +84,6 @@ function PreviewGroup(props) {
|
|
|
112
84
|
onIndexChange: onIndexChange
|
|
113
85
|
}));
|
|
114
86
|
}
|
|
115
|
-
|
|
116
87
|
PreviewGroup.propTypes = {
|
|
117
88
|
children: _propTypes["default"].node,
|
|
118
89
|
onIndexChange: _propTypes["default"].func
|