패널 정리중

This commit is contained in:
kjs
2025-10-28 18:41:45 +09:00
parent 743ae6dbf1
commit eeae338cd4
5 changed files with 457 additions and 892 deletions

View File

@@ -61,6 +61,24 @@ export const ButtonConfigPanel: React.FC<ButtonConfigPanelProps> = ({
const [displayColumnOpen, setDisplayColumnOpen] = useState(false);
const [displayColumnSearch, setDisplayColumnSearch] = useState("");
// 🎯 플로우 위젯이 화면에 있는지 확인
const hasFlowWidget = useMemo(() => {
const found = allComponents.some((comp: any) => {
// ScreenDesigner에서 저장하는 componentType 속성 확인!
const compType = comp.componentType || comp.widgetType || "";
// "flow-widget" 체크
const isFlow = compType === "flow-widget" || compType?.toLowerCase().includes("flow");
if (isFlow) {
console.log("✅ 플로우 위젯 발견!", { id: comp.id, componentType: comp.componentType });
}
return isFlow;
});
console.log("🎯 플로우 위젯 존재 여부:", found);
return found;
}, [allComponents]);
// 컴포넌트 prop 변경 시 로컬 상태 동기화 (Input만)
useEffect(() => {
const latestConfig = component.componentConfig || {};
@@ -298,7 +316,8 @@ export const ButtonConfigPanel: React.FC<ButtonConfigPanelProps> = ({
variant="outline"
role="combobox"
aria-expanded={modalScreenOpen}
className="h-6 w-full px-2 py-0 justify-between" style={{ fontSize: "12px" }}
className="h-6 w-full justify-between px-2 py-0"
style={{ fontSize: "12px" }}
disabled={screensLoading}
>
{config.action?.targetScreenId
@@ -372,7 +391,8 @@ export const ButtonConfigPanel: React.FC<ButtonConfigPanelProps> = ({
variant="outline"
role="combobox"
aria-expanded={modalScreenOpen}
className="h-6 w-full px-2 py-0 justify-between" style={{ fontSize: "12px" }}
className="h-6 w-full justify-between px-2 py-0"
style={{ fontSize: "12px" }}
disabled={screensLoading}
>
{config.action?.targetScreenId
@@ -526,7 +546,8 @@ export const ButtonConfigPanel: React.FC<ButtonConfigPanelProps> = ({
variant="outline"
role="combobox"
aria-expanded={displayColumnOpen}
className="mt-2 h-8 w-full justify-between text-xs" style={{ fontSize: "12px" }}
className="mt-2 h-8 w-full justify-between text-xs"
style={{ fontSize: "12px" }}
disabled={columnsLoading || tableColumns.length === 0}
>
{columnsLoading
@@ -543,7 +564,9 @@ export const ButtonConfigPanel: React.FC<ButtonConfigPanelProps> = ({
<Command>
<CommandInput placeholder="컬럼 검색..." className="text-xs" style={{ fontSize: "12px" }} />
<CommandList>
<CommandEmpty className="text-xs" style={{ fontSize: "12px" }}> .</CommandEmpty>
<CommandEmpty className="text-xs" style={{ fontSize: "12px" }}>
.
</CommandEmpty>
<CommandGroup>
{tableColumns.map((column) => (
<CommandItem
@@ -553,7 +576,8 @@ export const ButtonConfigPanel: React.FC<ButtonConfigPanelProps> = ({
onUpdateProperty("componentConfig.action.historyDisplayColumn", currentValue);
setDisplayColumnOpen(false);
}}
className="text-xs" style={{ fontSize: "12px" }}
className="text-xs"
style={{ fontSize: "12px" }}
>
<Check
className={cn(
@@ -586,7 +610,8 @@ export const ButtonConfigPanel: React.FC<ButtonConfigPanelProps> = ({
variant="outline"
role="combobox"
aria-expanded={navScreenOpen}
className="h-6 w-full px-2 py-0 justify-between" style={{ fontSize: "12px" }}
className="h-6 w-full justify-between px-2 py-0"
style={{ fontSize: "12px" }}
disabled={screensLoading}
>
{config.action?.targetScreenId
@@ -659,7 +684,8 @@ export const ButtonConfigPanel: React.FC<ButtonConfigPanelProps> = ({
setLocalInputs((prev) => ({ ...prev, targetUrl: newValue }));
onUpdateProperty("componentConfig.action.targetUrl", newValue);
}}
className="h-6 w-full px-2 py-0 text-xs" style={{ fontSize: "12px" }}
className="h-6 w-full px-2 py-0 text-xs"
style={{ fontSize: "12px" }}
/>
<p className="mt-1 text-xs text-gray-500">URL을 </p>
</div>
@@ -671,14 +697,16 @@ export const ButtonConfigPanel: React.FC<ButtonConfigPanelProps> = ({
<ImprovedButtonControlConfigPanel component={component} onUpdateProperty={onUpdateProperty} />
</div>
{/* 🆕 플로우 단계별 표시 제어 섹션 */}
<div className="mt-8 border-t border-gray-200 pt-6">
<FlowVisibilityConfigPanel
component={component}
allComponents={allComponents}
onUpdateProperty={onUpdateProperty}
/>
</div>
{/* 🆕 플로우 단계별 표시 제어 섹션 (플로우 위젯이 있을 때만 표시) */}
{hasFlowWidget && (
<div className="mt-8 border-t border-gray-200 pt-6">
<FlowVisibilityConfigPanel
component={component}
allComponents={allComponents}
onUpdateProperty={onUpdateProperty}
/>
</div>
)}
</div>
);
};