Browse Source

Minor fixes

master
cracklesparkle 11 months ago
parent
commit
c74c911eea
  1. 18
      frontend_reactjs/src/components/FolderViewer.tsx
  2. 56
      frontend_reactjs/src/components/modals/FileViewer.tsx

18
frontend_reactjs/src/components/FolderViewer.tsx

@ -22,6 +22,7 @@ interface DocumentProps {
const FileItemStyle: SxProps = { const FileItemStyle: SxProps = {
cursor: 'pointer', cursor: 'pointer',
display: 'flex', display: 'flex',
width: '100%',
flexDirection: 'row', flexDirection: 'row',
gap: '8px', gap: '8px',
alignItems: 'center', alignItems: 'center',
@ -46,16 +47,25 @@ function ItemFolder({ folder, index, handleFolderClick, ...props }: FolderProps)
function ItemDocument({ doc, index, handleDocumentClick, ...props }: DocumentProps) { function ItemDocument({ doc, index, handleDocumentClick, ...props }: DocumentProps) {
return ( return (
<ListItemButton
onClick={() => handleDocumentClick(doc, index)}
>
<ListItemButton>
<Box <Box
sx={FileItemStyle} sx={FileItemStyle}
onClick={() => handleDocumentClick(doc, index)}
{...props} {...props}
> >
<InsertDriveFile /> <InsertDriveFile />
{doc.name} {doc.name}
</Box> </Box>
<Box>
<IconButton
onClick={() => {
console.log("TODO: save")
}}
sx={{ ml: 'auto' }}
>
<Download />
</IconButton>
</Box>
</ListItemButton> </ListItemButton>
) )
} }
@ -125,7 +135,7 @@ export default function FolderViewer() {
formData.append('files', file) formData.append('files', file)
} }
try { try {
// const response = await DocumentService.uploadFiles(currentFolder.id, formData, setUploadProgress);
const response = await DocumentService.uploadFiles(currentFolder.id, formData, setUploadProgress);
setIsUploading(false); setIsUploading(false);
setFilesToUpload([]); setFilesToUpload([]);
mutate(`/info/documents/${currentFolder.id}`); mutate(`/info/documents/${currentFolder.id}`);

56
frontend_reactjs/src/components/modals/FileViewer.tsx

@ -65,7 +65,11 @@ function DocxViewer({
useEffect(() => { useEffect(() => {
if (previewContainerRef && previewContainerRef.current) { if (previewContainerRef && previewContainerRef.current) {
setLoadingPreview(true); setLoadingPreview(true);
jsPreviewDocx.init(previewContainerRef.current)
jsPreviewDocx.init(previewContainerRef.current, {
breakPages: true,
inWrapper: true,
ignoreHeight: true
})
.preview(url) .preview(url)
} }
@ -79,6 +83,7 @@ function DocxViewer({
return ( return (
<Box ref={previewContainerRef} sx={{ <Box ref={previewContainerRef} sx={{
width: '100%', width: '100%',
height: '100%'
}} /> }} />
) )
} }
@ -116,8 +121,19 @@ function ImageViewer({
url url
}: ViewerProps) { }: ViewerProps) {
return ( return (
<Box>
<img alt='image-preview' src={url} />
<Box sx={{
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
objectFit: 'contain',
width: '100%',
height: '100%'
}}>
<img alt='image-preview' src={url} style={{
display: 'flex',
maxWidth: '100%',
maxHeight: '100%'
}} />
</Box> </Box>
) )
} }
@ -235,23 +251,25 @@ export default function FileViewer({
fileType?.startsWith('image/') ? fileType?.startsWith('image/') ?
<ImageViewer url={window.URL.createObjectURL(file)} /> <ImageViewer url={window.URL.createObjectURL(file)} />
: :
<Box sx={{ display: 'flex', gap: '16px', flexDirection: 'column', p: '16px' }}>
<Box sx={{ display: 'flex', gap: '16px', alignItems: 'center' }}>
<Warning />
<Typography>
Предпросмотр данного файла невозможен.
</Typography>
fileType && file ?
<Box sx={{ display: 'flex', gap: '16px', flexDirection: 'column', p: '16px' }}>
<Box sx={{ display: 'flex', gap: '16px', alignItems: 'center' }}>
<Warning />
<Typography>
Предпросмотр данного файла невозможен.
</Typography>
</Box>
<Box>
<Button variant='contained' onClick={() => {
handleSave()
}}>
Сохранить
</Button>
</Box>
</Box> </Box>
<Box>
<Button variant='contained' onClick={() => {
handleSave()
}}>
Сохранить
</Button>
</Box>
</Box>
:
null
} }
</Box> </Box>
</Dialog> </Dialog>

Loading…
Cancel
Save