82 lines
4.7 KiB
JavaScript
82 lines
4.7 KiB
JavaScript
const HomePage = {
|
||
async render(tab) {
|
||
const t = tab || 'report';
|
||
return `<div id="home-content" style="max-width:800px;margin:0 auto;padding:30px 0">
|
||
<div class="tab-nav">
|
||
<button class="${t==='report'?'active':''}" data-tab="report"><i class="fas fa-flag"></i> 銝暹𥁒</button>
|
||
<button class="${t==='suggestion'?'active':''}" data-tab="suggestion"><i class="fas fa-lightbulb"></i> 撱箄悅</button>
|
||
<button class="${t==='appeal'?'active':''}" data-tab="appeal"><i class="fas fa-gavel"></i> <20>唾<EFBFBD></button>
|
||
<button class="${t==='tracking'?'active':''}" data-tab="tracking"><i class="fas fa-search"></i> 餈質葵</button>
|
||
</div>
|
||
<div id="home-tab"></div>
|
||
</div>`;
|
||
},
|
||
|
||
mount(tab) {
|
||
const t = tab || 'report';
|
||
const tabBtns = document.querySelectorAll('.tab-nav button');
|
||
const tabContent = document.getElementById('home-tab');
|
||
|
||
function switchContent(type) {
|
||
if (type === 'tracking') renderTracking(tabContent);
|
||
else TicketCreate.render(tabContent, { type, prefill: {}, backLink: null });
|
||
}
|
||
|
||
function renderTracking(ct) {
|
||
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>餈質葵<E8B3AA><E891B5><EFBFBD> (Cookie<69>芸𢆡霂餃<E99C82>)</label>
|
||
<input id="track-token" value="${token || ''}" placeholder="蝎䁅斐餈質葵<E8B3AA><E891B5><EFBFBD>">
|
||
</div>
|
||
<button class="btn btn-p" onclick="HomePage.searchTracking()"><i class="fas fa-search"></i> <20>交𪄳<E4BAA4>𤑳<EFBFBD>撌亙<E6928C></button>
|
||
<div id="track-result" class="mt-4"></div>
|
||
</div></div>`;
|
||
}
|
||
|
||
tabBtns.forEach(b => b.onclick = () => App.navigate('home', b.dataset.tab));
|
||
switchContent(t);
|
||
|
||
this.searchTracking = async () => {
|
||
const token = document.getElementById('track-token').value.trim();
|
||
if (!token) return alert('霂瑁<E99C82><E79181>亥蕭頦芣<E9A0A6>霂?);
|
||
const ct = document.getElementById('track-result');
|
||
ct.innerHTML = '<div class="loading"><i class="fas fa-spinner"></i></div>';
|
||
try {
|
||
const tickets = await API.get(`/tickets/tracking?token=${token}`);
|
||
ct.innerHTML = tickets.length ? `
|
||
<div class="table-wrap"><table><thead><tr>
|
||
<th>#</th><th>蝐餃<E89D90></th><th><3E><><EFBFBD></th><th><3E>嗆<EFBFBD>?/th><th><3E>園𡢿</th><th><3E>滢<EFBFBD></th>
|
||
</tr></thead><tbody>${tickets.map(tick => `
|
||
<tr><td>${tick.id}</td><td>${U.badge(tick.type,'type')}</td><td>${U.esc(tick.title)}</td>
|
||
<td>${U.badge(tick.status,'status')}</td><td>${U.date(tick.created_at)}</td>
|
||
<td><button class="btn btn-o btn-sm" onclick="App.navigate('home','tracking');HomePage.showTrackDetail(${tick.id},'${U.escJs(token)}')"><3E>亦<EFBFBD></button></td></tr>
|
||
`).join('')}</tbody></table></div>` : '<div class="empty"><i class="fas fa-inbox"></i><p><3E>芣𪄳<E88AA3>啣極<E595A3>?/p></div>';
|
||
} catch (ex) { ct.innerHTML = `<div class="alert alert-e">${ex.message}</div>`; }
|
||
};
|
||
},
|
||
|
||
showTrackDetail(id, token) {
|
||
U.modal(`撌亙<EFBFBD> #${id}`, `<div id="track-detail-content"></div>`, '700px');
|
||
const ct = document.getElementById('track-detail-content');
|
||
U.loading(ct);
|
||
API.get(`/tickets/tracking?token=${token}`).then(tickets => {
|
||
const t = tickets.find(x => x.id === id);
|
||
if (!t) { ct.innerHTML = '<p><3E>芣𪄳<E88AA3>?/p>'; return; }
|
||
ct.innerHTML = `
|
||
<div class="detail-section"><h4><3E>箸𧋦靽⊥<E99DBD></h4>
|
||
<div class="detail-row"><span class="lbl"><3E><><EFBFBD></span><span class="val fb">${U.esc(t.title)}</span></div>
|
||
<div class="detail-row"><span class="lbl">蝐餃<E89D90></span><span class="val">${U.badge(t.type,'type')}</span></div>
|
||
<div class="detail-row"><span class="lbl"><3E>嗆<EFBFBD>?/span><span class="val">${U.badge(t.status,'status')}</span></div>
|
||
<div class="detail-row"><span class="lbl"><3E>𣂷漱<F0A382B7>?/span><span class="val">${U.esc(t.reporter_game_name)} (UID: ${U.esc(t.reporter_game_uid)})</span></div>
|
||
${t.type==='report'?`
|
||
<div class="detail-row"><span class="lbl">鋡思蜀<E6809D>乩犖</span><span class="val">${U.esc(t.target_game_name||'?')} (UID: ${U.esc(t.target_game_uid||'?')})</span></div>
|
||
<div class="detail-row"><span class="lbl"><3E>笔<EFBFBD></span><span class="val">${U.esc(t.reason)}</span></div>`:''}
|
||
${t.description?`<div class="detail-row"><span class="lbl">霂行<E99C82></span><span class="val">${U.esc(t.description)}</span></div>`:''}
|
||
<div class="detail-row"><span class="lbl"><3E>園𡢿</span><span class="val">${U.date(t.created_at)}</span></div>
|
||
</div>
|
||
<p class="tm ts">憒<><E68692><EFBFBD>𧼮<EFBFBD>嚗諹窈<a href="#/register" style="color:var(--p)">瘜典<E7989C>韐血噡</a><3E>𤾸<EFBFBD><F0A4BEB8>娍迨撌亙<E6928C><E4BA99>?/p>`;
|
||
}).catch(e => { ct.innerHTML = `<div class="alert alert-e">${e.message}</div>`; });
|
||
}
|
||
};
|