Merge pull request #1224 from visuddhinanda/agile

wbw relation 改用新版json数据

dashboard/src/components/article/ArticleDrawer.tsx

@@ -1,5 +1,6 @@
-import { Drawer } from "antd";
+import { Button, Drawer, Space } from "antd";
 import React, { useEffect, useState } from "react";
+import { Link } from "react-router-dom";
 
 import Article, { ArticleMode, ArticleType } from "./Article";
 
@@ -36,11 +37,23 @@ const ArticleDrawerWidget = ({
 
   const onDrawerClose = () => {
     setOpenDrawer(false);
+    if (document.getElementsByTagName("body")[0].hasAttribute("style")) {
+      document.getElementsByTagName("body")[0].removeAttribute("style");
+    }
     if (typeof onClose !== "undefined") {
       onClose();
     }
   };
 
+  const getUrl = (openMode?: string): string => {
+    let url = `/article/${type}/${articleId}?mode=`;
+    url += openMode ? openMode : mode ? mode : "read";
+    url += channelId ? `&channel=${channelId}` : "";
+    url += book ? `&book=${book}` : "";
+    url += para ? `&par=${para}` : "";
+    return url;
+  };
+
   return (
     <>
       <span onClick={() => showDrawer()}>{trigger}</span>
@@ -51,6 +64,16 @@ const ArticleDrawerWidget = ({
         onClose={onDrawerClose}
         open={openDrawer}
         destroyOnClose={true}
+        extra={
+          <Space>
+            <Button>
+              <Link to={getUrl()}>在单页面中打开</Link>
+            </Button>
+            <Button>
+              <Link to={getUrl("edit")}>翻译模式</Link>
+            </Button>
+          </Space>
+        }
       >
         <Article
           active={true}

dashboard/src/components/channel/ChapterInChannelList.tsx

@@ -9,6 +9,7 @@ import { DeleteOutlined } from "@ant-design/icons";
 import { get } from "../../request";
 
 import { IChapterListResponse } from "../../components/api/Corpus";
+import { IArticleParam } from "../../pages/studio/recent/list";
 
 const { Text } = Typography;
 
@@ -27,9 +28,9 @@ interface IItem {
 }
 interface IWidget {
   channelId?: string;
-  onChange?: Function;
+  onSelect?: Function;
 }
-const ChpaterInChannelListWidget = ({ channelId, onChange }: IWidget) => {
+const ChpaterInChannelListWidget = ({ channelId, onSelect }: IWidget) => {
   const intl = useIntl();
 
   return (
@@ -56,16 +57,22 @@ const ChpaterInChannelListWidget = ({ channelId, onChange }: IWidget) => {
             return (
               <div key={index}>
                 <div key={1}>
-                  <Link
-                    to={
-                      `/article/chapter/${row.book}-${row.paragraph}` +
-                      channelId
-                        ? `?channel=${channelId}`
-                        : ""
-                    }
+                  <Button
+                    type="link"
+                    onClick={(event) => {
+                      if (typeof onSelect !== "undefined") {
+                        const chapter: IArticleParam = {
+                          type: "chapter",
+                          articleId: `${row.book}-${row.paragraph}`,
+                          mode: "read",
+                          channelId: channelId,
+                        };
+                        onSelect(event, chapter);
+                      }
+                    }}
                   >
                     {row.title ? row.title : row.subTitle}
-                  </Link>
+                  </Button>
                 </div>
                 <Text type="secondary" key={2}>
                   {row.subTitle}
@@ -148,18 +155,7 @@ const ChpaterInChannelListWidget = ({ channelId, onChange }: IWidget) => {
                   },
                 }}
               >
-                <Link
-                  to={
-                    `/article/chapter/${row.book}-${row.paragraph}/edit` +
-                    channelId
-                      ? `?channel=${channelId}`
-                      : ""
-                  }
-                >
-                  {intl.formatMessage({
-                    id: "buttons.edit",
-                  })}
-                </Link>
+                <></>
               </Dropdown.Button>,
             ];
           },

dashboard/src/components/template/SentEdit/SentCell.tsx

@@ -34,8 +34,6 @@ const SentCellWidget = ({
   const endings = useAppSelector(getEnding);
   const acceptPr = useAppSelector(sentence);
 
-  console.log("edit mode", editMode);
-
   useEffect(() => {
     setSentData(data);
   }, [data]);
@@ -71,7 +69,6 @@ const SentCellWidget = ({
           }
         }}
         onConvert={(format: string) => {
-          console.log("format", format);
           switch (format) {
             case "json":
               const wbw: IWbw[] = data.content.split("\n").map((item, id) => {

dashboard/src/components/template/SentEdit/SentContent.tsx

@@ -50,7 +50,6 @@ const SentContentWidget = ({
 
   useEffect(() => {
     const width = divShell.current?.offsetWidth;
-    console.log("settings", width);
     if (width && width < 550) {
       setLayoutDirection("column");
       return;
@@ -86,7 +85,6 @@ const SentContentWidget = ({
   useLayoutEffect(() => {
     const width = divShell.current?.offsetWidth;
     setDivShellWidth(width);
-    console.log("width", width);
     if (width && width < 550) {
       setLayoutDirection("column");
       return;

dashboard/src/components/template/Wbw/WbwDetail.tsx

@@ -126,7 +126,7 @@ const WbwDetailWidget = ({
             children: (
               <div>
                 <WbwDetailBasic
-                  data={data}
+                  data={currWbwData}
                   onChange={(e: IWbwField) => {
                     console.log("WbwDetailBasic onchange", e);
                     fieldChanged(e.field, e.value);

dashboard/src/components/template/Wbw/WbwDetailRelation.tsx

@@ -62,17 +62,48 @@ const WbwDetailRelationWidget = ({ data, onChange, onAdd }: IWidget) => {
   }, [data.relation]);
 
   useEffect(() => {
-    const caseEnd = data.case?.value?.split("$");
-    if (typeof caseEnd === "undefined") {
+    let grammar = data.case?.value
+      ?.replace("#", "$")
+      .replaceAll(".", "")
+      .split("$");
+    if (data.grammar2?.value) {
+      if (grammar) {
+        grammar = [data.grammar2?.value, ...grammar];
+      } else {
+        grammar = [data.grammar2?.value];
+      }
+    }
+    console.log("grammar", grammar);
+    if (typeof grammar === "undefined") {
       return;
     }
     const mRelation = relations
-      ?.filter(
-        (value) =>
-          value.case === caseEnd[caseEnd.length - 1].replaceAll(".", "") ||
-          value.case === "" ||
-          value.case === null
-      )
+      ?.filter((value) => {
+        let caseMatch = true;
+        let spellMatch = true;
+        if (!value.from) {
+          return false;
+        }
+        if (value.from?.case) {
+          let matchCount = 0;
+          if (grammar) {
+            for (const iterator of value.from.case) {
+              if (grammar?.includes(iterator)) {
+                matchCount++;
+              }
+            }
+          }
+          if (matchCount !== value.from.case.length) {
+            caseMatch = false;
+          }
+        }
+        if (value.from?.spell) {
+          if (data.real.value !== value.from?.spell) {
+            spellMatch = false;
+          }
+        }
+        return caseMatch && spellMatch;
+      })
       .map((item) => {
         const localName = terms?.find(
           (term) => term.word === item.name
@@ -88,7 +119,13 @@ const WbwDetailRelationWidget = ({ data, onChange, onAdd }: IWidget) => {
         };
       });
     setOptions(mRelation);
-  }, [data.case?.value, relations, terms]);
+  }, [
+    data.case?.value,
+    data.grammar2?.value,
+    data.real.value,
+    relations,
+    terms,
+  ]);
   return (
     <List
       itemLayout="vertical"

dashboard/src/load.ts

@@ -130,6 +130,7 @@ const init = () => {
           id: item.id,
           name: item.name,
           case: item.case,
+          from: item.from,
           to: item.to,
         };
       });

dashboard/src/pages/studio/channel/show.tsx

@@ -11,12 +11,16 @@ import TermList from "../../../components/term/TermList";
 import ShareModal from "../../../components/share/ShareModal";
 import { useIntl } from "react-intl";
 import { EResType } from "../../../components/share/Share";
+import { IArticleParam } from "../recent/list";
+import ArticleDrawer from "../../../components/article/ArticleDrawer";
 
 const Widget = () => {
   const { channelId } = useParams(); //url 参数
   const { studioname } = useParams();
   const [title, setTitle] = useState("");
   const intl = useIntl();
+  const [articleOpen, setArticleOpen] = useState(false);
+  const [param, setParam] = useState<IArticleParam>();
 
   useEffect(() => {
     get<IApiResponseChannel>(`/v2/channel/${channelId}`).then((json) => {
@@ -48,7 +52,31 @@ const Widget = () => {
           {
             label: `chapter`,
             key: "chapter",
-            children: <ChapterInChannelList channelId={channelId} />,
+            children: (
+              <ChapterInChannelList
+                channelId={channelId}
+                onSelect={(
+                  event: React.MouseEvent<HTMLElement, MouseEvent>,
+                  chapter: IArticleParam
+                ) => {
+                  if (event.ctrlKey || event.metaKey) {
+                    let url = `/article/${chapter.type}/${chapter.articleId}?mode=`;
+                    url += chapter?.mode ? chapter?.mode : "read";
+                    url += chapter?.channelId
+                      ? `&channel=${chapter.channelId}`
+                      : "";
+                    const fullUrl =
+                      process.env.REACT_APP_WEB_HOST +
+                      process.env.PUBLIC_URL +
+                      url;
+                    window.open(fullUrl, "_blank");
+                  } else {
+                    setParam(chapter);
+                    setArticleOpen(true);
+                  }
+                }}
+              />
+            ),
           },
           {
             label: `term`,
@@ -57,6 +85,11 @@ const Widget = () => {
           },
         ]}
       />
+      <ArticleDrawer
+        {...param}
+        open={articleOpen}
+        onClose={() => setArticleOpen(false)}
+      />
     </Card>
   );
 };

dashboard/src/pages/studio/recent/list.tsx

@@ -41,7 +41,7 @@ interface IRecent {
   updatedAt: string;
   param?: IParam;
 }
-interface IArticleParam {
+export interface IArticleParam {
   type: ArticleType;
   articleId: string;
   mode?: ArticleMode;