플레이스홀더 변경
This commit is contained in:
parent
4cd27639e6
commit
967b76591b
|
|
@ -715,31 +715,33 @@ export const SelectedItemsDetailInputConfigPanel: React.FC<SelectedItemsDetailIn
|
||||||
open={expandedDisplayItems[group.id] ?? false}
|
open={expandedDisplayItems[group.id] ?? false}
|
||||||
onOpenChange={(open) => setExpandedDisplayItems(prev => ({ ...prev, [group.id]: open }))}
|
onOpenChange={(open) => setExpandedDisplayItems(prev => ({ ...prev, [group.id]: open }))}
|
||||||
>
|
>
|
||||||
<div className="space-y-2 rounded-lg border-2 border-dashed border-primary/30 bg-primary/5 p-2">
|
<div className="rounded-lg border-2 border-dashed border-primary/30 bg-primary/5 p-2">
|
||||||
<div className="flex items-center justify-between">
|
<CollapsibleTrigger asChild>
|
||||||
<CollapsibleTrigger asChild>
|
<Button variant="ghost" size="sm" className="h-auto w-full justify-start p-1 hover:bg-transparent">
|
||||||
<Button variant="ghost" size="sm" className="h-auto p-0 hover:bg-transparent">
|
<div className="flex items-center gap-1">
|
||||||
<div className="flex items-center gap-1">
|
{expandedDisplayItems[group.id] ? (
|
||||||
{expandedDisplayItems[group.id] ? (
|
<ChevronDown className="h-3 w-3" />
|
||||||
<ChevronDown className="h-3 w-3" />
|
) : (
|
||||||
) : (
|
<ChevronRight className="h-3 w-3" />
|
||||||
<ChevronRight className="h-3 w-3" />
|
)}
|
||||||
)}
|
<Label className="text-[10px] font-semibold sm:text-xs cursor-pointer">
|
||||||
<Label className="text-[10px] font-semibold sm:text-xs cursor-pointer">
|
항목 표시 설정 ({(group.displayItems || []).length}개)
|
||||||
항목 표시 설정 ({(group.displayItems || []).length}개)
|
</Label>
|
||||||
</Label>
|
</div>
|
||||||
</div>
|
</Button>
|
||||||
</Button>
|
</CollapsibleTrigger>
|
||||||
</CollapsibleTrigger>
|
|
||||||
<div className="flex gap-1">
|
<CollapsibleContent className="space-y-2 mt-2">
|
||||||
|
{/* 추가 버튼들 */}
|
||||||
|
<div className="flex gap-1 flex-wrap">
|
||||||
<Button
|
<Button
|
||||||
type="button"
|
type="button"
|
||||||
size="sm"
|
size="sm"
|
||||||
variant="outline"
|
variant="outline"
|
||||||
onClick={() => addDisplayItemToGroup(group.id, "icon")}
|
onClick={() => addDisplayItemToGroup(group.id, "icon")}
|
||||||
className="h-5 px-1 text-[9px] sm:h-6 sm:px-2 sm:text-[10px]"
|
className="h-5 px-1.5 text-[8px] sm:h-6 sm:px-2 sm:text-[10px]"
|
||||||
>
|
>
|
||||||
<Plus className="mr-0.5 h-2 w-2 sm:mr-1 sm:h-3 sm:w-3" />
|
<Plus className="mr-0.5 h-2.5 w-2.5 sm:mr-1 sm:h-3 sm:w-3" />
|
||||||
아이콘
|
아이콘
|
||||||
</Button>
|
</Button>
|
||||||
<Button
|
<Button
|
||||||
|
|
@ -747,9 +749,9 @@ export const SelectedItemsDetailInputConfigPanel: React.FC<SelectedItemsDetailIn
|
||||||
size="sm"
|
size="sm"
|
||||||
variant="outline"
|
variant="outline"
|
||||||
onClick={() => addDisplayItemToGroup(group.id, "field")}
|
onClick={() => addDisplayItemToGroup(group.id, "field")}
|
||||||
className="h-5 px-1 text-[9px] sm:h-6 sm:px-2 sm:text-[10px]"
|
className="h-5 px-1.5 text-[8px] sm:h-6 sm:px-2 sm:text-[10px]"
|
||||||
>
|
>
|
||||||
<Plus className="mr-0.5 h-2 w-2 sm:mr-1 sm:h-3 sm:w-3" />
|
<Plus className="mr-0.5 h-2.5 w-2.5 sm:mr-1 sm:h-3 sm:w-3" />
|
||||||
필드
|
필드
|
||||||
</Button>
|
</Button>
|
||||||
<Button
|
<Button
|
||||||
|
|
@ -757,15 +759,13 @@ export const SelectedItemsDetailInputConfigPanel: React.FC<SelectedItemsDetailIn
|
||||||
size="sm"
|
size="sm"
|
||||||
variant="outline"
|
variant="outline"
|
||||||
onClick={() => addDisplayItemToGroup(group.id, "text")}
|
onClick={() => addDisplayItemToGroup(group.id, "text")}
|
||||||
className="h-5 px-1 text-[9px] sm:h-6 sm:px-2 sm:text-[10px]"
|
className="h-5 px-1.5 text-[8px] sm:h-6 sm:px-2 sm:text-[10px]"
|
||||||
>
|
>
|
||||||
<Plus className="mr-0.5 h-2 w-2 sm:mr-1 sm:h-3 sm:w-3" />
|
<Plus className="mr-0.5 h-2.5 w-2.5 sm:mr-1 sm:h-3 sm:w-3" />
|
||||||
텍스트
|
텍스트
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<CollapsibleContent className="space-y-2">
|
|
||||||
<p className="text-[9px] text-muted-foreground sm:text-[10px]">
|
<p className="text-[9px] text-muted-foreground sm:text-[10px]">
|
||||||
이 그룹의 입력 항목이 추가되면 어떻게 표시될지 설정
|
이 그룹의 입력 항목이 추가되면 어떻게 표시될지 설정
|
||||||
</p>
|
</p>
|
||||||
|
|
@ -825,7 +825,7 @@ export const SelectedItemsDetailInputConfigPanel: React.FC<SelectedItemsDetailIn
|
||||||
value={item.fieldName || ""}
|
value={item.fieldName || ""}
|
||||||
onValueChange={(value) => updateDisplayItemInGroup(group.id, itemIndex, { fieldName: value })}
|
onValueChange={(value) => updateDisplayItemInGroup(group.id, itemIndex, { fieldName: value })}
|
||||||
>
|
>
|
||||||
<SelectTrigger className="h-6 text-[9px] sm:text-[10px]">
|
<SelectTrigger className="h-6 w-full text-[9px] sm:text-[10px]">
|
||||||
<SelectValue placeholder="필드 선택" />
|
<SelectValue placeholder="필드 선택" />
|
||||||
</SelectTrigger>
|
</SelectTrigger>
|
||||||
<SelectContent>
|
<SelectContent>
|
||||||
|
|
@ -841,8 +841,8 @@ export const SelectedItemsDetailInputConfigPanel: React.FC<SelectedItemsDetailIn
|
||||||
<Input
|
<Input
|
||||||
value={item.label || ""}
|
value={item.label || ""}
|
||||||
onChange={(e) => updateDisplayItemInGroup(group.id, itemIndex, { label: e.target.value })}
|
onChange={(e) => updateDisplayItemInGroup(group.id, itemIndex, { label: e.target.value })}
|
||||||
placeholder="거래처:"
|
placeholder="라벨 (예: 거래처:)"
|
||||||
className="h-6 text-[9px] sm:text-[10px]"
|
className="h-6 w-full text-[9px] sm:text-[10px]"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{/* 표시 형식 */}
|
{/* 표시 형식 */}
|
||||||
|
|
@ -850,7 +850,7 @@ export const SelectedItemsDetailInputConfigPanel: React.FC<SelectedItemsDetailIn
|
||||||
value={item.format || "text"}
|
value={item.format || "text"}
|
||||||
onValueChange={(value) => updateDisplayItemInGroup(group.id, itemIndex, { format: value as DisplayFieldFormat })}
|
onValueChange={(value) => updateDisplayItemInGroup(group.id, itemIndex, { format: value as DisplayFieldFormat })}
|
||||||
>
|
>
|
||||||
<SelectTrigger className="h-6 text-[9px] sm:text-[10px]">
|
<SelectTrigger className="h-6 w-full text-[9px] sm:text-[10px]">
|
||||||
<SelectValue />
|
<SelectValue />
|
||||||
</SelectTrigger>
|
</SelectTrigger>
|
||||||
<SelectContent>
|
<SelectContent>
|
||||||
|
|
@ -863,31 +863,29 @@ export const SelectedItemsDetailInputConfigPanel: React.FC<SelectedItemsDetailIn
|
||||||
</Select>
|
</Select>
|
||||||
|
|
||||||
{/* 빈 값 처리 */}
|
{/* 빈 값 처리 */}
|
||||||
<div className="grid grid-cols-2 gap-1">
|
<Select
|
||||||
<Select
|
value={item.emptyBehavior || "default"}
|
||||||
value={item.emptyBehavior || "default"}
|
onValueChange={(value) => updateDisplayItemInGroup(group.id, itemIndex, { emptyBehavior: value as EmptyBehavior })}
|
||||||
onValueChange={(value) => updateDisplayItemInGroup(group.id, itemIndex, { emptyBehavior: value as EmptyBehavior })}
|
>
|
||||||
>
|
<SelectTrigger className="h-6 w-full text-[9px] sm:text-[10px]">
|
||||||
<SelectTrigger className="h-6 text-[9px] sm:text-[10px]">
|
<SelectValue />
|
||||||
<SelectValue />
|
</SelectTrigger>
|
||||||
</SelectTrigger>
|
<SelectContent>
|
||||||
<SelectContent>
|
<SelectItem value="hide" className="text-[9px] sm:text-[10px]">숨김</SelectItem>
|
||||||
<SelectItem value="hide" className="text-[9px] sm:text-[10px]">숨김</SelectItem>
|
<SelectItem value="default" className="text-[9px] sm:text-[10px]">기본값</SelectItem>
|
||||||
<SelectItem value="default" className="text-[9px] sm:text-[10px]">기본값</SelectItem>
|
<SelectItem value="blank" className="text-[9px] sm:text-[10px]">빈칸</SelectItem>
|
||||||
<SelectItem value="blank" className="text-[9px] sm:text-[10px]">빈칸</SelectItem>
|
</SelectContent>
|
||||||
</SelectContent>
|
</Select>
|
||||||
</Select>
|
|
||||||
|
|
||||||
{/* 기본값 */}
|
{/* 기본값 */}
|
||||||
{item.emptyBehavior === "default" && (
|
{item.emptyBehavior === "default" && (
|
||||||
<Input
|
<Input
|
||||||
value={item.defaultValue || ""}
|
value={item.defaultValue || ""}
|
||||||
onChange={(e) => updateDisplayItemInGroup(group.id, itemIndex, { defaultValue: e.target.value })}
|
onChange={(e) => updateDisplayItemInGroup(group.id, itemIndex, { defaultValue: e.target.value })}
|
||||||
placeholder="미입력"
|
placeholder="미입력"
|
||||||
className="h-6 text-[9px] sm:text-[10px]"
|
className="h-6 w-full text-[9px] sm:text-[10px]"
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue