[1308] 촌에 소수점 입력 - {pitchText}

[1308] 촌에 소수점 입력 - 처마,케라바 수정
필요하지 않은 접힘 버튼 제거
2025-11-26 09:29:17 +09:00 · 2025-11-26 09:18:01 +09:00 · 2025-11-25 13:41:35 +09:00 · 2025-11-25 13:33:28 +09:00 · 2025-11-25 09:49:57 +09:00
6 changed files with 87 additions and 29 deletions
--- a/src/components/common/draggable/WithDraggable.jsx
+++ b/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 }) {
+function WithDraggableHeader({ title, onClose, children, isFold, onFold = null }) {
  return (
    <div className="modal-head modal-handle">
      <h1 className="title">{title}</h1>
-      <div className='modal-btn-wrap'>
-        <button className='modal-fold act'></button>
-      {onClose && (
-        <button className="modal-close" onClick={() => onClose()}>
-          닫기
-        </button>
-      )}
+      <div className="modal-btn-wrap">
+        {onFold && <button className={`modal-fold ${isFold ? '' : 'act'}`} onClick={onFold}></button>}
+        {onClose && (
+          <button className="modal-close" onClick={() => onClose()}>
+            닫기
+          </button>
+        )}
      </div>
    </div>
  )
--- a/src/components/floor-plan/modal/Slope.jsx
+++ b/src/components/floor-plan/modal/Slope.jsx
@ -4,6 +4,7 @@ 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()
@ -22,7 +23,19 @@ 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>
--- a/src/components/floor-plan/modal/eavesGable/type/Gable.jsx
+++ b/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: false //(index !== 0),
+                      allowDecimal: true //(index !== 0),
                    }}
                  ></CalculatorInput>
                </div>
--- a/src/components/floor-plan/modal/roofAllocation/ContextRoofAllocationSetting.jsx
+++ b/src/components/floor-plan/modal/roofAllocation/ContextRoofAllocationSetting.jsx
@ -13,6 +13,7 @@ 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)
@ -204,15 +205,30 @@ export default function ContextRoofAllocationSetting(props) {
                        <div className="flex-ment">
                          <span>{getMessage('modal.object.setting.offset.slope')}</span>
                          <div className="input-grid">
-                            <input
-                              type="text"
+                            {/*<input*/}
+                            {/*  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"
-                              onChange={(e) => {
-                                e.target.value = normalizeDecimalLimit(e.target.value, 2)
-                                handleChangePitch(e, index)
-                              }}
+                              ref={pitchRef}
                              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>
--- a/src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx
+++ b/src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx
@ -14,6 +14,7 @@ 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)
@ -205,15 +206,30 @@ export default function RoofAllocationSetting(props) {
                          <div className="flex-ment">
                            <span>{getMessage('modal.object.setting.offset.slope')}</span>
                            <div className="input-grid">
-                              <input
-                                type="text"
+                              {/*<input*/}
+                              {/*  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"
-                                onChange={(e) => {
-                                  e.target.value = normalizeDecimalLimit(e.target.value, 2)
-                                  handleChangePitch(e, index)
-                                }}
+                                ref={pitchRef}
                                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>
--- a/src/components/floor-plan/modal/roofShape/passivity/Eaves.jsx
+++ b/src/components/floor-plan/modal/roofShape/passivity/Eaves.jsx
@ -3,6 +3,7 @@ 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()
@ -16,12 +17,24 @@ export default function Eaves({ offsetRef, pitchRef, pitchText }) {
          {getMessage('slope')}
        </span>
        <div className="input-grid mr5">
-          <input
-            type="text"
+          {/*<input*/}
+          {/*  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>
Author	SHA1	Message	Date
ysCha	34871397ee	[1308] 촌에 소수점 입력 - {pitchText}	2025-11-26 09:29:17 +09:00
ysCha	aeb457e5ec	[1308] 촌에 소수점 입력 - 처마,케라바 수정	2025-11-26 09:18:01 +09:00
hyojun.choi	7ddbc40cd4	필요하지 않은 접힘 버튼 제거	2025-11-25 13:41:35 +09:00
ysCha	97209b6742	Merge pull request 'sessionState?.storeId' (#425 ) from dev_ysCha into dev Reviewed-on: #425	2025-11-25 13:33:28 +09:00
ysCha	b2799dacb8	Merge pull request '[1308] 촌에 소수점 입력 - 처마,케라바 수정' (#422 ) from dev_ysCha into dev Reviewed-on: #422	2025-11-25 09:49:57 +09:00