Merge branch 'dev' of https://git.hanasys.jp/qcast3/onsitesurvey into feature/inquiry

This commit is contained in:
Dayoung 2025-06-05 18:07:24 +09:00
commit f7abbdc973
10 changed files with 82 additions and 268 deletions

9
package-lock.json generated
View File

@ -14,7 +14,6 @@
"@tanstack/react-query-devtools": "^5.71.0", "@tanstack/react-query-devtools": "^5.71.0",
"@types/nodemailer": "^6.4.17", "@types/nodemailer": "^6.4.17",
"axios": "^1.8.4", "axios": "^1.8.4",
"crypto-js": "^4.2.0",
"env-cmd": "^10.1.0", "env-cmd": "^10.1.0",
"iron-session": "^8.0.4", "iron-session": "^8.0.4",
"lucide": "^0.503.0", "lucide": "^0.503.0",
@ -33,7 +32,6 @@
}, },
"devDependencies": { "devDependencies": {
"@tailwindcss/postcss": "^4", "@tailwindcss/postcss": "^4",
"@types/crypto-js": "^4.2.2",
"@types/mysql": "^2.15.27", "@types/mysql": "^2.15.27",
"@types/node": "^20", "@types/node": "^20",
"@types/react": "^19", "@types/react": "^19",
@ -2142,13 +2140,6 @@
"integrity": "sha512-7qSgZbincDDDFyRweCIEvZULFAw5iz/DeunhvuxpL31nfntX3P4Yd4HkHBRg9H8CdqY1e5WFN1PZIz/REL9MVQ==", "integrity": "sha512-7qSgZbincDDDFyRweCIEvZULFAw5iz/DeunhvuxpL31nfntX3P4Yd4HkHBRg9H8CdqY1e5WFN1PZIz/REL9MVQ==",
"license": "MIT" "license": "MIT"
}, },
"node_modules/@types/crypto-js": {
"version": "4.2.2",
"resolved": "https://registry.npmjs.org/@types/crypto-js/-/crypto-js-4.2.2.tgz",
"integrity": "sha512-sDOLlVbHhXpAUAL0YHDUUwDZf3iN4Bwi4W6a0W0b+QcAezUbRtH4FVb+9J4h+XFPW7l/gQ9F8qC7P+Ec4k8QVQ==",
"dev": true,
"license": "MIT"
},
"node_modules/@types/mysql": { "node_modules/@types/mysql": {
"version": "2.15.27", "version": "2.15.27",
"resolved": "https://registry.npmjs.org/@types/mysql/-/mysql-2.15.27.tgz", "resolved": "https://registry.npmjs.org/@types/mysql/-/mysql-2.15.27.tgz",

View File

@ -21,7 +21,6 @@
"@tanstack/react-query-devtools": "^5.71.0", "@tanstack/react-query-devtools": "^5.71.0",
"@types/nodemailer": "^6.4.17", "@types/nodemailer": "^6.4.17",
"axios": "^1.8.4", "axios": "^1.8.4",
"crypto-js": "^4.2.0",
"env-cmd": "^10.1.0", "env-cmd": "^10.1.0",
"iron-session": "^8.0.4", "iron-session": "^8.0.4",
"lucide": "^0.503.0", "lucide": "^0.503.0",
@ -40,7 +39,6 @@
}, },
"devDependencies": { "devDependencies": {
"@tailwindcss/postcss": "^4", "@tailwindcss/postcss": "^4",
"@types/crypto-js": "^4.2.2",
"@types/mysql": "^2.15.27", "@types/mysql": "^2.15.27",
"@types/node": "^20", "@types/node": "^20",
"@types/react": "^19", "@types/react": "^19",

View File

@ -1,9 +0,0 @@
import SuitableDownloadPdf from '@/components/pdf/SuitableDownloadPdf'
export default function page() {
return (
<>
<SuitableDownloadPdf />
</>
)
}

View File

@ -1,132 +0,0 @@
'use client'
import { useEffect, useRef, useState } from 'react'
import generatePDF, { Margin, Options, Resolution, usePDF } from 'react-to-pdf'
import { useSuitable } from '@/hooks/useSuitable'
import { useSuitableStore } from '@/store/useSuitableStore'
import { SUITABLE_HEAD_CODE, type Suitable, type SuitableDetail } from '@/types/Suitable'
export default function SuitableDownloadPdf() {
const [fileName, setFileName] = useState<string[]>([])
const [createTime, setCreateTime] = useState('')
const targetRef = useRef<HTMLDivElement>(null)
const { toCodeName, toSuitableDetail, selectedSuitables, isSelectedSuitablesLoading } = useSuitable()
const { selectedCategory, suitableCommCode, selectedItemsSearching, setSelectedItemsSearching } = useSuitableStore()
const handleDownPdf = () => {
const options: Options = {
filename: `${fileName.join('_')}.pdf`,
method: 'open' as const,
resolution: Resolution.HIGH,
page: {
margin: Margin.SMALL,
format: 'A4',
orientation: 'landscape' as const,
},
canvas: {
mimeType: 'image/png' as const,
qualityRatio: 1,
},
overrides: {
pdf: {
compress: true,
},
canvas: {
useCORS: true,
},
},
}
generatePDF(targetRef, options)
// generatePDF(targetRef, { filename: 'page.pdf' })
}
const formatDateString = () => {
const now = new Date()
const year = now.getFullYear()
const month = now.getMonth() + 1
const day = now.getDate()
const hours = now.getHours()
const minutes = now.getMinutes()
return `${year}${month}${day}${hours}:${minutes.toString().padStart(2, '0')}`
}
useEffect(() => {
setCreateTime(formatDateString())
setFileName([
`(${suitableCommCode.get(SUITABLE_HEAD_CODE.ROOF_MATL_GRP_CD)?.find((category) => category.code === selectedCategory)?.codeJp})`,
'屋根材適合表',
])
if (!selectedItemsSearching) {
setSelectedItemsSearching(true)
}
}, [])
if (!selectedCategory) return <div> .</div>
if (isSelectedSuitablesLoading) return <div>Loading...</div>
return (
<>
{/* <button onClick={() => handleDownPdf()}>PDFダウンロード</button> */}
<div className="pdf-table-wrap" ref={targetRef}>
<div className="pdf-intro-page">
<div className="pdf-intro-tit-wrap">
<div className="pdf-intro-tit mb20"></div>
<div className="pdf-intro-tit mb20">{fileName.join(' ')}</div>
<div className="pdf-intro-date">{createTime}</div>
</div>
<div className="pdf-intro-cont-wrap">
<p>使</p>
<p></p>
<p></p>
<p></p>
</div>
<div className="pdf-intro-foot-date">{createTime}</div>
</div>
<div className="pdf-table-content">
<div className="pdf-table-grid-wrap">
{selectedSuitables?.map((item: Suitable) => (
<div className="pdf-table-card" key={item.id}>
<div className="pdf-table-tit-wrap">
<span>{item.productName}</span>
<span>{toCodeName(SUITABLE_HEAD_CODE.MANU_FT_CD, item.manuFtCd)}</span>
<span>{toCodeName(SUITABLE_HEAD_CODE.ROOF_MT_CD, item.roofMtCd)}</span>
</div>
<div className="pdf-roof-table">
<table>
<colgroup>
<col width={'18%'} />
<col width={'23%'} />
<col width={'18%'} />
<col />
</colgroup>
<thead>
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
{toSuitableDetail(item.detail).map((subItem: SuitableDetail) => (
<tr key={subItem.id}>
<td>{toCodeName(SUITABLE_HEAD_CODE.ROOF_SH_CD, item.roofShCd)}</td>
<td>{toCodeName(SUITABLE_HEAD_CODE.TRESTLE_MFPC_CD, subItem.trestleMfpcCd)}</td>
<td>{subItem.trestleManufacturerProductName}</td>
<td>{subItem.memo}</td>
</tr>
))}
</tbody>
</table>
</div>
</div>
))}
</div>
<div className="pdf-intro-foot-date">{createTime}</div>
</div>
</div>
</>
)
}

View File

@ -5,16 +5,14 @@ import { useCallback, useEffect, useState } from 'react'
import SuitableDetailPopupButton from './SuitableDetailPopupButton' import SuitableDetailPopupButton from './SuitableDetailPopupButton'
import { useSuitable } from '@/hooks/useSuitable' import { useSuitable } from '@/hooks/useSuitable'
import { usePopupController } from '@/store/popupController' import { usePopupController } from '@/store/popupController'
import { useSuitableStore } from '@/store/useSuitableStore'
import { useSpinnerStore } from '@/store/spinnerStore'
import { SUITABLE_HEAD_CODE, type Suitable, type SuitableDetail } from '@/types/Suitable' import { SUITABLE_HEAD_CODE, type Suitable, type SuitableDetail } from '@/types/Suitable'
export default function SuitableDetailPopup() { export default function SuitableDetailPopup() {
const popupController = usePopupController() const popupController = usePopupController()
const { toCodeName, toSuitableDetail, suitableCheckIcon, suitableCheckMemo, selectedSuitables, isSelectedSuitablesLoading } = useSuitable() const { toCodeName, toSuitableDetail, suitableCheckIcon, suitableCheckMemo, getSelectedSuitables } = useSuitable()
const { setSelectedItemsSearching } = useSuitableStore()
const [openItems, setOpenItems] = useState<Set<number>>(new Set()) const [openItems, setOpenItems] = useState<Set<number>>(new Set())
const [selectedSuitables, setSelectedSuitables] = useState<Suitable[]>([])
/* 아이템 열기/닫기 */ /* 아이템 열기/닫기 */
const toggleItemOpen = useCallback((itemId: number) => { const toggleItemOpen = useCallback((itemId: number) => {
@ -25,13 +23,10 @@ export default function SuitableDetailPopup() {
}) })
}, []) }, [])
/* 데이터 로딩 상태 처리 */
useEffect(() => { useEffect(() => {
useSpinnerStore.getState().setIsShow(isSelectedSuitablesLoading) getSelectedSuitables().then((res) => {
}, [isSelectedSuitablesLoading]) setSelectedSuitables(res)
})
useEffect(() => {
setSelectedItemsSearching(true)
}, []) }, [])
return ( return (

View File

@ -19,21 +19,23 @@ export default function SuitableDetailPopupButton() {
} }
return ( return (
<div className="btn-flex-wrap com"> <div className="float-btn-wrap">
<div className="btn-bx"> <div className="btn-flex-wrap com">
<button className="btn-frame n-blue icon" onClick={handleClosePopup}> <div className="btn-bx">
<i className="btn-arr"></i> <button className="btn-frame n-blue icon" onClick={handleClosePopup}>
</button> <i className="btn-arr"></i>
</div> </button>
<div className="btn-bx"> </div>
<button className="btn-frame red icon" onClick={downloadSuitablePdf}> <div className="btn-bx">
<i className="btn-arr"></i> <button className="btn-frame red icon" onClick={downloadSuitablePdf}>
</button> <i className="btn-arr"></i>
</div> </button>
<div className="btn-bx"> </div>
<button className="btn-frame n-blue icon" onClick={() => handleRedirectPage('/inquiry/regist')}> <div className="btn-bx">
11<i className="btn-arr"></i> <button className="btn-frame n-blue icon" onClick={() => handleRedirectPage('/inquiry/regist')}>
</button> 11<i className="btn-arr"></i>
</button>
</div>
</div> </div>
</div> </div>
) )

View File

@ -21,7 +21,7 @@ export default function SuitableList() {
isLoading, isLoading,
suitableCheckIcon, suitableCheckIcon,
} = useSuitable() } = useSuitable()
const { selectedItems, addSelectedItem, removeSelectedItem, setSelectedItemsSearching } = useSuitableStore() const { selectedItems, addSelectedItem, removeSelectedItem } = useSuitableStore()
const [openItems, setOpenItems] = useState<Set<number>>(new Set()) const [openItems, setOpenItems] = useState<Set<number>>(new Set())
const observerTarget = useRef<HTMLDivElement>(null) const observerTarget = useRef<HTMLDivElement>(null)
@ -49,7 +49,6 @@ export default function SuitableList() {
/* 아이템 클릭 */ /* 아이템 클릭 */
const handleItemClick = useCallback( const handleItemClick = useCallback(
(mainId: number, detailId?: number, detailIds?: Set<number>): void => { (mainId: number, detailId?: number, detailIds?: Set<number>): void => {
setSelectedItemsSearching(false)
isItemSelected(mainId, detailId) ? removeSelectedItem(mainId, detailId) : addSelectedItem(mainId, detailId, detailIds) isItemSelected(mainId, detailId) ? removeSelectedItem(mainId, detailId) : addSelectedItem(mainId, detailId, detailIds)
}, },
[isItemSelected, addSelectedItem, removeSelectedItem], [isItemSelected, addSelectedItem, removeSelectedItem],

View File

@ -7,11 +7,12 @@ import type { CommCode } from '@/types/CommCode'
import { SUITABLE_HEAD_CODE } from '@/types/Suitable' import { SUITABLE_HEAD_CODE } from '@/types/Suitable'
export default function SuitableSearch() { export default function SuitableSearch() {
const [searchValue, setSearchValue] = useState('') const [searchValue, setSearchValue] = useState<string>('')
const { getSuitableCommCode, clearSuitableStore } = useSuitable() const { getSuitableCommCode, clearSuitableStore } = useSuitable()
const { suitableCommCode, selectedCategory, setSelectedCategory, setSearchKeyword } = useSuitableStore() const { suitableCommCode, searchCategory, setSearchCategory, setSearchKeyword } = useSuitableStore()
/* 키워드 입력 글자 제한 */
const handleInputChange = (value: string) => { const handleInputChange = (value: string) => {
if (Array.from(value).length > 30) { if (Array.from(value).length > 30) {
alert('検索ワードは最大30文字まで入力できます。') alert('検索ワードは最大30文字まで入力できます。')
@ -21,6 +22,7 @@ export default function SuitableSearch() {
setSearchValue(value) setSearchValue(value)
} }
/* 키워드 검색 */
const handleInputSearch = async () => { const handleInputSearch = async () => {
if (!searchValue.trim()) { if (!searchValue.trim()) {
alert('屋根材の製品名を入力してください。') alert('屋根材の製品名を入力してください。')
@ -29,6 +31,7 @@ export default function SuitableSearch() {
setSearchKeyword(searchValue) setSearchKeyword(searchValue)
} }
/* 키워드 초기화 */
const handleInputClear = () => { const handleInputClear = () => {
setSearchValue('') setSearchValue('')
clearSuitableStore({ items: true, keyword: true }) clearSuitableStore({ items: true, keyword: true })
@ -42,7 +45,7 @@ export default function SuitableSearch() {
return ( return (
<> <>
<div className="sale-form-bx"> <div className="sale-form-bx">
<select className="select-form" name="" id="" value={selectedCategory || ''} onChange={(e) => setSelectedCategory(e.target.value)}> <select className="select-form" name="" id="" value={searchCategory || ''} onChange={(e) => setSearchCategory(e.target.value)}>
<option value="">.</option> <option value="">.</option>
{suitableCommCode.get(SUITABLE_HEAD_CODE.ROOF_MATL_GRP_CD)?.map((category: CommCode, index: number) => ( {suitableCommCode.get(SUITABLE_HEAD_CODE.ROOF_MATL_GRP_CD)?.map((category: CommCode, index: number) => (
<option key={index} value={category.code}> <option key={index} value={category.code}>

View File

@ -1,5 +1,4 @@
import { useInfiniteQuery, useQuery } from '@tanstack/react-query' import { useInfiniteQuery } from '@tanstack/react-query'
import { SHA256 } from 'crypto-js'
import { transformObjectKeys } from '@/libs/axios' import { transformObjectKeys } from '@/libs/axios'
import { useSuitableStore } from '@/store/useSuitableStore' import { useSuitableStore } from '@/store/useSuitableStore'
import { useAxios } from './useAxios' import { useAxios } from './useAxios'
@ -13,13 +12,12 @@ export function useSuitable() {
itemPerPage, itemPerPage,
suitableCommCode, suitableCommCode,
setSuitableCommCode, setSuitableCommCode,
selectedCategory, searchCategory,
clearSelectedCategory, clearSearchCategory,
searchKeyword, searchKeyword,
clearSearchKeyword, clearSearchKeyword,
selectedItems, selectedItems,
clearSelectedItems, clearSelectedItems,
selectedItemsSearching,
} = useSuitableStore() } = useSuitableStore()
const getSuitables = async ({ const getSuitables = async ({
@ -50,7 +48,7 @@ export function useSuitable() {
const getSuitableIds = async (): Promise<SuitableIds[]> => { const getSuitableIds = async (): Promise<SuitableIds[]> => {
try { try {
const params: Record<string, string> = {} const params: Record<string, string> = {}
if (selectedCategory) params.category = selectedCategory if (searchCategory) params.category = searchCategory
if (searchKeyword) params.keyword = searchKeyword if (searchKeyword) params.keyword = searchKeyword
const response = await axiosInstance(null).get<SuitableIds[]>('/api/suitable/pick', { params }) const response = await axiosInstance(null).get<SuitableIds[]>('/api/suitable/pick', { params })
return response.data return response.data
@ -118,13 +116,13 @@ export function useSuitable() {
// isError, // isError,
// error, // error,
} = useInfiniteQuery<Suitable[]>({ } = useInfiniteQuery<Suitable[]>({
queryKey: ['suitables', 'list', selectedCategory, searchKeyword], queryKey: ['suitables', 'list', searchCategory, searchKeyword],
queryFn: async (context) => { queryFn: async (context) => {
const pageParam = context.pageParam as number const pageParam = context.pageParam as number
if (pageParam === 1) clearSuitableStore({ items: true }) if (pageParam === 1) clearSuitableStore({ items: true })
return await getSuitables({ return await getSuitables({
pageNumber: pageParam, pageNumber: pageParam,
...(selectedCategory && { category: selectedCategory }), ...(searchCategory && { category: searchCategory }),
...(searchKeyword && { keyword: searchKeyword }), ...(searchKeyword && { keyword: searchKeyword }),
}) })
}, },
@ -134,48 +132,12 @@ export function useSuitable() {
initialPageParam: 1, initialPageParam: 1,
staleTime: 1000 * 60 * 10, staleTime: 1000 * 60 * 10,
gcTime: 1000 * 60 * 10, gcTime: 1000 * 60 * 10,
enabled: selectedCategory !== '' || searchKeyword !== '', enabled: searchCategory !== '' || searchKeyword !== '',
})
const serializeSelectedItems = (): { ids: string; detailIds: string } => {
const ids: string[] = []
const detailIds: string[] = []
for (const [key, value] of selectedItems) {
ids.push(String(key))
for (const id of value) detailIds.push(String(id))
}
return { ids: ids.join(','), detailIds: detailIds.length > 0 ? detailIds.join(',') : '' }
}
const getSelectedItemsHash = (): string => {
const entries = Array.from(selectedItems.entries())
.map(([key, value]) => `${key}:${Array.from(value).sort().join(',')}`)
.sort()
.join('|')
return SHA256(entries).toString()
}
const {
data: selectedSuitables,
isLoading: isSelectedSuitablesLoading,
// refetch: refetchSelectedSuitables,
} = useQuery<Suitable[]>({
queryKey: ['suitables', 'selectedItems', getSelectedItemsHash(), selectedItemsSearching],
queryFn: async () => {
const { ids, detailIds } = serializeSelectedItems()
return await getSuitableDetails(ids, detailIds)
},
staleTime: Infinity,
gcTime: Infinity,
enabled: selectedItemsSearching,
refetchOnMount: false,
refetchOnWindowFocus: false,
refetchOnReconnect: false,
}) })
const clearSuitableStore = ({ items = false, category = false, keyword = false }: { items?: boolean; category?: boolean; keyword?: boolean }) => { const clearSuitableStore = ({ items = false, category = false, keyword = false }: { items?: boolean; category?: boolean; keyword?: boolean }) => {
if (items) clearSelectedItems() if (items) clearSelectedItems()
if (category) clearSelectedCategory() if (category) clearSearchCategory()
if (keyword) clearSearchKeyword() if (keyword) clearSearchKeyword()
} }
@ -198,11 +160,26 @@ export function useSuitable() {
return `${value}で設置可` return `${value}で設置可`
} }
const serializeSelectedItems = (): { ids: string; detailIds: string } => {
const ids: string[] = []
const detailIds: string[] = []
for (const [key, value] of selectedItems) {
ids.push(String(key))
for (const id of value) detailIds.push(String(id))
}
return { ids: ids.join(','), detailIds: detailIds.length > 0 ? detailIds.join(',') : '' }
}
const getSelectedSuitables = async (): Promise<Suitable[]> => {
const { ids, detailIds } = serializeSelectedItems()
return await getSuitableDetails(ids, detailIds)
}
const downloadSuitablePdf = async (): Promise<void> => { const downloadSuitablePdf = async (): Promise<void> => {
try { try {
const { ids, detailIds } = serializeSelectedItems() const { ids, detailIds } = serializeSelectedItems()
const fileTitle = `(${ const fileTitle = `(${
suitableCommCode.get(SUITABLE_HEAD_CODE.ROOF_MATL_GRP_CD)?.find((category) => category.code === selectedCategory)?.codeJp suitableCommCode.get(SUITABLE_HEAD_CODE.ROOF_MATL_GRP_CD)?.find((category) => category.code === searchCategory)?.codeJp
}) ` }) `
const form = document.createElement('form') const form = document.createElement('form')
@ -240,7 +217,6 @@ export function useSuitable() {
return { return {
getSuitables, getSuitables,
getSuitableIds, getSuitableIds,
getSuitableDetails,
getSuitableCommCode, getSuitableCommCode,
toCodeName, toCodeName,
toSuitableDetail, toSuitableDetail,
@ -250,8 +226,7 @@ export function useSuitable() {
hasNextPage, hasNextPage,
isFetchingNextPage, isFetchingNextPage,
isLoading, isLoading,
selectedSuitables, getSelectedSuitables,
isSelectedSuitablesLoading,
clearSuitableStore, clearSuitableStore,
suitableCheckIcon, suitableCheckIcon,
suitableCheckMemo, suitableCheckMemo,

View File

@ -11,43 +11,38 @@ interface SuitableState {
/* 공통코드 설정 */ /* 공통코드 설정 */
setSuitableCommCode: (headCode: string, commCode: CommCode[]) => void setSuitableCommCode: (headCode: string, commCode: CommCode[]) => void
/* 선택된 카테고리 */ /* 검색 카테고리 */
selectedCategory: string searchCategory: string
/* 선택된 카테고리 설정 */ /* 검색 카테고리 설정 */
setSelectedCategory: (category: string) => void setSearchCategory: (category: string) => void
/* 선택된 카테고리 초기화 */ /* 검색 카테고리 초기화 */
clearSelectedCategory: () => void clearSearchCategory: () => void
/* 검색 */ /* 검색 키워드 */
searchKeyword: string searchKeyword: string
/* 검색 설정 */ /* 검색 키워드 설정 */
setSearchKeyword: (value: string) => void setSearchKeyword: (value: string) => void
/* 검색 초기화 */ /* 검색 키워드 초기화 */
clearSearchKeyword: () => void clearSearchKeyword: () => void
/* 선택된 아이템 리스트 */ /* 선택된 아이템 리스트 */
selectedItems: Map<number, Set<number>> selectedItems: Map<number, Set<number>>
/* 선택 아이템 추가 */ /* 선택 아이템 추가 */
addSelectedItem: (mainId: number, detailId?: number, detailIds?: Set<number>) => void addSelectedItem: (mainId: number, detailId?: number, detailIds?: Set<number>) => void
/* 아이템 전체 추가 */ /* 선택 아이템 전체 추가 */
addAllSelectedItem: (suitableIds: SuitableIds[]) => void addAllSelectedItem: (suitableIds: SuitableIds[]) => void
/* 선택 아이템 제거 */ /* 선택 아이템 제거 */
removeSelectedItem: (mainId: number, detailId?: number) => void removeSelectedItem: (mainId: number, detailId?: number) => void
/* 선택 아이템 모두 제거 */ /* 선택 아이템 모두 제거 */
clearSelectedItems: () => void clearSelectedItems: () => void
/* 선택된 아이템 검색 상태 */
selectedItemsSearching: boolean
/* 선택된 아이템 검색 상태 설정 */
setSelectedItemsSearching: (value: boolean) => void
} }
export const useSuitableStore = create<SuitableState>((set) => ({ export const useSuitableStore = create<SuitableState>((set) => ({
itemPerPage: 100 as number, itemPerPage: 100 as number,
suitableCommCode: new Map() as Map<string, CommCode[]>, suitableCommCode: new Map() as Map<string, CommCode[]>,
selectedCategory: '' as string, searchCategory: '' as string,
searchKeyword: '' as string, searchKeyword: '' as string,
selectedItems: new Map() as Map<number, Set<number>>, selectedItems: new Map() as Map<number, Set<number>>,
selectedItemsSearching: false as boolean,
/* 공통코드 설정 */ /* 공통코드 설정 */
setSuitableCommCode: (headCode: string, commCode: CommCode[]) => setSuitableCommCode: (headCode: string, commCode: CommCode[]) =>
@ -55,20 +50,20 @@ export const useSuitableStore = create<SuitableState>((set) => ({
suitableCommCode: new Map(state.suitableCommCode).set(headCode, commCode), suitableCommCode: new Map(state.suitableCommCode).set(headCode, commCode),
})), })),
/* 선택된 카테고리 설정 */ /* 검색 카테고리 설정 */
setSelectedCategory: (category: string) => set({ selectedCategory: category }), setSearchCategory: (category: string) => set({ searchCategory: category }),
/* 선택된 카테고리 초기화 */ /* 검색 카테고리 초기화 */
clearSelectedCategory: () => set({ selectedCategory: '' }), clearSearchCategory: () => set({ searchCategory: '' }),
/* 검색 설정 */ /* 검색 키워드 설정 */
setSearchKeyword: (value: string) => set({ searchKeyword: value }), setSearchKeyword: (value: string) => set({ searchKeyword: value }),
/* 검색 초기화 */ /* 검색 키워드 초기화 */
clearSearchKeyword: () => set({ searchKeyword: '' }), clearSearchKeyword: () => set({ searchKeyword: '' }),
/* 선택 아이템 추가 */ /* 선택 아이템 추가 */
addSelectedItem: (mainId: number, detailId?: number, detailIds?: Set<number>) => { addSelectedItem: (mainId: number, detailId?: number, detailIds?: Set<number>) => {
if (detailId) { if (detailId) {
// 디테일(하위) 아이템 추가 /* 디테일(하위) 아이템 추가 */
set((state) => { set((state) => {
const detailSet = state.selectedItems.get(mainId) || new Set() const detailSet = state.selectedItems.get(mainId) || new Set()
detailSet.add(detailId) detailSet.add(detailId)
@ -76,7 +71,7 @@ export const useSuitableStore = create<SuitableState>((set) => ({
return { selectedItems: state.selectedItems } return { selectedItems: state.selectedItems }
}) })
} else { } else {
// 메인(상위) 아이템 추가 /* 메인(상위) 아이템 추가 */
set((state) => { set((state) => {
state.selectedItems.set(mainId, detailIds || new Set()) state.selectedItems.set(mainId, detailIds || new Set())
return { selectedItems: state.selectedItems } return { selectedItems: state.selectedItems }
@ -84,7 +79,7 @@ export const useSuitableStore = create<SuitableState>((set) => ({
} }
}, },
/* 아이템 전체 추가 */ /* 선택 아이템 전체 추가 */
addAllSelectedItem: (suitableIds: SuitableIds[]) => { addAllSelectedItem: (suitableIds: SuitableIds[]) => {
set(() => { set(() => {
const newSelectedItems = new Map() const newSelectedItems = new Map()
@ -95,31 +90,28 @@ export const useSuitableStore = create<SuitableState>((set) => ({
}) })
}, },
/* 선택 아이템 제거 */ /* 선택 아이템 제거 */
removeSelectedItem: (mainId: number, detailId?: number) => { removeSelectedItem: (mainId: number, detailId?: number) => {
set((state) => { set((state) => {
const newSelectedItems = new Map(state.selectedItems) const newSelectedItems = new Map(state.selectedItems)
if (!detailId) { if (!detailId) {
// 메인(상위) 아이템 제거 /* 메인(상위) 아이템 제거 */
newSelectedItems.delete(mainId) newSelectedItems.delete(mainId)
return { selectedItems: newSelectedItems } return { selectedItems: newSelectedItems }
} }
// 디테일(하위) 아이템 제거 /* 디테일(하위) 아이템 제거 */
const detailSet = state.selectedItems.get(mainId) || new Set() const detailSet = state.selectedItems.get(mainId) || new Set()
detailSet.delete(detailId) detailSet.delete(detailId)
// 디테일(하위)하위 아이템이 모두 제거되면 메인 아이템도 제거 /* 디테일(하위)하위 아이템이 모두 제거되면 메인 아이템도 제거 */
detailSet.size === 0 ? newSelectedItems.delete(mainId) : newSelectedItems.set(mainId, detailSet) detailSet.size === 0 ? newSelectedItems.delete(mainId) : newSelectedItems.set(mainId, detailSet)
return { selectedItems: newSelectedItems } return { selectedItems: newSelectedItems }
}) })
}, },
/* 선택 아이템 모두 제거 */ /* 선택 아이템 모두 제거 */
clearSelectedItems: () => set({ selectedItems: new Map() as Map<number, Set<number>> }), clearSelectedItems: () => set({ selectedItems: new Map() as Map<number, Set<number>> }),
/* 선택된 아이템 검색 상태 설정 */
setSelectedItemsSearching: (value: boolean) => set({ selectedItemsSearching: value }),
})) }))