From c21adb7b5df5862a80f64bf2fab56472a84b4d77 Mon Sep 17 00:00:00 2001
From: ltyzzz <ltyzzz2000@gmail.com>
Date: Wed, 14 Jun 2023 00:33:36 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A7=20GPT=20=E8=AF=B7=E6=B1=82?=
 =?UTF-8?q?=E8=BF=87=E7=A8=8B=E4=B8=AD=E4=B8=8D=E5=8F=AF=E8=BE=93=E5=85=A5?=
 =?UTF-8?q?=E5=91=BD=E4=BB=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/gpt-terminal/ContentOutput.vue | 16 +++++++++++-
 src/components/gpt-terminal/GptTerminal.vue   | 25 ++++++++++++++++++-
 src/core/commands/gpt/subCommands/ChatBox.vue |  6 ++++-
 3 files changed, 44 insertions(+), 3 deletions(-)

diff --git a/src/components/gpt-terminal/ContentOutput.vue b/src/components/gpt-terminal/ContentOutput.vue
index 0501f1a..9520547 100644
--- a/src/components/gpt-terminal/ContentOutput.vue
+++ b/src/components/gpt-terminal/ContentOutput.vue
@@ -7,6 +7,8 @@
       <span v-if="output.type === 'text'" v-html="smartText(output.text)" />
     </template>
     <component
+      @start="handleStart"
+      @finish="handleFinish"
       :is="output.component"
       v-if="output.type === 'component'"
       v-bind="output.props ?? {}"
@@ -17,7 +19,7 @@
 <script setup lang="ts">
 import smartText from "../../utils/smartText";
 import OutputType = GptTerminal.OutputType;
-import { computed, toRefs } from "vue";
+import { computed, toRefs, defineEmits } from "vue";
 
 interface OutputProps {
   output: OutputType;
@@ -44,6 +46,18 @@ const outputTagColor = computed((): string => {
       return "";
   }
 });
+
+const emit = defineEmits(['start', 'finish'])
+
+// gpt 输出开始时的回调
+const handleStart = () => {
+  emit('start')
+}
+
+// gpt 输出结束后的回调
+const handleFinish = () => {
+  emit('finish')
+}
 </script>
 
 <style scoped>
diff --git a/src/components/gpt-terminal/GptTerminal.vue b/src/components/gpt-terminal/GptTerminal.vue
index 18679f3..1714c95 100644
--- a/src/components/gpt-terminal/GptTerminal.vue
+++ b/src/components/gpt-terminal/GptTerminal.vue
@@ -26,7 +26,7 @@
                 <span>{{ output.text }}</span>
               </div>
               <div v-for="(result, idx) in output?.resultList" :key="idx" class="terminal-row">
-                <content-output :output="result" />
+                <content-output @start="handleStart" @finish="handleFinish" :output="result" />
               </div>
             </template>
             <!-- 打印信息 -->
@@ -182,6 +182,18 @@ const doSubmitCommand = async () => {
   isRunning.value = false;
 };
 
+// 处理 GPT 请求开始时的操作
+const handleStart = () => {
+  console.log("gpt 请求开始")
+  isRunning.value = true
+}
+
+// 处理 GPT 请求结束后的操作
+const handleFinish = () => {
+  console.log("gpt 请求结束")
+  isRunning.value = false
+}
+
 // 输入框内容改变时，触发输入提示
 watchEffect(() => {
   debounceSetHint(inputCommand.value.text);
@@ -194,6 +206,17 @@ const prompt = computed(() => {
   return `[${user.value.username}]$`;
 });
 
+/**
+ * 命令样式
+ */
+const commandInputClass = () => {
+  const classNames = ['command-input'];
+  if (inputCommand.value.text.includes(' ')) {
+    classNames.push('white-background-text');
+  }
+  return classNames.join(' ');
+}
+
 /**
  * 终端主样式
  */
diff --git a/src/core/commands/gpt/subCommands/ChatBox.vue b/src/core/commands/gpt/subCommands/ChatBox.vue
index 8eae688..272b1d4 100644
--- a/src/core/commands/gpt/subCommands/ChatBox.vue
+++ b/src/core/commands/gpt/subCommands/ChatBox.vue
@@ -3,7 +3,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted, toRefs, ref } from "vue";
+import { computed, onMounted, toRefs, ref, defineEmits } from "vue";
 import { marked } from 'marked'
 import hljs from "highlight.js";
 
@@ -36,10 +36,13 @@ const result = computed(() => {
   return marked(output.value)
 })
 
+const emit = defineEmits(['start', 'finish']);
+
 onMounted(async () => {
   console.log("message -", message)
   console.log("role -", role)
 
+  emit('start')
   const response = await fetch('http://127.0.0.1:7345/api/gpt/get', {
     method: "POST",
     headers: {
@@ -60,6 +63,7 @@ onMounted(async () => {
     console.log("received data -", value)
     output.value += value?.replace('undefined', '')
   }
+  emit('finish')
 });
 </script>