import type { ReactNode } from "react";
import {
  type InitiativeDraft,
  type ApplicationFormState,
  type InitiativeFormState,
  ensureBanCamKet,
  isBanCamKetComplete,
  type ContributionDraftShape,
  formatDdMmYyyy,
  parseContributionSubmissionDateInput,
} from '@ump/shared';
import { ApplicationFormDocxPreview } from '@/components/applicant/initiative-draft/ApplicationFormDocxPreview';
export type { ContributionDraftShape } from '@ump/shared';

const Row = ({ label, value }: { label: string; value: ReactNode }) => (
  <div className="grid grid-cols-3 gap-3 py-1.5 border-b border-border/40">
    <dt className="text-sm text-muted-foreground col-span-1">{label}</dt>
    <dd className="text-sm col-span-2 whitespace-pre-wrap break-words">{value ?? '—'}</dd>
  </div>
);

function classificationLabel(c: string | null): string {
  if (c === 'technical') return 'Nhóm 1 — Giải pháp kỹ thuật / quản lý / tác nghiệp';
  if (c === 'research') return 'Nhóm 2.1 — Từ nghiên cứu khoa học';
  if (c === 'textbook') return 'Nhóm 2.2 — Từ sách, giáo trình';
  return '—';
}

function researchKindLabel(k: string): string {
  if (k === 'international') return 'Tạp chí quốc tế';
  if (k === 'domestic') return 'Tạp chí trong nước';
  if (k === 'poster') return 'Poster / hội nghị có phản biện';
  if (k === 'poster-without-review') return 'Poster / hội nghị không phản biện';
  return k || '—';
}

function formatContributionDate(input: string | Date | undefined): string {
  if (!input) return '—';
  const d = input instanceof Date ? input : parseContributionSubmissionDateInput(input);
  if (!d || Number.isNaN(d.getTime())) return '—';
  return formatDdMmYyyy(d);
}

interface ReviewSnapshotSectionsProps {
  draft: InitiativeDraft;
  contribution: ContributionDraftShape;
  caseId?: string;
  onSaveAllDrafts?: (payload: {
    report: Record<string, unknown>;
    application: Record<string, unknown>;
    contribution: Record<string, unknown>;
  }) => Promise<void>;
  /** Hội đồng: thay footer ứng viên (Lưu / Gửi) bằng Từ chối / Kho minh chứng / Duyệt. */
  docxStaffFooter?: ReactNode;
}

/**
 * Read-only snapshot of every scalar / table field edited in Đơn, Báo cáo, and Xác nhận đóng góp
 * (aligned with {@link buildDocxTemplateExportBundle} / full JSON exports).
 */
export function ReviewSnapshotSections({
  draft,
  contribution,
  caseId,
  onSaveAllDrafts,
  docxStaffFooter,
}: ReviewSnapshotSectionsProps) {
  const a = draft.application as unknown as ApplicationFormState;
  const r = draft.report as unknown as InitiativeFormState;
  const c = contribution;

  const evidenceNames = [a.textbookEvidenceFile, a.researchEvidenceFile, a.technicalEvidenceFile]
    .filter(Boolean)
    .map((h) => h!.name)
    .join(', ');

  return (
    <div className="space-y-8">
      <ApplicationFormDocxPreview
        draft={draft}
        contribution={c}
        caseId={caseId}
        onSaveAllDrafts={docxStaffFooter ? undefined : onSaveAllDrafts}
        docxStaffFooter={docxStaffFooter}
      />

      {/* <section>
        <h3 className="font-bold mb-2">Đơn đề nghị công nhận sáng kiến</h3>
        <dl>
          <Row label="Đơn vị" value={a.unitName} />
          <Row
            label="Tác giả (danh sách)"
            value={
              <ul className="list-disc pl-5 space-y-2">
                {a.authors.map((x) => (
                  <li key={x.id}>
                    <span className="font-medium">{x.name || '—'}</span>
                    <br />
                    <span className="text-muted-foreground text-xs">
                      Ngày sinh: {x.dob || '—'} · Nơi CT: {x.workplace || '—'} · Chức danh: {x.title || '—'} ·
                      Trình độ: {x.qualification || '—'} · %: {x.contributionPercent}
                    </span>
                  </li>
                ))}
              </ul>
            }
          />
          <Row label="Tên sáng kiến" value={a.initiativeName} />
          <Row label="Chủ đầu tư" value={a.investorName} />
          <Row label="Lĩnh vực áp dụng" value={a.applicationField} />
          <Row label="Ngày áp dụng lần đầu" value={a.firstApplyDate} />
          <Row label="Phân loại" value={classificationLabel(a.initiativeClassification)} />
          <Row label="Loại minh chứng (nghiên cứu)" value={researchKindLabel(a.researchEvidenceKind)} />
          <Row
            label="Bản cam kết tác giả (bài báo QT)"
            value={(() => {
              const bck = ensureBanCamKet(a.banCamKet);
              if (isBanCamKetComplete(bck)) {
                return (
                  <ul className="list-disc pl-5 space-y-1 text-sm">
                    <li>
                      Ngày ký: {bck.ngay_ky.ngay}/{bck.ngay_ky.thang}/{bck.ngay_ky.nam}
                    </li>
                    <li>Tác giả đăng ký: {bck.tac_gia_dang_ky}</li>
                    <li>CCCD/HC: {bck.cccd}</li>
                    <li>Đơn vị: {bck.don_vi}</li>
                    <li>Tên bài báo: {bck.ten_bai_bao}</li>
                    <li>Năm xét: {bck.nam_xet}</li>
                    <li>
                      Vai trò:{' '}
                      {bck.vai_tro.tac_gia_chinh
                        ? 'Tác giả chính'
                        : bck.vai_tro.dong_tac_gia
                          ? 'Đồng tác giả'
                          : '—'}
                    </li>
                    <li>Người cam kết: {bck.nguoi_cam_ket}</li>
                  </ul>
                );
              }
              return a.internationalJournalDeclaration?.trim() || '—';
            })()}
          />
          <Row label="Minh chứng PDF (tên file)" value={evidenceNames || '—'} />
          <Row label="Nội dung của sáng kiến (§4)" value={a.contentSummary} />
          <Row label="Thông tin bảo mật" value={a.confidentialInfo} />
          <Row label="Điều kiện áp dụng (Đơn)" value={a.conditions} />
          <Row label="Đánh giá lợi ích (tác giả)" value={a.authorEvaluation} />
          <Row label="Đánh giá (đơn vị thử)" value={a.trialEvaluation} />
          <Row
            label="Người hỗ trợ áp dụng thử"
            value={
              a.supportStaff.length === 0 ? (
                '—'
              ) : (
                <ul className="list-disc pl-5 space-y-1">
                  {a.supportStaff.map((x) => (
                    <li key={x.id}>
                      {x.name} — {x.dob} · {x.workplace} · {x.title} · {x.qualification}: {x.supportContent}
                    </li>
                  ))}
                </ul>
              )
            }
          />
          <Row
            label="Ngày ký đơn (ngày / tháng / năm)"
            value={`${a.submissionDay} / ${a.submissionMonth} / ${a.submissionYear}`}
          />
        </dl>
      </section> */}

      {/* <section>
        <h3 className="font-bold mb-2">Báo cáo mô tả sáng kiến</h3>
        <dl>
          <Row label="Mở đầu (§1)" value={r.introduction} />
          <Row label="Tên sáng kiến (báo cáo)" value={r.initiativeName} />
          <Row label="Tác giả đại diện" value={r.representativeAuthor} />
          <Row label="Điện thoại" value={r.representativePhone} />
          <Row label="Email" value={r.representativeEmail} />
          <Row label="Lĩnh vực áp dụng" value={r.applicationField} />
          <Row label="Hiện trạng / giải pháp đã biết (§4.1)" value={r.currentStatus} />
          <Row label="Mục đích (§4.2)" value={r.purpose} />
          <Row label="Nội dung giải pháp" value={r.solutionContent} />
          <Row label="Các bước thực hiện" value={r.implementationSteps} />
          <Row label="Đơn vị áp dụng lần đầu" value={r.firstAppliedUnit} />
          <Row label="Điều kiện (báo cáo)" value={r.conditions} />
          <Row label="Kết quả thu được" value={r.achievedResult} />
          <Row
            label="Đơn vị / cá nhân áp dụng thử"
            value={
              r.trialUnits.length === 0 ? (
                '—'
              ) : (
                <ul className="list-disc pl-5">
                  {r.trialUnits.map((u) => (
                    <li key={u.id}>
                      {u.name} — {u.address} · {u.field}
                    </li>
                  ))}
                </ul>
              )
            }
          />
          <Row label="Tính mới" value={r.novelty} />
          <Row label="Hiệu quả — Kinh tế" value={r.effectiveness.economic} />
          <Row label="Hiệu quả — Xã hội / nhận thức" value={r.effectiveness.social} />
          <Row label="Hiệu quả — Giảng dạy / công việc" value={r.effectiveness.teaching} />
          <Row label="Hiệu quả — Năng suất" value={r.effectiveness.productivity} />
          <Row label="Hiệu quả — Chất lượng" value={r.effectiveness.quality} />
          <Row label="Hiệu quả — Môi trường" value={r.effectiveness.environment} />
          <Row label="Hiệu quả — An toàn" value={r.effectiveness.safety} />
          <Row label="Thông tin bảo mật (báo cáo)" value={r.confidentialInfo} />
          <Row label="Ngày nộp (báo cáo)" value={r.submissionDate} />
          <Row label="Tác giả ký (báo cáo)" value={r.authorName} />
        </dl>
      </section> */}

      {/* <section>
        <h3 className="font-bold mb-2">Bản xác nhận tỷ lệ đóng góp</h3>
        <dl>
          <Row label="Tên sáng kiến" value={c.initiativeName ?? '—'} />
          <Row label="Tác giả chính / đại diện" value={c.mainAuthor ?? '—'} />
          <Row label="Chức vụ / đơn vị công tác" value={c.position ?? '—'} />
          <Row
            label="Tỷ lệ đóng góp đại diện (%)"
            value={typeof c.representativePercent === 'number' ? `${c.representativePercent}%` : '—'}
          />
          <Row label="Ngày nộp" value={formatContributionDate(c.submissionDate)} />
          <Row
            label="Xác nhận chữ ký số"
            value={c.digitalSignatureConfirmed ? 'Đã xác nhận' : 'Chưa xác nhận'}
          />
          <Row
            label="Danh sách tỷ lệ (tab xác nhận)"
            value={
              c.participants && c.participants.length > 0 ? (
                <ul className="list-disc pl-5">
                  {c.participants.map((p) => (
                    <li key={p.id}>
                      {p.fullName || '—'} — {p.workUnit || '—'} ({p.contributionPercent ?? 0}%)
                    </li>
                  ))}
                </ul>
              ) : a.authors?.length ? (
                <>
                  <p className="text-xs text-muted-foreground mb-1 italic">
                    Chưa có dòng trong bản nháp xác nhận — hiển thị tác giả từ Đơn:
                  </p>
                  <ul className="list-disc pl-5">
                    {a.authors.map((x) => (
                      <li key={x.id}>
                        {x.name} — {x.workplace} ({x.contributionPercent}%)
                      </li>
                    ))}
                  </ul>
                </>
              ) : (
                '—'
              )
            }
          />
        </dl>
      </section> */}
    </div>
  );
}
