生成代码时，code编辑页面会显示加载中

app/src/main/windows.ts

@@ -16,7 +16,7 @@ export const config = {
             initShow: true,
             width: 1300,
             height: 700,
-            openDevTools: false,
+            openDevTools: true,
             frame: true,
             transparent: false,
             hash: '/#config/category/contentList'
@@ -68,6 +68,7 @@ export const getWindowByEvent = (event: IpcMainEvent | IpcMainInvokeEvent) => {
 
 app.whenReady().then(() => {
     getWindowByName('search')
+    
     // getWindowByName('code')
     // getWindowByName('config')
 

app/src/renderer/src/components/Chat/index.tsx

@@ -1,13 +1,11 @@
-import { ProChat, ProChatInstance, ProChatProvider } from '@ant-design/pro-chat';
+import { ProChat } from '@ant-design/pro-chat';
 import useChat from '@renderer/hooks/useChat';
 import { useStore } from '@renderer/store/useStore';
 import { useTheme } from 'antd-style';
-import { useRef } from 'react';
 export default function Chat(props: {id: number, revalidator: () => void}) {
   const {id, revalidator} = props;
   const {getResponse} = useChat()
   const theme = useTheme();
-  const proChatRef = useRef<ProChatInstance>();
   const chatMessages = useStore(state=>state.chatMessages)
   const setMessages = useStore(state=>state.setChatMessage)
   return (
@@ -17,7 +15,6 @@ export default function Chat(props: {id: number, revalidator: () => void}) {
           console.log('chat', chat)
           setMessages(chat)
         }}
-        chatRef={proChatRef}
         style={{ background: theme.colorBgLayout }}
         // assistantMeta={{ avatar: '', title: '智子', backgroundColor: '#67dedd' }}
         helloMessage={
@@ -25,7 +22,7 @@ export default function Chat(props: {id: number, revalidator: () => void}) {
         }
   
         request={async (messages) => {
-            const response = await getResponse(messages, id, proChatRef.current, revalidator)
+            const response = await getResponse(messages, id, revalidator)
             return response// 支持流式和非流式
     }}
   />

app/src/renderer/src/components/CodeEditor/index.tsx

@@ -1,9 +1,10 @@
 import CodeMirror from '@uiw/react-codemirror';
 import { python } from '@codemirror/lang-python';
-import { Drawer, FloatButton } from 'antd';
+import { Drawer, FloatButton, Spin } from 'antd';
 import { QuestionCircleOutlined } from '@ant-design/icons';
 import Chat from '@renderer/components/Chat';
 import "./codeEditor.scss"
+import { useStore } from '@renderer/store/useStore';
 interface CodeEditorProps {
   id: number;
   defaultValue: string;
@@ -14,6 +15,7 @@ interface CodeEditorProps {
 }
 export default function CodeEditor(props: CodeEditorProps) {
   const { id, defaultValue, revalidator, open, setOpen} = props;
+  const isCodeLoading = useStore(state => state.isCodeLoading)
   return (
     <div>
         <FloatButton icon={<QuestionCircleOutlined />} type="primary" onClick={() => {
@@ -32,7 +34,7 @@ export default function CodeEditor(props: CodeEditorProps) {
         }}>
            <Chat id={id} revalidator={revalidator}/>
       </Drawer>
-
+      <Spin spinning={isCodeLoading} tip="根据自动化方案生成代码中，请稍等...">
       <CodeMirror
         maxHeight='550px'
         className='code-mirror'
@@ -49,6 +51,7 @@ export default function CodeEditor(props: CodeEditorProps) {
         }}
         extensions={[python()]}
       />
+      </Spin>
     </div>
   );
 };

app/src/renderer/src/hooks/useChat.ts

@@ -1,9 +1,11 @@
+import { useStore } from "@renderer/store/useStore";
 import { requireAlignmentPrompt, programmerPrompt} from "./prompt";
 import useOpenai from "./useOpenai";
-import { ProChatInstance } from "@ant-design/pro-chat";
 
 export  default ()=>{
-  const getResponse=(chat_messages: Array<any>, id:number, proChatRef: ProChatInstance|undefined, revalidator: () => void)=>{
+  const setIsCodeLoading = useStore(state => state.setIsCodeLoading)
+
+  const getResponse=(chat_messages: Array<any>, id:number, revalidator: () => void)=>{
   const messages = chat_messages.map((m) => {
     return {
       role: m.role, 
@@ -17,29 +19,23 @@ export  default ()=>{
     content: requireAlignmentPrompt()
   });
   const response = useOpenai(requireAlignmentPrompt(), messages, (allContent)=>{
-    const programmerCallBack = (chat_id: string, allContent: string) => {  
-      allContent = allContent.replace(/^```python/, "").  replace(/^```/, "").replace(/```$/, "").trim()
+    const programmerCallBack = (allContent: string) => {  
+      allContent = allContent.replace(/^```python/, "").replace(/^```/, "").replace(/```python$/, "").replace(/```$/, "").trim()
       window.api.sql('update contents set content = @content where id = @id', 
       'update', 
       {content: allContent, id})
-      proChatRef!.setMessageContent(chat_id, "代码已经生成完毕！")
+      // 更新数据
       revalidator()
-
+      // 关闭loading
+      setIsCodeLoading(false)
   }
   if (allContent.includes("【自动化方案】")) {
-    const chat_id = Date.now().toString()
-    proChatRef!.pushChat({
-      id: chat_id,
-      createAt: Date.now(),
-      updateAt: Date.now(),
-      role: "assistant",
-      content: "请稍等，我正在生成自动化代码..."
-    })
+    setIsCodeLoading(true)
     useOpenai(programmerPrompt(), [{
       role: "user",
       content: allContent
     }], (allContent)=>{
-      programmerCallBack(chat_id, allContent)
+      programmerCallBack(allContent)
     })
   } else {
     console.log("Response does not contain '【自动化方案】'");

app/src/renderer/src/store/useStore.ts

@@ -12,7 +12,9 @@ interface StateProps{
     editCategoryId: number,
     setEditCategoryId: (id: number) => void,
     chatMessages: ChatMessage<Record<string, any>>[],
-    setChatMessage: (chatMessage: ChatMessage<Record<string, any>>[]) => void
+    setChatMessage: (chatMessage: ChatMessage<Record<string, any>>[]) => void,
+    isCodeLoading: boolean,
+    setIsCodeLoading: (isCodeLoading: boolean) => void
 }
 export const useStore = create<StateProps>((set) => ({
     data: [],
@@ -26,7 +28,9 @@ export const useStore = create<StateProps>((set) => ({
     editCategoryId: 0,
     setEditCategoryId: (editCategoryId) => set({editCategoryId}),
     chatMessages: [],
-    setChatMessage: (chatMessages) => set({chatMessages})
+    setChatMessage: (chatMessages) => set({chatMessages}),
+    isCodeLoading: false,
+    setIsCodeLoading: (isCodeLoading) => set({isCodeLoading})
   }))