Merge commit '42b6dfc616c308e474a354de305ed6bb6dc89e80' into iipbs/wr/form_fuction

This commit is contained in:
leedj312
2025-04-16 11:08:32 +09:00
3 changed files with 53 additions and 20 deletions
@@ -6,22 +6,40 @@ type ModalType = {
body: React.ReactNode;
open?: boolean;
onOpenChange?: (open: boolean) => void;
noHeaderYn?: 'N' | 'Y';
noFooterYn?: 'N' | 'Y';
headerTitle?: string;
footerContent?: React.ReactNode;
}
export function UiModal({ bodyClass, body, open, onOpenChange }: ModalType) {
export function UiModal({
bodyClass,
body,
open,
onOpenChange,
noHeaderYn = 'N',
noFooterYn = 'N',
headerTitle,
footerContent
}: ModalType) {
return (
<>
<Dialog open={open} onOpenChange={onOpenChange}>
<DialogContent className={bodyClass}>
<DialogHeader>
<DialogDescription>
</DialogDescription>
</DialogHeader>
{(open && body)}
<DialogFooter className="sm:justify-start">
</DialogFooter>
{noHeaderYn === 'N' && (
<DialogHeader>
<DialogDescription>
{headerTitle}
</DialogDescription>
</DialogHeader>
)}
{(open && body)}
{noFooterYn === 'N' && (
<DialogFooter className="sm:justify-start">
{footerContent}
</DialogFooter>
)}
</DialogContent>
</Dialog>
</>
@@ -12,29 +12,36 @@ type UiTableProps = {
cellClick : ((index:number|undefined, headId:string)=>void )| undefined;
onPageChange: (page: number) => void;
className?: string;
resetPageNo?: boolean;
}
type UiHeadProps = {
id: string;
title: string;
align?: string;
}
export function UiTable({ tableData, headlist, pageSize, total, children, headName, cellClick, onPageChange, className = '' }: UiTableProps) {
export function UiTable({ tableData, headlist, pageSize, total, children, headName, cellClick, onPageChange, className = '', resetPageNo = false }: UiTableProps) {
const [cur, setCur] = useState<number>(1);
const [idx, setIdx] = useState<number>(-1);
useEffect(() => {
if (resetPageNo) {
setCur(1);
onPageChange(1);
}
}, [onPageChange, resetPageNo]);
const handlePageChange = (page: number) => {
setCur(page);
onPageChange(page);
}
const handleCellClick = (index: number,headId:string )=> {
if (cellClick) {
cellClick(index,headId);
setIdx(index);
}
};
return (
@@ -43,8 +50,8 @@ export function UiTable({ tableData, headlist, pageSize, total, children, headNa
<h3 className="text-2xl font-medium text-label">{headName}</h3>
</div> : <></>}
<div className={`card !m-[1.2rem] !p-0r ${className}`}>
<Table>
<TableHeader>
<Table variant="secondary">
<TableHeader >
{children ? <>{children}</> : <TableRow>
{headlist?.map((head) => (
<TableHead key={head.id}>{head.title}</TableHead>
@@ -52,11 +59,19 @@ export function UiTable({ tableData, headlist, pageSize, total, children, headNa
</TableRow>}
</TableHeader>
<TableBody className='text-center'>
{tableData?.map((el: { [key: string]: any}, index) => (
<TableRow key={index + "row"} >
{tableData?.map((el: { [key: string]: string | number | boolean | object}, index) => (
<TableRow key={index + "row"}>
{headlist?.map((head) => (
// <TableCell className={cellClick&&idx==index?"bg-black/10 cursor-pointer":cellClick?"cursor-pointer":""} onClick={()=>handleCellClick(index)} key={head.id + index}>{el[head.id]}</TableCell>
<TableCell className={cellClick&&idx==index?"opacity-40 cursor-pointer":cellClick?"cursor-pointer":""} onClick={(e)=>handleCellClick(index,head.id)} key={head.id + index}>{el[head.id]}</TableCell>
<TableCell
className={`${head.align === 'right' ? 'text-right' : 'text-center'} ${
cellClick && idx === index ? '!font-[1000] cursor-pointer' :
cellClick ? 'cursor-pointer' : ''
}`}
onClick={() => handleCellClick(index, head.id)}
key={head.id + index}
>
{String(el[head.id] ?? '')}
</TableCell>
))}
</TableRow>
))}
@@ -29,7 +29,7 @@ const TableHeader = React.forwardRef<
HTMLTableSectionElement,
React.HTMLAttributes<HTMLTableSectionElement>
>(({ className, ...props }, ref) => (
<thead ref={ref} className={cn("[&_tr]:border-b", className)} {...props} />
<thead ref={ref} className={cn("sticky top-0 bg-secondary [&_tr]:border-b", className)} {...props} />
));
TableHeader.displayName = "TableHeader";