From 4f9db4781aa17adaff75bc3f9df2f056f6db0ce6 Mon Sep 17 00:00:00 2001
From: pipipi-pikachu <pipipi_pikachu@163.com>
Date: Thu, 10 Aug 2023 22:35:50 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=8F=8C=E5=87=BB=E5=88=9B=E5=BB=BA?=
 =?UTF-8?q?=E6=96=87=E6=9C=AC=E6=A1=86=EF=BC=88#218=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/Editor/Canvas/index.vue | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/src/views/Editor/Canvas/index.vue b/src/views/Editor/Canvas/index.vue
index ad808129..bf3d5353 100644
--- a/src/views/Editor/Canvas/index.vue
+++ b/src/views/Editor/Canvas/index.vue
@@ -4,6 +4,7 @@
     ref="canvasRef"
     @wheel="$event => handleMousewheelCanvas($event)"
     @mousedown="$event => handleClickBlankArea($event)"
+    @dblclick="$event => handleDblClick($event)"
     v-contextmenu="contextmenus"
     v-click-outside="removeEditorAreaFocus"
   >
@@ -124,6 +125,7 @@ import useSelectAllElement from '@/hooks/useSelectAllElement'
 import useScaleCanvas from '@/hooks/useScaleCanvas'
 import useScreening from '@/hooks/useScreening'
 import useSlideHandler from '@/hooks/useSlideHandler'
+import useCreateElement from '@/hooks/useCreateElement'
 
 import EditableElement from './EditableElement.vue'
 import MouseSelection from './MouseSelection.vue'
@@ -188,6 +190,7 @@ const { deleteAllElements } = useDeleteElement()
 const { pasteElement } = useCopyAndPasteElement()
 const { enterScreeningFromStart } = useScreening()
 const { updateSlideIndex } = useSlideHandler()
+const { createTextElement } = useCreateElement()
 
 // 组件渲染时，如果存在元素焦点，需要清除
 // 这种情况存在于：有焦点元素的情况下进入了放映模式，再退出时，需要清除原先的焦点（因为可能已经切换了页面）
@@ -209,6 +212,23 @@ const handleClickBlankArea = (e: MouseEvent) => {
   removeAllRanges()
 }
 
+// 双击插入文本
+const handleDblClick = (e: MouseEvent) => {
+  if (activeElementIdList.value.length) return
+  if (!viewportRef.value) return
+
+  const viewportRect = viewportRef.value.getBoundingClientRect()
+  const left = (e.pageX - viewportRect.x) / canvasScale.value
+  const top = (e.pageY - viewportRect.y) / canvasScale.value
+
+  createTextElement({
+    left,
+    top,
+    width: 200 / canvasScale.value, // 除以 canvasScale 是为了与点击选区创建的形式保持相同的宽度
+    height: 0,
+  })
+}
+
 // 画布注销时清空格式刷状态
 onUnmounted(() => {
   if (textFormatPainter.value) mainStore.setTextFormatPainter(null)