@yilianjituan/yilian_dgerm 0.0.1-alpha.30 → 0.0.1-alpha.31
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/components/FileUpload/fileUtil.d.ts +34 -0
- package/dist/components/FileUpload/fileUtil.js +146 -0
- package/dist/components/FileUpload/index.d.ts +5 -0
- package/dist/components/FileUpload/index.interface.d.ts +119 -0
- package/dist/components/FileUpload/index.interface.js +1 -0
- package/dist/components/FileUpload/index.js +389 -0
- package/dist/components/FileUpload/index.scss +78 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -0
- package/package.json +5 -2
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { IInitDataType } from './index.interface';
|
|
2
|
+
export declare const accept = ".rar,.zip,.gzip,.txt,.pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.wps,.sav,.caj,.rtf,.hlp,.jpg,.jpeg,.png,.gif,.bmp,.psd,.tif,.mkv,.mp4,.avi,.swf,.wmv,.rmvb,.mov,.mpq,.3gp,.m4v,.webm,.flv,.mp3,.wma,.wav,.amr,.m4a,.aac";
|
|
3
|
+
export declare const acceptList: string[];
|
|
4
|
+
export declare const fileExtensions: string[];
|
|
5
|
+
export declare const videoFormats: string[];
|
|
6
|
+
export declare const documentExtensions: string[];
|
|
7
|
+
export declare const acceptTypes: {
|
|
8
|
+
image: string;
|
|
9
|
+
video: string;
|
|
10
|
+
document: string;
|
|
11
|
+
all: string;
|
|
12
|
+
};
|
|
13
|
+
export declare const acceptListTypes: {
|
|
14
|
+
image: string[];
|
|
15
|
+
video: string[];
|
|
16
|
+
document: string[];
|
|
17
|
+
all: string[];
|
|
18
|
+
};
|
|
19
|
+
/**
|
|
20
|
+
* 数据转换.
|
|
21
|
+
* 需要兼容多种情况
|
|
22
|
+
* 1:初始化正常数据回填
|
|
23
|
+
* 2:外部设置(映射)的数据回填
|
|
24
|
+
* 3:组件上传可能有已完成和未完成的数据回填
|
|
25
|
+
* 4:同时多个上传时,需考虑oss返回的数据格式
|
|
26
|
+
*
|
|
27
|
+
* 对未完成的增加URL参数是为了防止完成后的数据diff重新渲染,导致上传组件闪烁
|
|
28
|
+
* @param data - 需要转换的数据
|
|
29
|
+
* @param loading - 判断是否是已完成的数据
|
|
30
|
+
* @returns 返回组好的数据
|
|
31
|
+
*/
|
|
32
|
+
export declare const dataChange: (dataFormat: string, data: IInitDataType[], loading?: boolean) => any[];
|
|
33
|
+
export declare const fileChange: (file: any) => any;
|
|
34
|
+
export declare const imageListChange: (file: any) => any;
|
|
@@ -0,0 +1,146 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
7
|
+
/*
|
|
8
|
+
* @Author: 耿禹
|
|
9
|
+
* @Date: 2024-09-20 09:49:47
|
|
10
|
+
* @Last Modified by: 耿禹
|
|
11
|
+
* @Last Modified time: 2024-10-29 18:10:56
|
|
12
|
+
*/
|
|
13
|
+
|
|
14
|
+
// 所有类型
|
|
15
|
+
export var accept = '.rar,.zip,.gzip,.txt,.pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.wps,.sav,.caj,.rtf,.hlp,.jpg,.jpeg,.png,.gif,.bmp,.psd,.tif,.mkv,.mp4,.avi,.swf,.wmv,.rmvb,.mov,.mpq,.3gp,.m4v,.webm,.flv,.mp3,.wma,.wav,.amr,.m4a,.aac';
|
|
16
|
+
// 所有类型List
|
|
17
|
+
export var acceptList = accept.split(',');
|
|
18
|
+
// 图片类型
|
|
19
|
+
var imageAccept = '.png,.jpg,.jpeg,.gif,.bmp,.heic,.svg';
|
|
20
|
+
export var fileExtensions = ['.png', '.jpg', '.jpeg', '.gif', '.bmp', '.heic', '.svg'];
|
|
21
|
+
// 视频类型
|
|
22
|
+
var videoAccept = '.mp4,.3gp,.m4v,.webm';
|
|
23
|
+
export var videoFormats = ['.mp4', '.3gp', '.m4v', '.webm'];
|
|
24
|
+
// 默认文件类型
|
|
25
|
+
var documentAccept = '.doc,.docx,.xls,.xlsx,.ppt,.pptx,.pdf';
|
|
26
|
+
// 可在三方链接打开的文件类型
|
|
27
|
+
export var documentExtensions = ['.doc', '.docx', '.xls', '.xlsx', '.ppt', '.pptx', '.pdf'];
|
|
28
|
+
// 类型枚举
|
|
29
|
+
export var acceptTypes = {
|
|
30
|
+
image: imageAccept,
|
|
31
|
+
video: videoAccept,
|
|
32
|
+
document: documentAccept,
|
|
33
|
+
all: accept
|
|
34
|
+
};
|
|
35
|
+
// 默认类型list
|
|
36
|
+
export var acceptListTypes = {
|
|
37
|
+
image: fileExtensions,
|
|
38
|
+
video: videoFormats,
|
|
39
|
+
document: documentExtensions,
|
|
40
|
+
all: acceptList
|
|
41
|
+
};
|
|
42
|
+
/**
|
|
43
|
+
* 数据转换.
|
|
44
|
+
* 需要兼容多种情况
|
|
45
|
+
* 1:初始化正常数据回填
|
|
46
|
+
* 2:外部设置(映射)的数据回填
|
|
47
|
+
* 3:组件上传可能有已完成和未完成的数据回填
|
|
48
|
+
* 4:同时多个上传时,需考虑oss返回的数据格式
|
|
49
|
+
*
|
|
50
|
+
* 对未完成的增加URL参数是为了防止完成后的数据diff重新渲染,导致上传组件闪烁
|
|
51
|
+
* @param data - 需要转换的数据
|
|
52
|
+
* @param loading - 判断是否是已完成的数据
|
|
53
|
+
* @returns 返回组好的数据
|
|
54
|
+
*/
|
|
55
|
+
export var dataChange = function dataChange(dataFormat, data) {
|
|
56
|
+
var loading = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
57
|
+
// 未完成的增加空URL
|
|
58
|
+
if (loading) {
|
|
59
|
+
return data === null || data === void 0 ? void 0 : data.map(function (item) {
|
|
60
|
+
return _objectSpread(_objectSpread({}, item), {}, {
|
|
61
|
+
url: ''
|
|
62
|
+
});
|
|
63
|
+
});
|
|
64
|
+
}
|
|
65
|
+
// 已完成的数据处理
|
|
66
|
+
// 文件
|
|
67
|
+
if (dataFormat === 'object') {
|
|
68
|
+
return data === null || data === void 0 ? void 0 : data.map(function (item, index) {
|
|
69
|
+
var content = item.content,
|
|
70
|
+
name = item.name,
|
|
71
|
+
fileSize = item.fileSize,
|
|
72
|
+
uid = item.uid,
|
|
73
|
+
url = item.url,
|
|
74
|
+
response = item.response,
|
|
75
|
+
size = item.size;
|
|
76
|
+
var _url = url || content || (response === null || response === void 0 ? void 0 : response.url) || ''; // url: 已经处理完的时候,content: 未处理的时候,response: 多文件同时上传时
|
|
77
|
+
var _size = fileSize || size || 0; // 文件大小
|
|
78
|
+
var isVideo = videoFormats.some(function (format) {
|
|
79
|
+
return _url === null || _url === void 0 ? void 0 : _url.endsWith(format);
|
|
80
|
+
}); // 判断是否为视频格式
|
|
81
|
+
var _thumbUrl = isVideo ? "".concat(_url, "?x-oss-process=video/snapshot,t_1000,f_jpg,w_0,h_0,m_fast,ar_auto") : _url; // 视频的缩略图处理, 非视频文件直接使用原始 URL 作为缩略图
|
|
82
|
+
return {
|
|
83
|
+
uid: uid || _url,
|
|
84
|
+
// 每个文件的唯一标识符
|
|
85
|
+
name: name || "\u6587\u4EF6-".concat(index + 1),
|
|
86
|
+
// 自定义名称
|
|
87
|
+
status: 'done',
|
|
88
|
+
// 标记文件已成功上传
|
|
89
|
+
url: _url,
|
|
90
|
+
// 使用 URL 作为资源链接
|
|
91
|
+
thumbUrl: _thumbUrl,
|
|
92
|
+
// 缩略图
|
|
93
|
+
fileSize: _size // 文件大小
|
|
94
|
+
};
|
|
95
|
+
});
|
|
96
|
+
} else {
|
|
97
|
+
// 图片
|
|
98
|
+
return data === null || data === void 0 ? void 0 : data.map(function (item, index) {
|
|
99
|
+
// 未处理时为string
|
|
100
|
+
if (typeof item === 'string') {
|
|
101
|
+
return {
|
|
102
|
+
uid: item,
|
|
103
|
+
name: "picture-".concat(index + 1),
|
|
104
|
+
status: 'done',
|
|
105
|
+
url: item
|
|
106
|
+
};
|
|
107
|
+
} else {
|
|
108
|
+
var url = item.url,
|
|
109
|
+
name = item.name,
|
|
110
|
+
uid = item.uid,
|
|
111
|
+
response = item.response,
|
|
112
|
+
status = item.status;
|
|
113
|
+
var _url = url || (response === null || response === void 0 ? void 0 : response.url); // url: 已经处理完的时候,response: 多文件同时上传时
|
|
114
|
+
return {
|
|
115
|
+
uid: uid || _url,
|
|
116
|
+
// 每个文件的唯一标识符
|
|
117
|
+
name: name || "\u6587\u4EF6-".concat(index + 1),
|
|
118
|
+
// 自定义名称
|
|
119
|
+
status: status,
|
|
120
|
+
// 标记文件已成功上传
|
|
121
|
+
url: _url // 使用 URL 作为资源链接
|
|
122
|
+
};
|
|
123
|
+
}
|
|
124
|
+
});
|
|
125
|
+
}
|
|
126
|
+
};
|
|
127
|
+
|
|
128
|
+
// 文件改变存储文件处理
|
|
129
|
+
export var fileChange = function fileChange(file) {
|
|
130
|
+
return file.map(function (file) {
|
|
131
|
+
var _file$response;
|
|
132
|
+
return {
|
|
133
|
+
content: file.url || ((_file$response = file.response) === null || _file$response === void 0 ? void 0 : _file$response.url) || file.content,
|
|
134
|
+
name: file.name,
|
|
135
|
+
fileSize: file.fileSize || file.size
|
|
136
|
+
};
|
|
137
|
+
});
|
|
138
|
+
};
|
|
139
|
+
|
|
140
|
+
// string 或 image 数据处理
|
|
141
|
+
export var imageListChange = function imageListChange(file) {
|
|
142
|
+
return file.map(function (file) {
|
|
143
|
+
var _file$response2;
|
|
144
|
+
return file.url || ((_file$response2 = file.response) === null || _file$response2 === void 0 ? void 0 : _file$response2.url) || file.content;
|
|
145
|
+
});
|
|
146
|
+
};
|
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
import { FormItemProps, UploadProps } from "antd";
|
|
2
|
+
export interface IProps {
|
|
3
|
+
/**
|
|
4
|
+
* @description 阿里云上传实例和配置
|
|
5
|
+
*/
|
|
6
|
+
aliyunProps: {
|
|
7
|
+
ossUpload: any;
|
|
8
|
+
OSSINIT: any;
|
|
9
|
+
};
|
|
10
|
+
/**
|
|
11
|
+
* @description 上传的提示信息
|
|
12
|
+
* @required
|
|
13
|
+
* @default false
|
|
14
|
+
*/
|
|
15
|
+
tips?: {
|
|
16
|
+
/**
|
|
17
|
+
* @description 是否需要提示
|
|
18
|
+
* @default false
|
|
19
|
+
*/
|
|
20
|
+
needTips?: boolean;
|
|
21
|
+
/**
|
|
22
|
+
* @description 提示文字
|
|
23
|
+
*/
|
|
24
|
+
tipsText?: string;
|
|
25
|
+
/**
|
|
26
|
+
* @description 自定义提示样式
|
|
27
|
+
*/
|
|
28
|
+
tipsStyle?: object;
|
|
29
|
+
};
|
|
30
|
+
/**
|
|
31
|
+
* @description 表单属性配置
|
|
32
|
+
*/
|
|
33
|
+
formProps: {
|
|
34
|
+
/**
|
|
35
|
+
* @description 表单字段名称
|
|
36
|
+
*/
|
|
37
|
+
name: string;
|
|
38
|
+
/**
|
|
39
|
+
* @description 如果为 Form.List,则需要指定父级 name
|
|
40
|
+
*/
|
|
41
|
+
parentName?: string;
|
|
42
|
+
/**
|
|
43
|
+
* @description 如果为 Form.List,则需要指定当前项的索引
|
|
44
|
+
*/
|
|
45
|
+
index?: number;
|
|
46
|
+
/**
|
|
47
|
+
* @description 需要传入和返回的数据格式,必须一致
|
|
48
|
+
* @default 'string'
|
|
49
|
+
*/
|
|
50
|
+
dataFormat?: 'string' | 'object';
|
|
51
|
+
} & FormItemProps;
|
|
52
|
+
/**
|
|
53
|
+
* @description 上传组件的配置
|
|
54
|
+
*/
|
|
55
|
+
uploadProps?: {
|
|
56
|
+
/**
|
|
57
|
+
* @description 最大上传数量
|
|
58
|
+
* @default 1
|
|
59
|
+
*/
|
|
60
|
+
maxCount?: number;
|
|
61
|
+
/**
|
|
62
|
+
* @description 接受的文件类型
|
|
63
|
+
* @default 'image'
|
|
64
|
+
*/
|
|
65
|
+
type?: 'image' | 'video' | 'document' | 'all';
|
|
66
|
+
/**
|
|
67
|
+
* @description 最大文件大小(单位:MB)
|
|
68
|
+
* @default 2
|
|
69
|
+
*/
|
|
70
|
+
maxSize?: number;
|
|
71
|
+
/**
|
|
72
|
+
* @description 是否为编辑状态
|
|
73
|
+
*/
|
|
74
|
+
isDetails?: boolean;
|
|
75
|
+
/**
|
|
76
|
+
* @description 上传列表的样式类型
|
|
77
|
+
* @default 'picture-card'
|
|
78
|
+
*/
|
|
79
|
+
listType?: 'text' | 'picture' | 'picture-card' | 'picture-circle';
|
|
80
|
+
/**
|
|
81
|
+
* @description 接受上传的文件类型;如果设置了 accept,则 type 无效
|
|
82
|
+
*/
|
|
83
|
+
accept?: string;
|
|
84
|
+
} & Omit<UploadProps, 'type'>;
|
|
85
|
+
}
|
|
86
|
+
export interface AliyunOSSUploadProps extends IProps {
|
|
87
|
+
/**
|
|
88
|
+
* @description 当前上传的文件列表
|
|
89
|
+
*/
|
|
90
|
+
value?: any[];
|
|
91
|
+
/**
|
|
92
|
+
* @description 上传文件变更事件
|
|
93
|
+
*/
|
|
94
|
+
onChange?: (value: any) => void;
|
|
95
|
+
/**
|
|
96
|
+
* @description 视频播放链接设置方法
|
|
97
|
+
*/
|
|
98
|
+
setCurrVideoLink: (value: string) => void;
|
|
99
|
+
/**
|
|
100
|
+
* @description 图片预览弹窗设置方法
|
|
101
|
+
*/
|
|
102
|
+
setPreviewOpen: (value: boolean) => void;
|
|
103
|
+
/**
|
|
104
|
+
* @description 图片预览链接设置方法
|
|
105
|
+
*/
|
|
106
|
+
setPreviewImage: (value: string) => void;
|
|
107
|
+
}
|
|
108
|
+
export interface IInitDataType {
|
|
109
|
+
content?: string;
|
|
110
|
+
name?: string;
|
|
111
|
+
fileSize?: string;
|
|
112
|
+
size?: string;
|
|
113
|
+
uid?: string;
|
|
114
|
+
url?: string;
|
|
115
|
+
response?: {
|
|
116
|
+
url: string;
|
|
117
|
+
};
|
|
118
|
+
status?: 'done' | 'error' | 'uploading' | 'removed';
|
|
119
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,389 @@
|
|
|
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 = ["maxCount", "type", "maxSize", "isDetails", "listType", "accept"],
|
|
3
|
+
_excluded2 = ["name", "parentName", "index"];
|
|
4
|
+
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); }
|
|
5
|
+
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; }
|
|
6
|
+
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; }
|
|
7
|
+
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; }
|
|
8
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
9
|
+
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); }
|
|
10
|
+
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, catch: function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
|
|
11
|
+
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
|
|
12
|
+
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
|
|
13
|
+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
14
|
+
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."); }
|
|
15
|
+
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
16
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
17
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
18
|
+
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."); }
|
|
19
|
+
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); }
|
|
20
|
+
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; }
|
|
21
|
+
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; } }
|
|
22
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
23
|
+
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; }
|
|
24
|
+
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; }
|
|
25
|
+
import { CloseOutlined, DeleteOutlined, PlusOutlined } from "@ant-design/icons";
|
|
26
|
+
import { useUpdateEffect } from 'ahooks';
|
|
27
|
+
import { Form, Image, message, Tooltip, Upload } from "antd";
|
|
28
|
+
import heic2any from "heic2any";
|
|
29
|
+
import React, { useEffect, useState } from "react";
|
|
30
|
+
import "./index.scss";
|
|
31
|
+
import { acceptListTypes, acceptTypes, dataChange, documentExtensions, fileChange, fileExtensions, imageListChange, videoFormats } from "./fileUtil";
|
|
32
|
+
var AliyunOSSUpload = function AliyunOSSUpload(props) {
|
|
33
|
+
var value = props.value,
|
|
34
|
+
formOnChange = props.onChange,
|
|
35
|
+
_props$uploadProps = props.uploadProps,
|
|
36
|
+
uploadProps = _props$uploadProps === void 0 ? {} : _props$uploadProps,
|
|
37
|
+
aliyunProps = props.aliyunProps,
|
|
38
|
+
formProps = props.formProps,
|
|
39
|
+
setCurrVideoLink = props.setCurrVideoLink,
|
|
40
|
+
setPreviewOpen = props.setPreviewOpen,
|
|
41
|
+
setPreviewImage = props.setPreviewImage;
|
|
42
|
+
var ossUpload = aliyunProps.ossUpload,
|
|
43
|
+
OSSINIT = aliyunProps.OSSINIT;
|
|
44
|
+
var _formProps$dataFormat = formProps.dataFormat,
|
|
45
|
+
dataFormat = _formProps$dataFormat === void 0 ? 'string' : _formProps$dataFormat; // form的参数
|
|
46
|
+
var _uploadProps$maxCount = uploadProps.maxCount,
|
|
47
|
+
maxCount = _uploadProps$maxCount === void 0 ? 1 : _uploadProps$maxCount,
|
|
48
|
+
_uploadProps$type = uploadProps.type,
|
|
49
|
+
type = _uploadProps$type === void 0 ? 'image' : _uploadProps$type,
|
|
50
|
+
_uploadProps$maxSize = uploadProps.maxSize,
|
|
51
|
+
maxSize = _uploadProps$maxSize === void 0 ? 2 : _uploadProps$maxSize,
|
|
52
|
+
_uploadProps$isDetail = uploadProps.isDetails,
|
|
53
|
+
isDetails = _uploadProps$isDetail === void 0 ? false : _uploadProps$isDetail,
|
|
54
|
+
_uploadProps$listType = uploadProps.listType,
|
|
55
|
+
listType = _uploadProps$listType === void 0 ? 'picture-card' : _uploadProps$listType,
|
|
56
|
+
accept = uploadProps.accept,
|
|
57
|
+
otherUploadProps = _objectWithoutProperties(uploadProps, _excluded); // 上传组件的参数
|
|
58
|
+
var _isObject = dataFormat === 'object'; // 是否为对象数据
|
|
59
|
+
var _useState = useState([]),
|
|
60
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
61
|
+
fileList = _useState2[0],
|
|
62
|
+
setFileList = _useState2[1];
|
|
63
|
+
useEffect(function () {
|
|
64
|
+
// 有答案
|
|
65
|
+
if (value && (value === null || value === void 0 ? void 0 : value.length) > 0) {
|
|
66
|
+
// 需要返回的格式为对象
|
|
67
|
+
setFileList(dataChange(dataFormat, value));
|
|
68
|
+
}
|
|
69
|
+
}, []);
|
|
70
|
+
useUpdateEffect(function () {
|
|
71
|
+
if (!value || (value === null || value === void 0 ? void 0 : value.length) === 0) {
|
|
72
|
+
setFileList([]);
|
|
73
|
+
return;
|
|
74
|
+
}
|
|
75
|
+
var _hasContent = [];
|
|
76
|
+
if (_isObject) {
|
|
77
|
+
// 文件,对已完成或者传入的正常有content的数据进行处理
|
|
78
|
+
_hasContent = dataChange(dataFormat, value === null || value === void 0 ? void 0 : value.filter(function (item) {
|
|
79
|
+
return (item === null || item === void 0 ? void 0 : item.content) || (item === null || item === void 0 ? void 0 : item.status) === 'done';
|
|
80
|
+
}));
|
|
81
|
+
} else {
|
|
82
|
+
// 图片,对list里是否是url进行处理
|
|
83
|
+
_hasContent = dataChange(dataFormat, value === null || value === void 0 ? void 0 : value.filter(function (item) {
|
|
84
|
+
return typeof item === 'string' || (item === null || item === void 0 ? void 0 : item.status) === 'done';
|
|
85
|
+
}));
|
|
86
|
+
}
|
|
87
|
+
// 对正在上传或者上传失败的数据进行处理的数据进行处理
|
|
88
|
+
var _noContent = dataChange(dataFormat, value === null || value === void 0 ? void 0 : value.filter(function (item) {
|
|
89
|
+
return ['uploading'].includes(item === null || item === void 0 ? void 0 : item.status);
|
|
90
|
+
}), true);
|
|
91
|
+
setFileList([].concat(_toConsumableArray(_hasContent), _toConsumableArray(_noContent)));
|
|
92
|
+
}, [value]);
|
|
93
|
+
var onChange = function onChange(_ref) {
|
|
94
|
+
var _file$error;
|
|
95
|
+
var file = _ref.file,
|
|
96
|
+
fileList = _ref.fileList;
|
|
97
|
+
if ((fileList === null || fileList === void 0 ? void 0 : fileList.length) === 0) {
|
|
98
|
+
formOnChange === null || formOnChange === void 0 || formOnChange([]);
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
// 上传失败提示
|
|
102
|
+
if (file !== null && file !== void 0 && file.error && (file === null || file === void 0 || (_file$error = file.error) === null || _file$error === void 0 ? void 0 : _file$error.uploadStatus) === 'error') {
|
|
103
|
+
var _file$error2;
|
|
104
|
+
message.error(file === null || file === void 0 || (_file$error2 = file.error) === null || _file$error2 === void 0 ? void 0 : _file$error2.errorMessage);
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
// 当前所有文件是否完成,必须判断所有,否则多任务并行会覆盖
|
|
108
|
+
var _isAllReady = fileList.every(function (item) {
|
|
109
|
+
return (item === null || item === void 0 ? void 0 : item.status) === 'done';
|
|
110
|
+
});
|
|
111
|
+
if (_isAllReady) {
|
|
112
|
+
// 完成则处理数据重新回填
|
|
113
|
+
// 文件改变存储文件处理
|
|
114
|
+
var uploadedUrls = _isObject ? fileChange(fileList) : imageListChange(fileList);
|
|
115
|
+
// 全部处理完调用formOnChange
|
|
116
|
+
formOnChange === null || formOnChange === void 0 || formOnChange(uploadedUrls);
|
|
117
|
+
} else {
|
|
118
|
+
// 存在未完成分开处理
|
|
119
|
+
// 已完成的数据
|
|
120
|
+
var _hasContent = _isObject ? fileList.filter(function (item) {
|
|
121
|
+
return (item === null || item === void 0 ? void 0 : item.status) === 'done';
|
|
122
|
+
}) : fileList.filter(function (item) {
|
|
123
|
+
return typeof item === 'string' || (item === null || item === void 0 ? void 0 : item.status) === 'done';
|
|
124
|
+
});
|
|
125
|
+
// 未完成的处理
|
|
126
|
+
var _noContent = dataChange(dataFormat, fileList.filter(function (item) {
|
|
127
|
+
return ['uploading'].includes(item === null || item === void 0 ? void 0 : item.status);
|
|
128
|
+
}), true);
|
|
129
|
+
// 为处理完更新list
|
|
130
|
+
setFileList([].concat(_toConsumableArray(_hasContent), _toConsumableArray(_noContent)));
|
|
131
|
+
}
|
|
132
|
+
};
|
|
133
|
+
|
|
134
|
+
// 自定义上传
|
|
135
|
+
var uploadFile = /*#__PURE__*/function () {
|
|
136
|
+
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(event) {
|
|
137
|
+
var _acceptListTypes$type;
|
|
138
|
+
var file, isTrueType, _maxSize, isSize, fileName, onProgress, resVal, _ref3, _ref3$res, status, requestUrls;
|
|
139
|
+
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
140
|
+
while (1) switch (_context.prev = _context.next) {
|
|
141
|
+
case 0:
|
|
142
|
+
if (!(!(ossUpload !== null && ossUpload !== void 0 && ossUpload.multipartUpload) || !(ossUpload !== null && ossUpload !== void 0 && ossUpload.uploadOssFn) || !OSSINIT)) {
|
|
143
|
+
_context.next = 3;
|
|
144
|
+
break;
|
|
145
|
+
}
|
|
146
|
+
event === null || event === void 0 || event.onError({
|
|
147
|
+
errorMessage: "\u8BF7\u5148\u914D\u7F6E\u963F\u91CC\u4E91\u4E0A\u4F20",
|
|
148
|
+
uploadStatus: 'error'
|
|
149
|
+
});
|
|
150
|
+
return _context.abrupt("return");
|
|
151
|
+
case 3:
|
|
152
|
+
file = event.file; // 根据文件名后缀判断是否为正确的格式
|
|
153
|
+
isTrueType = (_acceptListTypes$type = acceptListTypes[type]) === null || _acceptListTypes$type === void 0 ? void 0 : _acceptListTypes$type.some(function (item) {
|
|
154
|
+
return file.name.includes(item);
|
|
155
|
+
});
|
|
156
|
+
if (isTrueType) {
|
|
157
|
+
_context.next = 8;
|
|
158
|
+
break;
|
|
159
|
+
}
|
|
160
|
+
event === null || event === void 0 || event.onError({
|
|
161
|
+
errorMessage: "\u8BF7\u4E0A\u4F20\u6B63\u786E\u683C\u5F0F\u7684\u6587\u4EF6\uFF01",
|
|
162
|
+
uploadStatus: 'error'
|
|
163
|
+
});
|
|
164
|
+
return _context.abrupt("return");
|
|
165
|
+
case 8:
|
|
166
|
+
// 因为和服务端获取到的字节数不一致,需要调小之后对比
|
|
167
|
+
_maxSize = maxSize * 1024 * 1024;
|
|
168
|
+
isSize = file.size > _maxSize;
|
|
169
|
+
if (!isSize) {
|
|
170
|
+
_context.next = 13;
|
|
171
|
+
break;
|
|
172
|
+
}
|
|
173
|
+
event === null || event === void 0 || event.onError({
|
|
174
|
+
errorMessage: "\u6587\u4EF6\u5FC5\u987B\u5C0F\u4E8E".concat(maxSize, "M\uFF01"),
|
|
175
|
+
uploadStatus: 'error'
|
|
176
|
+
});
|
|
177
|
+
return _context.abrupt("return");
|
|
178
|
+
case 13:
|
|
179
|
+
fileName = "".concat(OSSINIT.basePath, "/").concat(new Date().getTime(), "/").concat(file.name);
|
|
180
|
+
onProgress = function onProgress(p) {
|
|
181
|
+
return event === null || event === void 0 ? void 0 : event.onProgress({
|
|
182
|
+
percent: p
|
|
183
|
+
});
|
|
184
|
+
}; // 定义result
|
|
185
|
+
resVal = {}; // 文件大于5M进行分片上传(返回进度)
|
|
186
|
+
if (!(file.size > 5 * 1024 * 1024)) {
|
|
187
|
+
_context.next = 22;
|
|
188
|
+
break;
|
|
189
|
+
}
|
|
190
|
+
_context.next = 19;
|
|
191
|
+
return ossUpload.multipartUpload(fileName, file, onProgress);
|
|
192
|
+
case 19:
|
|
193
|
+
resVal = _context.sent;
|
|
194
|
+
_context.next = 25;
|
|
195
|
+
break;
|
|
196
|
+
case 22:
|
|
197
|
+
_context.next = 24;
|
|
198
|
+
return ossUpload.uploadOssFn(fileName, file);
|
|
199
|
+
case 24:
|
|
200
|
+
resVal = _context.sent;
|
|
201
|
+
case 25:
|
|
202
|
+
_ref3 = resVal || {}, _ref3$res = _ref3.res, status = _ref3$res.status, requestUrls = _ref3$res.requestUrls;
|
|
203
|
+
if (!(!resVal || status !== 200)) {
|
|
204
|
+
_context.next = 32;
|
|
205
|
+
break;
|
|
206
|
+
}
|
|
207
|
+
message.error("上传失败");
|
|
208
|
+
event === null || event === void 0 || event.onError({
|
|
209
|
+
errorMessage: '上传失败',
|
|
210
|
+
uploadStatus: 'error'
|
|
211
|
+
});
|
|
212
|
+
return _context.abrupt("return");
|
|
213
|
+
case 32:
|
|
214
|
+
event === null || event === void 0 || event.onSuccess({
|
|
215
|
+
url: Array.isArray(requestUrls) ? requestUrls[0] : requestUrls
|
|
216
|
+
});
|
|
217
|
+
case 33:
|
|
218
|
+
case "end":
|
|
219
|
+
return _context.stop();
|
|
220
|
+
}
|
|
221
|
+
}, _callee);
|
|
222
|
+
}));
|
|
223
|
+
return function uploadFile(_x) {
|
|
224
|
+
return _ref2.apply(this, arguments);
|
|
225
|
+
};
|
|
226
|
+
}();
|
|
227
|
+
|
|
228
|
+
// 文件查看
|
|
229
|
+
var handlePreview = function handlePreview(file) {
|
|
230
|
+
var _file$response;
|
|
231
|
+
var _url = (file === null || file === void 0 ? void 0 : file.url) || (file === null || file === void 0 ? void 0 : file.thumbUrl) || (file === null || file === void 0 || (_file$response = file.response) === null || _file$response === void 0 ? void 0 : _file$response.result);
|
|
232
|
+
var lowerCaseUrl = _url.toLowerCase();
|
|
233
|
+
var isImage = fileExtensions.some(function (ext) {
|
|
234
|
+
return lowerCaseUrl.endsWith(ext);
|
|
235
|
+
});
|
|
236
|
+
var isFile = documentExtensions.some(function (ext) {
|
|
237
|
+
return lowerCaseUrl.endsWith(ext);
|
|
238
|
+
});
|
|
239
|
+
var isVideo = videoFormats.some(function (ext) {
|
|
240
|
+
return lowerCaseUrl.endsWith(ext);
|
|
241
|
+
});
|
|
242
|
+
if (isImage) {
|
|
243
|
+
// 针对heic格式的图片, 特殊处理
|
|
244
|
+
if (lowerCaseUrl.endsWith('.heic')) {
|
|
245
|
+
fetch(lowerCaseUrl).then(function (res) {
|
|
246
|
+
return res.blob();
|
|
247
|
+
}).then(function (blob) {
|
|
248
|
+
return heic2any({
|
|
249
|
+
blob: blob,
|
|
250
|
+
toType: "image/jpeg",
|
|
251
|
+
quality: 0.5 // cuts the quality and size by half
|
|
252
|
+
});
|
|
253
|
+
}).then(function (conversionResult) {
|
|
254
|
+
var url = URL.createObjectURL(conversionResult);
|
|
255
|
+
setPreviewImage(url);
|
|
256
|
+
setPreviewOpen(true);
|
|
257
|
+
}).catch(function () {
|
|
258
|
+
// see error handling section
|
|
259
|
+
});
|
|
260
|
+
} else {
|
|
261
|
+
setPreviewImage(_url);
|
|
262
|
+
setPreviewOpen(true);
|
|
263
|
+
}
|
|
264
|
+
} else if (isFile) {
|
|
265
|
+
lowerCaseUrl.endsWith('.pdf') ? window.open(_url) : window.open("https://view.officeapps.live.com/op/view.aspx?src=".concat(_url));
|
|
266
|
+
} else if (isVideo) {
|
|
267
|
+
setCurrVideoLink(_url);
|
|
268
|
+
} else {
|
|
269
|
+
window.open(_url, '_blank');
|
|
270
|
+
}
|
|
271
|
+
};
|
|
272
|
+
var uploadProp = _objectSpread({
|
|
273
|
+
headers: ossUpload.headers,
|
|
274
|
+
name: 'files',
|
|
275
|
+
listType: listType,
|
|
276
|
+
disabled: isDetails,
|
|
277
|
+
maxCount: maxCount,
|
|
278
|
+
accept: accept || acceptTypes[type],
|
|
279
|
+
showUploadList: {
|
|
280
|
+
showPreviewIcon: true,
|
|
281
|
+
showRemoveIcon: !isDetails
|
|
282
|
+
},
|
|
283
|
+
customRequest: function customRequest(e) {
|
|
284
|
+
return uploadFile(e);
|
|
285
|
+
},
|
|
286
|
+
itemRender: function itemRender(originNode, file, _, actions) {
|
|
287
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, (file === null || file === void 0 ? void 0 : file.status) === 'uploading' ? /*#__PURE__*/React.createElement("div", {
|
|
288
|
+
className: "upload_ing"
|
|
289
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
290
|
+
className: "upload_ing_cover",
|
|
291
|
+
onClick: function onClick() {
|
|
292
|
+
return actions.remove(file);
|
|
293
|
+
}
|
|
294
|
+
}, /*#__PURE__*/React.createElement(DeleteOutlined, null), " "), originNode) : /*#__PURE__*/React.createElement(Tooltip, {
|
|
295
|
+
title: (file === null || file === void 0 ? void 0 : file.name) || ''
|
|
296
|
+
}, " ", originNode, " "));
|
|
297
|
+
},
|
|
298
|
+
onPreview: handlePreview,
|
|
299
|
+
onChange: onChange,
|
|
300
|
+
fileList: fileList
|
|
301
|
+
}, otherUploadProps);
|
|
302
|
+
return /*#__PURE__*/React.createElement(Upload, uploadProp, fileList.length < maxCount && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(PlusOutlined, null), /*#__PURE__*/React.createElement("div", {
|
|
303
|
+
style: {
|
|
304
|
+
marginTop: 8
|
|
305
|
+
}
|
|
306
|
+
}, "\u4E0A\u4F20")));
|
|
307
|
+
};
|
|
308
|
+
var Index = function Index(props) {
|
|
309
|
+
var formProps = props.formProps,
|
|
310
|
+
_props$tips = props.tips,
|
|
311
|
+
tips = _props$tips === void 0 ? {} : _props$tips,
|
|
312
|
+
_props$uploadProps2 = props.uploadProps,
|
|
313
|
+
uploadProps = _props$uploadProps2 === void 0 ? {} : _props$uploadProps2,
|
|
314
|
+
aliyunProps = props.aliyunProps;
|
|
315
|
+
var _ref4 = tips || {},
|
|
316
|
+
_ref4$needTips = _ref4.needTips,
|
|
317
|
+
needTips = _ref4$needTips === void 0 ? true : _ref4$needTips,
|
|
318
|
+
tipsText = _ref4.tipsText,
|
|
319
|
+
_ref4$tipsStyle = _ref4.tipsStyle,
|
|
320
|
+
tipsStyle = _ref4$tipsStyle === void 0 ? {} : _ref4$tipsStyle;
|
|
321
|
+
var name = formProps.name,
|
|
322
|
+
parentName = formProps.parentName,
|
|
323
|
+
index = formProps.index,
|
|
324
|
+
otherFormProps = _objectWithoutProperties(formProps, _excluded2); // form的参数
|
|
325
|
+
var _uploadProps$maxCount2 = uploadProps.maxCount,
|
|
326
|
+
maxCount = _uploadProps$maxCount2 === void 0 ? 1 : _uploadProps$maxCount2,
|
|
327
|
+
_uploadProps$type2 = uploadProps.type,
|
|
328
|
+
type = _uploadProps$type2 === void 0 ? 'image' : _uploadProps$type2,
|
|
329
|
+
_uploadProps$maxSize2 = uploadProps.maxSize,
|
|
330
|
+
maxSize = _uploadProps$maxSize2 === void 0 ? 2 : _uploadProps$maxSize2,
|
|
331
|
+
accept = uploadProps.accept; // 上传组件的参数
|
|
332
|
+
|
|
333
|
+
var _useState3 = useState(''),
|
|
334
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
335
|
+
currVideoLink = _useState4[0],
|
|
336
|
+
setCurrVideoLink = _useState4[1]; // 播放视频
|
|
337
|
+
var _useState5 = useState(false),
|
|
338
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
339
|
+
previewOpen = _useState6[0],
|
|
340
|
+
setPreviewOpen = _useState6[1]; // 图片弹窗
|
|
341
|
+
var _useState7 = useState(''),
|
|
342
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
343
|
+
previewImage = _useState8[0],
|
|
344
|
+
setPreviewImage = _useState8[1]; // 图片url
|
|
345
|
+
|
|
346
|
+
var _name = parentName ? [index, name] : name; // 当前name
|
|
347
|
+
|
|
348
|
+
var aliyunUploadProps = {
|
|
349
|
+
aliyunProps: aliyunProps,
|
|
350
|
+
formProps: formProps,
|
|
351
|
+
setCurrVideoLink: setCurrVideoLink,
|
|
352
|
+
setPreviewOpen: setPreviewOpen,
|
|
353
|
+
setPreviewImage: setPreviewImage
|
|
354
|
+
};
|
|
355
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Form.Item, _extends({
|
|
356
|
+
name: _name,
|
|
357
|
+
className: "file_upload"
|
|
358
|
+
}, otherFormProps), /*#__PURE__*/React.createElement(AliyunOSSUpload, aliyunUploadProps)), needTips && /*#__PURE__*/React.createElement("p", {
|
|
359
|
+
className: "file_tips",
|
|
360
|
+
style: tipsStyle
|
|
361
|
+
}, tipsText || "\u6700\u591A\u53EF\u4E0A\u4F20".concat(maxCount, "\u4E2A\u6587\u4EF6\uFF0C\u6BCF\u4E2A\u9700\u5C0F\u4E8E").concat(maxSize, "M\uFF0C\u683C\u5F0F\u652F\u6301").concat(accept || acceptTypes[type])), previewImage && /*#__PURE__*/React.createElement(Image, {
|
|
362
|
+
wrapperStyle: {
|
|
363
|
+
display: 'none'
|
|
364
|
+
},
|
|
365
|
+
preview: {
|
|
366
|
+
visible: previewOpen,
|
|
367
|
+
onVisibleChange: function onVisibleChange(visible) {
|
|
368
|
+
return setPreviewOpen(visible);
|
|
369
|
+
},
|
|
370
|
+
afterOpenChange: function afterOpenChange(visible) {
|
|
371
|
+
return !visible && setPreviewImage('');
|
|
372
|
+
}
|
|
373
|
+
},
|
|
374
|
+
src: previewImage
|
|
375
|
+
}), !!currVideoLink ? /*#__PURE__*/React.createElement("div", {
|
|
376
|
+
className: "form_video_mask_box"
|
|
377
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
378
|
+
className: "close_btn",
|
|
379
|
+
onClick: function onClick() {
|
|
380
|
+
setCurrVideoLink('');
|
|
381
|
+
}
|
|
382
|
+
}, /*#__PURE__*/React.createElement(CloseOutlined, null)), /*#__PURE__*/React.createElement("video", {
|
|
383
|
+
className: "video_box",
|
|
384
|
+
src: currVideoLink,
|
|
385
|
+
controls: true,
|
|
386
|
+
autoPlay: true
|
|
387
|
+
})) : null);
|
|
388
|
+
};
|
|
389
|
+
export default Index;
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
.ant-upload-picture-card-wrapper {
|
|
2
|
+
width: auto;
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
.file_tips {
|
|
6
|
+
width: 100%;
|
|
7
|
+
color: rgb(189, 49, 36);
|
|
8
|
+
word-wrap: break-word;
|
|
9
|
+
word-break: break-all;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.file_upload {
|
|
13
|
+
padding: 20px;
|
|
14
|
+
|
|
15
|
+
& .upload_ing {
|
|
16
|
+
position: relative;
|
|
17
|
+
width: 100%;
|
|
18
|
+
height: 100%;
|
|
19
|
+
z-index: 1;
|
|
20
|
+
|
|
21
|
+
& .upload_ing_cover {
|
|
22
|
+
position: absolute;
|
|
23
|
+
right: 5px;
|
|
24
|
+
top: 5px;
|
|
25
|
+
text-align: center;
|
|
26
|
+
font-size: 12px;
|
|
27
|
+
color: #000;
|
|
28
|
+
z-index: 2;
|
|
29
|
+
color: red;
|
|
30
|
+
cursor: pointer;
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
.form_video_mask_box {
|
|
36
|
+
position: fixed;
|
|
37
|
+
top: 0;
|
|
38
|
+
left: 0;
|
|
39
|
+
width: 100%;
|
|
40
|
+
height: 100%;
|
|
41
|
+
background-color: rgba(0, 0, 0, 0.5);
|
|
42
|
+
z-index: 99999999;
|
|
43
|
+
display: flex;
|
|
44
|
+
flex-direction: column;
|
|
45
|
+
align-items: center;
|
|
46
|
+
justify-content: center;
|
|
47
|
+
|
|
48
|
+
.video_box {
|
|
49
|
+
width: 50%;
|
|
50
|
+
max-height: 80%;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.close_btn {
|
|
54
|
+
position: absolute;
|
|
55
|
+
top: 10%;
|
|
56
|
+
right: 10%;
|
|
57
|
+
cursor: pointer;
|
|
58
|
+
font-size: 20px;
|
|
59
|
+
color: #fff;
|
|
60
|
+
background-color: rgba(0, 0, 0, 0.3);
|
|
61
|
+
width: 50px;
|
|
62
|
+
height: 50px;
|
|
63
|
+
border-radius: 50%;
|
|
64
|
+
outline: 0;
|
|
65
|
+
border: 0;
|
|
66
|
+
cursor: pointer;
|
|
67
|
+
transition: all 0.3s;
|
|
68
|
+
display: flex;
|
|
69
|
+
justify-content: center;
|
|
70
|
+
align-items: center;
|
|
71
|
+
|
|
72
|
+
&:hover {
|
|
73
|
+
background-color: rgba(0, 0, 0, 0.2);
|
|
74
|
+
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
}
|
package/dist/index.d.ts
CHANGED
|
@@ -13,4 +13,5 @@ export { default as VideoProgressModal } from './components/VideoProgressModal';
|
|
|
13
13
|
export { default as NumberInput } from './components/NumberInput';
|
|
14
14
|
export { default as TabsMode } from './components/TabsMode';
|
|
15
15
|
export { default as ReactEcharts } from './components/ReactEcharts';
|
|
16
|
+
export { default as FileUpload } from './components/FileUpload';
|
|
16
17
|
export { default as TestBtn } from './business/TestBtn';
|
package/dist/index.js
CHANGED
|
@@ -14,6 +14,7 @@ export { default as VideoProgressModal } from "./components/VideoProgressModal";
|
|
|
14
14
|
export { default as NumberInput } from "./components/NumberInput";
|
|
15
15
|
export { default as TabsMode } from "./components/TabsMode";
|
|
16
16
|
export { default as ReactEcharts } from "./components/ReactEcharts";
|
|
17
|
+
export { default as FileUpload } from "./components/FileUpload";
|
|
17
18
|
|
|
18
19
|
// 业务组件
|
|
19
20
|
export { default as TestBtn } from "./business/TestBtn";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@yilianjituan/yilian_dgerm",
|
|
3
|
-
"version": "0.0.1-alpha.
|
|
3
|
+
"version": "0.0.1-alpha.31",
|
|
4
4
|
"description": "A react library developed with dumi",
|
|
5
5
|
"module": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -71,7 +71,10 @@
|
|
|
71
71
|
"lodash": "^4.17.20",
|
|
72
72
|
"qs": "^6.9.7",
|
|
73
73
|
"react": ">=16.9.0",
|
|
74
|
-
"react-dom": ">=16.9.0"
|
|
74
|
+
"react-dom": ">=16.9.0",
|
|
75
|
+
"ahooks": "^3.7.2",
|
|
76
|
+
"heic2any": "^0.0.4"
|
|
77
|
+
|
|
75
78
|
},
|
|
76
79
|
"devDependencies": {
|
|
77
80
|
"@commitlint/cli": "^17.1.2",
|