import { useState } from 'react';
import { Alert, Form, Input, InputNumber, Modal, Select, Tag, message } from 'antd';
import { ProCard } from '@ant-design/pro-components';
import { useQuery, useQueryClient } from '@tanstack/react-query';
import type { ColDef } from '@ag-grid-community/core';
import PageContainer from '@/components/common/PageContainer';
import SearchForm from '@/components/common/SearchForm';
import DataGrid from '@/components/common/DataGrid';
import PermissionButton from '@/components/common/PermissionButton';
import CodeBadge from '@/components/common/CodeBadge';
import { successionApi, ContractSuccessionRow, ContractSuccessionSaveReq, SuccessionSearchParam } from '@/api/succession';
import { GRAY, RADIUS, SHADOW } from '@/theme/tokens';

const COLUMNS: ColDef<ContractSuccessionRow>[] = [
  { field: 'policyNo',        headerName: '증권번호',   width: 150, pinned: 'left' },
  { field: 'fromAgentName',   headerName: '전임 설계사', width: 130 },
  { field: 'toAgentName',     headerName: '후임 설계사', width: 130 },
  { field: 'successionDate',  headerName: '승계일',     width: 120 },
  {
    field: 'reason', headerName: '사유', width: 110,
    cellRenderer: (p: { value: string }) => <CodeBadge groupCode="SUCCESSION_REASON" value={p.value} />,
  },
  { field: 'memo',            headerName: '메모',       flex: 1 },
  {
    field: 'status', headerName: '상태', width: 100,
    cellRenderer: (p: { value: string }) =>
      p.value === 'CANCELED'
        ? <Tag color="default" style={{ margin: 0 }}>취소</Tag>
        : <Tag color="green" style={{ margin: 0, fontWeight: 700 }}>유효</Tag>,
  },
  { field: 'createdAt',       headerName: '등록일',     width: 120 },
];

export default function ContractSuccessions() {
  const qc = useQueryClient();
  const [params, setParams] = useState<SuccessionSearchParam>({ pageSize: 100 });
  const [createOpen, setCreateOpen] = useState(false);
  const [form] = Form.useForm();

  const { data, isLoading, isError } = useQuery({
    queryKey: ['successions', params],
    queryFn: () => successionApi.list(params),
    retry: false,
  });

  const rows = data?.list ?? [];

  const handleCreate = async () => {
    const values = await form.validateFields() as ContractSuccessionSaveReq;
    try {
      await successionApi.create(values);
      message.success('계약 승계 등록 완료');
      qc.invalidateQueries({ queryKey: ['successions'] });
      setCreateOpen(false);
      form.resetFields();
    } catch { /* handled by interceptor */ }
  };

  const handleCancel = (id: number) => Modal.confirm({
    title: '승계 취소',
    content: '이 승계를 취소합니다. 이후 정산월부터 유지수수료는 다시 직전 귀속 설계사에게 계산됩니다.',
    okText: '취소 처리',
    cancelText: '닫기',
    onOk: async () => {
      await successionApi.cancel(id);
      message.success('승계 취소 완료');
      qc.invalidateQueries({ queryKey: ['successions'] });
    },
  });

  return (
    <PageContainer
      title="계약 승계 관리"
      description="설계사 해촉·이관 시 보험계약의 유지수수료 귀속 설계사를 후임으로 전환 (모집수수료는 원 설계사 귀속 유지)"
      extra={
        <PermissionButton menuCode="CONTRACT_SUCCESSION" permCode="CREATE" type="primary" onClick={() => setCreateOpen(true)}>
          + 승계 등록
        </PermissionButton>
      }
    >
      {isError && (
        <Alert type="warning" showIcon message="API 미응답" description="/api/contract-successions 를 확인하세요." style={{ marginBottom: 16 }} />
      )}

      <SearchForm
        conditions={[
          { type: 'code', name: 'reason', label: '사유', groupCode: 'SUCCESSION_REASON', span: 6 },
          { type: 'code', name: 'status', label: '상태', groupCode: 'SUCCESSION_STATUS', span: 6 },
        ]}
        onSearch={(v) => setParams({ ...v as SuccessionSearchParam, pageSize: 100 })}
        onReset={() => setParams({ pageSize: 100 })}
      />

      <ProCard style={{ background: '#fff', borderRadius: RADIUS.lg, border: `1px solid ${GRAY[100]}`, boxShadow: SHADOW.sm }}>
        <DataGrid<ContractSuccessionRow>
          rows={rows}
          columns={[
            ...COLUMNS,
            {
              headerName: '액션', width: 110, pinned: 'right',
              cellRenderer: (p: { data: ContractSuccessionRow }) => (
                <PermissionButton
                  menuCode="CONTRACT_SUCCESSION" permCode="UPDATE" size="small" danger
                  disabled={p.data.status === 'CANCELED'}
                  onClick={() => handleCancel(p.data.successionId)}
                >
                  취소
                </PermissionButton>
              ),
            },
          ]}
          loading={isLoading}
          height={600}
          rowKey="successionId"
        />
      </ProCard>

      <Modal title="계약 승계 등록" open={createOpen} onOk={handleCreate} onCancel={() => setCreateOpen(false)} okText="등록" cancelText="취소">
        <Form form={form} layout="vertical" initialValues={{ reason: 'TERMINATION' }}>
          <Form.Item name="contractId" label="계약 ID" rules={[{ required: true }]}>
            <InputNumber style={{ width: '100%' }} placeholder="contract_id" />
          </Form.Item>
          <Form.Item name="fromAgentId" label="전임 설계사 ID" rules={[{ required: true }]}>
            <InputNumber style={{ width: '100%' }} />
          </Form.Item>
          <Form.Item name="toAgentId" label="후임 설계사 ID" rules={[{ required: true }]}>
            <InputNumber style={{ width: '100%' }} />
          </Form.Item>
          <Form.Item name="successionDate" label="승계일" rules={[{ required: true }]}>
            <Input placeholder="YYYY-MM-DD" />
          </Form.Item>
          <Form.Item name="reason" label="사유" rules={[{ required: true }]}>
            <Select
              options={[
                { value: 'TERMINATION', label: '해촉' },
                { value: 'TRANSFER', label: '이관' },
                { value: 'REASSIGN', label: '재배정' },
              ]}
            />
          </Form.Item>
          <Form.Item name="memo" label="메모">
            <Input.TextArea rows={3} />
          </Form.Item>
        </Form>
      </Modal>
    </PageContainer>
  );
}
