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

배치면초기설정 초기 데이터 오류 수정 및 주석 처리

Browse Source
This commit is contained in:
changkyu choi 2025-02-24 17:32:03 +09:00
parent 4998dbc6d3
commit 6ecdc1bf97
2 changed files with 116 additions and 189 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
View File

@ -63,20 +63,21 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
/**
* 지붕재 초기값
*/
const defaultRoofSettings = {
roofSizeSet: '1', // 기본 치수 입력 방법
roofAngleSet: 'slope', // 기본 지붕 각도 설정
const DEFAULT_ROOF_SETTINGS = {
roofSizeSet: '1',
roofAngleSet: 'slope',
angle: 21.8,
hajebichi: '',
hajebichi: null,
id: 'ROOF_ID_WA_53A',
index: 0,
layout: ROOF_MATERIAL_LAYOUT.PARALLEL,
lenAuth: 'R',
lenBase: '235.000',
length: '235',
length: 235,
name: '일본기와 A',
nameJp: '和瓦A',
pitch: 4,
planNo: planNo,
raft: '',
raftAuth: 'C',
raftBaseCd: 'HEI_455',
@ -89,12 +90,12 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
selected: true,
widAuth: 'R',
widBase: '265.000',
width: '265',
width: 265,
}
useEffect(() => {
/**
* 메뉴에서 배치면초기설정 선택 시 조회
* 메뉴에서 배치면초기설정 선택 시 조회 후 화면 오픈
*/
if (openPoint && openPoint === 'canvasMenus') fetchBasicSettings(planNo, openPoint)
}, [])
@ -103,18 +104,16 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
if (addedRoofs.length > 0) {
const raftCodeList = findCommonCode('203800')
setRaftCodes(raftCodeList)
/**
* 데이터 설정 확인 후 데이터가 없으면 기본 데이터 설정
*/
if (addedRoofs.length > 0) {
setCurrentRoof({ ...addedRoofs[0], planNo: basicSetting.planNo })
} else {
setCurrentRoof(defaultRoofSettings)
}
setCurrentRoof({ ...addedRoofs[0], planNo: planNo, roofSizeSet: String(basicSetting.roofSizeSet), roofAngleSet: basicSetting.roofAngleSet })
} else {
/** 데이터 설정 확인 후 데이터가 없으면 기본 데이터 설정 */
setCurrentRoof({ ...DEFAULT_ROOF_SETTINGS })
}
}, [addedRoofs])
/**
* 배치면초기설정 정보 변경 시 basicSettings 설정
*/
useEffect(() => {
if (!currentRoof) return
setBasicSettings({
@ -256,7 +255,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
id={item.id}
name={item.name}
value={item.value}
checked={currentRoof?.roofSizeSet === item.value}
checked={String(currentRoof?.roofSizeSet) === item.value}
onChange={(e) => setCurrentRoof({ ...currentRoof, roofSizeSet: e.target.value })}
/>
<label htmlFor={item.id}>{getMessage(item.message)}</label>
@ -279,7 +278,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
id={item.id}
name={item.name}
value={item.value}
checked={currentRoof?.roofAngleSet === item.value}
checked={String(currentRoof?.roofAngleSet) === item.value}
onChange={(e) => setCurrentRoof({ ...currentRoof, roofAngleSet: e.target.value })}
/>
<label htmlFor={item.id}>{getMessage(item.message)}</label>

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

@ -43,21 +43,19 @@ import { v4 as uuidv4 } from 'uuid'
const defaultDotLineGridSetting = {
INTERVAL: {
type: 2, // 1: 가로,세로 간격 수동, 2: 비율 간격
type: 2 /* 1: 가로,세로 간격 수동, 2: 비율 간격 */,
ratioInterval: 910,
verticalInterval: 910,
horizontalInterval: 910,
dimension: 1, // 치수
dimension: 1 /* 치수 */,
},
DOT: false,
LINE: false,
}
// let previousRoofMaterialsYn = 'N' // 지붕재 select 정보 비교 후 변경된 것이 없으면 1회만 실행
export function useCanvasSetting() {
const canvas = useRecoilValue(canvasState)
/* canvas가 null이 아닐 때에만 getObjects 호출 */
/** canvas가 null이 아닐 때에만 getObjects 호출 */
const canvasObjects = canvas ? canvas.getObjects() : []
const [correntObjectNo, setCorrentObjectNo] = useRecoilState(correntObjectNoState)
@ -119,14 +117,14 @@ export function useCanvasSetting() {
const [type, setType] = useRecoilState(menuTypeState)
const setCurrentMenu = useSetRecoilState(currentMenuState)
const resetModuleSelectionData = useResetRecoilState(moduleSelectionDataState) //다음으로 넘어가는 최종 데이터
const resetSelectedModules = useResetRecoilState(selectedModuleState) //선택된 모듈
const resetModuleSelectionData = useResetRecoilState(moduleSelectionDataState) /* 다음으로 넘어가는 최종 데이터 */
const resetSelectedModules = useResetRecoilState(selectedModuleState) /* 선택된 모듈 */
const { trigger: moduleSelectedDataTrigger } = useCanvasPopupStatusController(2)
const [raftCodes, setRaftCodes] = useState([]) // 서까래 정보
const [raftCodes, setRaftCodes] = useState([]) /* 서까래 정보 */
const { findCommonCode } = useCommonCode()
const [currentRoof, setCurrentRoof] = useState(null) // 현재 선택된 지붕재 정보
const [currentRoof, setCurrentRoof] = useState(null) /* 현재 선택된 지붕재 정보 */
const { addPopup } = usePopup()
const [popupId, setPopupId] = useState(uuidv4())
@ -144,7 +142,7 @@ export function useCanvasSetting() {
useEffect(() => {
const tempFetchRoofMaterials = !fetchRoofMaterials
/* 초 1회만 실행하도록 처리 */
/** 초 1회만 실행하도록 처리 */
setFetchRoofMaterials(tempFetchRoofMaterials)
if (tempFetchRoofMaterials) {
addRoofMaterials()
@ -176,7 +174,23 @@ export function useCanvasSetting() {
angle: item.angle ? parseInt(item.angle) : 21.8,
}))
setRoofMaterials(roofLists)
const selectedRoofMaterial = roofLists[0]
}
useEffect(() => {
if (addedRoofs.length > 0 && addedRoofs[0].planNo === basicSetting.planNo) {
const raftCodeList = findCommonCode('203800')
setRaftCodes(raftCodeList)
setCurrentRoof({
...addedRoofs[0],
planNo: addedRoofs[0].planNo,
roofSizeSet: String(basicSetting.roofSizeSet),
roofAngleSet: basicSetting.roofAngleSet,
})
}
}, [addedRoofs])
useEffect(() => {
const selectedRoofMaterial = roofMaterials[0]
if (addedRoofs.length === 0) {
const newAddedRoofs = []
@ -184,19 +198,7 @@ export function useCanvasSetting() {
setAddedRoofs(newAddedRoofs)
}
setBasicSettings({ ...basicSetting, selectedRoofMaterial: selectedRoofMaterial })
}
/**
* 배치면 초기설정 화면이 열리지 않아도 데이터 set 하기 위해서 추가
*/
useEffect(() => {
if (addedRoofs.length > 0) {
const raftCodeList = findCommonCode('203800')
setRaftCodes(raftCodeList)
setCurrentRoof({ ...addedRoofs[0] })
}
}, [addedRoofs])
}, [roofMaterials])
useEffect(() => {
if (!canvas) {
@ -339,7 +341,7 @@ export function useCanvasSetting() {
}
})
/* 데이터 존재 시 화면 닫기(메뉴/저장 클릭 시 제외) */
/** 데이터 존재 시 화면 닫기(메뉴/저장 클릭 시 제외) */
if (openPoint !== 'canvasMenus' && openPoint !== 'basicSettingSave') {
//closePopup(popupId)
closeAll()
@ -369,9 +371,9 @@ export function useCanvasSetting() {
},
]
/* 메뉴에서 배치면 초기설정 클릭 시 실행하지 않음 */
/** 메뉴에서 배치면 초기설정 클릭 시 실행하지 않음 */
if (openPoint === null) {
/* 배치면 초기설정 미저장 상태이면 화면 열기 */
/** 배치면 초기설정 미저장 상태이면 화면 열기 */
const placementInitialProps = {
id: popupId,
pos: {
@ -385,7 +387,7 @@ export function useCanvasSetting() {
}
}
/* 데이터 설정 */
/** 데이터 설정 */
const addRoofs = []
for (let i = 0; i < roofsArray.length; i++) {
roofMaterials?.map((material) => {
@ -440,6 +442,21 @@ export function useCanvasSetting() {
// setCanvasSetting({ ...basicSetting })
}
/**
* 저장/복사저장 시 지붕 크기에 따른 메뉴 설정
*/
const setMenuByRoofSize = (roofSizeSet) => {
if (['2', '3'].includes(String(roofSizeSet))) {
setMenuNumber(3)
setType('surface')
setCurrentMenu(MENU.BATCH_CANVAS.BATCH_DRAWING)
} else {
setMenuNumber(2)
setType('outline')
setCurrentMenu(MENU.ROOF_COVERING.EXTERIOR_WALL_LINE)
}
}
/**
* 기본설정(PlacementShapeSetting) 저장
*/
@ -471,31 +488,23 @@ export function useCanvasSetting() {
await post({ url: `/api/canvas-management/canvas-basic-settings`, data: patternData }).then((res) => {
swalFire({ text: getMessage(res.returnMessage) })
/* BasicSettings Recoil 설정 */
/** BasicSettings Recoil 설정 */
setBasicSettings({ ...params })
})
/* CanvasSetting Recoil 설정 - roofSizeSet을 문자열로 변환 */
/** CanvasSetting Recoil 설정 - roofSizeSet을 문자열로 변환 */
setCanvasSetting({
...basicSetting,
roofSizeSet: String(params.roofSizeSet),
})
/* 메뉴 설정 */
if (['2', '3'].includes(params.roofSizeSet)) {
setMenuNumber(3)
setType('surface')
setCurrentMenu(MENU.BATCH_CANVAS.BATCH_DRAWING)
} else {
setMenuNumber(2)
setType('outline')
setCurrentMenu(MENU.ROOF_COVERING.EXTERIOR_WALL_LINE)
}
/** 메뉴 설정 */
setMenuByRoofSize(params.roofSizeSet)
/* 배치면초기설정 조회 */
/** 배치면초기설정 조회 */
fetchBasicSettings(params.planNo, 'basicSettingSave')
/* 모듈 선택 데이터 초기화 */
/** 모듈 선택 데이터 초기화 */
resetModuleSelectionData()
moduleSelectedDataTrigger({ common: {}, module: {}, roofConstructions: [] })
const isModuleExist = canvas.getObjects().some((obj) => obj.name === POLYGON_TYPE.MODULE)
@ -536,27 +545,19 @@ export function useCanvasSetting() {
swalFire({ text: getMessage(res.returnMessage) })
})
/* CanvasSetting Recoil 설정 - roofSizeSet을 문자열로 변환 */
/** CanvasSetting Recoil 설정 - roofSizeSet을 문자열로 변환 */
setCanvasSetting({
...basicSetting,
roofSizeSet: String(params.roofSizeSet),
})
/* 메뉴 설정 */
if (['2', '3'].includes(params?.roofSizeSet)) {
setMenuNumber(3)
setType('surface')
setCurrentMenu(MENU.BATCH_CANVAS.BATCH_DRAWING)
} else {
setMenuNumber(2)
setType('outline')
setCurrentMenu(MENU.ROOF_COVERING.EXTERIOR_WALL_LINE)
}
/** 메뉴 설정 */
setMenuByRoofSize(params.roofSizeSet)
/* 배치면초기설정 조회 */
/** 배치면초기설정 조회 */
fetchBasicSettings(Number(params.planNo), 'basicSettingSave')
/* 모듈 선택 데이터 초기화 */
/** 모듈 선택 데이터 초기화 */
resetModuleSelectionData()
moduleSelectedDataTrigger({ common: {}, module: {}, roofConstructions: [] })
const isModuleExist = canvas.getObjects().some((obj) => obj.name === POLYGON_TYPE.MODULE)
@ -582,24 +583,16 @@ export function useCanvasSetting() {
const optionData4 = settingModalSecondOptions.option4.map((item) => ({ ...item, selected: res[item.column] }))
const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ ...item }))
/**
* 흡착점 ON/OFF
*/
/** 흡착점 ON/OFF */
setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: res.adsorpPoint })
/**
* 치수선 설정
*/
/** 치수선 설정 */
setDimensionLineSettings({ ...dimensionLineSettings, pixel: res.originPixel, color: res.originColor })
/**
* 도면크기 설정
*/
/** 도면크기 설정 */
setPlanSizeSettingMode({ ...planSizeSettingMode, originHorizon: res.originHorizon, originVertical: res.originVertical })
/**
* 데이터 설정
*/
/** 데이터 설정 */
setSettingModalFirstOptions({
...settingModalFirstOptions,
option1: optionData1,
@ -614,45 +607,35 @@ export function useCanvasSetting() {
const fontPatternData = {
commonText: {
/**
* 문자 글꼴 조회 데이터
*/
/** 문자 글꼴 조회 데이터 */
fontFamily: getFonts(res.wordFont),
fontWeight: getFontStyles(res.wordFontStyle),
fontSize: getFontSizes(res.wordFontSize),
fontColor: getFontColors(res.wordFontColor),
},
flowText: {
/**
* 흐름방향 글꼴 조회 데이터
*/
/** 흐름방향 글꼴 조회 데이터 */
fontFamily: getFonts(res.flowFont),
fontWeight: getFontStyles(res.flowFontStyle),
fontSize: getFontSizes(res.flowFontSize),
fontColor: getFontColors(res.flowFontColor),
},
dimensionLineText: {
/**
* 치수 글꼴 조회 데이터
*/
/** 치수 글꼴 조회 데이터 */
fontFamily: getFonts(res.dimensioFont),
fontWeight: getFontStyles(res.dimensioFontStyle),
fontSize: getFontSizes(res.dimensioFontSize),
fontColor: getFontColors(res.dimensioFontColor),
},
circuitNumberText: {
/**
* 회로번호 글꼴 조회 데이터
*/
/** 회로번호 글꼴 조회 데이터 */
fontFamily: getFonts(res.circuitNumFont),
fontWeight: getFontStyles(res.circuitNumFontStyle),
fontSize: getFontSizes(res.circuitNumFontSize),
fontColor: getFontColors(res.circuitNumFontColor),
},
lengthText: {
/**
* 치수선 글꼴 조회 데이터
*/
/** 치수선 글꼴 조회 데이터 */
fontFamily: getFonts(res.lengthFont),
fontWeight: getFontStyles(res.lengthFontStyle),
fontSize: getFontSizes(res.lengthFontSize),
@ -660,14 +643,10 @@ export function useCanvasSetting() {
},
}
/**
* 조회된 글꼴 데이터 set
*/
/** 조회된 글꼴 데이터 set */
setGlobalFont(fontPatternData)
/**
* 점/선 그리드
*/
/** 점/선 그리드 */
const patternData = {
INTERVAL: {
type: res.gridType,
@ -682,47 +661,31 @@ export function useCanvasSetting() {
setDotLineGridSettingState(patternData)
/**
* 그리드 색 설정
*/
/** 그리드 색 설정 */
setGridColor(res.gridColor)
} else {
//조회된 글꼴 데이터가 없는 경우 (데이터 초기화)
/** 조회된 글꼴 데이터가 없는 경우 (데이터 초기화) */
/**
* 흡착점 ON/OFF
*/
/** 흡착점 ON/OFF */
setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: false })
/**
* 치수선 설정
*/
/** 치수선 설정 */
resetDimensionLineSettings()
/**
* 도면크기 설정
*/
/** 도면크기 설정 */
resetPlanSizeSettingMode()
/**
* 데이터 설정
*/
/** 데이터 설정 */
resetSettingModalFirstOptions()
resetSettingModalSecondOptions()
/**
* 데이터 초기화
*/
/** 데이터 초기화 */
resetGlobalFont()
/**
* 점/선 그리드
*/
/** 점/선 그리드 */
setDotLineGridSettingState({ ...defaultDotLineGridSetting })
/**
* 그리드 색 설정
*/
/** 그리드 색 설정 */
setGridColor('#FF0000')
}
@ -736,9 +699,7 @@ export function useCanvasSetting() {
* CanvasSetting 옵션 클릭 후 저장
*/
const onClickOption2 = async () => {
/**
* 서버에 전송할 데이터
*/
/** 서버에 전송할 데이터 */
const dataToSend = {
firstOption1: option1.map((item) => ({
column: item.column,
@ -759,13 +720,9 @@ export function useCanvasSetting() {
})),
}
const patternData = {
/**
* 견적서 번호
*/
/** 견적서 번호 */
objectNo: correntObjectNo,
/**
* 디스플레이 설정(다중)
*/
/** 디스플레이 설정(다중) */
allocDisplay: dataToSend.firstOption1[0].selected,
outlineDisplay: dataToSend.firstOption1[1].selected,
gridDisplay: dataToSend.firstOption1[2].selected,
@ -776,85 +733,62 @@ export function useCanvasSetting() {
trestleDisplay: dataToSend.firstOption1[7].selected,
imageDisplay: dataToSend.firstOption1[8].selected,
totalDisplay: dataToSend.firstOption1[9].selected,
/**
* 차수 표시(단 건)
*/
/** 차수 표시(단 건) */
corridorDimension: dataToSend.firstOption3[0].selected,
realDimension: dataToSend.firstOption3[1].selected,
noneDimension: dataToSend.firstOption3[2].selected,
/**
* 화면 표시(단 건)
*/
/** 화면 표시(단 건) */
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
*/
/** 흡착점 ON/OFF */
adsorpPoint: adsorptionPointMode.adsorptionPoint,
//??: adsorptionRange, 사용여부 확인 필요
/**
* 글꼴 설정
*/
//문자 글꼴
/** 문자 글꼴 설정 */
wordFont: globalFont.commonText.fontFamily?.value ?? 'MS PGothic',
wordFontStyle: globalFont.commonText.fontWeight?.value ?? 'normal',
wordFontSize: globalFont.commonText.fontSize?.value ?? 16,
wordFontColor: globalFont.commonText.fontColor?.value ?? 'black',
/**
* 흐름방향 글꼴
*/
/** 흐름방향 글꼴 설정 */
flowFont: globalFont.flowText.fontFamily?.value ?? 'MS PGothic',
flowFontStyle: globalFont.flowText.fontWeight?.value ?? 'normal',
flowFontSize: globalFont.flowText.fontSize?.value ?? 16,
flowFontColor: globalFont.flowText.fontColor?.value ?? 'black',
/**
* 치수 글꼴
*/
/** 치수 글꼴 설정 */
dimensioFont: globalFont.dimensionLineText.fontFamily?.value ?? 'MS PGothic',
dimensioFontStyle: globalFont.dimensionLineText.fontWeight?.value ?? 'normal',
dimensioFontSize: globalFont.dimensionLineText.fontSize?.value ?? 16,
dimensioFontColor: globalFont.dimensionLineText.fontColor?.value ?? 'black',
/**
* 회로번호 글꼴
*/
/** 회로번호 글꼴 설정 */
circuitNumFont: globalFont.circuitNumberText.fontFamily?.value ?? 'MS PGothic',
circuitNumFontStyle: globalFont.circuitNumberText.fontWeight?.value ?? 'normal',
circuitNumFontSize: globalFont.circuitNumberText.fontSize?.value ?? 16,
circuitNumFontColor: globalFont.circuitNumberText.fontColor?.value ?? 'black',
/**
* 치수선 글꼴
*/
/** 치수선 글꼴 설정 */
lengthFont: globalFont.lengthText.fontFamily?.value ?? 'MS PGothic',
lengthFontStyle: globalFont.lengthText.fontWeight?.value ?? 'normal',
lengthFontSize: globalFont.lengthText.fontSize?.value ?? 16,
lengthFontColor: globalFont.lengthText.fontColor?.value ?? 'black',
/**
* 치수선 설정
*/
/** 치수선 설정 */
originPixel: dimensionLineSettings.pixel,
originColor: dimensionLineSettings.color,
/**
* 도면크기 설정
*/
/** 도면크기 설정 */
originHorizon: planSizeSettingMode.originHorizon,
originVertical: planSizeSettingMode.originVertical,
/** 점/선 그리드 */
dotGridDisplay: dotLineGridSetting.DOT,
lineGridDisplay: dotLineGridSetting.LINE,
gridType: dotLineGridSetting.INTERVAL.type,
@ -863,6 +797,7 @@ export function useCanvasSetting() {
gridRatio: dotLineGridSetting.INTERVAL.ratioInterval / 10,
gridDimen: dotLineGridSetting.INTERVAL.dimension,
/** 그리드 색 설정 */
gridColor: gridColor,
}
@ -875,13 +810,10 @@ export function useCanvasSetting() {
.then((res) => {
//swalFire({ text: getMessage(res.returnMessage) })
/**
* Canvas 디스플레이 설정 시 해당 옵션 적용
*/
/** Canvas 디스플레이 설정 시 해당 옵션 적용 */
frontSettings()
/**
* 저장 후 재조회
*/
/** 저장 후 재조회 */
fetchSettings()
})
.catch((error) => {
@ -912,8 +844,8 @@ export function useCanvasSetting() {
*/
/**
* 옵션명
* 옵션상태
* 옵션명 optionName
* 옵션상태 optionSelected
*/
let optionName
let optionSelected
@ -948,15 +880,11 @@ export function useCanvasSetting() {
optionName = ['backGroundImage']
break
case 'totalDisplay':
/**
* 작업할 필요 없음
*/
/** 작업할 필요 없음 */
optionName = []
break
}
/**
* 표시 선택 상태(true/false)
*/
/** 표시 선택 상태(true/false)*/
optionSelected = option1[i].selected
canvasObjects