import React from 'react';
import { NodeEditorProps } from './index';
import { Form, Input } from '@arco-design/web-react';
import ConditionEditor from './components/ConditionEditor';
import AndEditor from './components/AndEditor';
import OrEditor from './components/OrEditor';
import WaitEditor from './components/WaitEditor';
import LoopEditor from './components/LoopEditor';
import CycleEditor from './components/CycleEditor';
import EventListenEditor from './components/EventListenEditor';
import EventSendEditor from './components/EventSendEditor';
import JsonToStringEditor from './components/JsonToStringEditor';
import StringToJsonEditor from './components/StringToJsonEditor';
import JsonConvertEditor from './components/JsonConvertEditor';
import ResultEditor from './components/ResultEditor';
import ImageEditor from './components/ImageEditor';
import CodeEditor from './components/CodeEditor';
import RestEditor from './components/RestEditor';

const LocalNodeEditor: React.FC<NodeEditorProps> = ({
                                                      node,
                                                      nodeData,
                                                      updateNodeData
                                                    }) => {
  // 根据LocalNode的不同类型渲染不同的编辑界面
  const renderLocalNodeEditor = () => {
    const localNodeType = nodeData.type || '';

    switch (localNodeType) {
      case 'CONDITION': // 条件选择
        return <ConditionEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      case 'AND': // 与门
        return <AndEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      case 'OR': // 或门
        return <OrEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      case 'WAIT': // 等待
        return <WaitEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      case 'LOOP_START': // 循环
      case 'LOOP_END': // 循环
        return <LoopEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      case 'CYCLE': // 周期
        return <CycleEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      case 'EVENTLISTENE': // 事件接收
        return <EventListenEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      case 'EVENTSEND': // 事件发送
        return <EventSendEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      case 'JSON2STR': // JSON转字符串
        return <JsonToStringEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      case 'STR2JSON': // 字符串转JSON
        return <StringToJsonEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      case 'JSONCONVERT': // JSON封装
        return <JsonConvertEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      case 'RESULT': // 结果展示
        return <ResultEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      case 'IMAGE': // 图片展示
        return <ImageEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      case 'CODE': // 代码编辑器
        return <CodeEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      case 'REST': // REST调用
        return <RestEditor nodeData={nodeData} updateNodeData={updateNodeData} />;
      default:
        return (
          <>
            <Form.Item label="节点标题">
              <Input
                value={nodeData.title || ''}
                onChange={(value) => updateNodeData('title', value)}
              />
            </Form.Item>
            <Form.Item label="节点描述">
              <Input.TextArea
                value={nodeData.description || ''}
                onChange={(value) => updateNodeData('description', value)}
              />
            </Form.Item>
          </>
        );
    }
  };

  return (
    <Form layout="vertical">
      {renderLocalNodeEditor()}
    </Form>
  );
};

export default LocalNodeEditor;