perf: reasoning style

Author: wangdan-fit2cloud

ui/src/assets/chat/icon_reasoning.svg

@@ -315,7 +315,7 @@
             >
               <img
                 v-show="isDisabledChat || loading || uploadLoading"
-                src="@/assets/icon_send.svg"
+                src="@/assets/chat/icon_send.svg"
                 alt=""
               />
               <SendIcon v-show="!isDisabledChat && !loading && !uploadLoading" />

ui/src/assets/icon_send.svg ui/src/assets/chat/icon_send.svgui/src/assets/icon_send.svg renamed to ui/src/assets/chat/icon_send.svg

@@ -123,7 +123,7 @@
             >
               <img
                 v-show="!editText.trim() || editText.trim() === chatRecord.problem_text.trim()"
-                src="@/assets/icon_send.svg"
+                src="@/assets/chat/icon_send.svg"
                 alt=""
               />
               <SendIcon

ui/src/assets/icon_send_colorful.svg ui/src/assets/chat/icon_send_colorful.svgui/src/assets/icon_send_colorful.svg renamed to ui/src/assets/chat/icon_send_colorful.svg

@@ -17,7 +17,7 @@
     />
   </svg>
 
-  <img v-else src="@/assets/icon_send_colorful.svg" />
+  <img v-else src="@/assets/chat/icon_send_colorful.svg" />
 </template>
 <script setup lang="ts">
 import { ref, computed, onMounted } from 'vue'

ui/src/components/ai-chat/component/chat-input-operate/index.vue

@@ -1,11 +1,18 @@
 <template>
-  <div class="reasoning">
-    <el-button text @click="showThink = !showThink" class="reasoning-button">
-      {{ $t('workflow.nodes.aiChatNode.think') }}
-      <el-icon class="ml-4" :class="showThink ? 'rotate-180' : ''"><ArrowDownBold /> </el-icon>
-    </el-button>
+  <el-card shadow="never" class="reasoning mt-8" style="--el-card-padding: 12px">
+    <div class="flex-between cursor" @click="showThink = !showThink">
+      <div class="flex align-center" style="line-height: 20px">
+        <img src="@/assets/chat/icon_reasoning.svg" alt="" />
+        <span class="ml-4">{{ $t('workflow.nodes.aiChatNode.think') }}</span>
+      </div>
+      <div>
+        <el-icon class="arrow-icon" :class="showThink ? 'rotate-180' : ''">
+          <ArrowDown />
+        </el-icon>
+      </div>
+    </div>
     <el-collapse-transition>
-      <div class="border-l mt-8" v-show="showThink">
+      <div v-show="showThink">
         <MdPreview
           ref="editorRef"
           editorId="preview-only"
@@ -14,7 +21,7 @@
         />
       </div>
     </el-collapse-transition>
-  </div>
+  </el-card>
 </template>
 <script lang="ts" setup>
 import { ref } from 'vue'
@@ -23,12 +30,7 @@ const showThink = ref<boolean>(true)
 </script>
 <style lang="scss" scoped>
 .reasoning {
-  .reasoning-button {
-    font-size: 14px;
-    color: var(--app-text-color-secondary) !important;
-  }
   .reasoning-md {
-    padding-left: 8px;
     --md-color: var(--app-input-color-placeholder) !important;
   }
 }

ui/src/components/ai-chat/component/question-content/index.vue

@@ -327,7 +327,7 @@
                     />
                   </div>
                 </div>
-                <el-card shadow="never" class="card-never" style="--el-card-padding: 12px">
+                <el-card shadow="never" class="card-never mb-8" style="--el-card-padding: 12px">
                   <!-- MCP-->
                   <div v-if="toolPermissionPrecise.read()">
                     <div class="flex-between mb-8" @click="collapseData.MCP = !collapseData.MCP">

ui/src/components/logo/SendIcon.vue

@@ -83,7 +83,7 @@
                 >
                   <img
                     v-show="!inputValue.trim() || loading || isStreaming"
-                    src="@/assets/icon_send.svg"
+                    src="@/assets/chat/icon_send.svg"
                     alt=""
                   />
                   <SendIcon v-show="inputValue.trim() && !loading && !isStreaming" />

ui/src/components/markdown/ReasoningRander.vue

@@ -222,10 +222,10 @@
             :disabled="isDisabledChart || loading"
             @click="sendChatHandle"
           >
-            <img v-show="isDisabledChart || loading" src="@/assets/icon_send.svg" alt="" />
+            <img v-show="isDisabledChart || loading" src="@/assets/chat/icon_send.svg" alt="" />
             <img
               v-show="!isDisabledChart && !loading"
-              src="@/assets/icon_send_colorful.svg"
+              src="@/assets/chat/icon_send_colorful.svg"
               alt=""
             />
           </el-button>