This commit is contained in:
minsik 2024-10-31 14:31:49 +09:00
commit db18459347
6 changed files with 436 additions and 114 deletions

View File

@ -1,5 +1,6 @@
import { useMessage } from '@/hooks/useMessage'
import { useEffect, useState } from 'react'
import { useEvent } from '@/hooks/useEvent'
const FLOW_LINE_TYPE = {
DOWN_LEFT: 'downLeft',
@ -44,12 +45,7 @@ export default function FlowLine({ FLOW_LINE_REF }) {
<div className="eaves-keraba-td">
<div className="outline-form">
<div className="input-grid mr5" style={{ width: '100px' }}>
<input
type="text"
className="input-origin block"
readOnly={type !== FLOW_LINE_TYPE.DOWN_LEFT}
ref={FLOW_LINE_REF.DOWN_LEFT_INPUT_REF}
/>
<input type="text" className="input-origin block" readOnly={true} ref={FLOW_LINE_REF.DOWN_LEFT_INPUT_REF} />
</div>
</div>
</div>

View File

@ -1,5 +1,8 @@
import { useMessage } from '@/hooks/useMessage'
import { useEffect, useState } from 'react'
import { useEvent } from '@/hooks/useEvent'
import { canvasState } from '@/store/canvasAtom'
import { useRecoilValue } from 'recoil'
const UP_DOWN_TYPE = {
UP: 'up',
@ -9,6 +12,7 @@ const UP_DOWN_TYPE = {
export default function Updown({ UP_DOWN_REF }) {
const { getMessage } = useMessage()
const [type, setType] = useState(UP_DOWN_TYPE.UP)
const canvas = useRecoilValue(canvasState)
useEffect(() => {
if (type === UP_DOWN_TYPE.UP) {
@ -44,7 +48,7 @@ export default function Updown({ UP_DOWN_REF }) {
<div className="eaves-keraba-td">
<div className="outline-form">
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" readOnly={type !== UP_DOWN_TYPE.UP} ref={UP_DOWN_REF.UP_INPUT_REF} />
<input type="text" className="input-origin block" readOnly={true} ref={UP_DOWN_REF.UP_INPUT_REF} />
</div>
</div>
</div>

View File

@ -240,7 +240,9 @@ export default function Stuff() {
schToDt: dayjs(new Date()).format('YYYY-MM-DD'),
startRow: (pageNo - 1) * pageSize + 1,
endRow: pageNo * pageSize,
schSelSaleStoreId: '',
schSelSaleStoreId: stuffSearchParams?.schOtherSelSaleStoreId
? stuffSearchParams.schOtherSelSaleStoreId
: stuffSearchParams.schSelSaleStoreId,
schSortType: stuffSearchParams.schSortType,
}
@ -256,12 +258,12 @@ export default function Stuff() {
})
}
fetchData()
} else {
} else if (stuffSearchParams?.code === 'M') {
//
const params = {
saleStoreId: sessionState?.storeId,
schObjectNo: stuffSearchParams.schObjectNo,
schAddress: '',
schAddress: 'dfdfdfdfdf',
schObjectName: '',
schSaleStoreName: '',
schReceiveUser: '',
@ -271,25 +273,31 @@ export default function Stuff() {
schToDt: dayjs(new Date()).format('YYYY-MM-DD'),
startRow: (pageNo - 1) * pageSize + 1,
endRow: pageNo * pageSize,
schSelSaleStoreId: '',
schSelSaleStoreId: stuffSearchParams?.schOtherSelSaleStoreId
? stuffSearchParams.schOtherSelSaleStoreId
: stuffSearchParams.schSelSaleStoreId,
schSortType: 'R',
}
setStuffSearch({
...params,
})
async function fetchData() {
const apiUrl = `/api/object/list?${queryStringFormatter(params)}`
await get({
url: apiUrl,
}).then((res) => {
if (!isEmptyArray(res)) {
setGridProps({ ...gridProps, gridData: res, count: res[0].totCnt })
setTotalCount(res[0].totCnt)
}
})
}
fetchData()
// async function fetchData() {
// const apiUrl = `/api/object/list?${queryStringFormatter(params)}`
// await get({
// url: apiUrl,
// }).then((res) => {
// if (!isEmptyArray(res)) {
// setGridProps({ ...gridProps, gridData: res, count: res[0].totCnt })
// setTotalCount(res[0].totCnt)
// }
// })
// }
// fetchData()
}
}
}, [pageNo, sessionState])
// }, [pageNo, sessionState, stuffSearchParams])
}, [pageNo, stuffSearchParams])
useEffect(() => {
if (stuffSearchParams?.code === 'E') {
@ -298,6 +306,7 @@ export default function Stuff() {
stuffSearchParams.schSortType = defaultSortType
setPageNo(1)
//
async function fetchData() {
const apiUrl = `/api/object/list?saleStoreId=${sessionState?.storeId}&${queryStringFormatter(stuffSearchParams)}`
@ -320,10 +329,13 @@ export default function Stuff() {
let startRow = (1 - 1) * e.target.value + 1
stuffSearchParams.startRow = startRow
stuffSearchParams.endRow = 1 * e.target.value
stuffSearchParams.schSelSaleStoreId = stuffSearchParams?.schOtherSelSaleStoreId
? stuffSearchParams.schOtherSelSaleStoreId
: stuffSearchParams.schSelSaleStoreId
setPageSize(e.target.value)
setStuffSearch({
...stuffSearch,
code: 'S',
...stuffSearchParams,
// code: 'P',
startRow: startRow,
endRow: 1 * e.target.value,
})
@ -348,6 +360,9 @@ export default function Stuff() {
stuffSearchParams.endRow = 1 * pageSize
stuffSearchParams.schSortType = e.target.value
stuffSearchParams.schSelSaleStoreId = stuffSearchParams?.schOtherSelSaleStoreId
? stuffSearchParams.schOtherSelSaleStoreId
: stuffSearchParams.schSelSaleStoreId
setDefaultSortType(e.target.value)
setStuffSearch({
...stuffSearch,
@ -358,7 +373,6 @@ export default function Stuff() {
})
setPageNo(1)
const apiUrl = `/api/object/list?saleStoreId=${sessionState?.storeId}&${queryStringFormatter(stuffSearchParams)}`
get({ url: apiUrl }).then((res) => {
if (!isEmptyArray(res)) {
@ -382,7 +396,9 @@ export default function Stuff() {
//
const handleChangePage = (page) => {
stuffSearchParams.code = 'S'
stuffSearchParams.schSelSaleStoreId = stuffSearchParams?.schOtherSelSaleStoreId
? stuffSearchParams.schOtherSelSaleStoreId
: stuffSearchParams.schSelSaleStoreId
setStuffSearch({
...stuffSearch,
code: 'S',
@ -405,10 +421,7 @@ export default function Stuff() {
{getMessage('stuff.search.grid.all')}
<span>{convertNumberToPriceDecimal(totalCount)}</span>
</li>
<li>
{/* {getMessage('stuff.search.grid.selected')} */}
{/* <span className="red">{convertNumberToPriceDecimal(selectedRowDataCount)}</span> */}
</li>
<li></li>
</ul>
</div>
<div className="left-unit-box">

View File

@ -15,12 +15,14 @@ import SingleDatePicker from '../common/datepicker/SingleDatePicker'
import { sessionStore } from '@/store/commonAtom'
import { useMessage } from '@/hooks/useMessage'
import { isObjectNotEmpty } from '@/util/common-utils'
import { searchState } from '@/store/boardAtom'
export default function StuffSearchCondition() {
const sessionState = useRecoilValue(sessionStore)
const [appMessageState, setAppMessageState] = useRecoilState(appMessageStore)
const globalLocaleState = useRecoilValue(globalLocaleStore)
const { getMessage } = useMessage()
const ref = useRef()
const ref2 = useRef()
const { get } = useAxios(globalLocaleState)
const objectNoRef = useRef(null)
@ -59,6 +61,10 @@ export default function StuffSearchCondition() {
const [schSelSaleStoreList, setSchSelSaleStoreList] = useState([]) // SELECT
const [favoriteStoreList, setFavoriteStoreList] = useState([]) //
const [showSaleStoreList, setShowSaleStoreList] = useState([]) //
const [otherSaleStoreList, setOtherSaleStoreList] = useState([]) //1
const [otherSaleStoreId, setOtherSaleStoreId] = useState('')
//
const onSubmit = () => {
let diff = dayjs(endDate).diff(startDate, 'day')
@ -73,7 +79,7 @@ export default function StuffSearchCondition() {
schAddress: address ? address : stuffSearch?.schAddress,
schObjectName: objectName ? objectName : stuffSearch?.schObjectName,
schDispCompanyName: dispCompanyName ? dispCompanyName : stuffSearch?.schDispCompanyName,
schSelSaleStoreId: stuffSearch?.schSelSaleStoreId ? stuffSearch.schSelSaleStoreId : schSelSaleStoreId,
schSelSaleStoreId: stuffSearch?.schOtherSelSaleStoreId ? stuffSearch.schOtherSelSaleStoreId : stuffSearch.schSelSaleStoreId,
schReceiveUser: receiveUser ? receiveUser : stuffSearch?.schReceiveUser,
schDateType: stuffSearch?.schDateType ? stuffSearch.schDateType : dateType,
schFromDt: dayjs(startDate).format('YYYY-MM-DD'),
@ -90,7 +96,7 @@ export default function StuffSearchCondition() {
schAddress: address ? address : '',
schObjectName: objectName ? objectName : '',
schDispCompanyName: dispCompanyName ? dispCompanyName : '',
schSelSaleStoreId: schSelSaleStoreId ? schSelSaleStoreId : '',
schSelSaleStoreId: stuffSearch?.schOtherSelSaleStoreId ? stuffSearch.schOtherSelSaleStoreId : stuffSearch.schSelSaleStoreId,
schReceiveUser: receiveUser ? receiveUser : '',
schDateType: dateType,
schFromDt: dayjs(startDate).format('YYYY-MM-DD'),
@ -105,6 +111,7 @@ export default function StuffSearchCondition() {
//
const resetRecoil = () => {
//T01
objectNoRef.current.value = ''
saleStoreNameRef.current.value = ''
addressRef.current.value = ''
@ -121,49 +128,144 @@ export default function StuffSearchCondition() {
setDateType('U')
setStartDate(dayjs(new Date()).add(-1, 'year').format('YYYY-MM-DD'))
setEndDate(dayjs(new Date()).format('YYYY-MM-DD'))
setSchSelSaleStoreId('')
handleClear() //
resetStuffRecoil()
if (sessionState?.storeId === 'T01') {
setSchSelSaleStoreId('')
handleClear1() //
resetStuffRecoil()
setStuffSearch({
...stuffSearch,
code: 'C',
schSelSaleStoreId: '',
schOtherSelSaleStoreId: '',
})
} else {
if (otherSaleStoreList.length > 1) {
handleClear2()
setOtherSaleStoreId('')
stuffSearch.schObjectNo = ''
stuffSearch.schDateType = 'U'
} else {
stuffSearch.schObjectNo = ''
stuffSearch.schDateType = 'U'
}
}
}
useEffect(() => {
if (isObjectNotEmpty(sessionState)) {
// storeId T01 1
// storeId T01 storeLvl 1
let url
if (sessionState?.storeId === 'T01') {
// url = `/api/object/saleStore/${sessionState?.storeId}/list?userId=an1`
url = `/api/object/saleStore/${sessionState?.storeId}/list?userId=${sessionState?.userId}`
//T01
url = `/api/object/saleStore/${sessionState?.storeId}/firstList?userId=${sessionState?.userId}`
} else {
url = `/api/object/saleStore/${sessionState?.storeId}/list`
if (sessionState.storeLvl === '1') {
//T01 1
url = `/api/object/saleStore/${sessionState?.storeId}/list?firstFlg=1&userId=${sessionState?.userId}`
} else {
url = `/api/object/saleStore/${sessionState?.storeId}/list?firstFlg=1&userId=${sessionState?.userId}`
}
}
get({ url: url }).then((res) => {
if (!isEmptyArray(res)) {
res.map((row) => {
row.value = row.saleStoreId
row.label = row.saleStoreName
})
const allList = res
const favList = res.filter((row) => row.priority !== 'B')
setSchSelSaleStoreList(allList)
setFavoriteStoreList(favList)
setShowSaleStoreList(favList)
let allList
let favList
let otherList
if (sessionState?.storeId === 'T01') {
allList = res
allList.sort((a, b) => (a.saleStoreId !== 'T01') - (b.saleStoreId !== 'T01') || a.saleStoreId - b.saleStoreId)
favList = res.filter((row) => row.saleStoreId === 'T01' || row.priority !== 'B')
setSchSelSaleStoreList(allList)
setFavoriteStoreList(favList)
setShowSaleStoreList(favList)
setSchSelSaleStoreId(sessionState?.storeId)
setStuffSearch({
...stuffSearch,
code: 'S',
schSelSaleStoreId: sessionState?.storeId,
})
//T01 2
url = `/api/object/saleStore/${sessionState?.storeId}/list?firstFlg=0&userId=${sessionState?.userId}`
get({ url: url }).then((res) => {
if (!isEmptyArray(res)) {
res.map((row) => {
row.value = row.saleStoreId
row.label = row.saleStoreName
})
otherList = res
setOtherSaleStoreList(otherList)
} else {
setOtherSaleStoreList([])
}
})
} else {
if (sessionState?.storeLvl === '1') {
allList = res
favList = res.filter((row) => row.priority !== 'B')
otherList = res.filter((row) => row.firstAgentYn === 'N')
setSchSelSaleStoreList(allList)
setFavoriteStoreList(allList)
setShowSaleStoreList(allList)
setSchSelSaleStoreId(allList[0].saleStoreId)
setOtherSaleStoreList(otherList)
setStuffSearch({
...stuffSearch,
code: 'S',
schSelSaleStoreId: allList[0].saleStoreId,
})
} else {
//201X112 2
//2 34 202X217
setSchSelSaleStoreList(res)
setFavoriteStoreList(res)
setShowSaleStoreList(res)
setSchSelSaleStoreId(res[0].saleStoreId)
otherList = res.filter((row) => row.firstAgentYn === 'N')
setOtherSaleStoreList(otherList)
// 2
setOtherSaleStoreId(sessionState?.storeId)
setStuffSearch({
...stuffSearch,
code: 'S',
schSelSaleStoreId: otherList[0].saleStoreId,
})
}
}
}
})
}
}, [sessionState])
// ..
const handleClear = () => {
// 1 ..
const handleClear1 = () => {
if (ref.current) {
ref.current.clearValue()
}
}
const handleClear2 = () => {
if (ref2.current) {
ref2.current.clearValue()
}
}
//
const onInputChange = (key) => {
if (key !== '') {
setShowSaleStoreList(schSelSaleStoreList)
setOtherSaleStoreList([])
} else {
setShowSaleStoreList(favoriteStoreList)
}
@ -172,15 +274,47 @@ export default function StuffSearchCondition() {
//
const onSelectionChange = (key) => {
if (isObjectNotEmpty(key)) {
setOtherSaleStoreId('')
setSchSelSaleStoreId(key.saleStoreId)
setStuffSearch({
...stuffSearch,
code: 'S',
schSelSaleStoreId: key.saleStoreId,
stuffSearch.schSelSaleStoreId = key.saleStoreId
//T01 1
// 1 saleStoreId 2 API
let url = `/api/object/saleStore/${key.saleStoreId}/list?firstFlg=0&userId=${sessionState?.userId}`
let otherList
get({ url: url }).then((res) => {
if (!isEmptyArray(res)) {
res.map((row) => {
row.value = row.saleStoreId
row.label = row.saleStoreName
})
otherList = res
setOtherSaleStoreList(otherList)
} else {
setOtherSaleStoreList([])
}
})
} else {
//X
setSchSelSaleStoreId('')
setStuffSearch({ ...stuffSearch, schSelSaleStoreId: '' })
stuffSearch.schSelSaleStoreId = ''
//2
setOtherSaleStoreList([])
}
}
//2
const onSelectionChange2 = (key) => {
if (isObjectNotEmpty(key)) {
setOtherSaleStoreId(key.saleStoreId)
stuffSearch.schOtherSelSaleStoreId = key.saleStoreId
} else {
//X 1
setOtherSaleStoreId('')
setSchSelSaleStoreId(schSelSaleStoreId)
stuffSearch.schOtherSelSaleStoreId = ''
stuffSearch.schSelSaleStoreId = schSelSaleStoreId
}
}
@ -235,6 +369,8 @@ export default function StuffSearchCondition() {
<col />
<col style={{ width: '160px' }} />
<col />
<col style={{ width: '160px' }} />
<col />
</colgroup>
<tbody>
<tr>
@ -283,6 +419,21 @@ export default function StuffSearchCondition() {
/>
</div>
</td>
<th>{getMessage('stuff.search.schDispCompanyName')}</th>
<td>
<div className="input-wrap">
<input
type="text"
ref={dispCompanyNameRef}
className="input-light"
defaultValue={stuffSearch.code === 'E' ? stuffSearch?.schDispCompanyName : dispCompanyName}
onChange={(e) => {
setDispCompanyName(dispCompanyNameRef.current.value)
}}
onKeyUp={handleByOnKeyUp}
/>
</div>
</td>
</tr>
<tr>
<th>{getMessage('stuff.search.schObjectName')}</th>
@ -300,63 +451,6 @@ export default function StuffSearchCondition() {
/>
</div>
</td>
<th>{getMessage('stuff.search.schDispCompanyName')}</th>
<td>
<div className="input-wrap">
<input
type="text"
ref={dispCompanyNameRef}
className="input-light"
defaultValue={stuffSearch.code === 'E' ? stuffSearch?.schDispCompanyName : dispCompanyName}
onChange={(e) => {
setDispCompanyName(dispCompanyNameRef.current.value)
}}
onKeyUp={handleByOnKeyUp}
/>
</div>
</td>
<th>{getMessage('stuff.search.schSelSaleStoreId')}</th>
<td>
<div className="select-wrap">
{schSelSaleStoreList?.length > 0 && (
<Select
id="long-value-select1"
instanceId="long-value-select1"
className="react-select-custom"
classNamePrefix="custom"
placeholder="Select"
ref={ref}
// options={schSelSaleStoreList}
options={showSaleStoreList}
onInputChange={onInputChange}
onChange={onSelectionChange}
getOptionLabel={(x) => x.saleStoreName}
getOptionValue={(x) => x.saleStoreId}
// value={schSelSaleStoreList.filter(function (option) {
value={showSaleStoreList.filter(function (option) {
// console.log(' value::::', option)
if (stuffSearch?.code === 'S' && schSelSaleStoreId === '') {
return false
} else if (stuffSearch?.code === 'S' && schSelSaleStoreId !== '') {
return option.saleStoreId === schSelSaleStoreId
} else if (stuffSearch?.code === 'E' && schSelSaleStoreId !== '') {
return option.saleStoreId === schSelSaleStoreId
} else {
if (stuffSearch?.schSelSaleStoreId !== '') {
return option.saleStoreId === stuffSearch.schSelSaleStoreId
} else {
return false
}
}
})}
isDisabled={sessionState?.storeLvl === '1' ? false : true}
isClearable={true}
/>
)}
</div>
</td>
</tr>
<tr>
<th>{getMessage('stuff.search.schReceiveUser')}</th>
<td>
<div className="input-wrap">
@ -372,8 +466,130 @@ export default function StuffSearchCondition() {
/>
</div>
</td>
<th>{getMessage('stuff.search.period')}</th>
<th>{getMessage('stuff.search.schSelSaleStoreId')}</th>
<td colSpan={3}>
<div className="form-flex-wrap">
<div className="select-wrap mr5" style={{ flex: 1 }}>
{sessionState?.storeId === 'T01' && (
<Select
id="long-value-select1"
instanceId="long-value-select1"
className="react-select-custom"
classNamePrefix="custom"
placeholder="Select"
ref={ref}
options={showSaleStoreList}
onInputChange={onInputChange}
onChange={onSelectionChange}
getOptionLabel={(x) => x.saleStoreName}
getOptionValue={(x) => x.saleStoreId}
value={showSaleStoreList.filter(function (option) {
if (stuffSearch?.code === 'S' && schSelSaleStoreId === '') {
return false
} else if (stuffSearch?.code === 'S' && schSelSaleStoreId !== '') {
return option.saleStoreId === schSelSaleStoreId
} else if (stuffSearch?.code === 'E' && schSelSaleStoreId !== '') {
return option.saleStoreId === schSelSaleStoreId
} else {
if (stuffSearch?.schSelSaleStoreId !== '') {
return option.saleStoreId === stuffSearch.schSelSaleStoreId
} else {
return false
}
}
})}
isDisabled={sessionState?.storeLvl !== '1' ? true : sessionState?.storeId !== 'T01' ? true : false}
isClearable={true}
/>
)}
{sessionState?.storeId !== 'T01' && sessionState?.storeLvl === '1' && (
<Select
id="long-value-select1"
instanceId="long-value-select1"
className="react-select-custom"
classNamePrefix="custom"
placeholder="Select"
ref={ref}
options={showSaleStoreList[0]}
onChange={onSelectionChange}
getOptionLabel={(x) => x.saleStoreName}
getOptionValue={(x) => x.saleStoreId}
value={showSaleStoreList.filter(function (option) {
if (stuffSearch?.code === 'S' && schSelSaleStoreId === '') {
return false
} else if (stuffSearch?.code === 'S' && schSelSaleStoreId !== '') {
return option.saleStoreId === schSelSaleStoreId
} else if (stuffSearch?.code === 'E' && schSelSaleStoreId !== '') {
return option.saleStoreId === schSelSaleStoreId
} else {
if (stuffSearch?.schSelSaleStoreId !== '') {
return option.saleStoreId === stuffSearch.schSelSaleStoreId
} else {
return false
}
}
})}
isDisabled={sessionState?.storeLvl !== '1' ? true : sessionState?.storeId !== 'T01' ? true : false}
isClearable={false}
/>
)}
{sessionState?.storeId !== 'T01' && sessionState?.storeLvl !== '1' && (
<Select
id="long-value-select1"
instanceId="long-value-select1"
className="react-select-custom"
classNamePrefix="custom"
placeholder="Select"
ref={ref}
options={showSaleStoreList[0]}
onChange={onSelectionChange}
getOptionLabel={(x) => x.saleStoreName}
getOptionValue={(x) => x.saleStoreId}
value={showSaleStoreList.filter(function (option) {
if (stuffSearch?.code === 'S' && schSelSaleStoreId === '') {
return false
} else if (stuffSearch?.code === 'S' && schSelSaleStoreId !== '') {
return option.saleStoreId === schSelSaleStoreId
} else if (stuffSearch?.code === 'E' && schSelSaleStoreId !== '') {
return option.saleStoreId === schSelSaleStoreId
} else {
if (stuffSearch?.schSelSaleStoreId !== '') {
return option.saleStoreId === stuffSearch.schSelSaleStoreId
} else {
return false
}
}
})}
isDisabled={true}
isClearable={false}
/>
)}
</div>
<div className="select-wrap" style={{ flex: 1 }}>
<Select
id="long-value-select2"
instanceId="long-value-select2"
className="react-select-custom"
classNamePrefix="custom"
placeholder="Select"
ref={ref2}
options={otherSaleStoreList}
onChange={onSelectionChange2}
getOptionLabel={(x) => x.saleStoreName}
getOptionValue={(x) => x.saleStoreId}
isDisabled={otherSaleStoreList.length > 1 ? false : true}
isClearable={true}
value={otherSaleStoreList.filter(function (option) {
return option.saleStoreId === otherSaleStoreId
})}
/>
</div>
</div>
</td>
</tr>
<tr>
<th>{getMessage('stuff.search.period')}</th>
<td colSpan={7}>
<div className="form-flex-wrap">
<div className="radio-wrap mr10">
<div className="d-check-radio light mr10">

View File

@ -2,7 +2,8 @@ import { useRecoilValue } from 'recoil'
import { canvasState } from '@/store/canvasAtom'
import { usePopup } from '@/hooks/usePopup'
import { useMessage } from '@/hooks/useMessage'
import { useRef, useState } from 'react'
import { useEffect, useRef, useState } from 'react'
import { useEvent } from '@/hooks/useEvent'
//동선이동 형 올림 내림
export function useMovementSetting(id) {
@ -11,6 +12,7 @@ export function useMovementSetting(id) {
UP_DOWN: 'updown', //형 올림내림
}
const canvas = useRecoilValue(canvasState)
const { initEvent, addCanvasMouseEventListener } = useEvent()
const { closePopup } = usePopup()
const { getMessage } = useMessage()
const buttonType = [
@ -18,6 +20,7 @@ export function useMovementSetting(id) {
{ id: 2, name: getMessage('modal.movement.flow.line.updown'), type: TYPE.UP_DOWN },
]
const [type, setType] = useState(TYPE.FLOW_LINE)
const typeRef = useRef(type)
const FLOW_LINE_REF = {
DOWN_LEFT_INPUT_REF: useRef(null),
@ -33,7 +36,96 @@ export function useMovementSetting(id) {
DOWN_RADIO_REF: useRef(null),
}
const handleSave = () => {}
useEffect(() => {
typeRef.current = type
}, [type])
useEffect(() => {
const wallLines = canvas.getObjects().filter((obj) => obj.name === 'wallLine') // 기존 wallLine의 visible false
wallLines.forEach((line) => {
line.set({ visible: false })
})
const outerLines = canvas.getObjects().filter((obj) => obj.name === 'outerLine') // 기존 outerLine의 selectable true
outerLines.forEach((line) => {
line.bringToFront()
line.set({ selectable: true })
})
canvas.renderAll()
addCanvasMouseEventListener('mouse:move', mouseMoveEvent)
return () => {
initEvent()
const wallLines = canvas.getObjects().filter((obj) => obj.name === 'wallLine')
wallLines.forEach((line) => {
line.set({ visible: true })
})
canvas.renderAll()
}
}, [])
const mouseMoveEvent = (e) => {
if (typeRef.current === TYPE.FLOW_LINE) {
flowLineEvent(e)
} else {
updownEvent(e)
}
}
const flowLineEvent = (e) => {
console.log('flow')
}
const updownEvent = (e) => {
const target = canvas.getActiveObject()
if (!target) {
return
}
const direction = target.direction
const { top: targetTop, left: targetLeft } = target
const currentX = canvas.getPointer(e.e).x
const currentY = Math.floor(canvas.getPointer(e.e).y)
if (direction === 'left' || direction === 'right') {
if (targetTop > currentY) {
UP_DOWN_REF.DOWN_RADIO_REF.current.checked = true
UP_DOWN_REF.UP_INPUT_REF.current.value = ''
UP_DOWN_REF.DOWN_INPUT_REF.current.value = Math.floor((Number(Math.abs(targetTop - currentY)) / 10000).toFixed(5) * 100000)
} else {
UP_DOWN_REF.UP_RADIO_REF.current.checked = true
UP_DOWN_REF.DOWN_INPUT_REF.current.value = ''
UP_DOWN_REF.UP_INPUT_REF.current.value = Math.floor((Number(Math.abs(targetTop - currentY)) / 10000).toFixed(5) * 100000)
}
} else {
if (targetLeft > currentX) {
UP_DOWN_REF.DOWN_RADIO_REF.current.checked = true
UP_DOWN_REF.UP_INPUT_REF.current.value = ''
UP_DOWN_REF.DOWN_INPUT_REF.current.value = Math.floor((Number(Math.abs(targetLeft - currentX)) / 10000).toFixed(5) * 100000)
} else {
UP_DOWN_REF.UP_RADIO_REF.current.checked = true
UP_DOWN_REF.DOWN_INPUT_REF.current.value = ''
UP_DOWN_REF.UP_INPUT_REF.current.value = Math.floor((Number(Math.abs(targetLeft - currentX)) / 10000).toFixed(5) * 100000)
}
}
canvas?.renderAll()
}
const getOnlyDecimal = function (_number, _length) {
let result
result = _number % 1
result = Number(result.toFixed(_length))
return result * 10
}
const handleSave = () => {
closePopup(id)
}
return {
TYPE,

View File

@ -14,7 +14,8 @@ export const stuffSearchState = atom({
schFromDt: dayjs(new Date()).add(-1, 'year').format('YYYY-MM-DD'), //시작일
schToDt: dayjs(new Date()).format('YYYY-MM-DD'), //종료일
code: 'S',
schSelSaleStoreId: '', //판매대리점 선택
schSelSaleStoreId: '', //1차판매대리점 선택
schOtherSelSaleStoreId: '', //1차 이외 판매대리점 선택
startRow: 1,
endRow: 100,
schSortType: 'R', //정렬조건 (R:최근등록일 U:최근수정일)