Merge branch 'qcast-pub' into dev
This commit is contained in:
commit
6da947f6da
@ -2,12 +2,14 @@
|
||||
import { useEffect } from 'react'
|
||||
import '@/styles/contents.scss'
|
||||
import { useRecoilState } from 'recoil'
|
||||
import { contextMenuState } from '@/store/contextMenu'
|
||||
import { contextMenuListState, contextMenuState } from '@/store/contextMenu'
|
||||
|
||||
export default function QContextMenu(props) {
|
||||
const { contextRef, canvasProps, handleKeyup } = props
|
||||
const [contextMenu, setContextMenu] = useRecoilState(contextMenuState)
|
||||
const [contextMenuList, setContextMenuList] = useRecoilState(contextMenuListState)
|
||||
const activeObject = canvasProps?.getActiveObject() //액티브된 객체를 가져옴
|
||||
|
||||
let contextType = ''
|
||||
|
||||
if (activeObject) {
|
||||
@ -19,12 +21,22 @@ export default function QContextMenu(props) {
|
||||
}
|
||||
}
|
||||
|
||||
const getYPosition = (e) => {
|
||||
const contextLength = contextMenuList.reduce((acc, cur, index) => {
|
||||
return acc + cur.length
|
||||
}, 0)
|
||||
return e?.clientY - (contextLength * 25 + contextMenuList.length * 2 * 17)
|
||||
}
|
||||
useEffect(() => {
|
||||
if (!contextRef.current) return
|
||||
|
||||
const handleContextMenu = (e) => {
|
||||
// e.preventDefault() //기존 contextmenu 막고
|
||||
setContextMenu({ visible: true, x: e.pageX, y: e.pageY })
|
||||
const position = {
|
||||
x: window.innerWidth / 2 < e.pageX ? e.pageX - 240 : e.pageX,
|
||||
y: window.innerHeight / 2 < e.pageY ? getYPosition(e) : e.pageY,
|
||||
}
|
||||
setContextMenu({ visible: true, ...position })
|
||||
document.addEventListener('keyup', (e) => handleKeyup(e))
|
||||
canvasProps?.upperCanvasEl.removeEventListener('contextmenu', handleContextMenu) //한번 노출 후 이벤트 삭제
|
||||
}
|
||||
|
||||
@ -15,7 +15,11 @@ export default function MenuDepth01() {
|
||||
const subMenus = useRecoilValue(subMenusState)
|
||||
|
||||
const onClickMenu = ({ id, menu }) => {
|
||||
setCurrentMenu(menu)
|
||||
if (menu === currentMenu) {
|
||||
handleMenu(type)
|
||||
} else {
|
||||
setCurrentMenu(menu)
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
|
||||
@ -14,7 +14,7 @@ export default function AuxiliaryCopy(props) {
|
||||
const [arrow2, setArrow2] = useState(null)
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap xm`}>
|
||||
<div className={`modal-pop-wrap xm mount`}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">{getMessage('modal.auxiliary.copy')} </h1>
|
||||
<button className="modal-close" onClick={() => closePopup(id)}>
|
||||
|
||||
@ -16,7 +16,7 @@ export default function AuxiliaryMove(props) {
|
||||
const [arrow2, setArrow2] = useState(null)
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap xm`}>
|
||||
<div className={`modal-pop-wrap xm mount`}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">{getMessage('modal.auxiliary.move')}</h1>
|
||||
<button className="modal-close" onClick={() => closePopup(id)}>
|
||||
|
||||
@ -11,7 +11,7 @@ export default function AuxiliarySize(props) {
|
||||
const { closePopup } = usePopup()
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap xm`}>
|
||||
<div className={`modal-pop-wrap xm mount`}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">{getMessage('modal.auxiliary.size.edit')} </h1>
|
||||
<button className="modal-close" onClick={() => closePopup(id)}>
|
||||
|
||||
@ -1,17 +1,16 @@
|
||||
import { useState, useEffect, useRef } from 'react'
|
||||
import { useEffect, useRef, useState } from 'react'
|
||||
import WithDraggable from '@/components/common/draggable/WithDraggable'
|
||||
import { usePopup } from '@/hooks/usePopup'
|
||||
import { useMessage } from '@/hooks/useMessage'
|
||||
import { useRecoilState, useRecoilValue } from 'recoil'
|
||||
import { contextPopupPositionState } from '@/store/popupAtom'
|
||||
import QSelectBox from '@/components/common/select/QSelectBox'
|
||||
import { pitchTextSelector } from '@/store/canvasAtom'
|
||||
import { canvasState, pitchTextSelector } from '@/store/canvasAtom'
|
||||
import { defaultSlope } from '@/store/commonAtom'
|
||||
import { canvasState } from '@/store/canvasAtom'
|
||||
|
||||
export default function DimensionLineSetting(props) {
|
||||
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
|
||||
const { id, setIsShow, pos = contextPopupPosition } = props
|
||||
let { id, setIsShow, pos = contextPopupPosition } = props
|
||||
const { getMessage } = useMessage()
|
||||
const { closePopup } = usePopup()
|
||||
const canvas = useRecoilValue(canvasState)
|
||||
@ -79,7 +78,7 @@ export default function DimensionLineSetting(props) {
|
||||
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap xm`}>
|
||||
<div className={`modal-pop-wrap xm mount`}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">{getMessage('contextmenu.display.edit')} </h1>
|
||||
<button className="modal-close" onClick={() => closePopup(id)}>
|
||||
@ -131,7 +130,9 @@ export default function DimensionLineSetting(props) {
|
||||
<div className="warning">{getMessage('modal.display.edit.input.slope.info')}</div>
|
||||
</div>
|
||||
<div className="grid-btn-wrap">
|
||||
<button className="btn-frame modal act" onClick={handleChangeLength}>{getMessage('modal.common.save')}</button>
|
||||
<button className="btn-frame modal act" onClick={handleChangeLength}>
|
||||
{getMessage('modal.common.save')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -60,7 +60,7 @@ export default function FlowDirectionSetting(props) {
|
||||
}, [compasDeg])
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap lx`}>
|
||||
<div className={`modal-pop-wrap lx mount`}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">{getMessage('modal.shape.flow.direction.setting')} </h1>
|
||||
<button className="modal-close" onClick={() => closePopup(id)}>
|
||||
|
||||
@ -14,7 +14,7 @@ export default function ImageSizeSetting(props) {
|
||||
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap xxxm`}>
|
||||
<div className={`modal-pop-wrap xxxm mount`}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">{getMessage('modal.image.size.setting')} </h1>
|
||||
<button className="modal-close" onClick={() => closePopup(id)}>
|
||||
|
||||
@ -15,7 +15,7 @@ export default function CircuitNumberEdit(props) {
|
||||
}
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap xm`}>
|
||||
<div className={`modal-pop-wrap xm mount`}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title"> {getMessage('modal.module.circuit.number.edit')}</h1>
|
||||
<button className="modal-close" onClick={() => closePopup(id)}>
|
||||
|
||||
@ -23,7 +23,7 @@ export default function ColumnInsert(props) {
|
||||
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap r`}>
|
||||
<div className={`modal-pop-wrap r mount`}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">{getMessage('modal.panel.column.insert')} </h1>
|
||||
<button className="modal-close" onClick={() => closePopup(id)}>
|
||||
|
||||
@ -25,7 +25,7 @@ export default function ColumnRemove(props) {
|
||||
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap r`}>
|
||||
<div className={`modal-pop-wrap r mount`}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">{getMessage('modal.panel.column.remove')} </h1>
|
||||
<button className="modal-close" onClick={() => closePopup(id)}>
|
||||
|
||||
@ -23,7 +23,7 @@ export default function RowInsert(props) {
|
||||
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap r`}>
|
||||
<div className={`modal-pop-wrap r mount`}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">{getMessage('modal.row.insert')} </h1>
|
||||
<button className="modal-close" onClick={() => closePopup(id)}>
|
||||
|
||||
@ -25,7 +25,7 @@ export default function RowRemove(props) {
|
||||
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap r`}>
|
||||
<div className={`modal-pop-wrap r mount`}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">{getMessage('modal.row.remove')}</h1>
|
||||
<button className="modal-close" onClick={() => closePopup(id)}>
|
||||
|
||||
@ -14,7 +14,7 @@ export default function DormerOffset(props) {
|
||||
const [arrow2, setArrow2] = useState(null)
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap xm`}>
|
||||
<div className={`modal-pop-wrap xm mount`}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">{getMessage('contextmenu.dormer.offset')}</h1>
|
||||
<button className="modal-close" onClick={() => closePopup(id)}>
|
||||
|
||||
@ -59,12 +59,12 @@ export default function ObjectSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
}
|
||||
|
||||
//개구배치, 그림자배치
|
||||
setIsHidden(true)
|
||||
if (buttonAct === 1 || buttonAct === 2) {
|
||||
applyOpeningAndShadow(objectPlacement, buttonAct, surfaceShapePolygons)
|
||||
} else {
|
||||
applyDormers(dormerPlacement, buttonAct, surfaceShapePolygons)
|
||||
}
|
||||
setIsHidden(true)
|
||||
}
|
||||
|
||||
const buttonMenu = [
|
||||
@ -73,7 +73,7 @@ export default function ObjectSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
{ id: 3, name: getMessage('modal.object.setting.type.triangle.dormer') },
|
||||
{ id: 4, name: getMessage('modal.object.setting.type.pentagon.dormer') },
|
||||
]
|
||||
|
||||
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap lrr`} style={{ visibility: isHidden ? 'hidden' : 'visible' }}>
|
||||
|
||||
@ -22,9 +22,9 @@ export default function RoofMaterialSetting(props) {
|
||||
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap xxxm`}>
|
||||
<div className={`modal-pop-wrap xxxm mount`}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">変更 </h1>
|
||||
<h1 className="title">{getMessage('modal.roof.material.edit')} </h1>
|
||||
<button className="modal-close" onClick={() => closePopup(id)}>
|
||||
닫기
|
||||
</button>
|
||||
@ -36,7 +36,7 @@ export default function RoofMaterialSetting(props) {
|
||||
</div>
|
||||
</div>
|
||||
<div className="grid-btn-wrap">
|
||||
<button className="btn-frame modal act">ストレージ</button>
|
||||
<button className="btn-frame modal act">{getMessage('modal.common.save')}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -16,7 +16,7 @@ export default function RoofAllocationSetting(props) {
|
||||
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos}>
|
||||
<div className={`modal-pop-wrap ml`}>
|
||||
<div className={`modal-pop-wrap ml mount`}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">{getMessage('plan.menu.estimate.roof.alloc')}</h1>
|
||||
<button className="modal-close" onClick={() => closePopup(id)}>
|
||||
|
||||
@ -23,7 +23,7 @@ import FlowDirectionSetting from '@/components/floor-plan/modal/flowDirection/Fl
|
||||
import { useCommonUtils } from './common/useCommonUtils'
|
||||
import { useMessage } from '@/hooks/useMessage'
|
||||
import { useCanvasEvent } from '@/hooks/useCanvasEvent'
|
||||
import { contextMenuState } from '@/store/contextMenu'
|
||||
import { contextMenuListState, contextMenuState } from '@/store/contextMenu'
|
||||
import ImageSizeSetting from '@/components/floor-plan/modal/image/ImageSizeSetting'
|
||||
import PanelEdit from '@/components/floor-plan/modal/module/PanelEdit'
|
||||
import DimensionLineSetting from '@/components/floor-plan/modal/dimensionLine/DimensionLineSetting'
|
||||
@ -36,7 +36,7 @@ import CircuitNumberEdit from '@/components/floor-plan/modal/module/CircuitNumbe
|
||||
export function useContextMenu() {
|
||||
const currentMenu = useRecoilValue(currentMenuState) // 현재 메뉴
|
||||
const setContextPopupPosition = useSetRecoilState(contextPopupPositionState) // 현재 메뉴
|
||||
const [contextMenu, setContextMenu] = useState([[]]) // 메뉴.object 별 context menu
|
||||
const [contextMenu, setContextMenu] = useRecoilState(contextMenuListState) // 메뉴.object 별 context menu
|
||||
const [currentContextMenu, setCurrentContextMenu] = useRecoilState(contextPopupState) // 선택한 contextMenu
|
||||
const currentObject = useRecoilValue(currentObjectState)
|
||||
const { getMessage } = useMessage()
|
||||
@ -222,9 +222,10 @@ export function useContextMenu() {
|
||||
if (menu?.fn) {
|
||||
menu.fn()
|
||||
}
|
||||
|
||||
setContextPopupPosition({
|
||||
x: e?.clientX,
|
||||
y: e?.clientY,
|
||||
x: window.innerWidth / 2,
|
||||
y: 180,
|
||||
})
|
||||
setCurrentContextMenu(menu)
|
||||
setQContextMenu({ ...qContextMenu, visible: false })
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
"header.go": "移動",
|
||||
"header.online.warranty.system": "オンライン保証シ",
|
||||
"header.stem": "ステム",
|
||||
"plan.menu.plan.drawing": "도면작성",
|
||||
"plan.menu.plan.drawing": "물건정보(JA)",
|
||||
"plan.menu.placement.surface.initial.setting": "配置面 初期設定",
|
||||
"modal.placement.initial.setting.plan.drawing.size.stuff": "寸法入力による物品作成",
|
||||
"modal.placement.initial.setting.plan.": "図面の作成方法",
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
"header.go": "이동",
|
||||
"header.online.warranty.system": "온라인 보증 시스템",
|
||||
"header.stem": "Stem",
|
||||
"plan.menu.plan.drawing": "도면작성",
|
||||
"plan.menu.plan.drawing": "물건정보",
|
||||
"plan.menu.placement.surface.initial.setting": "배치면 초기 설정",
|
||||
"modal.placement.initial.setting.plan.drawing": "도면 작성방법",
|
||||
"modal.placement.initial.setting.plan.drawing.size.stuff": "치수 입력에 의한 물건 작성",
|
||||
@ -292,6 +292,7 @@
|
||||
"margin": "간격",
|
||||
"contextmenu.roof.material.placement": "지붕재 배치",
|
||||
"contextmenu.roof.material.edit": "지붕재 변경",
|
||||
"modal.roof.material.edit": "지붕재 변경",
|
||||
"contextmenu.roof.material.remove": "지붕재 삭제",
|
||||
"contextmenu.roof.material.remove.all": "지붕재 전체 삭제",
|
||||
"contextmenu.dormer.offset": "도머 오프셋",
|
||||
|
||||
@ -9,3 +9,9 @@ export const contextMenuState = atom({
|
||||
},
|
||||
dangerouslyAllowMutability: true,
|
||||
})
|
||||
|
||||
export const contextMenuListState = atom({
|
||||
key: 'contextMenuListState',
|
||||
default: null,
|
||||
dangerouslyAllowMutability: true,
|
||||
})
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -39,7 +39,7 @@
|
||||
background-color: #F7F9FA;
|
||||
}
|
||||
&.important_row{
|
||||
background-color: #e7e7e7;
|
||||
background-color: #f5fcff;
|
||||
}
|
||||
}
|
||||
.ag-cell{
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -9,8 +9,6 @@
|
||||
box-sizing: border-box;
|
||||
}
|
||||
html, body{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 16px;
|
||||
}
|
||||
html, body, div, span, applet, object, iframe,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user