From 6a7d3ad363635051a89dbc457d1ef51e5facdebc Mon Sep 17 00:00:00 2001
From: ChangChi <sam54537@gmail.com>
Date: Mon, 20 Mar 2023 13:44:17 +0800
Subject: [PATCH] feat: new context menu logic

---
 .../editor/common/ContextMenu/index.vue       | 20 ++++++++++++++++++-
 src/components/editor/main/Stage.vue          |  8 ++++++++
 2 files changed, 27 insertions(+), 1 deletion(-)

diff --git a/src/components/editor/common/ContextMenu/index.vue b/src/components/editor/common/ContextMenu/index.vue
index 3c35835..d958649 100644
--- a/src/components/editor/common/ContextMenu/index.vue
+++ b/src/components/editor/common/ContextMenu/index.vue
@@ -33,6 +33,12 @@ export default {
     },
     zoom: {
       type: Number
+    },
+    clipboardLength: {
+      type: Number
+    },
+    selectedElementsLength: {
+      type: Number
     }
   },
   data: function () {
@@ -67,9 +73,18 @@ export default {
     menu () {
       if (this.specialState) {
         return [ { name: 'select', action: 'select' } ]
+      } else if (this.selectedElementsLength === 0) {
+        if (this.clipboardLength > 0) {
+          return [
+            { name: 'draw', action: 'draw' },
+            { name: 'paste', action: 'paste' }
+          ]
+        }
+        return [
+          { name: 'draw', action: 'draw' }
+        ]
       }
       return [
-          { name: 'select', action: 'select' },
           { name: 'copy', action: 'copy' },
           { name: 'paste', action: 'paste' },
           { name: 'cut', action: 'cut' },
@@ -85,6 +100,9 @@ export default {
           case 'select':
             this.$emit('clearState')
             break
+          case 'draw':
+            this.$emit('draw')
+            break
           case 'copy':
             this.$emit('copy')
             break
diff --git a/src/components/editor/main/Stage.vue b/src/components/editor/main/Stage.vue
index 69afc2a..fe537cf 100644
--- a/src/components/editor/main/Stage.vue
+++ b/src/components/editor/main/Stage.vue
@@ -37,7 +37,10 @@
         :axis="rightClickPoint"
         :zoom="zoom" 
         :specialState="paint || moveStage"
+        :clipboardLength="clipboard.length"
+        :selectedElementsLength="selectedElements.length"
         @clearState="clearState"
+        @draw="drawState"
         @delete="deleteHandler"
         @copy="copyHandler"
         @cut="cutHandler"
@@ -157,6 +160,11 @@ export default {
       this.moveStage = false
     },
 
+    drawState () {
+      this.paint = true
+      this.moveStage = false
+    },
+
     checkCollision (selectedEls) {
       if (selectedEls.length > 0) {
         const unit = this.gridUnit.current / 10