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

Merge branch 'dev' into dev-yj-layoutSetup

Browse Source 
# Conflicts:
#	src/components/floor-plan/modal/basic/BasicSetting.jsx
#	src/hooks/module/useModuleBasicSetting.js
This commit is contained in:
yjnoh 2025-03-14 18:22:24 +09:00
commit f9766a7d21
71 changed files with 5049 additions and 4896 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/common/common.js
View File

@ -202,6 +202,7 @@ export const SAVE_KEY = [
'fontStyle',
'fontWeight',
'dormerAttributes',
'toFixed',
]
export const OBJECT_PROTOTYPE = [fabric.Line.prototype, fabric.Polygon.prototype, fabric.Triangle.prototype, fabric.Group.prototype]

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

@ -33,26 +33,17 @@ export default function ColorPickerModal(props) {
}, [isShow])
return (
<WithDraggable isShow={true} pos={pos ?? ''} handle=".modal-handle">
<div className={`modal-pop-wrap lr mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.color.picker.title')}</h1>
<button
className="modal-close"
onClick={() => {
<WithDraggable isShow={true} pos={pos ?? ''} handle=".modal-handle" className="lr">
<WithDraggable.Header
title={getMessage('modal.color.picker.title')}
onClose={() => {
if (setIsShow) {
setIsShow(false)
}
console.log(id)
closePopup(id, isConfig)
}}
>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
/>
<WithDraggable.Body>
<div className="color-setting-wrap">
<div className="color-picker">
<ColorPicker color={originColor} setColor={setOriginColor} />
@ -78,9 +69,7 @@ export default function ColorPickerModal(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

2
src/components/common/context-menu/QContextMenu.jsx
View File

@ -113,7 +113,7 @@ export default function QContextMenu(props) {
return (
<>
{contextMenu.visible && (
<div className="context-menu-wrap" style={{ position: 'fixed', top: contextMenu.y, left: contextMenu.x, zIndex: 2000 }}>
<div className="context-menu-wrap" style={{ position: 'fixed', top: contextMenu.y, left: contextMenu.x }}>
{/*<ul>*/}
{/*<li style={{ padding: '8px 12px', cursor: 'pointer' }} onClick={() => handleObjectMove()}>*/}
{/* 이동*/}

36
src/components/common/draggable/WithDraggable.jsx
View File

@ -3,7 +3,7 @@
import { useState } from 'react'
import Draggable from 'react-draggable'
export default function WithDraggable({ isShow, children, pos = { x: 0, y: 0 }, handle = '' }) {
export default function WithDraggable({ isShow, children, pos = { x: 0, y: 0 }, handle = '', className = '', hasFooter = true, isHidden = false }) {
const [position, setPosition] = useState(pos)
const handleOnDrag = (e, data) => {
@ -22,9 +22,43 @@ export default function WithDraggable({ isShow, children, pos = { x: 0, y: 0 },
onDrag={(e, data) => handleOnDrag(e, data)}
handle={handle === '' ? '.modal-handle' : handle}
>
<div className={`modal-pop-wrap ${className}`} style={{ visibility: isHidden ? 'hidden' : 'visible' }}>
{children}
{hasFooter && <WithDraggableFooter />}
</div>
</Draggable>
)}
</>
)
}
function WithDraggableHeader({ title, onClose, children }) {
return (
<div className="modal-head modal-handle">
<h1 className="title">{title}</h1>
{onClose && (
<button className="modal-close" onClick={() => onClose()}>
닫기
</button>
)}
</div>
)
}
function WithDraggableBody({ children }) {
return (
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<>{children}</>
</div>
)
}
function WithDraggableFooter() {
return <div className="modal-foot modal-handle"></div>
}
WithDraggable.Header = WithDraggableHeader
WithDraggable.Body = WithDraggableBody
WithDraggable.Footer = WithDraggableFooter

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

@ -67,23 +67,15 @@ export default function FontSetting(props) {
}
return (
<WithDraggable isShow={true} pos={pos} handle=".modal-handle">
<div className={`modal-pop-wrap lrr mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.font')}</h1>
<button
className="modal-close"
onClick={() => {
<WithDraggable isShow={true} pos={pos} handle=".modal-handle" className="lrr">
<WithDraggable.Header
title={getMessage('modal.font')}
onClose={() => {
if (setIsShow) setIsShow(false)
closePopup(id, isConfig)
}}
>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
/>
<WithDraggable.Body>
<div className="slope-wrap">
<div className="font-option-warp">
<div className="font-option-item">
@ -169,9 +161,7 @@ export default function FontSetting(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

7
src/components/common/spinner/PopSpinner.jsx Normal file
View File

@ -0,0 +1,7 @@
export default function PopSpinner() {
return (
<div className="pop-spinner">
<span className="loader"></span>
</div>
)
}

144
src/components/estimate/Estimate.jsx
View File

@ -58,6 +58,9 @@ export default function Estimate({}) {
const [storePriceList, setStorePriceList] = useState([]) //가격표시 option
const [cableItemList, setCableItemList] = useState([]) //케이블 리스트
const [cableItem, setCableItem] = useState('') //케이블 선택값
const [startDate, setStartDate] = useState(new Date())
const singleDatePickerProps = {
startDate,
@ -107,6 +110,16 @@ export default function Estimate({}) {
setHonorificCodeList(code1)
}
// 케이블제품 공통코드
const code2 = findCommonCode(117900)
if (code2 != null) {
code2.map((item) => {
item.value = item.clRefChr1
item.label = item.clRefChr2
})
setCableItemList(code2)
}
//아이템 자동완성 목록 가져오기
const param = {
saleStoreId: session.storeId,
@ -467,10 +480,6 @@ export default function Estimate({}) {
//Pricing 버튼
const handlePricing = async (showPriceCd) => {
//todo: 추후 YJSS가 다시 나타날 경우 아래 swalFire 제거 필요
if (estimateContextState.estimateType === 'YJSS') {
return swalFire({ text: getMessage('estimate.detail.save.requiredEstimateType'), type: 'alert', icon: 'warning' })
}
const param = {
saleStoreId: session.storeId,
sapSalesStoreCd: session.custCd,
@ -551,7 +560,7 @@ export default function Estimate({}) {
}
const getAbledItems = (items) => {
return items.filter((items) => items.paDispOrder === null)
return items.filter((items) => items.dispCableFlg !== '1' && items.paDispOrder === null)
}
const onChangeSelectAll = (e) => {
@ -684,12 +693,20 @@ export default function Estimate({}) {
setItemChangeYn(true)
}
// 아이템 자동완성 검색시 아이템 추가/변경시
const onChangeDisplayItem = (itemId, dispOrder, index) => {
//todo: 추후 YJSS가 다시 나타날 경우 아래 swalFire 제거 필요
if (estimateContextState.estimateType === 'YJSS') {
return swalFire({ text: getMessage('estimate.detail.save.requiredEstimateType'), type: 'alert', icon: 'warning' })
/* 케이블 select 변경시 */
const onChangeDisplayCableItem = (value, itemList) => {
itemList.map((item, index) => {
if (item.dispCableFlg === '1') {
if (value !== '') {
onChangeDisplayItem(value, item.dispOrder, index, true)
}
}
})
setCableItem(value)
}
// 아이템 자동완성 검색시 아이템 추가/변경시
const onChangeDisplayItem = (itemId, dispOrder, index, flag) => {
const param = {
itemId: itemId,
coldZoneFlg: estimateContextState?.coldRegionFlg,
@ -719,7 +736,7 @@ export default function Estimate({}) {
updates.itemGroup = res.itemGroup
updates.delFlg = '0' // 삭제플래그 0
updates.saleTotPrice = (res.salePrice * estimateContextState.itemList[index].amount).toString()
updates.amount = ''
updates.amount = flag ? estimateContextState.itemList[index].amount : ''
updates.openFlg = res.openFlg
if (estimateContextState.estimateType === 'YJSS') {
@ -782,6 +799,7 @@ export default function Estimate({}) {
bomItem.objectNo = objectNo
bomItem.planNo = planNo
bomItem.addFlg = true //봄 추가시도 addFlg
bomItem.openFlg = '0' //봄 컴포넌트는 무조건 0으로
})
updateList = updateList.filter((item) => item.delFlg === '0')
@ -1000,7 +1018,7 @@ export default function Estimate({}) {
item.showSaleTotPrice = '0'
}
})
let dispCableFlgCnt = 0
estimateContextState.itemList.forEach((item) => {
if (item.delFlg === '0') {
let amount = Number(item.amount?.replace(/[^0-9]/g, '').replaceAll(',', '')) || 0
@ -1035,8 +1053,18 @@ export default function Estimate({}) {
item.showSalePrice = '0'
item.showSaleTotPrice = '0'
}
if (item.dispCableFlg === '1') {
dispCableFlgCnt++
setCableItem(item.itemId)
}
}
})
if (dispCableFlgCnt === 0) {
setCableItem('100038')
}
let pkgAsp = estimateContextState.pkgAsp ? Number(estimateContextState.pkgAsp.replaceAll(',', '')) : 0
totals.pkgTotPrice = pkgAsp * totals.totVolKw * 1000
@ -1064,6 +1092,7 @@ export default function Estimate({}) {
}
})
let dispCableFlgCnt = 0
estimateContextState.itemList.forEach((item) => {
delete item.showSalePrice
delete item.showSaleTotPrice
@ -1091,9 +1120,21 @@ export default function Estimate({}) {
item.showSalePrice = '0'
item.showSaleTotPrice = '0'
}
if (item.dispCableFlg === '1') {
dispCableFlgCnt++
}
if (item.dispCableFlg === '1') {
setCableItem(item.itemId)
}
}
})
if (dispCableFlgCnt === 0) {
setCableItem('100038')
}
totals.vatPrice = totals.supplyPrice * 0.1
totals.totPrice = totals.supplyPrice + totals.vatPrice
@ -1136,6 +1177,26 @@ export default function Estimate({}) {
}
}, [estimateContextState])
useEffect(() => {
if (cableItemList.lenght > 0 || estimateContextState?.itemList.length > 0) {
let dispCableFlgCnt = 0
estimateContextState.itemList.map((item) => {
if (item.dispCableFlg === '1') {
dispCableFlgCnt++
cableItemList.map((cable) => {
if (item.itemId === cable.clRefChr1) {
cable.clRefChr3 = item.itemName
}
})
}
})
if (dispCableFlgCnt === 0) {
setCableItem('100038')
}
}
}, [estimateContextState?.itemList, cableItemList])
return (
<div className="sub-content estimate">
<div className="sub-content-inner">
@ -1281,7 +1342,7 @@ export default function Estimate({}) {
</th>
<td colSpan={3}>
<div className="radio-wrap">
{/* <div className="d-check-radio light mr10">
<div className="d-check-radio light mr10">
<input
type="radio"
name="estimateType"
@ -1295,7 +1356,7 @@ export default function Estimate({}) {
}}
/>
<label htmlFor="YJSS">{getMessage('estimate.detail.estimateType.yjss')}</label>
</div> */}
</div>
<div className="d-check-radio light">
<input
type="radio"
@ -1304,8 +1365,7 @@ export default function Estimate({}) {
value={'YJOD'}
checked={estimateContextState?.estimateType === 'YJOD' ? true : false}
onChange={(e) => {
//todo: 추후 YJSS가 다시 나타날 경우 아래 주석풀기
// setHandlePricingFlag(true)
setHandlePricingFlag(true)
setEstimateContextState({ estimateType: e.target.value })
}}
/>
@ -1602,9 +1662,8 @@ export default function Estimate({}) {
</div>
</div>
</div>
{/* //todo: 추후 YJSS가 다시 나타날 경우 주석 풀기 */}
{/* YJOD면 아래영역 숨김 */}
{/* <div className="common-table bt-able" style={{ display: estimateContextState?.estimateType === 'YJSS' ? '' : 'none' }}>
<div className="common-table bt-able" style={{ display: estimateContextState?.estimateType === 'YJSS' ? '' : 'none' }}>
<table>
<colgroup>
<col style={{ width: '160px' }} />
@ -1639,7 +1698,7 @@ export default function Estimate({}) {
</tr>
</tbody>
</table>
</div> */}
</div>
{/* 제품정보 끝 */}
{/* 가격표시영역시작 */}
<div className="estimate-product-option">
@ -1678,6 +1737,24 @@ export default function Estimate({}) {
{getMessage('estimate.detail.showPrice.pricingBtn')}
</button>
</div>
<div className="product-price-wrap ml10">
<div className="select-wrap">
<select
className="select-light"
onChange={(e) => {
onChangeDisplayCableItem(e.target.value, estimateContextState.itemList)
}}
value={cableItem}
>
{cableItemList.length > 0 &&
cableItemList.map((row) => (
<option key={row.clRefChr1} value={row.clRefChr1}>
{row.clRefChr2}
</option>
))}
</select>
</div>
</div>
<div className="product-edit-wrap">
<ul className="product-edit-explane">
<li className="explane-item item01">
@ -1757,7 +1834,7 @@ export default function Estimate({}) {
<input
type="checkbox"
id={item?.dispOrder}
disabled={!!item?.paDispOrder}
disabled={!!item?.paDispOrder || item.dispCableFlg === '1'}
onChange={() => onChangeSelect(item.dispOrder)}
checked={!!selection.has(item.dispOrder)}
/>
@ -1768,6 +1845,7 @@ export default function Estimate({}) {
<td>
<div className="form-flex-wrap">
<div className="select-wrap mr5">
{item.dispCableFlg !== '1' ? (
<Select
name="long-value-select1"
instanceId="long-value-select1"
@ -1777,18 +1855,40 @@ export default function Estimate({}) {
options={originDisplayItemList}
onChange={(e) => {
if (isObjectNotEmpty(e)) {
onChangeDisplayItem(e.itemId, item.dispOrder, index)
onChangeDisplayItem(e.itemId, item.dispOrder, index, false)
}
}}
menuPlacement={'auto'}
getOptionLabel={(x) => x.itemName}
getOptionValue={(x) => x.itemId}
getOptionValue={(x) => x.itemNo}
isClearable={false}
isDisabled={!!item?.paDispOrder}
value={displayItemList.filter(function (option) {
if (item.itemNo === '') {
return false
} else {
return option.itemId === item.itemId
}
})}
/>
) : (
<Select
name="long-value-select11"
instanceId="long-value-select11"
className="react-select-custom"
classNamePrefix="custom"
placeholder="Select"
options={cableItemList}
menuPlacement={'auto'}
getOptionLabel={(x) => x.clRefChr3}
getOptionValue={(x) => x.clRefChr1}
isClearable={false}
isDisabled={true}
value={cableItemList.filter(function (option) {
return option.clRefChr1 === item.itemId
})}
/>
)}
</div>
{item?.itemChangeFlg === '1' && (
<div className="btn-area">

6
src/components/fabric/QPolygon.js
View File

@ -23,6 +23,7 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, {
initOptions: null,
direction: null,
arrow: null,
toFixed: 1,
initialize: function (points, options, canvas) {
this.lines = []
this.texts = []
@ -33,11 +34,12 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, {
this.innerLines = []
this.children = []
this.separatePolygon = []
this.toFixed = options.toFixed ?? 1
// 소수점 전부 제거
points.forEach((point) => {
point.x = Number(point.x.toFixed(1))
point.y = Number(point.y.toFixed(1))
point.x = Number(point.x.toFixed(this.toFixed))
point.y = Number(point.y.toFixed(this.toFixed))
})
options.selectable = options.selectable ?? true
options.sort = options.sort ?? true

7
src/components/floor-plan/CanvasMenu.jsx
View File

@ -111,7 +111,7 @@ export default function CanvasMenu(props) {
//임시
const { selectedPlan } = usePlan()
const handleExcelPdfFileDown = async (donwloadType, drawingFlg) => {
const url = '/api/estimate/excel-download'
const url = '/api/pwrGnrSimulation/excel-download'
const params = {
objectNo: objectNo,
@ -365,11 +365,6 @@ export default function CanvasMenu(props) {
// 견적서 초기화 버튼
const handleEstimateReset = () => {
//todo: 추후 YJSS가 다시 나타날 경우 아래 swalFire 제거 필요
if (estimateRecoilState.estimateType === 'YJSS') {
return swalFire({ text: getMessage('estimate.detail.save.requiredEstimateType'), type: 'alert', icon: 'warning' })
}
swalFire({
text: getMessage('estimate.detail.reset.confirmMsg'),
type: 'confirm',

27
src/components/floor-plan/modal/ImgLoad.jsx
View File

@ -76,22 +76,13 @@ export default function ImgLoad() {
}, [currentCanvasPlan])
return (
<WithDraggable isShow={floorPlanState.refFileModalOpen} pos={{ x: 1000, y: 200 }}>
<div className={`modal-pop-wrap r`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('common.input.file')}</h1>
<button
className="modal-close"
onClick={() => {
setFloorPlanState({ ...floorPlanState, refFileModalOpen: false })
}}
>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={floorPlanState.refFileModalOpen} pos={{ x: 1000, y: 200 }} className="r">
<WithDraggable.Header
title={getMessage('common.input.file')}
onClose={() => setFloorPlanState({ ...floorPlanState, refFileModalOpen: false })}
/>
<WithDraggable.Body>
<div className="img-flex-box">
<span className="normal-font mr10">{getMessage('modal.image.load.size.rotate')}</span>
<label className="toggle-btn">
@ -166,9 +157,7 @@ export default function ImgLoad() {
</button>
{/* <button className="btn-frame modal act" onClick={() => handleCanvasToPng(2)}></button> */}
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/Slope.jsx
View File

@ -13,17 +13,9 @@ export default function Slope({ id, pos = { x: 50, y: 230 } }) {
const inputRef = useRef()
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xxxm`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('plan.menu.placement.surface.slope.setting')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="xxxm">
<WithDraggable.Header title={getMessage('plan.menu.placement.surface.slope.setting')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="slope-wrap">
<div className="outline-form">
<span className="mr10" style={{ width: 'auto' }}>
@ -46,9 +38,7 @@ export default function Slope({ id, pos = { x: 50, y: 230 } }) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/auxiliary/AuxiliaryDrawing.jsx
View File

@ -124,17 +124,9 @@ export default function AuxiliaryDrawing({ id, pos = { x: 50, y: 230 } }) {
setType(button.type)
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap r`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.auxiliary.drawing')}</h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="r">
<WithDraggable.Header title={getMessage('modal.auxiliary.drawing')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="modal-btn-wrap">
{types.map((type, idx) => (
<button key={idx} className={`btn-frame modal ${buttonAct === type.id ? 'act' : ''}`} onClick={() => onClickButton(type)}>
@ -161,9 +153,7 @@ export default function AuxiliaryDrawing({ id, pos = { x: 50, y: 230 } }) {
{getMessage('apply')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/auxiliary/AuxiliaryEdit.jsx
View File

@ -55,17 +55,9 @@ export default function AuxiliaryEdit(props) {
closePopup(id)
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage(type === 'copy' ? 'modal.auxiliary.copy' : 'modal.auxiliary.move')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="xm">
<WithDraggable.Header title={getMessage(type === 'copy' ? 'modal.auxiliary.copy' : 'modal.auxiliary.move')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="grid-option-tit">{getMessage(type === 'copy' ? 'modal.auxiliary.copy.info' : 'modal.auxiliary.move.info')}</div>
<div className="grid-option-wrap">
<div className="grid-option-box">
@ -123,9 +115,7 @@ export default function AuxiliaryEdit(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

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

@ -111,17 +111,9 @@ export default function AuxiliarySize(props) {
closePopup(id)
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.auxiliary.size.edit')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="xm">
<WithDraggable.Header title={getMessage('modal.auxiliary.size.edit')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="discrimination-box mb10">
<div className="d-check-radio pop mb10">
<input type="radio" name="radio01" id="ra01" onClick={(e) => setCheckedRadio(1)} />
@ -165,9 +157,7 @@ export default function AuxiliarySize(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

42
src/components/floor-plan/modal/basic/BasicSetting.jsx
View File

@ -11,7 +11,7 @@ import { usePopup } from '@/hooks/usePopup'
import { Orientation } from '@/components/floor-plan/modal/basic/step/Orientation'
import { useModuleBasicSetting } from '@/hooks/module/useModuleBasicSetting'
import { useEvent } from '@/hooks/useEvent'
import { moduleSelectionDataState } from '@/store/selectedModuleOptions'
import { moduleSelectionDataState, selectedModuleState } from '@/store/selectedModuleOptions'
import { addedRoofsState, corridorDimensionSelector, basicSettingState } from '@/store/settingAtom'
import { isObjectNotEmpty } from '@/util/common-utils'
import Swal from 'sweetalert2'
@ -38,6 +38,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
const canvas = useRecoilValue(canvasState)
const [basicSetting, setBasicSettings] = useRecoilState(basicSettingState)
const [isClosePopup, setIsClosePopup] = useState({ close: false, id: 0 })
const [checkedModules, setCheckedModules] = useRecoilState(checkedModuleState)
const [manualSetupMode, setManualSetupMode] = useState('manualSetup')
@ -50,6 +51,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
const { manualModuleSetup, autoModuleSetup, manualFlatroofModuleSetup, autoFlatroofModuleSetup, manualModuleLayoutSetup } =
useModuleBasicSetting(tabNum)
const { updateObjectDate } = useMasterController()
const handleBtnNextStep = () => {
if (tabNum === 1) {
orientationRef.current.handleNextStep()
@ -163,18 +165,14 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
}
}, [layoutSetup])
useEffect(() => {
setIsManualModuleSetup(false)
}, [checkedModules])
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap lx-2`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('plan.menu.module.circuit.setting.default')}</h1>
<button className="modal-close" onClick={() => handleClosePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="lx-2">
<WithDraggable.Header title={getMessage('plan.menu.module.circuit.setting.default')} onClose={() => handleClosePopup(id)} />
<WithDraggable.Body>
<div className="roof-module-tab">
<div className={`module-tab-bx act`}>{getMessage('modal.module.basic.setting.orientation.setting')}</div>
<span className={`tab-arr ${tabNum !== 1 ? 'act' : ''}`}></span>
@ -185,9 +183,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
{tabNum === 1 && <Orientation ref={orientationRef} tabNum={tabNum} setTabNum={setTabNum} />}
{/*배치면 초기설정 - 입력방법: 복시도 입력 || 실측값 입력*/}
{basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' && tabNum === 2 && <Module setTabNum={setTabNum} />}
{basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' && tabNum === 3 && (
<Placement setTabNum={setTabNum} ref={placementRef} setLayoutSetup={setLayoutSetup} layoutSetup={layoutSetup} />
)}
{basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' && tabNum === 3 && <Placement setTabNum={setTabNum} ref={placementRef} />}
{/*배치면 초기설정 - 입력방법: 육지붕*/}
{basicSetting.roofSizeSet && basicSetting.roofSizeSet == '3' && tabNum === 2 && <PitchModule setTabNum={setTabNum} />}
@ -195,6 +191,19 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
<PitchPlacement setTabNum={setTabNum} ref={placementFlatRef} />
)}
<div className="grid-btn-wrap">
{tabNum !== 1 && (
<button className="btn-frame modal mr5" onClick={() => setTabNum(tabNum - 1)}>
{getMessage('modal.module.basic.setting.prev')}
</button>
)}
{/*{tabNum !== 3 && <button className="btn-frame modal act mr5">{getMessage('modal.common.save')}</button>}*/}
{tabNum !== 3 && (
<button className="btn-frame modal" onClick={handleBtnNextStep}>
Next
</button>
)}
<div className="grid-btn-wrap">
{tabNum !== 1 && (
<button className="btn-frame modal mr5" onClick={() => setTabNum(tabNum - 1)}>
@ -237,8 +246,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
)}
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

19
src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx
View File

@ -612,18 +612,9 @@ export default function CircuitTrestleSetting({ id }) {
}
return (
<WithDraggable isShow={true} pos={{ x: 50, y: 230 }}>
<div className={`modal-pop-wrap l-2`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.circuit.trestle.setting')} </h1>
{/* <button className="modal-close" onClick={() => closePopup(id)}> */}
<button className="modal-close" onClick={handleClose}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={{ x: 50, y: 230 }} className="l-2">
<WithDraggable.Header title={getMessage('modal.circuit.trestle.setting')} onClose={() => handleClose()} />
<WithDraggable.Body>
<div className="roof-module-tab">
<div className={`module-tab-bx act`}>{getMessage('modal.circuit.trestle.setting.power.conditional.select')}</div>
<span className={`tab-arr ${tabNum === 2 ? 'act' : ''}`}></span>
@ -667,9 +658,7 @@ export default function CircuitTrestleSetting({ id }) {
</button>
</div>
)}
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

27
src/components/floor-plan/modal/circuitTrestle/step/PowerConditionalSelect.jsx
View File

@ -160,6 +160,20 @@ export default function PowerConditionalSelect(props) {
return
}
if (selectedModels.find((m) => m.pcsSerParallelYn === 'Y') && selectedRow.pcsSerParallelYn === 'Y') {
return
}
if (selectedRow.pcsSerParallelYn === 'Y' && selectedModels.length === 0 && selectedMaker.pcsMkrMultiType === PCS_MKR_MULTI_TYPE.SINGLE_P) {
swalFire({
title: getMessage('modal.module.pcs.error1'),
icon: 'warning',
})
return
}
if (selectedMaker.pcsMkrMultiType === PCS_MKR_MULTI_TYPE.MULTI) {
setSelectedModels([...selectedModels, { ...selectedRow, id: uuidv4() }])
} else if (!selectedModels.find((m) => m.itemId === selectedRow.itemId)) {
@ -169,6 +183,11 @@ export default function PowerConditionalSelect(props) {
}
const onRemoveSelectedModel = (model) => {
const tempModels = selectedModels.filter((m) => m.id !== model.id)
if (tempModels.length === 1 && tempModels[0].pcsSerParallelYn === 'Y') {
setSelectedModels([])
return
}
setSelectedModels(selectedModels.filter((m) => m.id !== model.id))
}
@ -277,14 +296,6 @@ export default function PowerConditionalSelect(props) {
</label>
</div>
</div>
{/* <div className="grid-btn-wrap">
<button className="btn-frame modal mr5" onClick={() => setTabNum(2)}>
{getMessage('modal.circuit.trestle.setting.circuit.allocation.auto')}
</button>
<button className="btn-frame modal act" onClick={() => setTabNum(tabNum + 1)}>
{getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity')}
</button>
</div> */}
</>
)
}

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

@ -122,17 +122,9 @@ export default function DimensionLineSetting(props) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('contextmenu.display.edit')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="xm">
<WithDraggable.Header title={getMessage('contextmenu.display.edit')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="guide">{getMessage('modal.display.edit.info')}</div>
<div className="mb-box">
<div className="slope-wrap">
@ -208,9 +200,7 @@ export default function DimensionLineSetting(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/distance/Distance.jsx
View File

@ -16,17 +16,9 @@ export default function Distance(props) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xxxm`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.distance')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="xxxm">
<WithDraggable.Header title={getMessage('modal.distance')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="slope-wrap">
<div className="eaves-keraba-table">
<div className="eaves-keraba-item">
@ -69,9 +61,7 @@ export default function Distance(props) {
{getMessage('common.ok')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/eavesGable/EavesGableEdit.jsx
View File

@ -38,17 +38,9 @@ export default function EavesGableEdit({ id, pos = { x: 50, y: 230 } }) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap r`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.eaves.gable.edit')}</h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="r">
<WithDraggable.Header title={getMessage('modal.eaves.gable.edit')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="modal-btn-wrap">
{buttonMenu.map((item) => (
<button key={item.id} className={`btn-frame modal ${type === item.type ? 'act' : ''}`} onClick={() => setType(item.type)}>
@ -63,9 +55,7 @@ export default function EavesGableEdit({ id, pos = { x: 50, y: 230 } }) {
{type === TYPES.WALL_MERGE && <WallMerge {...wallMergeProps} />}
{type === TYPES.SHED && <Shed {...shedProps} />}
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/flowDirection/FlowDirectionSetting.jsx
View File

@ -63,17 +63,9 @@ export default function FlowDirectionSetting(props) {
)
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap ml mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.shape.flow.direction.setting')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="ml">
<WithDraggable.Header title={getMessage('modal.shape.flow.direction.setting')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="drawing-flow-wrap">
<div className="discrimination-box">
<div className="discrimination-tit mb15">{getMessage('modal.flow.direction.setting')}</div>
@ -177,9 +169,7 @@ export default function FlowDirectionSetting(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

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

@ -177,23 +177,15 @@ export default function DotLineGrid(props) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap ssm mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.canvas.setting.grid.dot.line.setting')}</h1>
<button
className="modal-close"
onClick={() => {
<WithDraggable isShow={true} pos={pos} className="ssm">
<WithDraggable.Header
title={getMessage('modal.canvas.setting.grid.dot.line.setting')}
onClose={() => {
setIsShow(false)
closePopup(id, isConfig)
}}
>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
/>
<WithDraggable.Body>
<div className="grid-check-form">
<div className="d-check-box pop">
<input type="checkbox" id="ch01" value={TYPE.DOT} onChange={handleCheckBoxChange} checked={copyCurrentSetting.DOT} />
@ -293,9 +285,7 @@ export default function DotLineGrid(props) {
{getMessage('modal.canvas.setting.grid.dot.line.setting.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

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

@ -20,17 +20,9 @@ export default function GridCopy(props) {
copy(currentObject, ['↑', '←'].includes(arrow) ? +length * -1 : +length)
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.grid.copy')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="xm">
<WithDraggable.Header title={getMessage('modal.grid.copy')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="grid-option-tit">{getMessage('modal.grid.copy.info')}</div>
<div className="grid-option-wrap">
<div className="grid-option-box">
@ -78,9 +70,7 @@ export default function GridCopy(props) {
{getMessage('modal.grid.copy.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

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

@ -73,17 +73,9 @@ export default function GridMove(props) {
closePopup(id)
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.grid.move')} </h1>
<button className="modal-close" onClick={handleClose}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="xm">
<WithDraggable.Header title={getMessage('modal.grid.move')} onClose={() => handleClose()} />
<WithDraggable.Body>
<div className="grid-option-tit">{getMessage('modal.grid.move.info')}</div>
<div className="grid-option-wrap">
<div className="d-check-box pop mb10">
@ -157,9 +149,7 @@ export default function GridMove(props) {
{getMessage('modal.grid.move.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/lineProperty/LinePropertySetting.jsx
View File

@ -50,17 +50,9 @@ export default function LinePropertySetting(props) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap r mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('contextmenu.line.property.edit')} </h1>
<button className="modal-close" onClick={() => handleClosePopup()}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="r">
<WithDraggable.Header title={getMessage('contextmenu.line.property.edit')} onClose={() => handleClosePopup()} />
<WithDraggable.Body>
<div className="guide">
<span className="mb10">{getMessage('modal.line.property.edit.info')}</span>
<span>
@ -92,9 +84,7 @@ export default function LinePropertySetting(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/module/CircuitNumberEdit.jsx
View File

@ -14,17 +14,9 @@ export default function CircuitNumberEdit(props) {
closePopup(id)
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm mount`}>
<div className="modal-head modal-handle">
<h1 className="title"> {getMessage('modal.module.circuit.number.edit')}</h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="xm">
<WithDraggable.Header title={getMessage('modal.module.circuit.number.edit')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="grid-option-tit"> {getMessage('modal.module.circuit.number.edit.info')}</div>
<div className="grid-option-wrap">
<div className="grid-option-box">
@ -43,9 +35,7 @@ export default function CircuitNumberEdit(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

29
src/components/floor-plan/modal/module/PanelEdit.jsx
View File

@ -91,23 +91,14 @@ export default function PanelEdit(props) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm mount`}>
<div className="modal-head modal-handle">
<h1 className="title">
{getMessage(
[PANEL_EDIT_TYPE.MOVE, PANEL_EDIT_TYPE.MOVE_ALL, PANEL_EDIT_TYPE.COLUMN_MOVE].includes(type)
? 'modal.move.setting'
: 'modal.copy.setting',
)}{' '}
</h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="xm">
<WithDraggable.Header
title={getMessage(
[PANEL_EDIT_TYPE.MOVE, PANEL_EDIT_TYPE.MOVE_ALL, PANEL_EDIT_TYPE.COLUMN_MOVE].includes(type) ? 'modal.move.setting' : 'modal.copy.setting',
)}
onClose={() => closePopup(id)}
/>
<WithDraggable.Body>
<div className="grid-option-tit">
{getMessage(
[PANEL_EDIT_TYPE.MOVE, PANEL_EDIT_TYPE.MOVE_ALL, PANEL_EDIT_TYPE.COLUMN_MOVE].includes(type)
@ -157,9 +148,7 @@ export default function PanelEdit(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

34
src/components/floor-plan/modal/module/column/ColumnInsert.jsx
View File

@ -24,17 +24,9 @@ export default function ColumnInsert(props) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap r mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.panel.column.insert')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="r">
<WithDraggable.Header title={getMessage('modal.panel.column.insert')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="properties-setting-wrap">
<div className="setting-tit">{getMessage('modal.panel.column.insert.info')}</div>
<div className="additional-wrap">
@ -64,22 +56,10 @@ export default function ColumnInsert(props) {
</div>
<div className="additional-img-wrap">
{selectedType === MODULE_INSERT_TYPE.LEFT && (
<Image
src="/static/images/canvas/additional-edit01.svg"
alt="react"
width={0}
height={0}
style={{ width: 'auto', height: 'auto' }}
/>
<Image src="/static/images/canvas/additional-edit01.svg" alt="react" width={0} height={0} style={{ width: 'auto', height: 'auto' }} />
)}
{selectedType === MODULE_INSERT_TYPE.RIGHT && (
<Image
src="/static/images/canvas/additional-edit02.svg"
alt="react"
width={0}
height={0}
style={{ width: 'auto', height: 'auto' }}
/>
<Image src="/static/images/canvas/additional-edit02.svg" alt="react" width={0} height={0} style={{ width: 'auto', height: 'auto' }} />
)}
</div>
</div>
@ -106,9 +86,7 @@ export default function ColumnInsert(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

50
src/components/floor-plan/modal/module/column/ColumnRemove.jsx
View File

@ -26,17 +26,9 @@ export default function ColumnRemove(props) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap r mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.panel.column.remove')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="r">
<WithDraggable.Header title={getMessage('modal.panel.column.remove')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="properties-setting-wrap">
<div className="setting-tit">{getMessage('modal.panel.column.remove.info')}</div>
<div className="additional-wrap">
@ -59,40 +51,16 @@ export default function ColumnRemove(props) {
</div>
<div className="additional-img-wrap">
{selectedType === MODULE_REMOVE_TYPE.LEFT && (
<Image
src="/static/images/canvas/additional_del01.svg"
alt="react"
width={0}
height={0}
style={{ width: 'auto', height: 'auto' }}
/>
<Image src="/static/images/canvas/additional_del01.svg" alt="react" width={0} height={0} style={{ width: 'auto', height: 'auto' }} />
)}
{selectedType === MODULE_REMOVE_TYPE.RIGHT && (
<Image
src="/static/images/canvas/additional_del02.svg"
alt="react"
width={0}
height={0}
style={{ width: 'auto', height: 'auto' }}
/>
<Image src="/static/images/canvas/additional_del02.svg" alt="react" width={0} height={0} style={{ width: 'auto', height: 'auto' }} />
)}
{selectedType === MODULE_REMOVE_TYPE.HORIZONTAL_SIDE && (
<Image
src="/static/images/canvas/additional_del03.svg"
alt="react"
width={0}
height={0}
style={{ width: 'auto', height: 'auto' }}
/>
<Image src="/static/images/canvas/additional_del03.svg" alt="react" width={0} height={0} style={{ width: 'auto', height: 'auto' }} />
)}
{selectedType === MODULE_REMOVE_TYPE.NONE && (
<Image
src="/static/images/canvas/additional_del04.svg"
alt="react"
width={0}
height={0}
style={{ width: 'auto', height: 'auto' }}
/>
<Image src="/static/images/canvas/additional_del04.svg" alt="react" width={0} height={0} style={{ width: 'auto', height: 'auto' }} />
)}
</div>
</div>
@ -115,9 +83,7 @@ export default function ColumnRemove(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

17
src/components/floor-plan/modal/module/row/RowInsert.jsx
View File

@ -24,17 +24,9 @@ export default function RowInsert(props) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap r mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.row.insert')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="r">
<WithDraggable.Header title={getMessage('modal.row.insert')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="properties-setting-wrap">
<div className="setting-tit">{getMessage('modal.row.insert.info')}</div>
<div className="additional-wrap">
@ -106,9 +98,8 @@ export default function RowInsert(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/module/row/RowRemove.jsx
View File

@ -27,17 +27,9 @@ export default function RowRemove(props) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap r mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.row.remove')}</h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="r">
<WithDraggable.Header title={getMessage('modal.row.remove')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="properties-setting-wrap">
<div className="setting-tit">{getMessage('modal.row.remove.info')}</div>
<div className="additional-wrap">
@ -116,9 +108,7 @@ export default function RowRemove(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/movement/MovementSetting.jsx
View File

@ -16,17 +16,9 @@ export default function MovementSetting({ id, pos = { x: 50, y: 230 } }) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap r`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('plan.menu.roof.cover.movement.shape.updown')}</h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="r">
<WithDraggable.Header title={getMessage('plan.menu.roof.cover.movement.shape.updown')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="modal-btn-wrap">
{buttonType.map((item) => (
<button key={item.id} className={`btn-frame modal ${type === item.type ? 'act' : ''}`} onClick={() => setType(item.type)}>
@ -43,9 +35,7 @@ export default function MovementSetting({ id, pos = { x: 50, y: 230 } }) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/object/DormerOffset.jsx
View File

@ -40,17 +40,9 @@ export default function DormerOffset(props) {
// closePopup(id)
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xm mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{title}</h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="xm">
<WithDraggable.Header title={title} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="grid-option-tit">{getMessage('modal.dormer.offset.info')}</div>
<div className="grid-option-wrap">
<div className="grid-option-box">
@ -104,9 +96,7 @@ export default function DormerOffset(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/object/ObjectSetting.jsx
View File

@ -100,17 +100,9 @@ export default function ObjectSetting({ id, pos = { x: 50, y: 230 } }) {
]
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap lrr`} style={{ visibility: isHidden ? 'hidden' : 'visible' }}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('plan.menu.placement.surface.object')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="lrr" style={{ visibility: isHidden ? 'hidden' : 'visible' }}>
<WithDraggable.Header title={getMessage('plan.menu.placement.surface.object')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="modal-btn-wrap">
{buttonMenu.map((item) => (
<button key={item.id} className={`btn-frame modal ${buttonAct === item.id ? 'act' : ''}`} onClick={() => setButtonAct(item.id)}>
@ -134,9 +126,7 @@ export default function ObjectSetting({ id, pos = { x: 50, y: 230 } }) {
{getMessage('write')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/object/RoofMaterialSetting.jsx
View File

@ -21,17 +21,9 @@ export default function RoofMaterialSetting(props) {
]
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xxxm mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.roof.material.edit')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="xxxm">
<WithDraggable.Header title={getMessage('modal.roof.material.edit')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="slope-wrap">
<div className="grid-select">
<QSelectBox title={'지붕재 선택'} options={roofMaterials} />
@ -40,9 +32,7 @@ export default function RoofMaterialSetting(props) {
<div className="grid-btn-wrap">
<button className="btn-frame modal act">{getMessage('modal.common.save')}</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/object/SizeSetting.jsx
View File

@ -40,17 +40,9 @@ export default function SizeSetting(props) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap ssm mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.size.setting')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="ssm">
<WithDraggable.Header title={getMessage('modal.size.setting')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="slope-wrap">
<div className="size-option-top">
<div className="size-option-wrap">
@ -91,9 +83,7 @@ export default function SizeSetting(props) {
{getMessage('write')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/outerlinesetting/PropertiesSetting.jsx
View File

@ -8,17 +8,9 @@ export default function PropertiesSetting(props) {
const { handleSetEaves, handleSetGable, handleRollback, handleFix, closeModal } = usePropertiesSetting(id)
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap ssm`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.canvas.setting.wallline.properties.setting')}</h1>
<button className="modal-close" onClick={() => closeModal(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="ssm">
<WithDraggable.Header title={getMessage('modal.canvas.setting.wallline.properties.setting')} onClose={() => closeModal(id)} />
<WithDraggable.Body>
<div className="properties-guide">{getMessage('modal.canvas.setting.wallline.properties.setting.info')}</div>
<div className="properties-setting-wrap">
<div className="setting-tit">{getMessage('setting')}</div>
@ -39,9 +31,7 @@ export default function PropertiesSetting(props) {
{getMessage('modal.cover.outline.finish')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

16
src/components/floor-plan/modal/outerlinesetting/WallLineSetting.jsx
View File

@ -114,15 +114,9 @@ export default function WallLineSetting(props) {
}
return (
<WithDraggable isShow={true} pos={{ x: 50, y: 230 }}>
<div className={`modal-pop-wrap r mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.cover.outline.drawing')}</h1>
<button className="modal-close" onClick={() => closePopup(id)}></button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={{ x: 50, y: 230 }} className="r">
<WithDraggable.Header title={getMessage('modal.cover.outline.drawing')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="modal-btn-wrap">
{/*<button
className={`btn-frame modal ${type === OUTER_LINE_TYPE.OUTER_LINE ? 'act' : ''}`}
@ -184,9 +178,7 @@ export default function WallLineSetting(props) {
{getMessage('modal.cover.outline.fix')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/panelBatch/PanelBatchStatistics.jsx
View File

@ -11,25 +11,31 @@ import { canvasState } from '@/store/canvasAtom'
import { POLYGON_TYPE } from '@/common/common'
import { useCircuitTrestle } from '@/hooks/useCirCuitTrestle'
import { moduleSelectionDataState } from '@/store/selectedModuleOptions'
import Draggable from 'react-draggable'
export default function PanelBatchStatistics() {
const { getMessage } = useMessage()
const [isFold, setIsFold] = useState(false)
const [pos, setPos] = useState({
x: 0,
y: 30,
})
const canvas = useRecoilValue(canvasState)
const { header, rows, footer } = useRecoilValue(moduleStatisticsState)
const { setModuleStatisticsData } = useCircuitTrestle(true)
const [moduleSelectionDataStore, setModuleSelectionDataStore] = useRecoilState(moduleSelectionDataState)
const [position, setPosition] = useState({
x: 0,
y: 30,
})
const handleOnDrag = (e, data) => {
e.stopPropagation()
setPosition({ x: data.x, y: data.y })
}
useEffect(() => {
if (moduleSelectionDataStore && moduleSelectionDataStore.module) setModuleStatisticsData()
}, [])
return (
<WithDraggable isShow={true} handle=".penal-wrap" pos={pos}>
<Draggable position={{ x: position.x, y: position.y }} onDrag={(e, data) => handleOnDrag(e, data)} handle=".penal-wrap">
<div className={`penal-wrap ${!isFold ? 'act' : ''}`}>
<h2>{getMessage('modal.panel.batch.statistic')}</h2>
<button className="penal-arr" onClick={() => setIsFold(!isFold)}></button>
@ -63,6 +69,6 @@ export default function PanelBatchStatistics() {
</table>
</div>
</div>
</WithDraggable>
</Draggable>
)
}

24
src/components/floor-plan/modal/placementShape/PlacementShapeDrawing.jsx
View File

@ -121,24 +121,12 @@ export default function PlacementShapeDrawing({ id, pos = { x: 50, y: 230 } }) {
setType(button.type)
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap r`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('plan.menu.placement.surface.drawing')}</h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="r">
<WithDraggable.Header title={getMessage('plan.menu.placement.surface.drawing')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="modal-btn-wrap">
{types.map((type, idx) => (
<button
key={`placement-${idx}`}
className={`btn-frame modal ${buttonAct === type.id ? 'act' : ''}`}
onClick={() => onClickButton(type)}
>
<button key={`placement-${idx}`} className={`btn-frame modal ${buttonAct === type.id ? 'act' : ''}`} onClick={() => onClickButton(type)}>
{type.name}
</button>
))}
@ -159,9 +147,7 @@ export default function PlacementShapeDrawing({ id, pos = { x: 50, y: 230 } }) {
{getMessage('modal.placement.surface.drawing.fix')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

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

@ -257,12 +257,9 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap ll mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('plan.menu.placement.surface.initial.setting')}</h1>
</div>
<div className="modal-body">
<WithDraggable isShow={true} pos={pos} className="ll">
<WithDraggable.Header title={getMessage('plan.menu.placement.surface.initial.setting')} />
<WithDraggable.Body>
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="placement-table">
@ -477,11 +474,9 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
{getMessage('modal.common.save')}
</button>
</div>
</div>
</WithDraggable.Body>
{showSizeGuideModal && <SizeGuide setShowSizeGuidModal={setShowSizeGuidModal} />}
{showMaterialGuideModal && <MaterialGuide setShowMaterialGuidModal={setShowMaterialGuidModal} />}
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/placementShape/PlacementSurfaceLineProperty.jsx
View File

@ -41,17 +41,9 @@ export default function PlacementSurfaceLineProperty(props) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap mount lr`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.canvas.setting.roofline.properties.setting')}</h1>
<button className="modal-close" onClick={() => handleClose()}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="lr">
<WithDraggable.Header title={getMessage('modal.canvas.setting.roofline.properties.setting')} onClose={() => handleClose()} />
<WithDraggable.Body>
<div className="properties-guide">{getMessage('modal.canvas.setting.roofline.properties.setting.info')}</div>
<div className="properties-setting-wrap">
<div className="setting-tit">{getMessage('setting')}</div>
@ -75,9 +67,7 @@ export default function PlacementSurfaceLineProperty(props) {
{getMessage('modal.cover.outline.finish')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

24
src/components/floor-plan/modal/placementSurface/PlacementSurfaceSetting.jsx
View File

@ -256,26 +256,14 @@ export default function PlacementSurfaceSetting({ id, pos = { x: 50, y: 230 } })
}, [])
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap lr-2`} style={{ visibility: isHidden ? 'hidden' : 'visible' }}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('plan.menu.placement.surface.arrangement')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="lr-2" isHidden={isHidden}>
<WithDraggable.Header title={getMessage('plan.menu.placement.surface.arrangement')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="plane-frame-wrap">
<div className="plane-shape-wrap">
<div className="plane-shape-menu">
{types.map((type) => (
<button
key={type.id}
className={`shape-menu-box ${selectedType?.id === type.id ? 'act' : ''}`}
onClick={() => setSelectedType(type)}
>
<button key={type.id} className={`shape-menu-box ${selectedType?.id === type.id ? 'act' : ''}`} onClick={() => setSelectedType(type)}>
<div className="shape-box">
<Image
src={`/static/images/canvas/plane_shape0${type?.id}.svg`}
@ -310,9 +298,7 @@ export default function PlacementSurfaceSetting({ id, pos = { x: 50, y: 230 } })
</div>
</div>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

25
src/components/floor-plan/modal/roofAllocation/ActualSizeSetting.jsx
View File

@ -61,17 +61,9 @@ export default function ActualSizeSetting(props) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap ssm mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.actual.size.setting')}</h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="ssm">
<WithDraggable.Header title={getMessage('modal.actual.size.setting')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="guide">
<span>{getMessage('modal.actual.size.setting.info')}</span>
</div>
@ -95,12 +87,7 @@ export default function ActualSizeSetting(props) {
<div className="eaves-keraba-td">
<div className="outline-form">
<div className="input-grid mr5">
<input
type="text"
className="input-origin block"
value={actualSize}
onChange={(e) => setActualSize(Number(e.target.value))}
/>
<input type="text" className="input-origin block" value={actualSize} onChange={(e) => setActualSize(Number(e.target.value))} />
</div>
<span className="thin">mm</span>
</div>
@ -117,9 +104,7 @@ export default function ActualSizeSetting(props) {
{getMessage('apply')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

20
src/components/floor-plan/modal/roofAllocation/ContextRoofAllocationSetting.jsx
View File

@ -47,19 +47,10 @@ export default function ContextRoofAllocationSetting(props) {
}, [])
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap lr mount`}>
<WithDraggable isShow={true} pos={pos} className="lr">
<WithDraggable.Header title={getMessage('plan.menu.estimate.roof.alloc')} onClose={() => closePopup(id)} />
{currentRoofList && (
<>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('plan.menu.estimate.roof.alloc')}</h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable.Body>
<div className="properties-guide">{getMessage('modal.roof.alloc.info')}</div>
<div className="allocation-select-wrap">
{/* <span>{getMessage('modal.roof.alloc.select.roof.material')}</span>
@ -232,11 +223,8 @@ export default function ContextRoofAllocationSetting(props) {
{getMessage('modal.roof.alloc.apply')}
</button>
</div>
</div>
</>
</WithDraggable.Body>
)}
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable>
)
}

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

@ -47,19 +47,11 @@ export default function RoofAllocationSetting(props) {
}, [])
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap lr mount`}>
<WithDraggable isShow={true} pos={pos} className="lr">
<WithDraggable.Header title={getMessage('plan.menu.estimate.roof.alloc')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
{currentRoofList && (
<>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('plan.menu.estimate.roof.alloc')}</h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="properties-guide">{getMessage('modal.roof.alloc.info')}</div>
<div className="allocation-select-wrap">
{/* <span>{getMessage('modal.roof.alloc.select.roof.material')}</span>
@ -249,11 +241,9 @@ export default function RoofAllocationSetting(props) {
{getMessage('modal.roof.alloc.apply')}
</button>
</div>
</div>
</>
)}
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/roofShape/RoofShapePassivitySetting.jsx
View File

@ -29,17 +29,9 @@ export default function RoofShapePassivitySetting({ id, pos = { x: 50, y: 230 }
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xxm`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('plan.menu.roof.cover.roof.shape.passivity.setting')}</h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="xxm">
<WithDraggable.Header title={getMessage('plan.menu.roof.cover.roof.shape.passivity.setting')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="modal-btn-wrap">
{buttons.map((button) => (
<button key={button.id} className={`btn-frame modal ${type === button.type ? 'act' : ''}`} onClick={() => setType(button.type)}>
@ -68,9 +60,7 @@ export default function RoofShapePassivitySetting({ id, pos = { x: 50, y: 230 }
{getMessage('common.setting.finish')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/roofShape/RoofShapeSetting.jsx
View File

@ -88,17 +88,9 @@ export default function RoofShapeSetting({ id, pos = { x: 50, y: 230 } }) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap lr mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.roof.shape.setting')}</h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="lr">
<WithDraggable.Header title={getMessage('modal.roof.shape.setting')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="roof-shape-menu">
{shapeMenu.map((item) => (
<button key={item.id} className={`shape-menu-box ${shapeNum === item.id ? 'act' : ''}`} onClick={() => setShapeNum(item.id)}>
@ -120,9 +112,7 @@ export default function RoofShapeSetting({ id, pos = { x: 50, y: 230 } }) {
{getMessage('common.setting.finish')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

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

@ -72,18 +72,9 @@ export default function SettingModal01(props) {
}
return (
<>
<WithDraggable isShow={true} pos={{ x: 1275, y: 180 }}>
<div className={`modal-pop-wrap sm mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.canvas.setting')}</h1>
<button className="modal-close" onClick={() => closePopup(id, true)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={{ x: 1275, y: 180 }} className="sm">
<WithDraggable.Header title={getMessage('modal.canvas.setting')} onClose={() => closePopup(id, true)} />
<WithDraggable.Body>
<div className="modal-btn-wrap">
<button className={`btn-frame modal ${buttonAct === 1 ? 'act' : ''}`} onClick={() => handleBtnClick(1)}>
{getMessage('modal.canvas.setting.display')}
@ -101,10 +92,7 @@ export default function SettingModal01(props) {
{buttonAct === 1 && <FirstOption {...firstProps} />}
{buttonAct === 2 && <SecondOption {...secondProps} />}
{buttonAct === 3 && <GridOption {...gridProps} />}
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
</>
)
}

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

@ -190,23 +190,15 @@ export default function DimensionLineSetting(props) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xxxm mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.canvas.setting.font.plan.absorption.dimension.line')} </h1>
<button
className="modal-close"
onClick={() => {
<WithDraggable isShow={true} pos={pos} className="xxxm">
<WithDraggable.Header
title={getMessage('modal.canvas.setting.font.plan.absorption.dimension.line')}
onClose={() => {
setIsShow(false)
closePopups([fontModalId, colorModalId, id])
}}
>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
/>
<WithDraggable.Body>
<div className="font-btn-wrap">
<button className="btn-frame modal" onClick={() => popupHandle('font')}>
{getMessage('modal.font.setting')}
@ -259,9 +251,7 @@ export default function DimensionLineSetting(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

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

@ -49,29 +49,21 @@ export default function PlanSizeSetting(props) {
setPlanSizeSettingMode((prev) => {
return {
...prev,
[name]: Number(value),
[name]: Number(value) / 10,
}
})
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap xsm mount`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.canvas.setting.font.plan.absorption.plan.size.setting')}</h1>
<button
className="modal-close"
onClick={() => {
<WithDraggable isShow={true} pos={pos} className="xsm">
<WithDraggable.Header
title={getMessage('modal.canvas.setting.font.plan.absorption.plan.size.setting')}
onClose={() => {
setIsShow(false)
closePopup(id, true)
}}
>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
/>
<WithDraggable.Body>
<div className="slope-wrap">
<div className="outline-form mb10">
<span style={{ width: 'auto' }}>{getMessage('common.horizon')}</span>
@ -80,7 +72,7 @@ export default function PlanSizeSetting(props) {
type="text"
className="input-origin block"
name={`originHorizon`}
value={planSizeSettingMode.originHorizon}
value={planSizeSettingMode.originHorizon * 10}
onChange={(e) => onlyNumberInputChange(e, changeInput)}
/>
</div>
@ -93,7 +85,7 @@ export default function PlanSizeSetting(props) {
type="text"
className="input-origin block"
name={`originVertical`}
value={planSizeSettingMode.originVertical}
value={planSizeSettingMode.originVertical * 10}
onChange={(e) => onlyNumberInputChange(e, changeInput)}
/>
</div>
@ -105,9 +97,7 @@ export default function PlanSizeSetting(props) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

18
src/components/floor-plan/modal/wallLineOffset/WallLineOffsetSetting.jsx
View File

@ -39,17 +39,9 @@ export default function WallLineOffsetSetting({ id, pos = { x: 50, y: 230 } }) {
}
return (
<WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap r`}>
<div className="modal-head modal-handle">
<h1 className="title">{getMessage('modal.wallline.offset.setting')}</h1>
<button className="modal-close" onClick={() => closePopup(id)}>
닫기
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<WithDraggable isShow={true} pos={pos} className="r">
<WithDraggable.Header title={getMessage('modal.wallline.offset.setting')} onClose={() => closePopup(id)} />
<WithDraggable.Body>
<div className="modal-btn-wrap">
{buttonMenu.map((item) => (
<button key={item.id} className={`btn-frame modal ${type === item.type ? 'act' : ''}`} onClick={() => setType(item.type)}>
@ -67,9 +59,7 @@ export default function WallLineOffsetSetting({ id, pos = { x: 50, y: 230 } }) {
{getMessage('modal.common.save')}
</button>
</div>
</div>
<div className="modal-foot modal-handle"></div>
</div>
</WithDraggable.Body>
</WithDraggable>
)
}

2
src/components/floor-plan/modal/wallLineOffset/type/Offset.jsx
View File

@ -23,7 +23,7 @@ export default function Offset({ length1Ref, arrow1Ref, currentWallLineRef }) {
const keyDown = (e) => {
if (currentWallLineRef.current === null) {
alert('보조선을 먼저 선택하세요')
// alert('보조선을 먼저 선택하세요')
return
}

2
src/components/main/MainContents.jsx
View File

@ -199,7 +199,7 @@ export default function MainContents({ setFaqOpen, setFaqModalNoticeNo }) {
</div>
)}
</ProductItem>
<ProductItem num={4} name={'Data Download'}>
<ProductItem num={4} name={getMessage('main.archive')}>
{fileList.length > 0 ? (
<div className="data-download-wrap">
{fileList?.map((file) => (

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

@ -140,6 +140,7 @@ export default function StuffDetail() {
headerName: getMessage('stuff.detail.planGridHeader.moduleModel'),
flex: 1,
wrapText: true,
autoHeight: true,
cellStyle: { alignItems: 'flex-start' /* 좌측정렬*/, cursor: 'pointer' },
cellRenderer: (params) => {
let origin = params.value
@ -370,6 +371,7 @@ export default function StuffDetail() {
swalFire({
text: getMessage('stuff.detail.header.notExistObjectNo'),
type: 'alert',
icon: 'error',
confirmFn: () => {
router.push('/management/stuff', { scroll: false })
},
@ -387,6 +389,7 @@ export default function StuffDetail() {
swalFire({
text: getMessage('stuff.detail.header.notExistObjectNo'),
type: 'alert',
icon: 'error',
confirmFn: () => {
router.push('/management/stuff', { scroll: false })
},

2
src/hooks/common/useCommonCode.js
View File

@ -33,6 +33,8 @@ export const useCommonCode = () => {
clCode: code.clCode,
clCodeNm: globalLocale === 'ko' ? code.clCodeNm : code.clCodeJp,
clPriority: code.clPriority,
clRefChr1: code.clRefChr1,
clRefChr2: code.clRefChr2,
}
return result
})

28
src/hooks/floorPlan/estimate/useEstimateController.js
View File

@ -129,6 +129,7 @@ export const useEstimateController = (planNo, flag) => {
delFlg: '0', //삭제 플래그 0 삭제하면 1
addFlg: true,
paDispOrder: null,
dispCableFlg: '0',
},
],
})
@ -165,11 +166,6 @@ export const useEstimateController = (planNo, flag) => {
//견적서 저장
const handleEstimateSubmit = async () => {
//todo: 추후 YJSS가 다시 나타날 경우 아래 swalFire 제거 필요
if (estimateData.estimateType === 'YJSS') {
return swalFire({ text: getMessage('estimate.detail.save.requiredEstimateType'), type: 'alert', icon: 'warning' })
}
//0. 필수체크
let flag = true
let originFileFlg = false
@ -298,6 +294,21 @@ export const useEstimateController = (planNo, flag) => {
}
}
}
} else {
if (item.salePrice === null) {
item.salePrice = '0'
} else if (isNaN(item.salePrice)) {
item.salePrice = '0'
}
if (item.unitPrice === null) {
item.unitPrice = '0'
} else if (isNaN(item.unitPrice)) {
item.unitPrice = '0'
}
//봄 컴포넌트 제품은 0으로
item.openFlg = '0'
}
}
})
@ -382,6 +393,7 @@ export const useEstimateController = (planNo, flag) => {
estimateData.estimateOption = estimateOptions
// console.log('최종아이템:::', estimateData.itemList)
if (fileList?.length > 0) {
estimateData.fileList = fileList
} else {
@ -409,7 +421,7 @@ export const useEstimateController = (planNo, flag) => {
})
} catch (e) {
setIsGlobalLoading(false)
console.log('error::::::::::::', e.response.data.message)
console.error('error::::::::::::', e.response.data.message)
}
}
@ -419,10 +431,6 @@ export const useEstimateController = (planNo, flag) => {
* T01관리자 계정 및 1차판매점에게만 제공
*/
const handleEstimateCopy = async (sendPlanNo, copyReceiveUser, saleStoreId, otherSaleStoreId, setEstimateCopyPopupOpen) => {
//todo: 추후 YJSS가 다시 나타날 경우 아래 swalFire 제거 필요
if (estimateData.estimateType === 'YJSS') {
return swalFire({ text: getMessage('estimate.detail.save.requiredEstimateType'), type: 'alert', icon: 'warning' })
}
if (saleStoreId === '') {
return swalFire({
text: getMessage('estimate.detail.productFeaturesPopup.requiredStoreId'),

136
src/hooks/module/useModuleBasicSetting.js
View File

@ -1,5 +1,6 @@
import { useState } from 'react'
import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'
import {
canvasSettingState,
canvasState,
@ -8,6 +9,7 @@ import {
isManualModuleLayoutSetupState,
isManualModuleSetupState,
} from '@/store/canvasAtom'
import { rectToPolygon, polygonToTurfPolygon, calculateVisibleModuleHeight, getDegreeByChon, toFixedWithoutRounding } from '@/util/canvas-util'
import { basicSettingState, roofDisplaySelector } from '@/store/settingAtom'
import offsetPolygon, { calculateAngle, createLinesFromPolygon } from '@/util/qpolygon-utils'
@ -436,7 +438,6 @@ export function useModuleBasicSetting(tabNum) {
if (isManualModuleLayoutSetup) {
setIsManualModuleLayoutSetup(false)
}
const moduleSetupSurfaces = canvas?.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE) //모듈설치면를 가져옴
if (isManualModuleSetup) {
@ -506,20 +507,20 @@ export function useModuleBasicSetting(tabNum) {
const points = [
{
x: Number(mousePoint.x.toFixed(1)) + Number((width / 2).toFixed(1)),
y: Number(mousePoint.y.toFixed(1)) - Number((height / 2).toFixed(1)),
x: toFixedWithoutRounding(mousePoint.x, 2) + toFixedWithoutRounding(width / 2, 2),
y: toFixedWithoutRounding(mousePoint.y, 2) - toFixedWithoutRounding(height / 2, 2),
},
{
x: Number(mousePoint.x.toFixed(1)) + Number((width / 2).toFixed(1)),
y: Number(mousePoint.y.toFixed(1)) + Number((height / 2).toFixed(1)),
x: toFixedWithoutRounding(mousePoint.x, 2) + toFixedWithoutRounding(width / 2, 2),
y: toFixedWithoutRounding(mousePoint.y, 2) + toFixedWithoutRounding(height / 2, 2),
},
{
x: Number(mousePoint.x.toFixed(1)) - Number((width / 2).toFixed(1)),
y: Number(mousePoint.y.toFixed(1)) - Number((height / 2).toFixed(1)),
x: toFixedWithoutRounding(mousePoint.x, 2) - toFixedWithoutRounding(width / 2, 2),
y: toFixedWithoutRounding(mousePoint.y, 2) - toFixedWithoutRounding(height / 2, 2),
},
{
x: Number(mousePoint.x.toFixed(1)) - Number((width / 2).toFixed(1)),
y: Number(mousePoint.y.toFixed(1)) + Number((height / 2).toFixed(1)),
x: toFixedWithoutRounding(mousePoint.x, 2) - toFixedWithoutRounding(width / 2, 2),
y: toFixedWithoutRounding(mousePoint.y, 2) + toFixedWithoutRounding(height / 2, 2),
},
]
@ -535,10 +536,10 @@ export function useModuleBasicSetting(tabNum) {
fill: 'white',
stroke: 'black',
strokeWidth: 0.3,
width: Number(width.toFixed(1)),
height: Number(height.toFixed(1)),
left: Number(mousePoint.x.toFixed(1) - Number((width / 2).toFixed(1))),
top: Number(mousePoint.y.toFixed(1) - Number((height / 2).toFixed(1))),
width: toFixedWithoutRounding(width, 2),
height: toFixedWithoutRounding(height, 2),
left: toFixedWithoutRounding(mousePoint.x, 2) - toFixedWithoutRounding(width / 2, 2),
top: toFixedWithoutRounding(mousePoint.y, 2) - toFixedWithoutRounding(height / 2, 2),
selectable: false,
lockMovementX: true,
lockMovementY: true,
@ -571,67 +572,84 @@ export function useModuleBasicSetting(tabNum) {
? moduleSetupSurfaces[i].trestleDetail.moduleIntvlVer / 10
: moduleSetupSurfaces[i].trestleDetail.moduleIntvlHor / 10
const trestleLeft = Number(moduleSetupSurfaces[i].left.toFixed(1)) - Number((moduleSetupSurfaces[i].width / 2).toFixed(1))
const trestleTop = Number(moduleSetupSurfaces[i].top.toFixed(1)) - Number((moduleSetupSurfaces[i].height / 2).toFixed(1))
const trestleRight = Number(moduleSetupSurfaces[i].left.toFixed(1)) + Number((moduleSetupSurfaces[i].width / 2).toFixed(1))
const trestleBottom = Number(moduleSetupSurfaces[i].top.toFixed(1)) + Number((moduleSetupSurfaces[i].height / 2).toFixed(1))
const trestleLeft = toFixedWithoutRounding(moduleSetupSurfaces[i].left, 2) - toFixedWithoutRounding(moduleSetupSurfaces[i].width / 2, 2)
const trestleTop = toFixedWithoutRounding(moduleSetupSurfaces[i].top, 2) - toFixedWithoutRounding(moduleSetupSurfaces[i].height / 2, 2)
const trestleRight =
toFixedWithoutRounding(moduleSetupSurfaces[i].left, 2) + toFixedWithoutRounding(moduleSetupSurfaces[i].width / 2, 2)
const trestleBottom =
toFixedWithoutRounding(moduleSetupSurfaces[i].top, 2) + toFixedWithoutRounding(moduleSetupSurfaces[i].height / 2, 2)
const bigCenterY = (trestleTop + trestleTop + moduleSetupSurfaces[i].height) / 2
// 이동하는 모듈의 경계 좌표
const smallLeft = Number(tempModule.left.toFixed(1))
const smallTop = Number(tempModule.top.toFixed(1))
const smallRight = smallLeft + Number(tempModule.width.toFixed(1))
const smallBottom = smallTop + Number(tempModule.height.toFixed(1))
const smallCenterX = smallLeft + Number((tempModule.width / 2).toFixed(1))
const smallCenterY = smallTop + Number((tempModule.height / 2).toFixed(1))
const smallLeft = toFixedWithoutRounding(tempModule.left, 2)
const smallTop = toFixedWithoutRounding(tempModule.top, 2)
const smallRight = smallLeft + toFixedWithoutRounding(tempModule.width, 2)
const smallBottom = smallTop + toFixedWithoutRounding(tempModule.height, 2)
const smallCenterX = smallLeft + toFixedWithoutRounding(tempModule.width / 2, 2)
const smallCenterY = smallTop + toFixedWithoutRounding(tempModule.height / 2, 2)
/**
* 미리 깔아놓은 셀이 있을때 셀에 흡착됨
*/
if (manualDrawModules) {
manualDrawModules.forEach((cell) => {
const holdCellLeft = cell.left
const holdCellTop = cell.top
const holdCellRight = holdCellLeft + Number(cell.width.toFixed(1))
const holdCellBottom = holdCellTop + Number(cell.height.toFixed(1))
const holdCellCenterX = holdCellLeft + Number((cell.width / 2).toFixed(1))
const holdCellCenterY = holdCellTop + Number((cell.height / 2).toFixed(1))
const holdCellLeft = toFixedWithoutRounding(cell.left, 2)
const holdCellTop = toFixedWithoutRounding(cell.top, 2)
const holdCellRight = holdCellLeft + toFixedWithoutRounding(cell.width, 2)
const holdCellBottom = holdCellTop + toFixedWithoutRounding(cell.height, 2)
const holdCellCenterX = holdCellLeft + toFixedWithoutRounding(cell.width / 2, 2)
const holdCellCenterY = holdCellTop + toFixedWithoutRounding(cell.height / 2, 2)
//가운데 -> 가운대
if (Math.abs(smallCenterX - holdCellCenterX) < snapDistance) {
tempModule.left = holdCellCenterX - toFixedWithoutRounding(width / 2, 2)
}
//왼쪽 -> 가운데
if (Math.abs(smallLeft - holdCellCenterX) < snapDistance) {
// console.log('holdCellCenterX', holdCellCenterX)
// console.log('smallLeft', smallLeft)
// console.log('모듈 센터에 스냅')
tempModule.left = holdCellCenterX + intvHor / 2
// console.log('tempModule.left', tempModule.left)
}
// 오른쪽 -> 가운데
if (Math.abs(smallRight - holdCellCenterX) < snapDistance) {
tempModule.left = holdCellCenterX - width - intvHor / 2
}
//설치된 셀에 좌측에 스냅
if (Math.abs(smallRight - holdCellLeft) < snapDistance) {
// console.log('모듈 좌측 스냅')
tempModule.left = holdCellLeft - width - intvHor
}
//설치된 셀에 우측에 스냅
if (Math.abs(smallLeft - holdCellRight) < snapDistance) {
// console.log('모듈 우측 스냅')
tempModule.left = holdCellRight + intvHor
}
//설치된 셀에 위쪽에 스냅
if (Math.abs(smallBottom - holdCellTop) < snapDistance) {
if (Math.abs(smallBottom - holdCellTop) < 10) {
tempModule.top = holdCellTop - height - intvVer
}
//설치된 셀에 밑쪽에 스냅
if (Math.abs(smallTop - holdCellBottom) < snapDistance) {
if (Math.abs(smallTop - holdCellBottom) < 10) {
tempModule.top = holdCellBottom + intvVer
}
//가운데 -> 가운데
if (Math.abs(smallCenterX - holdCellCenterX) < snapDistance) {
tempModule.left = holdCellCenterX - Number((width / 2).toFixed(1))
}
//왼쪽 -> 가운데
if (Math.abs(smallLeft - holdCellCenterX) < snapDistance) {
tempModule.left = holdCellCenterX
}
// 오른쪽 -> 가운데
if (Math.abs(smallRight - holdCellCenterX) < snapDistance) {
tempModule.left = holdCellCenterX - width
//설치된 셀에 윗쪽에 스냅
if (Math.abs(smallTop - holdCellTop) < 10) {
tempModule.top = holdCellTop
}
//세로 가운데 -> 가운데
if (Math.abs(smallCenterY - holdCellCenterY) < snapDistance) {
tempModule.top = holdCellCenterY - Number((height / 2).toFixed(1))
}
// if (Math.abs(smallCenterY - holdCellCenterY) < snapDistance) {
// tempModule.top = holdCellCenterY - toFixedWithoutRounding(height / 2, 1)
// }
// //위쪽 -> 가운데
// if (Math.abs(smallTop - holdCellCenterY) < cellSnapDistance) {
// tempModule.top = holdCellCenterY
@ -713,13 +731,19 @@ export function useModuleBasicSetting(tabNum) {
if (!inside) return
if (tempModule) {
const rectPoints = [
{ x: Number(tempModule.left.toFixed(1)), y: Number(tempModule.top.toFixed(1)) },
{ x: Number(tempModule.left.toFixed(1)) + Number(tempModule.width.toFixed(1)), y: Number(tempModule.top.toFixed(1)) },
{ x: toFixedWithoutRounding(tempModule.left, 2), y: toFixedWithoutRounding(tempModule.top, 2) },
{
x: Number(tempModule.left.toFixed(1)) + Number(tempModule.width.toFixed(1)),
y: Number(tempModule.top.toFixed(1)) + Number(tempModule.height.toFixed(1)),
x: toFixedWithoutRounding(tempModule.left, 2) + toFixedWithoutRounding(tempModule.width, 2),
y: toFixedWithoutRounding(tempModule.top, 2),
},
{
x: toFixedWithoutRounding(tempModule.left, 2) + toFixedWithoutRounding(tempModule.width, 2),
y: toFixedWithoutRounding(tempModule.top, 2) + toFixedWithoutRounding(tempModule.height, 2),
},
{
x: toFixedWithoutRounding(tempModule.left, 2),
y: toFixedWithoutRounding(tempModule.top, 2) + toFixedWithoutRounding(tempModule.height, 2),
},
{ x: Number(tempModule.left.toFixed(1)), y: Number(tempModule.top.toFixed(1)) + Number(tempModule.height.toFixed(1)) },
]
tempModule.set({ points: rectPoints })
@ -756,11 +780,13 @@ export function useModuleBasicSetting(tabNum) {
let manualModule = new QPolygon(tempModule.points, {
...moduleOptions,
moduleInfo: checkedModule[0],
left: Number(tempModule.left.toFixed(1)),
top: Number(tempModule.top.toFixed(1)),
width: Number(tempModule.width.toFixed(1)),
height: Number(tempModule.height.toFixed(1)),
left: toFixedWithoutRounding(tempModule.left, 2),
top: toFixedWithoutRounding(tempModule.top, 2),
width: toFixedWithoutRounding(tempModule.width, 2),
height: toFixedWithoutRounding(tempModule.height, 2),
toFixed: 2,
})
canvas?.add(manualModule)
manualDrawModules.push(manualModule)
setModuleStatisticsData()

75
src/hooks/module/useTrestle.js
View File

@ -619,6 +619,9 @@ export const useTrestle = () => {
//module Rack 정보를 얻기위한 데이터 가공
function moduleTransformData(arr) {
//arr의 moduleTpCd를 이용하여 정렬
arr = arr.sort((a, b) => a.moduleTpCd.localeCompare(b.moduleTpCd))
let counts = {}
arr.forEach((item) => {
@ -1649,10 +1652,29 @@ export const useTrestle = () => {
}
}
switch (direction) {
case 'south': {
startPointY -= 5
break
}
case 'east': {
startPointX -= 5
break
}
case 'west': {
startPointX -= 5
break
}
case 'north': {
startPointY -= 5
break
}
}
for (let i = 0; i < count; i++) {
const bracket = new fabric.Rect({
left: startPointX - 5,
top: startPointY - 5,
left: startPointX,
top: startPointY,
fill: 'green',
name: TRESTLE_MATERIAL.BRACKET,
parentId: module.id,
@ -1664,14 +1686,15 @@ export const useTrestle = () => {
})
canvas.add(bracket)
canvas.renderAll()
const maxIntvl = Math.max(moduleIntvlHor, moduleIntvlVer)
if (direction === 'south') {
startPointY -= height - moduleIntvlVer / 10
startPointY -= height + maxIntvl / 10
} else if (direction === 'north') {
startPointY += height + moduleIntvlVer / 10
startPointY += height + maxIntvl / 10
} else if (direction === 'east') {
startPointX -= width - moduleIntvlHor / 10
startPointX -= width + maxIntvl / 10
} else if (direction === 'west') {
startPointX += width + moduleIntvlHor / 10
startPointX += width + maxIntvl / 10
}
}
}
@ -1730,7 +1753,7 @@ export const useTrestle = () => {
const { width, height } = { ...module }
widthArr.push(width)
heightArr.push(height)
centerPoints.push({ x, y, width: Math.floor(width), height: Math.floor(height), index, moduleInfo: module.moduleInfo })
centerPoints.push({ x, y, width: Math.floor(width), height: Math.floor(height), index, moduleInfo: module.moduleInfo, module })
})
//widthArr 중복 제거 1이상 차이가 나지 않으면 같은 너비로 간주
@ -1804,7 +1827,13 @@ export const useTrestle = () => {
let rightExposedHalfTopPoints = []
centerPoints.forEach((centerPoint, index) => {
let { x, y, width, height, widthArr, heightArr } = { ...centerPoint }
let { x, y, width, height, widthArr, heightArr, module } = { ...centerPoint }
/* 디버깅용
const originFill = module.fill
module.set('fill', 'red')
canvas.renderAll()*/
// centerPoints중에 현재 centerPoint와 x값이 같고, y값이 y-height값과 같은 centerPoint가 있는지 확인
let bottomCell
let bottomLeftPoint
@ -1894,7 +1923,12 @@ export const useTrestle = () => {
break
}
/**
* 디버깅용
module.set('fill', originFill)
canvas.renderAll()
*/
if (bottomCell) {
return
}
@ -1911,13 +1945,18 @@ export const useTrestle = () => {
}
} else if (leftBottomCnt + rightBottomCnt === 0) {
exposedBottomPoints.push(centerPoint)
} else if (leftBottomCnt + rightBottomCnt === 2) {
touchDimension++
}
})
// 노출상면 및 접면 체크
centerPoints.forEach((centerPoint, index) => {
let { x, y, width, height, widthArr, heightArr } = { ...centerPoint }
let { x, y, width, height, widthArr, heightArr, module } = { ...centerPoint }
const originFill = module.fill
/* 디버깅용
module.set('fill', 'blue')
canvas.renderAll()*/
let topCell
let topLeftPoint
let topRightPoint
@ -1930,7 +1969,8 @@ export const useTrestle = () => {
height = height + vertical
heightArr.forEach((h) => {
if (topCell) return
topCell = centerPoints.find((centerPoint) => Math.abs(centerPoint.x - x) < maxX && Math.abs(centerPoint.y - (y + h)) < maxY)
topCell = centerPoints.find((centerPoint) => Math.abs(centerPoint.x - x) < maxX && Math.abs(centerPoint.y - (y - h)) < maxY)
if (leftTopCnt === 0) {
topLeftPoint = { x: x - width / 2, y: y - h }
leftTopCnt = centerPoints.filter(
@ -1949,7 +1989,7 @@ export const useTrestle = () => {
height = height + vertical
heightArr.forEach((h) => {
if (topCell) return
topCell = centerPoints.find((centerPoint) => Math.abs(centerPoint.x - x) < maxX && Math.abs(centerPoint.y - (y - h)) < maxY)
topCell = centerPoints.find((centerPoint) => Math.abs(centerPoint.x - x) < maxX && Math.abs(centerPoint.y - (y + h)) < maxY)
if (leftTopCnt === 0) {
topLeftPoint = { x: x + width / 2, y: y + h }
leftTopCnt = centerPoints.filter(
@ -1968,7 +2008,7 @@ export const useTrestle = () => {
width = width + horizontal
widthArr.forEach((w) => {
if (topCell) return
topCell = centerPoints.find((centerPoint) => Math.abs(centerPoint.x - (x + w)) < maxX && Math.abs(centerPoint.y - y) < maxY)
topCell = centerPoints.find((centerPoint) => Math.abs(centerPoint.x - (x - w)) < maxX && Math.abs(centerPoint.y - y) < maxY)
if (leftTopCnt === 0) {
topLeftPoint = { x: x - w, y: y + height / 2 }
leftTopCnt = centerPoints.filter(
@ -1988,7 +2028,7 @@ export const useTrestle = () => {
width = width + horizontal
widthArr.forEach((w) => {
if (topCell) return
topCell = centerPoints.find((centerPoint) => Math.abs(centerPoint.x - (x - w)) < maxX && Math.abs(centerPoint.y - y) < maxY)
topCell = centerPoints.find((centerPoint) => Math.abs(centerPoint.x - (x + w)) < maxX && Math.abs(centerPoint.y - y) < maxY)
if (leftTopCnt === 0) {
topLeftPoint = { x: x + w, y: y - height / 2 }
leftTopCnt = centerPoints.filter(
@ -2010,6 +2050,13 @@ export const useTrestle = () => {
return
}
/**
* 디버깅 용
module.set('fill', originFill)
canvas.renderAll()
*/
if (leftTopCnt + rightTopCnt === 2) {
touchDimension++
return

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

@ -612,6 +612,9 @@ export function useCanvasSetting(executeEffect = true) {
/** 도면크기 설정 */
setPlanSizeSettingMode({ ...planSizeSettingMode, originHorizon: res.originHorizon, originVertical: res.originVertical })
canvas.setWidth(res.originHorizon)
canvas.setHeight(res.originVertical)
canvas.renderAll()
/** 데이터 설정 */
setSettingModalFirstOptions({

7
src/hooks/roofcover/useAuxiliaryDrawing.js
View File

@ -22,6 +22,7 @@ import { useSwal } from '@/hooks/useSwal'
import { usePopup } from '@/hooks/usePopup'
import { calculateAngle, isSamePoint } from '@/util/qpolygon-utils'
import { POLYGON_TYPE } from '@/common/common'
import { useMessage } from '../useMessage'
// 보조선 작성
export function useAuxiliaryDrawing(id, isUseEffect = true) {
@ -34,6 +35,7 @@ export function useAuxiliaryDrawing(id, isUseEffect = true) {
const { swalFire } = useSwal()
const { getAdsorptionPoints } = useAdsorptionPoint()
const { closePopup } = usePopup()
const { getMessage } = useMessage()
const adsorptionRange = useRecoilValue(adsorptionRangeState)
@ -411,7 +413,7 @@ export function useAuxiliaryDrawing(id, isUseEffect = true) {
const length1Value = length1Ref.current.value
if (diagonalLength <= length1Value) {
alert('대각선 길이는 직선 길이보다 길어야 합니다.')
// alert('대각선 길이는 직선 길이보다 길어야 합니다.')
return
}
@ -832,7 +834,8 @@ export function useAuxiliaryDrawing(id, isUseEffect = true) {
}
const handleFix = () => {
if (!confirm('지붕선 완료하시겠습니까?')) {
// if (!confirm('보조선 작성을 완료하시겠습니까?')) {
if (!confirm(getMessage('want.to.complete.auxiliary.creation'))) {
return
}

4
src/hooks/roofcover/useOuterLineWall.js
View File

@ -567,7 +567,7 @@ export function useOuterLineWall(id, propertiesId) {
const length1Value = length1Ref.current.value
if (diagonalLength <= length1Value) {
alert('대각선 길이는 직선 길이보다 길어야 합니다.')
// alert('대각선 길이는 직선 길이보다 길어야 합니다.')
return
}
@ -890,7 +890,7 @@ export function useOuterLineWall(id, propertiesId) {
})
if (isAllRightAngle) {
alert('부정확한 다각형입니다.')
// alert('부정확한 다각형입니다.')
return
}

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

@ -446,12 +446,10 @@ export function useRoofAllocationSetting(id) {
* 지붕재 변경
*/
const handleChangeRoofMaterial = (value, index) => {
const selectedIndex = roofMaterials.findIndex((roof) => roof.selected)
const selectedRoofMaterial = roofMaterials.find((roof) => roof.roofMatlCd === value.id)
const newRoofList = currentRoofList.map((roof, idx) => {
if (idx === index) {
return { ...selectedRoofMaterial }
return { ...selectedRoofMaterial, selected: roof.selected }
}
return roof
})

2
src/hooks/roofcover/useWallLineOffsetSetting.js
View File

@ -192,7 +192,7 @@ export function useWallLineOffsetSetting(id) {
const handleSave = () => {
if (currentWallLineRef.current === null) {
alert('보조선을 먼저 선택하세요')
// alert('보조선을 먼저 선택하세요')
return
}
switch (type) {

4
src/hooks/surface/usePlacementShapeDrawing.js
View File

@ -564,7 +564,7 @@ export function usePlacementShapeDrawing(id) {
const length1Value = length1Ref.current.value
if (diagonalLength <= length1Value) {
alert('대각선 길이는 직선 길이보다 길어야 합니다.')
// alert('대각선 길이는 직선 길이보다 길어야 합니다.')
return
}
@ -886,7 +886,7 @@ export function usePlacementShapeDrawing(id) {
})
if (isAllRightAngle) {
alert('부정확한 다각형입니다.')
// alert('부정확한 다각형입니다.')
return
}

16
src/locales/ja.json
View File

@ -5,11 +5,11 @@
"header.menus.management": "見積書管理画面",
"header.menus.management.newStuff": "新規見積登録",
"header.menus.management.detail": "物件詳細",
"header.menus.management.stuffList": "見積状況",
"header.menus.management.stuffList": "物件検索",
"header.menus.community": "コミュニティ",
"header.menus.community.notice": "お知らせ",
"header.menus.community.faq": "FAQ",
"header.menus.community.archive": "見積書出力",
"header.menus.community.archive": "各種資料ダウンロード",
"header.logout": "ログアウト",
"header.go": "移動",
"header.online.warranty.system": "オンライン保証システム",
@ -178,7 +178,7 @@
"modal.roof.alloc.select.parallel": "筋配置",
"modal.roof.alloc.select.stairs": "千鳥配置",
"modal.roof.alloc.apply": "選択した屋根材として割り当て",
"plan.menu.estimate.docDown": "見積書出力",
"plan.menu.estimate.docDown": "各種資料ダウンロード",
"plan.menu.estimate.save": "保存",
"plan.menu.estimate.reset": "初期化",
"plan.menu.estimate.copy": "見積書のコピー",
@ -229,7 +229,7 @@
"modal.dormer.offset.info": "移動する距離と方向を入力してください。",
"modal.common.save": "保存",
"modal.common.add": "追加",
"modal.common.prev": "以前",
"modal.common.prev": "前に戻る",
"modal.common.next": "次",
"modal.canvas.setting.font.plan.edit": "フォントとサイズの変更",
"modal.canvas.setting.font.plan.edit.word": "文字フォントの変更",
@ -557,7 +557,7 @@
"board.notice.sub.title": "お知らせ一覧",
"board.faq.title": "FAQ",
"board.faq.sub.title": "FAQリスト",
"board.archive.title": "資料のダウンロード",
"board.archive.title": "各種資料ダウンロード",
"board.archive.sub.title": "見積書一覧",
"board.list.header.rownum": "番号",
"board.list.header.title": "タイトル",
@ -849,9 +849,10 @@
"main.storeName": "販売店名",
"main.objectNo": "物件番号",
"main.faq": "FAQ",
"main.archive": "各種資料ダウンロード",
"main.content.objectList.noData1": "登録された商品情報はありません。",
"main.content.objectList.noData2": "下のボタンをクリックして商品情報を登録してください。",
"main.content.objectList": "最近の更新物件一覧",
"main.content.objectList": "直近の見積書一覧",
"main.content.notice": "お知らせ",
"main.content.download1": "操作マニュアル",
"main.content.download2": "屋根の説明書",
@ -1032,5 +1033,6 @@
"canvas.infomation.text": "数字は [半角] 入力のみ可能です。",
"roof.exceed.count": "屋根材は4つまで選択可能です。",
"outerLine.property.fix": "外壁線の属性設定 を完了しますか？",
"outerLine.property.close": "外壁線の属性設定 を終了しますか？"
"outerLine.property.close": "外壁線の属性設定 を終了しますか？",
"want.to.complete.auxiliary.creation": "보補助線の作成を完了しますか?"
}

8
src/locales/ko.json
View File

@ -9,7 +9,7 @@
"header.menus.community": "커뮤니티",
"header.menus.community.notice": "공지사항",
"header.menus.community.faq": "FAQ",
"header.menus.community.archive": "문서다운로드",
"header.menus.community.archive": "각종 자료 다운로드",
"header.logout": "로그아웃",
"header.go": "이동",
"header.online.warranty.system": "온라인보증시스템",
@ -557,7 +557,7 @@
"board.notice.sub.title": "공지사항 목록",
"board.faq.title": "FAQ",
"board.faq.sub.title": "FAQ 목록",
"board.archive.title": "자료 다운로드",
"board.archive.title": "각종 자료 다운로드",
"board.archive.sub.title": "문서 목록",
"board.list.header.rownum": "번호",
"board.list.header.title": "제목",
@ -849,6 +849,7 @@
"main.storeName": "판매점명",
"main.objectNo": "물건번호",
"main.faq": "FAQ",
"main.archive": "각종 자료 다운로드",
"main.content.objectList.noData1": "등록된 물건정보가 없습니다.",
"main.content.objectList.noData2": "아래 버튼을 클릭하여 물건정보를 등록하십시오.",
"main.content.objectList": "최근 갱신 물건목록",
@ -1032,5 +1033,6 @@
"canvas.infomation.text": "숫자는 [반각] 입력만 가능합니다.",
"roof.exceed.count": "지붕재는 4개까지 선택 가능합니다.",
"outerLine.property.fix": "외벽선 속성 설정을 완료하시겠습니까?",
"outerLine.property.close": "외벽선 속성 설정을 종료하시겠습니까?"
"outerLine.property.close": "외벽선 속성 설정을 종료하시겠습니까?",
"want.to.complete.auxiliary.creation": "보조선 작성을 완료하시겠습니까?"
}

2
src/store/canvasAtom.js
View File

@ -43,7 +43,7 @@ export const fontSizeState = atom({
export const canvasSizeState = atom({
key: 'canvasSize',
default: {
vertical: 1000,
vertical: 1600,
horizontal: 1600,
},
})

1
src/styles/_canvasside.scss
View File

@ -86,6 +86,7 @@
border: 1px solid #E9E9E9;
background: #FFF;
box-shadow: 0px 6px 14px 0px rgba(0, 0, 0, 0.05);
z-index: 110000;
ul{
padding: 17px 0;
border-bottom: 1px solid #E9E9E9;

1469
src/styles/_modal.scss
View File

File diff suppressed because it is too large Load Diff

6
src/util/qpolygon-utils.js
View File

@ -320,7 +320,7 @@ export const drawGabledRoof = (roofId, canvas, textMode) => {
const wallLines = canvas?.getObjects().find((object) => object.name === POLYGON_TYPE.WALL && object.attributes.roofId === roof.id).lines
const hasNonParallelLines = roofLines.filter((line) => line.x1 !== line.x2 && line.y1 !== line.y2)
if (hasNonParallelLines.length > 0) {
alert('대각선이 존재합니다.')
// alert('대각선이 존재합니다.')
return
}
@ -648,7 +648,7 @@ export const drawShedRoof = (roofId, canvas, textMode) => {
const roof = canvas?.getObjects().find((object) => object.id === roofId)
const hasNonParallelLines = roof.lines.filter((line) => Math.abs(line.x1 - line.x2) > 1 && Math.abs(line.y1 - line.y2) > 1)
if (hasNonParallelLines.length > 0) {
alert('대각선이 존재합니다.')
// alert('대각선이 존재합니다.')
return
}
@ -739,7 +739,7 @@ export const drawRidgeRoof = (roofId, canvas, textMode) => {
//Math.abs(line.x1 - line.x2) > 1 && Math.abs(line.y1 - line.y2) > 1
const hasNonParallelLines = roof.lines.filter((line) => Big(line.x1).minus(Big(line.x2)).gt(1) && Big(line.y1).minus(Big(line.y2)).gt(1))
if (hasNonParallelLines.length > 0) {
alert('대각선이 존재합니다.')
// alert('대각선이 존재ㄴ합니다.')
return
}