Pārlūkot izejas kodu

fix(article): 透传 hideTitle/hideHead 到 ArticleLayout 并补充段落 key

- TypePali 之前用 JSX 布尔简写 hideTitle/hideHead,导致头部永远隐藏、
  新增的 hideTitle/hideHead prop 失效;改为透传 prop 值
- nodeData.map 的 ParagraphNode 补上 book-para key
- ArticleLayout 新增 hideHead 支持
visuddhinanda 4 dienas atpakaļ
vecāks
revīzija
cfb33e2b36

+ 41 - 31
dashboard-v6/src/components/article/TypePali.tsx

@@ -47,11 +47,13 @@ interface IWidget {
   active?: boolean;
   active?: boolean;
   focus?: string | null;
   focus?: string | null;
   hideNav?: boolean;
   hideNav?: boolean;
+  hideTitle?: boolean;
+  hideHead?: boolean;
   onArticleChange?: (
   onArticleChange?: (
     type: ArticleType,
     type: ArticleType,
     id: string,
     id: string,
     target: TTarget,
     target: TTarget,
-    param?: ISearchParams[]
+    param?: ISearchParams[],
   ) => void;
   ) => void;
   onLoad?: (data: IArticleDataResponse) => void;
   onLoad?: (data: IArticleDataResponse) => void;
   onTitle?: (title: string) => void;
   onTitle?: (title: string) => void;
@@ -68,6 +70,8 @@ const TypePali = ({
   active = true,
   active = true,
   focus,
   focus,
   hideNav = false,
   hideNav = false,
+  hideTitle = false,
+  hideHead = false,
   onArticleChange,
   onArticleChange,
 }: IWidget) => {
 }: IWidget) => {
   const intl = useIntl();
   const intl = useIntl();
@@ -129,7 +133,7 @@ const TypePali = ({
 
 
   const handlePathChange = (
   const handlePathChange = (
     node: ITocPathNode,
     node: ITocPathNode,
-    e: React.MouseEvent<HTMLSpanElement | HTMLAnchorElement, MouseEvent>
+    e: React.MouseEvent<HTMLSpanElement | HTMLAnchorElement, MouseEvent>,
   ) => {
   ) => {
     let newType = type;
     let newType = type;
     let newArticle = "";
     let newArticle = "";
@@ -193,7 +197,7 @@ const TypePali = ({
                   window.open(
                   window.open(
                     import.meta.env.VITE_APP_API_SERVER +
                     import.meta.env.VITE_APP_API_SERVER +
                       `/library/tipitaka/${id}/read?channel=${channels[0]}`,
                       `/library/tipitaka/${id}/read?channel=${channels[0]}`,
-                    "_blank"
+                    "_blank",
                   );
                   );
                 }
                 }
               },
               },
@@ -209,7 +213,9 @@ const TypePali = ({
         subTitle={articleData?.subtitle}
         subTitle={articleData?.subtitle}
         summary={articleData?.summary}
         summary={articleData?.summary}
         nodes={nodeData.map((item) => {
         nodes={nodeData.map((item) => {
-          return <ParagraphNode initData={item} />;
+          return (
+            <ParagraphNode key={`${item.book}-${item.para}`} initData={item} />
+          );
         })}
         })}
         html={
         html={
           nodeData.length === 0
           nodeData.length === 0
@@ -221,6 +227,8 @@ const TypePali = ({
         loading={loading}
         loading={loading}
         errorCode={errorCode}
         errorCode={errorCode}
         remains={remains}
         remains={remains}
+        hideTitle={hideTitle}
+        hideHead={hideHead}
         onEnd={() => {
         onEnd={() => {
           if (type === "chapter") loadNextChunk();
           if (type === "chapter") loadNextChunk();
         }}
         }}
@@ -248,7 +256,7 @@ const TypePali = ({
         })}
         })}
         onClick={(
         onClick={(
           id: string,
           id: string,
-          e: React.MouseEvent<HTMLSpanElement, MouseEvent>
+          e: React.MouseEvent<HTMLSpanElement, MouseEvent>,
         ) => {
         ) => {
           if (e.ctrlKey || e.metaKey) {
           if (e.ctrlKey || e.metaKey) {
             onArticleChange?.("chapter", id, "_blank");
             onArticleChange?.("chapter", id, "_blank");
@@ -258,33 +266,35 @@ const TypePali = ({
         }}
         }}
       />
       />
 
 
-      <Divider />
-
       {!hideNav && (
       {!hideNav && (
-        <Navigate
-          type={type}
-          articleId={id}
-          path={fullPath}
-          onPathChange={(key: string) => {
-            const node = articleData?.path?.find((v) => v.title === key);
-            if (node) {
-              const newType = node.level === 0 ? "series" : "chapter";
-              const newArticle = node.key ?? `${node.book}-${node.paragraph}`;
-              onArticleChange?.(newType, newArticle, "_self");
-            }
-          }}
-          onChange={(
-            event: React.MouseEvent<HTMLElement, MouseEvent>,
-            newId: string
-          ) => {
-            const target = event.ctrlKey || event.metaKey ? "_blank" : "_self";
-            let param: ISearchParams[] = [];
-            if (type === "para" && newId?.split("-").length > 1) {
-              param = [{ key: "par", value: newId.split("-")[1] }];
-            }
-            onArticleChange?.(type as ArticleType, newId, target, param);
-          }}
-        />
+        <>
+          <Divider />
+          <Navigate
+            type={type}
+            articleId={id}
+            path={fullPath}
+            onPathChange={(key: string) => {
+              const node = articleData?.path?.find((v) => v.title === key);
+              if (node) {
+                const newType = node.level === 0 ? "series" : "chapter";
+                const newArticle = node.key ?? `${node.book}-${node.paragraph}`;
+                onArticleChange?.(newType, newArticle, "_self");
+              }
+            }}
+            onChange={(
+              event: React.MouseEvent<HTMLElement, MouseEvent>,
+              newId: string,
+            ) => {
+              const target =
+                event.ctrlKey || event.metaKey ? "_blank" : "_self";
+              let param: ISearchParams[] = [];
+              if (type === "para" && newId?.split("-").length > 1) {
+                param = [{ key: "par", value: newId.split("-")[1] }];
+              }
+              onArticleChange?.(type as ArticleType, newId, target, param);
+            }}
+          />
+        </>
       )}
       )}
     </div>
     </div>
   );
   );

+ 9 - 5
dashboard-v6/src/components/article/components/ArticleLayout.tsx

@@ -34,6 +34,7 @@ export interface IArticleLayout {
   remains?: boolean;
   remains?: boolean;
   anthology?: IFirstAnthology;
   anthology?: IFirstAnthology;
   hideTitle?: boolean;
   hideTitle?: boolean;
+  hideHead?: boolean;
   onEnd?: () => void;
   onEnd?: () => void;
 }
 }
 
 
@@ -49,7 +50,8 @@ const ArticleLayout = ({
   resList,
   resList,
   loading,
   loading,
   errorCode,
   errorCode,
-  hideTitle,
+  hideTitle = false,
+  hideHead = false,
   remains,
   remains,
   onEnd,
   onEnd,
 }: IArticleLayout) => {
 }: IArticleLayout) => {
@@ -63,10 +65,12 @@ const ArticleLayout = ({
         <ErrorResult code={errorCode} />
         <ErrorResult code={errorCode} />
       ) : (
       ) : (
         <div>
         <div>
-          <Flex orientation="vertical" gap="middle">
-            {hideTitle ? (
-              <></>
-            ) : (
+          <Flex
+            style={{ display: hideHead ? "none" : "block" }}
+            orientation="vertical"
+            gap="middle"
+          >
+            {!hideTitle && (
               <Title level={4}>
               <Title level={4}>
                 <div
                 <div
                   dangerouslySetInnerHTML={{
                   dangerouslySetInnerHTML={{