/*
 * MC Report System
 * Copyright (C) 2026 Sea Network Technology Studio
 * Author: CangLan <admin@sea-studio.top>
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Affero General Public License as published
 * by the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU Affero General Public License for more details.
 *
 * You should have received a copy of the GNU Affero General Public License
 * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */

const TrackingPage = {
  async render() { return '<div class="loading"><i class="fas fa-spinner"></i></div>'; },

  mount() {
    const ct = document.getElementById('page-content');
    document.getElementById('page-title').textContent = '追踪工单';
    document.getElementById('page-actions').innerHTML = '';

    const token = document.cookie.split('; ').find(r => r.startsWith('tracking_token='))?.split('=')[1] || '';

    ct.innerHTML = `
      <div class="card"><div class="card-b">
        <div class="form-group"><label>追踪标识 (从Cookie自动读取)</label><input id="track-token" value="${token}"></div>
        <button class="btn btn-p" onclick="TrackingPage.search()"><i class="fas fa-search"></i> 查询</button>
        <div id="track-result" class="mt-4"></div>
      </div></div>
    `;
  },

  async search() {
    const token = document.getElementById('track-token').value.trim();
    if (!token) return alert('请输入追踪标识');
    const ct = document.getElementById('track-result');
    U.loading(ct);
    try {
      const tickets = await API.get(`/tickets/tracking?token=${token}`);
      ct.innerHTML = tickets.length ? `
        <div class="table-wrap"><table><thead><tr><th>#</th><th>类型</th><th>标题</th><th>状态</th><th>时间</th></tr></thead><tbody>${tickets.map(t => `
          <tr>
            <td>${t.id}</td><td>${U.badge(t.type,'type')}</td>
            <td><strong>${U.esc(t.title)}</strong></td>
            <td>${U.badge(t.status,'status')}</td><td class="ts">${U.date(t.created_at)}</td>
          </tr>`).join('')}</tbody></table></div>
        <p class="tm ts mt-4">如需获取更详细的跟踪和回复通知，请<a href="#/register" style="color:var(--p)">注册账号</a></p>
      ` : '<div class="empty"><i class="fas fa-inbox"></i><p>未找到工单</p></div>';
    } catch (e) { ct.innerHTML = `<div class="alert alert-e">${e.message}</div>`; }
  }
};