Merge branch 'iipbs/common/main' into iipbs/wr/form_fuction

This commit is contained in:
leedj312
2025-03-27 09:22:43 +09:00
9 changed files with 68 additions and 16 deletions
@@ -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>
)