feat(doc): Modale Vollansicht des Dokuments hinzufügen und Öffnen bei Kartenklick ermöglichen
This commit is contained in:
parent
b15b4dc3b1
commit
49667d7fe9
@ -13,6 +13,8 @@ import { Doc } from 'src/api/document-service';
|
||||
|
||||
import { Iconify } from 'src/components/iconify';
|
||||
import { SvgColor } from 'src/components/svg-color';
|
||||
|
||||
import DocFullView from './view/doc-full-view';
|
||||
// ----------------------------------------------------------------------
|
||||
|
||||
export function DocItem({
|
||||
@ -161,48 +163,51 @@ export function DocItem({
|
||||
}
|
||||
|
||||
return (
|
||||
<Card sx={sx} {...other}>
|
||||
<Box
|
||||
sx={(theme) => ({
|
||||
position: 'relative',
|
||||
pt: 'calc(100% * 3 / 4)',
|
||||
...((large || long) && {
|
||||
pt: 'calc(100% * 4 / 3)',
|
||||
'&:after': {
|
||||
top: 0,
|
||||
content: "''",
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
position: 'absolute',
|
||||
bgcolor: varAlpha(theme.palette.grey['900Channel'], 0.72),
|
||||
},
|
||||
}),
|
||||
...(large && {
|
||||
pt: {
|
||||
xs: 'calc(100% * 4 / 3)',
|
||||
sm: 'calc(100% * 3 / 4.66)',
|
||||
},
|
||||
}),
|
||||
})}
|
||||
>
|
||||
{renderShape}
|
||||
{renderCover}
|
||||
</Box>
|
||||
<>
|
||||
<DocFullView data={doc.data} open={openViewDoc} handleClose={() => setOpenViewDoc(false)} />
|
||||
<Card sx={sx} {...other} onClick={() => setOpenViewDoc(true)}>
|
||||
<Box
|
||||
sx={(theme) => ({
|
||||
position: 'relative',
|
||||
pt: 'calc(100% * 3 / 4)',
|
||||
...((large || long) && {
|
||||
pt: 'calc(100% * 4 / 3)',
|
||||
'&:after': {
|
||||
top: 0,
|
||||
content: "''",
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
position: 'absolute',
|
||||
bgcolor: varAlpha(theme.palette.grey['900Channel'], 0.72),
|
||||
},
|
||||
}),
|
||||
...(large && {
|
||||
pt: {
|
||||
xs: 'calc(100% * 4 / 3)',
|
||||
sm: 'calc(100% * 3 / 4.66)',
|
||||
},
|
||||
}),
|
||||
})}
|
||||
>
|
||||
{renderShape}
|
||||
{renderCover}
|
||||
</Box>
|
||||
|
||||
<Box
|
||||
sx={(theme) => ({
|
||||
p: theme.spacing(6, 3, 3, 3),
|
||||
...((large || long) && {
|
||||
width: 1,
|
||||
bottom: 0,
|
||||
position: 'absolute',
|
||||
}),
|
||||
})}
|
||||
>
|
||||
{renderDate}
|
||||
{renderTitle}
|
||||
{renderInfo}
|
||||
</Box>
|
||||
</Card>
|
||||
<Box
|
||||
sx={(theme) => ({
|
||||
p: theme.spacing(6, 3, 3, 3),
|
||||
...((large || long) && {
|
||||
width: 1,
|
||||
bottom: 0,
|
||||
position: 'absolute',
|
||||
}),
|
||||
})}
|
||||
>
|
||||
{renderDate}
|
||||
{renderTitle}
|
||||
{renderInfo}
|
||||
</Box>
|
||||
</Card>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@ -34,6 +34,7 @@ export default function DocFullView({ data, open, handleClose }: DocFullViewProp
|
||||
open={open}
|
||||
aria-labelledby="modal-modal-title"
|
||||
aria-describedby="modal-modal-description"
|
||||
onClose={handleClose}
|
||||
>
|
||||
<Box sx={style}>
|
||||
<TextField label="Label" variant="filled" value={name} onChange={e => setName(e.target.value)} />
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user