refactor(agent): 重构智能对话页面布局和样式

- 重新设计了页面布局，分为左、右两个主要区域
- 左侧区域增加了聊天机器人信息展示，包括头像、名称、描述等
- 右侧区域保留聊天窗口，并增加了顶部栏
-优化了响应式布局，使页面在不同屏幕尺寸下都能良好显示
- 调整了颜色、字体等样式，提升了页面视觉效果

src/api/all/agent.ts

@@ -31,3 +31,7 @@ export const executeWorkFlow = (params: any) => {
 export const delAgentMessage = (params: any) => {
   return Http.post(`/v1/agent/delAgentMessage`, params);
 };
+// 删除工作流历史记录
+export const delWorkflowHistoryApi = (id:number) => {
+  return Http.post(`/v1/agent/delWorkflowHistory/${id}`);
+};

src/assets/svg/svg-delete.svg

@@ -0,0 +1,3 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.91671 2.62492V1.45825L4.08337 1.45825V2.62492L1.45837 2.62492V3.79159H2.47921L2.47921 11.6666C2.47921 12.1498 2.87096 12.5416 3.35421 12.5416L10.6459 12.5416C11.1291 12.5416 11.5209 12.1498 11.5209 11.6666V3.79159L12.5417 3.79159V2.62492L9.91671 2.62492ZM3.64587 11.3749V3.79159L10.3542 3.79159V11.3749L3.64587 11.3749ZM5.25004 5.24992V9.62492H6.41671V5.24992H5.25004ZM7.58337 5.24992V9.62492H8.75004V5.24992H7.58337Z" fill="#F64B31"/>
+</svg>

src/assets/svg/svg-edit.svg

@@ -0,0 +1,3 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8.10797 1.4262C8.44968 1.08449 9.0037 1.08449 9.34541 1.4262L10.9746 3.05536C11.3163 3.39707 11.3163 3.95109 10.9746 4.2928L5.01002 10.2573C4.87077 10.3966 4.68863 10.4848 4.49305 10.5077L2.72936 10.7142C2.18281 10.7782 1.71357 10.3278 1.7551 9.77908L1.89441 7.93865C1.9102 7.73001 2.00024 7.53393 2.14819 7.38598L8.10797 1.4262ZM7.67304 3.51105L8.88972 4.72773L9.94337 3.67408L8.72669 2.4574L7.67304 3.51105ZM8.06477 5.55268L6.84808 4.336L3.04959 8.1345L2.94515 9.51428L4.25672 9.36073L8.06477 5.55268ZM12.25 12.8332L1.75 12.8332V11.6665L12.25 11.6665V12.8332Z" fill="#737478"/>
+</svg>

src/assets/svg/svg-more.svg

@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M2 7L2 9L4 9V7H2ZM7 7V9L9 9V7H7ZM12 7V9L14 9V7L12 7Z" fill="#737478"/>
+</svg>

src/assets/svg/svg-pin.svg

@@ -0,0 +1,3 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6.10963 5.99249L5.88754 6.00927L2.72457 6.25484L7.74479 11.2751L7.99037 8.1121L8.00714 7.89001L10.5716 5.32555L8.67409 3.42803L6.10963 5.99249ZM9.17397 8.42746L8.8472 12.6526C8.80683 13.1738 8.17358 13.4079 7.80384 13.0384L4.80861 10.0432L1.9355 12.9163C1.85964 12.9921 1.7363 12.9921 1.6604 12.9163L1.08404 12.3399C1.00814 12.264 1.00814 12.1407 1.08404 12.0648L3.95715 9.1917L0.961248 6.1958C0.592209 5.82608 0.826163 5.19297 1.34706 5.15243L5.57218 4.82567L7.82196 2.5759L6.9356 1.68954C6.86001 1.61362 6.86048 1.4909 6.93627 1.41511L7.51264 0.838744C7.58845 0.763153 7.71122 0.762546 7.78706 0.838073L13.1616 6.21257C13.2374 6.2884 13.2373 6.41176 13.1616 6.48767L12.5852 7.06404C12.5093 7.13993 12.386 7.13993 12.3101 7.06404L11.4237 6.17768L9.17397 8.42746Z" fill="#737478"/>
+</svg>

src/views/agent/work-flow/index.vue

@@ -40,8 +40,29 @@
             <div class="item-body">
               <div class="text" @click="getHistoryInfo(item)">
                 {{ item.title }}
-                <SvgIcon size="12"  name="svg-more" class="color-#6D4CFE" style="float: right" />
+<!--                <a-trigger position="top" auto-fit-position :unmount-on-close="false">-->
-
+<!--                  <SvgIcon size="12" name="svg-more" class="color-#6D4CFE" style="float: right" />-->
+<!--                  <template #content>-->
+<!--                    <div class="">-->
+<!--                      <div class="history-item-dropdown">-->
+<!--                        <div class="dropdown-item header-item">-->
+<!--                          <SvgIcon size="12" name="svg-pin" class="icon color-#6D4CFE" />-->
+<!--                          <div class="text">置顶</div>-->
+<!--                        </div>-->
+<!--                        <div class="dropdown-item">-->
+<!--                          <SvgIcon size="12" name="svg-edit" class="icon color-#6D4CFE" />-->
+<!--                          <div class="text">重命名</div>-->
+<!--                        </div>-->
+<!--                        <div class="dropdown-item">-->
+<!--                          <SvgIcon size="12" name="svg-delete" class="icon color-#6D4CFE" />-->
+<!--                          <a-popconfirm content="你确认删除该历史对话吗" @ok="deleteHistory(item.id,index)" type="error">-->
+<!--                            <div class="text delete">删除</div>-->
+<!--                          </a-popconfirm>-->
+<!--                        </div>-->
+<!--                      </div>-->
+<!--                    </div>-->
+<!--                  </template>-->
+<!--                </a-trigger>-->
               </div>
             </div>
           </div>
@@ -77,13 +98,13 @@
 <script setup>
 import { ref, reactive } from 'vue';
 import DynamicForm from './components/DynamicForm.vue';
-import { executeWorkFlow, getWorkFlowInfo } from '@/api/all/agent';
+import { executeWorkFlow, getWorkFlowInfo, delWorkflowHistoryApi } from '@/api/all/agent';
 import { useRoute, useRouter } from 'vue-router';
 import { marked } from 'marked';
 import DOMPurify from 'dompurify';
 import menuFold from '@/assets/svg/menu-fold.svg';
 import menuUnfold from '@/assets/svg/menu-unfold.svg';
-import { formatNumberShow } from "@/utils/tools"
+import { formatNumberShow } from '@/utils/tools';
 
 const formFields = ref({});
 const history = ref([]);
@@ -135,6 +156,14 @@ const renderedMarkdown = computed(() => {
   return '';
 });
 
+const deleteHistory = async (id, index ) => {
+  const { code } = await delWorkflowHistoryApi(id);
+  if (code === 200) {
+    //
+    history.value.splice(index, 1);
+  }
+};
+
 // 提交表单
 const handleSubmit = async (formData) => {
   try {
@@ -155,7 +184,6 @@ const handleSubmit = async (formData) => {
 
 const addHistoryItem = (item) => {
   history.value.unshift(item);
-
 };
 
 const getHistoryInfo = (item) => {

src/views/agent/work-flow/style.scss

@@ -6,6 +6,7 @@
   font-weight: 400;
   line-height: 22px;
 }
+
 .back-wap {
   width: 100%;
   justify-content: flex-start;
@@ -136,6 +137,7 @@
       align-items: center;
       gap: 10px;
       display: flex;
+
       .text {
         align-self: stretch;
         color: var(--Text-2, #3C4043);
@@ -173,6 +175,7 @@
       align-items: flex-start;
       display: flex;
       padding: 10px;
+
       .section {
         align-self: stretch;
         height: 40px;
@@ -197,7 +200,6 @@
         justify-content: flex-start;
         align-items: flex-start;
         display: flex;
-
         .item-body {
           align-self: stretch;
           height: 40px;
@@ -207,7 +209,6 @@
           align-items: center;
           gap: 10px;
           display: inline-flex;
-
           .text {
             flex: 1 1 0;
             color: var(--Text-1, #211F24);
@@ -217,7 +218,9 @@
             line-height: 22px;
             word-wrap: break-word;
           }
+
         }
+
       }
     }
   }
@@ -287,10 +290,7 @@
       .res {
         flex: 1 1 0;
         align-self: stretch;
-        padding-left: 32px;
+        padding: 32px;
-        padding-right: 32px;
-        padding-top: 20px;
-        padding-bottom: 20px;
         flex-direction: column;
         justify-content: center;
         align-items: center;
@@ -300,3 +300,55 @@
     }
   }
 }
+.history-item-dropdown {
+  width: 125px;
+  padding-top: 8px;
+  padding-bottom: 4px;
+  left: 0px;
+  top: 0px;
+  position: absolute;
+  background: var(--BG-White, white);
+  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
+  overflow: hidden;
+  border-radius: 4px;
+  outline: 1px solid var(--Border-1, #D7D7D9);
+  display: inline-flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: flex-start;
+  gap: 2px;
+
+  .dropdown-item {
+    align-self: stretch;
+    height: 36px;
+    padding-left: 12px;
+    padding-right: 12px;
+    display: inline-flex;
+    justify-content: flex-start;
+    align-items: center;
+    gap: 8px;
+
+    &.header-item {
+      background: var(--BG-200, #F2F3F5);
+    }
+
+    .icon {
+      float: right;
+    }
+
+    .text {
+      flex: 1 1 0;
+      height: 22px;
+      color: var(--Text-1, #211F24);
+      font-size: 14px;
+      font-family: Alibaba PuHuiTi;
+      font-weight: 400;
+      line-height: 22px;
+      word-wrap: break-word;
+
+      &.delete {
+        color: var(--Functional-Red-6, #F64B31);
+      }
+    }
+  }
+}

vite.config.ts

@@ -40,7 +40,7 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
           changeOrigin: true,
           rewrite: (path) => path.replace(/^\/api/, ''),
           // 目标地址
-          target: 'https://lingjiapi.lvfunai.com/api',
+          target: 'http://www.lingji.com/api',
           // target: 'http://192.168.40.22/api',
         },
       },