Projekt

Obecné

Profil

Stáhnout (22.5 KB) Statistiky
| Větev: | Tag: | Revize:
1 8c45ccb0 hrubyjar
import 'antd/dist/antd.css';
2 3396af93 Dominik Poch
import React, { FocusEvent, useContext, useEffect, useState } from 'react';
3 8c45ccb0 hrubyjar
4
import { useUnauthRedirect } from '../../../hooks';
5
import { useRouter } from 'next/router';
6 937bfbee Jaroslav Hrubý
import { Button, Dropdown, Input, Menu, Row, Space, Table, Tag, Typography } from 'antd';
7 99a58334 Jaroslav Hrubý
import { faArrowsRotate, faFileLines, faUser } from '@fortawesome/free-solid-svg-icons';
8 8c45ccb0 hrubyjar
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
9
import { LoggedUserContext } from '../../../contexts/LoggedUserContext';
10 bae9fbba Jaroslav Hrubý
import { MainLayout } from '../../../layouts/MainLayout';
11 4a7bae81 Jaroslav Hrubý
import AddDocumentModal from '../../../components/modals/AddDocumentModal';
12 ff61085f Lukáš Vlček
import {
13 99a58334 Jaroslav Hrubý
    DeleteDocumentsRequest,
14 ff61085f Lukáš Vlček
    DocumentListInfo,
15 87a3d8d1 Lukáš Vlček
    DocumentListResponse,
16 ff61085f Lukáš Vlček
    DocumentUserInfo,
17
    EState,
18 99a58334 Jaroslav Hrubý
    ExportRequest,
19 ff61085f Lukáš Vlček
} from '../../../api';
20 c6109e2d Lukáš Vlček
import { documentController, userController } from '../../../controllers';
21 9bfa1e39 Jaroslav Hrubý
import AssignDocumentModal from '../../../components/modals/AssignDocumentModal';
22 99a58334 Jaroslav Hrubý
import { ShowConfirm, ShowConfirmDelete, ShowToast } from '../../../utils/alerts';
23 43d49a98 Jaroslav Hrubý
import { TableDocInfo } from '../../../components/types/TableDocInfo';
24 ff61085f Lukáš Vlček
import {
25
    getAnnotationStateColor,
26 c4f198c3 Jaroslav Hrubý
    getAnnotationStateString,
27 ff61085f Lukáš Vlček
    getNameTruncated,
28
    getUserInfoAlt,
29
} from '../../../utils/strings';
30 87a3d8d1 Lukáš Vlček
import { ABadge, BadgeStyle } from '../../../components/common/ABadge';
31 e7eca311 Lukáš Vlček
import SetRequiredAnnotationsCountModal from '../../../components/modals/SetRequiredAnnotationsCountModal';
32 d7167305 Jaroslav Hrubý
import DocPreviewModal from '../../../components/modals/DocPreviewModal';
33 0db53e25 Jaroslav Hrubý
import { UserFilter } from '../../../components/types/UserFilter';
34 669ffe38 Jaroslav Hrubý
import { getColumnSearchProps, getLocaleProps } from '../../../utils/tableUtils';
35 c4f198c3 Jaroslav Hrubý
import { SweetAlertIcon } from 'sweetalert2';
36 3396af93 Dominik Poch
import { Stack } from 'react-bootstrap';
37 fa93df26 Dominik Poch
38
import { faCircleCheck, faClock } from '@fortawesome/free-regular-svg-icons';
39
import styles from '/styles/Icon.module.scss';
40 937bfbee Jaroslav Hrubý
import { FileSearchOutlined, UserDeleteOutlined } from '@ant-design/icons';
41 fa93df26 Dominik Poch
42 8c45ccb0 hrubyjar
function AdminDocumentPage() {
43
    const redirecting = useUnauthRedirect('/login');
44
    const { logout, role } = useContext(LoggedUserContext);
45 c4f198c3 Jaroslav Hrubý
    const [finalizing, setFinalizing] = React.useState(false);
46 9bfa1e39 Jaroslav Hrubý
    const [visibleAdd, setVisibleAdd] = React.useState(false);
47
    const [visibleAssign, setVisibleAssign] = React.useState(false);
48 d7167305 Jaroslav Hrubý
    const [visiblePreview, setVisiblePreview] = React.useState(false);
49 e7eca311 Lukáš Vlček
    const [visibleSetCount, setVisibleSetCount] = React.useState(false);
50
51 8c45ccb0 hrubyjar
    const router = useRouter();
52
53 43d49a98 Jaroslav Hrubý
    const [documents, setDocuments] = useState<TableDocInfo[]>([]);
54 0db53e25 Jaroslav Hrubý
    const [userFilters, setUserFilters] = useState<UserFilter[]>([]);
55 cca0bfa0 Lukáš Vlček
    const [selectedDocs, setSelectedDocs] = useState<string[]>([]);
56 d7167305 Jaroslav Hrubý
    const [previewDocContent, setPreviewDocContent] = useState<string>();
57
    const [previewDocName, setPreviewDocName] = useState<string>();
58 3396af93 Dominik Poch
    const [annotationCount, setAnnotationCount] = useState<number>();
59 c6109e2d Lukáš Vlček
60 43d49a98 Jaroslav Hrubý
    async function fetchData() {
61 ef5792a8 Lukáš Vlček
        const docs = (await documentController.documentsGet()).data.documents;
62 43d49a98 Jaroslav Hrubý
        // @ts-ignore
63
        const tableDocs: TableDocInfo[] = docs?.map((doc, index) => {
64
            return { key: index, ...doc };
65
        });
66 9bfa1e39 Jaroslav Hrubý
67 0db53e25 Jaroslav Hrubý
        const users = (await userController.usersGet()).data.users;
68
        // @ts-ignore
69
        const filters: UserFilter[] = users?.map((user) => {
70
            return {
71 99a58334 Jaroslav Hrubý
                text: user.surname + ' ' + user.name,
72 0db53e25 Jaroslav Hrubý
                value: user.username,
73
            };
74
        });
75
        setUserFilters(filters);
76
77 3396af93 Dominik Poch
        let annotationCountRes =
78
            await documentController.documentsRequiredAnnotationsGlobalGet();
79
        setAnnotationCount(annotationCountRes.data.requiredAnnotationsGlobal);
80
81 43d49a98 Jaroslav Hrubý
        if (!docs) {
82
            setDocuments([]);
83
        } else {
84
            setDocuments(tableDocs);
85 c6109e2d Lukáš Vlček
        }
86 43d49a98 Jaroslav Hrubý
    }
87 c6109e2d Lukáš Vlček
88 43d49a98 Jaroslav Hrubý
    useEffect(() => {
89 06d1aa21 Jaroslav Hrubý
        if (!redirecting && role === 'ADMINISTRATOR') {
90 c6109e2d Lukáš Vlček
            fetchData();
91 8c45ccb0 hrubyjar
        }
92
    }, [logout, redirecting, role, router]);
93
94 c4f198c3 Jaroslav Hrubý
    const finalizeDocumentConfirm = async (
95
        document: DocumentListInfo,
96
        recreate: boolean
97
    ) => {
98
        let desc = recreate ? 'Dosavadní změny finální verze budou smazány' : '';
99
        let icon: SweetAlertIcon = recreate ? 'warning' : 'question';
100
101
        const doneAnnotations = document.annotatingUsers?.filter(
102
            (usr) => usr.state === EState.Done
103
        ).length;
104
105
        if (
106
            doneAnnotations !== undefined &&
107
            document.requiredAnnotations !== undefined &&
108
            doneAnnotations < document.requiredAnnotations
109
        ) {
110
            icon = 'warning';
111
            desc =
112
                'Není dokončen požadovaný počet anotací <br /> (dokončeno ' +
113
                doneAnnotations +
114
                ' z ' +
115
                document.requiredAnnotations +
116
                ')';
117
        }
118
        recreate
119
            ? ShowConfirm(
120
                  () => finalizeDocument(document.id),
121
                  'vytvořit novou finální verzi dokumentu',
122
                  desc,
123
                  icon
124
              )
125
            : ShowConfirm(
126
                  () => finalizeDocument(document.id),
127
                  'vytvořit finální verzi dokumentu',
128
                  desc,
129
                  icon
130
              );
131
    };
132
133
    const finalizeDocument = async (documentId: string | undefined) => {
134
        setFinalizing(true);
135
        const finalAnnotationId = (
136
            await documentController.documentDocumentIdFinalPost(
137
                documentId ? documentId : ''
138
            )
139
        ).data.finalAnnotationId;
140
        if (!finalAnnotationId) {
141
            ShowToast('Finální verzi se nepovedlo vytvořit', 'error');
142
        } else {
143
            router.push({
144
                pathname: '/annotation/[annotationId]',
145
                query: { annotationId: finalAnnotationId, final: true },
146
            });
147
        }
148
        setFinalizing(false);
149
    };
150
151
    const editFinalizedDocument = async (finalAnnotationId: string) => {
152
        setFinalizing(true);
153
        if (!finalAnnotationId) {
154
            ShowToast('Finální verze dosud neexistuje', 'warning');
155
        } else {
156
            router.push({
157
                pathname: '/annotation/[annotationId]',
158
                query: { annotationId: finalAnnotationId, final: true },
159
            });
160
        }
161
        setFinalizing(false);
162
    };
163
164 ef5792a8 Lukáš Vlček
    async function removeUserFromDocument(documentID: string, annotatorID: string) {
165
        const res =
166
            await documentController.documentsDocumentIdAnnotatorsAnnotatorIdDelete(
167
                documentID,
168
                annotatorID
169
            );
170
171
        if (res.status === 200) {
172
            ShowToast('Uživatel byl úspěšně odebrán z dokumentu');
173
        }
174
        await fetchData();
175
    }
176
177 c4f198c3 Jaroslav Hrubý
    const getFinalizationStateIcon = (state: EState) => {
178
        const color = getAnnotationStateColor(state);
179
        const label = getAnnotationStateString(state);
180 fa93df26 Dominik Poch
        let icon = <FontAwesomeIcon icon={faCircleCheck} className={styles.iconLeft} />;
181 c4f198c3 Jaroslav Hrubý
        if (state === 'NEW') {
182 fa93df26 Dominik Poch
            icon = <FontAwesomeIcon icon={faClock} className={styles.iconLeft} />;
183 c4f198c3 Jaroslav Hrubý
        }
184
        if (state === 'IN_PROGRESS') {
185 fa93df26 Dominik Poch
            icon = <FontAwesomeIcon icon={faArrowsRotate} className={styles.iconLeft} />;
186 c4f198c3 Jaroslav Hrubý
        }
187
188
        return (
189
            <Tag icon={icon} color={color} key={label}>
190
                {label.toUpperCase()}
191
            </Tag>
192
        );
193
    };
194
195 9bfa1e39 Jaroslav Hrubý
    const showAssignModal = () => {
196
        if (selectedDocs.length == 0) {
197
            ShowToast('Vyberte dokument pro přiřazení', 'warning', 3000, 'top-end');
198
        } else {
199
            setVisibleAssign(true);
200
        }
201
    };
202 e7eca311 Lukáš Vlček
    const showRequiredAnnotationsCountModal = () => {
203
        if (selectedDocs.length == 0) {
204
            ShowToast(
205
                'Vyberte dokument, pro které chcete nastavit požadovaný počet anotací',
206
                'warning',
207
                3000,
208
                'top-end'
209
            );
210
        } else {
211
            setVisibleSetCount(true);
212
        }
213
    };
214 9bfa1e39 Jaroslav Hrubý
    const showAddModal = () => {
215
        setVisibleAdd(true);
216 4a7bae81 Jaroslav Hrubý
    };
217
218 d7167305 Jaroslav Hrubý
    const showPreviewModal = async (id: string, name: string) => {
219
        const documentContent = (await documentController.documentDocumentIdGet(id)).data
220
            .content;
221 e97b42bc Jaroslav Hrubý
        if (documentContent) {
222
            setPreviewDocName(name);
223
            setPreviewDocContent(documentContent);
224
            setVisiblePreview(true);
225
        }
226 d7167305 Jaroslav Hrubý
    };
227
228 99a58334 Jaroslav Hrubý
    const deleteDocuments = () => {
229
        const req: DeleteDocumentsRequest = { documentIds: selectedDocs };
230
231
        ShowConfirmDelete(() => {
232
            documentController.documentsDelete(req).then(() => {
233
                ShowToast('Dokumenty byly úspěšně odstraněny');
234
                fetchData();
235
            });
236
        }, 'dokumenty');
237
    };
238
239 9e60bee1 Lukáš Vlček
    const exportDocuments = async () => {
240 99a58334 Jaroslav Hrubý
        const req: ExportRequest = { documentIds: selectedDocs };
241 9e60bee1 Lukáš Vlček
        const res = await documentController.documentsExportPost(req);
242
        if (res?.data) {
243
            download(res.data, 'export.zip');
244
        }
245 99a58334 Jaroslav Hrubý
    };
246
247 9e60bee1 Lukáš Vlček
    function download(baseData: string, filename: string) {
248
        if (!baseData) {
249
            console.log('base data null');
250
            return;
251
        }
252
253
        const linkSource = `data:application/zip;base64,${baseData}`;
254
        const downloadLink = document.createElement('a');
255
256
        downloadLink.href = linkSource;
257
        downloadLink.download = filename;
258
        downloadLink.click();
259
260
        // Clean up and remove the link
261
        // downloadLink.parentNode.removeChild(downloadLink);
262
    }
263
264 3396af93 Dominik Poch
    const changeDefaultAnotationCount = (e: FocusEvent<HTMLInputElement>) => {
265
        documentController.documentsRequiredAnnotationsGlobalPost({
266
            requiredAnnotations: parseInt(e.currentTarget.value),
267
        });
268
    };
269
270 4a7bae81 Jaroslav Hrubý
    const hideModal = () => {
271 43d49a98 Jaroslav Hrubý
        fetchData();
272 9bfa1e39 Jaroslav Hrubý
        setVisibleAdd(false);
273
        setVisibleAssign(false);
274 e7eca311 Lukáš Vlček
        setVisibleSetCount(false);
275 d7167305 Jaroslav Hrubý
        setVisiblePreview(false);
276 8c45ccb0 hrubyjar
    };
277
278 937bfbee Jaroslav Hrubý
    const removeUserDocument = (user: DocumentUserInfo, record: DocumentListInfo) => {
279
        ShowConfirm(
280
            async () => {
281
                if (!record.id || !user?.id) {
282
                    return;
283
                }
284
                await removeUserFromDocument(record.id, user.id);
285
            },
286
            'odebrat uživatele ' +
287
                user.name +
288
                ' ' +
289
                user.surname +
290
                ' (' +
291
                user.username +
292
                ') z tohoto dokumentu',
293
            'Dosavadní postup tohoto anotátora na daném dokumentu bude nenávratně smazán'
294
        );
295
    };
296
297
    const menu = (user: DocumentUserInfo, record: DocumentListInfo) => {
298
        return (
299
            <Menu>
300
                <Menu.ItemGroup title={getNameTruncated(user)}>
301
                    <Menu.Item
302
                        icon={<FileSearchOutlined />}
303
                        onClick={() =>
304
                            router.push({
305
                                pathname: '/annotation/[annotationId]',
306
                                query: { annotationId: user.annotationId, final: false },
307
                            })
308
                        }
309
                    >
310
                        Zobrazit anotaci
311
                    </Menu.Item>
312
                    <Menu.Item
313
                        icon={<UserDeleteOutlined />}
314
                        onClick={() => removeUserDocument(user, record)}
315
                    >
316
                        Odebrat
317
                    </Menu.Item>
318
                </Menu.ItemGroup>
319
            </Menu>
320
        );
321
    };
322
323 ef5792a8 Lukáš Vlček
    function getUserTag(user: DocumentUserInfo, record: DocumentListInfo) {
324
        return (
325 937bfbee Jaroslav Hrubý
            <Dropdown overlay={menu(user, record)}>
326
                <Space
327
                    size={2}
328 ef5792a8 Lukáš Vlček
                    style={{
329 937bfbee Jaroslav Hrubý
                        paddingRight: 10,
330 ef5792a8 Lukáš Vlček
                        color: getAnnotationStateColor(user.state),
331
                    }}
332
                >
333
                    <FontAwesomeIcon
334
                        icon={faUser}
335
                        title={getUserInfoAlt(user)}
336
                        className={'me-2'}
337
                    />
338
                    {record.finalAnnotations?.some(
339
                        (annot) => annot.userId === user.id
340
                    ) ? (
341
                        <u>{getNameTruncated(user)}</u>
342
                    ) : (
343
                        getNameTruncated(user)
344
                    )}
345 937bfbee Jaroslav Hrubý
                </Space>
346
            </Dropdown>
347 ef5792a8 Lukáš Vlček
        );
348
    }
349
350 c6109e2d Lukáš Vlček
    const columns = [
351
        {
352
            title: 'Název dokumentu',
353
            dataIndex: 'name',
354
            key: 'name',
355 eba090c1 Lukáš Vlček
            width: '30%',
356 0db53e25 Jaroslav Hrubý
            ...getColumnSearchProps('name', 'název'),
357 669ffe38 Jaroslav Hrubý
            sorter: {
358
                // @ts-ignore
359
                compare: (a, b) => a.name.localeCompare(b.name),
360
                multiple: 2,
361
            },
362 c6109e2d Lukáš Vlček
        },
363
        {
364
            title: 'Délka',
365
            dataIndex: 'length',
366
            key: 'length',
367 eba090c1 Lukáš Vlček
            width: '5%',
368 c4f198c3 Jaroslav Hrubý
            align: 'center' as 'center',
369 0db53e25 Jaroslav Hrubý
            sorter: {
370
                // @ts-ignore
371
                compare: (a, b) => a.length - b.length,
372
                multiple: 1,
373
            },
374 c6109e2d Lukáš Vlček
        },
375 87a3d8d1 Lukáš Vlček
        {
376
            title: 'Dokončeno | přiřazeno | vyžadováno',
377
            key: 'annotationCounts',
378 c4f198c3 Jaroslav Hrubý
            width: '15%',
379
            align: 'center' as 'center',
380 87a3d8d1 Lukáš Vlček
            render: (
381
                columnData: DocumentListResponse,
382
                record: DocumentListInfo,
383
                index: number
384
            ) => {
385
                const finished =
386
                    record.annotatingUsers?.filter((d) => d.state === EState.Done)
387
                        .length ?? 0;
388
389
                return (
390
                    <div>
391
                        <ABadge
392
                            style={
393
                                finished === record.annotatingUsers?.length
394
                                    ? BadgeStyle.SUCCESS
395
                                    : BadgeStyle.WARNING
396
                            }
397
                        >
398
                            {finished}
399
                        </ABadge>
400
                        {' | '}
401
                        <ABadge
402
                            style={
403 ef2143b8 Lukáš Vlček
                                (record.annotatingUsers?.length ?? 0) >=
404
                                (record.requiredAnnotations ?? 0)
405 87a3d8d1 Lukáš Vlček
                                    ? BadgeStyle.SUCCESS
406
                                    : BadgeStyle.WARNING
407
                            }
408
                        >
409
                            {record.annotatingUsers?.length}
410
                        </ABadge>
411
                        {' | '}
412
                        <ABadge style={BadgeStyle.GENERAL}>
413
                            {record.requiredAnnotations}
414
                        </ABadge>
415
                    </div>
416
                );
417
            },
418
        },
419 c6109e2d Lukáš Vlček
        {
420
            title: 'Anotátoři',
421
            dataIndex: 'annotatingUsers',
422
            key: 'annotatingUsers',
423 c4f198c3 Jaroslav Hrubý
            width: '20%',
424 ff61085f Lukáš Vlček
            render: (
425
                columnData: DocumentUserInfo[],
426
                record: DocumentListInfo,
427
                index: number
428
            ) => {
429 ef5792a8 Lukáš Vlček
                return <div>{columnData.map((e) => getUserTag(e, record))}</div>;
430 c6109e2d Lukáš Vlček
            },
431 0db53e25 Jaroslav Hrubý
            filters: userFilters,
432
            filterSearch: true,
433
            // @ts-ignore
434
            onFilter: (value, record) =>
435
                // @ts-ignore
436
                record.annotatingUsers.find((user) => user['username'] === value),
437
            sorter: {
438
                // @ts-ignore
439
                compare: (a, b) => a.annotatingUsers.length - b.annotatingUsers.length,
440 669ffe38 Jaroslav Hrubý
                multiple: 3,
441 0db53e25 Jaroslav Hrubý
            },
442 c6109e2d Lukáš Vlček
        },
443 d7167305 Jaroslav Hrubý
        {
444
            title: '',
445
            key: 'action',
446
            dataIndex: ['id', 'name'],
447 c4f198c3 Jaroslav Hrubý
            align: 'center' as 'center',
448 4eaee414 Lukáš Vlček
            width: '10%',
449 d7167305 Jaroslav Hrubý
            // @ts-ignore
450
            render: (text, row) => (
451 eba090c1 Lukáš Vlček
                <Button
452
                    style={{ width: '80px' }}
453
                    key={row.id}
454
                    onClick={() => showPreviewModal(row.id, row.name)}
455
                >
456 d7167305 Jaroslav Hrubý
                    Náhled
457
                </Button>
458
            ),
459
        },
460 c4f198c3 Jaroslav Hrubý
        {
461
            title: 'Finální verze dokumentu',
462
            key: 'final',
463
            dataIndex: ['id', 'finalizedExists'],
464 4eaee414 Lukáš Vlček
            width: '20%',
465 c4f198c3 Jaroslav Hrubý
            // @ts-ignore
466
            render: (text, row) =>
467
                row.finalizedExists ? (
468 eba090c1 Lukáš Vlček
                    <>
469
                        <Row>
470
                            <Space>
471
                                <Button
472
                                    disabled={finalizing}
473 8b02c5d8 Jaroslav Hrubý
                                    onClick={() => finalizeDocumentConfirm(row, true)}
474 eba090c1 Lukáš Vlček
                                >
475
                                    Znovu vytvořit
476
                                </Button>
477
                            </Space>
478
                        </Row>
479
                        <Row style={{ marginTop: '5px' }}>
480
                            <Space>
481
                                <Button
482
                                    disabled={finalizing}
483
                                    onClick={() =>
484
                                        editFinalizedDocument(row.finalizedAnnotationId)
485
                                    }
486
                                >
487
                                    Upravit
488
                                </Button>
489
                                {getFinalizationStateIcon(row.finalizedState)}
490
                            </Space>
491
                        </Row>
492
                    </>
493 c4f198c3 Jaroslav Hrubý
                ) : (
494
                    <Button
495
                        disabled={finalizing}
496
                        onClick={() => finalizeDocumentConfirm(row, false)}
497
                    >
498
                        Finalizovat
499
                    </Button>
500
                ),
501
            filters: [
502
                {
503
                    text: 'Nefinalizováno',
504
                    value: null,
505
                },
506
                {
507
                    text: 'Nový',
508
                    value: 'NEW',
509
                },
510
                {
511
                    text: 'Rozpracováno',
512
                    value: 'IN_PROGRESS',
513
                },
514
                {
515
                    text: 'Hotovo',
516
                    value: 'DONE',
517
                },
518
            ],
519
            // @ts-ignore
520
            onFilter: (value, record) => record.finalizedState === value,
521
        },
522 c6109e2d Lukáš Vlček
    ];
523
524 9bfa1e39 Jaroslav Hrubý
    const rowSelection = {
525
        onChange: (selectedRowKeys: React.Key[], selectedRows: DocumentListInfo[]) => {
526 43d49a98 Jaroslav Hrubý
            // @ts-ignore
527 9bfa1e39 Jaroslav Hrubý
            setSelectedDocs(selectedRows.map((row) => row.id));
528
        },
529
    };
530
531 8c45ccb0 hrubyjar
    return redirecting || role !== 'ADMINISTRATOR' ? null : (
532
        <MainLayout>
533 c3b99cdb Lukáš Vlček
            <div
534
                style={{
535
                    display: 'flex',
536
                    flexDirection: 'row',
537
                    justifyContent: 'space-between',
538
                    flexWrap: 'wrap',
539
                }}
540
            >
541
                <Typography.Title level={2}>
542
                    <FontAwesomeIcon icon={faFileLines} /> Dokumenty
543
                </Typography.Title>
544
545
                <Stack
546
                    style={{
547
                        width: '400px',
548
                        border: '1px solid lightgray',
549
                        borderRadius: 3,
550
                        padding: 10,
551
                        marginBottom: 30,
552
                        display: 'flex',
553
                        flexDirection: 'row',
554
                        justifyContent: 'space-between',
555
                    }}
556
                    direction="horizontal"
557
                    key={annotationCount}
558
                >
559
                    <span>Výchozí požadovaný počet anotací:</span>
560
                    <Input
561
                        style={{ width: '100px' }}
562
                        defaultValue={annotationCount}
563
                        onBlur={changeDefaultAnotationCount}
564
                    />
565
                </Stack>
566
            </div>
567
568
            <div
569
                style={{
570
                    padding: '10px',
571
                    display: 'flex',
572
                    flexDirection: 'row',
573
                    justifyContent: 'flex-start',
574
                    gap: '20px',
575 99a58334 Jaroslav Hrubý
                    marginBottom: '20px',
576 c3b99cdb Lukáš Vlček
                }}
577
            >
578
                <Button type={'primary'} onClick={showAddModal}>
579
                    Nahrát dokument
580
                </Button>
581
582 9e60bee1 Lukáš Vlček
                <div style={{ display: 'flex', gap: '3px', flexWrap: 'wrap' }}>
583 792f82f0 Lukáš Vlček
                    <Button
584
                        danger
585
                        disabled={!(selectedDocs?.length > 0)}
586
                        onClick={() => deleteDocuments()}
587
                    >
588
                        Smazat dokumenty
589
                    </Button>
590 99a58334 Jaroslav Hrubý
591 792f82f0 Lukáš Vlček
                    <Button
592
                        disabled={!(selectedDocs?.length > 0)}
593
                        onClick={() => exportDocuments()}
594
                    >
595
                        Export
596
                    </Button>
597 c3b99cdb Lukáš Vlček
                    <Button
598
                        onClick={showAssignModal}
599
                        disabled={!(selectedDocs?.length > 0)}
600
                    >
601
                        Přiřadit vybrané dokumenty uživatelům
602
                    </Button>
603
                    <Button
604
                        onClick={showRequiredAnnotationsCountModal}
605
                        disabled={!(selectedDocs?.length > 0)}
606
                    >
607
                        Nastavit požadovaný počet anotací vybraným dokumentům
608
                    </Button>
609
                </div>
610
            </div>
611 3396af93 Dominik Poch
612 9bfa1e39 Jaroslav Hrubý
            {visibleAdd && <AddDocumentModal onCancel={hideModal} />}
613
            {visibleAssign && (
614
                <AssignDocumentModal documentsIds={selectedDocs} onCancel={hideModal} />
615
            )}
616 d7167305 Jaroslav Hrubý
            {visiblePreview && (
617
                <DocPreviewModal
618
                    onCancel={hideModal}
619 329a602d Jaroslav Hrubý
                    documentName={previewDocName ?? ''}
620
                    content={
621
                        previewDocContent ?? 'Nastala chyba při načítání obsahu dokumentu'
622 cca0bfa0 Lukáš Vlček
                    }
623
                />
624 d8873409 Vojtěch Bartička
            )}
625 e7eca311 Lukáš Vlček
            {visibleSetCount && (
626
                <SetRequiredAnnotationsCountModal
627
                    documentsIds={selectedDocs}
628
                    onCancel={hideModal}
629 d7167305 Jaroslav Hrubý
                />
630
            )}
631 c6109e2d Lukáš Vlček
632
            <Table
633 669ffe38 Jaroslav Hrubý
                locale={{ ...getLocaleProps() }}
634 9bfa1e39 Jaroslav Hrubý
                rowSelection={{
635
                    type: 'checkbox',
636
                    ...rowSelection,
637
                }}
638 0db53e25 Jaroslav Hrubý
                // @ts-ignore
639 c6109e2d Lukáš Vlček
                columns={columns}
640
                dataSource={documents}
641 9bfa1e39 Jaroslav Hrubý
                size="middle"
642 99a58334 Jaroslav Hrubý
                scroll={{ y: 'calc(65vh - 4em)' }}
643
                pagination={false}
644 c6109e2d Lukáš Vlček
            />
645 8c45ccb0 hrubyjar
        </MainLayout>
646
    );
647
}
648
649
export default AdminDocumentPage;