1

Author: coder-sett

.env

@@ -1,7 +1,7 @@
 # Glob API URL
 VITE_GLOB_API_URL=/api
 
-VITE_APP_API_BASE_URL=http:///159.138.5.80:5610/
+VITE_APP_API_BASE_URL=http://159.138.5.80:5610/
 
 # # Whether long replies are supported, which may result in higher API fees
 # VITE_GLOB_OPEN_LONG_REPLY=false

components.d.ts

@@ -13,10 +13,13 @@ declare module 'vue' {
     ElButton: typeof import('element-plus/es')['ElButton']
     ElCarousel: typeof import('element-plus/es')['ElCarousel']
     ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem']
+    ElDialog: typeof import('element-plus/es')['ElDialog']
     ElIcon: typeof import('element-plus/es')['ElIcon']
     ElInput: typeof import('element-plus/es')['ElInput']
     ElOption: typeof import('element-plus/es')['ElOption']
     ElSelect: typeof import('element-plus/es')['ElSelect']
+    ElTable: typeof import('element-plus/es')['ElTable']
+    ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
     ElTabPane: typeof import('element-plus/es')['ElTabPane']
     ElTabs: typeof import('element-plus/es')['ElTabs']
     ElTooltip: typeof import('element-plus/es')['ElTooltip']

src/components/Bot/MessageBox.vue

@@ -2,20 +2,13 @@ import { log } from 'console';
 <script setup lang="ts">
 import { ref } from "vue"
 import { CompareItem } from "@/store"
-import BotBattle from "@/components/Bot/BotBattle.vue"
 import { useChatStore } from "@/store"
 
 const { bot } = defineProps<{ bot: CompareItem }>()
 const chatStore = useChatStore()
 chatStore.addChatSources(bot.name)
 const dataSources = chatStore.getChatByName(bot.name)
 console.log(dataSources)
-const modelA = ref<string>("")
-const activeName = ref("first")
-const showName = ref<boolean>(false)
-const handleClick = (tab: TabsPaneContext, event: Event) => {
-  console.log(tab, event)
-}
 </script>
 
 <template>
@@ -26,7 +19,9 @@ const handleClick = (tab: TabsPaneContext, event: Event) => {
     <div class="overflow-auto h-[560px]">
       <Message
         v-for="(item, index) of dataSources.chatList"
+        :botName="bot.name"
         :key="index"
+        :id="item.id"
         :date-time="item.dateTime"
         :text="item.text"
         :inversion="item.inversion"

src/components/Message/index.vue

@@ -1,39 +1,33 @@
 <script setup lang="ts">
 import { computed, ref } from "vue"
 import TextComponent from "./Text.vue"
+import { ChatLineRound } from "@element-plus/icons-vue"
 
 interface Props {
   dateTime?: string
   text?: string
   inversion?: boolean
   error?: boolean
   loading?: boolean
+  id?: string
+  botName?: string
 }
 
 interface Emit {
   (ev: "regenerate"): void
   (ev: "delete"): void
 }
 
+const showDialog = ref(false)
 const props = defineProps<Props>()
-
 const emit = defineEmits<Emit>()
-
 const textRef = ref<HTMLElement>()
-
 const asRawText = ref(props.inversion)
-
 const messageRef = ref<HTMLElement>()
-
-function handleRegenerate() {
-  messageRef.value?.scrollIntoView()
-  emit("regenerate")
-}
-
-async function handleCopy() {
-  try {
-    // await copyToClip(props.text || '')
-  } catch {}
+console.log(props.botName)
+const handleShowDialog = () => {
+  console.log(props.botName)
+  showDialog.value = true
 }
 </script>
 
@@ -55,13 +49,24 @@ async function handleCopy() {
         :loading="loading"
         :as-raw-text="asRawText"
       />
-      <!-- <div class="flex flex-col">
-        <button
-          v-if="!inversion"
-          class="mb-2 transition text-neutral-300 hover:text-neutral-800 dark:hover:text-neutral-300"
-          @click="handleRegenerate"
-        ></button>
-      </div> -->
+      <div class="flex flex-col-reverse">
+        <el-tooltip effect="dark" content="评论" placement="top">
+          <button
+            v-if="!inversion"
+            class="mb-1 ml-2 p-0 border-0 bg-white text-[#b4bbc4] transition hover:text-[#1a73e8] hover:border-0 focus:outline-0"
+            @click="handleShowDialog"
+          >
+            <ChatLineRound style="width: 16px; height: 16px" />
+          </button>
+        </el-tooltip>
+      </div>
     </div>
   </div>
+  <el-dialog v-model="showDialog">
+    <template #header="{ titleId, titleClass }">
+      <div class="my-header text-center">
+        <h3 :id="titleId" :class="titleClass">评论</h3>
+      </div>
+    </template>
+  </el-dialog>
 </template>

src/store/modules/chat/index.ts

@@ -7,6 +7,7 @@ export interface Chat {
   error?: boolean
   loading?: boolean
   conversationOptions?: null
+  id?: string
   requestOptions: { prompt: string; options?: null }
 }
 export interface ChatSources {
@@ -42,11 +43,13 @@ export const useChatStore = defineStore("chat-store", {
     },
     addChatByName(botName: string, chat: Chat) {
       const item = this.chatStoreList.find((item: ChatSources) => item.name === botName)
+      !chat.id && (chat.id = String(item?.chatList.length))
       item?.chatList.push(chat)
     },
     updateChatByName(botName: string, chat: Chat) {
       const item = this.chatStoreList.find((item: ChatSources) => item.name === botName)
       const chatList = item!.chatList
+      !chat.id && (chat.id = String(chatList.length))
       item!.chatList[chatList.length - 1] = chat
     },
     clearChat() {

src/views/ModelDetail.vue

@@ -89,7 +89,9 @@ const modelInfo = {
           <div>
             <div class="mt-6">模型类型</div>
             <div class="mt-2 flex justify-between">
-              <div class="bg-[#252525] rounded-md text-center py-2 w-32 text-[#fff]">ensorFlow</div>
+              <div class="bg-[#252525] rounded-md text-center py-2 w-32 text-[#fff]">
+                tensorFlow
+              </div>
               <div class="bg-[#252525] rounded-md text-center py-2 w-32 text-[#fff]">PyTorch</div>
               <div class="bg-[#252525] rounded-md text-center py-2 w-32 text-[#fff]">Keras</div>
             </div>