1

.env

@@ -1,7 +1,7 @@
 VITE_OPENAI_API_KEY_TONG=sk-e9855234f47346049809ce23ed3ebe3f
 
 VITE_MAX_FILE_NUMBER=10
-VITE_APP_BASE_API='http://192.168.1.166:5555'
+VITE_APP_BASE_API='http://192.168.1.5:8000'
 #VITE_APP_BASE_API='http://192.168.1.166:5555'
 
 # 接口地址 (WebSocket) 

src/entrypoints/sidepanel/AdvancedMode.vue

@@ -26,7 +26,12 @@
                 :finish="message.finish"
                 :steps="message.steps"
                  />
-                 
+                 <StepsRun 
+                v-if="message.type === 'run'"
+                :content="message.content"
+                :finish="message.finish"
+                :steps="message.steps"
+                 />
                 <span v-else v-html="message.content"></span>
                 <span class="loading-indicator" v-if="sendLoading && index === messages.length - 1">
                   <span class="dot"></span>
@@ -130,6 +135,7 @@ import { useMsg } from '@/entrypoints/sidepanel/hook/useMsg.ts'
 import document from '@/entrypoints/sidepanel/component/document.vue'
 import ScrollToBottom from '@/entrypoints/sidepanel/component/ScrollToBottom.vue'
 import StepsDisplay from './component/StepsDisplay.vue'
+import StepsRun from './component/StepsRun.vue'
 import userAvatar from '@/assets/images/user.png'
 import avatar from '@/public/icon/icon.png'
 import { FunctionList } from '@/entrypoints/sidepanel/mock'
@@ -310,6 +316,7 @@ async function handleAsk(value) {
   createWS(msg)
 }
 let planMsg 
+let runMsg 
 /**
  *
  * @param msg 用户消息对象，调用askQues时需要
@@ -320,7 +327,7 @@ async function createWS(msg) {
     type: '',
     rawContent: '',
     senderId: -1,
-    receiverId: userStore.userInfo.id, //大模型
+    receiverId: userStore.userInfo.id,
     content: [],
     sortKey: moment().valueOf(),
     role: 'system',
@@ -349,13 +356,30 @@ async function createWS(msg) {
       nextTick(() => {
     if (scrollbar.value && scrollbar.value.wrapRef) {
       scrollbar.value.setScrollTop(scrollbar.value.wrapRef.scrollHeight)
-    }
+        }
+            const obj = runMsg  = reactive({
+        type: 'run',
+        rawContent: '',
+        senderId: -1,
+        receiverId: userStore.userInfo.id,
+        content: [],
+        sortKey: moment().valueOf(),
+        role: 'system',
+        conversationId: msgUuid.value
+            })
+         messages.value.push(obj)
+      // runMsg.content.push(message.payload)
+      nextTick(() => {
+          if (scrollbar.value && scrollbar.value.wrapRef) {
+            scrollbar.value.setScrollTop(scrollbar.value.wrapRef.scrollHeight)
+          }
+        })
   })
       chrome.runtime.sendMessage({
         type: "FROM_PLAN",
         payload: {params,...res.data.plan},}, function (response) {
         console.log(response, 123344);
-      planMsg.finish = response.status
+      runMsg.finish = response.status
     });
     }).catch(res => {
       obj.rawContent = '接口出错，请重试。'
@@ -372,12 +396,12 @@ onMounted(async () => {
   chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
     if (message.type == 'FROM_STEP') {
       console.log(message);
-      planMsg.content.push(message.payload)
+      runMsg.content.push(message.payload)
       nextTick(() => {
-    if (scrollbar.value && scrollbar.value.wrapRef) {
-      scrollbar.value.setScrollTop(scrollbar.value.wrapRef.scrollHeight)
-    }
-  })
+          if (scrollbar.value && scrollbar.value.wrapRef) {
+            scrollbar.value.setScrollTop(scrollbar.value.wrapRef.scrollHeight)
+          }
+        })
   }
     if (message.type === 'TO_SIDE_PANEL_PAGE_INFO') {
       pageInfo.value = message.data

src/entrypoints/sidepanel/component/Login.vue

@@ -6,7 +6,7 @@
         </div>
         <div class="login-tabs">
             <div class="tab" :class="{ active: activeTab === 'phone' }" @click="activeTab = 'phone'">手机号登录</div>
-            <div class="tab" :class="{ active: activeTab === 'wechat' }" @click="activeTab = 'wechat'">微信登录</div>
+            <!-- <div class="tab" :class="{ active: activeTab === 'wechat' }" @click="activeTab = 'wechat'">微信登录</div> -->
         </div>
 
         <div class="login-content">

src/entrypoints/sidepanel/component/StepsDisplay.vue

@@ -1,12 +1,13 @@
 <template>
   <div class="min-w-60">
     <div  class="steps-content">
+      <div class=" font-semibold">规划</div>
       <div class="mb-2">
         <div class="text-x" v-for="step,i in props.steps" :key="step.id">
-        {{ `步骤${i + 1}：`  +  step.description }}
+        {{ `${i + 1}：`  +  step.description }}
       </div>
       </div>
-      <div class="my-4 ml-8">
+      <!-- <div class="my-4 ml-8">
         <div class="text-xs break-all mb-0.5" v-for="action,index in props.content" :key="index">
         {{ actionMap[action.action]?.text && actionMap[action.action].text + '：'+ action[actionMap[action.action].valueKey]}} 
       </div>
@@ -14,7 +15,7 @@
       <div v-if="props.finish">{{props.finish === '1' ? '执行完成' : '执行出错'}}</div>
       <el-progress v-else :show-text="false" class="w-full !h-0.5 overflow-hidden"  :percentage="100"
       :indeterminate="true"
-      :duration="2"/>
+      :duration="2"/> -->
     </div>
   </div>
 </template>
@@ -28,22 +29,22 @@ onMounted(() => {
 })
 
 const props = defineProps({
-  content: {
-    type:Array,
-    required: true
-  },
-  finish: {
-    type: String,
-    request:true
-  }, 
+  // content: {
+  //   type:Array,
+  //   required: true
+  // },
+  // finish: {
+  //   type: String,
+  //   request:true
+  // }, 
   steps: {
     type:Array,
     required: true
   },
-  title: {
-    type: String,
-    request:true
-  }
+  // title: {
+  //   type: String,
+  //   request:true
+  // }
 })
 
 </script>

src/entrypoints/sidepanel/component/StepsRun.vue

@@ -0,0 +1,55 @@
+<template>
+  <div class="min-w-60">
+    <div  class="steps-content">
+      <!-- <div class="mb-2">
+        <div class="text-x" v-for="step,i in props.steps" :key="step.id">
+        {{ `步骤${i + 1}：`  +  step.description }}
+      </div> -->
+      <!-- </div> -->
+      <div >
+        <div class=" font-semibold">
+          执行
+        </div>
+        <div  class="break-all mb-0.5" v-for="action,index in props.content" :key="index">
+        {{ actionMap[action.action]?.text && actionMap[action.action].text + '：'+ action[actionMap[action.action].valueKey]}} 
+      </div>
+      </div>
+      <div v-if="props.finish">{{props.finish === '1' ? '执行完成' : '执行出错'}}</div>
+      <el-progress v-else :show-text="false" class="w-full !h-0.5 overflow-hidden"  :percentage="100"
+      :indeterminate="true"
+      :duration="2"/>
+    </div>
+  </div>
+</template>
+<script lang="js" setup>
+import { onMounted } from 'vue'
+import { actionMap } from '@/utils/actionMap'
+
+onMounted(() => {
+    chrome.runtime.onMessage.addListener(async (request, sender, sendResponse) => {
+    })
+})
+
+const props = defineProps({
+  content: {
+    type:Array,
+    required: true
+  },
+  finish: {
+    type: String,
+    request:true
+  }, 
+  steps: {
+    type:Array,
+    required: true
+  },
+  title: {
+    type: String,
+    request:true
+  }
+})
+
+</script>
+
+<style scoped>
+</style>

src/entrypoints/sidepanel/component/UserProfile.vue

@@ -5,7 +5,7 @@
                 <el-avatar :size="80" :src="userInfo?.avatar || defaultAvatar">
                     {{ userInfo.username?.substring(0, 1) }}
                 </el-avatar>
-                <div class="user-name">{{ userInfo.username }}</div>
+                <!-- <div class="user-name">{{ userInfo.username }}</div> -->
             </div>
             <div class="profile-info">
                 <div class="profile-item">

src/utils/navigator.js

@@ -251,6 +251,7 @@ export const navigator = () => {
                 let toolExecution = JSON.parse(add.data.plan.steps[0].toolExecution)[0].toolParameters
                 chrome.runtime.sendMessage({
                     type: "FROM_STEP",
+                    first:true,
                     payload: JSON.parse(toolExecution)
                 });
                 if (JSON.parse(toolExecution).action == 'navigate') {
@@ -294,6 +295,7 @@ export const navigator = () => {
                     }
                     chrome.runtime.sendMessage({
                         type: "FROM_STEP",
+                        first: false,
                         payload: JSON.parse(item.toolParameters)
                     });
                     await browserautomate(browdata.domState.buildDomTree, browdata.page, JSON.parse(item.toolParameters).action, JSON.parse(item.toolParameters).index || 0, JSON.parse(item.toolParameters).text || '')