优化多文件上传和文件名超长问题

This commit is contained in:
liaoxuezhi 2019-10-23 23:38:48 +08:00
parent c6582133e5
commit 59f6fa7494
3 changed files with 20 additions and 4 deletions

View File

@ -78,6 +78,15 @@
}
}
&-itemInfoText {
white-space: nowrap;
max-width: 180px;
overflow: hidden;
text-overflow: ellipsis;
display: inline-block;
line-height: 1;
}
&-clear {
float: right;
color: #999;
@ -100,6 +109,8 @@
transform: translateY(-3px);
width: 100%;
align-items: center;
white-space: nowrap;
text-overflow: ellipsis;
>span {
display: inline-block;
@ -116,6 +127,8 @@
}
}
&-progress {
height: 5px;
flex: 1;

View File

@ -705,7 +705,7 @@ export default class FileControl extends React.Component<FileProps, FileState> {
fd.append(config.fieldName || 'file', blob, file.name);
return self
._send(reciever, fd, {}, progress => updateProgress(task.partNumber, progress))
._send(api, fd, {}, progress => updateProgress(task.partNumber, progress))
.then(ret => {
state.loaded++;
callback(null, {
@ -854,7 +854,9 @@ export default class FileControl extends React.Component<FileProps, FileState> {
})}
>
<Icon icon="file" className="icon" />
{file.name || (file as FileValue).filename}
<span className={cx('FileControl-itemInfoText')}>
{file.name || (file as FileValue).filename}
</span>
{file.state === 'invalid' || file.state === 'error' ? (
<Icon icon="fail" className="icon" />
) : null}
@ -876,7 +878,7 @@ export default class FileControl extends React.Component<FileProps, FileState> {
width: `${
file.state === 'uploaded'
? 100
: file.progress * 100
: (file.progress || 0) * 100
}%`
}}
/>

View File

@ -11,6 +11,7 @@ import {buildApi} from '../../utils/api';
import {createObject, qsstringify} from '../../utils/helper';
import {Icon} from '../../components/icons';
import Button from '../../components/Button';
// @ts-ignore
import accepts from 'attr-accept';
let id = 1;
@ -137,7 +138,7 @@ export default class ImageControl extends React.Component<ImageProps, ImageState
};
cropper = React.createRef<Cropper>();
dropzone = React.createRef<DropZone>();
dropzone = React.createRef<any>();
current: FileValue | FileX | null = null;
resolve?: (value?: any) => void;