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

Merge branch 'dev' of https://git.jetbrains.space/nalpari/q-cast-iii/qcast-front into dev

Browse Source 
# Conflicts:
#	src/components/common/font/FontSetting.jsx
This commit is contained in:
hyojun.choi 2024-10-24 18:25:41 +09:00
commit f3c79b782c
36 changed files with 1322 additions and 184 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/dictionary.txt
View File

@ -24,4 +24,4 @@ Allpainted : allPainted
개구: openSpace
도머: dormer
그림자: shadow
치수선: dimensionLine

2
src/components/Playground.jsx
View File

@ -138,7 +138,7 @@ export default function Playground() {
pageNo: 1,
pageSize: 10,
pagePerBlock: 10,
totalCount: 501,
totalCount: 26,
handleChangePage: (page) => {
console.log('page', page)
},

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

@ -3,9 +3,12 @@ import ColorPicker from '@/components/common/color-picker/ColorPicker'
import { useMessage } from '@/hooks/useMessage'
import { useEffect, useState } from 'react'
import { usePopup } from '@/hooks/usePopup'
import { useRecoilValue } from 'recoil'
import { contextPopupPositionState } from '@/store/popupAtom'
export default function ColorPickerModal(props) {
const { isShow, setIsShow, pos = { x: 770, y: -815 }, color = '#ff0000', setColor, id } = props
const contextPopupPosition = useRecoilValue(contextPopupPositionState) // 현재 메뉴
const { isShow, setIsShow, pos = contextPopupPosition, color = '#ff0000', setColor, id } = props
const { getMessage } = useMessage()
const [originColor, setOriginColor] = useState(color)
const { closePopup } = usePopup()
@ -15,14 +18,17 @@ export default function ColorPickerModal(props) {
}, [isShow])
return (
<WithDraggable isShow={true} pos={pos}>
<WithDraggable isShow={true} pos={pos ?? ''}>
<div className={`modal-pop-wrap lr mount`}>
<div className="modal-head">
<h1 className="title">{getMessage('modal.color.picker.title')}</h1>
<button
className="modal-close"
onClick={() => {
setIsShow(false)
if (setIsShow) {
setIsShow(false)
}
console.log(id)
closePopup(id)
}}
>
@ -40,8 +46,9 @@ export default function ColorPickerModal(props) {
<button
className="btn-frame modal act"
onClick={() => {
setColor(originColor)
setIsShow(false)
if (setColor) setColor(originColor)
if (setIsShow) setIsShow(false)
closePopup(id)
}}
>

8
src/components/common/font/FontSetting.jsx
View File

@ -5,6 +5,7 @@ import { useState } from 'react'
import { useMessage } from '@/hooks/useMessage'
import { useRecoilState, useRecoilValue } from 'recoil'
import { fontSelector, globalFontAtom } from '@/store/fontAtom'
import { contextPopupPositionState } from '@/store/popupAtom'
const fonts = [
{ name: 'MS PGothic', value: 'MS PGothic' },
@ -45,7 +46,8 @@ const fontColors = [
{ name: '남색', value: 'darkblue' },
]
export default function FontSetting(props) {
const { id, setIsShow, pos = { x: 455, y: 180 }, type } = props
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const { id, setIsShow, pos = contextPopupPosition, type } = props
const { getMessage } = useMessage()
const { closePopup } = usePopup()
const [globalFont, setGlobalFont] = useRecoilState(globalFontAtom)
@ -68,7 +70,7 @@ export default function FontSetting(props) {
},
}
})
setIsShow(false)
if (setIsShow) setIsShow(false)
closePopup(id)
}
@ -80,7 +82,7 @@ export default function FontSetting(props) {
<button
className="modal-close"
onClick={() => {
setIsShow(false)
if (setIsShow) setIsShow(false)
closePopup(id)
}}
>

2
src/components/common/pagination/QPagination.jsx
View File

@ -31,7 +31,7 @@ export default function QPagination(props) {
<button
onClick={() => {
if (currentPage === totalPages) return
handlePage(Math.max(1, pageGroup * pagePerBlock + 1))
if (pageGroup * pagePerBlock + 1 <= totalPages) handlePage(Math.max(1, pageGroup * pagePerBlock + 1))
}}
></button>
</li>

2
src/components/common/select/QSelectBox.jsx
View File

@ -20,7 +20,7 @@ export default function QSelectBox({ title = '', options, onChange, value }) {
<ul className="select-item-wrap">
{options?.map((option) => (
<li key={option.id} className="select-item" onClick={() => handleClickSelectOption(option)}>
<button>{option.name}</button>
<button key={option.id + 'btn'}>{option.name}</button>
</li>
))}
</ul>

5
src/components/floor-plan/CanvasFrame.jsx
View File

@ -16,7 +16,7 @@ export default function CanvasFrame({ plan }) {
const canvasRef = useRef(null)
const { canvas } = useCanvas('canvas')
const { handleZoomClear } = useCanvasEvent()
const { contextMenu, currentContextMenu, setCurrentContextMenu } = useContextMenu({
const { contextMenu, currentContextMenu, setCurrentContextMenu, handleClick } = useContextMenu({
externalFn: {
handleZoomClear,
},
@ -59,7 +59,7 @@ export default function CanvasFrame({ plan }) {
if (menu.fn) {
menu.fn()
}
setCurrentContextMenu(menu)
handleClick(e, menu)
}}
>
{menu.name}
@ -68,7 +68,6 @@ export default function CanvasFrame({ plan }) {
</ul>
))}
</QContextMenu>
{currentContextMenu?.component}
</div>
)
}

4
src/components/floor-plan/FloorPlan.jsx
View File

@ -5,14 +5,13 @@ import { useRecoilState, useRecoilValue } from 'recoil'
import { useAxios } from '@/hooks/useAxios'
import { globalLocaleStore } from '@/store/localeAtom'
import { settingModalFirstOptionsState, settingModalSecondOptionsState } from '@/store/settingAtom'
import '@/styles/contents.scss'
import CanvasMenu from '@/components/floor-plan/CanvasMenu'
import CanvasLayout from '@/components/floor-plan/CanvasLayout'
import '@/styles/contents.scss'
export default function FloorPlan() {
const globalLocaleState = useRecoilValue(globalLocaleStore)
const { get } = useAxios(globalLocaleState)
const [settingModalFirstOptions, setSettingModalFirstOptions] = useRecoilState(settingModalFirstOptionsState)
const [settingModalSecondOptions, setSettingModalSecondOptions] = useRecoilState(settingModalSecondOptionsState)
const [objectNo, setObjectNo] = useState('test123240912001') // 이후 삭제 필요
@ -23,7 +22,6 @@ export default function FloorPlan() {
menuNumber,
setMenuNumber,
}
useEffect(() => {
console.log('FloorPlan useEffect 실행')
fetchSettings()

55
src/components/floor-plan/modal/auxiliary/AuxiliaryCopy.jsx Normal file
View File

@ -0,0 +1,55 @@
import { useMessage } from '@/hooks/useMessage'
import WithDraggable from '@/components/common/draggable/WithDraggable'
import { usePopup } from '@/hooks/usePopup'
import { useRecoilValue } from 'recoil'
import { contextPopupPositionState } from '@/store/popupAtom'
export default function AuxiliaryCopy(props) {
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const { id, pos = contextPopupPosition } = props
const { getMessage } = useMessage()
const { closePopup } = usePopup()
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm`}>
<div className="modal-head">
<h1 className="title">補助線のコピー </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="grid-option-tit">コピーする方向を入力してください</div>
<div className="grid-option-wrap">
<div className="grid-option-box">
<div className="move-form">
<p className="mb5">長さ</p>
<div className="input-move-wrap mb5">
<div className="input-move">
<input type="text" className="input-origin" defaultValue={910} />
</div>
<span>mm</span>
</div>
<div className="input-move-wrap">
<div className="input-move">
<input type="text" className="input-origin" defaultValue={910} />
</div>
<span>mm</span>
</div>
</div>
<div className="direction-move-wrap">
<button className="direction up"></button>
<button className="direction down act"></button>
<button className="direction left"></button>
<button className="direction right"></button>
</div>
</div>
</div>
<div className="grid-btn-wrap">
<button className="btn-frame modal act">保存</button>
</div>
</div>
</div>
</WithDraggable>
)
}

12
src/components/floor-plan/modal/auxiliary/AuxiliaryMove.jsx
View File

@ -1,14 +1,20 @@
import { useMessage } from '@/hooks/useMessage'
import WithDraggable from '@/components/common/draggable/WithDraggable'
import { useRecoilValue } from 'recoil'
import { contextPopupPositionState } from '@/store/popupAtom'
import { usePopup } from '@/hooks/usePopup'
export default function AuxiliaryMove({ setCurrentContextMenu }) {
export default function AuxiliaryMove(props) {
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const { id, pos = contextPopupPosition } = props
const { getMessage } = useMessage()
const { closePopup } = usePopup()
return (
<WithDraggable isShow={true} pos={{ x: 0, y: 150 }}>
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm`}>
<div className="modal-head">
<h1 className="title">補助線の移動 </h1>
<button className="modal-close" onClick={() => setCurrentContextMenu(null)}>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>

12
src/components/floor-plan/modal/auxiliary/AuxiliarySize.jsx
View File

@ -1,14 +1,20 @@
import { useMessage } from '@/hooks/useMessage'
import WithDraggable from '@/components/common/draggable/WithDraggable'
import { usePopup } from '@/hooks/usePopup'
import { useRecoilValue } from 'recoil'
import { contextPopupPositionState } from '@/store/popupAtom'
export default function AuxiliarySize({ setCurrentContextMenu }) {
export default function AuxiliarySize(props) {
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const { id, pos = contextPopupPosition } = props
const { getMessage } = useMessage()
const { closePopup } = usePopup()
return (
<WithDraggable isShow={true} pos={{ x: 0, y: 150 }}>
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm`}>
<div className="modal-head">
<h1 className="title">補助線サイズ変更 </h1>
<button className="modal-close" onClick={() => setCurrentContextMenu(null)}>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>

19
src/components/floor-plan/modal/basic/step/Orientation.jsx
View File

@ -6,6 +6,19 @@ export default function Orientation({ setTabNum }) {
const [compasDeg, setCompasDeg] = useState(0)
const [hasAnglePassivity, setHasAnglePassivity] = useState(false)
const getDegree = (degree) => {
if (degree % 15 === 0) return degree
let value = Math.floor(degree / 15)
const remain = ((degree / 15) % 1).toFixed(5)
if (remain > 0.4) {
value++
}
return value * 15
}
return (
<>
<div className="properties-setting-wrap">
@ -18,7 +31,7 @@ export default function Orientation({ setTabNum }) {
{Array.from({ length: 180 / 15 }).map((dot, index) => (
<div
key={index}
className={`circle ${compasDeg === 15 * (12 + index) ? 'act' : ''}`}
className={`circle ${getDegree(compasDeg) === 15 * (12 + index) ? 'act' : ''}`}
onClick={() => setCompasDeg(15 * (12 + index))}
>
{index === 0 && <i>180°</i>}
@ -26,13 +39,13 @@ export default function Orientation({ setTabNum }) {
</div>
))}
{Array.from({ length: 180 / 15 }).map((dot, index) => (
<div key={index} className={`circle ${compasDeg === 15 * index ? 'act' : ''}`} onClick={() => setCompasDeg(15 * index)}>
<div key={index} className={`circle ${getDegree(compasDeg) === 15 * index ? 'act' : ''}`} onClick={() => setCompasDeg(15 * index)}>
{index === 0 && <i>0°</i>}
{index === 6 && <i>90°</i>}
</div>
))}
<div className="compas">
<div className="compas-arr" style={{ transform: `rotate(${compasDeg}deg)` }}></div>
<div className="compas-arr" style={{ transform: `rotate(${getDegree(compasDeg)}deg)` }}></div>
</div>
</div>
</div>

74
src/components/floor-plan/modal/dimensionLine/DimensionLineSetting.jsx Normal file
View File

@ -0,0 +1,74 @@
import WithDraggable from '@/components/common/draggable/WithDraggable'
import { usePopup } from '@/hooks/usePopup'
import { useMessage } from '@/hooks/useMessage'
import { useRecoilValue } from 'recoil'
import { contextPopupPositionState } from '@/store/popupAtom'
import QSelectBox from '@/components/common/select/QSelectBox'
export default function DimensionLineSetting(props) {
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const { id, setIsShow, pos = contextPopupPosition } = props
const { getMessage } = useMessage()
const { closePopup } = usePopup()
const SelectOption01 = [{ name: '0' }, { name: '0' }, { name: '0' }, { name: '0' }]
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm`}>
<div className="modal-head">
<h1 className="title">表示の変更 </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="guide">寸法線に表示する数値を入力してください</div>
<div className="mb-box">
<div className="slope-wrap">
<div className="outline-form mb15">
<span className="mr10">既存の長さ</span>
<div className="input-grid mr5">
<input type="text" className="input-origin block" defaultValue={5933} readOnly />
</div>
</div>
<div className="mb-box">
<div className="outline-form">
<span className="mr10">変更の長さ</span>
<div className="input-grid mr5">
<input type="text" className="input-origin block" defaultValue={0} />
</div>
</div>
</div>
<div className="d-check-box pop">
<input type="checkbox" id="ch99" />
<label htmlFor="ch99">コーナー・ゴールの場合</label>
</div>
</div>
</div>
<div className="slope-wrap">
<div className="warning">傾斜を着せてください。</div>
<div className="display-change-wrap">
<div className="outline-form mb15">
<span className="mr10">傾斜</span>
<div className="grid-select mr10">
<QSelectBox title={'0'} option={SelectOption01} />
</div>
<span className="thin">寸法</span>
</div>
<div className="outline-form">
<span className="mr10">傾斜</span>
<div className="grid-select mr10">
<QSelectBox title={'0'} option={SelectOption01} />
</div>
<span className="thin">寸法</span>
</div>
</div>
<div className="warning">傾き設定されている場合、入力した数値に傾き計算をした数値が表示されます。</div>
</div>
<div className="grid-btn-wrap">
<button className="btn-frame modal act">保存</button>
</div>
</div>
</div>
</WithDraggable>
)
}

67
src/components/floor-plan/modal/distance/Distance.jsx Normal file
View File

@ -0,0 +1,67 @@
import WithDraggable from '@/components/common/draggable/withDraggable'
import { useMessage } from '@/hooks/useMessage'
import { usePopup } from '@/hooks/usePopup'
import { useRecoilValue } from 'recoil'
import { contextPopupPositionState } from '@/store/popupAtom'
export default function Distance(props) {
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const { id, pos = contextPopupPosition, distance } = props
const { getMessage } = useMessage()
const { closePopup } = usePopup()
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xxxm`}>
<div className="modal-head">
<h1 className="title">距離測定 </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="slope-wrap">
<div className="eaves-keraba-table">
<div className="eaves-keraba-item">
<div className="eaves-keraba-th">2点間距離</div>
<div className="eaves-keraba-td">
<div className="outline-form">
<div className="input-grid mr5" style={{ width: '98px' }}>
<input type="text" className="input-origin block" defaultValue={0} value={distance.diagonal} readOnly />
</div>
<span className="thin">mm</span>
</div>
</div>
</div>
<div className="eaves-keraba-item">
<div className="eaves-keraba-th">水平距離</div>
<div className="eaves-keraba-td">
<div className="outline-form">
<div className="input-grid mr5" style={{ width: '98px' }}>
<input type="text" className="input-origin block" defaultValue={0} value={distance.horizon} readOnly />
</div>
<span className="thin">mm</span>
</div>
</div>
</div>
<div className="eaves-keraba-item">
<div className="eaves-keraba-th">垂直距離</div>
<div className="eaves-keraba-td">
<div className="outline-form">
<div className="input-grid mr5" style={{ width: '98px' }}>
<input type="text" className="input-origin block" defaultValue={0} value={distance.vertical} readOnly />
</div>
<span className="thin">mm</span>
</div>
</div>
</div>
</div>
</div>
<div className="grid-btn-wrap">
<button className="btn-frame modal act">確認</button>
</div>
</div>
</div>
</WithDraggable>
)
}

150
src/components/floor-plan/modal/flowDirection/FlowDirectionSetting.jsx Normal file
View File

@ -0,0 +1,150 @@
import WithDraggable from '@/components/common/draggable/withDraggable'
import { useState } from 'react'
import QSelectBox from '@/components/common/select/QSelectBox'
import { useRecoilValue } from 'recoil'
import { contextPopupPositionState } from '@/store/popupAtom'
import { useMessage } from '@/hooks/useMessage'
import { usePopup } from '@/hooks/usePopup'
const SelectOption01 = [{ name: 'M' }, { name: 'M' }, { name: 'M' }, { name: 'M' }]
export default function FlowDirectionSetting(props) {
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const { id, pos = contextPopupPosition } = props
const { getMessage } = useMessage()
const { closePopup } = usePopup()
const [compasDeg, setCompasDeg] = useState(0)
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap lx`}>
<div className="modal-head">
<h1 className="title">面フローの設定 </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="drawing-flow-wrap">
<div className="discrimination-box">
<div className="discrimination-tit mb15">流れ方向の設定</div>
<div className="guide">流れ方向を選択してください。</div>
<div className="object-direction-wrap">
<div className="plane-direction">
<span className="top">北</span>
<span className="right">ドン</span>
<span className="bottom">南</span>
<span className="left">立つ</span>
<button className="plane-btn up"></button>
<button className="plane-btn right"></button>
<button className="plane-btn down act"></button>
<button className="plane-btn left"></button>
</div>
</div>
</div>
<div className="discrimination-box">
<div className="discrimination-tit mb15">方位設定</div>
<div className="guide">シミュレーション計算の方向を指定します。面が向いている方位を選択してください。</div>
<div className="mb-box">
<div className="d-check-radio pop mb15">
<input type="radio" name="radio01" id="ra01" />
<label htmlFor="ra01">8方位に選ぶ</label>
</div>
<div className="grid-select ">
<QSelectBox title={'M'} options={SelectOption01} />
</div>
</div>
<div className="mb-box">
<div className="d-check-radio pop">
<input type="radio" name="radio02" id="ra02" />
<label htmlFor="ra02">24方位から選択する (表記は8方位です。)</label>
</div>
</div>
<div className="compas-box">
<div className="compas-box-inner">
<div className={`circle ${compasDeg === 180 ? 'act' : ''}`} onClick={() => setCompasDeg(180)}>
<i>13</i>
</div>
<div className={`circle ${compasDeg === 195 ? 'act' : ''}`} onClick={() => setCompasDeg(195)}>
<i>12</i>
</div>
<div className={`circle ${compasDeg === 210 ? 'act' : ''}`} onClick={() => setCompasDeg(210)}>
<i>11</i>
</div>
<div className={`circle ${compasDeg === 225 ? 'act' : ''}`} onClick={() => setCompasDeg(225)}>
<i>10</i>
</div>
<div className={`circle ${compasDeg === 240 ? 'act' : ''}`} onClick={() => setCompasDeg(240)}>
<i>9</i>
</div>
<div className={`circle ${compasDeg === 255 ? 'act' : ''}`} onClick={() => setCompasDeg(255)}>
<i>8</i>
</div>
<div className={`circle ${compasDeg === 270 ? 'act' : ''}`} onClick={() => setCompasDeg(270)}>
<i>7</i>
</div>
<div className={`circle ${compasDeg === 285 ? 'act' : ''}`} onClick={() => setCompasDeg(285)}>
<i>6</i>
</div>
<div className={`circle ${compasDeg === 300 ? 'act' : ''}`} onClick={() => setCompasDeg(300)}>
<i>5</i>
</div>
<div className={`circle ${compasDeg === 315 ? 'act' : ''}`} onClick={() => setCompasDeg(315)}>
<i>4</i>
</div>
<div className={`circle ${compasDeg === 330 ? 'act' : ''}`} onClick={() => setCompasDeg(330)}>
<i>3</i>
</div>
<div className={`circle ${compasDeg === 345 ? 'act' : ''}`} onClick={() => setCompasDeg(345)}>
<i>2</i>
</div>
<div className={`circle ${compasDeg === 0 ? 'act' : ''}`} onClick={() => setCompasDeg(0)}>
<i>1</i>
</div>
<div className={`circle ${compasDeg === 15 ? 'act' : ''}`} onClick={() => setCompasDeg(15)}>
<i>24</i>
</div>
<div className={`circle ${compasDeg === 30 ? 'act' : ''}`} onClick={() => setCompasDeg(30)}>
<i>23</i>
</div>
<div className={`circle ${compasDeg === 45 ? 'act' : ''}`} onClick={() => setCompasDeg(45)}>
<i>22</i>
</div>
<div className={`circle ${compasDeg === 60 ? 'act' : ''}`} onClick={() => setCompasDeg(60)}>
<i>21</i>
</div>
<div className={`circle ${compasDeg === 75 ? 'act' : ''}`} onClick={() => setCompasDeg(75)}>
<i>20</i>
</div>
<div className={`circle ${compasDeg === 90 ? 'act' : ''}`} onClick={() => setCompasDeg(90)}>
<i>19</i>
</div>
<div className={`circle ${compasDeg === 105 ? 'act' : ''}`} onClick={() => setCompasDeg(105)}>
<i>18</i>
</div>
<div className={`circle ${compasDeg === 120 ? 'act' : ''}`} onClick={() => setCompasDeg(120)}>
<i>17</i>
</div>
<div className={`circle ${compasDeg === 135 ? 'act' : ''}`} onClick={() => setCompasDeg(135)}>
<i>16</i>
</div>
<div className={`circle ${compasDeg === 150 ? 'act' : ''}`} onClick={() => setCompasDeg(150)}>
<i>15</i>
</div>
<div className={`circle ${compasDeg === 165 ? 'act' : ''}`} onClick={() => setCompasDeg(165)}>
<i>14</i>
</div>
<div className="compas">
<div className="compas-arr" style={{ transform: `rotate(${compasDeg}deg)` }}></div>
</div>
</div>
</div>
</div>
</div>
<div className="grid-btn-wrap">
<button className="btn-frame modal act">保存</button>
</div>
</div>
</div>
</WithDraggable>
)
}

11
src/components/floor-plan/modal/grid/GridCopy.jsx
View File

@ -1,16 +1,21 @@
import WithDraggable from '@/components/common/draggable/WithDraggable'
import { useMessage } from '@/hooks/useMessage'
import { usePopup } from '@/hooks/usePopup'
import { useRecoilValue } from 'recoil'
import { contextPopupPositionState } from '@/store/popupAtom'
export default function GridCopy(props) {
const { setShowGridMoveModal, setShowGridCopyModal } = props
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const { id, pos = contextPopupPosition } = props
const { getMessage } = useMessage()
const { closePopup } = usePopup()
return (
<WithDraggable isShow={true} pos={{ x: 50, y: 380 }}>
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm mount`}>
<div className="modal-head">
<h1 className="title">{getMessage('modal.grid.copy')} </h1>
<button className="modal-close" onClick={() => setShowGridCopyModal(false)}>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>

11
src/components/floor-plan/modal/grid/GridMove.jsx
View File

@ -1,16 +1,21 @@
import WithDraggable from '@/components/common/draggable/WithDraggable'
import { useMessage } from '@/hooks/useMessage'
import { usePopup } from '@/hooks/usePopup'
import { useRecoilValue } from 'recoil'
import { contextPopupPositionState } from '@/store/popupAtom'
export default function GridMove(props) {
const { setShowGridMoveModal, setShowGridCopyModal } = props
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const { id, pos = contextPopupPosition } = props
const { getMessage } = useMessage()
const { closePopup } = usePopup()
return (
<WithDraggable isShow={true} pos={{ x: 50, y: 30 }}>
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm mount`}>
<div className="modal-head">
<h1 className="title">{getMessage('modal.grid.move')} </h1>
<button className="modal-close" onClick={() => setShowGridMoveModal(false)}>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>

104
src/components/floor-plan/modal/lineProperty/LinePropertySetting.jsx Normal file
View File

@ -0,0 +1,104 @@
import WithDraggable from '@/components/common/draggable/withDraggable'
import { useRecoilValue } from 'recoil'
import { contextPopupPositionState } from '@/store/popupAtom'
import { useMessage } from '@/hooks/useMessage'
import { usePopup } from '@/hooks/usePopup'
export default function LinePropertySetting(props) {
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const { id, pos = contextPopupPosition } = props
const { getMessage } = useMessage()
const { closePopup } = usePopup()
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap r`}>
<div className="modal-head">
<h1 className="title">各辺属性の変更 </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="guide">
<span className="mb10">属性を変更する辺を選択してください。</span>
<span>選択した値 [龍丸]</span>
</div>
<div className="properties-setting-wrap outer">
<div className="setting-tit">設定</div>
<div className="outline-wrap">
<div className="radio-grid-wrap">
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra01" />
<label htmlFor="ra01">軒先</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra02" />
<label htmlFor="ra02">ケラバ</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra03" />
<label htmlFor="ra03">龍丸</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra04" />
<label htmlFor="ra04">ケラバ左</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra05" />
<label htmlFor="ra05">ヨセムネ</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra06" />
<label htmlFor="ra06">ケラバ右</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra07" />
<label htmlFor="ra07">片側の流れ</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra08" />
<label htmlFor="ra08">谷</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra09" />
<label htmlFor="ra09">壁取り</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra10" />
<label htmlFor="ra10">Lの捨て渓谷</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra11" />
<label htmlFor="ra11">壁取り(型)</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra12" />
<label htmlFor="ra12">マンサード</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra13" />
<label htmlFor="ra13">壁取合(流れ)</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra14" />
<label htmlFor="ra14">設定なし</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra15" />
<label htmlFor="ra15">壁取合(流れ左)</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra16" />
<label htmlFor="ra16">壁取り(流れ右)</label>
</div>
</div>
</div>
</div>
<div className="grid-btn-wrap">
<button className="btn-frame modal act">保存</button>
</div>
</div>
</div>
</WithDraggable>
)
}

55
src/components/floor-plan/modal/object/DormerOffset.jsx Normal file
View File

@ -0,0 +1,55 @@
import { useMessage } from '@/hooks/useMessage'
import WithDraggable from '@/components/common/draggable/WithDraggable'
import { useRecoilValue } from 'recoil'
import { contextPopupPositionState } from '@/store/popupAtom'
import { usePopup } from '@/hooks/usePopup'
export default function DormerOffset(props) {
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const { id, pos = contextPopupPosition } = props
const { getMessage } = useMessage()
const { closePopup } = usePopup()
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm`}>
<div className="modal-head">
<h1 className="title">도머 오프셋 </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="grid-option-tit">移動する方向を入力してください</div>
<div className="grid-option-wrap">
<div className="grid-option-box">
<div className="move-form">
<p className="mb5">長さ</p>
<div className="input-move-wrap mb5">
<div className="input-move">
<input type="text" className="input-origin" defaultValue={910} />
</div>
<span>mm</span>
</div>
<div className="input-move-wrap">
<div className="input-move">
<input type="text" className="input-origin" defaultValue={910} />
</div>
<span>mm</span>
</div>
</div>
<div className="direction-move-wrap">
<button className="direction up"></button>
<button className="direction down act"></button>
<button className="direction left"></button>
<button className="direction right"></button>
</div>
</div>
</div>
<div className="grid-btn-wrap">
<button className="btn-frame modal act">保存</button>
</div>
</div>
</div>
</WithDraggable>
)
}

45
src/components/floor-plan/modal/object/RoofMaterialSetting.jsx Normal file
View File

@ -0,0 +1,45 @@
'use client'
import { useRecoilValue } from 'recoil'
import { useMessage } from '@/hooks/useMessage'
import WithDraggable from '@/components/common/draggable/WithDraggable'
import { usePopup } from '@/hooks/usePopup'
import { contextPopupPositionState } from '@/store/popupAtom'
import QSelectBox from '@/components/common/select/QSelectBox'
export default function RoofMaterialSetting(props) {
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const { id, pos = contextPopupPosition } = props
const { getMessage } = useMessage()
const { closePopup } = usePopup()
const roofMaterials = [
{ name: '기와1', value: 'material1' },
{ name: '기와2', value: 'material2' },
{ name: '기와3', value: 'material3' },
{ name: '기와4', value: 'material4' },
{ name: '기와5', value: 'material5' },
]
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xxxm`}>
<div className="modal-head">
<h1 className="title">変更 </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="slope-wrap">
<div className="grid-select">
<QSelectBox title={'지붕재 선택'} options={roofMaterials} />
</div>
</div>
<div className="grid-btn-wrap">
<button className="btn-frame modal act">ストレージ</button>
</div>
</div>
</div>
</WithDraggable>
)
}

71
src/components/floor-plan/modal/object/SizeSetting.jsx Normal file
View File

@ -0,0 +1,71 @@
'use client'
import { useRecoilValue } from 'recoil'
import { useMessage } from '@/hooks/useMessage'
import { canvasState } from '@/store/canvasAtom'
import WithDraggable from '@/components/common/draggable/WithDraggable'
import { usePopup } from '@/hooks/usePopup'
import { contextPopupPositionState } from '@/store/popupAtom'
import { useState } from 'react'
export default function SizeSetting(props) {
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const [settingTarget, setSettingTarget] = useState(1)
const { id, pos = contextPopupPosition } = props
const { getMessage } = useMessage()
const canvas = useRecoilValue(canvasState)
const { closePopup } = usePopup()
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap ssm`}>
<div className="modal-head">
<h1 className="title">サイズ変更 </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="slope-wrap">
<div className="size-option-top">
<div className="size-option-wrap">
<div className="size-option mb5">
<input type="text" className="input-origin mr5" defaultValue={1000} readOnly />
<span className="normal-font">mm</span>
</div>
<div className="size-option">
<input type="text" className="input-origin mr5" defaultValue={1000} />
<span className="normal-font">mm</span>
</div>
</div>
</div>
<div className="size-inner-warp">
<div className="size-option-side">
<div className="size-option-wrap">
<div className="size-option mb5">
<input type="text" className="input-origin mr5" defaultValue={1000} readOnly />
<span className="normal-font">mm</span>
</div>
<div className="size-option">
<input type="text" className="input-origin mr5" defaultValue={1000} />
<span className="normal-font">mm</span>
</div>
</div>
</div>
<div className="size-check-wrap">
<button className={`size-btn ${settingTarget === 1 ? 'act' : ''}`} onClick={() => setSettingTarget(1)}></button>
<button className={`size-btn ${settingTarget === 2 ? 'act' : ''}`} onClick={() => setSettingTarget(2)}></button>
<button className={`size-btn ${settingTarget === 3 ? 'act' : ''}`} onClick={() => setSettingTarget(3)}></button>
<button className={`size-btn ${settingTarget === 4 ? 'act' : ''}`} onClick={() => setSettingTarget(4)}></button>
<div className="size-box"></div>
</div>
</div>
</div>
<div className="grid-btn-wrap">
<button className="btn-frame modal act">作成</button>
</div>
</div>
</div>
</WithDraggable>
)
}

6
src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx
View File

@ -3,8 +3,12 @@ import WithDraggable from '@/components/common/draggable/WithDraggable'
import QSelectBox from '@/components/common/select/QSelectBox'
import { useRoofAllocationSetting } from '@/hooks/roofcover/useRoofAllocationSetting'
import { usePopup } from '@/hooks/usePopup'
import { useRecoilValue } from 'recoil'
import { contextPopupPositionState } from '@/store/popupAtom'
export default function RoofAllocationSetting({ id, pos = { x: 50, y: 230 } }) {
export default function RoofAllocationSetting(props) {
const contextPopupPosition = useRecoilValue(contextPopupPositionState)
const { id, pos = contextPopupPosition } = props
const { getMessage } = useMessage()
const { closePopup } = usePopup()
const { handleSave, onAddRoofMaterial, onDeleteRoofMaterial, values, roofMaterials, selectedRoofMaterial, setSelectedRoofMaterial } =

98
src/components/management/Stuff.jsx
View File

@ -25,7 +25,7 @@ export default function Stuff() {
const [stuffSearch, setStuffSearch] = useRecoilState(stuffSearchState)
const { getMessage } = useMessage()
const [pageNo, setPageNo] = useState(1) //현재 페이지 번호
const [pageSize, setPageSize] = useState(100) //페이지 당 게시물 수
const [pageSize, setPageSize] = useState(5) //페이지 당 게시물 수
const [totalCount, setTotalCount] = useState(0) //총 갯수
const [defaultSortType, setDefaultSortType] = useState('R')
@ -172,55 +172,54 @@ export default function Stuff() {
}
//물건삭제
const fnDeleteRowData = (data) => {
console.log('물건삭제:::::::::::')
if (data.length === 0) {
return alert('삭제할 데이터를 선택하세요')
}
let errCount = 0
data.forEach((cell) => {
if (!cell.objectNo) {
if (errCount === 0) {
alert('물건정보가 있는 행만 삭제 됩니다')
}
errCount++
}
})
}
// const fnDeleteRowData = (data) => {
// if (data.length === 0) {
// return alert('삭제할 데이터를 선택하세요')
// }
// let errCount = 0
// data.forEach((cell) => {
// if (!cell.objectNo) {
// if (errCount === 0) {
// alert('물건정보가 있는 행만 삭제 됩니다')
// }
// errCount++
// }
// })
// }
//행추가
let newCount = 0
const addRowItems = () => {
// console.log('girdRef::::::', gridRef.current.api)
const newItems = [
{
mission: newCount + 1,
successful: true,
},
]
gridRef.current.api.applyTransaction({
add: newItems,
addIndex: newCount,
})
newCount++
}
// let newCount = 0
// const addRowItems = () => {
// // console.log('girdRef::::::', gridRef.current.api)
// const newItems = [
// {
// mission: newCount + 1,
// successful: true,
// },
// ]
// gridRef.current.api.applyTransaction({
// add: newItems,
// addIndex: newCount,
// })
// newCount++
// }
//행삭제
const removeRowItems = () => {
// console.log('selectedRowData::', selectedRowData)
let errCount = 0
selectedRowData.forEach((cell) => {
if (!cell.company) {
let newSelectedRowData = selectedRowData.filter((item) => item.company == null)
gridRef.current.api.applyTransaction({ remove: newSelectedRowData })
} else {
if (errCount === 0) {
alert('행추가로 추가 한 행만 삭제됩니다.')
}
errCount++
}
})
}
// const removeRowItems = () => {
// // console.log('selectedRowData::', selectedRowData)
// let errCount = 0
// selectedRowData.forEach((cell) => {
// if (!cell.company) {
// let newSelectedRowData = selectedRowData.filter((item) => item.company == null)
// gridRef.current.api.applyTransaction({ remove: newSelectedRowData })
// } else {
// if (errCount === 0) {
// alert('행추가로 추가 한 행만 삭제됩니다.')
// }
// errCount++
// }
// })
// }
// 진입시 그리드 데이터 조회
useEffect(() => {
@ -381,6 +380,7 @@ export default function Stuff() {
// 페이징 현재페이지 변경
const handleChangePage = (page) => {
console.log('page:::', page)
stuffSearchParams.code = 'S'
setStuffSearch({
@ -390,9 +390,13 @@ export default function Stuff() {
endRow: page * pageSize,
})
// console.log('여기::::::::::::', page)
setPageNo(page)
}
// console.log('pageNo:::', pageNo)
// console.log('pageSize:::', pageSize)
// console.log('totalCount:::', totalCount)
return (
<>
{/* 퍼블시작 */}
@ -420,7 +424,7 @@ export default function Stuff() {
</div>
<div className="select-box" style={{ width: '80px' }}>
<select className="select-light black" name="" id="" onChange={onChangePerPage}>
<option value="100">100</option>
<option value="5">5</option>
<option value="200">200</option>
<option value="300">300</option>
</select>

267
src/components/management/StuffDetail.jsx
View File

@ -261,24 +261,21 @@ export default function StuffDetail() {
})
useEffect(() => {
// console.log('objectNo::', objectNo)
if (objectNo) {
setEditMode('EDIT')
if (objectNo.substring(0, 1) === 'R') {
if (objectNo.substring(0, 1) !== 'T') {
//벨리데이션 체크용..
setIsFormValid(true)
}
promiseGet({ url: `/api/object/${objectNo}/detail` }).then((res) => {
if (res.status === 200) {
console.log('플랜데이타:::', res.data.planList)
if (res.data != null) {
setDetailData(res.data)
} else {
setDetailData({})
}
if (isNotEmptyArray(res.data.planList)) {
// console.log('플랜RES::::::::', res.data.planList)
setPlanGridProps({ ...planGridProps, planGridData: res.data.planList })
} else {
setPlanGridProps({ ...planGridProps, planGridData: [] })
@ -300,16 +297,23 @@ export default function StuffDetail() {
//1차점 : X167 T01
//2차점 : 10X22, 201X112
get({ url: `/api/object/saleStore/${sessionState?.storeId}/list` }).then((res) => {
// get({ url: `/api/object/saleStore/T01/list` }).then((res) => {
if (!isEmptyArray(res)) {
const firstList = res.filter((row) => row.saleStoreLevel === '1')
const otherList = res.filter((row) => row.saleStoreLevel !== '1')
//1차점 셀렉트박스
setSaleStoreList(firstList)
//1차점 아닌 판매점 셀렉트박스
setOriginOtherSaleStoreList(otherList)
setOtherSaleStoreList(otherList)
let filterOtherList
if (sessionState?.storeId === 'T01') {
filterOtherList = otherList.filter((row) => row.firstAgentId === 'T01')
setOriginOtherSaleStoreList(filterOtherList)
setOtherSaleStoreList(filterOtherList)
} else {
//1차점 아닌 판매점 셀렉트박스
setOriginOtherSaleStoreList(otherList)
setOtherSaleStoreList(otherList)
}
if (sessionState?.storeLvl === '1') {
setSelOptions(sessionState?.storeId)
@ -332,21 +336,19 @@ export default function StuffDetail() {
const code2 = findCommonCode(201700) //신축/기축
const code3 = findCommonCode(202000) //기준풍속 202000
if (code1 != null) {
// console.log('경칭공코::::::', code1)
setHonorificCodeList(code1)
}
if (code2 != null) {
// console.log('신축/기축공코::::', code2)
setObjectStatusList(code2)
}
if (code3 != null) {
// console.log('기준풍속::::', code3)
setWindSpeedList(code3)
}
}, [commonCode])
useEffect(() => {
if (isObjectNotEmpty(detailData)) {
// console.log('상세데이타세팅:::::', detailData)
// 도도부현API
get({ url: '/api/object/prefecture/list' }).then((res) => {
if (!isEmptyArray(res)) {
@ -357,19 +359,40 @@ export default function StuffDetail() {
//1차점 : X167 T01
//2차점 : 10X22, 201X112
get({ url: `/api/object/saleStore/${sessionState?.storeId}/list` }).then((res) => {
// get({ url: `/api/object/saleStore/T01/list` }).then((res) => {
if (!isEmptyArray(res)) {
const firstList = res.filter((row) => row.saleStoreLevel === '1')
const otherList = res.filter((row) => row.saleStoreLevel !== '1')
//1차점 셀렉트박스
setSaleStoreList(firstList)
//1차점 아닌 판매점 셀렉트박스
setOriginOtherSaleStoreList(otherList)
setOtherSaleStoreList(otherList)
// console.log('1차점리스트::', firstList)
// console.log('2차점리스트::', otherList)
let filterOtherList
if (sessionState?.storeId === 'T01') {
filterOtherList = otherList.filter((row) => row.firstAgentId === 'T01')
setOriginOtherSaleStoreList(filterOtherList)
setOtherSaleStoreList(filterOtherList)
} else {
//1차점 아닌 판매점 셀렉트박스
setOriginOtherSaleStoreList(otherList)
setOtherSaleStoreList(otherList)
}
}
//상세데이터가 1차점이면 1차점에 세팅
//상세데이터가 2차점이면 2차점에 세팅하고 세션으로 1차점 세팅
if (detailData.saleStoreLevel === '1') {
setSelOptions(detailData.saleStoreId)
form.setValue('saleStoreId', detailData.saleStoreId)
form.setValue('saleStoreLevel', detailData.saleStoreLevel)
} else {
setSelOptions(sessionState?.storeId)
form.setValue('saleStoreId', sessionState?.storeId)
form.setValue('saleStoreLevel', sessionState?.storeLvl)
setOtherSelOptions(detailData.saleStoreId)
form.setValue('otherSaleStoreId', detailData.saleStoreId)
form.setValue('otherSaleStoreLevel', detailData.saleStoreLevel)
}
//설계의뢰No.
form.setValue('planReqNo', detailData.planReqNo)
//담당자
@ -389,21 +412,6 @@ export default function StuffDetail() {
//물건명 후리가나
form.setValue('objectNameKana', detailData.objectNameKana)
console.log('상세데이타::세팅:::::', detailData)
//상세데이터에는 2차점까지 골랐으면 2차점 정보만 내려옴
//로그인세션이 1차점이면 1차점은 본인으로 디폴트 셋팅하고 2차점에 상세데이터 넣어줌
//1차점
// setSelOptions(detailData.saleStoreId)
// form.setValue('saleStoreId', detailData.saleStoreId)
// form.setValue('saleStoreLevel', sessionState?.storeLvl)
//2차점까지 고른경우 확인필요
// console.log('2차점까지 고른경우 확인필요')
// setOtherSelOptions(sessionState?.storeId)
// form.setValue('saleStoreId', firstList[0].saleStoreId)
// form.setValue('otherSaleStoreId', sessionState?.storeId)
// form.setValue('otherSaleStoreLevel', sessionState?.storeLvl)
//우편번호
form.setValue('zipNo', detailData.zipNo)
@ -412,7 +420,11 @@ export default function StuffDetail() {
form.setValue('prefId', detailData.prefId)
//prefName ???
form.setValue('address', detailData.address)
//발전시뮬
form.setValue('areaId', detailData.areaId)
//기준풍속
form.setValue('standardWindSpeedId', detailData.standardWindSpeedId)
//수직적설량
form.setValue('verticalSnowCover', detailData.verticalSnowCover)
//한랭지대책시행 coldRegionFlg 1이면 true
@ -460,6 +472,10 @@ export default function StuffDetail() {
}
//1차점 변경 이벤트
const onSelectionChange = (key) => {
if (key.saleStoreId === selOptions) {
return
}
const planReqNo = form.watch('planReqNo')
let delFlg = false
@ -486,7 +502,7 @@ export default function StuffDetail() {
if (objectNo) {
tempObjectNo = objectNo.substring(0, 1)
}
if (tempObjectNo !== 'R') {
if (tempObjectNo === 'T') {
if (planReqNo) {
if (delFlg) {
form.setValue('planReqNo', '')
@ -568,6 +584,10 @@ export default function StuffDetail() {
//2차점 변경 이벤트
const onSelectionChange2 = (key) => {
if (key.saleStoreId === otherSelOptions) {
return
}
const planReqNo = form.watch('planReqNo')
let delFlg = false
if (editMode === 'NEW') {
@ -593,7 +613,7 @@ export default function StuffDetail() {
if (objectNo) {
tempObjectNo = objectNo.substring(0, 1)
}
if (tempObjectNo !== 'R') {
if (tempObjectNo === 'T') {
if (planReqNo) {
if (delFlg) {
form.setValue('planReqNo', '')
@ -646,7 +666,6 @@ export default function StuffDetail() {
//팝업에서 넘어온 우편정보
const setZipInfo = (info) => {
// console.log('팝업에서 넘어온 우편 데이타::::::::', info)
setPrefValue(info.prefId)
form.setValue('prefId', info.prefId)
form.setValue('prefName', info.address1)
@ -761,7 +780,7 @@ export default function StuffDetail() {
setIsFormValid(Object.keys(errors).length === 0 ? true : false)
} else {
console.log('상세일때 폼체크')
//상세일떄 폼체크
const formData = form.getValues()
let errors = {}
if (!formData.receiveUser || formData.receiveUser.trim().length === 0) {
@ -781,7 +800,7 @@ export default function StuffDetail() {
errors.zipNo = true
}
if (!formData.prefId) {
if (!formData.prefId || formData.prefId === '0') {
errors.prefId = true
}
@ -801,7 +820,7 @@ export default function StuffDetail() {
errors.installHeight = true
}
console.log('상세 저장용 에러결과?????::', errors)
// console.log('상세에러필드:::::', errors)
setIsFormValid(Object.keys(errors).length === 0 ? true : false)
}
}, [
@ -839,7 +858,7 @@ export default function StuffDetail() {
}
useEffect(() => {
if (prefValue !== '') {
if (prefValue) {
// 발전량시뮬레이션 지역 목록
get({ url: `/api/object/prefecture/${prefValue}/list` }).then((res) => {
if (!isEmptyArray(res)) {
@ -855,11 +874,66 @@ export default function StuffDetail() {
form.setValue('areaName', e.prefName)
}
//필수값 다 입력했을때
const onValid = async () => {
const formData = form.getValues()
let errors = {}
let fieldNm
if (!formData.receiveUser || formData.receiveUser.trim().length === 0) {
fieldNm = getMessage('stuff.detail.receiveUser')
errors = fieldNm
}
if (!formData.objectName || formData.objectName.trim().length === 0) {
fieldNm = getMessage('stuff.detail.objectStatusId')
errors = fieldNm
}
if (!formData.objectNameOmit) {
fieldNm = getMessage('stuff.detail.objectNameOmit')
errors = fieldNm
}
if (!formData.saleStoreId) {
fieldNm = getMessage('stuff.detail.saleStoreId')
errors = fieldNm
}
if (!formData.zipNo) {
fieldNm = getMessage('stuff.detail.zipNo')
errors = fieldNm
}
if (!formData.prefId || formData.prefId === '0') {
fieldNm = getMessage('stuff.detail.prefId')
errors = fieldNm
}
if (!formData.areaId) {
fieldNm = getMessage('stuff.detail.areaId')
errors = fieldNm
}
if (!formData.standardWindSpeedId) {
fieldNm = getMessage('stuff.detail.standardWindSpeedId')
errors = fieldNm
}
if (!formData.verticalSnowCover) {
fieldNm = getMessage('stuff.detail.verticalSnowCover')
errors = fieldNm
}
if (!formData.installHeight) {
fieldNm = getMessage('stuff.detail.installHeight')
errors = fieldNm
}
if (Object.keys(errors).length > 0) {
return alert(getMessage('stuff.detail.save.valierror3', [errors]))
}
const apiUrl = '/api/object/save-object'
const params = {
objectNo: objectNo,
planReqNo: formData.planReqNo,
saleStoreId: formData.otherSaleStoreId ? formData.otherSaleStoreId : formData.saleStoreId,
saleStoreName: formData.otherSaleStoreName ? formData.otherSaleStoreName : formData.saleStoreName,
@ -886,7 +960,6 @@ export default function StuffDetail() {
workNo: null,
workName: null,
}
console.log('REAL저장::', params)
//수직적설량, 설치높이 0인지 체크
let snow = params.verticalSnowCover
@ -899,20 +972,76 @@ export default function StuffDetail() {
return alert(getMessage('stuff.detail.save.valierror2'))
}
alert('작업중')
return
let detail_sort = Object.keys(detailData)
.sort()
.reduce((obj, key) => ((obj[key] = detailData[key]), obj), {})
let params_sort = Object.keys(params)
.sort()
.reduce((obj, key) => ((obj[key] = params[key]), obj), {})
delete detail_sort.areaName
delete detail_sort.contentsPath
delete detail_sort.createDatetime
delete detail_sort.createUserName
delete detail_sort.dispCompanyName
delete detail_sort.firstAgentId
delete detail_sort.lastEditDatetime
delete detail_sort.lastEditUserName
delete detail_sort.planList
delete detail_sort.planNo
delete detail_sort.planTotCnt
delete detail_sort.receiveCompanyName
delete detail_sort.saleStoreName
delete detail_sort.rowNumber
delete detail_sort.prefName
delete detail_sort.sameObjectInfo
delete detail_sort.specificationConfirmDate
delete detail_sort.totCnt
delete detail_sort.workNo
delete detail_sort.workName
delete params_sort.areaName
delete params_sort.contentsPath
delete params_sort.createDatetime
delete params_sort.createUserName
delete params_sort.dispCompanyName
delete params_sort.firstAgentId
delete params_sort.lastEditDatetime
delete params_sort.lastEditUserName
delete params_sort.planList
delete params_sort.planNo
delete params_sort.planTotCnt
delete params_sort.receiveCompanyName
delete params_sort.saleStoreName
delete params_sort.rowNumber
delete params_sort.prefName
delete params_sort.sameObjectInfo
delete params_sort.specificationConfirmDate
delete params_sort.totCnt
delete params_sort.workNo
delete params_sort.workName
// console.log(JSON.stringify(detail_sort) === JSON.stringify(params_sort))
// console.log(Object.entries(detail_sort).toString() === Object.entries(params_sort).toString())
if (Object.entries(detail_sort).toString() === Object.entries(params_sort).toString()) {
return alert(getMessage('stuff.detail.noChgData'))
}
if (editMode === 'NEW') {
await promisePost({ url: apiUrl, data: params }).then((res) => {
console.log('진짜저장결과::::', pathname, res)
//상세화면으로 전환
//router.push(`${pathname}?objectNo=${res.data.objectNo.toString()}`)
if (res.status === 201) {
alert(getMessage('stuff.detail.save'))
router.push(`/management/stuff/detail?objectNo=${res.data.objectNo.toString()}`)
}
})
} else {
// 수정모드일때는 PUT
await promisePut({ url: apiUrl, data: params }).then((res) => {
console.log('진짜데이터 수정 결과::::::::::', pathname, res)
//새로고침???
if (res.status === 201) {
alert(getMessage('stuff.detail.save'))
router.refresh()
}
})
}
}
@ -963,12 +1092,9 @@ export default function StuffDetail() {
if (height === '0') {
return alert(getMessage('stuff.detail.save.valierror2'))
}
alert('작업중')
return
await promisePost({ url: '/api/object/save-object', data: params }).then((res) => {
if (res.status === 201) {
getMessage('stuff.detail.tempSave.message1')
alert(getMessage('stuff.detail.tempSave.message1'))
router.push(`${pathname}?objectNo=${res.data.objectNo.toString()}`)
}
})
@ -976,15 +1102,12 @@ export default function StuffDetail() {
// 물건삭제
const onDelete = () => {
// console.log('물건번호::::::::', objectNo)
// console.log('detailData:::::::::', detailData)
const specificationConfirmDate = detailData.specificationConfirmDate
if (specificationConfirmDate != null) {
alert(getMessage('stuff.detail.delete.message1'))
} else {
if (confirm(getMessage('common.message.data.delete'))) {
del({ url: `/api/object/${objectNo}` }).then((res) => {
// console.log('삭제결과:::::::', res)
router.push('/management/stuff')
})
}
@ -1038,7 +1161,7 @@ export default function StuffDetail() {
</tr>
<tr>
<th>
{getMessage('stuff.detail.dispCompanyName')} <span className="important">*</span>
{getMessage('stuff.detail.receiveUser')} <span className="important">*</span>
</th>
<td>
<div className="input-wrap" style={{ width: '500px' }}>
@ -1129,7 +1252,7 @@ export default function StuffDetail() {
getOptionLabel={(x) => x.saleStoreName}
getOptionValue={(x) => x.saleStoreId}
isClearable={sessionState?.storeLvl === '1' ? true : false}
isDisabled={sessionState?.storeLel !== '1' ? true : false}
isDisabled={sessionState?.storeLvl !== '1' ? true : false}
value={saleStoreList.filter(function (option) {
return option.saleStoreId === selOptions
})}
@ -1264,7 +1387,7 @@ export default function StuffDetail() {
</tr>
<tr>
<th>
{getMessage('stuff.detail.windSpeed')} <span className="important">*</span>
{getMessage('stuff.detail.standardWindSpeedId')} <span className="important">*</span>
</th>
<td>
<div className="flx-box">
@ -1287,7 +1410,7 @@ export default function StuffDetail() {
})}
></Select>
</div>
<span className="mr10">{getMessage('stuff.detail.windSpeedSpan')}</span>
<span className="mr10">{getMessage('stuff.detail.standardWindSpeedIdSpan')}</span>
<Button type="button" className="btn-origin grey" onClick={onSearchWindSpeedPopOpen}>
{getMessage('stuff.detail.btn.windSpeedPop')}
</Button>
@ -1389,16 +1512,16 @@ export default function StuffDetail() {
<div className="sub-right-footer">
{!isFormValid ? (
<Button className="btn-origin grey mr5" onClick={onTempSave}>
New화면 {getMessage('stuff.detail.btn.tempSave')}
{getMessage('stuff.detail.btn.tempSave')}
</Button>
) : (
<Button type="submit" className="btn-origin navy mr5">
NEW화면 {getMessage('stuff.detail.btn.save')}
{getMessage('stuff.detail.btn.save')}
</Button>
)}
<Link href="/management/stuff" scroll={false}>
<button type="button" className="btn-origin grey">
NEW화면 {getMessage('stuff.detail.btn.moveList')}
{getMessage('stuff.detail.btn.moveList')}
</button>
</Link>
</div>
@ -1425,6 +1548,7 @@ export default function StuffDetail() {
<div className="flx-box">
<div className="product-input-wrap mr5">
<input type="text" className="product-input" readOnly value={form.watch('planReqNo') || ''} />
{/* {detailData?.tempFlg === '1' && form.watch('planReqNo') ? ( */}
{objectNo.substring(0, 1) === 'T' && form.watch('planReqNo') ? (
<button
type="button"
@ -1435,6 +1559,7 @@ export default function StuffDetail() {
></button>
) : null}
</div>
{/* {detailData?.tempFlg === '1' ? ( */}
{objectNo.substring(0, 1) === 'T' ? (
<>
<Button className="btn-origin grey" onClick={onSearchDesignRequestPopOpen}>
@ -1447,7 +1572,7 @@ export default function StuffDetail() {
</tr>
<tr>
<th>
{getMessage('stuff.detail.dispCompanyName')} <span className="important">*</span>
{getMessage('stuff.detail.receiveUser')} <span className="important">*</span>
</th>
<td>
<div className="input-wrap" style={{ width: '500px' }}>
@ -1457,7 +1582,7 @@ export default function StuffDetail() {
</tr>
<tr>
<th>
{getMessage('stuff.detail.objectStatusId')} <span className="importatn">*</span>
{getMessage('stuff.detail.objectStatusId')} <span className="important">*</span>
</th>
<td>
<div className="flx-box">
@ -1538,7 +1663,7 @@ export default function StuffDetail() {
getOptionLabel={(x) => x.saleStoreName}
getOptionValue={(x) => x.saleStoreId}
isClearable={sessionState?.storeLvl === '1' ? true : false}
isDisabled={sessionState?.storeLel !== '1' ? true : false}
isDisabled={sessionState?.storeLvl !== '1' ? true : false}
value={saleStoreList.filter(function (option) {
return option.saleStoreId === selOptions
})}
@ -1678,7 +1803,7 @@ export default function StuffDetail() {
{/* 기준풍속시작 */}
<tr>
<th>
{getMessage('stuff.detail.windSpeed')} <span className="important">*</span>
{getMessage('stuff.detail.standardWindSpeedId')} <span className="important">*</span>
</th>
<td>
<div className="flx-box">
@ -1701,7 +1826,7 @@ export default function StuffDetail() {
})}
></Select>
</div>
<span className="mr10">{getMessage('stuff.detail.windSpeedSpan')}</span>
<span className="mr10">{getMessage('stuff.detail.standardWindSpeedIdSpan')}</span>
<Button type="button" className="btn-origin grey" onClick={onSearchWindSpeedPopOpen}>
{getMessage('stuff.detail.btn.windSpeedPop')}
</Button>
@ -1812,7 +1937,8 @@ export default function StuffDetail() {
</table>
</div>
</div>
{objectNo.substring(0, 1) === 'R' ? (
{/* {detailData?.tempFlg === '0' ? ( */}
{objectNo.substring(0, 1) !== 'T' ? (
<>
{/* 진짜R 플랜시작 */}
<div className="table-box-title-wrap">
@ -1840,7 +1966,6 @@ export default function StuffDetail() {
<div className="information-grid">
<div className="q-grid no-cols">
<StuffPlanQGrid {...planGridProps} />
{/* <div className="pagination-wrap">페이징영역</div> */}
</div>
</div>
{/* 진짜R 플랜끝 */}
@ -1862,7 +1987,7 @@ export default function StuffDetail() {
<>
<div className="sub-right-footer">
{!isFormValid ? (
<Button type="submit" className="btn-origin grey mr5" onClick={onTempSave}>
<Button className="btn-origin grey mr5" onClick={onTempSave}>
TEMP상세:{getMessage('stuff.detail.btn.tempSave')}
</Button>
) : (

1
src/components/management/StuffPlanQGrid.jsx
View File

@ -45,6 +45,7 @@ export default function StuffPlanQGrid(props) {
rowSelection={'singleRow'}
pagination={isPageable}
domLayout="autoHeight"
suppressCellFocus={true}
/>
</div>
)

22
src/hooks/common/useCommonUtils.js
View File

@ -2,10 +2,13 @@ import { useEffect } from 'react'
import { useRecoilValue } from 'recoil'
import { wordDisplaySelector } from '@/store/settingAtom'
import { useEvent } from '@/hooks/useEvent'
import { checkLineOrientation, getDistance, setSurfaceShapePattern } from '@/util/canvas-util'
import { checkLineOrientation, getDistance } from '@/util/canvas-util'
import { dimensionLineSettingsState } from '@/store/commonUtilsAtom'
import { fontSelector } from '@/store/fontAtom'
import { canvasState } from '@/store/canvasAtom'
import { v4 as uuidv4 } from 'uuid'
import { usePopup } from '@/hooks/usePopup'
import Distance from '@/components/floor-plan/modal/distance/Distance'
export function useCommonUtils({ commonFunctionState, setCommonFunctionState }) {
const canvas = useRecoilValue(canvasState)
@ -14,6 +17,7 @@ export function useCommonUtils({ commonFunctionState, setCommonFunctionState })
const dimensionSettings = useRecoilValue(dimensionLineSettingsState)
const dimensionLineTextFont = useRecoilValue(fontSelector('dimensionLineText'))
const commonTextFont = useRecoilValue(fontSelector('commonText'))
const { addPopup } = usePopup()
useEffect(() => {
initEvent()
@ -106,7 +110,8 @@ export function useCommonUtils({ commonFunctionState, setCommonFunctionState })
const lineOptions = {
stroke: dimensionSettings.color,
strokeWidth: dimensionSettings.pixel,
selectable: false,
name: 'dimensionLine',
selectable: true,
}
// 캔버스에 클릭 이벤트 추가
@ -371,6 +376,19 @@ export function useCommonUtils({ commonFunctionState, setCommonFunctionState })
...textOptions,
})
canvas.add(distanceText)
const id = uuidv4()
addPopup(
id,
1,
<Distance
id={id}
distance={{
horizon: distance3 * 10,
vertical: distance2 * 10,
diagonal: distance1 * 10,
}}
/>,
)
}
// 거리 계산 후, 다음 측정을 위해 초기화

126
src/hooks/option/useCanvasSettingController.js Normal file
View File

@ -0,0 +1,126 @@
import { settingModalFirstOptionsState, settingModalSecondOptionsState } from '@/store/settingAtom'
import { useEffect, useState } from 'react'
import { useRecoilState } from 'recoil'
export const useCanvasSettingController = () => {
const [settingModalFirstOptions, setSettingModalFirstOptions] = useRecoilState(settingModalFirstOptionsState)
const [settingModalSecondOptions, setSettingModalSecondOptions] = useRecoilState(settingModalSecondOptionsState)
const [objectNo, setObjectNo] = useState('test123240912001') // 이후 삭제 필요
const { get } = useAxios()
useEffect(() => {
fetchSettings()
}, [objectNo])
useEffect(() => {
fetchSettings()
}, [])
useEffect(() => {
onClickOnlyOne()
fetchSettings()
}, [settingModalFirstOptions, settingModalSecondOptions])
const fetchSettings = async () => {
try {
const res = await get({ url: `/api/canvas-management/canvas-settings/by-object/${objectNo}` })
const optionData1 = settingModalFirstOptions.option1.map((item) => ({ ...item, selected: res[item.column] }))
const optionData2 = settingModalFirstOptions.option2.map((item) => ({ ...item, selected: res[item.column] }))
const optionData3 = settingModalSecondOptions.option3.map((item) => ({ ...item }))
const optionData4 = settingModalSecondOptions.option4.map((item) => ({ ...item, selected: res[item.column] }))
const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({
...item,
}))
// 데이터 설정
setSettingModalFirstOptions({
option1: optionData1,
option2: optionData2,
dimensionDisplay: optionData5,
})
setSettingModalSecondOptions({
option3: optionData3,
option4: optionData4,
})
} catch (error) {
console.error('Data fetching error:', error)
}
}
const onClickOption = async (option) => {
option.selected = !option.selected
setSettingModalFirstOptions({ option1, option2, dimensionDisplay })
setSettingModalSecondOptions({ option3, option4 })
try {
// 서버에 전송할 데이터
const dataToSend = {
firstOption1: option1.map((item) => ({
column: item.column,
selected: item.selected,
})),
firstOption2: option2.map((item) => ({
column: item.column,
selected: item.selected,
})),
firstOption3: dimensionDisplay.map((item) => ({
column: item.column,
selected: item.selected,
})),
// secondOption1: secondOptions[0].option1.map((item) => ({
// name: item.id,
// name: item.name,
// // 필요한 경우 데이터 항목 추가
// })),
secondOption2: option4.map((item) => ({
column: item.column,
selected: item.selected,
})),
}
const patternData = {
objectNo,
//디스플레이 설정(다중)
allocDisplay: dataToSend.firstOption1[0].selected,
outlineDisplay: dataToSend.firstOption1[1].selected,
gridDisplay: dataToSend.firstOption1[2].selected,
lineDisplay: dataToSend.firstOption1[3].selected,
wordDisplay: dataToSend.firstOption1[4].selected,
circuitNumDisplay: dataToSend.firstOption1[5].selected,
flowDisplay: dataToSend.firstOption1[6].selected,
trestleDisplay: dataToSend.firstOption1[7].selected,
totalDisplay: dataToSend.firstOption1[8].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,
}
// HTTP POST 요청 보내기
await post({ url: `/api/canvas-management/canvas-settings`, data: patternData }).then((res) => {
swalFire({ text: getMessage(res.returnMessage) })
})
} catch (error) {
swalFire({ text: getMessage(res.returnMessage), icon: 'error' })
}
}
return {
fetchSettings,
settingModalFirstOptions,
setSettingModalFirstOptions,
settingModalSecondOptions,
setSettingModalSecondOptions,
onClickOption,
ß,
}
}

6
src/hooks/roofcover/useRoofAllocationSetting.js
View File

@ -86,6 +86,12 @@ export function useRoofAllocationSetting(id) {
swalFire({ text: '할당할 지붕이 없습니다.' })
closePopup(id)
}
// if (type === 'roofBase') {
// // 지붕면 할당
//
// } else if ('roof') {
// // 지붕재 변경
// }
}, [])
const onAddRoofMaterial = () => {

194
src/hooks/useContextMenu.js
View File

@ -1,18 +1,36 @@
import { useRecoilValue } from 'recoil'
import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'
import { currentMenuState, currentObjectState } from '@/store/canvasAtom'
import { useEffect, useState } from 'react'
import { MENU } from '@/common/common'
import AuxiliaryMove from '@/components/floor-plan/modal/auxiliary/AuxiliaryMove'
import AuxiliarySize from '@/components/floor-plan/modal/auxiliary/AuxiliarySize'
import { usePopup } from '@/hooks/usePopup'
import { v4 as uuidv4 } from 'uuid'
import GridMove from '@/components/floor-plan/modal/grid/GridMove'
import GridCopy from '@/components/floor-plan/modal/grid/GridCopy'
import ColorPickerModal from '@/components/common/color-picker/ColorPickerModal'
import { gridColorState } from '@/store/gridAtom'
import { contextPopupPositionState } from '@/store/popupAtom'
import AuxiliaryCopy from '@/components/floor-plan/modal/auxiliary/AuxiliaryCopy'
import SizeSetting from '@/components/floor-plan/modal/object/SizeSetting'
import RoofMaterialSetting from '@/components/floor-plan/modal/object/RoofMaterialSetting'
import DormerOffset from '@/components/floor-plan/modal/object/DormerOffset'
import FontSetting from '@/components/common/font/FontSetting'
import DimensionLineSetting from '@/components/floor-plan/modal/dimensionLine/DimensionLineSetting'
import RoofAllocationSetting from '@/components/floor-plan/modal/roofAllocation/RoofAllocationSetting'
import LinePropertySetting from '@/components/floor-plan/modal/lineProperty/LinePropertySetting'
import FlowDirectionSetting from '@/components/floor-plan/modal/flowDirection/FlowDirectionSetting'
export function useContextMenu({ externalFn }) {
const currentMenu = useRecoilValue(currentMenuState)
const [contextMenu, setContextMenu] = useState([[]])
const [currentContextMenu, setCurrentContextMenu] = useState(null)
const currentMenu = useRecoilValue(currentMenuState) // 현재 메뉴
const setContextPopupPosition = useSetRecoilState(contextPopupPositionState) // 현재 메뉴
const [contextMenu, setContextMenu] = useState([[]]) // 메뉴.object 별 context menu
const [currentContextMenu, setCurrentContextMenu] = useState(null) // 선택한 contextMenu
const currentObject = useRecoilValue(currentObjectState)
const currentMenuSetting = () => {
console.log(currentMenu)
const { addPopup } = usePopup()
const [popupId, setPopupId] = useState(uuidv4())
const [gridColor, setGridColor] = useRecoilState(gridColorState)
const currentMenuSetting = (position) => {
switch (currentMenu) {
case MENU.PLAN_DRAWING:
setContextMenu([
@ -20,14 +38,17 @@ export function useContextMenu({ externalFn }) {
{
id: 'gridMove',
name: '그리드 이동',
component: <GridMove id={popupId} />,
},
{
id: 'gridCopy',
name: '그리드 복사',
component: <GridCopy id={popupId} />,
},
{
id: 'gridColorEdit',
name: '그리드 색 변경',
component: <ColorPickerModal id={popupId} color={gridColor} setColor={setGridColor} />,
},
{
id: 'remove',
@ -84,16 +105,17 @@ export function useContextMenu({ externalFn }) {
{
id: 'sizeEdit',
name: '사이즈 변경',
component: <AuxiliarySize setCurrentContextMenu={setCurrentContextMenu} />,
component: <AuxiliarySize id={popupId} />,
},
{
id: 'auxiliaryMove',
name: '보조선 이동(M)',
component: <AuxiliaryMove setCurrentContextMenu={setCurrentContextMenu} />,
component: <AuxiliaryMove id={popupId} />,
},
{
id: 'auxiliaryCopy',
name: '보조선 복사(C)',
component: <AuxiliaryCopy id={popupId} />,
},
{
id: 'auxiliaryRemove',
@ -160,19 +182,35 @@ export function useContextMenu({ externalFn }) {
break
}
}
useEffect(() => {
currentMenuSetting()
}, [currentMenu])
const handleClick = (e, menu) => {
setContextPopupPosition({
x: e.clientX,
y: e.clientY,
})
setCurrentContextMenu(menu)
}
useEffect(() => {
currentMenuSetting()
}, [gridColor, currentMenu])
useEffect(() => {
if (currentContextMenu?.component) addPopup(popupId, 1, currentContextMenu?.component)
}, [currentContextMenu])
useEffect(() => {
console.log('object name', currentObject?.name)
if (currentObject?.name) {
switch (currentObject.name) {
case 'triangleDormer':
case 'pentagonDormer':
setContextMenu([
[
{
id: 'sizeEdit',
name: '사이즈 변경',
component: <SizeSetting id={popupId} />,
},
{
id: 'dormerRemove',
@ -189,10 +227,12 @@ export function useContextMenu({ externalFn }) {
{
id: 'roofMaterialEdit',
name: '지붕재 변경',
component: <RoofMaterialSetting id={popupId} />,
},
{
id: 'dormerOffset',
name: '도머 오프셋',
component: <DormerOffset id={popupId} />,
},
],
])
@ -203,6 +243,7 @@ export function useContextMenu({ externalFn }) {
{
id: 'sizeEdit',
name: '사이즈 변경',
component: <SizeSetting id={popupId} />,
},
{
id: 'roofMaterialRemove',
@ -221,14 +262,17 @@ export function useContextMenu({ externalFn }) {
{
id: 'roofMaterialEdit',
name: '지붕재 변경',
component: <RoofAllocationSetting id={popupId} />,
},
{
id: 'linePropertyEdit',
name: '각 변 속성 변경',
component: <LinePropertySetting id={popupId} />,
},
{
id: 'flowDirectionEdit',
name: '흐름 뱡향 변경',
component: <FlowDirectionSetting id={popupId} />,
},
],
])
@ -259,6 +303,127 @@ export function useContextMenu({ externalFn }) {
],
])
break
case 'lengthText':
setContextMenu([
[
{
id: 'lengthTextRemove',
name: '삭제',
},
{
id: 'lengthTextMove',
name: '이동',
},
{
id: 'lengthTextAuxiliaryLineEdit',
name: '치수 보조선 변경',
},
{
id: 'displayEdit',
name: '표시 변경',
},
],
])
break
case 'commonText':
setContextMenu([
[
{
id: 'commonTextRemove',
name: '삭제',
},
{
id: 'commonTextMove',
name: '이동',
},
{
id: 'commonTextCopy',
name: '복사',
},
{
id: 'commonTextFontSetting',
name: '폰트 설정',
component: <FontSetting id={popupId} type={'commonText'} />,
},
{
id: 'commonTextEdit',
name: '편집',
},
],
])
break
case 'lineGrid':
setContextMenu([
[
{
id: 'gridMove',
name: '그리드 이동',
},
{
id: 'gridCopy',
name: '그리드 복사',
},
{
id: 'gridColorEdit',
name: '그리드 색 변경',
},
{
id: 'remove',
name: '삭제',
},
{
id: 'removeAll',
name: '전체 삭제',
},
],
])
break
case 'dimensionLine':
setContextMenu([
[
{
id: 'dimensionLineRemove',
name: '삭제',
},
{
id: 'dimensionLineMove',
name: '이동',
},
{
id: 'dimensionAuxiliaryLineEdit',
name: '치수 보조선 변경',
},
{
id: 'dimensionLineDisplayEdit',
name: '표시 변경',
component: <DimensionLineSetting id={popupId} />,
},
],
])
break
case 'shadow':
setContextMenu([
[
{
id: 'sizeEdit',
name: '사이즈 변경',
component: <SizeSetting id={popupId} />,
},
{
id: 'remove',
name: '삭제(D)',
},
{
id: 'move',
name: '이동(M)',
},
{
id: 'copy',
name: '복사(C)',
},
],
])
break
default:
currentMenuSetting()
}
@ -267,13 +432,10 @@ export function useContextMenu({ externalFn }) {
}
}, [currentObject])
useEffect(() => {
console.log(currentContextMenu)
}, [currentContextMenu])
return {
contextMenu,
currentContextMenu,
setCurrentContextMenu,
handleClick,
}
}

9
src/hooks/usePagination.js
View File

@ -28,6 +28,15 @@ const usePagination = ({ pageNo = 1, pageSize = 10, pagePerBlock = 10, totalCoun
return i + startPage
})
// console.log('pageRange', pageRange)
// console.log('startPage', startPage)
// console.log('endPage', endPage)
// console.log('totalPages', totalPages)
// console.log('pageGroup', pageGroup)
// console.log('pagePerBlock', pagePerBlock)
// console.log('currentPage', currentPage)
// console.log('pageNo', pageNo)
return { currentPage, changePage, pageGroup, totalPages, pages, startPage, endPage, pageRange }
}

6
src/hooks/usePopup.js
View File

@ -1,20 +1,14 @@
import { useRecoilState } from 'recoil'
import { popupState } from '@/store/popupAtom'
import { useEffect } from 'react'
export function usePopup() {
const [popup, setPopup] = useRecoilState(popupState)
useEffect(() => {
console.log(popup)
}, [popup])
const addPopup = (id, depth, component) => {
setPopup({ children: [...filterDepth(depth), { id: id, depth: depth, component: component }] })
}
const closePopup = (id) => {
console.log(id)
setPopup({ children: [...filterChildrenPopup(id).filter((child) => child.id !== id)] })
}

10
src/locales/ja.json
View File

@ -477,10 +477,11 @@
"stuff.detail.header.createDatetime": "登録日",
"stuff.detail.required": "必須入力項目",
"stuff.detail.planReqNo": "設計依頼No.",
"stuff.detail.dispCompanyName": "担当者",
"stuff.detail.receiveUser": "担当者",
"stuff.detail.objectStatusId": "物品区分/物件名",
"stuff.detail.objectStatus0": "新築",
"stuff.detail.objectStatus1": "基軸",
"stuff.detail.objectNameOmit": "敬称",
"stuff.detail.objectNameKana": "商品名 ふりがな",
"stuff.detail.saleStoreId": "一次販売店名/ID",
"stuff.detail.otherSaleStoreId": "二次販売店名/ID",
@ -489,8 +490,8 @@
"stuff.detail.btn.addressPop.guide": "※ 郵便番号7桁を入力した後、アドレス検索ボタンをクリックしてください",
"stuff.detail.prefId": "都道府県 / 住所 ",
"stuff.detail.areaId": "発電量シミュレーション地域 ",
"stuff.detail.windSpeed": "基準風速",
"stuff.detail.windSpeedSpan": "m/s以下",
"stuff.detail.standardWindSpeedId": "基準風速",
"stuff.detail.standardWindSpeedIdSpan": "m/s以下",
"stuff.detail.btn.windSpeedPop": "風速選択",
"stuff.detail.verticalSnowCover": "垂直説説",
"stuff.detail.coldRegionFlg": "寒冷地対策施行",
@ -516,8 +517,11 @@
"stuff.detail.btn.moveList": "商品リスト",
"stuff.detail.btn.save": "保存",
"stuff.detail.btn.tempSave": "一時保存",
"stuff.detail.save": "保存しました",
"stuff.detail.noChgData": "変更内容はありません",
"stuff.detail.save.valierror1": "垂直説説は0より大きい値を入力してください",
"stuff.detail.save.valierror2": "設置高さ0より大きい値を入力してください",
"stuff.detail.save.valierror3": "{0} 必須入力項目です.",
"stuff.planReqPopup.popTitle": "設計依頼検索",
"stuff.planReqPopup.btn1": "検索",
"stuff.planReqPopup.btn2": "初期化",

10
src/locales/ko.json
View File

@ -482,10 +482,11 @@
"stuff.detail.header.createDatetime": "등록일",
"stuff.detail.required": "필수 입력항목",
"stuff.detail.planReqNo": "설계의뢰No.",
"stuff.detail.dispCompanyName": "담당자",
"stuff.detail.receiveUser": "담당자",
"stuff.detail.objectStatusId": "물건구분/물건명",
"stuff.detail.objectStatus0": "신축",
"stuff.detail.objectStatus1": "기축",
"stuff.detail.objectNameOmit": "경칭",
"stuff.detail.objectNameKana": "물건명 후리가나",
"stuff.detail.saleStoreId": "1차 판매점명 / ID",
"stuff.detail.otherSaleStoreId": "2차 판매점명 / ID",
@ -494,8 +495,8 @@
"stuff.detail.btn.addressPop.guide": "※ 주소검색 버튼을 클릭한 후, 도도부현 정보를 선택해주십시오.",
"stuff.detail.prefId": "도도부현 / 주소",
"stuff.detail.areaId": "발전량시뮬레이션지역",
"stuff.detail.windSpeed": "기준풍속",
"stuff.detail.windSpeedSpan": "m/s이하",
"stuff.detail.standardWindSpeedId": "기준풍속",
"stuff.detail.standardWindSpeedIdSpan": "m/s이하",
"stuff.detail.btn.windSpeedPop": "풍속선택",
"stuff.detail.verticalSnowCover": "수직적설량",
"stuff.detail.coldRegionFlg": "한랭지대책시행",
@ -521,8 +522,11 @@
"stuff.detail.btn.moveList": "물건목록",
"stuff.detail.btn.save": "저장",
"stuff.detail.btn.tempSave": "임시저장",
"stuff.detail.save": "저장되었습니다",
"stuff.detail.noChgData": "변경된 내용이 없습니다",
"stuff.detail.save.valierror1": "수직적설량은 0보다 큰 값을 입력하세요",
"stuff.detail.save.valierror2": "설치높이는 0보다 큰 값을 입력하세요",
"stuff.detail.save.valierror3": "{0} 필수 입력 항목입니다.",
"stuff.planReqPopup.popTitle": "설계 요청 검색",
"stuff.planReqPopup.btn1": "검색",
"stuff.planReqPopup.btn2": "초기화",

9
src/store/popupAtom.js
View File

@ -11,3 +11,12 @@ export const popupState = atom({
},
dangerouslyAllowMutability: true,
})
export const contextPopupPositionState = atom({
key: 'contextPopupPositionState',
default: {
x: 50,
y: 180,
},
dangerouslyAllowMutability: true,
})

9
src/styles/_contents.scss
View File

@ -309,12 +309,12 @@
padding-top: 46.8px;
transition: all .17s ease-in-out;
.canvas-frame{
height: 86.3vh;
height: calc(100vh - 129.3px);
}
&.active{
padding-top: calc(46.8px + 50px);
.canvas-frame{
height: 81vh;
height: calc(100vh - 179.4px);
}
}
}
@ -1024,6 +1024,7 @@
display: flex;
padding: 20px;
.simulation-tit-wrap{
flex: none;
padding-right: 40px;
border-right: 1px solid #EEEEEE;
span{
@ -1047,6 +1048,7 @@
}
}
.simulation-guide-box{
flex: 1;
padding-left: 40px;
dl{
margin-bottom: 25px;
@ -1066,6 +1068,9 @@
margin-bottom: 0;
}
}
ul, ol{
list-style: unset;
}
}
}

5
src/styles/_main.scss
View File

@ -405,10 +405,15 @@
display: flex;
align-items: center;
border: 1px solid #E5E9EF;
border-radius: 4px;
height: 45px;
padding-left: 40px;
padding-right: 15px;
margin-bottom: 15px;
transition: border .15s ease-in-out;
&.focus{
border-color: #A8B6C7;
}
.login-input{
flex: 1;
height: 100%;