diff --git a/CHANGELOG.md b/CHANGELOG.md
index cb7f91bc..69813b2d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,6 +1,7 @@
 # 更新日志
 ## v4.0.8
 * 功能优化：当数据库更新失败的时候记录错误日志
+* 功能优化：聊天输入框会随着输入内容的增多自动调整高度
 
 ## v4.0.7
 
diff --git a/web/src/assets/css/chat-plus.styl b/web/src/assets/css/chat-plus.styl
index 32ba0808..8c4cdc6e 100644
--- a/web/src/assets/css/chat-plus.styl
+++ b/web/src/assets/css/chat-plus.styl
@@ -129,7 +129,7 @@ $borderColor = #4676d0;
       --el-main-padding: 0;
       margin: 0;
 
-      .chat-box {
+      .chat-container {
         min-width: 0;
         flex: 1;
         background-color: var(--el-bg-color)
@@ -138,6 +138,7 @@ $borderColor = #4676d0;
         #container {
           overflow: hidden;
           width: 100%;
+          position relative
 
           ::-webkit-scrollbar {
             width: 0;
@@ -165,68 +166,94 @@ $borderColor = #4676d0;
           }
 
           .input-box {
-            background-color: #ffffff
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
-            padding 0 15px;
+            position absolute
+            bottom 0
+            width 100%
 
-            .tool-item {
-              margin-right 15px
-              border-radius: 6px;
-              color: #19c37d;
+            .input-box-inner {
               display flex
-              justify-content center
-              justify-items center
-              padding 6px
-              cursor pointer
-              background #F2F2F2
+              background-color: #ffffff
+              justify-content: center;
+              align-items: center;
+              box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
+              padding 0 15px;
 
-              &:hover {
-                background #D5FAD3
-              }
+              .tool-item {
+                margin-right 15px
+                border-radius: 6px;
+                color: #19c37d;
+                display flex
+                justify-content center
+                justify-items center
+                padding 6px
+                cursor pointer
+                background #F2F2F2
 
-              .iconfont {
-                font-size: 24px;
-              }
-            }
+                &:hover {
+                  background #D5FAD3
+                }
 
-            .input-container {
-              width 100%
-              margin: 0;
-              border: none;
-              padding: 10px 0;
-              display flex
-              justify-content center
-              position relative
-
-              .el-textarea {
-                .el-textarea__inner::-webkit-scrollbar {
-                  width: 0;
-                  height: 0;
+                .iconfont {
+                  font-size: 24px;
                 }
               }
 
-              .select-file {
-                position absolute;
-                right 48px;
-                top 20px;
-              }
+              .input-body {
+                width 100%
+                margin: 0;
+                border: none;
+                padding: 10px 0;
+                display flex
+                justify-content center
+                position relative
 
-              .send-btn {
-                position absolute;
-                right 12px;
-                top 20px;
+                .hide-div {
+                  white-space: pre-wrap; /* 保持文本换行 */
+                  visibility: hidden; /* 隐藏 div */
+                  position: absolute; /* 脱离文档流 */
+                  line-height: 24px
+                  font-size 14px
+                  word-wrap: break-word; /* 允许单词换行 */
+                  overflow-wrap: break-word; /* 允许长单词换行，适用于现代浏览器 */
+                }
+
+                .input-border {
+                  display flex
+                  width 100%
+                  overflow hidden
+                  border: 2px solid #21AA93
+                  border-radius 10px
+                  padding 10px
+
+
+                  .prompt-input::-webkit-scrollbar {
+                    width: 0;
+                    height: 0;
+                  }
+
+                  .prompt-input {
+                    width 100%
+                    line-height: 24px
+                    border none
+                    font-size 14px
+                    background none
+                    resize: none
+                  }
+
+                  .send-btn {
+                    width 32px
+                    margin-left 10px
+                    .el-button {
+                      padding 8px 5px;
+                      border-radius 6px;
+                      font-size 20px;
+                    }
+                  }
 
-                .el-button {
-                  padding 8px 5px;
-                  border-radius 6px;
-                  font-size 20px;
                 }
               }
-
             }
+
           }
         }
 
diff --git a/web/src/views/ChatPlus.vue b/web/src/views/ChatPlus.vue
index f59e33bc..e3b352c7 100644
--- a/web/src/views/ChatPlus.vue
+++ b/web/src/views/ChatPlus.vue
@@ -65,9 +65,9 @@
         </div>
       </el-aside>
       <el-main v-loading="loading" element-loading-background="rgba(122, 122, 122, 0.3)">
-        <div class="chat-box" :style="{height: mainWinHeight+'px'}">
+        <div class="chat-container">
           <div>
-            <div id="container">
+            <div id="container" :style="{height: mainWinHeight+'px'}">
               <div class="chat-box" id="chat-box" :style="{height: chatBoxHeight+'px'}">
                 <div v-if="showHello">
                   <welcome @send="autofillPrompt"/>
@@ -84,8 +84,8 @@
                 </div>
               </div><!-- end chat box -->
 
-              <el-affix position="bottom" :offset="0">
-                <div class="input-box">
+              <div class="input-box">
+                <div class="input-box-inner">
                   <span class="tool-item">
                       <el-popover
                           :width="300"
@@ -151,32 +151,34 @@
                     </el-tooltip>
                   </span>
 
-                  <div class="input-container">
-                    <el-input
-                        ref="textInput"
-                        v-model="prompt"
-                        v-on:keydown="inputKeyDown"
-                        autofocus
-                        type="textarea"
-                        :rows="2"
-                        style="--el-input-focus-border-color:#21AA93;
-                        border: 1px solid #21AA93;--el-input-border-color:#21AA93;
-                        border-radius: 5px; --el-input-hover-border-color:#21AA93;"
-                        placeholder="按 Enter 键发送消息，使用 Ctrl + Enter 换行"
-                    />
-                    <span class="send-btn">
-                    <el-button type="info" v-if="showStopGenerate" @click="stopGenerate" plain>
-                      <el-icon>
-                        <VideoPause/>
-                      </el-icon>
-                    </el-button>
-                    <el-button @click="sendMessage" color="#19c37d" style="color:#ffffff" v-else>
-                      <el-icon><Promotion/></el-icon>
-                    </el-button>
-                  </span>
+                  <div class="input-body">
+                    <div ref="textHeightRef" class="hide-div">{{prompt}}</div>
+                    <div class="input-border">
+                      <textarea
+                            ref="inputRef"
+                            class="prompt-input"
+                            :rows="row"
+                            v-model="prompt"
+                            @keydown="onInput"
+                            @input="onInput"
+                            placeholder="按 Enter 键发送消息，使用 Ctrl + Enter 换行"
+                            autofocus>
+                      </textarea>
+                      <span class="send-btn">
+                        <el-button type="info" v-if="showStopGenerate" @click="stopGenerate" plain>
+                          <el-icon>
+                            <VideoPause/>
+                          </el-icon>
+                        </el-button>
+                        <el-button @click="sendMessage" color="#19c37d" style="color:#ffffff" v-else>
+                          <el-icon><Promotion/></el-icon>
+                        </el-button>
+                      </span>
+                    </div>
+
                   </div>
                 </div><!-- end input box -->
-              </el-affix>
+              </div>
             </div><!-- end container -->
           </div><!-- end loading -->
         </div>
@@ -237,11 +239,13 @@ const roleId = ref(0)
 const newChatItem = ref(null);
 const isLogin = ref(false)
 const showHello = ref(true)
-const textInput = ref(null)
+const inputRef = ref(null)
+const textHeightRef = ref(null)
 const showNotice = ref(false)
 const notice = ref("")
 const noticeKey = ref("SYSTEM_NOTICE")
 const store = useSharedStore();
+const row = ref(1)
 
 if (isMobile()) {
   router.replace("/mobile/chat")
@@ -705,8 +709,19 @@ const enableInput = () => {
   showStopGenerate.value = false;
 }
 
-// 登录输入框输入事件处理
-const inputKeyDown = function (e) {
+const onInput = (e) => {
+  // 根据输入的内容自动计算输入框的行数
+  const lineHeight = parseFloat(window.getComputedStyle(inputRef.value).lineHeight)
+  textHeightRef.value.style.width = inputRef.value.clientWidth + 'px'; // 设定宽度和 textarea 相同
+  const lines = Math.floor(textHeightRef.value.clientHeight / lineHeight);
+  inputRef.value.scrollTo(0, inputRef.value.scrollHeight)
+  if (prompt.value.length === 0) {
+    row.value = 1
+  } else if (row.value <= 7) {
+    row.value = lines
+  }
+
+  // 输入回车自动提交
   if (e.keyCode === 13) {
     if (e.ctrlKey) { // Ctrl + Enter 换行
       prompt.value += "\n";
@@ -720,7 +735,7 @@ const inputKeyDown = function (e) {
 // 自动填充 prompt
 const autofillPrompt = (text) => {
   prompt.value = text
-  textInput.value.focus()
+  inputRef.value.focus()
   // sendMessage()
 }
 // 发送消息