diff --git a/frontend/src/assets/svg/icon_send_filled.svg b/frontend/src/assets/svg/icon_send_filled.svg
new file mode 100644
index 00000000..453cd730
--- /dev/null
+++ b/frontend/src/assets/svg/icon_send_filled.svg
@@ -0,0 +1,4 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.37253 7.37638C8.49177 8.29461 8 9.51773 8 10.7901C8 12.1866 8.59209 13.5176 9.62929 14.4527L10.293 15.0511C10.3773 15.1354 10.4824 15.196 10.5976 15.2268C10.7128 15.2576 10.834 15.2575 10.9492 15.2265C11.0643 15.1955 11.1692 15.1347 11.2534 15.0503C11.3376 14.9658 11.398 14.8607 11.4287 14.7455L14.8723 2.54916C14.9666 2.21511 14.5512 1.97734 14.3109 2.22784L9.37253 7.37638Z" fill="white"/>
+<path d="M13.7768 1.68461C14.0305 1.44129 13.7835 1.02182 13.4477 1.12556L1.28049 4.8839C1.165 4.9142 1.05956 4.97442 0.974792 5.0585C0.890025 5.14258 0.828938 5.24753 0.797696 5.36276C0.766454 5.47799 0.766163 5.59942 0.796852 5.7148C0.827541 5.83018 0.888124 5.93542 0.972486 6.0199L1.7232 6.84202C2.5779 7.778 3.78692 8.31123 5.05442 8.31123C6.21832 8.31123 7.33717 7.86138 8.17714 7.0557L13.7768 1.68461Z" fill="white"/>
+</svg>
diff --git a/frontend/src/views/chat/chat-block/ChartBlock.vue b/frontend/src/views/chat/chat-block/ChartBlock.vue
index c525880f..6f9d225d 100644
--- a/frontend/src/views/chat/chat-block/ChartBlock.vue
+++ b/frontend/src/views/chat/chat-block/ChartBlock.vue
@@ -236,16 +236,17 @@ function addToDashboard() {
           </el-tooltip>
         </div>
 
-        <div>
+        <div v-if="message?.record?.sql">
           <el-tooltip effect="dark" :content="t('chat.show_sql')" placement="top">
-            <el-button v-if="message?.record?.sql" class="tool-btn" text @click="showSql">
+            <el-button class="tool-btn" text @click="showSql">
               <el-icon size="16">
                 <icon_sql_outlined />
               </el-icon>
             </el-button>
           </el-tooltip>
         </div>
-        <div>
+        <div v-if="false">
+          <!--    todo      -->
           <el-tooltip effect="dark" :content="t('chat.export_to')" placement="top">
             <el-button class="tool-btn" text>
               <el-icon size="16">
@@ -254,7 +255,8 @@ function addToDashboard() {
             </el-button>
           </el-tooltip>
         </div>
-        <div>
+        <div v-if="false">
+          <!--    todo      -->
           <el-tooltip effect="dark" :content="t('chat.add_to_dashboard')" placement="top">
             <el-button class="tool-btn" text @click="addToDashboard">
               <el-icon size="16">
diff --git a/frontend/src/views/chat/index.vue b/frontend/src/views/chat/index.vue
index 23ed4a8c..75d41fb0 100644
--- a/frontend/src/views/chat/index.vue
+++ b/frontend/src/views/chat/index.vue
@@ -246,32 +246,38 @@
         v-if="computedMessages.length > 0 || (isAssistant && currentChatId)"
         class="chat-footer"
       >
-        <div style="height: 24px">
-          <template v-if="currentChat.datasource && currentChat.datasource_name">
-            {{ t('ds.title') }}：{{ currentChat.datasource_name }}
-          </template>
-        </div>
-        <div class="input-wrapper">
-          <el-input
-            v-model="inputMessage"
-            :disabled="isTyping"
-            class="input-area"
-            type="textarea"
-            :rows="1"
-            :autosize="{ minRows: 1, maxRows: 8 }"
-            :placeholder="t('qa.question_placeholder')"
-            @keydown.enter.exact.prevent="sendMessage"
-            @keydown.ctrl.enter.exact.prevent="handleCtrlEnter"
-          />
+        <div class="input-container" @click="clickInput">
+          <div class="datasource">
+            <template v-if="currentChat.datasource && currentChat.datasource_name">
+              {{ t('qa.selected_datasource') }}：
+              <span class="name">
+                {{ currentChat.datasource_name }}
+              </span>
+            </template>
+          </div>
+          <div class="input-wrapper">
+            <el-input
+              ref="inputRef"
+              v-model="inputMessage"
+              :disabled="isTyping"
+              class="input-area"
+              type="textarea"
+              :rows="1"
+              :autosize="{ minRows: 1, maxRows: 8 }"
+              :placeholder="t('qa.question_placeholder')"
+              @keydown.enter.exact.prevent="sendMessage"
+              @keydown.ctrl.enter.exact.prevent="handleCtrlEnter"
+            />
+          </div>
           <el-button
-            link
+            circle
             type="primary"
             class="input-icon"
             :disabled="isTyping"
-            @click="sendMessage"
+            @click.stop="sendMessage"
           >
-            <el-icon size="20">
-              <Position />
+            <el-icon size="16">
+              <icon_send_filled />
             </el-icon>
           </el-button>
         </div>
@@ -284,7 +290,6 @@
 
 <script setup lang="ts">
 import { computed, nextTick, onMounted, ref } from 'vue'
-import { Position } from '@element-plus/icons-vue'
 import { Chat, chatApi, ChatInfo, type ChatMessage, ChatRecord } from '@/api/chat'
 import ChatRow from './ChatRow.vue'
 import ChartAnswer from './answer/ChartAnswer.vue'
@@ -305,6 +310,7 @@ import icon_screen_outlined from '@/assets/svg/icon_screen_outlined.svg'
 import icon_start_outlined from '@/assets/svg/icon_start_outlined.svg'
 import logo_fold from '@/assets/LOGO-fold.svg'
 import logo from '@/assets/LOGO.svg'
+import icon_send_filled from '@/assets/svg/icon_send_filled.svg'
 
 import { useAssistantStore } from '@/stores/assistant'
 const assistantStore = useAssistantStore()
@@ -726,6 +732,13 @@ const getHistoryList = () => {
 const getCurrentChatId = () => {
   return currentChatId.value
 }
+
+const inputRef = ref()
+
+function clickInput() {
+  inputRef.value?.focus()
+}
+
 defineExpose({
   getHistoryList,
   toAssistantHistory,
@@ -794,30 +807,74 @@ defineExpose({
   }
 
   .chat-footer {
-    --ed-footer-height: 120px;
+    --ed-footer-height: calc(142px + 16px);
+
+    padding-bottom: 16px;
 
     display: flex;
     flex-direction: column;
+    align-items: center;
 
-    .input-wrapper {
+    .input-container {
       flex: 1;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      width: 100%;
+      max-width: 800px;
+      border-radius: 16px;
+      border: 1px solid rgba(217, 220, 223, 1);
+      background: rgba(248, 249, 250, 1);
+      padding: 12px;
+      gap: 8px;
 
       position: relative;
 
-      .input-area {
-        height: 100%;
-        padding-bottom: 8px;
-
-        :deep(.ed-textarea__inner) {
-          height: 100% !important;
-        }
-      }
-
       .input-icon {
         min-width: unset;
         position: absolute;
-        bottom: 14px;
-        right: 8px;
+        bottom: 12px;
+        right: 12px;
+
+        border-color: unset;
+
+        &.is-disabled {
+          background: rgba(187, 191, 196, 1);
+          border-color: unset;
+        }
+      }
+
+      &:hover {
+        border-color: rgba(28, 186, 144, 1);
+      }
+    }
+
+    .datasource {
+      width: 100%;
+
+      line-height: 22px;
+      font-size: 14px;
+      font-weight: 400;
+      color: rgba(100, 106, 115, 1);
+
+      .name {
+        color: rgba(31, 35, 41, 1);
+      }
+    }
+
+    .input-wrapper {
+      width: 100%;
+      flex: 1;
+
+      .input-area {
+        height: 100%;
+
+        :deep(.ed-textarea__inner) {
+          height: 100% !important;
+          background: transparent;
+          box-shadow: unset;
+          padding: unset;
+        }
       }
     }
   }