feat: IOS优化

- 调整editorAction浮动， 适配IOS

src/components/contenteditable.vue

@@ -35,7 +35,7 @@
 </template>
 
 <script setup>
-import { defineEmits, ref, onMounted, watch } from 'vue';
+import { defineEmits, ref, onMounted, watch, onBeforeUnmount } from 'vue';
 import { v4 as uuidv4 } from 'uuid';
 import CommonApi from '@/api/common.js';
 
@@ -225,10 +225,45 @@ const checkContains = (element, target) => {
   }
 };
 
+const isIOS = ref(/iPad|iPhone|iPod/.test(navigator.userAgent));
+const keyboardVisible = ref(false);
+
+// Handle iOS keyboard events
+const handleVisualViewportResize = () => {
+  if (!isIOS.value) return;
+  
+  const viewport = window.visualViewport;
+  if (!viewport) return;
+  
+  // If the viewport height is significantly reduced, the keyboard is likely visible
+  const keyboardShown = viewport.height < window.innerHeight * 0.8;
+  keyboardVisible.value = keyboardShown;
+  
+  if (keyboardShown && editorAction.value) {
+    // Position the editor action bar above the keyboard
+    editorAction.value.style.bottom = `${window.innerHeight - viewport.height}px`;
+  } else if (editorAction.value) {
+    // Reset position when keyboard is hidden
+    editorAction.value.style.bottom = 'env(safe-area-inset-bottom, 0)';
+  }
+};
+
 onMounted(() => {
   onChange(editor.value);
   editor.value.addEventListener('focus', () => {
     showAction.value = true;
+    
+    // iOS specific handling for keyboard
+    if (isIOS.value) {
+      // Add a small delay to ensure the keyboard is fully shown
+      setTimeout(() => {
+        if (editorAction.value) {
+          // On iOS, adjust position when keyboard appears
+          window.scrollTo(0, 0);
+          document.body.scrollTop = 0;
+        }
+      }, 300);
+    }
   });
 
   document.addEventListener('click', (e) => {
@@ -248,6 +283,18 @@ onMounted(() => {
   document.addEventListener('resize', () => {
     showAction.value = false;
   });
+  
+  // Set up visual viewport event listener for iOS
+  if (window.visualViewport) {
+    window.visualViewport.addEventListener('resize', handleVisualViewportResize);
+  }
+});
+
+onBeforeUnmount(() => {
+  // Clean up event listeners
+  if (window.visualViewport) {
+    window.visualViewport.removeEventListener('resize', handleVisualViewportResize);
+  }
 });
 
 const onFocus = (e) => {
@@ -345,12 +392,25 @@ const insertImageAtCaret = (html) => {
   padding: 0 10px;
   background: #fff;
   line-height: 40px;
+  /* iOS specific fixes */
+  -webkit-transform: translateZ(0);
+  transform: translateZ(0);
+  /* Ensure it works with iOS keyboard */
+  bottom: env(safe-area-inset-bottom, 0);
+  /* Add box shadow for better visibility */
+  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
 
   & button {
     border: none;
     background: #fff;
     color: #000;
     outline: none;
+    /* Improve touch target size for iOS */
+    min-width: 44px;
+    min-height: 40px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
   }
 
   button + button {