forked from VinokurovVE/tests
Drop @mui, addded ems api
This commit is contained in:
@ -1,12 +1,11 @@
|
||||
import { useDocuments, useDownload, useFolders } from '../hooks/swrHooks'
|
||||
import { IDocument, IDocumentFolder } from '../interfaces/documents'
|
||||
import { Box, CircularProgress, Divider, SxProps } from '@mui/material'
|
||||
import { Folder, InsertDriveFile } from '@mui/icons-material'
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import DocumentService from '../services/DocumentService'
|
||||
import { mutate } from 'swr'
|
||||
import FileViewer from './modals/FileViewer'
|
||||
import { ActionIcon, Anchor, Breadcrumbs, Button, FileButton, Flex, Loader, RingProgress, ScrollAreaAutosize, Table, Text } from '@mantine/core'
|
||||
import { ActionIcon, Anchor, Breadcrumbs, Button, Divider, FileButton, Flex, Loader, MantineStyleProp, RingProgress, ScrollAreaAutosize, Table, Text } from '@mantine/core'
|
||||
import { IconCancel, IconDownload, IconFile, IconFilePlus, IconFileUpload, IconX } from '@tabler/icons-react'
|
||||
|
||||
interface FolderProps {
|
||||
@ -21,7 +20,7 @@ interface DocumentProps {
|
||||
handleDocumentClick: (index: number) => void;
|
||||
}
|
||||
|
||||
const FileItemStyle: SxProps = {
|
||||
const FileItemStyle: MantineStyleProp = {
|
||||
cursor: 'pointer',
|
||||
display: 'flex',
|
||||
width: '100%',
|
||||
@ -36,13 +35,13 @@ function ItemFolder({ folder, handleFolderClick, ...props }: FolderProps) {
|
||||
<Flex
|
||||
onClick={() => handleFolderClick(folder)}
|
||||
>
|
||||
<Box
|
||||
sx={FileItemStyle}
|
||||
<Flex
|
||||
style={FileItemStyle}
|
||||
{...props}
|
||||
>
|
||||
<Folder />
|
||||
{folder.name}
|
||||
</Box>
|
||||
</Flex>
|
||||
</Flex>
|
||||
)
|
||||
}
|
||||
@ -72,15 +71,15 @@ function ItemDocument({ doc, index, handleDocumentClick, ...props }: DocumentPro
|
||||
|
||||
return (
|
||||
<Flex align='center'>
|
||||
<Box
|
||||
sx={FileItemStyle}
|
||||
<Flex
|
||||
style={FileItemStyle}
|
||||
onClick={() => handleDocumentClick(index)}
|
||||
{...props}
|
||||
>
|
||||
<InsertDriveFile />
|
||||
{doc.name}
|
||||
</Box>
|
||||
<Box>
|
||||
</Flex>
|
||||
<Flex>
|
||||
<ActionIcon
|
||||
onClick={() => {
|
||||
if (!isLoading) {
|
||||
@ -94,7 +93,7 @@ function ItemDocument({ doc, index, handleDocumentClick, ...props }: DocumentPro
|
||||
<IconDownload />
|
||||
}
|
||||
</ActionIcon>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Flex>
|
||||
)
|
||||
}
|
||||
@ -171,7 +170,7 @@ export default function FolderViewer() {
|
||||
|
||||
if (foldersLoading || documentsLoading) {
|
||||
return (
|
||||
<CircularProgress />
|
||||
<Loader />
|
||||
)
|
||||
}
|
||||
|
||||
@ -205,16 +204,12 @@ export default function FolderViewer() {
|
||||
</Breadcrumbs>
|
||||
|
||||
{currentFolder &&
|
||||
<Box sx={{ display: 'flex', flexDirection: 'column', gap: '16px' }}>
|
||||
<Box sx={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '16px',
|
||||
<Flex direction='column' gap='sm'>
|
||||
<Flex direction='column' gap='sm' p='sm' style={{
|
||||
border: filesToUpload.length > 0 ? '1px dashed gray' : 'none',
|
||||
borderRadius: '8px',
|
||||
p: '16px'
|
||||
}}>
|
||||
<Box sx={{ display: 'flex', gap: '16px' }}>
|
||||
<Flex gap='sm'>
|
||||
<FileButton multiple onChange={handleFileInput}>
|
||||
{(props) => <Button variant='filled' leftSection={isUploading ? <Loader /> : <IconFilePlus />} {...props}>Добавить</Button>}
|
||||
</FileButton>
|
||||
@ -240,7 +235,7 @@ export default function FolderViewer() {
|
||||
</Button>
|
||||
</>
|
||||
}
|
||||
</Box>
|
||||
</Flex>
|
||||
|
||||
<Divider />
|
||||
|
||||
@ -264,8 +259,8 @@ export default function FolderViewer() {
|
||||
))}
|
||||
</Flex>
|
||||
}
|
||||
</Box>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Flex>
|
||||
}
|
||||
|
||||
<Table
|
||||
|
Reference in New Issue
Block a user