copilot助手完成

ui/packages/ai/AiCopilot.vue

@@ -5,26 +5,27 @@ import ThinkingBar from "./components/thinkingBar.vue";
 export default {
   name: "AiCopilot",
   props: {
+    http: Function,
     title: {default: "Copilot小助理"}
   },
   data() {
     return {
       show: false,
       expand: false,
-      loading: true,
+      loading: false,
       prompt: "",
       history: [
-        {avatar: "https://cdn.sinoecare.com/i/2024/06/04/665ec6f5ef213.png", msg: "你好", uid: "ai"},
-        {
-          avatar: "",
-          msg: "AI 聊天机器人 ChatGPT 近日突然出现闪崩，响应超时或无法正常工作，故障长达近 7 小时。全球大量用户处于焦虑等待，因为许多人对此已经产生了依赖，工作不能自理。一些备选工具如 Perplexity、Claude 等也遭遇故障。摩根士丹利的数据显示，ChatGPT 故障后，谷歌 AI 聊天机器人 Gemini 搜索量激增 60%，达 327058 次，显示出用户把它视为 ChatGPT 的直接替代选项\n" +
-              "\n" +
-              "作者：RTE开发者社区\n" +
-              "链接：https://juejin.cn/post/7377025870630862874\n" +
-              "来源：稀土掘金\n" +
-              "著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。",
-          uid: "me"
-        },
+        // {avatar: "https://cdn.sinoecare.com/i/2024/06/04/665ec6f5ef213.png", msg: "你好", uid: "ai"},
+        // {
+        //   avatar: "",
+        //   msg: "AI 聊天机器人 ChatGPT 近日突然出现闪崩，响应超时或无法正常工作，故障长达近 7 小时。全球大量用户处于焦虑等待，因为许多人对此已经产生了依赖，工作不能自理。一些备选工具如 Perplexity、Claude 等也遭遇故障。摩根士丹利的数据显示，ChatGPT 故障后，谷歌 AI 聊天机器人 Gemini 搜索量激增 60%，达 327058 次，显示出用户把它视为 ChatGPT 的直接替代选项\n" +
+        //       "\n" +
+        //       "作者：RTE开发者社区\n" +
+        //       "链接：https://juejin.cn/post/7377025870630862874\n" +
+        //       "来源：稀土掘金\n" +
+        //       "著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。",
+        //   uid: "me"
+        // },
       ]
     }
   },
@@ -33,9 +34,43 @@ export default {
   },
   components: {ThinkingBar, ChatContent},
   methods: {
+    getHistory(cb) {
+      this.http.post("/app/appaicopilotinfo/list").then(res => {
+        if (res?.data) {
+          if (cb) cb(res.data.records)
+          else this.history = res.data.records
+        }
+      })
+    },
+    handleHotkey(evt) {
+      if (evt.ctrlKey && evt.key == "Enter") {
+        this.handleSend()
+      }
+    },
     handleSend() {
-
+      const concatenateStr = (content, i = 0) => {
+        this.history.at(-1).content += content.slice(i, i + 1)
+        if (++i < content.length) setTimeout(() => concatenateStr(content, i), 50)
+      }
+      this.$debounce(() => {
+        const message = {appType: "2", userType: 0, content: this.prompt}
+        this.history.push(message)
+        this.loading = true
+        this.prompt = ""
+        this.http.post("/app/appaicopilotinfo/add", message).then(res => {
+          if (res?.data?.length >= 2) {
+            const last = res.data.at(-1)
+            this.history.push({...last, content: ""})
+            concatenateStr(last.content)
+          }
+        }).finally(() => {
+          this.loading = false
+        })
+      }, 100)
     }
+  },
+  created() {
+    this.getHistory()
   }
 }
 </script>
@@ -55,7 +90,7 @@ export default {
           <chat-content class="fill" :list="history"/>
           <div class="sendBox flex gap-14">
             <el-input type="textarea" class="fill input" autosize resize="none" v-model="prompt" placeholder="请输入..."
-                      @change="handleSend"/>
+                      @keydown.native="handleHotkey" :disabled="loading" :placeholder="loading?'正在思考中...':'请输入'"/>
             <div class="sendBtn" @click="handleSend"/>
           </div>
         </div>
@@ -134,7 +169,7 @@ export default {
       .right {
         width: 420px;
         height: 100%;
-        padding: 14px;
+        padding: 14px 0 14px 14px;
         align-items: stretch;
         border-left: 1px solid transparent;
 
@@ -154,6 +189,7 @@ export default {
 
       :deep(.sendBox) {
         width: 100%;
+        padding-right: 14px;
 
         .input > textarea {
           width: 100%;