linkmore-design 1.0.66 → 1.0.67
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/dist/Approval/index.d.ts +1 -21
- package/dist/Approval/type.d.ts +24 -0
- package/dist/LmTable/demos/musort.d.ts +2 -0
- package/dist/LmUpload/LmUpload.d.ts +3 -0
- package/dist/LmUpload/UploadList/ItemPicture.d.ts +4 -0
- package/dist/LmUpload/UploadList/ItemPictureCard.d.ts +5 -0
- package/dist/LmUpload/UploadList/ItemText.d.ts +4 -0
- package/dist/LmUpload/UploadList/RenderItem.d.ts +6 -0
- package/dist/LmUpload/UploadList/index.d.ts +4 -0
- package/dist/LmUpload/body/UploadCore.d.ts +4 -0
- package/dist/LmUpload/body/UploadDrag.d.ts +4 -0
- package/dist/LmUpload/body/UploadPicture.d.ts +4 -0
- package/dist/LmUpload/components/card.d.ts +2 -0
- package/dist/LmUpload/demos/basic.d.ts +2 -0
- package/dist/LmUpload/fns/index.d.ts +13 -0
- package/dist/LmUpload/index.d.ts +2 -0
- package/dist/LmUpload/style/index.d.ts +1 -0
- package/dist/LmUpload/utils.d.ts +4 -0
- package/dist/LmUpload/view/index.d.ts +4 -0
- package/dist/LmUpload/wrapper/Upload.d.ts +4 -0
- package/dist/LmUpload/wrapper/UploadContainer.d.ts +4 -0
- package/dist/LmUpload/wrapper/UploadRoot.d.ts +3 -0
- package/dist/LmUpload/wrapper/UploadWrapper.d.ts +4 -0
- package/dist/LmUpload/wrapper/reducer.d.ts +8 -0
- package/dist/index.umd.js +115 -53
- package/dist/index.umd.min.js +1 -1
- package/es/Approval/index.d.ts +1 -21
- package/es/Approval/index.js +127 -34
- package/es/Approval/style/index.css +75 -9
- package/es/Approval/type.d.ts +24 -0
- package/es/Approval/type.js +1 -0
- package/es/CustomTableOption/index.js +6 -6
- package/es/LmEditTable/DragHandle.js +2 -1
- package/es/LmEditTable/EditTable.js +85 -40
- package/es/LmEditTable/style/index.css +6 -0
- package/es/LmFilter/LmFilter.js +2 -0
- package/es/LmFilter/filterFns/index.js +2 -1
- package/es/LmFilter/wrapper/Filter.js +3 -2
- package/es/LmSelect/NormalSelect.js +5 -1
- package/es/LmSelect/style/index.css +2 -1
- package/es/LmSelect/useCheckboxOptions.js +2 -1
- package/es/LmTable/Table.js +16 -7
- package/es/LmUpload/LmUpload.d.ts +3 -0
- package/es/LmUpload/LmUpload.js +34 -0
- package/es/LmUpload/UploadList/ItemPicture.d.ts +4 -0
- package/es/LmUpload/UploadList/ItemPicture.js +25 -0
- package/es/LmUpload/UploadList/ItemPictureCard.d.ts +5 -0
- package/es/LmUpload/UploadList/ItemPictureCard.js +69 -0
- package/es/LmUpload/UploadList/ItemText.d.ts +4 -0
- package/es/LmUpload/UploadList/ItemText.js +25 -0
- package/es/LmUpload/UploadList/RenderItem.d.ts +6 -0
- package/es/LmUpload/UploadList/RenderItem.js +31 -0
- package/es/LmUpload/UploadList/index.d.ts +4 -0
- package/es/LmUpload/UploadList/index.js +21 -0
- package/es/LmUpload/body/UploadCore.d.ts +4 -0
- package/es/LmUpload/body/UploadCore.js +46 -0
- package/es/LmUpload/body/UploadDrag.d.ts +4 -0
- package/es/LmUpload/body/UploadDrag.js +10 -0
- package/es/LmUpload/body/UploadPicture.d.ts +4 -0
- package/es/LmUpload/body/UploadPicture.js +27 -0
- package/es/LmUpload/components/card.d.ts +2 -0
- package/es/LmUpload/components/card.js +9 -0
- package/es/LmUpload/fns/index.d.ts +13 -0
- package/es/LmUpload/fns/index.js +74 -0
- package/es/LmUpload/index.d.ts +2 -0
- package/es/LmUpload/index.js +2 -0
- package/es/LmUpload/style/index.css +188 -0
- package/es/LmUpload/style/index.js +3 -0
- package/es/LmUpload/utils.d.ts +4 -0
- package/es/LmUpload/utils.js +20 -0
- package/es/LmUpload/view/index.d.ts +4 -0
- package/es/LmUpload/view/index.js +10 -0
- package/es/LmUpload/wrapper/Upload.d.ts +4 -0
- package/es/LmUpload/wrapper/Upload.js +12 -0
- package/es/LmUpload/wrapper/UploadContainer.d.ts +4 -0
- package/es/LmUpload/wrapper/UploadContainer.js +12 -0
- package/es/LmUpload/wrapper/UploadRoot.d.ts +3 -0
- package/es/LmUpload/wrapper/UploadRoot.js +41 -0
- package/es/LmUpload/wrapper/UploadWrapper.d.ts +4 -0
- package/es/LmUpload/wrapper/UploadWrapper.js +21 -0
- package/es/LmUpload/wrapper/reducer.d.ts +8 -0
- package/es/LmUpload/wrapper/reducer.js +26 -0
- package/lib/Approval/index.d.ts +1 -21
- package/lib/Approval/index.js +126 -33
- package/lib/Approval/style/index.css +75 -9
- package/lib/Approval/type.d.ts +24 -0
- package/lib/Approval/type.js +5 -0
- package/lib/CustomTableOption/index.js +6 -6
- package/lib/LmEditTable/DragHandle.js +2 -1
- package/lib/LmEditTable/EditTable.js +85 -40
- package/lib/LmEditTable/style/index.css +6 -0
- package/lib/LmFilter/LmFilter.js +2 -0
- package/lib/LmFilter/filterFns/index.js +2 -1
- package/lib/LmFilter/wrapper/Filter.js +3 -2
- package/lib/LmSelect/NormalSelect.js +5 -1
- package/lib/LmSelect/style/index.css +2 -1
- package/lib/LmSelect/useCheckboxOptions.js +2 -1
- package/lib/LmTable/Table.js +16 -7
- package/lib/LmUpload/LmUpload.d.ts +3 -0
- package/lib/LmUpload/LmUpload.js +48 -0
- package/lib/LmUpload/UploadList/ItemPicture.d.ts +4 -0
- package/lib/LmUpload/UploadList/ItemPicture.js +37 -0
- package/lib/LmUpload/UploadList/ItemPictureCard.d.ts +5 -0
- package/lib/LmUpload/UploadList/ItemPictureCard.js +85 -0
- package/lib/LmUpload/UploadList/ItemText.d.ts +4 -0
- package/lib/LmUpload/UploadList/ItemText.js +36 -0
- package/lib/LmUpload/UploadList/RenderItem.d.ts +6 -0
- package/lib/LmUpload/UploadList/RenderItem.js +44 -0
- package/lib/LmUpload/UploadList/index.d.ts +4 -0
- package/lib/LmUpload/UploadList/index.js +32 -0
- package/lib/LmUpload/body/UploadCore.d.ts +4 -0
- package/lib/LmUpload/body/UploadCore.js +60 -0
- package/lib/LmUpload/body/UploadDrag.d.ts +4 -0
- package/lib/LmUpload/body/UploadDrag.js +21 -0
- package/lib/LmUpload/body/UploadPicture.d.ts +4 -0
- package/lib/LmUpload/body/UploadPicture.js +39 -0
- package/lib/LmUpload/components/card.d.ts +2 -0
- package/lib/LmUpload/components/card.js +19 -0
- package/lib/LmUpload/fns/index.d.ts +13 -0
- package/lib/LmUpload/fns/index.js +85 -0
- package/lib/LmUpload/index.d.ts +2 -0
- package/lib/LmUpload/index.js +13 -0
- package/lib/LmUpload/style/index.css +188 -0
- package/lib/LmUpload/style/index.js +3 -0
- package/lib/LmUpload/utils.d.ts +4 -0
- package/lib/LmUpload/utils.js +39 -0
- package/lib/LmUpload/view/index.d.ts +4 -0
- package/lib/LmUpload/view/index.js +20 -0
- package/lib/LmUpload/wrapper/Upload.d.ts +4 -0
- package/lib/LmUpload/wrapper/Upload.js +25 -0
- package/lib/LmUpload/wrapper/UploadContainer.d.ts +4 -0
- package/lib/LmUpload/wrapper/UploadContainer.js +25 -0
- package/lib/LmUpload/wrapper/UploadRoot.d.ts +3 -0
- package/lib/LmUpload/wrapper/UploadRoot.js +58 -0
- package/lib/LmUpload/wrapper/UploadWrapper.d.ts +4 -0
- package/lib/LmUpload/wrapper/UploadWrapper.js +36 -0
- package/lib/LmUpload/wrapper/reducer.d.ts +8 -0
- package/lib/LmUpload/wrapper/reducer.js +39 -0
- package/package.json +1 -1
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { render } from '../utils';
|
|
2
|
+
import RenderItem from './RenderItem';
|
|
3
|
+
|
|
4
|
+
var LmUploadList = function LmUploadList(_ref) {
|
|
5
|
+
var instance = _ref.instance;
|
|
6
|
+
var state = instance.state,
|
|
7
|
+
itemRender = instance.itemRender,
|
|
8
|
+
listType = instance.listType;
|
|
9
|
+
var fileList = state.fileList;
|
|
10
|
+
return fileList.map(function (file, idx) {
|
|
11
|
+
return render(itemRender || RenderItem, {
|
|
12
|
+
type: listType,
|
|
13
|
+
key: idx,
|
|
14
|
+
file: file,
|
|
15
|
+
fileList: fileList,
|
|
16
|
+
instance: instance
|
|
17
|
+
});
|
|
18
|
+
});
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
export default LmUploadList;
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import UploadPicture from './UploadPicture'; // 上传核心
|
|
3
|
+
// 渲染上传区域样式, 仅用于触发上传事件
|
|
4
|
+
// type: 'card' 图片 | 'drag' 拖拽
|
|
5
|
+
|
|
6
|
+
var UploadCore = function UploadCore(_ref) {
|
|
7
|
+
var instance = _ref.instance;
|
|
8
|
+
var inputRef = React.useRef(null);
|
|
9
|
+
var accept = instance.accept,
|
|
10
|
+
children = instance.children,
|
|
11
|
+
beforeUpload = instance.beforeUpload; // 点击事件触发文件上传
|
|
12
|
+
|
|
13
|
+
var handleClick = function handleClick() {
|
|
14
|
+
var _a;
|
|
15
|
+
|
|
16
|
+
(_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
var inputConfig = {
|
|
20
|
+
type: "file",
|
|
21
|
+
accept: accept,
|
|
22
|
+
title: '',
|
|
23
|
+
onChange: function onChange(e) {
|
|
24
|
+
var _a;
|
|
25
|
+
|
|
26
|
+
beforeUpload === null || beforeUpload === void 0 ? void 0 : beforeUpload(e);
|
|
27
|
+
|
|
28
|
+
if ((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.value) {
|
|
29
|
+
inputRef.current.value = '';
|
|
30
|
+
}
|
|
31
|
+
},
|
|
32
|
+
style: {
|
|
33
|
+
display: 'none'
|
|
34
|
+
}
|
|
35
|
+
};
|
|
36
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
37
|
+
onClick: handleClick,
|
|
38
|
+
className: "lm_upload_core"
|
|
39
|
+
}, children || /*#__PURE__*/React.createElement(UploadPicture, {
|
|
40
|
+
instance: instance
|
|
41
|
+
}), /*#__PURE__*/React.createElement("input", Object.assign({
|
|
42
|
+
ref: inputRef
|
|
43
|
+
}, inputConfig)));
|
|
44
|
+
};
|
|
45
|
+
|
|
46
|
+
export default UploadCore;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { IconFont } from 'linkmore-design'; // 预设卡片上传样式
|
|
3
|
+
|
|
4
|
+
var uploadPicture = function uploadPicture(_ref) {
|
|
5
|
+
var instance = _ref.instance;
|
|
6
|
+
var size = instance.size;
|
|
7
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
8
|
+
className: 'lm_upload_core_picture',
|
|
9
|
+
style: {
|
|
10
|
+
height: size,
|
|
11
|
+
width: size
|
|
12
|
+
}
|
|
13
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
14
|
+
className: 'lm_upload_core_picture_action'
|
|
15
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
16
|
+
className: 'action_plus'
|
|
17
|
+
}, /*#__PURE__*/React.createElement(IconFont, {
|
|
18
|
+
type: "lmweb-plus",
|
|
19
|
+
style: {
|
|
20
|
+
fontSize: size > 48 ? 16 : 12
|
|
21
|
+
}
|
|
22
|
+
})), /*#__PURE__*/React.createElement("div", {
|
|
23
|
+
className: 'tip'
|
|
24
|
+
}, "\u4E0A\u4F20")));
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
export default uploadPicture;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
declare const useCoreOptions: ({ state, dispatch, props }: {
|
|
2
|
+
state: any;
|
|
3
|
+
dispatch: any;
|
|
4
|
+
props: any;
|
|
5
|
+
}) => {
|
|
6
|
+
CoreMethods: {
|
|
7
|
+
beforeUpload: (e: any) => false | import("../../message").MessageType;
|
|
8
|
+
};
|
|
9
|
+
RefMethods: {
|
|
10
|
+
getState: () => any;
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
export default useCoreOptions;
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
2
|
+
import { message } from 'linkmore-design';
|
|
3
|
+
|
|
4
|
+
var useCoreOptions = function useCoreOptions(_ref) {
|
|
5
|
+
var state = _ref.state,
|
|
6
|
+
dispatch = _ref.dispatch,
|
|
7
|
+
props = _ref.props;
|
|
8
|
+
var value = props.value,
|
|
9
|
+
onChange = props.onChange,
|
|
10
|
+
size = props.size,
|
|
11
|
+
type = props.type,
|
|
12
|
+
fileSize = props.fileSize,
|
|
13
|
+
fileUpload = props.fileUpload;
|
|
14
|
+
|
|
15
|
+
var uploadOnChange = function uploadOnChange(file) {
|
|
16
|
+
var fileList = [file].concat(_toConsumableArray(state.fileList));
|
|
17
|
+
console.log('fileList', fileList);
|
|
18
|
+
dispatch({
|
|
19
|
+
type: 'changeFileList',
|
|
20
|
+
fileList: fileList
|
|
21
|
+
}); // 上传事件:抛出 file: 文件 filelist: 文件列表 event: 上传进度信息
|
|
22
|
+
|
|
23
|
+
onChange === null || onChange === void 0 ? void 0 : onChange({
|
|
24
|
+
file: file,
|
|
25
|
+
fileList: fileList,
|
|
26
|
+
event: event
|
|
27
|
+
});
|
|
28
|
+
}; // 上传前的检测
|
|
29
|
+
|
|
30
|
+
|
|
31
|
+
var beforeUpload = function beforeUpload(e) {
|
|
32
|
+
var file = e.target.files; // 循环文件检查是否存在不符合要求的文件
|
|
33
|
+
|
|
34
|
+
for (var i = 0, len = file.length; i < len; i += 1) {
|
|
35
|
+
var item = file[i];
|
|
36
|
+
|
|
37
|
+
if (!type.includes(item.name.replace(/.*\./, '').toLowerCase())) {
|
|
38
|
+
var content = type.join('、');
|
|
39
|
+
return message.warning("\u6587\u4EF6\u4E0A\u4F20\u5931\u8D25\uFF01\u4EC5\u652F\u6301".concat(content, "\u7684\u6587\u4EF6\u7C7B\u578B\uFF01"), 1.5);
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
if (item.size / 1024 / 1024 > fileSize) {
|
|
43
|
+
return message.warning("\u6587\u4EF6\u4E0A\u4F20\u5931\u8D25\uFF01\u9644\u4EF6\u5927\u5C0F\u4E0D\u80FD\u8D85\u8FC7".concat(fileSize, "M\uFF01"), 1.5);
|
|
44
|
+
} // 单个文件上传
|
|
45
|
+
|
|
46
|
+
|
|
47
|
+
fileUpload === null || fileUpload === void 0 ? void 0 : fileUpload({
|
|
48
|
+
file: item,
|
|
49
|
+
size: size,
|
|
50
|
+
value: value,
|
|
51
|
+
onChange: uploadOnChange,
|
|
52
|
+
isImg: true
|
|
53
|
+
});
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
;
|
|
57
|
+
return false;
|
|
58
|
+
};
|
|
59
|
+
|
|
60
|
+
var CoreMethods = {
|
|
61
|
+
beforeUpload: beforeUpload
|
|
62
|
+
};
|
|
63
|
+
var RefMethods = {
|
|
64
|
+
getState: function getState() {
|
|
65
|
+
return state;
|
|
66
|
+
}
|
|
67
|
+
};
|
|
68
|
+
return {
|
|
69
|
+
CoreMethods: CoreMethods,
|
|
70
|
+
RefMethods: RefMethods
|
|
71
|
+
};
|
|
72
|
+
};
|
|
73
|
+
|
|
74
|
+
export default useCoreOptions;
|
|
@@ -0,0 +1,188 @@
|
|
|
1
|
+
.lm_upload_wrapper {
|
|
2
|
+
display: flex;
|
|
3
|
+
flex-wrap: wrap;
|
|
4
|
+
gap: 8px;
|
|
5
|
+
}
|
|
6
|
+
.lm_upload_wrapper .lm_upload_core {
|
|
7
|
+
display: inline-flex;
|
|
8
|
+
vertical-align: middle;
|
|
9
|
+
}
|
|
10
|
+
.lm_upload_wrapper .lm_upload_core .lm_upload_core_picture {
|
|
11
|
+
font-size: 12px;
|
|
12
|
+
display: inline-flex;
|
|
13
|
+
align-items: center;
|
|
14
|
+
justify-content: center;
|
|
15
|
+
text-align: center;
|
|
16
|
+
border: 1px solid var(--color-15);
|
|
17
|
+
background-color: var(--color-2);
|
|
18
|
+
transition: all 0.3s;
|
|
19
|
+
cursor: pointer;
|
|
20
|
+
}
|
|
21
|
+
.lm_upload_wrapper .lm_upload_core .lm_upload_core_picture:hover {
|
|
22
|
+
border-color: var(--primary-color);
|
|
23
|
+
}
|
|
24
|
+
.lm_upload_wrapper .lm_upload_core .lm_upload_core_picture .lm_upload_core_picture_action {
|
|
25
|
+
text-align: center;
|
|
26
|
+
}
|
|
27
|
+
.lm_upload_wrapper .lm_upload_core .lm_upload_core_picture .lm_upload_core_picture_action .action_plus {
|
|
28
|
+
color: var(--color-85);
|
|
29
|
+
}
|
|
30
|
+
.lm_upload_wrapper .lm_upload_core .lm_upload_core_picture .lm_upload_core_picture_action .tip {
|
|
31
|
+
color: var(--color-45);
|
|
32
|
+
margin-top: var(--gap);
|
|
33
|
+
}
|
|
34
|
+
.lm_upload_wrapper .lm_upload_item {
|
|
35
|
+
vertical-align: middle;
|
|
36
|
+
}
|
|
37
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_text {
|
|
38
|
+
display: flex;
|
|
39
|
+
align-items: center;
|
|
40
|
+
justify-content: space-between;
|
|
41
|
+
gap: var(--gap);
|
|
42
|
+
width: 100%;
|
|
43
|
+
height: 22px;
|
|
44
|
+
padding: 0 6px;
|
|
45
|
+
transition: 0.3s;
|
|
46
|
+
cursor: pointer;
|
|
47
|
+
}
|
|
48
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_text:hover {
|
|
49
|
+
background-color: var(--color-2);
|
|
50
|
+
}
|
|
51
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_text .text_left {
|
|
52
|
+
flex: 1;
|
|
53
|
+
display: flex;
|
|
54
|
+
align-items: center;
|
|
55
|
+
gap: var(--gap);
|
|
56
|
+
}
|
|
57
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_text .text_left .prefix {
|
|
58
|
+
font-size: 14px;
|
|
59
|
+
color: var(--color-45);
|
|
60
|
+
transition: 0.3s;
|
|
61
|
+
}
|
|
62
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_text .text_left .lm_upload_item_name {
|
|
63
|
+
flex: 1;
|
|
64
|
+
font-size: 14px;
|
|
65
|
+
color: var(--primary-color);
|
|
66
|
+
transition: 0.3s;
|
|
67
|
+
}
|
|
68
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_text .text_right {
|
|
69
|
+
display: inline-flex;
|
|
70
|
+
}
|
|
71
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_text .text_right .action_delete {
|
|
72
|
+
width: 24px;
|
|
73
|
+
text-align: center;
|
|
74
|
+
color: var(--color-45);
|
|
75
|
+
transition: 0.3s;
|
|
76
|
+
}
|
|
77
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_text .text_right .action_delete .anticon {
|
|
78
|
+
font-size: 14px;
|
|
79
|
+
}
|
|
80
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_text .text_right .action_delete:hover {
|
|
81
|
+
color: var(--primary-color);
|
|
82
|
+
}
|
|
83
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_card {
|
|
84
|
+
position: relative;
|
|
85
|
+
display: inline-flex;
|
|
86
|
+
align-items: center;
|
|
87
|
+
justify-content: center;
|
|
88
|
+
text-align: center;
|
|
89
|
+
border: 1px solid var(--color-15);
|
|
90
|
+
border-radius: 2px;
|
|
91
|
+
padding: var(--gap);
|
|
92
|
+
transition: all 0.3s;
|
|
93
|
+
cursor: pointer;
|
|
94
|
+
}
|
|
95
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_card .lm_upload_item_thumb {
|
|
96
|
+
width: 100%;
|
|
97
|
+
}
|
|
98
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_card .lm_upload_item_thumb img {
|
|
99
|
+
object-fit: contain;
|
|
100
|
+
}
|
|
101
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_card .lm_upload_item_error .anticon {
|
|
102
|
+
font-size: 34px;
|
|
103
|
+
}
|
|
104
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_card .lm_upload_item_error .lm_upload_item_name {
|
|
105
|
+
font-size: 12px;
|
|
106
|
+
text-overflow: ellipsis;
|
|
107
|
+
overflow: hidden;
|
|
108
|
+
margin-top: 8px;
|
|
109
|
+
}
|
|
110
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_card .lm_upload_item_mask {
|
|
111
|
+
position: absolute;
|
|
112
|
+
inset: 8px;
|
|
113
|
+
display: flex;
|
|
114
|
+
align-items: center;
|
|
115
|
+
justify-content: center;
|
|
116
|
+
background-color: rgba(0, 0, 0, 0.5);
|
|
117
|
+
opacity: 0;
|
|
118
|
+
transition: 0.3s;
|
|
119
|
+
z-index: 1;
|
|
120
|
+
}
|
|
121
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_card .lm_upload_item_mask .lm_upload_item_action {
|
|
122
|
+
display: flex;
|
|
123
|
+
align-items: center;
|
|
124
|
+
gap: var(--gap);
|
|
125
|
+
color: #fff;
|
|
126
|
+
}
|
|
127
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_card:hover .lm_upload_item_mask {
|
|
128
|
+
opacity: 1;
|
|
129
|
+
}
|
|
130
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_card.error {
|
|
131
|
+
border-color: var(--error-color);
|
|
132
|
+
}
|
|
133
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_card.error .lm_upload_item_mask {
|
|
134
|
+
display: none;
|
|
135
|
+
}
|
|
136
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_card.error .lm_upload_item_error {
|
|
137
|
+
color: var(--error-color);
|
|
138
|
+
}
|
|
139
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_picture {
|
|
140
|
+
display: flex;
|
|
141
|
+
align-items: center;
|
|
142
|
+
justify-content: space-between;
|
|
143
|
+
gap: var(--gap);
|
|
144
|
+
width: 100%;
|
|
145
|
+
border: 1px solid var(--color-15);
|
|
146
|
+
border-radius: 2px;
|
|
147
|
+
padding: var(--gap);
|
|
148
|
+
transition: 0.3s;
|
|
149
|
+
cursor: pointer;
|
|
150
|
+
}
|
|
151
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_picture:hover {
|
|
152
|
+
border-color: var(--primary-color);
|
|
153
|
+
}
|
|
154
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_picture .picture_left {
|
|
155
|
+
flex: 1;
|
|
156
|
+
display: inline-flex;
|
|
157
|
+
align-items: center;
|
|
158
|
+
gap: var(--gap);
|
|
159
|
+
}
|
|
160
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_picture .picture_left .lm_upload_item_thumb {
|
|
161
|
+
width: 48px;
|
|
162
|
+
}
|
|
163
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_picture .picture_left .lm_upload_item_thumb img {
|
|
164
|
+
width: 100%;
|
|
165
|
+
max-height: 80px;
|
|
166
|
+
}
|
|
167
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_picture .picture_left .lm_upload_item_name {
|
|
168
|
+
flex: 1;
|
|
169
|
+
font-size: 14px;
|
|
170
|
+
color: var(--primary-color);
|
|
171
|
+
transition: 0.3s;
|
|
172
|
+
}
|
|
173
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_picture .picture_right {
|
|
174
|
+
display: flex;
|
|
175
|
+
align-items: center;
|
|
176
|
+
}
|
|
177
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_picture .picture_right .action_delete {
|
|
178
|
+
width: 24px;
|
|
179
|
+
text-align: center;
|
|
180
|
+
color: var(--color-45);
|
|
181
|
+
transition: 0.3s;
|
|
182
|
+
}
|
|
183
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_picture .picture_right .action_delete .anticon {
|
|
184
|
+
font-size: 14px;
|
|
185
|
+
}
|
|
186
|
+
.lm_upload_wrapper .lm_upload_item.lm_upload_item_picture .picture_right .action_delete:hover {
|
|
187
|
+
color: var(--primary-color);
|
|
188
|
+
}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import _typeof from "@babel/runtime/helpers/esm/typeof";
|
|
2
|
+
import React from "react"; // 检查是否类组件
|
|
3
|
+
|
|
4
|
+
export function isClassComponent(component) {
|
|
5
|
+
return typeof component === 'function' && function () {
|
|
6
|
+
var proto = Object.getPrototypeOf(component);
|
|
7
|
+
return proto.prototype && proto.prototype.isReactComponent;
|
|
8
|
+
}();
|
|
9
|
+
} // 检查是否自定义组件
|
|
10
|
+
|
|
11
|
+
export function isExoticComponent(component) {
|
|
12
|
+
return _typeof(component) === 'object' && _typeof(component.$$typeof) === 'symbol' && ['react.memo', 'react.forward_ref'].includes(component.$$typeof.description);
|
|
13
|
+
} // 检查是否React组件
|
|
14
|
+
|
|
15
|
+
export function isReactComponent(component) {
|
|
16
|
+
return isClassComponent(component) || typeof component === 'function' || isExoticComponent(component);
|
|
17
|
+
}
|
|
18
|
+
export var render = function render(Comp, props) {
|
|
19
|
+
return !Comp ? null : isReactComponent(Comp) ? /*#__PURE__*/React.createElement(Comp, Object.assign({}, props)) : Comp;
|
|
20
|
+
};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
// 上传组件组合
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import UploadCore from '../body/UploadCore';
|
|
4
|
+
|
|
5
|
+
var LmUpload = function LmUpload(_ref) {
|
|
6
|
+
var instance = _ref.instance;
|
|
7
|
+
return /*#__PURE__*/React.createElement(UploadCore, {
|
|
8
|
+
instance: instance
|
|
9
|
+
});
|
|
10
|
+
};
|
|
11
|
+
|
|
12
|
+
export default LmUpload;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
// 上传组件主体区域
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import LmUpload from './Upload';
|
|
4
|
+
|
|
5
|
+
var LmUploadContainer = function LmUploadContainer(_ref) {
|
|
6
|
+
var instance = _ref.instance;
|
|
7
|
+
return /*#__PURE__*/React.createElement(LmUpload, {
|
|
8
|
+
instance: instance
|
|
9
|
+
});
|
|
10
|
+
};
|
|
11
|
+
|
|
12
|
+
export default LmUploadContainer;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
|
+
// 根文件 => 参数聚合
|
|
3
|
+
import React, { useMemo, useReducer, forwardRef, useImperativeHandle } from 'react';
|
|
4
|
+
import reducer, { initialState as initReducerState } from './reducer';
|
|
5
|
+
import useCoreOptions from '../fns';
|
|
6
|
+
import LmUploadWrapper from './UploadWrapper';
|
|
7
|
+
|
|
8
|
+
var LmUploadRoot = function LmUploadRoot(props, ref) {
|
|
9
|
+
var initialState = useMemo(function () {
|
|
10
|
+
return initReducerState(props);
|
|
11
|
+
}, []);
|
|
12
|
+
|
|
13
|
+
var _useReducer = useReducer(reducer, initialState),
|
|
14
|
+
_useReducer2 = _slicedToArray(_useReducer, 2),
|
|
15
|
+
state = _useReducer2[0],
|
|
16
|
+
dispatch = _useReducer2[1]; // 获取核心Methods
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
var _useCoreOptions = useCoreOptions({
|
|
20
|
+
state: state,
|
|
21
|
+
dispatch: dispatch,
|
|
22
|
+
props: props
|
|
23
|
+
}),
|
|
24
|
+
CoreMethods = _useCoreOptions.CoreMethods,
|
|
25
|
+
RefMethods = _useCoreOptions.RefMethods; // 组件实例
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
var instance = Object.assign(Object.assign(Object.assign(Object.assign({}, props), CoreMethods), RefMethods), {
|
|
29
|
+
state: state,
|
|
30
|
+
dispatch: dispatch
|
|
31
|
+
}); // 向外暴露出的方法
|
|
32
|
+
|
|
33
|
+
useImperativeHandle(ref, function () {
|
|
34
|
+
return Object.assign({}, RefMethods);
|
|
35
|
+
});
|
|
36
|
+
return /*#__PURE__*/React.createElement(LmUploadWrapper, {
|
|
37
|
+
instance: instance
|
|
38
|
+
});
|
|
39
|
+
};
|
|
40
|
+
|
|
41
|
+
export default /*#__PURE__*/forwardRef(LmUploadRoot);
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
// 包裹上传组件区域: 拓展其他结构
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import LmUploadContainer from './UploadContainer';
|
|
4
|
+
import LmUploadList from '../UploadList';
|
|
5
|
+
import LmUploadView from '../view';
|
|
6
|
+
|
|
7
|
+
var LmUploadWrapper = function LmUploadWrapper(_ref) {
|
|
8
|
+
var instance = _ref.instance;
|
|
9
|
+
var wrapper = instance.components.wrapper;
|
|
10
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
11
|
+
className: 'lm_upload_wrapper'
|
|
12
|
+
}, wrapper === null || wrapper === void 0 ? void 0 : wrapper( /*#__PURE__*/React.createElement(LmUploadContainer, {
|
|
13
|
+
instance: instance
|
|
14
|
+
}), /*#__PURE__*/React.createElement(LmUploadList, {
|
|
15
|
+
instance: instance
|
|
16
|
+
})), /*#__PURE__*/React.createElement(LmUploadView, {
|
|
17
|
+
instance: instance
|
|
18
|
+
}));
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
export default LmUploadWrapper;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
// 状态管理操作
|
|
2
|
+
export var reducer = function reducer(state, action) {
|
|
3
|
+
var fileList = action.fileList;
|
|
4
|
+
|
|
5
|
+
switch (action.type) {
|
|
6
|
+
case 'changeFileList':
|
|
7
|
+
return Object.assign(Object.assign({}, state), {
|
|
8
|
+
fileList: fileList
|
|
9
|
+
});
|
|
10
|
+
|
|
11
|
+
default:
|
|
12
|
+
throw new Error();
|
|
13
|
+
}
|
|
14
|
+
}; // 仅在初始化时触发一次
|
|
15
|
+
|
|
16
|
+
export var initialState = function initialState(props) {
|
|
17
|
+
var defaultFileList = props.defaultFileList,
|
|
18
|
+
upload = props.upload;
|
|
19
|
+
return {
|
|
20
|
+
upload: upload,
|
|
21
|
+
process: 0,
|
|
22
|
+
status: 'done',
|
|
23
|
+
fileList: defaultFileList
|
|
24
|
+
};
|
|
25
|
+
};
|
|
26
|
+
export default reducer;
|
package/lib/Approval/index.d.ts
CHANGED
|
@@ -1,24 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
|
|
3
|
-
export interface IApprovalItemProps {
|
|
4
|
-
avator?: string;
|
|
5
|
-
name?: string;
|
|
6
|
-
time?: string;
|
|
7
|
-
type?: 'start' | 'comment' | 'carbonCopy' | 'agree' | 'refuse';
|
|
8
|
-
[prop: string]: any;
|
|
9
|
-
}
|
|
10
|
-
export interface IApprovalProps {
|
|
11
|
-
visible?: boolean;
|
|
12
|
-
title?: string;
|
|
13
|
-
close?: () => void;
|
|
14
|
-
className?: string;
|
|
15
|
-
style?: React.CSSProperties;
|
|
16
|
-
userType?: 'self' | 'approver';
|
|
17
|
-
status?: number;
|
|
18
|
-
steps?: [];
|
|
19
|
-
onComment: VoidFunction;
|
|
20
|
-
onRefuse: VoidFunction;
|
|
21
|
-
onAgree: VoidFunction;
|
|
22
|
-
}
|
|
2
|
+
import { IApprovalProps } from './type';
|
|
23
3
|
declare const LMApproval: React.FC<IApprovalProps>;
|
|
24
4
|
export default LMApproval;
|