输入框变了，html还没变

src/views/homePage.vue

@@ -25,9 +25,9 @@ import sendBtn from "../assets/img/homePage/tail/send.png";
 import msgBtn from "../assets/img/homePage/tail/msg.png";
 
 
-// import VConsole from 'vconsole';
+import VConsole from 'vconsole';
 
-// const vConsole = new VConsole();
+const vConsole = new VConsole();
 
 // import { useUserStore } from "../store/userPessionCode.js";
 const { getQueryVariable, setActiveTabIndex } = useDataStore()
@@ -411,6 +411,62 @@ function updateAppHeight() {
   document.documentElement.style.setProperty('--app-height', `${vh}px`);
 }
 
+const adjustFooterPosition = (height) => {
+  console.log('调整底部位置', height)
+  const footer = document.querySelector('.el-footer');
+  const main = document.querySelector('.el-main');
+  const homePage = document.querySelector('.homepage');
+  const app = document.getElementById('app');
+  // Footer 的默认高度（假设为 60px）  // 动态推高 Footer
+  // footer.style.bottom = `${keyboardHeight}px`; 
+  // 给 Main 区域留出 Footer + 键盘的空间
+  homePage.style.height = `${height}px`;
+  app.style.height = `${height}px`;
+
+  void homePage.offsetHeight;
+
+  const html = document.querySelector('html');
+  const body = document.querySelector('body');
+  html.style.height = `${height}px`;
+  console.log(html.offsetHeight, 'html')
+  console.log(html.clientHeight, 'html')
+  console.log(html.scrollHeight, 'htmlScrollHeight')
+  console.log(body.clientHeight, 'body')
+  console.log(body.scrollHeight, 'bodyScrollHeight')
+  console.log(homePage.offsetHeight, 'homePage')
+  console.log(homePage.clientHeight, 'homePageClientHeight')
+  console.log(homePage.scrollHeight, 'homePageScrollHeight')
+
+};
+
+const onFocus = function () {
+  const visualViewport = window.visualViewport
+  // 获取可视区域高度
+  setTimeout(() => {
+    console.log('输入框聚焦')
+
+    console.log(visualViewport.height, 'visualViewport.height')
+    const keyboardHeight = window.innerHeight - visualViewport.height
+    console.log(window.innerHeight, 'window.innerHeight')
+    console.log(keyboardHeight, 'keyboardHeight')
+
+    adjustFooterPosition(visualViewport.height)
+  }, 200)
+}
+
+const onBlur = function () {
+  const visualViewport = window.visualViewport
+  setTimeout(() => {
+    console.log('输入框失焦')
+
+    const keyboardHeight = window.innerHeight - visualViewport.height
+    console.log(window.innerHeight, 'window.innerHeight')
+    console.log(visualViewport.height, 'visualViewport.height')
+    console.log(keyboardHeight, 'keyboardHeight')
+    adjustFooterPosition(visualViewport.height)
+  }, 200)
+}
+
 onMounted(async () => {
   const isPhone =
     /phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone/i.test(
@@ -492,8 +548,9 @@ onMounted(async () => {
         <!-- 第二行输入框 -->
         <div class="footer-second-line">
           <img :src="msgBtn" class="msg-icon" />
-          <el-input type="textarea" v-model="message" :autosize="{ minRows: 1, maxRows: 4 }" placeholder="给AI小财神发消息..."
-            class="msg-input" @keydown.enter.exact.prevent="isLoading ? null : sendMessage()" resize="none">
+          <el-input type="textarea" v-model="message" @focus="onFocus" @blur="onBlur"
+            :autosize="{ minRows: 1, maxRows: 4 }" placeholder="给AI小财神发消息..." class="msg-input"
+            @keydown.enter.exact.prevent="isLoading ? null : sendMessage()" resize="none">
           </el-input>
         </div>
       </el-footer>
@@ -575,8 +632,21 @@ onMounted(async () => {
 </style>
 
 <style scoped>
+html {
+  overflow: hidden;
+  position: fixed
+}
+
+body {
+  overflow: hidden;
+}
+
+#app {
+  overflow: hidden;
+}
 
 .homepage {
+  /* height: var(--app-height, 100vh); */
   height: var(--app-height, 100vh);
   margin: 0 auto;
   background-image: url(/src/assets/img/homePage/bk.png);
@@ -591,30 +661,7 @@ onMounted(async () => {
   right: 0;
   bottom: 0;
   width: 100%;
-  -webkit-overflow-scrolling: touch;
-}
-
-/* iOS处理相关样式 */
-body.ios-device {
-  position: fixed;
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-}
-
-/* iOS键盘弹出时的样式 */
-@media (max-height: 400px) {
-  body.ios-device .homepage-footer {
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    z-index: 999;
-  }
-
-  body.ios-device .el-main {
-    margin-bottom: 120px;
-  }
+  /* -webkit-overflow-scrolling: touch; */
 }
 
 .homepage .el-container {