From 733282d84b9172d2dad0371832c2c6f4a57e74de Mon Sep 17 00:00:00 2001 From: fantasticit Date: Wed, 30 Mar 2022 13:57:29 +0800 Subject: [PATCH 1/2] fix: collapsed when window width less than 765 --- packages/client/src/hooks/use-dragable-width.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/client/src/hooks/use-dragable-width.ts b/packages/client/src/hooks/use-dragable-width.ts index d621d136..eda75360 100644 --- a/packages/client/src/hooks/use-dragable-width.ts +++ b/packages/client/src/hooks/use-dragable-width.ts @@ -40,7 +40,9 @@ export const useDragableWidth = () => { useEffect(() => { if (!windowSize.width) return; - toggleCollapsed(windowSize.width <= 765); + if (windowSize.width <= 765) { + toggleCollapsed(true); + } }, [windowSize.width]); return { From a4167fe603bf24f37e06c49e9c797feaf768558f Mon Sep 17 00:00:00 2001 From: fantasticit Date: Wed, 30 Mar 2022 13:57:50 +0800 Subject: [PATCH 2/2] feat: improve date version, add empty content --- .../src/components/data-render/index.tsx | 31 ++++ .../src/components/document/version/index.tsx | 4 +- packages/client/src/illustrations/empty.tsx | 158 ++++++++++++++++++ packages/client/src/styles/globals.scss | 2 +- .../src/services/document-version.service.ts | 8 +- 5 files changed, 196 insertions(+), 7 deletions(-) create mode 100644 packages/client/src/illustrations/empty.tsx diff --git a/packages/client/src/components/data-render/index.tsx b/packages/client/src/components/data-render/index.tsx index 375b0b9a..e084ff3d 100644 --- a/packages/client/src/components/data-render/index.tsx +++ b/packages/client/src/components/data-render/index.tsx @@ -1,13 +1,16 @@ import React from 'react'; import { Spin, Typography } from '@douyinfe/semi-ui'; +import { Empty } from 'illustrations/empty'; type RenderProps = React.ReactNode | (() => React.ReactNode); interface IProps { loading: boolean; error: Error | null; + empty?: boolean; loadingContent?: RenderProps; errorContent?: RenderProps; + emptyContent?: RenderProps; normalContent: RenderProps; } @@ -21,13 +24,37 @@ const defaultRenderError = (error) => { return {(error && error.message) || '未知错误'}; }; +const defaultEmpty = () => { + return ( +
+
+ +
+ 暂无数据 +
+ ); +}; + const runRender = (fn, ...args) => (typeof fn === 'function' ? fn.apply(null, args) : fn); export const DataRender: React.FC = ({ loading, error, + empty, loadingContent = defaultLoading, errorContent = defaultRenderError, + emptyContent = defaultEmpty, normalContent, }) => { if (loading) { @@ -38,5 +65,9 @@ export const DataRender: React.FC = ({ return runRender(errorContent, error); } + if (empty) { + return runRender(emptyContent); + } + return runRender(normalContent); }; diff --git a/packages/client/src/components/document/version/index.tsx b/packages/client/src/components/document/version/index.tsx index c10cf97c..9409f4fc 100644 --- a/packages/client/src/components/document/version/index.tsx +++ b/packages/client/src/components/document/version/index.tsx @@ -6,6 +6,7 @@ import cls from 'classnames'; import { DEFAULT_EXTENSION, DocumentWithTitle } from 'tiptap'; import { safeJSONParse } from 'helpers/json'; import { DataRender } from 'components/data-render'; +import { LocaleTime } from 'components/locale-time'; import { useToggle } from 'hooks/use-toggle'; import { useDocumentVersion } from 'data/document'; import styles from './index.module.scss'; @@ -102,6 +103,7 @@ export const DocumentVersion: React.FC = ({ documentId, onSelect }) => { (