product/SmartisanNote.Remake
1
0
Fork 0
Code Issues 4 Pull Requests Projects Releases Activity

future #10

Merged
袁涛 merged 37 commits from future into main 2025-10-17 14:46:33 +08:00
Conversation 0 Commits 37 Files Changed 18 +1634 -408
7 changed files with 1634 additions and 408 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 02b0fa260d - Show all commits

169
src/components/RichTextEditor.vue
View File

@@ -24,6 +24,9 @@ const props = defineProps({
const emit = defineEmits(['update:modelValue'])
// 全局常量定义
const DELETE_BUTTON_DELAY = 1000 // 删除按钮延时时间（毫秒），用于防止误触
const editorRef = ref(null)
const content = ref(props.modelValue || '')
const isToolbarVisible = ref(false)
@@ -111,19 +114,17 @@ onMounted(() => {
if (deleteBtn) {
// 先移除可能已有的事件监听器，避免重复
deleteBtn.removeEventListener('click', null)
deleteBtn.removeEventListener('touchend', null)
deleteBtn.addEventListener('click', function (e) {
e.stopPropagation()
container.remove()
handleInput()
})
deleteBtn.addEventListener('touchend', function (e) {
e.stopPropagation()
container.remove()
handleInput()
})
// 添加延时检查，确保删除按钮是可见的才执行删除操作
setTimeout(() => {
deleteBtn.addEventListener('click', function (e) {
e.stopPropagation()
if (deleteBtn.classList.contains('visible')) {
container.remove()
handleInput()
}
})
}, DELETE_BUTTON_DELAY) // 使用全局常量延时，确保删除按钮状态已正确设置
}
// 为图片容器添加短按事件以显示/隐藏删除按钮
@@ -925,19 +926,17 @@ const insertImage = () => {
// 为删除按钮添加点击事件（鼠标和触摸）
// 先移除可能已有的事件监听器，避免重复
deleteBtn.removeEventListener('click', null)
deleteBtn.removeEventListener('touchend', null)
deleteBtn.addEventListener('click', function (e) {
e.stopPropagation()
imgContainer.remove()
handleInput()
})
deleteBtn.addEventListener('touchend', function (e) {
e.stopPropagation()
imgContainer.remove()
handleInput()
})
// 添加延时检查，确保删除按钮是可见的才执行删除操作
setTimeout(() => {
deleteBtn.addEventListener('click', function (e) {
e.stopPropagation()
if (deleteBtn.classList.contains('visible')) {
imgContainer.remove()
handleInput()
}
})
}, DELETE_BUTTON_DELAY) // 使用全局常量延时，确保删除按钮状态已正确设置
// 为图片容器添加短按事件以显示/隐藏删除按钮
let touchStartTime = 0
@@ -1620,19 +1619,17 @@ const wrapOrphanedImages = () => {
console.log('Found existing delete button, adding event listeners')
// 先移除可能已有的事件监听器，避免重复
deleteBtn.removeEventListener('click', null)
deleteBtn.removeEventListener('touchend', null)
deleteBtn.addEventListener('click', function (e) {
e.stopPropagation()
imgContainer.remove()
handleInput()
})
deleteBtn.addEventListener('touchend', function (e) {
e.stopPropagation()
imgContainer.remove()
handleInput()
})
// 添加延时检查，确保删除按钮是可见的才执行删除操作
setTimeout(() => {
deleteBtn.addEventListener('click', function (e) {
e.stopPropagation()
if (deleteBtn.classList.contains('visible')) {
imgContainer.remove()
handleInput()
}
})
}, DELETE_BUTTON_DELAY) // 使用全局常量延时，确保删除按钮状态已正确设置
// 为图片容器添加短按事件以显示/隐藏删除按钮
// 先移除可能已有的事件监听器，避免重复
@@ -1747,19 +1744,17 @@ const wrapOrphanedImages = () => {
// 为删除按钮添加点击事件
// 先移除可能已有的事件监听器，避免重复
deleteBtn.removeEventListener('click', null)
deleteBtn.removeEventListener('touchend', null)
deleteBtn.addEventListener('click', function (e) {
e.stopPropagation()
imgContainer.remove()
handleInput()
})
deleteBtn.addEventListener('touchend', function (e) {
e.stopPropagation()
imgContainer.remove()
handleInput()
})
// 添加延时检查，确保删除按钮是可见的才执行删除操作
setTimeout(() => {
deleteBtn.addEventListener('click', function (e) {
e.stopPropagation()
if (deleteBtn.classList.contains('visible')) {
imgContainer.remove()
handleInput()
}
})
}, DELETE_BUTTON_DELAY) // 使用全局常量延时，确保删除按钮状态已正确设置
// 为图片容器添加短按事件以显示/隐藏删除按钮
let touchStartTime = 0
@@ -1896,19 +1891,17 @@ const adjustExistingImages = () => {
if (deleteBtn) {
// 先移除可能已有的事件监听器，避免重复
deleteBtn.removeEventListener('click', null)
deleteBtn.removeEventListener('touchend', null)
deleteBtn.addEventListener('click', function (e) {
e.stopPropagation()
container.remove()
handleInput()
})
deleteBtn.addEventListener('touchend', function (e) {
e.stopPropagation()
container.remove()
handleInput()
})
// 添加延时检查，确保删除按钮是可见的才执行删除操作
setTimeout(() => {
deleteBtn.addEventListener('click', function (e) {
e.stopPropagation()
if (deleteBtn.classList.contains('visible')) {
imgContainer.remove()
handleInput()
}
})
}, DELETE_BUTTON_DELAY) // 使用全局常量延时，确保删除按钮状态已正确设置
}
// 为图片容器添加短按事件以显示/隐藏删除按钮
@@ -2061,19 +2054,17 @@ defineExpose({
if (deleteBtn) {
// 先移除可能已有的事件监听器，避免重复
deleteBtn.removeEventListener('click', null)
deleteBtn.removeEventListener('touchend', null)
deleteBtn.addEventListener('click', function (e) {
e.stopPropagation()
container.remove()
handleInput()
})
deleteBtn.addEventListener('touchend', function (e) {
e.stopPropagation()
container.remove()
handleInput()
})
// 添加延时检查，确保删除按钮是可见的才执行删除操作
setTimeout(() => {
deleteBtn.addEventListener('click', function (e) {
e.stopPropagation()
if (deleteBtn.classList.contains('visible')) {
imgContainer.remove()
handleInput()
}
})
}, DELETE_BUTTON_DELAY) // 使用全局常量延时，确保删除按钮状态已正确设置
}
// 为图片容器添加短按事件以显示/隐藏删除按钮
@@ -2195,19 +2186,17 @@ defineExpose({
if (deleteBtn) {
// 先移除可能已有的事件监听器，避免重复
deleteBtn.removeEventListener('click', null)
deleteBtn.removeEventListener('touchend', null)
deleteBtn.addEventListener('click', function (e) {
e.stopPropagation()
container.remove()
handleInput()
})
deleteBtn.addEventListener('touchend', function (e) {
e.stopPropagation()
container.remove()
handleInput()
})
// 添加延时检查，确保删除按钮是可见的才执行删除操作
setTimeout(() => {
deleteBtn.addEventListener('click', function (e) {
e.stopPropagation()
if (deleteBtn.classList.contains('visible')) {
imgContainer.remove()
handleInput()
}
})
}, DELETE_BUTTON_DELAY) // 使用全局常量延时，确保删除按钮状态已正确设置
}
// 为图片容器添加短按事件以显示/隐藏删除按钮
@@ -2514,13 +2503,13 @@ defineExpose({
:deep(.editor-content .image-delete-btn) {
position: absolute;
top: 8px;
right: 8px;
width: 24px;
height: 24px;
top: 4px;
right: 4px;
width: 40px;
height: 40px;
cursor: pointer;
z-index: 1000;
transition: opacity 0.2s ease;
transition: opacity calc(v-bind(DELETE_BUTTON_DELAY) / 2 * 1ms) ease;
/* 使用背景图片而不是背景色和边框，确保图标正确显示 */
background-image: url('/assets/icons/drawable-xxhdpi/item_image_btn_unbrella_delete.png');
background-size: contain;
@@ -2529,11 +2518,13 @@ defineExpose({
background-color: transparent; /* 确保背景透明 */
pointer-events: none;
opacity: 0;
display: none;
}
:deep(.editor-content .image-delete-btn.visible) {
pointer-events: all;
opacity: 1;
display: block;
}
:deep(.editor-content .editor-image.draggable) {