visuddhinanda 2 лет назад
Родитель
Сommit
148b738eb6

+ 22 - 8
dashboard/src/components/article/Article.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from "react";
-import { Divider, message, Result, Tag } from "antd";
+import { Divider, message, Result, Space, Tag } from "antd";
 
 import { get, post } from "../../request";
 import store from "../../store";
@@ -11,7 +11,6 @@ import { ITextbook, refresh } from "../../reducers/current-course";
 import ExerciseList from "./ExerciseList";
 import ExerciseAnswer from "../course/ExerciseAnswer";
 import "./article.css";
-import CommentListCard from "../discussion/DiscussionListCard";
 import TocTree from "./TocTree";
 import PaliText from "../template/Wbw/PaliText";
 import ArticleSkeleton from "./ArticleSkeleton";
@@ -22,6 +21,7 @@ import {
   IRecentRequest,
   IRecentResponse,
 } from "../../pages/studio/recent/list";
+import { ITocPathNode } from "../corpus/TocPath";
 
 export type ArticleMode = "read" | "edit" | "wbw";
 export type ArticleType =
@@ -59,7 +59,7 @@ interface IWidget {
   book?: string | null;
   para?: string | null;
   channelId?: string | null;
-  anthologyId?: string;
+  anthologyId?: string | null;
   courseId?: string;
   exerciseId?: string;
   userName?: string;
@@ -236,17 +236,19 @@ const ArticleWidget = ({
               <TocTree
                 treeData={json.data.toc?.map((item) => {
                   const strTitle = item.title ? item.title : item.pali_title;
+                  const key = item.key
+                    ? item.key
+                    : `${item.book}-${item.paragraph}`;
                   const progress = item.progress?.map((item, id) => (
-                    <Tag key={id}>{Math.round(item * 100)}</Tag>
+                    <Tag key={id}>{Math.round(item * 100) + "%"}</Tag>
                   ));
-
                   return {
-                    key: `${item.book}-${item.paragraph}`,
+                    key: key,
                     title: (
-                      <>
+                      <Space>
                         <PaliText text={strTitle} />
                         {progress}
-                      </>
+                      </Space>
                     ),
                     level: item.level,
                   };
@@ -377,6 +379,18 @@ const ArticleWidget = ({
               getNextPara(articleData);
             }
           }}
+          onPathChange={(
+            node: ITocPathNode,
+            e: React.MouseEvent<HTMLSpanElement | HTMLAnchorElement, MouseEvent>
+          ) => {
+            if (typeof onArticleChange !== "undefined") {
+              const newArticle = node.key
+                ? node.key
+                : `${node.book}-${node.paragraph}`;
+              const target = e.ctrlKey || e.metaKey ? "_blank" : "self";
+              onArticleChange(newArticle, target);
+            }
+          }}
         />
       )}
 

+ 14 - 1
dashboard/src/components/article/ArticleView.tsx

@@ -24,6 +24,7 @@ export interface IWidgetArticleData {
   articleId?: string;
   remains?: boolean;
   onEnd?: Function;
+  onPathChange?: Function;
 }
 
 const ArticleViewWidget = ({
@@ -41,6 +42,7 @@ const ArticleViewWidget = ({
   articleId,
   onEnd,
   remains,
+  onPathChange,
 }: IWidgetArticleData) => {
   let currChannelList = <></>;
   switch (type) {
@@ -76,7 +78,18 @@ const ArticleViewWidget = ({
       </div>
 
       <div>
-        <TocPath data={path} channel={channels} />
+        <TocPath
+          data={path}
+          channel={channels}
+          onChange={(
+            node: ITocPathNode,
+            e: React.MouseEvent<HTMLSpanElement | HTMLAnchorElement, MouseEvent>
+          ) => {
+            if (typeof onPathChange !== "undefined") {
+              onPathChange(node, e);
+            }
+          }}
+        />
 
         <Title level={4}>
           <div