引入本地大模型分析文件

package.json

@@ -15,10 +15,13 @@
     "@ant-design/icons": "^5.3.7",
     "@tauri-apps/api": "^1.5.6",
     "antd": "^5.17.4",
+    "axios": "*",
     "clsx": "^2.1.1",
     "dayjs": "^1.11.11",
+    "qs": "*",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
+    "react-markdown": "^9.0.1",
     "react-router": "^6.23.1",
     "react-router-dom": "^6.23.1",
     "tauri-plugin-sql-api": "https://gitee.com/seamong/tauri-plugin-sql.git#v1"

src/Router.tsx

@@ -21,10 +21,12 @@ import DuplicateFileInfo from "@/pages/DuplicateFile/FileInfo";
 import CalculateListPage from "@/pages/DuplicateFile/CalculateListPage";
 import ManageDuplicateFiles from "@/pages/DuplicateFile/ManageDuplicateFiles";
 import FilesManage from "@/pages/DuplicateFile/FilesManage";
+import ChatPage from "@/pages/Chat/Chat";
 
 /* 收藏夹管理 */
 import BookmarksIndex from "@/pages/Bookmarks/List";
 import BookmarksList from "@/pages/Bookmarks/List";
+import Chat from "@/pages/Chat/Chat";
 /* export default function Router() {
   return (
     <Routes>
@@ -109,6 +111,10 @@ const router = createBrowserRouter(
           path: "file-clear",
           element: <FileClear />,
         },
+        {
+          path: "chat",
+          element: <ChatPage />,
+        }
         // {
         //   path: "duplicate-file",
         //   element: <DuplicateFileIndex />,

src/components/Layout/breadcrumbManage.tsx

@@ -71,4 +71,10 @@ export default ({
       calculateFn({ title: "管理文件", isCallBack: false }),
     ]);
   }
+  // 聊天 的面包屑配置
+  if (/^\/chat/.test(location.pathname)) {
+    setPlaceholder([
+      calculateFn({ title: "chat", isCallBack: false }),
+    ]);
+  }
 };

src/components/Menu/Menu.tsx

@@ -36,6 +36,10 @@ export default function Menu() {
           label: "文件管理",
           path: "/",
         },
+        {
+          label: "chat",
+          path: "/chat",
+        },
       ],
     },
     {

src/pages/Chat/Chat.tsx

@@ -0,0 +1,81 @@
+import {Input, Button, Spin} from "antd";
+import {useEffect, useState} from "react";
+import axios from "axios";
+import Markdown from 'react-markdown'
+
+export default function Chat() {
+    const [inputText, setInputText] = useState('')
+    const [assistantMsg, setAssistantMsg] = useState<any>({})
+    const [messages, setMessages] = useState<any>([])
+
+    const [loading, setLoading] = useState(false)
+    const [spinTip, setSpinTip] = useState('')
+
+    function InputChange(e: any) {
+        console.log(15, e.target.value)
+        setInputText(e.target.value)
+    }
+
+    async function getText() {
+        setLoading(true)
+        const _messages = [...messages]
+        _messages.push(
+            {
+                "role": "user",
+                "content": `${inputText}`
+            }
+        )
+        const res = await axios.post('http://localhost:11434/api/chat', {
+            // glm4 gemma2 llama3.1
+                "model": "gemma2",
+                "messages": _messages,
+                "stream": false
+            },
+            {
+                headers: {
+                    // Overwrite Axios's automatically set Content-Type
+                    'Content-Type': 'application/json'
+                }
+            })
+        // const setMessages
+        console.log(29, res.data);
+        setAssistantMsg(res.data.message);
+        _messages.push(res.data.message);
+        console.log(43, _messages);
+        setMessages(_messages)
+        setLoading(false)
+        /*if (res && res?.data) {
+            const messageData = qs.parse(res.data)
+            Object.keys(messageData).forEach(key => {
+                console.log(24, qs.parse(key));
+            })
+        }*/
+    }
+
+    return <Spin spinning={loading} tip={spinTip}>
+        <div style={{
+            padding: '24px'
+        }}>
+            <h3>Chat</h3>
+            <div>
+                {/*value={inputText}*/}
+                <Input onChange={InputChange} allowClear={true} showCount={true} ></Input>
+                <div style={{
+                    padding: '24px 0'
+                }}>
+                    {
+                        messages.length > 0 && messages.map((item:any) => (
+                            <div>
+                                <div>user: {item.role}</div>
+                                <div>
+                                    <Markdown>{item.content}</Markdown>
+                                </div>
+                            </div>
+                        ))
+                    }
+                </div>
+                <Button onClick={() => getText()}>获取</Button>
+            </div>
+        </div>
+    </Spin>
+}