jskim/vexplor_dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

다국어 지원 및 테이블 설정 현황 문서를 업데이트하고, 컴포넌트 패널에서 UI 개선을 통해 사용자 경험을 향상시켰습니다. 또한, 통합 패널의 너비를 조정하고, 패널 토글 기능을 추가하여 인터페이스의 유연성을 높였습니다.

Browse Source
This commit is contained in:
kjs
2026-01-16 09:59:16 +09:00
parent c71641c32c
commit f160ba2a1b
5 changed files with 97 additions and 165 deletions
Download Patch File Download Diff File Expand all files Collapse all files

124
frontend/lib/registry/components/table-list/TableListConfigPanel.tsx
View File

@@ -760,130 +760,6 @@ export const TableListConfigPanel: React.FC<TableListConfigPanelProps> = ({
<div className="text-sm font-medium">테이블 리스트 설정</div>
<div className="space-y-6">
{/* 커스텀 테이블 설정 */}
<div className="space-y-3">
<div>
<h3 className="text-sm font-semibold">데이터 소스 테이블</h3>
<p className="text-muted-foreground text-[10px]">화면 메인 테이블과 다른 테이블을 사용할 수 있습니다</p>
</div>
<hr className="border-border" />
{/* 커스텀 테이블 사용 여부 */}
{/* 현재 선택된 테이블 표시 (카드 형태) */}
<div className="flex items-center gap-2 rounded-md border bg-slate-50 p-2">
<Database className="h-4 w-4 text-blue-500" />
<div className="flex-1">
<div className="text-xs font-medium">
{config.customTableName || config.selectedTable || screenTableName || "테이블 미선택"}
</div>
<div className="text-[10px] text-muted-foreground">
{config.useCustomTable ? "커스텀 테이블" : "화면 기본 테이블"}
{config.isReadOnly && " (읽기전용)"}
</div>
</div>
</div>
{/* 테이블 선택 Combobox (기본/전체 그룹) */}
<Popover open={tableComboboxOpen} onOpenChange={setTableComboboxOpen}>
<PopoverTrigger asChild>
<Button
variant="outline"
role="combobox"
aria-expanded={tableComboboxOpen}
className="h-8 w-full justify-between text-xs"
disabled={loadingTables}
>
테이블 변경...
<ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
</Button>
</PopoverTrigger>
<PopoverContent className="w-full p-0" align="start">
<Command>
<CommandInput placeholder="테이블 검색..." className="h-8 text-xs" />
<CommandList>
<CommandEmpty className="py-2 text-xs">테이블을 찾을 수 없습니다</CommandEmpty>
{/* 그룹 1: 화면 기본 테이블 */}
{screenTableName && (
<CommandGroup heading="기본 (화면 테이블)">
<CommandItem
key={`default-${screenTableName}`}
value={screenTableName}
onSelect={(currentValue) => {
console.log("🔍 기본 테이블 선택:", currentValue, screenTableName);
onChange({
...config,
useCustomTable: false,
customTableName: undefined,
selectedTable: screenTableName,
columns: [],
});
setTableComboboxOpen(false);
}}
className="text-xs cursor-pointer"
>
<Check
className={cn(
"mr-2 h-3 w-3",
!config.useCustomTable && (config.selectedTable === screenTableName || !config.selectedTable)
? "opacity-100"
: "opacity-0",
)}
/>
<Database className="mr-2 h-3 w-3 text-blue-500" />
{screenTableName}
</CommandItem>
</CommandGroup>
)}
{/* 그룹 2: 전체 테이블 */}
<CommandGroup heading="전체 테이블">
{availableTables
.filter((table) => table.tableName !== screenTableName)
.map((table) => (
<CommandItem
key={table.tableName}
value={table.tableName}
onSelect={(currentValue) => {
console.log("🔍 전체 테이블 선택:", currentValue, table.tableName);
onChange({
...config,
useCustomTable: true,
customTableName: table.tableName,
selectedTable: table.tableName,
columns: [],
});
setTableComboboxOpen(false);
}}
className="text-xs cursor-pointer"
>
<Check
className={cn(
"mr-2 h-3 w-3",
config.customTableName === table.tableName ? "opacity-100" : "opacity-0",
)}
/>
<Table2 className="mr-2 h-3 w-3 text-slate-400" />
{table.displayName || table.tableName}
</CommandItem>
))}
</CommandGroup>
</CommandList>
</Command>
</PopoverContent>
</Popover>
{/* 읽기전용 설정 */}
<div className="flex items-center space-x-2">
<Checkbox
id="isReadOnly"
checked={config.isReadOnly || false}
onCheckedChange={(checked) => handleChange("isReadOnly", checked)}
/>
<Label htmlFor="isReadOnly" className="text-xs">읽기전용 (조회만 가능)</Label>
</div>
</div>
{/* 툴바 버튼 설정 */}
<div className="space-y-3">
<div>