查询拆词组分

dashboard/src/components/dict/DictSearch.tsx

@@ -37,7 +37,7 @@ const Widget = ({ word, compact = false }: IWidget) => {
 
   return (
     <>
-      <DictContent data={tableData} compact={compact} />
+      <DictContent word={word} data={tableData} compact={compact} />
     </>
   );
 };

dashboard/src/components/dict/Dictionary.tsx

@@ -10,8 +10,9 @@ const { Content } = Layout;
 interface IWidget {
   word?: string;
   compact?: boolean;
+  onSearch?: Function;
 }
-const Widget = ({ word, compact = false }: IWidget) => {
+const Widget = ({ word, compact = false, onSearch }: IWidget) => {
   const navigate = useNavigate();
   const [wordSearch, setWordSearch] = useState<string>();
   const [container, setContainer] = useState<HTMLDivElement | null>(null);
@@ -20,22 +21,29 @@ const Widget = ({ word, compact = false }: IWidget) => {
     setWordSearch(word?.toLowerCase());
   }, [word]);
 
-  const onSearch = (value: string) => {
-    console.log("onSearch", value);
-    const word = value.toLowerCase();
-    setWordSearch(word);
-    if (compact === false) {
-      navigate("/dict/" + word);
-    }
-  };
   return (
     <div ref={setContainer}>
       <Affix offsetTop={0} target={compact ? () => container : undefined}>
-        <div style={{ backgroundColor: "gainsboro" }}>
+        <div
+          style={{
+            backgroundColor: "rgba(100,100,100,0.3)",
+            backdropFilter: "blur(5px)",
+          }}
+        >
           <Row style={{ paddingTop: "0.5em", paddingBottom: "0.5em" }}>
             {compact ? <></> : <Col flex="auto"></Col>}
             <Col flex="560px">
-              <SearchVocabulary onSearch={onSearch} />
+              <SearchVocabulary
+                value={word}
+                onSearch={(value: string, isFactor?: boolean) => {
+                  console.log("onSearch", value);
+                  const word = value.toLowerCase();
+                  setWordSearch(word);
+                  if (typeof onSearch !== "undefined") {
+                    onSearch(value, isFactor);
+                  }
+                }}
+              />
             </Col>
             {compact ? <></> : <Col flex="auto"></Col>}
           </Row>