search 폼 형태 수정.
This commit is contained in:
@@ -1,5 +1,4 @@
|
||||
import { Button, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTrigger } from "@common/components";
|
||||
import { useState } from "react";
|
||||
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader } from "@common/components";
|
||||
|
||||
type ModalType = {
|
||||
bodyClass: string;
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
function SearchDiv ({children}:{ children: React.ReactNode; }) {
|
||||
return (
|
||||
<div className="flex card card-border !mt-6">
|
||||
{children}
|
||||
{children}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -242,7 +242,7 @@ function SearchFormLeft({ isShowPart = false, children, selectSidoData = [], sel
|
||||
|
||||
return (
|
||||
isShowPart ? (
|
||||
<div className="grid grid-cols-12 gap-4 w-4/5 mx-4">
|
||||
<div className="grid grid-cols-12 gap-5 w-11/12 m-4">
|
||||
<SelectBox className="col-span-3" label={'구분'} selectArray={selectPartData} onSelectValue={(val) => onSelectValue(val.toString(), 'part')} value={partValue} selectClass={undefined}/>
|
||||
{showPart === '01' ? (
|
||||
<>
|
||||
@@ -265,7 +265,7 @@ function SearchFormLeft({ isShowPart = false, children, selectSidoData = [], sel
|
||||
{children}
|
||||
</div>
|
||||
) : (
|
||||
<div className="grid grid-cols-12 gap-4 w-4/5 mx-4">
|
||||
<div className="grid grid-cols-12 gap-5 w-5/6 m-4">
|
||||
{children}
|
||||
</div>
|
||||
)
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
import React from 'react'
|
||||
import React from 'react';
|
||||
|
||||
function SearchFormRight(props: {children: React.ReactNode}) {
|
||||
return (
|
||||
<div className="w-1/5 mx-5 flex items-center justify-end space-x-2">
|
||||
<div className="w-1/12 mx-5 flex flex-col items-center justify-center space-x-2">
|
||||
{props.children}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export { SearchFormRight };
|
||||
export { SearchFormRight };
|
||||
|
||||
@@ -21,9 +21,9 @@ 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 ml-8 w-3/4 h-10 border rounded" value={textValue} onChange={changeText} onKeyUp={keyUp}></Input>
|
||||
{label && <Label className="w-20 text-xl text-gray-600">{label}</Label>}
|
||||
<Input className="!text-lg flex-1 w-3/4 h-14 border rounded" value={textValue} onChange={changeText} onKeyUp={keyUp}></Input>
|
||||
</div>
|
||||
)
|
||||
});
|
||||
export { SearchInput };
|
||||
export { SearchInput };
|
||||
|
||||
@@ -24,12 +24,12 @@ const SearchInputSelect = React.forwardRef<HTMLInputElement, {className:string,
|
||||
|
||||
return (
|
||||
<div className={className+" flex items-center"} >
|
||||
{label && <Label className="w-20 text-base text-gray-600">{label}</Label>}
|
||||
{label && <Label className="w-20 text-xl text-gray-600">{label}</Label>}
|
||||
<div className="flex w-full items-center">
|
||||
<Input className="w-2/3 text-lg h-10 p-2 border rounded" value={textValue} onChange={changeText} />
|
||||
<Input className="w-2/3 text-xl h-14 p-2 border rounded" value={textValue} onChange={changeText} />
|
||||
<Select onValueChange={onSelectValue} value={selectValue}>
|
||||
<SelectTrigger className="ml-2 w-1/3 text-lg" >
|
||||
<SelectValue placeholder={selectData?.[0]?.text ?? ""} />
|
||||
<SelectTrigger className="ml-2 w-1/3" >
|
||||
<SelectValue placeholder={selectData?.[0]?.text ?? ""} />
|
||||
</SelectTrigger>
|
||||
{/* <SelectContent ref={refs ? (refs as unknown as RefType)?.selectValue : null}> */}
|
||||
<SelectContent >
|
||||
@@ -42,4 +42,4 @@ const SearchInputSelect = React.forwardRef<HTMLInputElement, {className:string,
|
||||
</div>
|
||||
)
|
||||
});
|
||||
export { SearchInputSelect };
|
||||
export { SearchInputSelect };
|
||||
|
||||
@@ -23,7 +23,7 @@ const SelectBox = React.forwardRef<
|
||||
|
||||
return (
|
||||
<div className={className+" flex items-center"} ref={ref}>
|
||||
{label && <Label className="w-20 text-base text-gray-600">{label}</Label>}
|
||||
{label && <Label className="w-20 text-xl text-gray-600">{label}</Label>}
|
||||
<Select onValueChange={onSelectValue} value={value !== undefined ? String(value) : undefined}>
|
||||
<SelectTrigger className={selectClass?selectClass:"flex-1 p-2 border rounded"}>
|
||||
<SelectValue placeholder={placeHolder} />
|
||||
@@ -38,4 +38,4 @@ const SelectBox = React.forwardRef<
|
||||
)
|
||||
})
|
||||
|
||||
export { SelectBox };
|
||||
export { SelectBox };
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import * as React from "react"
|
||||
import * as SelectPrimitive from "@radix-ui/react-select"
|
||||
import { Check, ChevronDown, ChevronUp } from "lucide-react"
|
||||
import * as React from "react"
|
||||
|
||||
import { cn } from "../../../lib/utils"
|
||||
|
||||
@@ -17,7 +17,7 @@ const SelectTrigger = React.forwardRef<
|
||||
<SelectPrimitive.Trigger
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background data-[placeholder]:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
|
||||
"flex h-13 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-xl ring-offset-background data-[placeholder]:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
@@ -103,7 +103,7 @@ const SelectLabel = React.forwardRef<
|
||||
>(({ className, ...props }, ref) => (
|
||||
<SelectPrimitive.Label
|
||||
ref={ref}
|
||||
className={cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className)}
|
||||
className={cn("py-1.5 pl-8 pr-2 text-lg font-semibold", className)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
@@ -116,7 +116,7 @@ const SelectItem = React.forwardRef<
|
||||
<SelectPrimitive.Item
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
||||
"relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-lg outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
@@ -145,14 +145,6 @@ const SelectSeparator = React.forwardRef<
|
||||
SelectSeparator.displayName = SelectPrimitive.Separator.displayName
|
||||
|
||||
export {
|
||||
Select,
|
||||
SelectGroup,
|
||||
SelectValue,
|
||||
SelectTrigger,
|
||||
SelectContent,
|
||||
SelectLabel,
|
||||
SelectItem,
|
||||
SelectSeparator,
|
||||
SelectScrollUpButton,
|
||||
SelectScrollDownButton,
|
||||
Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue
|
||||
}
|
||||
|
||||
|
||||
@@ -51,7 +51,7 @@ export function UiTable({ tableData, headlist, pageSize, total, children, headNa
|
||||
</div> : <></>}
|
||||
<div className={`card !m-[1.2rem] !p-0r ${className}`}>
|
||||
<Table variant="secondary">
|
||||
<TableHeader >
|
||||
<TableHeader className="font-bold">
|
||||
{children ? <>{children}</> : <TableRow>
|
||||
{headlist?.map((head) => (
|
||||
<TableHead key={head.id}>{head.title}</TableHead>
|
||||
|
||||
Reference in New Issue
Block a user