fix: 新增右键和删除功能

src/views/chart/ContentEdit/index.vue

@@ -12,11 +12,24 @@
     <div id="go-chart-edit-content">
       <!-- 展示 -->
       <EditRange>
+        <!-- 右键 -->
+        <n-dropdown
+          placement="bottom-start"
+          trigger="manual"
+          size="small"
+          :x="mousePosition.x"
+          :y="mousePosition.y"
+          :options="menuOptions"
+          :show="showDropdownRef"
+          :on-clickoutside="onClickoutside"
+          @select="handleMenuSelect"
+        />
         <ShapeBox
           v-for="(item, index) in chartEditStore.getComponentList"
           :key="item.id"
           :index="index"
           :style="useComponentStyle(item.attr, index)"
+          @contextmenu="handleContextMenu($event, index)"
         >
           <component
             class="edit-content-chart"
@@ -40,13 +53,22 @@ import { ContentBox } from '../ContentBox/index'
 import { EditRange } from './components/EditRange'
 import { EditBottom } from './components/EditBottom'
 import { ShapeBox } from './components/ShapeBox/index'
+
 import { useLayout } from './hooks/useLayout.hook'
 import { handleDrop, handleDragOver } from './hooks/useDrop.hook'
+import { useContextMenu } from './hooks/useContextMenu.hook'
 import { getChartEditStore } from './hooks/useStore.hook'
 import { useComponentStyle, useSizeStyle } from './hooks/useStyle.hook'
 
 const chartEditStore = getChartEditStore()
-
+const {
+  showDropdownRef,
+  menuOptions,
+  onClickoutside,
+  mousePosition,
+  handleContextMenu,
+  handleMenuSelect,
+} = useContextMenu()
 // 布局处理
 useLayout()
 </script>