Projekt

Obecné

Profil

Stáhnout (3.27 KB) Statistiky
| Větev: | Tag: | Revize:
1
import { Button, Modal, Upload } from 'antd';
2
import { InboxOutlined } from '@ant-design/icons';
3
import 'antd/dist/antd.css';
4
import React from 'react';
5
import { DocumentAddInfo, EAddDocumentFormat } from '../../api';
6
import { documentController } from '../../controllers';
7

    
8
const { Dragger } = Upload;
9

    
10
interface ModalProps {
11
    onCancel: () => void;
12
}
13

    
14
/**
15
 * Creates a modal window that loads documents to the app.
16
 * @returns The modal window.
17
 */
18
const AddDocumentModal: React.FC<ModalProps> = ({ onCancel }) => {
19
    /**
20
     * Handles successful closing of the modal window.
21
     */
22
    const handleOk = () => {
23
        onCancel();
24
    };
25

    
26
    /**
27
     * Handles cancelling of the model window.
28
     */
29
    const handleCancel = () => {
30
        onCancel();
31
    };
32

    
33
    const [upload, setUpload] = React.useState(false);
34
    const tempDocs: DocumentAddInfo[] = [];
35

    
36
    const handleUpload = () => {
37
        if (tempDocs.length !== 0) {
38
            setUpload(true);
39
            documentController.documentsPost({ documents: tempDocs });
40
            setUpload(false);
41
        }
42
        onCancel();
43
    };
44
    /**
45
     * Settings of a file loader.
46
     */
47
    const props = {
48
        name: 'file',
49
        multiple: true,
50
        directory: false,
51
        onRemove: (file: any) => {
52
            let docInfo = tempDocs.find((doc) => {
53
                return doc.name === file.name;
54
            });
55
            if (docInfo) {
56
                const index = tempDocs.indexOf(docInfo);
57
                const newFileList = tempDocs.slice();
58
                newFileList.splice(index, 1);
59
            }
60
        },
61
        beforeUpload: (file: any) => {
62
            let docInfo: DocumentAddInfo = { name: file.name };
63
            if ('application/x-zip-compressed' === file.type) {
64
                docInfo.format = EAddDocumentFormat.Zip;
65
            } else if ('text/html' === file.type || 'text/plain' === file.type) {
66
                docInfo.format = EAddDocumentFormat.Textfile;
67
            }
68

    
69
            const reader = new FileReader();
70
            reader.onload = (e) => {
71
                if (e.target && e.target.result) {
72
                    let content = e.target.result.toString();
73
                    docInfo.content = content.split('base64,').pop();
74
                }
75
            };
76
            reader.readAsDataURL(file);
77
            tempDocs.push(docInfo);
78
        },
79
    };
80

    
81
    return (
82
        <Modal
83
            title="Nový dokument"
84
            onOk={handleOk}
85
            visible={true}
86
            onCancel={handleCancel}
87
            footer={[
88
                <Button key="back" onClick={handleCancel}>
89
                    Storno
90
                </Button>,
91
                <Button
92
                    key="submit"
93
                    type="primary"
94
                    onClick={handleUpload}
95
                    loading={upload}
96
                >
97
                    Nahrát
98
                </Button>,
99
            ]}
100
        >
101
            <Dragger {...props} accept={'.txt, .zip, .html'}>
102
                <p className="ant-upload-drag-icon">
103
                    <InboxOutlined />
104
                </p>
105
                <p className="ant-upload-text">
106
                    Soubory lze nahrát stisknutím nebo přetažením...
107
                </p>
108
            </Dragger>
109
        </Modal>
110
    );
111
};
112

    
113
export default AddDocumentModal;
(1-1/5)