feat(component): 优化 contenteditable组件功能

- 添加 showAction 控制编辑按钮显示
- 实现文本域聚焦和失焦时的编辑按钮显示和隐藏
-优化键盘弹出和收起时的编辑按钮显示逻辑
-修复文档中描述的产品问卷配置- 优化问卷设计页面的题目编辑功能

src/views/Design/components/Questions/Choice.vue

@@ -6,13 +6,16 @@
     label-align="top"
     class="base-select"
   >
-    <template #label>
+    <template #left-icon>
       <div
+        class="van-filed"
+        v-html="element.title"
         :contenteditable="active"
-        class="van-field"
-        @blur="saveStem($event, element)"
-        v-html="element.stem"
-      ></div>
+        @blur="saveStem($event, element, 'title')"
+      />
+    </template>
+    <template #label>
+      <contenteditable v-model="element.stem" :active="active"></contenteditable>
     </template>
     <template #input>
       <template v-for="(item, index) in element.options" :key="index">
@@ -76,7 +79,8 @@
 </template>
 <script setup>
 import OptionAction from '@/views/Design/components/ActionCompoents/OptionAction.vue';
-import { ref } from 'vue';
+import { ref, defineAsyncComponent } from 'vue';
+const Contenteditable = defineAsyncComponent(() => import('@/components/contenteditable.vue'));
 const props = defineProps({
   element: {
     type: Object,
@@ -96,8 +100,8 @@ const element = ref(props.element);
 const saveOption = (e, ele) => {
   ele.option = e.target.innerHTML;
 };
-const saveStem = (e, ele) => {
-  ele.stem = e.target.innerHTML;
+const saveStem = (e, ele, key) => {
+  ele[key] = e.target.innerHTML;
 };
 </script>
 <style scoped lang="scss">