Files
vexplor/frontend/lib/registry/pop-components/pop-search/index.tsx
SeongHyun Kim e3ae8d273c feat(pop): 컴포넌트 연결 단순화 + 상태 변경 규칙 UI 개선 + 조회 키 설정
컴포넌트 연결 단순화
- ConnectionEditor: 이벤트 연결 시 "어디로" Select 1개로 단순화
- useConnectionResolver: 호환 이벤트 자동 라우팅 (_auto 모드)
- connectionMeta에 category(event/filter/data) 필드 추가

상태 변경 규칙 UI 개선
- StatusChangeRule 타입 통합, 모든 버튼 프리셋에서 사용 가능
- TableCombobox/ColumnCombobox 공용 컴포넌트 추출 (pop-shared/)
- 테이블/컬럼 드롭다운, 고정값/조건부 값 설정 UI
- 입고확정 API 신규 (popActionRoutes.ts, 동적 상태 변경 처리)

조회 키 자동/수동 설정
- 대상 테이블 기반 자동 판단 (cart_items -> id, 그 외 -> row_key -> PK)
- 수동 모드: 카드 항목 필드와 대상 PK 컬럼을 직접 지정 가능
- PK 컬럼명 동적 표시 (isPrimaryKey 정보 활용)
2026-03-03 15:31:13 +09:00

48 lines
1.8 KiB
TypeScript

"use client";
import { PopComponentRegistry } from "../../PopComponentRegistry";
import { PopSearchComponent } from "./PopSearchComponent";
import { PopSearchConfigPanel } from "./PopSearchConfig";
import type { PopSearchConfig } from "./types";
import { DEFAULT_SEARCH_CONFIG } from "./types";
function PopSearchPreviewComponent({ config, label }: { config?: PopSearchConfig; label?: string }) {
const cfg = config || DEFAULT_SEARCH_CONFIG;
const displayLabel = cfg.labelText || label || cfg.fieldName || "검색";
return (
<div className="flex h-full w-full flex-col items-center justify-center gap-1 p-2">
<span className="text-[10px] font-medium text-muted-foreground">
{displayLabel}
</span>
<div className="flex h-6 w-full items-center rounded border border-dashed border-muted-foreground/30 px-2">
<span className="text-[9px] text-muted-foreground">
{cfg.placeholder || cfg.inputType}
</span>
</div>
</div>
);
}
PopComponentRegistry.registerComponent({
id: "pop-search",
name: "검색",
description: "조건 입력 (텍스트/날짜/선택/모달)",
category: "input",
icon: "Search",
component: PopSearchComponent,
configPanel: PopSearchConfigPanel,
preview: PopSearchPreviewComponent,
defaultProps: DEFAULT_SEARCH_CONFIG,
connectionMeta: {
sendable: [
{ key: "filter_value", label: "필터 값", type: "filter_value", category: "filter", description: "입력한 검색 조건을 다른 컴포넌트에 전달" },
],
receivable: [
{ key: "set_value", label: "값 설정", type: "filter_value", category: "filter", description: "외부에서 값을 받아 검색 필드에 세팅 (스캔, 모달 선택 등)" },
],
},
touchOptimized: true,
supportedDevices: ["mobile", "tablet"],
});