src/components/common/draggable/WithDraggable.jsx

@@ -24,7 +24,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-handle' : handle} //전체 handle
+          handle= ''//{handle === '' ? '.modal-handle' : handle} //전체 handle
           cancel="input, button, select, textarea, [contenteditable], .sort-select"
         >
           <div className={`modal-pop-wrap ${className}`} style={{ visibility: isHidden ? 'hidden' : 'visible' }}>
@@ -38,17 +38,17 @@ export default function WithDraggable({ isShow, children, pos = { x: 0, y: 0 },
   )
 }
 
-function WithDraggableHeader({ title, onClose, children, isFold, onFold = null }) {
+function WithDraggableHeader({ title, onClose, children }) {
   return (
     <div className="modal-head modal-handle">
       <h1 className="title">{title}</h1>
-      <div className="modal-btn-wrap">
+      <div className='modal-btn-wrap'>
-        {onFold && <button className={`modal-fold ${isFold ? '' : 'act'}`} onClick={onFold}></button>}
+        <button className='modal-fold act'></button>
-        {onClose && (
+      {onClose && (
-          <button className="modal-close" onClick={() => onClose()}>
+        <button className="modal-close" onClick={() => onClose()}>
-            닫기
+          닫기
-          </button>
+        </button>
-        )}
+      )}
       </div>
     </div>
   )

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

@@ -4,7 +4,6 @@ import { globalPitchState, pitchSelector, pitchTextSelector } from '@/store/canv
 import { useRecoilState } from 'recoil'
 import { useRef } from 'react'
 import { usePopup } from '@/hooks/usePopup'
-import { CalculatorInput } from '@/components/common/input/CalcInput'
 
 export default function Slope({ id, pos = { x: 50, y: 230 } }) {
   const { getMessage } = useMessage()
@@ -23,19 +22,7 @@ export default function Slope({ id, pos = { x: 50, y: 230 } }) {
               {getMessage('slope')}
             </span>
             <div className="input-grid mr5">
-              {/*<input type="text" className="input-origin block" defaultValue={globalPitch} ref={inputRef} />*/}
+              <input type="text" className="input-origin block" defaultValue={globalPitch} ref={inputRef} />
-              <CalculatorInput
-                id=""
-                name=""
-                label=""
-                className="input-origin block"
-                ref={inputRef}
-                value={globalPitch}
-                options={{
-                  allowNegative: false,
-                  allowDecimal: true //(index !== 0),
-                }}
-              ></CalculatorInput>
             </div>
             <span className="thin">{pitchText}</span>
           </div>

src/components/floor-plan/modal/eavesGable/type/Gable.jsx

@@ -98,7 +98,7 @@ export default function Gable({ pitchRef, offsetRef, widthRef, radioTypeRef, pit
                     }}
                     options={{
                       allowNegative: false,
-                      allowDecimal: true //(index !== 0),
+                      allowDecimal: false //(index !== 0),
                     }}
                   ></CalculatorInput>
                 </div>

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

@@ -13,7 +13,6 @@ import { useCommonCode } from '@/hooks/common/useCommonCode'
 import { globalLocaleStore } from '@/store/localeAtom'
 import { currentAngleTypeSelector, pitchTextSelector } from '@/store/canvasAtom'
 import { normalizeDecimalLimit, normalizeDigits } from '@/util/input-utils'
-import { CalculatorInput } from '@/components/common/input/CalcInput'
 
 export default function ContextRoofAllocationSetting(props) {
   const contextPopupPosition = useRecoilValue(contextPopupPositionState)
@@ -205,30 +204,15 @@ export default function ContextRoofAllocationSetting(props) {
                         <div className="flex-ment">
                           <span>{getMessage('modal.object.setting.offset.slope')}</span>
                           <div className="input-grid">
-                            {/*<input*/}
+                            <input
-                            {/*  type="text"*/}
+                              type="text"
-                            {/*  className="input-origin block"*/}
-                            {/*  onChange={(e) => {*/}
-                            {/*    e.target.value = normalizeDecimalLimit(e.target.value, 2)*/}
-                            {/*    handleChangePitch(e, index)*/}
-                            {/*  }}*/}
-                            {/*  value={currentAngleType === 'slope' ? (roof.pitch ?? '') : (roof.angle ?? '')}*/}
-                            {/*/>*/}
-                            <CalculatorInput
-                              id=""
-                              name=""
-                              label=""
                               className="input-origin block"
-                              ref={pitchRef}
+                              onChange={(e) => {
+                                e.target.value = normalizeDecimalLimit(e.target.value, 2)
+                                handleChangePitch(e, index)
+                              }}
                               value={currentAngleType === 'slope' ? (roof.pitch ?? '') : (roof.angle ?? '')}
-                              onChange={(value) => {
+                            />
-                                handleChangePitch(value, index)
-                              }}
-                              options={{
-                                allowNegative: false,
-                                allowDecimal: true //(index !== 0),
-                              }}
-                            ></CalculatorInput>
                           </div>
                           <span className="absol">{pitchText}</span>
                         </div>

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

@@ -14,7 +14,6 @@ import { useRoofShapeSetting } from '@/hooks/roofcover/useRoofShapeSetting'
 import { currentAngleTypeSelector, pitchTextSelector } from '@/store/canvasAtom'
 import { getDegreeByChon } from '@/util/canvas-util'
 import { normalizeDecimalLimit, normalizeDigits } from '@/util/input-utils'
-import { CalculatorInput } from '@/components/common/input/CalcInput'
 
 export default function RoofAllocationSetting(props) {
   const contextPopupPosition = useRecoilValue(contextPopupPositionState)
@@ -206,30 +205,15 @@ export default function RoofAllocationSetting(props) {
                           <div className="flex-ment">
                             <span>{getMessage('modal.object.setting.offset.slope')}</span>
                             <div className="input-grid">
-                              {/*<input*/}
+                              <input
-                              {/*  type="text"*/}
+                                type="text"
-                              {/*  className="input-origin block"*/}
-                              {/*  onChange={(e) => {*/}
-                              {/*    e.target.value = normalizeDecimalLimit(e.target.value, 2)*/}
-                              {/*    handleChangePitch(e, index)*/}
-                              {/*  }}*/}
-                              {/*  value={currentAngleType === 'slope' ? (roof.pitch ?? '') : (roof.angle ?? '')}*/}
-                              {/*/>*/}
-                              <CalculatorInput
-                                id=""
-                                name=""
-                                label=""
                                 className="input-origin block"
-                                ref={pitchRef}
+                                onChange={(e) => {
+                                  e.target.value = normalizeDecimalLimit(e.target.value, 2)
+                                  handleChangePitch(e, index)
+                                }}
                                 value={currentAngleType === 'slope' ? (roof.pitch ?? '') : (roof.angle ?? '')}
-                                onChange={(value) => {
+                              />
-                                  handleChangePitch(value, index)
-                                }}
-                                options={{
-                                  allowNegative: false,
-                                  allowDecimal: true //(index !== 0),
-                                }}
-                              ></CalculatorInput>
                             </div>
                             <span className="absol">{pitchText}</span>
                           </div>

src/components/floor-plan/modal/roofShape/passivity/Eaves.jsx

@@ -3,7 +3,6 @@ import { useRecoilValue } from 'recoil'
 import { ANGLE_TYPE, currentAngleTypeSelector } from '@/store/canvasAtom'
 import { selectedRoofMaterialSelector } from '@/store/settingAtom'
 import { useEffect } from 'react'
-import { CalculatorInput } from '@/components/common/input/CalcInput'
 
 export default function Eaves({ offsetRef, pitchRef, pitchText }) {
   const { getMessage } = useMessage()
@@ -17,24 +16,12 @@ export default function Eaves({ offsetRef, pitchRef, pitchText }) {
           {getMessage('slope')}
         </span>
         <div className="input-grid mr5">
-          {/*<input*/}
+          <input
-          {/*  type="text"*/}
+            type="text"
-          {/*  className="input-origin block"*/}
-          {/*  defaultValue={currentAngleType === ANGLE_TYPE.SLOPE ? selectedRoofMaterial.pitch : selectedRoofMaterial.angle}*/}
-          {/*  ref={pitchRef}*/}
-          {/*/>*/}
-          <CalculatorInput
-            id=""
-            name=""
-            label=""
             className="input-origin block"
+            defaultValue={currentAngleType === ANGLE_TYPE.SLOPE ? selectedRoofMaterial.pitch : selectedRoofMaterial.angle}
             ref={pitchRef}
-            value={currentAngleType === ANGLE_TYPE.SLOPE ? selectedRoofMaterial.pitch : selectedRoofMaterial.angle}
+          />
-            options={{
-              allowNegative: false,
-              allowDecimal: true //(index !== 0),
-            }}
-          ></CalculatorInput>
         </div>
         <span className="thin">{pitchText}</span>
       </div>