{{define "admin/source_inquiries.html"}}
{{template "admin_shell_open" .}}
<div class="cs-admin-page">
{{template "admin_pagehead" (dict "Icon" "bx-cart" "Title" (T "admin.source_inquiries.title") "Desc" (T "admin.source_inquiries.desc"))}}

<div class="card cs-admin-section cs-admin-section--toolbar mb-3">
  <div class="cs-admin-section__body py-3">
    <form class="row g-2 align-items-end" method="get" action="/admin/source-inquiries">
      <div class="col-12 col-md-5">
        <label class="form-label small mb-0 text-muted">{{T "admin.source_inquiries.keyword"}}</label>
        <input type="text" class="form-control form-control-sm" name="keyword" value="{{.Data.Keyword}}" placeholder="{{T "admin.source_inquiries.keyword_ph"}}">
      </div>
      <div class="col-6 col-md-2">
        <label class="form-label small mb-0 text-muted">{{T "admin.source_inquiries.status"}}</label>
        <select class="form-select form-select-sm" name="status">
          <option value="">{{T "admin.source_inquiries.all"}}</option>
          <option value="1" {{if eq .Data.StatusFilter "1"}}selected{{end}}>{{T "admin.source_inquiries.status_pending"}}</option>
          <option value="2" {{if eq .Data.StatusFilter "2"}}selected{{end}}>{{T "admin.source_inquiries.status_processing"}}</option>
          <option value="3" {{if eq .Data.StatusFilter "3"}}selected{{end}}>{{T "admin.source_inquiries.status_closed"}}</option>
        </select>
      </div>
      <div class="col-12 col-md-auto">
        <button type="submit" class="btn btn-primary btn-sm"><i class="bx bx-search"></i> {{T "admin.source_inquiries.filter"}}</button>
      </div>
    </form>
  </div>
</div>

<div class="card cs-admin-section">
  <div class="cs-admin-section__body cs-admin-section__body--flush"><div class="table-responsive" data-nc-privacy-menu>
    <table class="table table-sm align-middle mb-0">
      <thead class="table-light">
        <tr>
          <th>{{T "admin.source_inquiries.col_id"}}</th>
          <th>{{T "admin.source_inquiries.col_user"}}</th>
          <th>{{T "admin.source_inquiries.col_contact"}}</th>
          <th>{{T "admin.source_inquiries.col_summary"}}</th>
          <th>{{T "admin.source_inquiries.col_ip"}}</th>
          <th>{{T "admin.source_inquiries.col_status"}}</th>
          <th>{{T "admin.source_inquiries.col_created"}}</th>
          <th class="text-end">{{T "admin.source_inquiries.col_actions"}}</th>
        </tr>
      </thead>
      <tbody>
        {{range .Data.Rows}}
        <tr class="admin-srcinq-row" data-id="{{index . "id"}}" style="cursor:pointer">
          <td><code class="small">{{index . "id"}}</code></td>
          <td class="small">#{{index . "user_id"}} {{privacy "username" (index . "user_name")}}</td>
          <td class="small text-break" style="max-width:140px">{{privacy "text" (index . "contact")}}</td>
          <td class="small text-muted" style="max-width:260px">{{index . "description_preview"}}</td>
          <td class="small font-monospace">{{privacy "ip" (index . "ip")}}</td>
          <td><span class="badge bg-{{index . "status_class"}}">{{index . "status_text"}}</span></td>
          <td class="small text-muted">{{index . "created_at_str"}}</td>
          <td class="text-end">
            <button type="button" class="btn btn-sm btn-outline-primary js-admin-srcinq-open" data-id="{{index . "id"}}">{{T "admin.source_inquiries.btn_detail"}}</button>
          </td>
        </tr>
        {{else}}
        <tr><td colspan="8" class="text-center text-muted py-4">{{T "admin.source_inquiries.empty"}}</td></tr>
        {{end}}
      </tbody>
    </table>
  </div></div></div>

{{$pg := .Data.Page}}{{$tp := .Data.TotalPages}}
{{if or (gt $pg 1) (gt $tp 1)}}
<nav class="mt-3 d-flex flex-wrap justify-content-between align-items-center gap-2">
  <span class="small text-muted">{{T "admin.source_inquiries.total_prefix"}} {{.Data.Total}} {{T "admin.source_inquiries.total_suffix"}}</span>
  <div class="btn-group btn-group-sm">
    {{if gt $pg 1}}
    <a class="btn btn-outline-secondary" href="/admin/source-inquiries?page={{sub $pg 1}}{{if $.Data.Keyword}}&keyword={{urlEncode $.Data.Keyword}}{{end}}{{if $.Data.StatusFilter}}&status={{urlEncode $.Data.StatusFilter}}{{end}}">{{T "admin.source_inquiries.prev"}}</a>
    {{end}}
    <span class="btn btn-outline-secondary disabled">{{T "admin.source_inquiries.page_prefix"}} {{$pg}} {{T "admin.source_inquiries.page_mid"}} {{$tp}} {{T "admin.source_inquiries.page_suffix"}}</span>
    {{if lt $pg $tp}}
    <a class="btn btn-outline-secondary" href="/admin/source-inquiries?page={{add $pg 1}}{{if $.Data.Keyword}}&keyword={{urlEncode $.Data.Keyword}}{{end}}{{if $.Data.StatusFilter}}&status={{urlEncode $.Data.StatusFilter}}{{end}}">{{T "admin.source_inquiries.next"}}</a>
    {{end}}
  </div>
</nav>
{{end}}

<div class="modal fade" id="adminSrcInqModal" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog modal-lg modal-dialog-scrollable">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title"><i class="bx bx-cart-alt me-1"></i>{{T "admin.source_inquiries.modal_title"}}</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
      </div>
      <div class="modal-body" id="adminSrcInqModalBody">
        <p class="text-muted">{{T "admin.source_inquiries.loading"}}</p>
      </div>
    </div>
  </div>
</div>

<script>
(function () {
  var L = {
    loading: {{jsString (T "admin.source_inquiries.loading")}},
    loadFailed: {{jsString (T "admin.source_inquiries.load_failed")}},
    contact: {{jsString (T "admin.source_inquiries.label_contact")}},
    desc: {{jsString (T "admin.source_inquiries.label_desc")}},
    status: {{jsString (T "admin.source_inquiries.label_status")}},
    stPending: {{jsString (T "admin.source_inquiries.status_pending")}},
    stProcessing: {{jsString (T "admin.source_inquiries.status_processing")}},
    stClosed: {{jsString (T "admin.source_inquiries.status_closed")}},
    saveStatus: {{jsString (T "admin.source_inquiries.btn_save_status")}},
    saved: {{jsString (T "admin.source_inquiries.saved")}},
    failed: {{jsString (T "admin.source_inquiries.failed")}}
  };
  function esc(s) {
    if (s == null) return '';
    return String(s).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;');
  }
  function toastOk(msg) {
    if (window.layer && layer.msg) layer.msg(msg, { icon: 1 });
    else alert(msg);
  }
  function toastErr(msg) {
    if (window.layer && layer.msg) layer.msg(msg, { icon: 2 });
    else alert(msg);
  }
  function loadInquiry(id) {
    var $body = $('#adminSrcInqModalBody');
    $body.html('<p class="text-muted">' + L.loading + '</p>');
    $.getJSON('/admin/source-inquiries/detail?id=' + encodeURIComponent(id), function (res) {
      if (!res || !res.success || !res.data || !res.data.inquiry) {
        $body.html('<p class="text-danger">' + L.loadFailed + '</p>');
        return;
      }
      var q = res.data.inquiry;
      var html = '';
      html += '<div class="mb-2"><span class="badge bg-' + esc(q.status_class) + '">' + esc(q.status_text) + '</span></div>';
      var wrap = (window.NCPrivacy && NCPrivacy.wrapHTML) ? function (kind, v) { return NCPrivacy.wrapHTML(kind, v || ''); } : function (_k, v) { return esc(v || ''); };
      html += '<p class="small text-muted mb-2">#' + esc(String(q.id)) + ' · #' + esc(String(q.user_id)) + ' ' + (q.user_name ? wrap('username', String(q.user_name)) : '') + ' · ' + esc(q.created_at_str) + '</p>';
      html += '<div class="mb-3"><div class="fw-semibold small mb-1">' + L.contact + '</div>';
      html += '<div class="border rounded p-2 bg-light small" style="white-space:pre-wrap;word-break:break-word;">' + (q.contact ? wrap('text', q.contact) : '') + '</div></div>';
      html += '<div class="mb-3"><div class="fw-semibold small mb-1">' + L.desc + '</div>';
      html += '<div class="border rounded p-2 bg-light small" style="white-space:pre-wrap;word-break:break-word;">' + esc(q.description) + '</div></div>';
      html += '<div class="small text-muted mb-3 font-monospace">IP ' + (q.ip ? wrap('ip', q.ip) : '-') + '<br><span class="text-break">' + esc(q.user_agent || '-') + '</span></div>';
      html += '<hr><div class="d-flex flex-nowrap gap-2 align-items-center adm-srcinq-modal-actions">';
      html += '<label class="small mb-0 me-1 flex-shrink-0">' + L.status + '</label>';
      html += '<select class="form-select form-select-sm adm-srcinq-status-select" id="admSrcInqStatus">';
      html += '<option value="1"' + (String(q.status) === '1' ? ' selected' : '') + '>' + L.stPending + '</option>';
      html += '<option value="2"' + (String(q.status) === '2' ? ' selected' : '') + '>' + L.stProcessing + '</option>';
      html += '<option value="3"' + (String(q.status) === '3' ? ' selected' : '') + '>' + L.stClosed + '</option>';
      html += '</select>';
      html += '<button type="button" class="btn btn-primary btn-sm flex-shrink-0" id="admSrcInqStatusBtn" data-id="' + esc(String(q.id)) + '">' + L.saveStatus + '</button>';
      html += '</div>';
      $body.html(html);
      $('#admSrcInqStatusBtn').on('click', function () {
        var qid = $(this).data('id');
        var st = $('#admSrcInqStatus').val();
        $.ajax({
          url: '/admin/source-inquiries/status',
          type: 'POST',
          data: { inquiry_id: qid, status: st },
          dataType: 'json',
          success: function (r2) {
            if (r2 && r2.success) {
              toastOk(L.saved);
              var el = document.getElementById('adminSrcInqModal');
              if (el && bootstrap.Modal.getInstance(el)) bootstrap.Modal.getInstance(el).hide();
              location.reload();
            } else {
              toastErr((r2 && r2.message) || L.failed);
            }
          },
          error: function (xhr) {
            var m = L.failed;
            try { var j = JSON.parse(xhr.responseText); if (j.message) m = j.message; } catch (e) {}
            toastErr(m);
          }
        });
      });
    }).fail(function () {
      $body.html('<p class="text-danger">' + L.loadFailed + '</p>');
    });
  }
  $(document).on('click', '.js-admin-srcinq-open', function (e) {
    e.stopPropagation();
    var id = $(this).data('id');
    if (!id) return;
    loadInquiry(id);
    var m = document.getElementById('adminSrcInqModal');
    if (m && window.bootstrap) new bootstrap.Modal(m).show();
  });
  $(document).on('click', '.admin-srcinq-row', function () {
    var id = $(this).data('id');
    if (!id) return;
    loadInquiry(id);
    var m = document.getElementById('adminSrcInqModal');
    if (m && window.bootstrap) new bootstrap.Modal(m).show();
  });
})();
</script>
</div>
{{template "admin_shell_close" .}}
{{end}}