:construction: 改为search param 输入参数

dashboard/src/components/article/Article.tsx

@@ -1,8 +1,7 @@
 import { useEffect, useState } from "react";
 import { Divider, message, Result, Tag } from "antd";
 
-import { modeChange } from "../../reducers/article-mode";
-import { get } from "../../request";
+import { get, post } from "../../request";
 import store from "../../store";
 import { IArticleDataResponse, IArticleResponse } from "../api/Article";
 import ArticleView from "./ArticleView";
@@ -16,6 +15,12 @@ import CommentListCard from "../comment/CommentListCard";
 import TocTree from "./TocTree";
 import PaliText from "../template/Wbw/PaliText";
 import ArticleSkeleton from "./ArticleSkeleton";
+import { modeChange } from "../../reducers/article-mode";
+import {
+  IMetaChapter,
+  IViewRequest,
+  IViewStoreResponse,
+} from "../../pages/studio/recent/list";
 
 export type ArticleMode = "read" | "edit" | "wbw";
 export type ArticleType =
@@ -29,10 +34,24 @@ export type ArticleType =
   | "textbook"
   | "exercise"
   | "exercise-list"
-  | "corpus_sent/original"
-  | "corpus_sent/commentary"
-  | "corpus_sent/nissaya"
-  | "corpus_sent/translation";
+  | "sent-original"
+  | "sent-commentary"
+  | "sent-nissaya"
+  | "sent-translation"
+  | "term";
+/**
+ * 每种article type 对应的路由参数
+ * article/id?anthology=id&channel=id1,id2&mode=ArticleMode
+ * chapter/book-para?channel=id1,id2&mode=ArticleMode
+ * para/book?par=para1,para2&channel=id1,id2&mode=ArticleMode
+ * cs-para/book-para?channel=id1,id2&mode=ArticleMode
+ * sent/id?channel=id1,id2&mode=ArticleMode
+ * sim/id?channel=id1,id2&mode=ArticleMode
+ * textbook/articleId?course=id&mode=ArticleMode
+ * exercise/articleId?course=id&exercise=id&username=name&mode=ArticleMode
+ * exercise-list/articleId?course=id&exercise=id&mode=ArticleMode
+ * sent-original/id
+ */
 interface IWidgetArticle {
   type?: ArticleType;
   id?: string;
@@ -40,6 +59,10 @@ interface IWidgetArticle {
   para?: string | null;
   channelId?: string | null;
   articleId?: string;
+  anthologyId?: string;
+  courseId?: string;
+  exerciseId?: string;
+  userName?: string;
   mode?: ArticleMode;
   active?: boolean;
   onArticleChange?: Function;
@@ -52,24 +75,23 @@ const Widget = ({
   para,
   channelId,
   articleId,
+  anthologyId,
+  courseId,
+  exerciseId,
+  userName,
   mode = "read",
   active = false,
   onArticleChange,
   onFinal,
 }: IWidgetArticle) => {
   const [articleData, setArticleData] = useState<IArticleDataResponse>();
-  const [articleMode, setArticleMode] = useState<ArticleMode>(mode);
+  const [articleMode, setArticleMode] = useState<ArticleMode>();
   const [extra, setExtra] = useState(<></>);
   const [showSkeleton, setShowSkeleton] = useState(true);
   const [unauthorized, setUnauthorized] = useState(false);
 
-  let channels: string[] = [];
-  if (typeof articleId !== "undefined") {
-    const aId = articleId.split("_");
-    if (aId.length > 1) {
-      channels = aId.slice(1);
-    }
-  }
+  const channels = channelId?.split("_");
+
   useEffect(() => {
     /**
      * 由课本进入查询当前用户的权限和channel
@@ -110,111 +132,70 @@ const Widget = ({
     if (!active) {
       return;
     }
-    setArticleMode(mode);
-    //发布mode变更
-    store.dispatch(modeChange(mode));
 
+    //发布mode变更
+    //store.dispatch(modeChange(mode));
     if (mode !== articleMode && mode !== "read" && articleMode !== "read") {
       console.log("set mode", mode, articleMode);
+      setArticleMode(mode);
       return;
     }
-
+    setArticleMode(mode);
     if (typeof type !== "undefined") {
       let url = "";
       switch (type) {
+        case "chapter":
+          if (typeof articleId !== "undefined") {
+            url = `/v2/corpus-chapter/${articleId}?mode=${mode}`;
+            url += channelId ? `&channels=${channelId}` : "";
+          }
+          break;
         case "para":
           url = `/v2/corpus?view=para&book=${book}&par=${para}&mode=${mode}`;
-          if (channelId) {
-            url += `&channel=${channelId}`;
-          }
+          url += channelId ? `&channels=${channelId}` : "";
           break;
         case "article":
           if (typeof articleId !== "undefined") {
-            const aIds = articleId.split("_");
-            url = `/v2/article/${aIds[0]}?mode=${mode}`;
-            if (aIds.length > 1) {
-              const channels = aIds.slice(1);
-              url += "&channel=" + channels.join();
-            }
+            url = `/v2/article/${articleId}?mode=${mode}`;
+            url += channelId ? `&channel=${channelId}` : "";
+            url += anthologyId ? `&anthology=${anthologyId}` : "";
           }
-
           break;
         case "textbook":
-          /**
-           * 从课本进入
-           * id两部分组成
-           * 课程id_文章id
-           */
           if (typeof articleId !== "undefined") {
-            const id = articleId.split("_");
-            if (id.length < 2) {
-              message.error("文章id期待2个，实际只给了一个");
-              return;
-            }
-            url = `/v2/article/${id[1]}?mode=${mode}&view=textbook&course=${id[0]}`;
+            url = `/v2/article/${articleId}?view=textbook&course=${courseId}&mode=${mode}`;
           }
-
           break;
         case "exercise":
-          /**
-           * 从练习进入
-           * id 由4部分组成
-           * 课程id_文章id_练习id_username
-           */
           if (typeof articleId !== "undefined") {
-            const exerciseId = articleId.split("_");
-            if (exerciseId.length < 3) {
-              message.error("练习id期待3个");
-              return;
-            }
-            console.log("exe", exerciseId);
-            url = `/v2/article/${exerciseId[1]}?mode=${mode}&course=${exerciseId[0]}&exercise=${exerciseId[2]}&user=${exerciseId[3]}`;
-
+            url = `/v2/article/${articleId}?mode=${mode}&course=${courseId}&exercise=${exerciseId}&user=${userName}`;
             setExtra(
               <ExerciseAnswer
-                courseId={exerciseId[0]}
-                articleId={exerciseId[1]}
-                exerciseId={exerciseId[2]}
+                courseId={courseId}
+                articleId={articleId}
+                exerciseId={exerciseId}
               />
             );
           }
-
           break;
         case "exercise-list":
-          /**
-           * 从练习进入
-           * id 由3部分组成
-           * 课程id_文章id_练习id
-           */
           if (typeof articleId !== "undefined") {
-            const exerciseListId = articleId.split("_");
-            if (exerciseListId.length < 3) {
-              message.error("练习id期待3个");
-              return;
-            }
-            url = `/v2/article/${exerciseListId[1]}?mode=${mode}&course=${exerciseListId[0]}&exercise=${exerciseListId[2]}`;
+            url = `/v2/article/${articleId}?mode=${mode}&course=${courseId}&exercise=${exerciseId}`;
 
             setExtra(
               <ExerciseList
-                courseId={exerciseListId[0]}
-                articleId={exerciseListId[1]}
-                exerciseId={exerciseListId[2]}
+                courseId={courseId}
+                articleId={articleId}
+                exerciseId={exerciseId}
               />
             );
           }
-
           break;
         default:
           if (typeof articleId !== "undefined") {
-            const aid = articleId.split("_");
-
             url = `/v2/corpus/${type}/${articleId}/${mode}?mode=${mode}`;
-            if (aid.length > 0) {
-              const channels = aid.slice(1).join();
-              url += `&channels=${channels}`;
-            }
+            url += channelId ? `&channel=${channelId}` : "";
           }
-
           break;
       }
       console.log("url", url);
@@ -249,17 +230,33 @@ const Widget = ({
                   console.log(keys);
                   if (
                     typeof onArticleChange !== "undefined" &&
-                    keys.length > 0 &&
-                    typeof articleId !== "undefined"
+                    keys.length > 0
                   ) {
-                    const aid = articleId.split("_");
-                    const channels =
-                      aid.length > 1 ? "_" + aid.slice(1).join("_") : undefined;
-                    onArticleChange(keys[0] + channels);
+                    onArticleChange(keys[0]);
                   }
                 }}
               />
             );
+
+            switch (type) {
+              case "chapter":
+                if (typeof articleId === "string" && channelId) {
+                  const [book, para] = articleId?.split("-");
+                  post<IViewRequest, IViewStoreResponse>("/v2/view", {
+                    target_type: type,
+                    book: parseInt(book),
+                    para: parseInt(para),
+                    channel: channelId,
+                    mode: mode,
+                  }).then((json) => {
+                    console.log("view", json.data);
+                  });
+                }
+
+                break;
+              default:
+                break;
+            }
           } else {
             setShowSkeleton(false);
             setUnauthorized(true);
@@ -270,7 +267,20 @@ const Widget = ({
           console.error(e);
         });
     }
-  }, [active, type, articleId, mode, articleMode]);
+  }, [
+    active,
+    type,
+    articleId,
+    mode,
+    articleMode,
+    book,
+    para,
+    channelId,
+    anthologyId,
+    courseId,
+    exerciseId,
+    userName,
+  ]);
 
   return (
     <div>