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

- 添加 showAction 控制编辑按钮显示
- 实现文本域聚焦和失焦时的编辑按钮显示和隐藏
-优化键盘弹出和收起时的编辑按钮显示逻辑
-修复文档中描述的产品问卷配置- 优化问卷设计页面的题目编辑功能
This commit is contained in:
陈昱达
2025-03-07 16:56:25 +08:00
parent ae04b89a62
commit 8f903e3869
11 changed files with 930 additions and 67 deletions

View File

@@ -1,12 +1,9 @@
<template>
<div
ref="editor"
:contenteditable="active"
class="van-field"
v-html="modelValue"
></div>
<div ref="editor" :contenteditable="active" class="van-field" v-html="modelValue"></div>
<div v-if="showAction && active" ref="editorAction" class="editor-action">
<button v-for="item in actions" :key="item.name" @click="funEvent(item,$event)">{{ item.label }}</button>
<button v-for="item in actions" :key="item.name" @click="funEvent(item, $event)">
{{ item.label }}
</button>
</div>
</template>
@@ -52,7 +49,7 @@ watch(
() => props.active,
(newVal) => {
if (newVal) {
showAction.value = true;
// showAction.value = true;
} else {
save(editor.value);
setTimeout(() => {
@@ -105,7 +102,7 @@ onMounted(() => {
position: fixed;
bottom: 0;
left: 0;
z-index: 3000;
z-index: 2008;
width: 100%;
height: 40px;
padding: 0 10px;