[1308] 촌에 소수점 입력

This commit is contained in:
ysCha 2025-11-24 14:06:01 +09:00
parent 43f70f9f79
commit 3071c0ddc5
9 changed files with 275 additions and 44 deletions

View File

@ -1,5 +1,6 @@
import { useMessage } from '@/hooks/useMessage'
import { normalizeDecimalLimit, normalizeDigits } from '@/util/input-utils'
import { CalculatorInput } from '@/components/common/input/CalcInput'
export default function Direction({ pitch, setPitch, eavesOffset, setEavesOffset, gableOffset, setGableOffset, shedWidth, setShedWidth, pitchText }) {
const { getMessage } = useMessage()
@ -10,12 +11,24 @@ export default function Direction({ pitch, setPitch, eavesOffset, setEavesOffset
{getMessage('slope')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input
type="text"
{/*<input*/}
{/* type="text"*/}
{/* className="input-origin block"*/}
{/* value={pitch}*/}
{/* onChange={(e) => setPitch(normalizeDecimalLimit(e.target.value, 2))}*/}
{/*/>*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={pitch}
onChange={(e) => setPitch(normalizeDecimalLimit(e.target.value, 2))}
/>
onChange={(value) => setPitch(value)}
options={{
allowNegative: false,
allowDecimal: true //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">{pitchText}</span>
</div>
@ -24,12 +37,24 @@ export default function Direction({ pitch, setPitch, eavesOffset, setEavesOffset
{getMessage('eaves.offset')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input
type="text"
{/*<input*/}
{/* type="text"*/}
{/* className="input-origin block"*/}
{/* value={eavesOffset}*/}
{/* onChange={(e) => setEavesOffset(normalizeDigits(e.target.value))}*/}
{/*/>*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={eavesOffset}
onChange={(e) => setEavesOffset(normalizeDigits(e.target.value))}
/>
onChange={(value) => setEavesOffset(value)}
options={{
allowNegative: false,
allowDecimal: false //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">mm</span>
</div>
@ -38,12 +63,24 @@ export default function Direction({ pitch, setPitch, eavesOffset, setEavesOffset
{getMessage('gable.offset')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input
type="text"
{/*<input*/}
{/* type="text"*/}
{/* className="input-origin block"*/}
{/* value={gableOffset}*/}
{/* onChange={(e) => setGableOffset(normalizeDigits(e.target.value))}*/}
{/*/>*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={gableOffset}
onChange={(e) => setGableOffset(normalizeDigits(e.target.value))}
/>
onChange={(value) => setGableOffset(value)}
options={{
allowNegative: false,
allowDecimal: false //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">mm</span>
</div>
@ -52,12 +89,24 @@ export default function Direction({ pitch, setPitch, eavesOffset, setEavesOffset
{getMessage('windage.width')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input
type="text"
{/*<input*/}
{/* type="text"*/}
{/* className="input-origin block"*/}
{/* value={shedWidth}*/}
{/* onChange={(e) => setShedWidth(normalizeDigits(e.target.value))}*/}
{/*/>*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={shedWidth}
onChange={(e) => setShedWidth(normalizeDigits(e.target.value))}
/>
onChange={(value) => setShedWidth(value)}
options={{
allowNegative: false,
allowDecimal: false //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">mm</span>
</div>

View File

@ -1,5 +1,6 @@
import { useMessage } from '@/hooks/useMessage'
import { normalizeDecimalLimit, normalizeDigits } from '@/util/input-utils'
import { CalculatorInput } from '@/components/common/input/CalcInput'
export default function Pattern(props) {
const { getMessage } = useMessage()
@ -11,7 +12,20 @@ export default function Pattern(props) {
{getMessage('slope')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" value={pitch} onChange={(e) => setPitch(normalizeDecimalLimit(e.target.value, 2))} />
{/*<input type="text" className="input-origin block" value={pitch} */}
{/* onChange={(e) => setPitch(normalizeDecimalLimit(e.target.value, 2))} />*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={pitch}
onChange={(value) => setPitch(value)}
options={{
allowNegative: false,
allowDecimal: true //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin"> {pitchText}</span>
</div>
@ -20,7 +34,20 @@ export default function Pattern(props) {
{getMessage('eaves.offset')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" value={eavesOffset} onChange={(e) => setEavesOffset(normalizeDigits(e.target.value))} />
{/*<input type="text" className="input-origin block" value={eavesOffset} */}
{/* onChange={(e) => setEavesOffset(normalizeDigits(e.target.value))} />*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={eavesOffset}
onChange={(value) => setEavesOffset(value)}
options={{
allowNegative: false,
allowDecimal: false //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">mm</span>
</div>
@ -29,7 +56,20 @@ export default function Pattern(props) {
{getMessage('gable.offset')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" value={gableOffset} onChange={(e) => setGableOffset(normalizeDigits(e.target.value))} />
{/*<input type="text" className="input-origin block" value={gableOffset} */}
{/* onChange={(e) => setGableOffset(normalizeDigits(e.target.value))} />*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={gableOffset}
onChange={(value) => setGableOffset(value)}
options={{
allowNegative: false,
allowDecimal: false //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">mm</span>
</div>

View File

@ -1,6 +1,7 @@
import { useMessage } from '@/hooks/useMessage'
import { useEffect } from 'react'
import { normalizeDecimalLimit, normalizeDigits } from '@/util/input-utils'
import { CalculatorInput } from '@/components/common/input/CalcInput'
export default function Ridge(props) {
const { getMessage } = useMessage()
@ -13,7 +14,20 @@ export default function Ridge(props) {
{getMessage('slope')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" value={pitch} onChange={(e) => setPitch(normalizeDecimalLimit(e.target.value, 2))} />
{/*<input type="text" className="input-origin block" value={pitch} */}
{/* onChange={(e) => setPitch(normalizeDecimalLimit(e.target.value, 2))} />*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={pitch}
onChange={(value) => setPitch(value)}
options={{
allowNegative: false,
allowDecimal: true //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">{pitchText}</span>
</div>
@ -22,7 +36,20 @@ export default function Ridge(props) {
{getMessage('eaves.offset')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" value={eavesOffset} onChange={(e) => setEavesOffset(normalizeDigits(e.target.value))} />
{/*<input type="text" className="input-origin block" value={eavesOffset} */}
{/* onChange={(e) => setEavesOffset(normalizeDigits(e.target.value))} />*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={eavesOffset}
onChange={(value) => setEavesOffset(value)}
options={{
allowNegative: false,
allowDecimal: false //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">mm</span>
</div>

View File

@ -1,5 +1,6 @@
import { useMessage } from '@/hooks/useMessage'
import { normalizeDecimalLimit, normalizeDigits } from '@/util/input-utils'
import { CalculatorInput } from '@/components/common/input/CalcInput'
export default function Eaves({ pitch, setPitch, eavesOffset, setEavesOffset, pitchText }) {
const { getMessage } = useMessage()
@ -10,7 +11,21 @@ export default function Eaves({ pitch, setPitch, eavesOffset, setEavesOffset, pi
{getMessage('slope')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" value={pitch} onChange={(e) => setPitch(normalizeDecimalLimit(e.target.value, 2))} />
{/*<input type="text" className="input-origin block" value={pitch} */}
{/* onChange={(e) => setPitch(normalizeDecimalLimit(e.target.value, 2))} />*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={pitch}
onChange={(value) => setPitch(value)}
options={{
allowNegative: false,
allowDecimal: true //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">{pitchText}</span>
</div>
@ -19,7 +34,20 @@ export default function Eaves({ pitch, setPitch, eavesOffset, setEavesOffset, pi
{getMessage('eaves.offset')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" value={eavesOffset} onChange={(e) => setEavesOffset(normalizeDigits(e.target.value))} />
{/*<input type="text" className="input-origin block" value={eavesOffset} */}
{/* onChange={(e) => setEavesOffset(normalizeDigits(e.target.value))} />*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={eavesOffset}
onChange={(value) => setEavesOffset(value)}
options={{
allowNegative: false,
allowDecimal: false //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">mm</span>
</div>

View File

@ -1,6 +1,7 @@
import { useMessage } from '@/hooks/useMessage'
import { useEffect } from 'react'
import { normalizeDigits } from '@/util/input-utils'
import { CalculatorInput } from '@/components/common/input/CalcInput'
export default function Gable({ gableOffset, setGableOffset }) {
const { getMessage } = useMessage()
@ -10,7 +11,20 @@ export default function Gable({ gableOffset, setGableOffset }) {
<div className="outline-form">
<span className="mr10">{getMessage('gable.offset')}</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" value={gableOffset} onChange={(e) => setGableOffset(normalizeDigits(e.target.value))} />
{/*<input type="text" className="input-origin block" value={gableOffset}*/}
{/* onChange={(e) => setGableOffset(normalizeDigits(e.target.value))} />*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={gableOffset}
onChange={(value) => setGableOffset(value)}
options={{
allowNegative: false,
allowDecimal: false //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">mm</span>
</div>

View File

@ -1,5 +1,6 @@
import { useMessage } from '@/hooks/useMessage'
import { normalizeDecimalLimit, normalizeDigits } from '@/util/input-utils'
import { CalculatorInput } from '@/components/common/input/CalcInput'
export default function HipAndGable({ pitch, setPitch, eavesOffset, setEavesOffset, hipAndGableWidth, setHipAndGableWidth, pitchText }) {
const { getMessage } = useMessage()
@ -10,7 +11,8 @@ export default function HipAndGable({ pitch, setPitch, eavesOffset, setEavesOffs
{getMessage('slope')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" value={pitch} onChange={(e) => setPitch(normalizeDecimalLimit(e.target.value, 2))} />
<input type="text" className="input-origin block" value={pitch}
onChange={(e) => setPitch(normalizeDecimalLimit(e.target.value, 2))} />
</div>
<span className="thin">{pitchText}</span>
</div>
@ -19,7 +21,8 @@ export default function HipAndGable({ pitch, setPitch, eavesOffset, setEavesOffs
{getMessage('eaves.offset')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" value={eavesOffset} onChange={(e) => setEavesOffset(normalizeDigits(e.target.value))} />
<input type="text" className="input-origin block" value={eavesOffset}
onChange={(e) => setEavesOffset(normalizeDigits(e.target.value))} />
</div>
<span className="thin">mm</span>
</div>
@ -28,12 +31,24 @@ export default function HipAndGable({ pitch, setPitch, eavesOffset, setEavesOffs
{getMessage('hipandgable.width')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input
type="text"
{/*<input*/}
{/* type="text"*/}
{/* className="input-origin block"*/}
{/* value={hipAndGableWidth}*/}
{/* onChange={(e) => setHipAndGableWidth(normalizeDigits(e.target.value))}*/}
{/*/>*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={hipAndGableWidth}
onChange={(e) => setHipAndGableWidth(normalizeDigits(e.target.value))}
/>
onChange={(value) => setHipAndGableWidth(value)}
options={{
allowNegative: false,
allowDecimal: false //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">mm</span>
</div>

View File

@ -1,5 +1,6 @@
import { useMessage } from '@/hooks/useMessage'
import { normalizeDecimalLimit, normalizeDigits } from '@/util/input-utils'
import { CalculatorInput } from '@/components/common/input/CalcInput'
export default function Jerkinhead({
gableOffset,
@ -18,7 +19,20 @@ export default function Jerkinhead({
{getMessage('gable.offset')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" value={gableOffset} onChange={(e) => setGableOffset(normalizeDigits(e.target.value))} />
<input type="text" className="input-origin block" value={gableOffset}
onChange={(e) => setGableOffset(normalizeDigits(e.target.value))} />
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={gableOffset}
onChange={(value) => setGableOffset(value)}
options={{
allowNegative: false,
allowDecimal: false //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">mm</span>
</div>
@ -27,7 +41,21 @@ export default function Jerkinhead({
{getMessage('jerkinhead.width')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" value={jerkinHeadWidth} onChange={(e) => setJerkinHeadWidth(normalizeDigits(e.target.value))} />
{/*<input type="text" className="input-origin block" value={jerkinHeadWidth}*/}
{/* onChange={(e) => setJerkinHeadWidth(normalizeDigits(e.target.value))} />*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={jerkinHeadWidth}
onChange={(value) => setJerkinHeadWidth(value)}
options={{
allowNegative: false,
allowDecimal: false //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">mm</span>
</div>
@ -36,12 +64,24 @@ export default function Jerkinhead({
{getMessage('jerkinhead.slope')}
</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input
type="text"
{/*<input*/}
{/* type="text"*/}
{/* className="input-origin block"*/}
{/* value={jerkinHeadPitch}*/}
{/* onChange={(e) => setJerkinHeadPitch(normalizeDecimalLimit(e.target.value, 2))}*/}
{/*/>*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={jerkinHeadPitch}
onChange={(e) => setJerkinHeadPitch(normalizeDecimalLimit(e.target.value, 2))}
/>
onChange={(value) => jerkinHeadPitch(value)}
options={{
allowNegative: false,
allowDecimal: true //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">{pitchText}</span>
</div>

View File

@ -8,14 +8,16 @@ export default function Shed({ shedWidth, setShedWidth, shedPitch, setShedPitch,
<div className="outline-form mb10">
<span className="mr10">{getMessage('slope')}</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" value={shedPitch} onChange={(e) => setShedPitch(normalizeDecimalLimit(e.target.value, 2))} />
<input type="text" className="input-origin block" value={shedPitch}
onChange={(e) => setShedPitch(normalizeDecimalLimit(e.target.value, 2))} />
</div>
<span className="thin">{pitchText}</span>
</div>
<div className="outline-form">
<span className="mr10">{getMessage('shed.width')}</span>
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" value={shedWidth} onChange={(e) => setShedWidth(normalizeDigits(e.target.value))} />
<input type="text" className="input-origin block" value={shedWidth}
onChange={(e) => setShedWidth(normalizeDigits(e.target.value))} />
</div>
<span className="thin">mm</span>
</div>

View File

@ -1,6 +1,7 @@
import { useState } from 'react'
import { useMessage } from '@/hooks/useMessage'
import { normalizeDigits } from '@/util/input-utils'
import { CalculatorInput } from '@/components/common/input/CalcInput'
export default function Wall({ sleeveOffset, setSleeveOffset, hasSleeve, setHasSleeve }) {
const { getMessage } = useMessage()
@ -10,7 +11,8 @@ export default function Wall({ sleeveOffset, setSleeveOffset, hasSleeve, setHasS
<div className="eaves-keraba-item">
<div className="eaves-keraba-th">
<div className="d-check-radio pop">
<input type="radio" name="radio01" checked={hasSleeve === '0'} id="ra01" value={'0'} onChange={(e) => setHasSleeve(e.target.value)} />
<input type="radio" name="radio01" checked={hasSleeve === '0'} id="ra01" value={'0'}
onChange={(e) => setHasSleeve(e.target.value)} />
<label htmlFor="ra01">{getMessage('has.not.sleeve')}</label>
</div>
</div>
@ -18,20 +20,34 @@ export default function Wall({ sleeveOffset, setSleeveOffset, hasSleeve, setHasS
<div className="eaves-keraba-item">
<div className="eaves-keraba-th">
<div className="d-check-radio pop">
<input type="radio" name="radio01" checked={hasSleeve !== '0'} id="ra02" value={'1'} onChange={(e) => setHasSleeve(e.target.value)} />
<input type="radio" name="radio01" checked={hasSleeve !== '0'} id="ra02" value={'1'}
onChange={(e) => setHasSleeve(e.target.value)} />
<label htmlFor="ra02">{getMessage('has.sleeve')}</label>
</div>
</div>
<div className="eaves-keraba-td">
<div className="outline-form">
<div className="input-grid mr5" style={{ width: '100px' }}>
<input
type="text"
{/*<input*/}
{/* type="text"*/}
{/* className="input-origin block"*/}
{/* value={sleeveOffset}*/}
{/* onChange={(e) => setSleeveOffset(normalizeDigits(e.target.value))}*/}
{/* readOnly={hasSleeve === '0'}*/}
{/*/>*/}
<CalculatorInput
id=""
name=""
label=""
className="input-origin block"
value={sleeveOffset}
onChange={(e) => setSleeveOffset(normalizeDigits(e.target.value))}
onChange={(value) => setSleeveOffset(value)}
readOnly={hasSleeve === '0'}
/>
options={{
allowNegative: false,
allowDecimal: false //(index !== 0),
}}
></CalculatorInput>
</div>
<span className="thin">mm</span>
</div>