Merge branch 'iipbs/common/main' into iipbs/wr/form_fuction
This commit is contained in:
@@ -0,0 +1,33 @@
|
||||
import { Button, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "@common/components";
|
||||
|
||||
|
||||
type ModalType={
|
||||
bodyClass:string
|
||||
butNm:string
|
||||
title:string
|
||||
body:React.ReactNode
|
||||
}
|
||||
export function UiModal({bodyClass,butNm,title ,body}:ModalType ) {
|
||||
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>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -14,4 +14,6 @@ export * from "./title";
|
||||
export * from "./search_form_left";
|
||||
export * from "./search_form_right";
|
||||
export * from "./table_div";
|
||||
export * from "./tab";
|
||||
export * from "./list_div";
|
||||
export * from "./tab";
|
||||
export * from "./alert_dialog_ui"
|
||||
@@ -0,0 +1,11 @@
|
||||
import React from 'react'
|
||||
|
||||
function ListDiv(props: {children: React.ReactNode}) {
|
||||
return (
|
||||
<div className="card card-border">
|
||||
{props.children}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default ListDiv
|
||||
@@ -1,6 +1,6 @@
|
||||
import React from 'react'
|
||||
|
||||
export default function MainContentDiv(props: {children: React.ReactNode}) {
|
||||
export default function MainDiv(props: {children: React.ReactNode}) {
|
||||
return (
|
||||
<div className="min-h-screen bg-gray-50 p-8">
|
||||
{props.children}
|
||||
@@ -8,4 +8,4 @@ export default function MainContentDiv(props: {children: React.ReactNode}) {
|
||||
)
|
||||
}
|
||||
|
||||
export { MainContentDiv };
|
||||
export { MainDiv };
|
||||
@@ -1,6 +1,6 @@
|
||||
function SearchDiv ({children}:{ children: React.ReactNode; }) {
|
||||
return (
|
||||
<div className="flex bg-white rounded-lg shadow-sm mb-6 p-6">
|
||||
<div className="flex card card-border !mt-6">
|
||||
{children}
|
||||
</div>
|
||||
)
|
||||
|
||||
@@ -9,7 +9,7 @@ const SearchInput = React.forwardRef<HTMLInputElement, {className:string, label:
|
||||
return (
|
||||
<div className={className+" flex items-center"} >
|
||||
{label && <Label className="w-20 text-base text-gray-600">{label}</Label>}
|
||||
<Input className="flex-1 h-10 p-2 border rounded" value={textValue} onChange={changeText}></Input>
|
||||
<Input className="flex-1 ml-8 w-3/4 h-10 border rounded" value={textValue} onChange={changeText}></Input>
|
||||
</div>
|
||||
)
|
||||
});
|
||||
|
||||
@@ -4,22 +4,28 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from ".
|
||||
|
||||
/** 차트 기본 스타일 */
|
||||
interface SelectBox1 {
|
||||
text:string|number,
|
||||
text:string,
|
||||
val:string
|
||||
}
|
||||
|
||||
|
||||
const SelectBox = React.forwardRef<
|
||||
HTMLDivElement,
|
||||
React.HTMLAttributes<HTMLDivElement> & {label:string, selectClass:string|undefined, className:string, selectArray:SelectBox1[], onSelectValue:(val:string)=>void , defaultValue:string|number|undefined }
|
||||
>(({ label, className, selectClass, selectArray, onSelectValue, defaultValue }, ref)=>{
|
||||
const placeHolder = defaultValue ? selectArray.find(item => defaultValue === item.val)?.text : selectArray?.[0]?.text;
|
||||
React.HTMLAttributes<HTMLDivElement> & {
|
||||
label:string,
|
||||
selectClass:string|undefined,
|
||||
className:string,
|
||||
selectArray:SelectBox1[],
|
||||
onSelectValue:(val:string)=>void,
|
||||
value?: string
|
||||
}
|
||||
>(({ label, className, selectClass, selectArray, onSelectValue, value }, ref)=>{
|
||||
const placeHolder = selectArray?.[0]?.text ?? "";
|
||||
|
||||
return (
|
||||
<div className={className+" flex items-center"} ref={ref}>
|
||||
{label && <Label className="m-4 text-2xl w-1/4">{label}</Label>}
|
||||
<Select onValueChange={onSelectValue}>
|
||||
<SelectTrigger className={selectClass?selectClass:"ml-8 w-3/4 text-2xl"}>
|
||||
{label && <Label className="w-20 text-base text-gray-600">{label}</Label>}
|
||||
<Select onValueChange={onSelectValue} value={value}>
|
||||
<SelectTrigger className={selectClass?selectClass:"flex-1 p-2 border rounded"}>
|
||||
<SelectValue placeholder={placeHolder} />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
|
||||
@@ -21,10 +21,10 @@ export function UiTable({ tableData, headlist, pageSize, total, children, headNa
|
||||
|
||||
return (
|
||||
<>
|
||||
{headName ? <div className="font-bold m-3">
|
||||
{headName ? <div className="card-header">
|
||||
{headName}
|
||||
</div> : <></>}
|
||||
<Table className="w-full">
|
||||
<Table>
|
||||
<TableHeader>
|
||||
{children ? <>{children}</> : <TableRow>
|
||||
{headlist?.map((head) => (
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
|
||||
function ContentsDiv(props: {children: React.ReactNode}) {
|
||||
return (
|
||||
<div className="bg-white rounded-lg shadow-sm mb-6 p-6">
|
||||
<div className="card card-border !mt-6">
|
||||
{props.children}
|
||||
</div>
|
||||
)
|
||||
|
||||
Reference in New Issue
Block a user