qcast-front/src/store/settingAtom.js

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: false },
      { id: 2, column: 'outlineDisplay', name: 'modal.canvas.setting.first.option.outline', selected: false },
      { id: 3, column: 'gridDisplay', name: 'modal.canvas.setting.first.option.grid', selected: false },
      { id: 4, column: 'lineDisplay', name: 'modal.canvas.setting.first.option.roof.line', selected: false },
      { id: 5, column: 'wordDisplay', name: 'modal.canvas.setting.first.option.word', selected: false },
      { id: 6, column: 'circuitNumDisplay', name: 'modal.canvas.setting.first.option.circuit.num', selected: false },
      { id: 7, column: 'flowDisplay', name: 'modal.canvas.setting.first.option.flow', selected: false },
      { id: 8, column: 'trestleDisplay', name: 'modal.canvas.setting.first.option.trestle', selected: false },
      { id: 9, column: 'totalDisplay', name: 'modal.canvas.setting.first.option.total', selected: false },
    ],
    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 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)
  },
})

// 디스플레이 설정 - 화면 표시
export const realDimensionSelector = selector({
  key: 'realDimensionSelector',
  get: ({ get }) => {
    const settingModalFirstOptions = get(settingModalFirstOptionsState)
    return settingModalFirstOptions.dimensionDisplay.find((option) => option.selected)
  },
})