diff --git a/src/components/floor-plan/modal/setting01/dimensionLine/DimensionLineSetting.jsx b/src/components/floor-plan/modal/setting01/dimensionLine/DimensionLineSetting.jsx
index 1aa39e74..65fc2d28 100644
--- a/src/components/floor-plan/modal/setting01/dimensionLine/DimensionLineSetting.jsx
+++ b/src/components/floor-plan/modal/setting01/dimensionLine/DimensionLineSetting.jsx
@@ -8,68 +8,57 @@ import QSelectBox from '@/components/common/select/QSelectBox'
import { useMessage } from '@/hooks/useMessage'
import { dimensionLineSettingsState } from '@/store/commonUtilsAtom'
import { useRecoilState } from 'recoil'
+import { globalFontAtom } from '@/store/fontAtom'
-/*
- color: 치수선 색
- fontColor: 글꼴 색
- fontSize: 치수선 치수 색
- pixel: 치수선 두깨
-*/
export default function DimensionLineSetting(props) {
- const {
- color,
- setColor,
- font,
- setFont,
- fontColor,
- setFontColor,
- fontSize,
- setFontSize,
- pixel,
- setPixel,
- isShow,
- setIsShow,
- id,
- pos = { x: 985, y: 180 },
- } = props
+ const { isShow, setIsShow, id, pos = { x: 985, y: 180 } } = props
const { addPopup, closePopup, closePopups } = usePopup()
const pixels = Array.from({ length: 5 }).map((_, index) => {
- return { name: index + 1, value: index + 1 }
+ return { id: index, name: index + 1, value: index + 1 }
})
- const [originColor, setOriginColor] = useState(color)
- const [originFont, setOriginFont] = useState(font)
- const [originFontColor, setOriginFontColor] = useState(fontColor)
- const [originFontSize, setOriginFontSize] = useState(fontSize)
- const [originPixel, setOriginPixel] = useState(pixel)
+ const [dimensionLineSettings, setDimensionLineSettings] = useRecoilState(dimensionLineSettingsState)
+ const [globalFont, setGlobalFont] = useRecoilState(globalFontAtom)
+ const [originPixel, setOriginPixel] = useState(dimensionLineSettings.pixel)
+ const [originColor, setOriginColor] = useState(dimensionLineSettings.color)
+ const [originFont, setOriginFont] = useState(globalFont.dimensionLineText.fontFamily)
+ const [originFontColor, setOriginFontColor] = useState(globalFont.dimensionLineText.fontColor)
+ const [originFontSize, setOriginFontSize] = useState(globalFont.dimensionLineText.fontSize)
+ const [originFontWeight, setOriginFontWeight] = useState(globalFont.dimensionLineText.fontWeight)
const [fontModalId, setFontModalId] = useState(uuidv4())
- const [colorModalId, setColorModalId] = useState(uuidv4())
+ const [colorModalId, setColorModalId] = useState(uuidv4())
const [showColorPickerModal, setShowColorPickerModal] = useState(false)
const [showFontModal, setShowFontModal] = useState(false)
const { getMessage } = useMessage()
- const [dimensionLineSettings, setDimensionLineSettings] = useRecoilState(dimensionLineSettingsState)
useEffect(() => {
- console.log(2, isShow)
- if (pixel) {
- setOriginPixel(pixels?.filter((data) => data.value === pixel)[0])
+ if (originPixel) {
+ setOriginPixel(pixels?.filter((data) => data.value === originPixel)[0])
}
setIsShow(true)
}, [])
useEffect(() => {
- console.log(1, isShow)
if (!isShow) {
closePopups([fontModalId, colorModalId])
}
}, [isShow])
+ const handleFontSave = (font) => {
+ setOriginFont(font.fontFamily)
+ setOriginFontSize(font.fontSize)
+ setOriginFontColor(font.fontColor)
+ setOriginFontWeight(font.fontWeight)
+ }
+ const handleColorSave = () => {}
+
const colorPickerProps = {
isShow: showColorPickerModal,
setIsShow: setShowColorPickerModal,
color: originColor,
setColor: setOriginColor,
id: colorModalId,
+ isConfig: true,
pos: {
x: 495,
y: 180,
@@ -79,14 +68,13 @@ export default function DimensionLineSetting(props) {
const fontProps = {
isShow: showFontModal,
setIsShow: setShowFontModal,
- color: originColor,
- setColor: setOriginColor,
- font: originFont,
- setFont: setOriginFont,
- fontColor: 'black',
- setFontColor: setOriginFontColor,
- fontSize: originFontSize,
- setFontSize: setOriginFontSize,
+ font: {
+ fontFamily: originFont,
+ fontSize: originFontSize,
+ fontColor: originFontColor,
+ fontWeight: originFontWeight,
+ },
+ onSave: handleFontSave,
isConfig: true,
id: fontModalId,
pos: {
@@ -106,6 +94,29 @@ export default function DimensionLineSetting(props) {
}
}
+ const onSave = () => {
+ setGlobalFont((prev) => {
+ return {
+ ...prev,
+ dimensionLineText: {
+ fontFamily: originFont,
+ fontWeight: originFontWeight,
+ fontSize: originFontSize,
+ fontColor: originFontColor,
+ },
+ }
+ })
+ setDimensionLineSettings((prev) => {
+ return {
+ ...prev,
+ pixel: originPixel?.value,
+ color: originColor,
+ }
+ })
+ setIsShow(false)
+ closePopups([fontModalId, colorModalId, id])
+ }
+
return (
@@ -149,9 +160,10 @@ export default function DimensionLineSetting(props) {
className="font"
style={{
fontFamily: originFont?.value ?? '',
- color: originFontColor?.value ?? 'black',
+ color: originFontColor.value ?? 'black',
fontSize: originFontSize?.value ?? '12px',
- fontWeight: '400',
+ fontStyle: originFontWeight?.value.toLowerCase().includes('italic') ? 'italic' : 'normal',
+ fontWeight: originFontWeight?.value.toLowerCase().includes('bold') ? 'bold' : 'normal',
}}
>
9,999
@@ -161,7 +173,7 @@ export default function DimensionLineSetting(props) {
style={{
backgroundColor: originColor,
borderColor: originColor,
- height: originPixel.value,
+ height: originPixel?.value,
}}
>
@@ -169,26 +181,7 @@ export default function DimensionLineSetting(props) {