qcast3/qcast-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

contextmenu modal 추가

Browse Source
This commit is contained in:
minsik 2024-11-01 18:10:42 +09:00
parent 51c4fcfe14
commit ea8b4a3e36
2 changed files with 12 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/common/context-menu/QContextMenu.jsx
View File

@ -3,12 +3,14 @@ import { useEffect } from 'react'
import '@/styles/contents.scss'
import { useRecoilState } from 'recoil'
import { contextMenuListState, contextMenuState } from '@/store/contextMenu'
import { useTempGrid } from '@/hooks/useTempGrid'
export default function QContextMenu(props) {
const { contextRef, canvasProps, handleKeyup } = props
const [contextMenu, setContextMenu] = useRecoilState(contextMenuState)
const [contextMenuList, setContextMenuList] = useRecoilState(contextMenuListState)
const activeObject = canvasProps?.getActiveObject() //액티브된 객체를 가져옴
const { tempGridMode, setTempGridMode } = useTempGrid()
let contextType = ''
@ -32,6 +34,7 @@ export default function QContextMenu(props) {
const handleContextMenu = (e) => {
// e.preventDefault() //기존 contextmenu 막고
if (tempGridMode) return
const position = {
x: window.innerWidth / 2 < e.pageX ? e.pageX - 240 : e.pageX,
y: window.innerHeight / 2 < e.pageY ? getYPosition(e) : e.pageY,

13
src/hooks/useContextMenu.js
View File

@ -43,12 +43,11 @@ export function useContextMenu() {
const { addPopup } = usePopup()
const [popupId, setPopupId] = useState(uuidv4())
const [gridColor, setGridColor] = useRecoilState(gridColorState)
const { deleteObject, moveObject, copyObject, editText, changeDimensionExtendLine } = useCommonUtils()
const { deleteObject, moveObject, copyObject, editText, changeDimensionExtendLine, deleteOuterLineObject } = useCommonUtils()
const [qContextMenu, setQContextMenu] = useRecoilState(contextMenuState)
const [cell, setCell] = useState(null)
const [column, setColumn] = useState(null)
const { handleZoomClear } = useCanvasEvent()
const currentMenuSetting = () => {
switch (currentMenu) {
case MENU.PLAN_DRAWING:
@ -172,6 +171,7 @@ export function useContextMenu() {
{
id: 'sizeEdit',
name: getMessage('contextmenu.size.edit'),
component: <SizeSetting id={popupId} target={currentObject} />,
},
{
id: 'remove',
@ -207,6 +207,7 @@ export function useContextMenu() {
{
id: 'flowDirectionEdit',
name: getMessage('contextmenu.flow.direction.edit'),
component: <FlowDirectionSetting id={popupId} />,
},
],
])
@ -241,7 +242,7 @@ export function useContextMenu() {
if (temp.length > 0) menu = temp
}
handleClick(null, menu)
if (menu) handleClick(null, menu)
}
useEffect(() => {
@ -342,6 +343,7 @@ export function useContextMenu() {
{
id: 'sizeEdit',
name: getMessage('contextmenu.size.edit'),
component: <SizeSetting id={popupId} target={currentObject} />,
},
{
id: 'openingRemove',
@ -419,19 +421,23 @@ export function useContextMenu() {
])
break
case 'lineGrid':
case 'tempGrid':
setContextMenu([
[
{
id: 'gridMove',
name: getMessage('modal.grid.move'),
component: <GridMove id={popupId} />,
},
{
id: 'gridCopy',
name: getMessage('modal.grid.copy'),
component: <GridCopy id={popupId} />,
},
{
id: 'gridColorEdit',
name: getMessage('contextmenu.grid.color.edit'),
component: <ColorPickerModal id={popupId} color={gridColor} setColor={setGridColor} />,
},
{
id: 'remove',
@ -561,7 +567,6 @@ export function useContextMenu() {
])
break
case 'module':
case 'dimensionLineText':
setContextMenu([
[
{