import { atom, selector } from 'recoil' /** * 디스플레이 설정 */ export const settingModalFirstOptionsState = atom({ key: 'settingModalFirstOptions', default: { /** 디스플레이 설정 */ option1: [ { id: 1, column: 'allocDisplay', name: 'modal.canvas.setting.first.option.alloc', selected: true }, { id: 2, column: 'outlineDisplay', name: 'modal.canvas.setting.first.option.outline', selected: true }, { id: 3, column: 'gridDisplay', name: 'modal.canvas.setting.first.option.grid', selected: true }, { id: 4, column: 'lineDisplay', name: 'modal.canvas.setting.first.option.roof.line', selected: true }, { id: 5, column: 'wordDisplay', name: 'modal.canvas.setting.first.option.word', selected: true }, { id: 6, column: 'circuitNumDisplay', name: 'modal.canvas.setting.first.option.circuit.num', selected: true }, { id: 7, column: 'flowDisplay', name: 'modal.canvas.setting.first.option.flow', selected: true }, { id: 8, column: 'trestleDisplay', name: 'modal.canvas.setting.first.option.trestle', selected: true }, { id: 9, column: 'imageDisplay', name: 'modal.canvas.setting.first.option.image', selected: false }, { id: 10, column: 'totalDisplay', name: 'modal.canvas.setting.first.option.total', selected: true }, ], /** 치수 표시 */ dimensionDisplay: [ { id: 1, column: 'corridorDimension', name: 'modal.canvas.setting.first.option.corridor.dimension', selected: true, }, { id: 2, column: 'realDimension', name: 'modal.canvas.setting.first.option.real.dimension', selected: false }, { id: 3, column: 'noneDimension', name: 'modal.canvas.setting.first.option.none.dimension', selected: false }, ], /** 화면 표시 */ option2: [ { id: 1, column: 'onlyBorder', name: 'modal.canvas.setting.first.option.border', selected: true }, { id: 2, column: 'lineHatch', name: 'modal.canvas.setting.first.option.line', selected: false }, { id: 3, column: 'allPainted', name: 'modal.canvas.setting.first.option.all', selected: false }, ], }, dangerouslyAllowMutability: true, }) /** * 디스플레이 설정 - 문자 표시 */ export const settingModalSecondOptionsState = atom({ key: 'settingModalSecondOptions', default: { /** 문자 표시 */ option3: [ { id: 1, name: 'modal.canvas.setting.font.plan.edit.word' }, { id: 2, name: 'modal.canvas.setting.font.plan.edit.flow' }, { id: 3, name: 'modal.canvas.setting.font.plan.edit.dimension' }, { id: 4, name: 'modal.canvas.setting.font.plan.edit.circuit.num' }, ], /** 흡수범위 */ option4: [ { id: 1, column: 'adsorpRangeSmall', name: 'modal.canvas.setting.font.plan.absorption.small', selected: true, range: 10, }, { id: 2, column: 'adsorpRangeSmallSemi', name: 'modal.canvas.setting.font.plan.absorption.small.semi', selected: false, range: 30, }, { id: 3, column: 'adsorpRangeMedium', name: 'modal.canvas.setting.font.plan.absorption.medium', selected: false, range: 50, }, { id: 4, column: 'adsorpRangeLarge', name: 'modal.canvas.setting.font.plan.absorption.large', selected: false, range: 70, }, ], }, dangerouslyAllowMutability: true, }) /** * 디스플레이 설정 - 그리드 표시 */ export const settingModalGridOptionsState = atom({ key: 'settingModalGridOptions', default: [ { id: 1, name: 'modal.canvas.setting.grid.optional.line', selected: false }, { id: 2, name: 'modal.canvas.setting.grid.dot.line', selected: false }, { id: 3, name: 'modal.canvas.setting.grid.absorption.add', selected: false }, { id: 4, name: 'modal.canvas.setting.grid.color.setting', selected: false }, ], dangerouslyAllowMutability: true, }) /** * 디스플레이 설정 - 할당 표시 */ export const allocDisplaySelector = selector({ key: 'allocDisplaySelector', get: ({ get }) => { const settingModalFirstOptions = get(settingModalFirstOptionsState) return settingModalFirstOptions.option1.find((option) => option.column === 'allocDisplay').selected }, }) /** * 디스플레이 설정 - 외벽선 표시 */ export const outlineDisplaySelector = selector({ key: 'outlineDisplaySelector', get: ({ get }) => { const settingModalFirstOptions = get(settingModalFirstOptionsState) return settingModalFirstOptions.option1.find((option) => option.column === 'outlineDisplay').selected }, }) /** * 디스플레이 설정 - 그리드 표시 */ export const gridDisplaySelector = selector({ key: 'gridDisplaySelector', get: ({ get }) => { const settingModalFirstOptions = get(settingModalFirstOptionsState) return settingModalFirstOptions.option1.find((option) => option.column === 'gridDisplay').selected }, }) /** * 디스플레이 설정 - 지붕선 표시 */ export const roofLineDisplaySelector = selector({ key: 'lineDisplaySelector', get: ({ get }) => { const settingModalFirstOptions = get(settingModalFirstOptionsState) return settingModalFirstOptions.option1.find((option) => option.column === 'lineDisplay').selected }, }) /** * 디스플레이 설정 - 문자 표시 */ export const wordDisplaySelector = selector({ key: 'wordDisplaySelector', get: ({ get }) => { const settingModalFirstOptions = get(settingModalFirstOptionsState) return settingModalFirstOptions.option1.find((option) => option.column === 'wordDisplay').selected }, }) /** * 디스플레이 설정 - 회로번호 표시 */ export const circuitNumDisplaySelector = selector({ key: 'circuitNumDisplaySelector', get: ({ get }) => { const settingModalFirstOptions = get(settingModalFirstOptionsState) return settingModalFirstOptions.option1.find((option) => option.column === 'circuitNumDisplay').selected }, }) /** * 디스플레이 설정 - 흐름 방향 표시 */ export const flowDisplaySelector = selector({ key: 'flowDisplaySelector', get: ({ get }) => { const settingModalFirstOptions = get(settingModalFirstOptionsState) return settingModalFirstOptions.option1.find((option) => option.column === 'flowDisplay').selected }, }) /** * 디스플레이 설정 - 가대 표시 */ export const trestleDisplaySelector = selector({ key: 'trestleDisplaySelector', get: ({ get }) => { const settingModalFirstOptions = get(settingModalFirstOptionsState) return settingModalFirstOptions.option1.find((option) => option.column === 'trestleDisplay').selected }, }) /** * 디스플레이 설정 - 이미지 표시 */ export const imageDisplaySelector = selector({ key: 'imageDisplaySelector', get: ({ get }) => { const settingModalFirstOptions = get(settingModalFirstOptionsState) return settingModalFirstOptions.option1.find((option) => option.column === 'imageDisplay').selected }, }) /** * 디스플레이 설정 - 집계표 표시 */ export const totalDisplaySelector = selector({ key: 'totalDisplaySelector', get: ({ get }) => { const settingModalFirstOptions = get(settingModalFirstOptionsState) return settingModalFirstOptions.option1.find((option) => option.column === 'totalDisplay').selected }, }) /** * 디스플레이 설정 - 치수 표시 */ export const corridorDimensionSelector = selector({ key: 'corridorDimensionSelector', get: ({ get }) => { const settingModalFirstOptions = get(settingModalFirstOptionsState) return settingModalFirstOptions.dimensionDisplay.find((option) => option.selected) }, set: ({ set }, newValue) => { //0 : 복도치수 , 1 : 실제치수 set(settingModalFirstOptionsState, (prev) => { return { ...prev, dimensionDisplay: prev.dimensionDisplay.map((item, index) => { if (index === newValue) { return { ...item, selected: true } } else { return { ...item, selected: false } } }), } }) }, dangerouslyAllowMutability: true, }) /** * 디스플레이 설정 - 화면 표시 */ export const roofDisplaySelector = selector({ key: 'roofDisplaySelector', get: ({ get }) => { const settingModalFirstOptions = get(settingModalFirstOptionsState) return settingModalFirstOptions.option2.find((option) => option.selected) }, dangerouslyAllowMutability: true, }) /** * basicSetting 설정 */ export const basicSettingState = atom({ key: 'basicSettingState', default: { roofSizeSet: 1 /** 지붕크기 */, roofAngleSet: 'slope' /** 지붕각도 */, selectedRoofMaterial: {} /** 선택된 지붕재 */, roofs: [] /** 지붕면 할당에서 추가된 지붕재 목록 */, }, dangerouslyAllowMutability: true, }) /** * 지붕면 할당에서 추가된 지붕재 목록 */ export const addedRoofsState = atom({ key: 'addedRoofsState', default: [], }) /** * db에 등록된 지붕재 목록 */ export const roofMaterialsAtom = atom({ key: 'roofMaterialState', default: [], }) /** * 현재 선택된 지붕재 */ export const selectedRoofMaterialSelector = selector({ key: 'selectedRoofMaterialSelector', get: ({ get }) => { return get(basicSettingState).selectedRoofMaterial }, }) /** * QSelectBox에서 사용할 지붕재 목록 */ export const roofMaterialsSelector = selector({ key: 'roofMaterialsSelector', get: ({ get }) => { const roofMaterials = get(roofMaterialsAtom) return roofMaterials.map((material) => ({ ...material, id: material.roofMatlCd, name: material.roofMatlNm })) }, }) /** * 현재 선택된 물건 번호 */ export const correntObjectNoState = atom({ key: 'correntObjectNoState', default: '', }) /** * 지붕재 목록 조회 여부 */ export const fetchRoofMaterialsState = atom({ key: 'fetchRoofMaterialsState', default: false, })