muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-24 20:36:40 +07:00
Code Packages Activity Actions

fixed uploads

Browse source
This commit is contained in:
muerwre 2019-08-20 18:25:33 +07:00
parent 38d56838f2
commit f511ca3f6a
4 changed files with 37 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

25
src/components/editors/ImageEditor/index.tsx
View file

@ -1,8 +1,4 @@
import React, {
FC,
ChangeEventHandler,
DragEventHandler
} from 'react';
import React, { FC, ChangeEventHandler, DragEventHandler } from 'react';
import { connect } from 'react-redux';
import { INode } from '~/redux/types';
import * as UPLOAD_ACTIONS from '~/redux/uploads/actions';
@ -12,25 +8,26 @@ import { IUploadStatus } from '~/redux/uploads/reducer';
const mapStateToProps = selectUploads;
const mapDispatchToProps = {
uploadUploadFiles: UPLOAD_ACTIONS.uploadUploadFiles
uploadUploadFiles: UPLOAD_ACTIONS.uploadUploadFiles,
};
type IProps = ReturnType<typeof mapStateToProps> &
typeof mapDispatchToProps & {
data: INode;
pending_files: IUploadStatus[];
setData: (val: INode) => void;
onFileMove: (o: number, n: number) => void;
onInputChange: ChangeEventHandler<HTMLInputElement>;
onDrop: DragEventHandler<HTMLFormElement>;
};
data: INode;
pending_files: IUploadStatus[];
setData: (val: INode) => void;
onFileMove: (o: number, n: number) => void;
onInputChange: ChangeEventHandler<HTMLInputElement>;
onDrop: DragEventHandler<HTMLFormElement>;
};
const ImageEditorUnconnected: FC<IProps> = ({
data,
onFileMove,
onInputChange,
onDrop,
pending_files
pending_files,
}) => (
<ImageGrid
onFileMove={onFileMove}

18
src/components/upload/ImageUpload/index.tsx
View file

@ -12,15 +12,21 @@ interface IProps {
}
const ImageUpload: FC<IProps> = ({
thumb,
id,
progress,
is_uploading,
thumb, id, progress, is_uploading,
}) => (
<div className={styles.wrap}>
<div className={classNames(styles.thumb_wrap, { is_uploading })}>
{thumb && <div className={styles.thumb} style={{ background: `url("${thumb}")` }}>{id}</div>}
{is_uploading && <div className={styles.progress}><ArcProgress size={72} progress={progress} /></div>}
{thumb && (
<div
className={styles.thumb}
style={{ backgroundImage: `url("${process.env.API_HOST}${thumb}")` }}
/>
)}
{is_uploading && (
<div className={styles.progress}>
<ArcProgress size={72} progress={progress} />
</div>
)}
</div>
</div>
);

2
src/components/upload/ImageUpload/styles.scss
View file

@ -32,7 +32,7 @@
background: no-repeat 50% 50%;
background-size: cover;
opacity: 1;
filter: saturate(0);
// filter: saturate(0);
}
.progress {

28
src/redux/node/reducer.ts
View file

@ -16,22 +16,20 @@ const INITIAL_STATE: INodeState = {
editor: {
...EMPTY_NODE,
type: 'image',
blocks: [
{ ...EMPTY_BLOCK, type: 'image' },
],
blocks: [{ ...EMPTY_BLOCK, type: 'image' }],
files: [
{ ...EMPTY_FILE, id: uuid() },
{ ...EMPTY_FILE, id: uuid() },
{ ...EMPTY_FILE, id: uuid() },
{ ...EMPTY_FILE, id: uuid() },
{ ...EMPTY_FILE, id: uuid() },
{ ...EMPTY_FILE, id: uuid() },
{ ...EMPTY_FILE, id: uuid() },
{ ...EMPTY_FILE, id: uuid() },
{ ...EMPTY_FILE, id: uuid() },
{ ...EMPTY_FILE, id: uuid() },
{ ...EMPTY_FILE, id: uuid() },
]
// { ...EMPTY_FILE, id: uuid() },
// { ...EMPTY_FILE, id: uuid() },
// { ...EMPTY_FILE, id: uuid() },
// { ...EMPTY_FILE, id: uuid() },
// { ...EMPTY_FILE, id: uuid() },
// { ...EMPTY_FILE, id: uuid() },
// { ...EMPTY_FILE, id: uuid() },
// { ...EMPTY_FILE, id: uuid() },
// { ...EMPTY_FILE, id: uuid() },
// { ...EMPTY_FILE, id: uuid() },
// { ...EMPTY_FILE, id: uuid() },
],
},
is_loading: false,
error: null,