monoid/ionian
1
0
Fork 0
Code Issues 9 Pull Requests Projects Releases Wiki Activity

replace grid

Browse Source
This commit is contained in:
monoid 2022-06-20 17:15:45 +09:00
parent 3dbcf56546
commit 62fd2cb1d3
1 changed files with 24 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/client/component/contentinfo.tsx
View File

@ -2,7 +2,7 @@ import React, { } from 'react';
import { Link as RouterLink } from 'react-router-dom'; import { Link as RouterLink } from 'react-router-dom';
import { Document } from '../accessor/document'; import { Document } from '../accessor/document';
import { Link, Paper, Theme, Box, useTheme, Typography } from '@mui/material'; import { Link, Paper, Theme, Box, useTheme, Typography, Grid } from '@mui/material';
import { ThumbnailContainer } from '../page/reader/reader'; import { ThumbnailContainer } from '../page/reader/reader';
import { TagChip } from '../component/tagchip'; import { TagChip } from '../component/tagchip';
@ -117,7 +117,7 @@ export const ContentInfo = (props: {
{props.short ? (<Box /*className={propclasses.tag_list ?? classes.tag_list}*/>{document.tags.map(x => {props.short ? (<Box /*className={propclasses.tag_list ?? classes.tag_list}*/>{document.tags.map(x =>
(<TagChip key={x} label={x} clickable tagname={x} size="small"></TagChip>) (<TagChip key={x} label={x} clickable tagname={x} size="small"></TagChip>)
)}</Box>) : ( )}</Box>) : (
<ComicDetailTag tags={document.tags}/* classes={({tag_list:classes.tag_list})}*/ ></ComicDetailTag>) <ComicDetailTag tags={document.tags} path={document.basepath+"/"+document.filename}/* classes={({tag_list:classes.tag_list})}*/ ></ComicDetailTag>)
} }
</Box> </Box>
</Box> </Box>
@ -125,9 +125,11 @@ export const ContentInfo = (props: {
} }
function ComicDetailTag(prop: { function ComicDetailTag(prop: {
tags: string[]/*classes:{ tags: string[];/*classes:{
tag_list:string tag_list:string
}*/}) { }*/
path?: string;
}) {
let allTag = prop.tags; let allTag = prop.tags;
const tagKind = ["artist", "group", "series", "type", "character"]; const tagKind = ["artist", "group", "series", "type", "character"];
let tagTable: { [kind: string]: string[] } = {}; let tagTable: { [kind: string]: string[] } = {};
@ -136,16 +138,28 @@ function ComicDetailTag(prop: {
tagTable[kind] = tags; tagTable[kind] = tags;
allTag = allTag.filter(x => !x.startsWith(kind + ":")); allTag = allTag.filter(x => !x.startsWith(kind + ":"));
} }
return (<React.Fragment> return (<Grid container>
{tagKind.map(key => ( {tagKind.map(key => (
<React.Fragment key={key}> <React.Fragment key={key}>
<Grid item xs={3}>
<Typography variant='subtitle1'>{key}</Typography> <Typography variant='subtitle1'>{key}</Typography>
</Grid>
<Grid item xs={9}>
<Box>{tagTable[key].length !== 0 ? tagTable[key].join(", ") : "N/A"}</Box> <Box>{tagTable[key].length !== 0 ? tagTable[key].join(", ") : "N/A"}</Box>
</Grid>
</React.Fragment> </React.Fragment>
))} ))}
{ prop.path != undefined && <><Grid item xs={3}>
<Typography variant='subtitle1'>Path</Typography>
</Grid><Grid item xs={9}>
<Box>{prop.path}</Box>
</Grid></>
}
<Grid item xs={3}>
<Typography variant='subtitle1'>Tags</Typography> <Typography variant='subtitle1'>Tags</Typography>
<Box /*lassName={prop.classes.tag_list}*/> </Grid>
<Grid item xs={9}>
{allTag.map(x => (<TagChip key={x} label={x} clickable tagname={x} size="small"></TagChip>))} {allTag.map(x => (<TagChip key={x} label={x} clickable tagname={x} size="small"></TagChip>))}
</Box> </Grid>
</React.Fragment>); </Grid>);
} }