import { useState } from 'react';
import { Alert, Form, Input, InputNumber, Modal, Space, Tag, Tabs, 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 dayjs from 'dayjs';
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 { operationApi, GradeEvalRuleRow, GradeEvalRow } from '@/api/operation';
import { GRAY, RADIUS, SHADOW } from '@/theme/tokens';

const cardStyle = { background: '#fff', borderRadius: RADIUS.lg, border: `1px solid ${GRAY[100]}`, boxShadow: SHADOW.sm };

const RULE_COLS: ColDef<GradeEvalRuleRow>[] = [
  { field: 'ruleId',        headerName: 'ID',       width: 80, type: 'numericColumn' },
  { field: 'gradeName',     headerName: '등급',     width: 120 },
  { field: 'minScore',      headerName: '최소점수', width: 120, type: 'numericColumn' },
  { field: 'effectiveFrom', headerName: '적용시작', width: 120 },
  { field: 'effectiveTo',   headerName: '적용종료', width: 120 },
];

const EVAL_COLS: ColDef<GradeEvalRow>[] = [
  { field: 'evalId',               headerName: 'ID',       width: 80, type: 'numericColumn' },
  { field: 'agentName',            headerName: '설계사',   width: 130 },
  { field: 'evalPeriod',           headerName: '평가기준월', width: 120 },
  { field: 'performanceScore',     headerName: '실적점수', width: 110, type: 'numericColumn' },
  { field: 'prevGradeName',        headerName: '기존등급', width: 110 },
  { field: 'evaluatedGradeName',   headerName: '산정등급', width: 110 },
  { field: 'status',               headerName: '상태',     width: 110,
    cellRenderer: (p: { value: string }) => (
      <Tag color={p.value === 'APPLIED' ? 'green' : 'blue'}>{p.value === 'APPLIED' ? '반영완료' : '평가완료'}</Tag>
    ) },
];

export default function GradeEvaluation() {
  const qc = useQueryClient();
  const [evalParams, setEvalParams] = useState<{ agentName?: string; evalPeriod?: string }>({});
  const [ruleModalOpen, setRuleModalOpen] = useState(false);
  const [evalModalOpen, setEvalModalOpen] = useState(false);
  const [editingRule, setEditingRule] = useState<GradeEvalRuleRow | null>(null);
  const [ruleForm] = Form.useForm();
  const [evalForm] = Form.useForm();

  const { data: rulesData, isLoading: rulesLoading, isError } = useQuery({
    queryKey: ['grade-eval', 'rules'],
    queryFn: () => operationApi.gradeEvalRules(),
    retry: false,
  });

  const { data: evalsData, isLoading: evalsLoading } = useQuery({
    queryKey: ['grade-eval', 'list', evalParams],
    queryFn: () => operationApi.gradeEvalList(evalParams),
    retry: false,
  });

  const rules = rulesData ?? [];
  const evals = evalsData?.list ?? [];

  const openRuleCreate = () => { setEditingRule(null); ruleForm.resetFields(); setRuleModalOpen(true); };
  const openRuleEdit = (row: GradeEvalRuleRow) => { setEditingRule(row); ruleForm.setFieldsValue(row); setRuleModalOpen(true); };

  const handleRuleSave = async () => {
    const values = await ruleForm.validateFields();
    try {
      if (editingRule) {
        await operationApi.gradeEvalRuleUpdate(editingRule.ruleId, values);
        message.success('수정 완료');
      } else {
        await operationApi.gradeEvalRuleCreate(values);
        message.success('등록 완료');
      }
      qc.invalidateQueries({ queryKey: ['grade-eval', 'rules'] });
      setRuleModalOpen(false);
    } catch { /* request.ts 처리 */ }
  };

  const handleRuleDelete = (id: number) => Modal.confirm({
    title: '룰 삭제', content: '삭제하시겠습니까?',
    onOk: async () => {
      await operationApi.gradeEvalRuleDelete(id);
      message.success('삭제 완료');
      qc.invalidateQueries({ queryKey: ['grade-eval', 'rules'] });
    },
  });

  const handleEvalCreate = async () => {
    const values = await evalForm.validateFields();
    try {
      await operationApi.gradeEvalCreate(values);
      message.success('평가 등록 완료');
      qc.invalidateQueries({ queryKey: ['grade-eval', 'list'] });
      setEvalModalOpen(false);
      evalForm.resetFields();
    } catch { /* request.ts 처리 */ }
  };

  const handleApply = (evalId: number) => Modal.confirm({
    title: '등급 반영', content: '산정 등급을 설계사에게 반영하시겠습니까?',
    onOk: async () => {
      await operationApi.gradeEvalApply(evalId);
      message.success('반영 완료');
      qc.invalidateQueries({ queryKey: ['grade-eval', 'list'] });
    },
  });

  const handleEvalDelete = (evalId: number) => Modal.confirm({
    title: '평가 삭제', content: '삭제하시겠습니까?',
    onOk: async () => {
      await operationApi.gradeEvalDelete(evalId);
      message.success('삭제 완료');
      qc.invalidateQueries({ queryKey: ['grade-eval', 'list'] });
    },
  });

  const ruleActionCol: ColDef<GradeEvalRuleRow> = {
    headerName: '액션', width: 170, pinned: 'right',
    cellRenderer: (p: { data: GradeEvalRuleRow }) => (
      <Space>
        <PermissionButton menuCode="GRADE_EVAL" permCode="UPDATE" size="small" onClick={() => openRuleEdit(p.data)}>수정</PermissionButton>
        <PermissionButton menuCode="GRADE_EVAL" permCode="DELETE" size="small" danger onClick={() => handleRuleDelete(p.data.ruleId)}>삭제</PermissionButton>
      </Space>
    ),
  };

  const evalActionCol: ColDef<GradeEvalRow> = {
    headerName: '액션', width: 190, pinned: 'right',
    cellRenderer: (p: { data: GradeEvalRow }) => (
      <Space>
        {p.data.status === 'EVALUATED' && (
          <PermissionButton menuCode="GRADE_EVAL" permCode="UPDATE" size="small" type="primary" onClick={() => handleApply(p.data.evalId)}>반영</PermissionButton>
        )}
        <PermissionButton menuCode="GRADE_EVAL" permCode="DELETE" size="small" danger onClick={() => handleEvalDelete(p.data.evalId)}>삭제</PermissionButton>
      </Space>
    ),
  };

  return (
    <PageContainer title="등급평가" description="설계사 실적 점수 기반 등급 산정">
      {isError && (
        <Alert type="warning" showIcon message="API 미응답" description="/api/grade-evaluations 를 확인하세요." style={{ marginBottom: 16 }} />
      )}

      <Tabs
        defaultActiveKey="rules"
        items={[
          {
            key: 'rules',
            label: '평가 룰',
            children: (
              <ProCard style={cardStyle}>
                <div style={{ marginBottom: 12 }}>
                  <PermissionButton menuCode="GRADE_EVAL" permCode="CREATE" type="primary" onClick={openRuleCreate}>
                    + 룰 등록
                  </PermissionButton>
                </div>
                <DataGrid<GradeEvalRuleRow>
                  rows={rules}
                  columns={[...RULE_COLS, ruleActionCol]}
                  loading={rulesLoading}
                  height={520}
                  rowKey="ruleId"
                />
              </ProCard>
            ),
          },
          {
            key: 'evals',
            label: '평가 목록',
            children: (
              <>
                <SearchForm
                  conditions={[
                    { type: 'text',  name: 'agentName',  label: '설계사명',   span: 6 },
                    { type: 'month', name: 'evalPeriod', label: '평가기준월', span: 6 },
                  ]}
                  onSearch={(v) => setEvalParams({ agentName: v.agentName as string, evalPeriod: v.evalPeriod as string })}
                  onReset={() => setEvalParams({})}
                />
                <ProCard style={cardStyle}>
                  <div style={{ marginBottom: 12 }}>
                    <PermissionButton menuCode="GRADE_EVAL" permCode="CREATE" type="primary" onClick={() => { evalForm.resetFields(); setEvalModalOpen(true); }}>
                      + 평가 등록
                    </PermissionButton>
                  </div>
                  <DataGrid<GradeEvalRow>
                    rows={evals}
                    columns={[...EVAL_COLS, evalActionCol]}
                    loading={evalsLoading}
                    height={520}
                    rowKey="evalId"
                  />
                </ProCard>
              </>
            ),
          },
        ]}
      />

      {/* 룰 등록/수정 모달 */}
      <Modal title={editingRule ? '룰 수정' : '룰 등록'} open={ruleModalOpen} onOk={handleRuleSave} onCancel={() => setRuleModalOpen(false)} okText="저장" cancelText="취소">
        <Form form={ruleForm} layout="vertical">
          <Form.Item name="gradeId" label="등급ID" rules={[{ required: true }]}>
            <InputNumber style={{ width: '100%' }} min={1} />
          </Form.Item>
          <Form.Item name="minScore" label="최소점수" rules={[{ required: true }]}>
            <InputNumber style={{ width: '100%' }} min={0} step={0.01} />
          </Form.Item>
          <Form.Item name="effectiveFrom" label="적용시작(YYYY-MM-DD)" rules={[{ required: true }]}>
            <Input placeholder="2025-01-01" />
          </Form.Item>
          <Form.Item name="effectiveTo" label="적용종료(YYYY-MM-DD)">
            <Input placeholder="2025-12-31" />
          </Form.Item>
        </Form>
      </Modal>

      {/* 평가 등록 모달 */}
      <Modal title="평가 등록" open={evalModalOpen} onOk={handleEvalCreate} onCancel={() => setEvalModalOpen(false)} okText="저장" cancelText="취소">
        <Form form={evalForm} layout="vertical">
          <Form.Item name="agentId" label="설계사ID" rules={[{ required: true }]}>
            <InputNumber style={{ width: '100%' }} min={1} />
          </Form.Item>
          <Form.Item name="evalPeriod" label="평가기준월(YYYYMM)" rules={[{ required: true }]}>
            <Input placeholder={dayjs().format('YYYYMM')} />
          </Form.Item>
          <Form.Item name="performanceScore" label="실적점수" rules={[{ required: true }]}>
            <InputNumber style={{ width: '100%' }} min={0} step={0.01} />
          </Form.Item>
        </Form>
      </Modal>
    </PageContainer>
  );
}
