Merge commit '27499977d733831ec4a3c714c9a618008834bd7d' into iipbs/wr/form_fuction
This commit is contained in:
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user