ERP-node/frontend/components/screen/config-panels/ButtonConfigPanel.tsx

65 lines
2.0 KiB
TypeScript

"use client";
import React from "react";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
import { ComponentData } from "@/types/screen";
import { BasicTab } from "./button-config/BasicTab";
import { ActionTab } from "./button-config/ActionTab";
import { DataflowTab } from "./button-config/DataflowTab";
import { AdvancedTab } from "./button-config/AdvancedTab";
interface ButtonConfigPanelProps {
component: ComponentData;
onUpdateProperty: (path: string, value: any) => void;
allComponents?: ComponentData[];
currentTableName?: string;
currentScreenCompanyCode?: string;
}
export const ButtonConfigPanel: React.FC<ButtonConfigPanelProps> = ({
component,
onUpdateProperty,
allComponents = [],
currentTableName,
currentScreenCompanyCode,
}) => {
if (!component) {
return <div className="text-muted-foreground p-4 text-sm"> .</div>;
}
const tabProps = {
component,
onUpdateProperty,
allComponents,
currentTableName,
currentScreenCompanyCode,
};
return (
<Tabs defaultValue="basic" className="w-full">
<TabsList className="grid w-full grid-cols-4">
<TabsTrigger value="basic" className="text-xs"></TabsTrigger>
<TabsTrigger value="action" className="text-xs"></TabsTrigger>
<TabsTrigger value="dataflow" className="text-xs"></TabsTrigger>
<TabsTrigger value="advanced" className="text-xs"></TabsTrigger>
</TabsList>
<TabsContent value="basic" className="mt-4">
<BasicTab {...tabProps} />
</TabsContent>
<TabsContent value="action" className="mt-4">
<ActionTab {...tabProps} />
</TabsContent>
<TabsContent value="dataflow" className="mt-4">
<DataflowTab {...tabProps} />
</TabsContent>
<TabsContent value="advanced" className="mt-4">
<AdvancedTab {...tabProps} />
</TabsContent>
</Tabs>
);
};