增加 toMeaning & 语法信息

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

@@ -6,13 +6,49 @@ import { useAppSelector } from "../../../hooks";
 import { getTerm } from "../../../reducers/term-vocabulary";
 import { IWbwRelation } from "./WbwDetailRelation";
 import { IWbw } from "./WbwWord";
+import { relationWordId } from "./WbwRelationAdd";
+import { useIntl } from "react-intl";
 const { Text } = Typography;
 
+const pureMeaning = (input: string | null | undefined) => {
+  return input
+    ? input
+        ?.replaceAll("[", "")
+        .replaceAll("]", "")
+        .replaceAll("{", "")
+        .replaceAll("}", "")
+    : "";
+};
+
 interface IWidget {
   wbwData?: IWbw[];
 }
 const RelaGraphicWidget = ({ wbwData }: IWidget) => {
   const terms = useAppSelector(getTerm);
+  const intl = useIntl();
+
+  const grammarStr = (input?: string | null) => {
+    if (!input) {
+      return "";
+    }
+    const g = input.split("#");
+    const mType = g[0].replaceAll(".", "");
+    const type = intl.formatMessage({
+      id: `dict.fields.type.${mType}.short.label`,
+      defaultMessage: mType,
+    });
+    let strGrammar: string[] = [];
+    if (g.length > 1) {
+      strGrammar = g[1].split("$").map((item, id) => {
+        const mCase = item.replaceAll(".", "");
+        return intl.formatMessage({
+          id: `dict.fields.type.${mCase}.short.label`,
+          defaultMessage: mCase,
+        });
+      });
+    }
+    return `${type}|${strGrammar.join("·")}`;
+  };
 
   //根据relation 绘制关系图
   function sent_show_rel_map(data?: IWbw[]): string {
@@ -27,14 +63,16 @@ const RelaGraphicWidget = ({ wbwData }: IWidget) => {
             const localName = terms?.find(
               (item) => item.word === relation.relation
             )?.meaning;
-            const meaning = item.meaning?.value
-              ? item.meaning?.value
-                  ?.replaceAll("[", "")
-                  .replaceAll("]", "")
-                  .replaceAll("{", "")
-                  .replaceAll("}", "")
-              : "";
-            return `${relation.sour_id}(${relation.sour_spell}<br />${meaning}) --"${relation.relation}<br />${localName}"--> ${relation.dest_id}("${relation.dest_spell}")\n`;
+            const fromMeaning = pureMeaning(item.meaning?.value);
+            const fromGrammar = grammarStr(item.case?.value);
+            //查找目标意思
+            const toWord = data.find(
+              (value: IWbw) => relationWordId(value) === relation.dest_id
+            );
+            const toMeaning = pureMeaning(toWord?.meaning?.value);
+            const toGrammar = grammarStr(toWord?.case?.value);
+
+            return `${relation.sour_id}("${relation.sour_spell}<br />${fromMeaning}<br />${fromGrammar}") --"${relation.relation}<br />${localName}"--> ${relation.dest_id}("${relation.dest_spell}<br />${toMeaning}<br />${toGrammar}")\n`;
           });
           return graphic.join("");
         } else {