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

Canvas 설정 수정

Browse Source
This commit is contained in:
changkyu choi 2024-12-10 11:33:30 +09:00
parent 9c5e21aa41
commit 2e01d1eccf
9 changed files with 243 additions and 145 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/common/color-picker/ColorPickerModal.jsx
View File

@ -8,13 +8,28 @@ import { contextPopupPositionState } from '@/store/popupAtom'
export default function ColorPickerModal(props) {
const contextPopupPosition = useRecoilValue(contextPopupPositionState) // 현재 메뉴
const { isShow, setIsShow, pos = contextPopupPosition, color, setColor, id, isConfig = false } = props //color = '#ff0000'
const {
isShow,
setIsShow,
pos = contextPopupPosition,
color,
setColor,
id,
name,
isConfig = false,
settingsData,
setSettingsData,
settingsDataSave,
setSettingsDataSave,
} = props //color = '#ff0000'
const [originColor, setOriginColor] = useState(color)
const { getMessage } = useMessage()
const { closePopup } = usePopup()
useEffect(() => {
setOriginColor(originColor)
//치수선색설정 아닐 때만 바로 저장 실행
if (name !== 'DimensionLineColor') setSettingsDataSave({ ...settingsData })
}, [isShow])
return (
@ -49,6 +64,13 @@ export default function ColorPickerModal(props) {
if (setColor) setColor(originColor)
if (setIsShow) setIsShow(false)
//치수선색설정 아닐 때만 바로 저장 실행
if (name !== 'DimensionLineColor')
setSettingsData({
...settingsData,
color: originColor,
})
closePopup(id, isConfig)
}}
>

38
src/components/floor-plan/modal/grid/DotLineGrid.jsx
View File

@ -1,6 +1,6 @@
import WithDraggable from '@/components/common/draggable/WithDraggable'
import QSelectBox from '@/components/common/select/QSelectBox'
import { useEffect } from 'react'
import { useEffect, useState } from 'react'
import { useMessage } from '@/hooks/useMessage'
import { canvasState } from '@/store/canvasAtom'
import { useRecoilValue } from 'recoil'
@ -17,27 +17,26 @@ const TYPE = {
export default function DotLineGrid(props) {
// const [modalOption, setModalOption] = useRecoilState(modalState); //modal 열림닫힘 state
//const interval = useRecoilValue(dotLineIntervalSelector)
const { id, setIsShow, pos = { x: 840, y: -815 }, isConfig = false } = props
const { id, setIsShow, pos = { x: 840, y: -815 }, isConfig = false, settingsData, setSettingsData, settingsDataSave, setSettingsDataSave } = props
const canvas = useRecoilValue(canvasState)
const { getMessage } = useMessage()
const { closePopup } = usePopup()
const { swalFire } = useSwal()
const {
selectOption,
setSelectOption,
SelectOptions,
currentSetting,
setCurrentSetting,
dotLineGridSettingState,
setSettingModalGridOptions,
setDotLineGridSettingState,
} = useCanvasSetting()
const [selectOption, setSelectOption] = useState()
const { SelectOptions, currentSetting, setCurrentSetting, dotLineGridSettingState, setSettingModalGridOptions, setDotLineGridSettingState } =
useCanvasSetting()
// 데이터를 최초 한 번만 조회
useEffect(() => {
console.log('DotLineGrid useEffect 실행')
setSettingsDataSave({ ...settingsData })
// dimension 값에 맞는 옵션을 선택
const matchedOption = SelectOptions.find((option) => option.value == currentSetting.INTERVAL.dimension)
setSelectOption(matchedOption)
return () => {
setSettingModalGridOptions((prev) => {
@ -84,11 +83,24 @@ export default function DotLineGrid(props) {
},
DOT: currentSetting.DOT,
LINE: currentSetting.LINE,
flag: true,
//flag: true,
}
//setDotLineGridSettingState({ ...currentSetting })
})
setSettingsData({
...settingsData,
INTERVAL: {
type: currentSetting.INTERVAL.type,
horizontalInterval: currentSetting.INTERVAL.horizontalInterval,
verticalInterval: currentSetting.INTERVAL.verticalInterval,
ratioInterval: currentSetting.INTERVAL.ratioInterval,
dimension: currentSetting.INTERVAL.dimension,
},
DOT: currentSetting.DOT,
LINE: currentSetting.LINE,
})
setIsShow(false)
closePopup(id, isConfig)
}

19
src/components/floor-plan/modal/setting01/FirstOption.jsx
View File

@ -8,21 +8,22 @@ import { useEvent } from '@/hooks/useEvent'
export default function FirstOption(props) {
const { getMessage } = useMessage()
// const { canvas, settingModalFirstOptions, setSettingModalFirstOptions, settingsData, setSettingsData } = useCanvasSetting()
let { canvas, settingModalFirstOptions, setSettingModalFirstOptions, settingsData, setSettingsData } = props
let { canvas, settingModalFirstOptions, setSettingModalFirstOptions, settingsData, setSettingsData, settingsDataSave, setSettingsDataSave } = props
const { option1, option2, dimensionDisplay } = settingModalFirstOptions
const { initEvent } = useEvent()
// 데이터를 최초 한 번만 조회
useEffect(() => {
console.log('FirstOption useEffect 실행')
setSettingsDataSave({ ...settingsData })
}, [])
const onClickOption = async (item) => {
//치수 표시(단 건 선택)
let dimensionDisplay = settingModalFirstOptions?.dimensionDisplay
let option1 = settingModalFirstOptions?.option1
let option2 = settingModalFirstOptions?.option2
//치수 표시(단 건 선택)
if (item.column === 'corridorDimension' || item.column === 'realDimension' || item.column === 'noneDimension') {
dimensionDisplay = settingModalFirstOptions?.dimensionDisplay.map((option) => {
option.selected = option.id === item.id
@ -33,9 +34,9 @@ export default function FirstOption(props) {
//화면 표시(단 건 선택)
} else if (item.column === 'onlyBorder' || item.column === 'lineHatch' || item.column === 'allPainted') {
option2 = settingModalFirstOptions?.option2.map((option2) => {
option2.selected = option2.id === item.id
return option2
option2 = settingModalFirstOptions?.option2.map((option) => {
option.selected = option.id === item.id
return option
})
// setSettingModalFirstOptions({ ...settingModalFirstOptions, option2: [...options] })
@ -47,11 +48,11 @@ export default function FirstOption(props) {
})
//디스플레이 설정 표시(단 건 선택)
} else {
option1 = settingModalFirstOptions?.option1.map((opt) => {
if (opt.id === item.id) {
opt.selected = !opt.selected
option1 = settingModalFirstOptions?.option1.map((option) => {
if (option.id === item.id) {
option.selected = !option.selected
}
return opt
return option
})
// setSettingModalFirstOptions({ ...settingModalFirstOptions, option1: [...options] })

16
src/components/floor-plan/modal/setting01/GridOption.jsx
View File

@ -28,8 +28,13 @@ export default function GridOption(props) {
const { initEvent } = useEvent()
const { SelectOptions, settingsData, setSettingsData, settingsDataSave, setSettingsDataSave } = useCanvasSetting()
useEffect(() => {
console.log('GridOption useEffect 실행')
}, [])
useEffect(() => {
setGridColor(color.hex)
}, [color])
@ -96,7 +101,7 @@ export default function GridOption(props) {
}
useEffect(() => {
console.log('🚀 ~ useEffect ~ initEvent:')
//console.log('🚀 ~ useEffect ~ initEvent:')
initEvent()
}, [gridOptions])
@ -108,10 +113,15 @@ export default function GridOption(props) {
x: 845,
y: 180,
},
settingsData,
setSettingsData,
settingsDataSave,
setSettingsDataSave,
}
const colorPickerProps = {
id: colorId,
name: 'gridOptionColor',
color: gridColor,
setColor: setGridColor,
isShow: showColorPickerModal,
@ -121,6 +131,10 @@ export default function GridOption(props) {
x: 785,
y: 180,
},
settingsData,
setSettingsData,
settingsDataSave,
setSettingsDataSave,
}
return (

54
src/components/floor-plan/modal/setting01/SecondOption.jsx
View File

@ -37,6 +37,7 @@ export default function SecondOption(props) {
// setAdsorptionPointMode,
// setAdsorptionRange,
// } = useCanvasSetting()
const {
fetchSettings,
planSizeSettingMode,
@ -46,12 +47,17 @@ export default function SecondOption(props) {
adsorptionPointMode,
setAdsorptionPointMode,
setAdsorptionRange,
settingsData,
setSettingsData,
settingsDataSave,
setSettingsDataSave,
} = props
const { option3, option4 } = settingModalSecondOptions
// 데이터를 최초 한 번만 조회
useEffect(() => {
console.log('SecondOption useEffect 실행')
setSettingsDataSave({ ...settingsData })
}, [])
const handlePopup = (type) => {
@ -142,18 +148,24 @@ export default function SecondOption(props) {
return {
...prev,
[fontProps.type]: {
// fontFamily: font.fontFamily.value,
// fontWeight: font.fontWeight.value,
// fontSize: font.fontSize.value,
// fontColor: font.fontColor.value,
fontFamily: font.fontFamily,
fontWeight: font.fontWeight,
fontSize: font.fontSize,
fontColor: font.fontColor,
},
fontFlag: true,
//fontFlag: true,
}
})
setSettingsData({
...settingsData,
[fontProps.type]: {
fontFamily: font.fontFamily,
fontWeight: font.fontWeight,
fontSize: font.fontSize,
fontColor: font.fontColor,
},
})
}
const fontProps = {
@ -168,6 +180,10 @@ export default function SecondOption(props) {
id: dimensionId,
isShow: showDimensionLineSettingModal,
setIsShow: setShowDimensionLineSettingModal,
settingsData,
setSettingsData,
settingsDataSave,
setSettingsDataSave,
}
const planSizeProps = {
@ -177,9 +193,16 @@ export default function SecondOption(props) {
isShow: showPlanSizeSettingModal,
setIsShow: setShowPlanSizeSettingModal,
pos: { x: 1025, y: 180 },
settingsData,
setSettingsData,
settingsDataSave,
setSettingsDataSave,
}
const onClickOption = async (item) => {
let option4Data = settingModalSecondOptions?.option4
let adsorpPointData = adsorptionPointMode.adsorptionPoint
//흡착범위 설정(단 건 선택)
if (
item.column === 'adsorpRangeSmall' ||
@ -189,21 +212,26 @@ export default function SecondOption(props) {
) {
// option4에서 한 개만 선택 가능하도록 처리
//const updatedOption4 = option4.map((option) => (option.id === item.id ? { ...option, selected: true } : { ...option, selected: false }))
const options = settingModalSecondOptions?.option4.map((option4) => {
option4.selected = option4.id === item.id
return option4
option4Data = settingModalSecondOptions?.option4.map((option) => {
option.selected = option.id === item.id
return option
})
setSettingModalSecondOptions({ ...settingModalSecondOptions, option3, option4, fontFlag: true })
//사용여부 확인 필요
setAdsorptionRange(item.range)
//setAdsorptionRange(50)
setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: adsorpPointData })
} else if (item === 'adsorpPoint') {
setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: !adsorptionPointMode.adsorptionPoint, fontFlag: true })
setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: !adsorpPointData })
adsorpPointData = !adsorpPointData
}
//setAdsorptionRange(item.range) //사용여부 확인 필요
setAdsorptionRange(50)
setSettingsData({ ...settingsData, option4: [...option4Data], adsorptionPoint: adsorpPointData })
}
useEffect(() => {
console.log('🚀 ~ useEffect ~ initEvent:')
//console.log('🚀 ~ useEffect ~ initEvent:')
initEvent()
}, [adsorptionPointMode])

20
src/components/floor-plan/modal/setting01/SettingModal01.jsx
View File

@ -24,7 +24,11 @@ export default function SettingModal01(props) {
setSettingModalFirstOptions,
settingsData,
setSettingsData,
settingsDataSave,
setSettingsDataSave,
fetchSettings,
globalFont,
setGlobalFont,
planSizeSettingMode,
setPlanSizeSettingMode,
settingModalSecondOptions,
@ -36,9 +40,19 @@ export default function SettingModal01(props) {
setGridColor,
color,
} = useCanvasSetting()
const firstProps = { canvas, settingModalFirstOptions, setSettingModalFirstOptions, settingsData, setSettingsData }
const firstProps = {
canvas,
settingModalFirstOptions,
setSettingModalFirstOptions,
settingsData,
setSettingsData,
settingsDataSave,
setSettingsDataSave,
}
const secondProps = {
fetchSettings,
globalFont,
setGlobalFont,
planSizeSettingMode,
setPlanSizeSettingMode,
settingModalSecondOptions,
@ -46,6 +60,10 @@ export default function SettingModal01(props) {
adsorptionPointMode,
setAdsorptionPointMode,
setAdsorptionRange,
settingsData,
setSettingsData,
settingsDataSave,
setSettingsDataSave,
}
const gridProps = { gridColor, setGridColor, color }

23
src/components/floor-plan/modal/setting01/dimensionLine/DimensionLineSetting.jsx
View File

@ -33,7 +33,7 @@ const fontSizes = [
]
export default function DimensionLineSetting(props) {
const { isShow, setIsShow, id, pos = { x: 985, y: 180 } } = props
const { isShow, setIsShow, id, pos = { x: 985, y: 180 }, settingsData, setSettingsData, settingsDataSave, setSettingsDataSave } = props
const { addPopup, closePopup, closePopups } = usePopup()
const pixels = Array.from({ length: 5 }).map((_, index) => {
return { id: index, name: index + 1, value: index + 1 }
@ -111,11 +111,16 @@ export default function DimensionLineSetting(props) {
color: originColor,
setColor: setOriginColor,
id: colorModalId,
name: 'DimensionLineColor',
isConfig: true,
pos: {
x: 495,
y: 180,
},
settingsData,
setSettingsData,
settingsDataSave,
setSettingsDataSave,
}
const fontProps = {
@ -157,9 +162,10 @@ export default function DimensionLineSetting(props) {
fontSize: originFontSize,
fontColor: originFontColor,
},
fontFlag: true,
//fontFlag: true,
}
})
setDimensionLineSettings((prev) => {
return {
...prev,
@ -167,6 +173,19 @@ export default function DimensionLineSetting(props) {
color: originColor,
}
})
setSettingsData({
...settingsData,
dimensionLineText: {
fontFamily: originFont,
fontWeight: originFontWeight,
fontSize: originFontSize,
fontColor: originFontColor,
},
pixel: originPixel.name,
color: originColor,
})
setIsShow(false)
closePopups([fontModalId, colorModalId, id])
}

11
src/components/floor-plan/modal/setting01/planSize/PlanSizeSetting.jsx
View File

@ -8,7 +8,7 @@ import { useCanvasSetting } from '@/hooks/option/useCanvasSetting'
import { onlyNumberInputChange } from '@/util/input-utils'
export default function PlanSizeSetting(props) {
const { setIsShow, horizon, vertical, id, pos = { x: 985, y: 180 } } = props
const { setIsShow, horizon, vertical, id, pos = { x: 985, y: 180 }, settingsData, setSettingsData, settingsDataSave, setSettingsDataSave } = props
const { closePopup } = usePopup()
const { getMessage } = useMessage()
@ -26,10 +26,15 @@ export default function PlanSizeSetting(props) {
...prev,
originHorizon: Number(planSizeSettingMode.originHorizon),
originVertical: Number(planSizeSettingMode.originVertical),
flag: true,
}
})
setSettingsData({
...settingsData,
originHorizon: Number(planSizeSettingMode.originHorizon),
originVertical: Number(planSizeSettingMode.originVertical),
})
canvas.setWidth(planSizeSettingMode.originHorizon)
canvas.setHeight(planSizeSettingMode.originVertical)
canvas.renderAll()
@ -40,7 +45,7 @@ export default function PlanSizeSetting(props) {
const changeInput = (value, e) => {
const { name } = e.target
console.log('name', name, value)
setPlanSizeSettingMode((prev) => {
return {
...prev,

183
src/hooks/option/useCanvasSetting.js
View File

@ -48,28 +48,15 @@ export function useCanvasSetting() {
const [settingModalFirstOptions, setSettingModalFirstOptions] = useRecoilState(settingModalFirstOptionsState)
const [settingModalSecondOptions, setSettingModalSecondOptions] = useRecoilState(settingModalSecondOptionsState)
// const [settingsData, setSettingsData] = useRecoilState(settingsState)
const [settingsData, setSettingsData] = useState({ ...settingModalFirstOptions, ...settingModalSecondOptions })
const { option1, option2, dimensionDisplay } = settingModalFirstOptions
const { option4 } = settingModalSecondOptions
const corridorDimension = useRecoilValue(corridorDimensionSelector)
const globalLocaleState = useRecoilValue(globalLocaleStore)
const { get, post } = useAxios(globalLocaleState)
const { getMessage } = useMessage()
const { swalFire } = useSwal()
const [adsorptionPointMode, setAdsorptionPointMode] = useRecoilState(adsorptionPointModeState)
const [adsorptionRange, setAdsorptionRange] = useRecoilState(adsorptionRangeState)
const [planSizeSettingMode, setPlanSizeSettingMode] = useRecoilState(planSizeSettingState)
//const setAdsorptionRange = useSetRecoilState(adsorptionRangeState)
const [selectedFont, setSelectedFont] = useState()
const [selectedFontWeight, setSelectedFontWeight] = useState()
const [selectedFontSize, setSelectedFontSize] = useState()
const [selectedFontColor, setSelectedFontColor] = useState()
const [globalFont, setGlobalFont] = useRecoilState(globalFontAtom)
const [adsorptionPointMode, setAdsorptionPointMode] = useRecoilState(adsorptionPointModeState)
const [adsorptionRange, setAdsorptionRange] = useRecoilState(adsorptionRangeState)
const [planSizeSettingMode, setPlanSizeSettingMode] = useRecoilState(planSizeSettingState)
const [dimensionLineSettings, setDimensionLineSettings] = useRecoilState(dimensionLineSettingsState)
const setSettingModalGridOptions = useSetRecoilState(settingModalGridOptionsState)
@ -80,7 +67,26 @@ export function useCanvasSetting() {
)
const [gridColor, setGridColor] = useRecoilState(gridColorState)
const [color, setColor] = useColor(gridColor ?? '#FF0000')
const [colorTemp, setColorTemp] = useState()
const [settingsData, setSettingsData] = useState({
...settingModalFirstOptions,
...settingModalSecondOptions,
...globalFont,
...dotLineGridSetting,
...planSizeSettingMode,
...dimensionLineSettings,
...color,
})
const [settingsDataSave, setSettingsDataSave] = useState()
const { option1, option2, dimensionDisplay } = settingModalFirstOptions
const { option4 } = settingModalSecondOptions
const corridorDimension = useRecoilValue(corridorDimensionSelector)
const globalLocaleState = useRecoilValue(globalLocaleStore)
const { get, post } = useAxios(globalLocaleState)
const { getMessage } = useMessage()
const { swalFire } = useSwal()
const [canvasSetting, setCanvasSetting] = useRecoilState(canvasSettingState)
const [basicSetting, setBasicSettings] = useRecoilState(basicSettingState)
@ -91,7 +97,6 @@ export function useCanvasSetting() {
{ id: 3, name: '1/4', value: 1 / 4 },
{ id: 4, name: '1/10', value: 1 / 10 },
]
const [selectOption, setSelectOption] = useState(SelectOptions[0])
useEffect(() => {
if (!canvas) {
@ -132,58 +137,10 @@ export function useCanvasSetting() {
}, [canvasSetting])
useEffect(() => {
console.log('🚀 ~ useEffect ~ settingsData:', settingsData)
console.log('🚀 ~ useEffect ~ settingsDataSave:', settingsDataSave)
if (settingsDataSave !== undefined) onClickOption2()
}, [settingsData])
//흡착점 ON/OFF 변경 시
// useEffect(() => {
// //console.log('useCanvasSetting 실행2', adsorptionPointMode.fontFlag, correntObjectNo)
// if (adsorptionPointMode.fontFlag) {
// onClickOption2()
// }
// }, [adsorptionPointMode])
// 1 과 2 변경 시
// useEffect(() => {
// //console.log('useCanvasSetting 실행3', settingModalFirstOptions.fontFlag, settingModalSecondOptions.fontFlag, correntObjectNo)
// if (settingModalFirstOptions.fontFlag || settingModalSecondOptions.fontFlag) {
// onClickOption2()
// }
// }, [settingModalFirstOptions, settingModalSecondOptions])
// 글꼴 변경 시
// useEffect(() => {
// //console.log('useCanvasSetting 실행4', globalFont.fontFlag, correntObjectNo)
// if (globalFont.fontFlag) {
// onClickOption2()
// }
// }, [globalFont])
// 도명크기 변경 시
// useEffect(() => {
// //console.log('useCanvasSetting 실행5', planSizeSettingMode.flag, correntObjectNo)
// if (planSizeSettingMode.flag) {
// onClickOption2()
// }
// }, [planSizeSettingMode])
// 점/선 그리드 변경 시
// useEffect(() => {
// //console.log('useCanvasSetting 실행6', dotLineGridSetting.flag)
// if (dotLineGridSetting.flag) {
// onClickOption2()
// }
// }, [dotLineGridSetting])
// 그리드 색 설정 변경 시
// useEffect(() => {
// console.log('useCanvasSetting 실행7', colorTemp, gridColor)
// //colorTemp는 변경 전.. 값이 있고 변경된 컬러와 다를 때 실행
// if (colorTemp !== undefined && colorTemp !== gridColor) {
// onClickOption2()
// }
// }, [color])
const getFonts = (itemValue) => {
if (!itemValue) return { id: 1, name: 'MS PGothic', value: 'MS PGothic' }
const data = [
@ -357,18 +314,13 @@ export function useCanvasSetting() {
const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ ...item }))
//흡착점 ON/OFF
setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: res.adsorpPoint, fontFlag: false })
setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: res.adsorpPoint })
//치수선 설정
setDimensionLineSettings({ ...dimensionLineSettings, pixel: res.originPixel, color: res.originColor })
//도면크기 설정
setPlanSizeSettingMode({
...planSizeSettingMode,
originHorizon: res.originHorizon,
originVertical: res.originVertical,
flag: false,
})
setPlanSizeSettingMode({ ...planSizeSettingMode, originHorizon: res.originHorizon, originVertical: res.originVertical })
// 데이터 설정
setSettingModalFirstOptions({
@ -376,13 +328,13 @@ export function useCanvasSetting() {
option1: optionData1,
option2: optionData2,
dimensionDisplay: optionData5,
fontFlag: false,
//fontFlag: false,
})
setSettingModalSecondOptions({
...settingModalSecondOptions,
option3: optionData3,
option4: optionData4,
fontFlag: false,
//fontFlag: false,
})
const fontPatternData = {
@ -422,7 +374,7 @@ export function useCanvasSetting() {
fontColor: getFontColors(res.lengthFontColor),
},
//글꼴 설정 Flag
fontFlag: false,
//fontFlag: false,
}
//조회된 글꼴 데이터 set
@ -439,55 +391,45 @@ export function useCanvasSetting() {
},
DOT: res.dotGridDisplay,
LINE: res.lineGridDisplay,
flag: false,
}
const matchedOption = SelectOptions.find((option) => option.value == res.gridDimen)
// dimension 값에 맞는 옵션을 선택
setSelectOption(matchedOption)
setDotLineGridSettingState(patternData)
//setCurrentSetting(patternData)
//그리드 색 설정
setGridColor(res.gridColor)
setColorTemp(res.gridColor)
} else {
//조회된 글꼴 데이터가 없는 경우
//흡착점 ON/OFF
setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: false, fontFlag: false })
setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: false })
//치수선 설정
setDimensionLineSettings({ ...dimensionLineSettings })
//도면크기 설정
setPlanSizeSettingMode({
...planSizeSettingMode,
flag: false,
})
setPlanSizeSettingMode({ ...planSizeSettingMode })
// 데이터 설정
setSettingModalFirstOptions({
...settingModalFirstOptions,
fontFlag: false,
//fontFlag: false,
})
setSettingModalSecondOptions({
...settingModalSecondOptions,
fontFlag: false,
//fontFlag: false,
})
setGlobalFont({ ...globalFont, fontFlag: false })
setGlobalFont({ ...globalFont })
//점/선 그리드
setDotLineGridSettingState({ ...defaultDotLineGridSetting, flag: false })
setDotLineGridSettingState({ ...defaultDotLineGridSetting })
//setCurrentSetting({ ...defaultDotLineGridSetting })
//그리드 색 설정
setGridColor('#FF0000')
setColorTemp('#FF0000')
}
frontSettings()
} catch (error) {
console.error('Data fetching error:', error)
@ -513,8 +455,31 @@ export function useCanvasSetting() {
secondOption2: option4.map((item) => ({
column: item.column,
selected: item.selected,
range: item.range,
})),
}
// const option1Array = dataToSend.firstOption1.map((item) => ({
// allocDisplay: item.selected,
// outlineDisplay: item.selected,
// gridDisplay: item.selected,
// lineDisplay: item.selected,
// wordDisplay: item.selected,
// circuitNumDisplay: item.selected,
// flowDisplay: item.selected,
// trestleDisplay: item.selected,
// imageDisplay: item.selected,
// totalDisplay: item.selected,
// }))
// console.log('option1Array ', option1Array)
// const option2Array = dataToSend.firstOption2.map((item) => ({
// corridorDimension: item.selected,
// realDimension: item.selected,
// noneDimension: item.selected,
// }))
// console.log('option2Array ', option2Array)
// console.log('globalFont', globalFont)
const patternData = {
//견적서 번호
@ -543,6 +508,23 @@ export function useCanvasSetting() {
adsorpRangeSmallSemi: dataToSend.secondOption2[1].selected,
adsorpRangeMedium: dataToSend.secondOption2[2].selected,
adsorpRangeLarge: dataToSend.secondOption2[3].selected,
//adsorptionRange: dataToSend.secondOption2[0].range,
// //디스플레이 설정(다중)
// option1Array,
// //차수 표시(단 건)
// option2Array,
// //화면 표시(단 건)
// onlyBorder: dataToSend.firstOption2[0].selected,
// lineHatch: dataToSend.firstOption2[1].selected,
// allPainted: dataToSend.firstOption2[2].selected,
// //흡착범위 설정(단 건)
// adsorpRangeSmall: dataToSend.secondOption2[0].selected,
// adsorpRangeSmallSemi: dataToSend.secondOption2[1].selected,
// adsorpRangeMedium: dataToSend.secondOption2[2].selected,
// adsorpRangeLarge: dataToSend.secondOption2[3].selected,
//흡착점 ON/OFF
adsorpPoint: adsorptionPointMode.adsorptionPoint,
//??: adsorptionRange, 사용여부 확인 필요
@ -594,14 +576,11 @@ export function useCanvasSetting() {
gridRatio: dotLineGridSetting.INTERVAL.ratioInterval / 10,
gridDimen: dotLineGridSetting.INTERVAL.dimension,
//gridColor: gridColor.gridColor,
gridColor: gridColor,
}
console.log('patternData ', patternData)
setColorTemp(gridColor)
// HTTP POST 요청 보내기
await post({ url: `/api/canvas-management/canvas-settings`, data: patternData })
.then((res) => {
@ -719,15 +698,13 @@ export function useCanvasSetting() {
setDimensionLineSettings,
planSizeSettingMode,
setPlanSizeSettingMode,
selectOption,
setSelectOption,
SelectOptions,
currentSetting,
setCurrentSetting,
dotLineGridSettingState,
setSettingModalGridOptions,
setDotLineGridSettingState,
resetDotLineGridSetting,
setSettingModalGridOptions,
gridColor,
setGridColor,
color,
@ -740,5 +717,7 @@ export function useCanvasSetting() {
basicSettingSave,
settingsData,
setSettingsData,
settingsDataSave,
setSettingsDataSave,
}
}