{% extends "base.html" %}
{% block title %}Báo cáo tuân thủ{% endblock %}
{% block page_subtitle %}Báo cáo tuân thủ giao dịch vàng{% endblock %}
{% block extra_style %}
.tt-bang{border-collapse:separate;border-spacing:0}
.tt-bang th{padding:8px 10px;font-size:12px;font-weight:700;color:#6b7280;background:#faf7f0;white-space:nowrap}
.tt-bang th:first-child{border-top-left-radius:10px}.tt-bang th:last-child{border-top-right-radius:10px}
.tt-bang td{padding:8px 10px;white-space:nowrap;vertical-align:top}
.tt-bang tbody tr:hover td{background:#fffaf0}
{% endblock %}
{% block content %}
{% include '_tab_bao_cao.html' %}
<form class="ios-card p-4 flex flex-wrap items-end gap-3" method="get">
  <input type="date" name="tu" value="{{ tu }}" class="input-ios-sm" placeholder="Từ ngày" aria-label="Từ ngày">
  <input type="date" name="den" value="{{ den }}" class="input-ios-sm" placeholder="Đến ngày" aria-label="Đến ngày">
  <button class="tkt-act tkt-blue">Xem</button>
  <a class="tkt-act tkt-emerald" href="/api/tuan-thu/xuat-400?tu={{ tu }}&den={{ den }}">⬇️ Xuất Excel giao dịch từ 400 triệu</a>
</form>

<div class="ios-card p-4 mt-3">
  <div class="font-bold text-gray-800">🧾 Bảng kê mua vào không có hóa đơn — mẫu 02/TNDN</div>
  <div class="text-xs text-gray-500 mt-1">Lập từ phiếu mua hàng của cá nhân trong tháng (người bán, địa chỉ, CCCD, mặt hàng,
    số lượng, đơn giá, thành tiền). Mẫu theo Thông tư 20/2026/TT-BTC — kế toán nên đối chiếu mẫu gốc trước khi nộp.</div>
  <div class="flex gap-2 items-end mt-2 flex-wrap">
    <label class="text-sm">Tháng<br><input id="bk-thang" value="{{ thang }}" class="input-ios-sm" placeholder="YYYY-MM" style="width:110px"></label>
    <button class="tkt-act tkt-emerald" onclick="xuatBangKe02()">⬇️ Xuất bảng kê 02/TNDN</button>
  </div>
  <div id="bk-thong-bao" class="text-sm mt-2" role="status" aria-live="polite"></div>
</div>

<div class="ios-card p-4 mt-3">
  <div class="font-bold text-gray-800">⚠️ Trả tiền mặt khi khách giao dịch từ 20 triệu/ngày ({{ bc.vi_pham_20|length }})</div>
  <div class="text-xs text-gray-500 mb-2">NĐ 232/2025: mua, bán vàng từ 20 triệu đồng/ngày/khách phải thanh toán qua tài khoản.</div>
  <div class="overflow-x-auto"><table class="w-full text-sm tt-bang">
    <thead><tr class="text-left text-gray-500"><th>Ngày</th><th>Khách</th><th>CCCD/SĐT</th><th class="text-right">Tổng trong ngày</th><th class="text-right">Tiền mặt</th><th>Mã phiếu</th></tr></thead>
    <tbody>
    {% for g in bc.vi_pham_20 %}
      <tr class="border-t"><td>{{ g.ngay }}</td><td>{{ g.khach }}</td><td>{{ g.cccd or g.sdt }}</td>
        <td class="text-right tabular-nums">{{ '{:,.0f}'.format(g.tong).replace(',', '.') }}đ</td>
        <td class="text-right tabular-nums text-red-700">{{ '{:,.0f}'.format(g.tien_mat).replace(',', '.') }}đ</td>
        <td class="text-xs">{{ g.ma }}</td></tr>
    {% else %}<tr><td colspan="6" class="text-green-700 py-2">✓ Không có.</td></tr>{% endfor %}
    </tbody></table></div>
</div>

<div class="ios-card p-4 mt-3">
  <div class="font-bold text-gray-800">💰 Danh sách theo dõi nội bộ: giao dịch từ 400 triệu ({{ bc.tren_400|length }}) · khách cộng dồn trong ngày từ 400 triệu ({{ bc.khach_ngay_400|length }})</div>
  <div class="text-xs text-gray-500 mb-2">Danh sách này hỗ trợ rà soát nội bộ, không thay thế báo cáo pháp định. Kế toán/luật sư cần xác nhận đơn vị, giao dịch và phương thức thanh toán nào thuộc diện báo cáo theo quy định.</div>
  <div class="overflow-x-auto"><table class="w-full text-sm tt-bang">
    <thead><tr class="text-left text-gray-500"><th>Ngày giờ</th><th>Mã</th><th>Loại</th><th>Khách</th><th>CCCD</th><th class="text-right">Giá trị</th></tr></thead>
    <tbody>
    {% for g in bc.tren_400 %}
      <tr class="border-t"><td>{{ g.ngay }}</td><td>{{ g.ma }}</td><td>{{ g.loai }}</td><td>{{ g.khach }}</td><td>{{ g.cccd }}</td>
        <td class="text-right tabular-nums">{{ '{:,.0f}'.format(g.gia_tri).replace(',', '.') }}đ</td></tr>
    {% else %}<tr><td colspan="6" class="text-gray-500 py-2">Không có giao dịch đơn lẻ từ 400 triệu.</td></tr>{% endfor %}
    {% for g in bc.khach_ngay_400 %}
      <tr class="border-t bg-amber-50"><td>{{ g.ngay }}</td><td class="text-xs">{{ g.ma }}</td><td>{{ g.so_gd }} giao dịch</td><td>{{ g.khach }}</td><td>{{ g.cccd }}</td>
        <td class="text-right tabular-nums">{{ '{:,.0f}'.format(g.tong).replace(',', '.') }}đ</td></tr>
    {% endfor %}
    </tbody></table></div>
</div>
<script>
async function xuatBangKe02() {
  const thongBao = document.getElementById('bk-thong-bao');
  const thang = document.getElementById('bk-thang').value;
  const res = await fetch('/api/tuan-thu/bang-ke-02?thang=' + encodeURIComponent(thang));
  if (!res.ok) {
    const data = await res.json().catch(() => ({}));
    thongBao.textContent = data.message || 'Không thể xuất bảng kê 02/TNDN.';
    thongBao.className = 'text-sm mt-2 text-red-700';
    return;
  }
  const url = URL.createObjectURL(await res.blob());
  const a = document.createElement('a');
  a.href = url;
  a.download = 'Bảng kê 02-TNDN tháng ' + thang + '.xlsx';
  a.click();
  URL.revokeObjectURL(url);
  thongBao.textContent = 'Đã tải bảng kê 02/TNDN.';
  thongBao.className = 'text-sm mt-2 text-green-700';
}
</script>
{% endblock %}