Projekt

Obecné

Profil

Stáhnout (2.68 KB) Statistiky
| Větev: | Tag: | Revize:
1
import { List, Modal, Skeleton, Tag } from 'antd';
2
import 'antd/dist/antd.css';
3
import React, { useContext, useEffect, useState } from 'react';
4
import { AnnotationListInfo, EState } from '../../api';
5
import { userController } from '../../controllers';
6
import { useUnauthRedirect } from '../../hooks';
7
import { LoggedUserContext } from '../../contexts/LoggedUserContext';
8
import {
9
    CheckCircleOutlined,
10
    ClockCircleOutlined,
11
    SyncOutlined,
12
} from '@ant-design/icons';
13

    
14
interface ModalProps {
15
    onCancel: () => void;
16
    userId: string | undefined;
17
}
18

    
19
function UserDocumentsModal({ onCancel, userId }: ModalProps) {
20
    const redirecting = useUnauthRedirect('/login');
21
    const { role } = useContext(LoggedUserContext);
22
    const [annotations, setAnnotations] = useState<AnnotationListInfo[]>([]);
23

    
24
    const handleOk = () => {
25
        onCancel();
26
    };
27

    
28
    const handleCancel = () => {
29
        onCancel();
30
    };
31

    
32
    const getStateTag = (state: EState) => {
33
        let color = 'green';
34
        let label = 'Hotovo';
35
        let icon = <CheckCircleOutlined />;
36
        if (state === EState.New) {
37
            color = 'volcano';
38
            label = 'Nový';
39
            icon = <ClockCircleOutlined />;
40
        }
41
        if (state === EState.InProgress) {
42
            color = 'orange';
43
            label = 'Rozpracováno';
44
            icon = <SyncOutlined />;
45
        }
46
        return (
47
            <Tag icon={icon} color={color} key={label}>
48
                {label.toUpperCase()}
49
            </Tag>
50
        );
51
    };
52

    
53
    useEffect(() => {
54
        if (!redirecting && role === 'ADMINISTRATOR' && userId) {
55
            userController
56
                .userUserIdAnnotationsGet(userId)
57
                .then(({ data: { annotations } }) => {
58
                    setAnnotations(annotations || []);
59
                });
60
        }
61
    }, [userId, redirecting, role]);
62

    
63
    return (
64
        <Modal
65
            title="Dokumenty uživatele"
66
            onOk={handleOk}
67
            visible={true}
68
            onCancel={handleCancel}
69
            footer={[null]}
70
        >
71
            <List
72
                dataSource={annotations}
73
                size={'small'}
74
                grid={{ gutter: 10, column: 1 }}
75
                style={{ maxHeight: 400, overflowY: 'auto', overflowX: 'hidden' }}
76
                renderItem={(item) => (
77
                    <List.Item key={item.annotationId}>
78
                        <List.Item.Meta
79
                            title={item.documentName}
80
                            // @ts-ignore
81
                            avatar={getStateTag(item.state)}
82
                        />
83
                    </List.Item>
84
                )}
85
            />
86
        </Modal>
87
    );
88
}
89

    
90
export default UserDocumentsModal;
(11-11/11)