Merge branch 'dev' of https://git.jetbrains.space/nalpari/q-cast-iii/qcast-front into dev

src/components/common/color-picker/ColorPickerModal.jsx

@@ -33,9 +33,9 @@ export default function ColorPickerModal(props) {
   }, [isShow])
 
   return (
-    <WithDraggable isShow={true} pos={pos ?? ''}>
+    <WithDraggable isShow={true} pos={pos ?? ''} handle=".modal-handle">
       <div className={`modal-pop-wrap lr mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.color.picker.title')}</h1>
           <button
             className="modal-close"
@@ -78,6 +78,7 @@ export default function ColorPickerModal(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/common/draggable/WithDraggable.jsx

@@ -20,7 +20,7 @@ export default function WithDraggable({ isShow, children, pos = { x: 0, y: 0 },
         <Draggable
           position={{ x: position.x, y: position.y }}
           onDrag={(e, data) => handleOnDrag(e, data)}
-          handle={handle === '' ? '.modal-head' : handle}
+          handle={handle === '' ? '.modal-handle' : handle}
         >
           {children}
         </Draggable>

src/components/common/font/FontSetting.jsx

@@ -67,9 +67,9 @@ export default function FontSetting(props) {
   }
 
   return (
-    <WithDraggable isShow={true} pos={pos}>
+    <WithDraggable isShow={true} pos={pos} handle=".modal-handle">
       <div className={`modal-pop-wrap lrr mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.font')}</h1>
           <button
             className="modal-close"
@@ -133,6 +133,7 @@ export default function FontSetting(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/Slope.jsx

@@ -15,7 +15,7 @@ export default function Slope({ id, pos = { x: 50, y: 230 } }) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xxxm`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('plan.menu.placement.surface.slope.setting')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -45,6 +45,7 @@ export default function Slope({ id, pos = { x: 50, y: 230 } }) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/auxiliary/AuxiliaryDrawing.jsx

@@ -126,7 +126,7 @@ export default function AuxiliaryDrawing({ id, pos = { x: 50, y: 230 } }) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap r`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.auxiliary.drawing')}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -160,6 +160,7 @@ export default function AuxiliaryDrawing({ id, pos = { x: 50, y: 230 } }) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/auxiliary/AuxiliaryEdit.jsx

@@ -46,7 +46,7 @@ export default function AuxiliaryEdit(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xm mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage(type === 'copy' ? 'modal.auxiliary.copy' : 'modal.auxiliary.move')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -111,6 +111,7 @@ export default function AuxiliaryEdit(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/auxiliary/AuxiliarySize.jsx

@@ -14,7 +14,7 @@ export default function AuxiliarySize(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xm mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.auxiliary.size.edit')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -63,6 +63,7 @@ export default function AuxiliarySize(props) {
             <button className="btn-frame modal act">{getMessage('modal.common.save')}</button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/basic/BasicSetting.jsx

@@ -51,7 +51,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap lx-2`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('plan.menu.module.circuit.setting.default')}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -115,6 +115,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
             )}
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx

@@ -83,7 +83,7 @@ export default function CircuitTrestleSetting({ id }) {
   return (
     <WithDraggable isShow={true} pos={{ x: 50, y: 230 }}>
       <div className={`modal-pop-wrap l-2`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.circuit.trestle.setting')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -131,6 +131,7 @@ export default function CircuitTrestleSetting({ id }) {
             </div>
           )}
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/dimensionLine/DimensionLineSetting.jsx

@@ -85,7 +85,7 @@ export default function DimensionLineSetting(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xm mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('contextmenu.display.edit')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -141,6 +141,7 @@ export default function DimensionLineSetting(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/distance/Distance.jsx

@@ -18,7 +18,7 @@ export default function Distance(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xxxm`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.distance')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -68,6 +68,7 @@ export default function Distance(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/eavesGable/EavesGableEdit.jsx

@@ -40,7 +40,7 @@ export default function EavesGableEdit({ id, pos = { x: 50, y: 230 } }) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap r`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.eaves.gable.edit')}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -62,6 +62,7 @@ export default function EavesGableEdit({ id, pos = { x: 50, y: 230 } }) {
             {type === TYPES.SHED && <Shed {...shedProps} />}
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/flowDirection/FlowDirectionSetting.jsx

@@ -65,7 +65,7 @@ export default function FlowDirectionSetting(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap ml mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.shape.flow.direction.setting')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -176,6 +176,7 @@ export default function FlowDirectionSetting(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/grid/DotLineGrid.jsx

@@ -179,7 +179,7 @@ export default function DotLineGrid(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap ssm mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.canvas.setting.grid.dot.line.setting')}</h1>
           <button
             className="modal-close"
@@ -293,6 +293,7 @@ export default function DotLineGrid(props) {
           </div>
         </div>
       </div>
+      <div className="modal-foot modal-handle"></div>
     </WithDraggable>
   )
 }

src/components/floor-plan/modal/grid/GridCopy.jsx

@@ -22,7 +22,7 @@ export default function GridCopy(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xm mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.grid.copy')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -77,6 +77,7 @@ export default function GridCopy(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/grid/GridMove.jsx

@@ -75,7 +75,7 @@ export default function GridMove(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xm mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.grid.move')} </h1>
           <button className="modal-close" onClick={handleClose}>
             닫기
@@ -156,6 +156,7 @@ export default function GridMove(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/lineProperty/LinePropertySetting.jsx

@@ -52,7 +52,7 @@ export default function LinePropertySetting(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap r mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('contextmenu.line.property.edit')} </h1>
           <button className="modal-close" onClick={() => handleClosePopup()}>
             닫기
@@ -91,6 +91,7 @@ export default function LinePropertySetting(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/module/CircuitNumberEdit.jsx

@@ -16,7 +16,7 @@ export default function CircuitNumberEdit(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xm mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title"> {getMessage('modal.module.circuit.number.edit')}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -42,6 +42,7 @@ export default function CircuitNumberEdit(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/module/PanelEdit.jsx

@@ -84,7 +84,7 @@ export default function PanelEdit(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xm mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">
             {getMessage([PANEL_EDIT_TYPE.MOVE, PANEL_EDIT_TYPE.COLUMN_MOVE].includes(type) ? 'modal.move.setting' : 'modal.copy.setting')}{' '}
           </h1>
@@ -139,6 +139,7 @@ export default function PanelEdit(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/module/column/ColumnInsert.jsx

@@ -26,7 +26,7 @@ export default function ColumnInsert(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap r mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.panel.column.insert')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -105,6 +105,7 @@ export default function ColumnInsert(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/module/column/ColumnRemove.jsx

@@ -29,7 +29,7 @@ export default function ColumnRemove(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap r mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.panel.column.remove')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -115,6 +115,7 @@ export default function ColumnRemove(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/module/row/RowInsert.jsx

@@ -26,7 +26,7 @@ export default function RowInsert(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap r mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.row.insert')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -105,6 +105,7 @@ export default function RowInsert(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/module/row/RowRemove.jsx

@@ -29,7 +29,7 @@ export default function RowRemove(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap r mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.row.remove')}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -115,6 +115,7 @@ export default function RowRemove(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/movement/MovementSetting.jsx

@@ -18,7 +18,7 @@ export default function MovementSetting({ id, pos = { x: 50, y: 230 } }) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap r`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('plan.menu.roof.cover.movement.shape.updown')}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -43,6 +43,7 @@ export default function MovementSetting({ id, pos = { x: 50, y: 230 } }) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/object/DormerOffset.jsx

@@ -42,7 +42,7 @@ export default function DormerOffset(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xm mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{title}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -103,6 +103,7 @@ export default function DormerOffset(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/object/ObjectSetting.jsx

@@ -77,7 +77,7 @@ export default function ObjectSetting({ id, pos = { x: 50, y: 230 } }) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap lrr`} style={{ visibility: isHidden ? 'hidden' : 'visible' }}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('plan.menu.placement.surface.object')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -109,6 +109,7 @@ export default function ObjectSetting({ id, pos = { x: 50, y: 230 } }) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/object/RoofMaterialSetting.jsx

@@ -23,7 +23,7 @@ export default function RoofMaterialSetting(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xxxm mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.roof.material.edit')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -39,6 +39,7 @@ export default function RoofMaterialSetting(props) {
             <button className="btn-frame modal act">{getMessage('modal.common.save')}</button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/object/SizeSetting.jsx

@@ -47,7 +47,7 @@ export default function SizeSetting(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap ssm mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.size.setting')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -95,6 +95,7 @@ export default function SizeSetting(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/outerlinesetting/PropertiesSetting.jsx

@@ -10,7 +10,7 @@ export default function PropertiesSetting(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap ssm`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.canvas.setting.wallline.properties.setting')}</h1>
           <button className="modal-close" onClick={() => closeModal(id)}>
             닫기
@@ -38,6 +38,7 @@ export default function PropertiesSetting(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/outerlinesetting/WallLineSetting.jsx

@@ -116,7 +116,7 @@ export default function WallLineSetting(props) {
   return (
     <WithDraggable isShow={true} pos={{ x: 50, y: 230 }}>
       <div className={`modal-pop-wrap r mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.cover.outline.drawing')}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}></button>
         </div>
@@ -184,6 +184,7 @@ export default function WallLineSetting(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/placementShape/PlacementShapeDrawing.jsx

@@ -123,7 +123,7 @@ export default function PlacementShapeDrawing({ id, pos = { x: 50, y: 230 } }) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap r`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('plan.menu.placement.surface.drawing')}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -159,6 +159,7 @@ export default function PlacementShapeDrawing({ id, pos = { x: 50, y: 230 } }) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx

@@ -56,25 +56,24 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
   ]
 
   // 데이터를 최초 한 번만 조회
-  // useEffect(() => {    
+  // useEffect(() => {
   //   if (!basicSetting || !currentRoof || Object.keys(currentRoof).length === 0 || Object.keys(basicSetting).length === 0) return
-  //   const raftCodeList = findCommonCode('203800')    
+  //   const raftCodeList = findCommonCode('203800')
   //   setRaftCodes(raftCodeList)
   //   console.log('🚀 ~ useEffect ~ >>>>>>>>>>>>> raftCodeList 11 :', raftCodeList)
-        
+
-    
   //   if (addedRoofs[0].roofAngleSet && addedRoofs[0].roofAngleSet?.length > 0) {
   //     setCurrentRoof({ ...currentRoof, roofSizeSet: String(addedRoofs[0].roofSizeSet), roofAngleSet: addedRoofs[0].roofAngleSet })
   //   } else if (basicSetting.roofAngleSet && basicSetting.roofAngleSet?.length > 0) {
   //     setCurrentRoof({ ...currentRoof, roofSizeSet: String(basicSetting.roofSizeSet), roofAngleSet: basicSetting.roofAngleSet })
-  //   }    
+  //   }
   // }, [])
 
   useEffect(() => {
     if (addedRoofs.length > 0) {
       const raftCodeList = findCommonCode('203800')
       setRaftCodes(raftCodeList)
-      
+
       setCurrentRoof({ ...addedRoofs[0] })
     }
   }, [addedRoofs])
@@ -182,7 +181,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap ll mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('plan.menu.placement.surface.initial.setting')}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -349,7 +348,8 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                                 options={raftCodes}
                                 ref={roofRef.rafter}
                                 title={
-                                  raftCodes?.find((r) => r.clCode === (currentRoof?.raft === undefined ? currentRoof?.raftBaseCd : currentRoof?.raft)).clCodeNm
+                                  raftCodes?.find((r) => r.clCode === (currentRoof?.raft === undefined ? currentRoof?.raftBaseCd : currentRoof?.raft))
+                                    .clCodeNm
                                 }
                                 value={currentRoof?.raft === undefined ? currentRoof?.raftBaseCd : currentRoof?.raft}
                                 onChange={(e) => handleRafterChange(e.clCode)}
@@ -423,6 +423,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
         </div>
         {showSizeGuideModal && <SizeGuide setShowSizeGuidModal={setShowSizeGuidModal} />}
         {showMaterialGuideModal && <MaterialGuide setShowMaterialGuidModal={setShowMaterialGuidModal} />}
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/placementSurface/PlacementSurfaceSetting.jsx

@@ -242,7 +242,7 @@ export default function PlacementSurfaceSetting({ id, pos = { x: 50, y: 230 } })
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap lr-2`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('plan.menu.placement.surface.arrangement')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -290,6 +290,7 @@ export default function PlacementSurfaceSetting({ id, pos = { x: 50, y: 230 } })
             </div>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/roofAllocation/ActualSizeSetting.jsx

@@ -63,7 +63,7 @@ export default function ActualSizeSetting(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap ssm mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.actual.size.setting')}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -116,6 +116,7 @@ export default function ActualSizeSetting(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/roofAllocation/ContextRoofAllocationSetting.jsx

@@ -45,7 +45,7 @@ export default function ContextRoofAllocationSetting(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap lr mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('plan.menu.estimate.roof.alloc')}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -214,6 +214,7 @@ export default function ContextRoofAllocationSetting(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx

@@ -49,7 +49,7 @@ export default function RoofAllocationSetting(props) {
       <div className={`modal-pop-wrap lr mount`}>
         {currentRoofList && (
           <>
-            <div className="modal-head">
+            <div className="modal-head modal-handle">
               <h1 className="title">{getMessage('plan.menu.estimate.roof.alloc')}</h1>
               <button className="modal-close" onClick={() => closePopup(id)}>
                 닫기
@@ -235,6 +235,7 @@ export default function RoofAllocationSetting(props) {
             </div>
           </>
         )}
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/roofShape/RoofShapePassivitySetting.jsx

@@ -31,7 +31,7 @@ export default function RoofShapePassivitySetting({ id, pos = { x: 50, y: 230 }
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xxm`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('plan.menu.roof.cover.roof.shape.passivity.setting')}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -67,6 +67,7 @@ export default function RoofShapePassivitySetting({ id, pos = { x: 50, y: 230 }
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/roofShape/RoofShapeSetting.jsx

@@ -90,7 +90,7 @@ export default function RoofShapeSetting({ id, pos = { x: 50, y: 230 } }) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap lr mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.roof.shape.setting')}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -120,6 +120,7 @@ export default function RoofShapeSetting({ id, pos = { x: 50, y: 230 } }) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/setting01/SettingModal01.jsx

@@ -75,7 +75,7 @@ export default function SettingModal01(props) {
     <>
       <WithDraggable isShow={true} pos={{ x: 1275, y: 180 }}>
         <div className={`modal-pop-wrap sm mount`}>
-          <div className="modal-head">
+          <div className="modal-head modal-handle">
             <h1 className="title">{getMessage('modal.canvas.setting')}</h1>
             <button className="modal-close" onClick={() => closePopup(id, true)}>
               닫기
@@ -100,6 +100,7 @@ export default function SettingModal01(props) {
             {buttonAct === 2 && <SecondOption {...secondProps} />}
             {buttonAct === 3 && <GridOption {...gridProps} />}
           </div>
+          <div className="modal-foot modal-handle"></div>
         </div>
       </WithDraggable>
     </>

src/components/floor-plan/modal/setting01/dimensionLine/DimensionLineSetting.jsx

@@ -192,7 +192,7 @@ export default function DimensionLineSetting(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xxxm mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.canvas.setting.font.plan.absorption.dimension.line')} </h1>
           <button
             className="modal-close"
@@ -258,6 +258,7 @@ export default function DimensionLineSetting(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/setting01/planSize/PlanSizeSetting.jsx

@@ -57,7 +57,7 @@ export default function PlanSizeSetting(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xsm mount`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.canvas.setting.font.plan.absorption.plan.size.setting')}</h1>
           <button
             className="modal-close"
@@ -104,6 +104,7 @@ export default function PlanSizeSetting(props) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/components/floor-plan/modal/wallLineOffset/WallLineOffsetSetting.jsx

@@ -41,7 +41,7 @@ export default function WallLineOffsetSetting({ id, pos = { x: 50, y: 230 } }) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap r`}>
-        <div className="modal-head">
+        <div className="modal-head modal-handle">
           <h1 className="title">{getMessage('modal.wallline.offset.setting')}</h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
@@ -66,6 +66,7 @@ export default function WallLineOffsetSetting({ id, pos = { x: 50, y: 230 } }) {
             </button>
           </div>
         </div>
+        <div className="modal-foot modal-handle"></div>
       </div>
     </WithDraggable>
   )

src/hooks/useAxios.js

@@ -97,13 +97,11 @@ export function useAxios(lang = '') {
 
   const getFetcher = async (url) => {
     const res = await get({ url })
-    console.log('🚀 ~ getFetcher ~ res:', res)
     return res
   }
 
-  const postFetcher = async (url, { arg }) => {
+  const postFetcher = async (url, arg) => {
     const res = await post({ url, data: arg })
-    console.log('🚀 ~ postFetcher ~ res:', res)
     return res
   }
 

src/util/common-utils.js

@@ -134,3 +134,18 @@ export const getQueryString = (o) => {
     .join('&')
   return `?${queryString}`
 }
+
+export const unescapeString = (str) => {
+  const regex = /&(amp|lt|gt|quot|#39);/g
+  const chars = {
+    '&': '&',
+    '&lt;': '<',
+    '&gt;': '>',
+    '&quot;': '"',
+    '&#39;': "'",
+  }
+
+  if (regex.test(str)) {
+    return str.replace(regex, (matched) => chars[matched] || matched)
+  }
+}