From 35835ca1131edec8b28c2fe730fa54e6d4634fed Mon Sep 17 00:00:00 2001
From: rd <1344903914@qq.com>
Date: Wed, 30 Jul 2025 14:07:18 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E6=A0=B7=E5=BC=8F=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layouts/Basic.vue                |  2 +-
 src/styles/lib/variable.scss         |  2 +-
 src/views/agent/chat/index.vue       |  4 +-
 src/views/agent/chat/style.scss      |  4 +-
 src/views/agent/work-flow/index.vue  | 27 +++++----
 src/views/agent/work-flow/style.scss | 90 ++++++++++++----------------
 6 files changed, 61 insertions(+), 68 deletions(-)

diff --git a/src/layouts/Basic.vue b/src/layouts/Basic.vue
index 8f3f10d..271bc03 100644
--- a/src/layouts/Basic.vue
+++ b/src/layouts/Basic.vue
@@ -170,7 +170,7 @@ $layout-max-width: 1100px;
   min-width: 1366px;
   min-height: 100vh;
   overflow-y: hidden;
-  background-color: var(--color-fill-2);
+  background-color: $color-background;
   transition: padding 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 </style>
diff --git a/src/styles/lib/variable.scss b/src/styles/lib/variable.scss
index fe28ae1..a6bd989 100644
--- a/src/styles/lib/variable.scss
+++ b/src/styles/lib/variable.scss
@@ -11,7 +11,7 @@ $font-family-manrope-medium: 'Manrope-Medium';
 $font-family-manrope-bold: 'Manrope-Bold';
 $font-family-manrope-semiBold: 'Manrope-SemiBold';
 
-$color-background: #f9f9f9;
+$color-background: #F7F8FA;
 
 $color-primary: #6d4cfe;   // 常规
 $color-primary-5: #8A70FE; // hover
diff --git a/src/views/agent/chat/index.vue b/src/views/agent/chat/index.vue
index 4987804..172cfd0 100644
--- a/src/views/agent/chat/index.vue
+++ b/src/views/agent/chat/index.vue
@@ -6,7 +6,9 @@
     </div>
     <div class="workflow-container">
       <div class="left-wap mr-24px" v-if="isCollapsed == false">
-        <img :src="cozeInfo?.image_url" class="w-full h-160px rounded-8px object-contain w-100% mb-15px bg-#F0EDFF" />
+        <div class="w-full w-100% mb-15px bg-#F0EDFF h-160px rounded-8px">
+          <img v-if="cozeInfo?.image_url" :src="cozeInfo?.image_url" class= "w-full h-full object-contain" />
+        </div>
         <div class="content mb-15px">
           <div class="title-body">
             <div class="text mr-4px">{{ cozeInfo?.name }}</div>
diff --git a/src/views/agent/chat/style.scss b/src/views/agent/chat/style.scss
index dd7f3e8..d679249 100644
--- a/src/views/agent/chat/style.scss
+++ b/src/views/agent/chat/style.scss
@@ -29,7 +29,8 @@
     justify-content: flex-start;
     align-items: flex-start;
     display: inline-flex;
-
+    background: var(--BG-100, #F7F8FA);
+    
     // .header {
     //   align-self: stretch;
     //   height: 160px;
@@ -228,6 +229,7 @@
     background: var(--BG-White, white);
     overflow: hidden;
     border-radius: 8px;
+    display: flex;
     flex-direction: column;
 
     .header {
diff --git a/src/views/agent/work-flow/index.vue b/src/views/agent/work-flow/index.vue
index e917f75..140b2ec 100644
--- a/src/views/agent/work-flow/index.vue
+++ b/src/views/agent/work-flow/index.vue
@@ -1,25 +1,26 @@
 <template>
   <div>
-    <span class="back-wap" @click="goChatIndex"> <icon-left /> 返回空间 </span>
+    <div class="back-wap cursor-pointer mb-20px" @click="goChatIndex"> 
+      <icon-left size="16" class="color-#737478 mr-4px" /> 
+      <span class="cs">返回空间</span> 
+    </div>    
     <div class="workflow-container">
-      <div class="left-wap" v-if="isCollapsed == false">
-        <div class="header">
-          <div class="image-body">
-            <img :src="cozeInfo.image_url" />
-          </div>
+      <div class="left-wap mr-24px" v-if="isCollapsed == false">
+        <div class="w-full w-100% mb-15px bg-#F0EDFF h-160px rounded-8px">
+          <img v-if="cozeInfo?.image_url" :src="cozeInfo?.image_url" class= "w-full h-full object-contain" />
         </div>
-        <div class="content">
+        <div class="content mb-15px">
           <div class="title-body">
-            <div class="text">{{ cozeInfo.name }}</div>
+            <div class="text mr-4px">{{ cozeInfo.name }}</div>
             <div data-尺寸="迷你-20px" data-颜色="red" class="tag-body">
               <div class="">
-                <img class="status-icon" :src="workflow" />
+                <SvgIcon size="12" name="svg-workflow" class="color-#F64B31" />
               </div>
               <div class="text">工作流</div>
             </div>
           </div>
-          <div class="use-body">
-            <div class="num">{{ cozeInfo.views }}</div>
+          <div class="use-body flex items-center">
+            <div class="num mr-2px">{{ formatNumberShow({ value: cozeInfo?.views, showExactValue: true }) }}</div>
             <div class="text">次使用</div>
           </div>
         </div>
@@ -46,7 +47,7 @@
         <div class="header">
           <div class="body">
             <div class="">
-              <div class="toggle-btn" @click="toggleCollapse">
+              <div class="toggle-btn cursor-pointer" @click="toggleCollapse">
                 <a-tooltip :content="isCollapsed ? '展开' : '折叠'">
                   <img class="status-icon" :src="isCollapsed ? menuUnfold : menuFold" />
                 </a-tooltip>
@@ -78,7 +79,7 @@ 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 workflow from '@/assets/svg/svg-workflow.svg';
+import { formatNumberShow } from "@/utils/tools"
 
 const formFields = ref({});
 const history = ref([]);
diff --git a/src/views/agent/work-flow/style.scss b/src/views/agent/work-flow/style.scss
index 1eb1319..38fdb1a 100644
--- a/src/views/agent/work-flow/style.scss
+++ b/src/views/agent/work-flow/style.scss
@@ -1,23 +1,23 @@
+.cs {
+  color: #3C4043;
+  font-family: $font-family-regular;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 22px;
+}
 .back-wap {
   width: 100%;
-  height: 100%;
-  margin-bottom: 20px;
-  padding-left: 24px;
-  padding-right: 24px;
   justify-content: flex-start;
   align-items: center;
-  gap: 4px;
   display: inline-flex;
 }
 
 .workflow-container {
   width: 100%;
   height: 100%;
-  padding-left: 24px;
-  padding-right: 24px;
   justify-content: flex-start;
   align-items: center;
-  gap: 24px;
   display: inline-flex;
 
   .left-wap {
@@ -31,37 +31,35 @@
     align-items: flex-start;
     display: inline-flex;
 
-    .header {
-      align-self: stretch;
-      height: 160px;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      gap: 10px;
-      display: flex;
+    // .header {
+    //   align-self: stretch;
+    //   height: 160px;
+    //   flex-direction: column;
+    //   justify-content: center;
+    //   align-items: center;
+    //   gap: 10px;
+    //   display: flex;
 
-      .image-body {
-        align-self: stretch;
-        flex: 1 1 0;
-        position: relative;
-        background: #FFEDED;
-        overflow: hidden;
-        border-radius: 8px;
+    //   .image-body {
+    //     align-self: stretch;
+    //     flex: 1 1 0;
+    //     position: relative;
+    //     background: #FFEDED;
+    //     overflow: hidden;
+    //     border-radius: 8px;
 
-        img {
-          width: 408.90px;
-          height: 218px;
-          left: -24.45px;
-          top: -29px;
-          position: absolute
-        }
-      }
-    }
+    //     img {
+    //       width: 408.90px;
+    //       height: 218px;
+    //       left: -24.45px;
+    //       top: -29px;
+    //       position: absolute
+    //     }
+    //   }
+    // }
 
     .content {
       align-self: stretch;
-      padding-top: 15px;
-      padding-bottom: 15px;
       justify-content: space-between;
       align-items: flex-start;
       display: inline-flex;
@@ -78,7 +76,7 @@
           flex-direction: column;
           color: var(--Text-1, #211F24);
           font-size: 18px;
-          font-family: Alibaba PuHuiTi;
+          font-family: $font-family-medium;
           font-weight: 400;
           line-height: 26px;
           word-wrap: break-word;
@@ -99,7 +97,7 @@
           .text {
             color: var(--Functional-Red-6, #F64B31);
             font-size: 12px;
-            font-family: Alibaba PuHuiTi;
+            font-family: $font-family-medium;
             font-weight: 400;
             line-height: 20px;
             word-wrap: break-word
@@ -109,29 +107,20 @@
       }
 
       .use-body {
-        width: 79px;
-        height: 24px;
-        position: relative;
 
         .num {
-          left: 20px;
-          top: 0px;
-          position: absolute;
           color: var(--Text-2, #3C4043);
           font-size: 16px;
-          font-family: Alibaba PuHuiTi;
+          font-family: $font-family-manrope-medium;
           font-weight: 400;
           line-height: 24px;
           word-wrap: break-word
         }
 
         .text {
-          left: 43px;
-          top: 3px;
-          position: absolute;
           color: var(--Text-3, #737478);
           font-size: 12px;
-          font-family: Alibaba PuHuiTi;
+          font-family: $font-family-regular;
           font-weight: 400;
           line-height: 20px;
           word-wrap: break-word;
@@ -147,12 +136,11 @@
       align-items: center;
       gap: 10px;
       display: flex;
-      padding: 10px;
       .text {
         align-self: stretch;
         color: var(--Text-2, #3C4043);
         font-size: 14px;
-        font-family: Alibaba PuHuiTi;
+        font-family: $font-family-regular;
         font-weight: 400;
         line-height: 22px;
         word-wrap: break-word;
@@ -196,7 +184,7 @@
         .text {
           color: var(--Text-3, #737478);
           font-size: 14px;
-          font-family: Alibaba PuHuiTi;
+          font-family: $font-family-regular;
           font-weight: 400;
           line-height: 22px;
           word-wrap: break-word
@@ -224,7 +212,7 @@
             flex: 1 1 0;
             color: var(--Text-1, #211F24);
             font-size: 14px;
-            font-family: Alibaba PuHuiTi;
+            font-family: $font-family-regular;
             font-weight: 400;
             line-height: 22px;
             word-wrap: break-word;