mirror of https://github.com/fantasticit/think.git
client: update tocs style
This commit is contained in:
parent
5f05715ed1
commit
860e2471e5
|
@ -3,6 +3,16 @@
|
||||||
height: 100%;
|
height: 100%;
|
||||||
padding-top: 12px;
|
padding-top: 12px;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
> main {
|
||||||
|
flex: 1;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.titleWrap {
|
.titleWrap {
|
||||||
|
|
|
@ -48,252 +48,256 @@ export const WikiTocs: React.FC<IProps> = ({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.wrap}>
|
<div className={styles.wrap}>
|
||||||
<DataRender
|
<header>
|
||||||
loading={wikiLoading}
|
<DataRender
|
||||||
loadingContent={
|
loading={wikiLoading}
|
||||||
<div className={styles.titleWrap}>
|
loadingContent={
|
||||||
<Skeleton
|
|
||||||
placeholder={
|
|
||||||
<div style={{ display: 'flex' }}>
|
|
||||||
<Skeleton.Avatar
|
|
||||||
size="small"
|
|
||||||
style={{
|
|
||||||
marginRight: 8,
|
|
||||||
width: 24,
|
|
||||||
height: 24,
|
|
||||||
borderRadius: 4,
|
|
||||||
}}
|
|
||||||
></Skeleton.Avatar>
|
|
||||||
<Skeleton.Title style={{ width: 120 }} />
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
loading={true}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
error={wikiError}
|
|
||||||
normalContent={() => (
|
|
||||||
<Dropdown
|
|
||||||
trigger={'click'}
|
|
||||||
position="bottomRight"
|
|
||||||
render={
|
|
||||||
<Dropdown.Menu style={{ width: 180 }}>
|
|
||||||
{(starWikis || [])
|
|
||||||
.filter((wiki) => wiki.id !== wikiId)
|
|
||||||
.map((wiki) => {
|
|
||||||
return (
|
|
||||||
<Dropdown.Item key={wiki.id}>
|
|
||||||
<Link
|
|
||||||
href={{
|
|
||||||
pathname: `/wiki/[wikiId]`,
|
|
||||||
query: { wikiId: wiki.id },
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<a
|
|
||||||
style={{
|
|
||||||
display: 'flex',
|
|
||||||
width: '100%',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<span>
|
|
||||||
<Avatar
|
|
||||||
shape="square"
|
|
||||||
size="small"
|
|
||||||
src={wiki.avatar}
|
|
||||||
style={{
|
|
||||||
marginRight: 8,
|
|
||||||
width: 24,
|
|
||||||
height: 24,
|
|
||||||
borderRadius: 4,
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{wiki.name.charAt(0)}
|
|
||||||
</Avatar>
|
|
||||||
<Text strong ellipsis={{ rows: 1 }}>
|
|
||||||
{wiki.name}
|
|
||||||
</Text>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</Link>
|
|
||||||
</Dropdown.Item>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</Dropdown.Menu>
|
|
||||||
}
|
|
||||||
>
|
|
||||||
<div className={styles.titleWrap}>
|
<div className={styles.titleWrap}>
|
||||||
<span>
|
<Skeleton
|
||||||
<Avatar
|
placeholder={
|
||||||
shape="square"
|
<div style={{ display: 'flex' }}>
|
||||||
size="small"
|
<Skeleton.Avatar
|
||||||
src={wiki.avatar}
|
size="small"
|
||||||
style={{
|
style={{
|
||||||
marginRight: 8,
|
marginRight: 8,
|
||||||
width: 24,
|
width: 24,
|
||||||
height: 24,
|
height: 24,
|
||||||
borderRadius: 4,
|
borderRadius: 4,
|
||||||
}}
|
}}
|
||||||
>
|
></Skeleton.Avatar>
|
||||||
{wiki.name.charAt(0)}
|
<Skeleton.Title style={{ width: 120 }} />
|
||||||
</Avatar>
|
</div>
|
||||||
<Text strong>{wiki.name}</Text>
|
}
|
||||||
</span>
|
loading={true}
|
||||||
<IconSmallTriangleDown />
|
|
||||||
</div>
|
|
||||||
</Dropdown>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<DataRender
|
|
||||||
loading={wikiLoading}
|
|
||||||
loadingContent={
|
|
||||||
<div className={styles.titleWrap}>
|
|
||||||
<Skeleton
|
|
||||||
placeholder={
|
|
||||||
<div style={{ display: 'flex' }}>
|
|
||||||
<Skeleton.Avatar
|
|
||||||
size="small"
|
|
||||||
style={{
|
|
||||||
marginRight: 8,
|
|
||||||
width: 24,
|
|
||||||
height: 24,
|
|
||||||
borderRadius: 4,
|
|
||||||
}}
|
|
||||||
></Skeleton.Avatar>
|
|
||||||
<Skeleton.Title style={{ width: 120 }} />
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
loading={true}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
error={wikiError}
|
|
||||||
normalContent={() => (
|
|
||||||
<div className={cls(styles.linkWrap, pathname === '/wiki/[wikiId]' && styles.isActive)}>
|
|
||||||
<Link
|
|
||||||
href={{
|
|
||||||
pathname: `/wiki/[wikiId]`,
|
|
||||||
query: { wikiId },
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<a>
|
|
||||||
<IconOverview style={{ fontSize: '1em' }} />
|
|
||||||
<span>主页</span>
|
|
||||||
</a>
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<DataRender
|
|
||||||
loading={wikiLoading}
|
|
||||||
loadingContent={
|
|
||||||
<div className={styles.titleWrap}>
|
|
||||||
<Skeleton
|
|
||||||
placeholder={
|
|
||||||
<div style={{ display: 'flex' }}>
|
|
||||||
<Skeleton.Avatar
|
|
||||||
size="small"
|
|
||||||
style={{
|
|
||||||
marginRight: 8,
|
|
||||||
width: 24,
|
|
||||||
height: 24,
|
|
||||||
borderRadius: 4,
|
|
||||||
}}
|
|
||||||
></Skeleton.Avatar>
|
|
||||||
<Skeleton.Title style={{ width: 120 }} />
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
loading={true}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
error={wikiError}
|
|
||||||
normalContent={() => (
|
|
||||||
<div className={cls(styles.linkWrap, pathname === '/wiki/[wikiId]/setting' && styles.isActive)}>
|
|
||||||
<Link
|
|
||||||
href={{
|
|
||||||
pathname: `/wiki/[wikiId]/setting`,
|
|
||||||
query: { tab: 'base', wikiId },
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<a>
|
|
||||||
<IconSetting style={{ fontSize: '1em' }} />
|
|
||||||
<span>设置</span>
|
|
||||||
</a>
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<div className={styles.treeWrap}>
|
|
||||||
<DataRender
|
|
||||||
loading={starDocumentsLoading}
|
|
||||||
loadingContent={<Skeleton.Title style={{ width: '100%' }} />}
|
|
||||||
error={starDocumentsError}
|
|
||||||
normalContent={() => (
|
|
||||||
<div className={styles.title}>
|
|
||||||
<Text type="tertiary" size="small">
|
|
||||||
已加星标
|
|
||||||
</Text>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
<DataRender
|
|
||||||
loading={starDocumentsLoading}
|
|
||||||
loadingContent={<div>1</div>}
|
|
||||||
error={starDocumentsError}
|
|
||||||
normalContent={() => (
|
|
||||||
<Tree
|
|
||||||
data={starDocuments || []}
|
|
||||||
docAsLink={docAsLink}
|
|
||||||
getDocLink={getDocLink}
|
|
||||||
parentIds={parentIds}
|
|
||||||
activeId={documentId}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className={styles.treeWrap}>
|
|
||||||
<DataRender
|
|
||||||
loading={tocsLoading}
|
|
||||||
loadingContent={<Skeleton.Title style={{ width: '100%' }} />}
|
|
||||||
error={wikiError}
|
|
||||||
normalContent={() => (
|
|
||||||
<div className={styles.title}>
|
|
||||||
<Text type="tertiary" size="small">
|
|
||||||
文档集
|
|
||||||
</Text>
|
|
||||||
<Button
|
|
||||||
style={{ fontSize: '1em' }}
|
|
||||||
theme="borderless"
|
|
||||||
type="tertiary"
|
|
||||||
icon={<IconPlus style={{ fontSize: '1em' }} />}
|
|
||||||
size="small"
|
|
||||||
onClick={() => {
|
|
||||||
triggerCreateDocument({ wikiId: wiki.id, documentId: null });
|
|
||||||
}}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
)}
|
}
|
||||||
/>
|
error={wikiError}
|
||||||
<DataRender
|
|
||||||
loading={tocsLoading}
|
|
||||||
loadingContent={<div>1</div>}
|
|
||||||
error={tocsError}
|
|
||||||
normalContent={() => (
|
normalContent={() => (
|
||||||
<Tree
|
<Dropdown
|
||||||
needAddDocument
|
trigger={'click'}
|
||||||
data={tocs || []}
|
position="bottomRight"
|
||||||
docAsLink={docAsLink}
|
render={
|
||||||
getDocLink={getDocLink}
|
<Dropdown.Menu style={{ width: 180 }}>
|
||||||
parentIds={parentIds}
|
{(starWikis || [])
|
||||||
activeId={documentId}
|
.filter((wiki) => wiki.id !== wikiId)
|
||||||
/>
|
.map((wiki) => {
|
||||||
|
return (
|
||||||
|
<Dropdown.Item key={wiki.id}>
|
||||||
|
<Link
|
||||||
|
href={{
|
||||||
|
pathname: `/wiki/[wikiId]`,
|
||||||
|
query: { wikiId: wiki.id },
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
style={{
|
||||||
|
display: 'flex',
|
||||||
|
width: '100%',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<span>
|
||||||
|
<Avatar
|
||||||
|
shape="square"
|
||||||
|
size="small"
|
||||||
|
src={wiki.avatar}
|
||||||
|
style={{
|
||||||
|
marginRight: 8,
|
||||||
|
width: 24,
|
||||||
|
height: 24,
|
||||||
|
borderRadius: 4,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{wiki.name.charAt(0)}
|
||||||
|
</Avatar>
|
||||||
|
<Text strong ellipsis={{ rows: 1 }}>
|
||||||
|
{wiki.name}
|
||||||
|
</Text>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</Link>
|
||||||
|
</Dropdown.Item>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</Dropdown.Menu>
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<div className={styles.titleWrap}>
|
||||||
|
<span>
|
||||||
|
<Avatar
|
||||||
|
shape="square"
|
||||||
|
size="small"
|
||||||
|
src={wiki.avatar}
|
||||||
|
style={{
|
||||||
|
marginRight: 8,
|
||||||
|
width: 24,
|
||||||
|
height: 24,
|
||||||
|
borderRadius: 4,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{wiki.name.charAt(0)}
|
||||||
|
</Avatar>
|
||||||
|
<Text strong>{wiki.name}</Text>
|
||||||
|
</span>
|
||||||
|
<IconSmallTriangleDown />
|
||||||
|
</div>
|
||||||
|
</Dropdown>
|
||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
</div>
|
|
||||||
|
<DataRender
|
||||||
|
loading={wikiLoading}
|
||||||
|
loadingContent={
|
||||||
|
<div className={styles.titleWrap}>
|
||||||
|
<Skeleton
|
||||||
|
placeholder={
|
||||||
|
<div style={{ display: 'flex' }}>
|
||||||
|
<Skeleton.Avatar
|
||||||
|
size="small"
|
||||||
|
style={{
|
||||||
|
marginRight: 8,
|
||||||
|
width: 24,
|
||||||
|
height: 24,
|
||||||
|
borderRadius: 4,
|
||||||
|
}}
|
||||||
|
></Skeleton.Avatar>
|
||||||
|
<Skeleton.Title style={{ width: 120 }} />
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
loading={true}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
error={wikiError}
|
||||||
|
normalContent={() => (
|
||||||
|
<div className={cls(styles.linkWrap, pathname === '/wiki/[wikiId]' && styles.isActive)}>
|
||||||
|
<Link
|
||||||
|
href={{
|
||||||
|
pathname: `/wiki/[wikiId]`,
|
||||||
|
query: { wikiId },
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<a>
|
||||||
|
<IconOverview style={{ fontSize: '1em' }} />
|
||||||
|
<span>主页</span>
|
||||||
|
</a>
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<DataRender
|
||||||
|
loading={wikiLoading}
|
||||||
|
loadingContent={
|
||||||
|
<div className={styles.titleWrap}>
|
||||||
|
<Skeleton
|
||||||
|
placeholder={
|
||||||
|
<div style={{ display: 'flex' }}>
|
||||||
|
<Skeleton.Avatar
|
||||||
|
size="small"
|
||||||
|
style={{
|
||||||
|
marginRight: 8,
|
||||||
|
width: 24,
|
||||||
|
height: 24,
|
||||||
|
borderRadius: 4,
|
||||||
|
}}
|
||||||
|
></Skeleton.Avatar>
|
||||||
|
<Skeleton.Title style={{ width: 120 }} />
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
loading={true}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
error={wikiError}
|
||||||
|
normalContent={() => (
|
||||||
|
<div className={cls(styles.linkWrap, pathname === '/wiki/[wikiId]/setting' && styles.isActive)}>
|
||||||
|
<Link
|
||||||
|
href={{
|
||||||
|
pathname: `/wiki/[wikiId]/setting`,
|
||||||
|
query: { tab: 'base', wikiId },
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<a>
|
||||||
|
<IconSetting style={{ fontSize: '1em' }} />
|
||||||
|
<span>设置</span>
|
||||||
|
</a>
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<div className={styles.treeWrap}>
|
||||||
|
<DataRender
|
||||||
|
loading={starDocumentsLoading}
|
||||||
|
loadingContent={<Skeleton.Title style={{ width: '100%' }} />}
|
||||||
|
error={starDocumentsError}
|
||||||
|
normalContent={() => (
|
||||||
|
<div className={styles.title}>
|
||||||
|
<Text type="tertiary" size="small">
|
||||||
|
已加星标
|
||||||
|
</Text>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
<DataRender
|
||||||
|
loading={starDocumentsLoading}
|
||||||
|
loadingContent={<div>1</div>}
|
||||||
|
error={starDocumentsError}
|
||||||
|
normalContent={() => (
|
||||||
|
<Tree
|
||||||
|
data={starDocuments || []}
|
||||||
|
docAsLink={docAsLink}
|
||||||
|
getDocLink={getDocLink}
|
||||||
|
parentIds={parentIds}
|
||||||
|
activeId={documentId}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className={styles.treeWrap}>
|
||||||
|
<DataRender
|
||||||
|
loading={tocsLoading}
|
||||||
|
loadingContent={<Skeleton.Title style={{ width: '100%' }} />}
|
||||||
|
error={wikiError}
|
||||||
|
normalContent={() => (
|
||||||
|
<div className={styles.title}>
|
||||||
|
<Text type="tertiary" size="small">
|
||||||
|
文档集
|
||||||
|
</Text>
|
||||||
|
<Button
|
||||||
|
style={{ fontSize: '1em' }}
|
||||||
|
theme="borderless"
|
||||||
|
type="tertiary"
|
||||||
|
icon={<IconPlus style={{ fontSize: '1em' }} />}
|
||||||
|
size="small"
|
||||||
|
onClick={() => {
|
||||||
|
triggerCreateDocument({ wikiId: wiki.id, documentId: null });
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
<DataRender
|
||||||
|
loading={tocsLoading}
|
||||||
|
loadingContent={<div>1</div>}
|
||||||
|
error={tocsError}
|
||||||
|
normalContent={() => (
|
||||||
|
<Tree
|
||||||
|
needAddDocument
|
||||||
|
data={tocs || []}
|
||||||
|
docAsLink={docAsLink}
|
||||||
|
getDocLink={getDocLink}
|
||||||
|
parentIds={parentIds}
|
||||||
|
activeId={documentId}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
@ -43,72 +43,17 @@ export const WikiPublicTocs: React.FC<IProps> = ({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.wrap}>
|
<div className={styles.wrap}>
|
||||||
<div className={styles.navItemWrap}>
|
<header>
|
||||||
<div className={styles.navItem}>
|
<div className={styles.navItemWrap}>
|
||||||
<Space>
|
<div className={styles.navItem}>
|
||||||
<LogoImage /> <LogoText />
|
<Space>
|
||||||
</Space>
|
<LogoImage /> <LogoText />
|
||||||
|
</Space>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<DataRender
|
|
||||||
loading={wikiLoading}
|
|
||||||
loadingContent={
|
|
||||||
<NavItem
|
|
||||||
icon={
|
|
||||||
<Skeleton.Avatar
|
|
||||||
size="small"
|
|
||||||
style={{
|
|
||||||
marginRight: 8,
|
|
||||||
width: 24,
|
|
||||||
height: 24,
|
|
||||||
borderRadius: 4,
|
|
||||||
}}
|
|
||||||
></Skeleton.Avatar>
|
|
||||||
}
|
|
||||||
text={<Skeleton.Title style={{ width: 120 }} />}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
error={wikiError}
|
|
||||||
normalContent={() => (
|
|
||||||
<>
|
|
||||||
<Seo title={wiki.name + ' - ' + pageTitle} />
|
|
||||||
<NavItem
|
|
||||||
icon={
|
|
||||||
<Avatar
|
|
||||||
shape="square"
|
|
||||||
size="small"
|
|
||||||
src={wiki.avatar}
|
|
||||||
style={{
|
|
||||||
marginRight: 8,
|
|
||||||
width: 24,
|
|
||||||
height: 24,
|
|
||||||
borderRadius: 4,
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{wiki.name.charAt(0)}
|
|
||||||
</Avatar>
|
|
||||||
}
|
|
||||||
text={<Text strong>{wiki.name}</Text>}
|
|
||||||
hoverable={false}
|
|
||||||
/>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<NavItem
|
|
||||||
icon={<IconOverview />}
|
|
||||||
text={'概述'}
|
|
||||||
href={{
|
|
||||||
pathname: `/share/wiki/[wikiId]`,
|
|
||||||
query: { wikiId },
|
|
||||||
}}
|
|
||||||
isActive={pathname === '/share/wiki/[wikiId]'}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<div className={styles.treeWrap} style={{ marginTop: 12 }}>
|
|
||||||
<DataRender
|
<DataRender
|
||||||
loading={tocsLoading}
|
loading={wikiLoading}
|
||||||
loadingContent={
|
loadingContent={
|
||||||
<NavItem
|
<NavItem
|
||||||
icon={
|
icon={
|
||||||
|
@ -123,22 +68,81 @@ export const WikiPublicTocs: React.FC<IProps> = ({
|
||||||
></Skeleton.Avatar>
|
></Skeleton.Avatar>
|
||||||
}
|
}
|
||||||
text={<Skeleton.Title style={{ width: 120 }} />}
|
text={<Skeleton.Title style={{ width: 120 }} />}
|
||||||
rightNode={<IconPlus />}
|
|
||||||
/>
|
/>
|
||||||
}
|
}
|
||||||
error={tocsError}
|
error={wikiError}
|
||||||
normalContent={() => (
|
normalContent={() => (
|
||||||
<Tree
|
<>
|
||||||
data={tocs || []}
|
<Seo title={wiki.name + ' - ' + pageTitle} />
|
||||||
docAsLink={docAsLink}
|
<NavItem
|
||||||
getDocLink={getDocLink}
|
icon={
|
||||||
parentIds={parentIds}
|
<Avatar
|
||||||
activeId={documentId}
|
shape="square"
|
||||||
isShareMode
|
size="small"
|
||||||
/>
|
src={wiki.avatar}
|
||||||
|
style={{
|
||||||
|
marginRight: 8,
|
||||||
|
width: 24,
|
||||||
|
height: 24,
|
||||||
|
borderRadius: 4,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{wiki.name.charAt(0)}
|
||||||
|
</Avatar>
|
||||||
|
}
|
||||||
|
text={<Text strong>{wiki.name}</Text>}
|
||||||
|
hoverable={false}
|
||||||
|
/>
|
||||||
|
</>
|
||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
</div>
|
|
||||||
|
<NavItem
|
||||||
|
icon={<IconOverview />}
|
||||||
|
text={'概述'}
|
||||||
|
href={{
|
||||||
|
pathname: `/share/wiki/[wikiId]`,
|
||||||
|
query: { wikiId },
|
||||||
|
}}
|
||||||
|
isActive={pathname === '/share/wiki/[wikiId]'}
|
||||||
|
/>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<div className={styles.treeWrap}>
|
||||||
|
<DataRender
|
||||||
|
loading={tocsLoading}
|
||||||
|
loadingContent={
|
||||||
|
<NavItem
|
||||||
|
icon={
|
||||||
|
<Skeleton.Avatar
|
||||||
|
size="small"
|
||||||
|
style={{
|
||||||
|
marginRight: 8,
|
||||||
|
width: 24,
|
||||||
|
height: 24,
|
||||||
|
borderRadius: 4,
|
||||||
|
}}
|
||||||
|
></Skeleton.Avatar>
|
||||||
|
}
|
||||||
|
text={<Skeleton.Title style={{ width: 120 }} />}
|
||||||
|
rightNode={<IconPlus />}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
error={tocsError}
|
||||||
|
normalContent={() => (
|
||||||
|
<Tree
|
||||||
|
data={tocs || []}
|
||||||
|
docAsLink={docAsLink}
|
||||||
|
getDocLink={getDocLink}
|
||||||
|
parentIds={parentIds}
|
||||||
|
activeId={documentId}
|
||||||
|
isShareMode
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in New Issue