muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 04:46: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

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

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

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

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

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

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

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

@ -16,22 +16,20 @@ const INITIAL_STATE: INodeState = {
editor: { editor: {
...EMPTY_NODE, ...EMPTY_NODE,
type: 'image', type: 'image',
blocks: [ blocks: [{ ...EMPTY_BLOCK, type: 'image' }],
{ ...EMPTY_BLOCK, type: 'image' },
],
files: [ 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, is_loading: false,
error: null, error: null,