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

보조선사이즈변경 : 계산기 추가

Browse Source
This commit is contained in:
ysCha 2025-12-16 17:14:47 +09:00
parent 4f483dbfee
commit bbf2dfbe7c
1 changed files with 33 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/components/floor-plan/modal/auxiliary/AuxiliarySize.jsx
View File

@ -8,19 +8,21 @@ import { useEffect, useState } from 'react'
import Big from 'big.js' import Big from 'big.js'
import { calcLineActualSize, calcLinePlaneSize } from '@/util/qpolygon-utils' import { calcLineActualSize, calcLinePlaneSize } from '@/util/qpolygon-utils'
import { normalizeDigits } from '@/util/input-utils' import { normalizeDigits } from '@/util/input-utils'
import { CalculatorInput } from '@/components/common/input/CalcInput'
export default function AuxiliarySize(props) { export default function AuxiliarySize(props) {
const contextPopupPosition = useRecoilValue(contextPopupPositionState) const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const { id, pos = contextPopupPosition } = props const { id, pos = contextPopupPosition } = props
const [checkedRadio, setCheckedRadio] = useState(null) const [checkedRadio, setCheckedRadio] = useState(null)
const [value1, setValue1] = useState(null) const [value1, setValue1] = useState('')
const [value2, setValue2] = useState(null) const [value2, setValue2] = useState('')
const [size, setSize] = useState(0) const [size, setSize] = useState(0)
const { getMessage } = useMessage() const { getMessage } = useMessage()
const { closePopup } = usePopup() const { closePopup } = usePopup()
const currentObject = useRecoilValue(currentObjectState) const currentObject = useRecoilValue(currentObjectState)
const canvas = useRecoilValue(canvasState) const canvas = useRecoilValue(canvasState)
useEffect(() => { useEffect(() => {
return () => { return () => {
canvas?.discardActiveObject() canvas?.discardActiveObject()
@ -37,7 +39,7 @@ export default function AuxiliarySize(props) {
}, [currentObject]) }, [currentObject])
const handleInput = (e) => { const handleInput = (e) => {
let value = e.target.value.replace(/^0+/, '') let value = e.replace(/^0+/, '')
if (value === '') { if (value === '') {
if (checkedRadio === 1) setValue1(value) if (checkedRadio === 1) setValue1(value)
if (checkedRadio === 2) setValue2(value) if (checkedRadio === 2) setValue2(value)
@ -130,7 +132,20 @@ export default function AuxiliarySize(props) {
<div className="outline-form"> <div className="outline-form">
<span style={{ width: 'auto' }}>{getMessage('length')}</span> <span style={{ width: 'auto' }}>{getMessage('length')}</span>
<div className="input-grid mr5"> <div className="input-grid mr5">
<input type="text" className="input-origin block" value={value1} readOnly={checkedRadio !== 1} onChange={handleInput} /> {/*<input type="text" className="input-origin block" value={value1} readOnly={checkedRadio !== 1} onChange={handleInput} />*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={value1}
onChange={handleInput}
readOnly={checkedRadio !== 1}
options={{
allowNegative: false,
allowDecimal: false
}}
/>
</div> </div>
<span className="thin">mm</span> <span className="thin">mm</span>
</div> </div>
@ -149,7 +164,20 @@ export default function AuxiliarySize(props) {
<div className="outline-form"> <div className="outline-form">
<span style={{ width: 'auto' }}>{getMessage('length')}</span> <span style={{ width: 'auto' }}>{getMessage('length')}</span>
<div className="input-grid mr5"> <div className="input-grid mr5">
<input type="text" className="input-origin block" value={value2} readOnly={checkedRadio !== 2} onChange={handleInput} /> {/*<input type="text" className="input-origin block" value={value2} readOnly={checkedRadio !== 2} onChange={handleInput} />*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={value2}
onChange={handleInput}
readOnly={checkedRadio !== 2}
options={{
allowNegative: false,
allowDecimal: false
}}
/>
</div> </div>
<span className="thin">mm</span> <span className="thin">mm</span>
</div> </div>