Merge commit '27499977d733831ec4a3c714c9a618008834bd7d' into iipbs/wr/form_fuction

This commit is contained in:
leedj312
2025-03-28 18:03:03 +09:00
4 changed files with 113 additions and 30 deletions
@@ -0,0 +1,53 @@
import { Button, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "@common/components";
import React from "react";
type ModalType = {
bodyClass: string;
butNm: string;
title: string;
body: React.ReactNode;
open?: boolean;
onOpenChange?: (open: boolean) => void;
}
export function UiModal({ bodyClass, butNm, title, body, open, onOpenChange }: ModalType) {
const dialogProps = open !== undefined && onOpenChange !== undefined
? { open, onOpenChange }
: {};
return (
<>
{!open && (
<Dialog>
<DialogTrigger asChild>
<Button className="mr-4 rounded-lg">{butNm}</Button>
</DialogTrigger>
<DialogContent className={bodyClass}>
<DialogHeader>
<DialogTitle>{title}</DialogTitle>
<DialogDescription>
</DialogDescription>
</DialogHeader>
{body}
<DialogFooter className="sm:justify-start">
</DialogFooter>
</DialogContent>
</Dialog>
)}
{open && (
<Dialog {...dialogProps}>
<DialogContent className={bodyClass}>
<DialogHeader>
<DialogTitle>{title}</DialogTitle>
<DialogDescription>
</DialogDescription>
</DialogHeader>
{body}
<DialogFooter className="sm:justify-start">
</DialogFooter>
</DialogContent>
</Dialog>
)}
</>
);
}
@@ -1,33 +1,50 @@
import { Button, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "@common/components";
import { Button, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTrigger } from "@common/components";
type ModalType={
bodyClass:string
butNm:string
title:string
body:React.ReactNode
type ModalType = {
bodyClass: string;
butNm: string;
title: string | undefined;
body: React.ReactNode;
open?: boolean;
onOpenChange?: (open: boolean) => void;
}
export function UiModal({bodyClass,butNm,title ,body}:ModalType ) {
export function UiModal({ bodyClass, butNm, title, body, open, onOpenChange }: ModalType) {
const dialogProps = open !== undefined && onOpenChange !== undefined && title !== undefined
? { open, onOpenChange, title }
: {};
return (
<>
<Dialog >
<DialogTrigger asChild>
<Button className="mr-4 rounded-lg">{butNm}</Button>
</DialogTrigger>
<DialogContent className={bodyClass}>
<DialogHeader>
<DialogTitle>{title}</DialogTitle>
<DialogDescription>
</DialogDescription>
</DialogHeader>
{body}
<DialogFooter className="sm:justify-start">
</DialogFooter>
</DialogContent>
</Dialog>
{!open && (
<Dialog>
<DialogTrigger asChild>
<Button className="mr-4 rounded-lg">{butNm}</Button>
</DialogTrigger>
<DialogContent className={bodyClass}>
<DialogHeader>
<DialogDescription>
</DialogDescription>
</DialogHeader>
{body}
<DialogFooter className="sm:justify-start">
</DialogFooter>
</DialogContent>
</Dialog>
)}
{open && (
<Dialog {...dialogProps}>
<DialogContent className={bodyClass}>
<DialogHeader>
<DialogDescription>
</DialogDescription>
</DialogHeader>
{body}
<DialogFooter className="sm:justify-start">
</DialogFooter>
</DialogContent>
</Dialog>
)}
</>
);
}
@@ -3,13 +3,26 @@ import React from "react";
const SearchInput = React.forwardRef<HTMLInputElement, {className:string, label:string, textValue:string, setText:(val:string)=>void}>(({className, label, textValue, setText}, ref) => {
const changeText=(e:React.ChangeEvent<HTMLInputElement>)=>{
if(e?.target?.value) setText(e.target.value)
}
if(e?.target?.value){
setText(e.target.value)
}
}
const keyUp=(e:any)=>{
if(e.keyCode===8 && e.target.value.length==1){
setText('')
}
}
return (
<div className={className+" flex items-center"} >
{label && <Label className="w-20 text-base text-gray-600">{label}</Label>}
<Input className="flex-1 ml-8 w-3/4 h-10 border rounded" value={textValue} onChange={changeText}></Input>
<Input className="flex-1 ml-8 w-3/4 h-10 border rounded" value={textValue} onChange={changeText} onKeyUp={keyUp}></Input>
</div>
)
});
@@ -36,7 +36,7 @@ export function UiTable({ tableData, headlist, pageSize, total, children, headNa
<TableBody className='text-center'>
{tableData?.map((el: { [key: string]: string | number | boolean }, index) => (
<TableRow key={index + "row"} >
{headlist.map((head) => (
{headlist?.map((head) => (
<TableCell className="cursor-pointer" onClick={()=>cellClick && cellClick(index)} key={head.id + index}>{el[head.id]}</TableCell>
))}
</TableRow>