import { CopyOutlined, DownOutlined, MinusCircleOutlined, PlusOutlined, RightOutlined } from '@ant-design/icons';
import { App as AntApp, Button, Card, Form, Input, Modal, Select, Space } from 'antd';
import { useEffect, useRef, useState } from 'react';
import { AgentAPI, ExternalToolApi, ExternalToolApiRouting, ExternalToolPlugin, ExternalToolPluginPayload } from '../api';

interface Props {
  open: boolean;
  agentId: string;
  plugin?: ExternalToolPlugin | null;
  onClose: () => void;
  onSaved?: () => void | Promise<void>;
}

interface ToolApiRoutingFormValue extends ExternalToolApiRouting {}

interface ToolApiFormValue extends Omit<ExternalToolApi, 'headers' | 'parametersSchema' | 'routing'> {
  headers?: string;
  parametersSchema: string;
  routing: ToolApiRoutingFormValue;
}

interface ToolPluginFormValue extends Omit<ExternalToolPluginPayload, 'authConfig' | 'apis' | 'headers'> {
  authConfig?: string;
  headers?: string;
  apis: ToolApiFormValue[];
}

const EMPTY_API: ToolApiFormValue = {
  name: '',
  description: '',
  method: 'GET',
  path: '',
  headers: '{}',
  parametersSchema: JSON.stringify({ type: 'object', properties: {} }, null, 2),
  routing: {
    summary: '',
    useWhen: [''],
    doNotUseWhen: [],
    domains: [],
    intents: [],
    requiredSlots: [],
    optionalSlots: [],
    examples: [],
  },
};

function parseJsonObject(value: string | undefined, fieldName: string, optional = false) {
  const trimmedValue = value?.trim();
  if (!trimmedValue) {
    if (optional) return undefined;
    throw new Error(`${fieldName}不能为空`);
  }

  try {
    // 1. 优先尝试标准 JSON 解析
    return JSON.parse(trimmedValue);
  } catch (e) {
    try {
      // 2. 失败后尝试作为 JS 对象解析 (支持无引号键、单引号等)
      // eslint-disable-next-line no-new-func
      const parsed = new Function(`return (${trimmedValue})`)();
      if (parsed && typeof parsed === 'object' && !Array.isArray(parsed)) {
        return parsed;
      }
      throw new Error();
    } catch (e2) {
      // 3. 尝试宽松解析 (处理类似 { Content-Type: application/json } 这种完全无引号的情况)
      try {
        const content = trimmedValue.replace(/^\{/, '').replace(/\}$/, '').trim();
        const result: Record<string, any> = {};
        const pairs = content.split(/[\n,]/);
        let hasValidPair = false;

        for (let pair of pairs) {
          pair = pair.trim();
          if (!pair) continue;
          const colonIndex = pair.indexOf(':');
          if (colonIndex > 0) {
            const k = pair.substring(0, colonIndex).trim().replace(/^['"]|['"]$/g, '');
            const v = pair.substring(colonIndex + 1).trim().replace(/^['"]|['"]$/g, '');
            if (k) {
              let finalVal: any = v;
              if (v === 'true') finalVal = true;
              else if (v === 'false') finalVal = false;
              else if (v === 'null') finalVal = null;
              else if (!isNaN(Number(v)) && v !== '') finalVal = Number(v);
              result[k] = finalVal;
              hasValidPair = true;
            }
          }
        }
        if (hasValidPair) return result;
      } catch (e3) {
        // ignore and fall through to error
      }
      throw new Error(`${fieldName}格式不正确，请确保是有效的 JSON 或对象格式`);
    }
  }
}

function normalizeStringList(values?: string[]) {
  return Array.from(new Set((values ?? []).map((item) => item?.trim()).filter((item): item is string => Boolean(item))));
}

function validateTrimmedText(message: string) {
  return async (_: unknown, value: string | undefined) => {
    if (!value?.trim()) {
      throw new Error(message);
    }
  };
}

function validateRoutingList(message: string, min = 0) {
  return async (_: unknown, value: string[] | undefined) => {
    const normalized = normalizeStringList(value);
    if (normalized.length < min) {
      throw new Error(message);
    }

    if ((value ?? []).some((item) => !item?.trim())) {
      throw new Error('列表项不能为空');
    }
  };
}

function normalizeRouting(value: ToolApiRoutingFormValue | undefined, apiName: string): ExternalToolApiRouting {
  if (!value) {
    throw new Error(`API ${apiName} 的路由规则不能为空`);
  }

  const useWhen = normalizeStringList(value.useWhen);
  if (useWhen.length < 1) {
    throw new Error(`API ${apiName} 的 useWhen 至少保留一项`);
  }

  return {
    summary: value.summary?.trim() || '',
    useWhen,
    doNotUseWhen: normalizeStringList(value.doNotUseWhen),
    domains: normalizeStringList(value.domains),
    intents: normalizeStringList(value.intents),
    requiredSlots: normalizeStringList(value.requiredSlots),
    optionalSlots: normalizeStringList(value.optionalSlots),
    examples: normalizeStringList(value.examples),
  };
}

export default function ExternalToolEditor({ open, agentId, plugin, onClose, onSaved }: Props) {
  const { message } = AntApp.useApp();
  const [form] = Form.useForm<ToolPluginFormValue>();
  const isEditing = Boolean(plugin);
  const apis = Form.useWatch('apis', form) || [];
  const [expandedApiIndexes, setExpandedApiIndexes] = useState<number[]>([]);
  const previousApiCountRef = useRef(0);

  useEffect(() => {
    if (!open) {
      previousApiCountRef.current = 0;
      setExpandedApiIndexes([]);
      return;
    }

    const apiCount = apis.length;
    if (apiCount < 1) {
      previousApiCountRef.current = 0;
      setExpandedApiIndexes([]);
      return;
    }

    const previousApiCount = previousApiCountRef.current;
    if (previousApiCount === 0) {
      setExpandedApiIndexes(apiCount === 1 ? [0] : []);
    } else if (previousApiCount === 1 && apiCount > 1) {
      setExpandedApiIndexes([]);
    } else if (apiCount === 1) {
      setExpandedApiIndexes([0]);
    } else {
      setExpandedApiIndexes((current) => current.filter((index) => index < apiCount));
    }

    previousApiCountRef.current = apiCount;
  }, [apis.length, open]);

  const toggleApiCard = (index: number) => {
    setExpandedApiIndexes((current) =>
      current.includes(index) ? current.filter((item) => item !== index) : [...current, index],
    );
  };

  const handleSubmit = async () => {
    try {
      const values = await form.validateFields();
      const payload: ExternalToolPluginPayload = {
        name: values.name.trim(),
        description: values.description?.trim(),
        baseUrl: values.baseUrl.trim(),
        authType: values.authType,
        authConfig: parseJsonObject(values.authConfig, '认证配置', values.authType === 'none') || {},
        headers: parseJsonObject(values.headers, '统一请求头', true),
        apis: values.apis.map((item) => ({
          name: item.name.trim(),
          description: item.description.trim(),
          method: item.method,
          path: item.path.trim(),
          headers: parseJsonObject(item.headers, `API ${item.name} 的请求头`, true),
          parametersSchema: parseJsonObject(item.parametersSchema, `API ${item.name} 的依赖参数`),
          routing: normalizeRouting(item.routing, item.name.trim() || '未命名 API'),
        })),
      };

      if (plugin) {
        await AgentAPI.updatePlugin(agentId, plugin.id, payload);
        message.success('外部工具更新成功');
      } else {
        await AgentAPI.bindPlugin(agentId, payload);
        message.success('外部工具绑定成功');
      }
      await onSaved?.();
      onClose();
    } catch (error: any) {
      if (error?.errorFields) return;
      if (error instanceof SyntaxError) {
        message.error('配置格式不正确，请检查认证配置、请求头或依赖参数（支持 JSON 或对象格式）');
        return;
      }
      message.error(error?.message || '外部工具绑定失败');
    }
  };

  return (
    <Modal
      open={open}
      title={isEditing ? '编辑外部工具集' : '配置外部工具集'}
      width={920}
      okText={isEditing ? '保存修改' : '绑定工具'}
      cancelText="取消"
      onCancel={onClose}
      onOk={handleSubmit}
      destroyOnHidden
      afterOpenChange={(visible) => {
        if (visible) {
          form.setFieldsValue(
            plugin
              ? {
                  name: plugin.name,
                  description: plugin.description,
                  baseUrl: plugin.baseUrl,
                  authType: plugin.authType,
                  authConfig: JSON.stringify(plugin.authConfig || {}, null, 2),
                  headers: JSON.stringify(plugin.headers || {}, null, 2),
                  apis: plugin.apis.map((item) => ({
                    name: item.name,
                    description: item.description,
                    method: item.method,
                    path: item.path,
                    headers: JSON.stringify(item.headers || {}, null, 2),
                    parametersSchema: JSON.stringify(item.parametersSchema || { type: 'object', properties: {} }, null, 2),
                    routing: {
                      summary: item.routing?.summary || '',
                      useWhen: item.routing?.useWhen?.length ? item.routing.useWhen : [''],
                      doNotUseWhen: item.routing?.doNotUseWhen || [],
                      domains: item.routing?.domains || [],
                      intents: item.routing?.intents || [],
                      requiredSlots: item.routing?.requiredSlots || [],
                      optionalSlots: item.routing?.optionalSlots || [],
                      examples: item.routing?.examples || [],
                    },
                  })),
                }
              : {
                  name: '',
                  description: '',
                  baseUrl: '',
                  authType: 'bearer',
                  authConfig: JSON.stringify({ token: '' }, null, 2),
                  headers: JSON.stringify({}, null, 2),
                  apis: [{ ...EMPTY_API }],
                },
          );
        }
      }}
    >
      <Form form={form} layout="vertical" requiredMark="optional">
        <div className="agent-editor-tool-grid">
          <Form.Item label="工具集名称" name="name" rules={[{ required: true, message: '请输入工具集名称' }]}>
            <Input placeholder="例如：Hoyidata 工具集" />
          </Form.Item>
          <Form.Item label="API 基础地址" name="baseUrl" rules={[{ required: true, message: '请输入 API 基础地址' }]}>
            <Input placeholder="https://api.hoyidata.com" />
          </Form.Item>
        </div>
        <Form.Item label="工具集描述" name="description">
          <Input.TextArea rows={2} placeholder="说明该工具集提供的能力" />
        </Form.Item>
        <Form.Item label="统一请求头（JSON 或对象）" name="headers">
          <Input.TextArea
            rows={3}
            className="agent-editor-code-input"
            placeholder={'{\n  "Authorization": "Bearer YOUR_TOKEN"\n}'}
          />
        </Form.Item>
        <div className="agent-editor-tool-grid">
          <Form.Item label="认证方式" name="authType" rules={[{ required: true }]}>
            <Select
              options={[
                { value: 'none', label: '无需认证' },
                { value: 'bearer', label: 'Bearer Token' },
                { value: 'basic', label: 'Basic Auth' },
                { value: 'apiKey', label: 'API Key' },
              ]}
            />
          </Form.Item>
          <Form.Item label="认证配置（JSON 或对象）" name="authConfig">
            <Input.TextArea rows={3} className="agent-editor-code-input" placeholder={'{\n  token: "YOUR_API_KEY"\n}'} />
          </Form.Item>
        </div>

        <Form.List name="apis">
          {(fields, { add, remove }) => (
            <Space direction="vertical" size={12} className="agent-editor-tool-list">
              <div className="agent-editor-tool-list-header">
                <div>
                  <strong>API 功能</strong>
                  <div className="agent-editor-tool-help">一个工具集可同时绑定多个 API 功能。</div>
                </div>
                <Button type="dashed" icon={<PlusOutlined />} onClick={() => add({ ...EMPTY_API })}>
                  添加 API
                </Button>
              </div>

              {fields.map((field, index) => {
                const isExpanded = expandedApiIndexes.includes(index);
                const apiName = apis[index]?.name;

                return (
                  <Card
                    key={field.key}
                    size="small"
                    title={
                      <Button
                        type="text"
                        size="small"
                        onClick={() => toggleApiCard(index)}
                        style={{ padding: 0, fontWeight: 500 }}
                        icon={isExpanded ? <DownOutlined /> : <RightOutlined />}
                      >
                        {apiName || `API-${index}`}
                      </Button>
                    }
                    className="agent-editor-tool-card"
                    extra={
                      <Space>
                        <Button
                          type="text"
                          size="small"
                          icon={<CopyOutlined />}
                          onClick={() => {
                            const currentApis = form.getFieldValue('apis') || [];
                            const apiToCopy = currentApis[field.name];
                            if (apiToCopy) {
                              add({
                                ...apiToCopy,
                                name: `${apiToCopy.name}-copy`,
                              });
                            }
                          }}
                        >
                          复制
                        </Button>
                        {fields.length > 1 ? (
                          <Button type="text" danger size="small" icon={<MinusCircleOutlined />} onClick={() => remove(field.name)}>
                            删除
                          </Button>
                        ) : null}
                      </Space>
                    }
                  >
                    {isExpanded ? (
                      <>
                        <div className="agent-editor-tool-grid">
                          <Form.Item
                            label="name（工具名）"
                            name={[field.name, 'name']}
                            rules={[
                              { required: true, message: '请输入工具名' },
                              { pattern: /^[A-Za-z0-9_]+$/, message: '仅支持字母、数字和下划线' },
                            ]}
                          >
                            <Input placeholder="query_hot_selling_products" />
                          </Form.Item>
                          <Form.Item label="method（调用方法）" name={[field.name, 'method']} rules={[{ required: true }]}>
                            <Select options={['GET', 'POST', 'PUT', 'PATCH', 'DELETE'].map((value) => ({ value, label: value }))} />
                          </Form.Item>
                        </div>
                        <Form.Item
                          label="description（描述）"
                          name={[field.name, 'description']}
                          rules={[{ validator: validateTrimmedText('请输入描述') }]}
                        >
                          <Input.TextArea rows={2} placeholder="描述调用时机和工具能力" />
                        </Form.Item>
                        <Form.Item
                          label="path（API 地址）"
                          name={[field.name, 'path']}
                          rules={[{ validator: validateTrimmedText('请输入 API 地址') }]}
                        >
                          <Input placeholder="/v1/products/hot-selling" />
                        </Form.Item>
                        <div className="agent-editor-tool-grid">
                          <Form.Item label="headers（请求头 JSON 或对象）" name={[field.name, 'headers']}>
                            <Input.TextArea rows={7} className="agent-editor-code-input" placeholder={'{\n  "X-Custom-Source": "aura-agent"\n}'} />
                          </Form.Item>
                          <Form.Item
                            label="parametersSchema（依赖参数 JSON 或对象）"
                            name={[field.name, 'parametersSchema']}
                            rules={[{ required: true, message: '请输入依赖参数 Schema' }]}
                          >
                            <Input.TextArea rows={7} className="agent-editor-code-input" />
                          </Form.Item>
                        </div>
                        <Card size="small" title="routing（路由规则）">
                          <Form.Item label="summary" name={[field.name, 'routing', 'summary']}>
                            <Input placeholder="查询商品维度数据" />
                          </Form.Item>
                          <Form.List name={[field.name, 'routing', 'useWhen']} rules={[{ validator: validateRoutingList('至少添加一条 useWhen', 1) }]}>
                            {(routingFields, { add: addUseWhen, remove: removeUseWhen }, { errors }) => (
                              <Space direction="vertical" size={8} className="agent-editor-tool-list">
                                <div className="agent-editor-tool-list-header">
                                  <div>
                                    <strong>useWhen</strong>
                                    <div className="agent-editor-tool-help">至少一项，描述什么情况下应该调用这个 API。</div>
                                  </div>
                                  <Button type="dashed" icon={<PlusOutlined />} onClick={() => addUseWhen('')}>
                                    添加条件
                                  </Button>
                                </div>
                                {routingFields.map((routingField) => (
                                  <Space key={routingField.key} align="start" className="agent-editor-tool-list">
                                    <Form.Item
                                      name={routingField.name}
                                      className="flex-1 mb-0"
                                      rules={[{ validator: validateTrimmedText('条件不能为空') }]}
                                    >
                                      <Input placeholder="用户明确要求商品数据" style={{ width: 600 }} />
                                    </Form.Item>
                                    <Button
                                      danger
                                      type="text"
                                      icon={<MinusCircleOutlined />}
                                      onClick={() => removeUseWhen(routingField.name)}
                                      disabled={routingFields.length <= 1}
                                    />
                                  </Space>
                                ))}
                                <Form.ErrorList errors={errors} />
                              </Space>
                            )}
                          </Form.List>
                          <Form.List name={[field.name, 'routing', 'doNotUseWhen']} rules={[{ validator: validateRoutingList('列表项不能为空') }]}>
                            {(routingFields, { add: addDoNotUseWhen, remove: removeDoNotUseWhen }, { errors }) => (
                              <Space direction="vertical" size={8} className="agent-editor-tool-list" style={{ marginTop: 16 }}>
                                <div className="agent-editor-tool-list-header">
                                  <div>
                                    <strong>doNotUseWhen</strong>
                                    <div className="agent-editor-tool-help">可为空，描述什么情况下不要调用这个 API。</div>
                                  </div>
                                  <Button type="dashed" icon={<PlusOutlined />} onClick={() => addDoNotUseWhen('')}>
                                    添加条件
                                  </Button>
                                </div>
                                {routingFields.map((routingField) => (
                                  <Space key={routingField.key} align="start" className="agent-editor-tool-list">
                                    <Form.Item
                                      name={routingField.name}
                                      className="flex-1 mb-0"
                                      rules={[{ validator: validateTrimmedText('条件不能为空') }]}
                                    >
                                      <Input placeholder="当前问题只需要其他维度数据" style={{ width: 600 }} />
                                    </Form.Item>
                                    <Button danger type="text" icon={<MinusCircleOutlined />} onClick={() => removeDoNotUseWhen(routingField.name)} />
                                  </Space>
                                ))}
                                <Form.ErrorList errors={errors} />
                              </Space>
                            )}
                          </Form.List>

                          <div className="agent-editor-tool-grid" style={{ marginTop: 16 }}>
                            <Form.Item label="domains（领域）" name={[field.name, 'routing', 'domains']}>
                              <Select mode="tags" placeholder="例如：e-commerce, logistics" />
                            </Form.Item>
                            <Form.Item label="intents（意图）" name={[field.name, 'routing', 'intents']}>
                              <Select mode="tags" placeholder="例如：query_order, cancel_order" />
                            </Form.Item>
                          </div>

                          <div className="agent-editor-tool-grid">
                            <Form.Item label="requiredSlots（必填槽位）" name={[field.name, 'routing', 'requiredSlots']}>
                              <Select mode="tags" placeholder="例如：order_id, user_id" />
                            </Form.Item>
                            <Form.Item label="optionalSlots（可选槽位）" name={[field.name, 'routing', 'optionalSlots']}>
                              <Select mode="tags" placeholder="例如：start_date, end_date" />
                            </Form.Item>
                          </div>

                          <Form.List name={[field.name, 'routing', 'examples']}>
                            {(exampleFields, { add: addExample, remove: removeExample }) => (
                              <Space direction="vertical" size={8} className="agent-editor-tool-list" style={{ marginTop: 16 }}>
                                <div className="agent-editor-tool-list-header">
                                  <div>
                                    <strong>examples（示例）</strong>
                                    <div className="agent-editor-tool-help">描述用户可能的提问方式。</div>
                                  </div>
                                  <Button type="dashed" icon={<PlusOutlined />} onClick={() => addExample('')}>
                                    添加示例
                                  </Button>
                                </div>
                                {exampleFields.map((exampleField) => (
                                  <Space key={exampleField.key} align="start" className="agent-editor-tool-list">
                                    <Form.Item
                                      name={exampleField.name}
                                      className="flex-1 mb-0"
                                      rules={[{ validator: validateTrimmedText('示例不能为空') }]}
                                    >
                                      <Input placeholder="我想查一下最近的订单" style={{ width: 600 }} />
                                    </Form.Item>
                                    <Button danger type="text" icon={<MinusCircleOutlined />} onClick={() => removeExample(exampleField.name)} />
                                  </Space>
                                ))}
                              </Space>
                            )}
                          </Form.List>
                        </Card>
                      </>
                    ) : null}
                  </Card>
                );
              })}
            </Space>
          )}
        </Form.List>
      </Form>
    </Modal>
  );
}