56 lines
1.4 KiB
TypeScript
56 lines
1.4 KiB
TypeScript
"use client";
|
|
|
|
import {
|
|
cn,
|
|
Select,
|
|
SelectContent,
|
|
SelectItem,
|
|
SelectTrigger,
|
|
SelectValue,
|
|
} from "@common/components";
|
|
|
|
import { useCodeList, useCodeListByUseYn } from "../api/queries";
|
|
|
|
interface CodeSelectProps extends React.ComponentPropsWithoutRef<typeof Select> {
|
|
upCd: string;
|
|
useYn?: string;
|
|
placeholder?: string;
|
|
className?: string;
|
|
/** 레이블(label htmlFor) 연결용 트리거 id */
|
|
id?: string;
|
|
title?: string;
|
|
}
|
|
|
|
function CodeSelect({
|
|
upCd,
|
|
useYn,
|
|
placeholder = "선택",
|
|
className,
|
|
id,
|
|
title,
|
|
...props
|
|
}: CodeSelectProps) {
|
|
const listQuery = useCodeList(useYn ? undefined : upCd);
|
|
const listByUseYnQuery = useCodeListByUseYn(useYn ? upCd : undefined, useYn ?? "");
|
|
|
|
const codes = useYn ? listByUseYnQuery.data : listQuery.data;
|
|
const isLoading = useYn ? listByUseYnQuery.isPending : listQuery.isPending;
|
|
|
|
return (
|
|
<Select {...props} disabled={props.disabled || isLoading}>
|
|
<SelectTrigger id={id} title={title} className={cn("w-[12rem]", className)}>
|
|
<SelectValue placeholder={placeholder} />
|
|
</SelectTrigger>
|
|
<SelectContent>
|
|
{codes?.map((item) => (
|
|
<SelectItem key={item.lwpoCd} value={item.lwpoCd}>
|
|
{item.lwpoCdNm}
|
|
</SelectItem>
|
|
))}
|
|
</SelectContent>
|
|
</Select>
|
|
);
|
|
}
|
|
|
|
export { CodeSelect };
|