147 lines
4.9 KiB
JavaScript
147 lines
4.9 KiB
JavaScript
document.addEventListener('DOMContentLoaded', () => {
|
||
const tabs = document.querySelectorAll('.tab');
|
||
const panels = document.querySelectorAll('.panel');
|
||
|
||
tabs.forEach(tab => {
|
||
tab.addEventListener('click', () => {
|
||
const target = tab.dataset.tab;
|
||
|
||
tabs.forEach(t => t.classList.remove('active'));
|
||
panels.forEach(p => p.classList.remove('active'));
|
||
|
||
tab.classList.add('active');
|
||
document.getElementById(`${target}-panel`).classList.add('active');
|
||
});
|
||
});
|
||
|
||
const API_BASE = '';
|
||
const toBase64 = (str) => btoa(unescape(encodeURIComponent(str)));
|
||
|
||
const getDeviceInfo = async () => {
|
||
const getHardwareInfo = async () => {
|
||
try {
|
||
if (navigator.hardwareConcurrency || navigator.deviceMemory) {
|
||
const nav = navigator;
|
||
const canvas = document.createElement('canvas');
|
||
const gl = canvas.getContext('webgl') || canvas.getContext('experimental-webgl');
|
||
const debugInfo = gl ? gl.getExtension('WEBGL_debug_renderer_info') : null;
|
||
const renderer = debugInfo ? gl.getParameter(debugInfo.UNMASKED_RENDERER_WEBGL) : '';
|
||
|
||
return {
|
||
cpuCores: nav.hardwareConcurrency || '',
|
||
deviceMemory: nav.deviceMemory ? `${nav.deviceMemory}GB` : '',
|
||
gpu: renderer || '',
|
||
hardDisk: ''
|
||
};
|
||
}
|
||
} catch (e) {}
|
||
return { cpuCores: '', deviceMemory: '', gpu: '', hardDisk: '' };
|
||
};
|
||
|
||
const hardware = await getHardwareInfo();
|
||
const info = {
|
||
userAgent: navigator.userAgent,
|
||
language: navigator.language,
|
||
platform: navigator.platform,
|
||
screenWidth: screen.width,
|
||
screenHeight: screen.height,
|
||
timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,
|
||
cpuCores: hardware.cpuCores,
|
||
deviceMemory: hardware.deviceMemory,
|
||
gpu: hardware.gpu,
|
||
hardDisk: hardware.hardDisk
|
||
};
|
||
return JSON.stringify(info);
|
||
};
|
||
|
||
document.getElementById('suggestion-form').addEventListener('submit', async (e) => {
|
||
e.preventDefault();
|
||
|
||
const submitBtn = e.target.querySelector('button[type="submit"]');
|
||
const originalText = submitBtn.textContent;
|
||
submitBtn.textContent = '提交中...';
|
||
submitBtn.disabled = true;
|
||
|
||
const title = document.getElementById('title').value;
|
||
const type = document.getElementById('type').value;
|
||
const text = document.getElementById('text').value;
|
||
|
||
if (!title || !type || !text) {
|
||
alert('请填写所有必填字段');
|
||
submitBtn.textContent = originalText;
|
||
submitBtn.disabled = false;
|
||
return;
|
||
}
|
||
|
||
try {
|
||
const deviceInfo = getDeviceInfo();
|
||
const payload = {
|
||
title: toBase64(title),
|
||
type: type,
|
||
text: toBase64(text),
|
||
deviceInfo: toBase64(deviceInfo)
|
||
};
|
||
|
||
console.log('Sending:', payload);
|
||
|
||
const res = await fetch('/api/suggestions', {
|
||
method: 'POST',
|
||
headers: { 'Content-Type': 'application/json' },
|
||
body: JSON.stringify(payload)
|
||
});
|
||
|
||
const data = await res.json();
|
||
console.log('Response:', res.status, data);
|
||
|
||
if (res.ok && data.id) {
|
||
document.getElementById('suggestion-id').textContent = data.id;
|
||
document.getElementById('submit-result').style.display = 'block';
|
||
document.getElementById('suggestion-form').reset();
|
||
alert('提交成功！ID: ' + data.id);
|
||
} else {
|
||
alert((data && data.error) || '提交失败，请重试');
|
||
}
|
||
} catch (err) {
|
||
console.error('Error:', err);
|
||
alert('网络错误: ' + err.message);
|
||
} finally {
|
||
submitBtn.textContent = originalText;
|
||
submitBtn.disabled = false;
|
||
}
|
||
});
|
||
|
||
document.getElementById('query-btn').addEventListener('click', async () => {
|
||
const id = document.getElementById('query-id').value.trim();
|
||
|
||
if (!id) {
|
||
alert('请输入查询ID');
|
||
return;
|
||
}
|
||
|
||
try {
|
||
const res = await fetch(`/api/suggestions/${id}`);
|
||
const data = await res.json();
|
||
|
||
if (res.ok) {
|
||
document.getElementById('detail-title').textContent = data.title;
|
||
document.getElementById('detail-type').textContent = data.type;
|
||
document.getElementById('detail-text').textContent = data.text;
|
||
|
||
const statusEl = document.getElementById('detail-status');
|
||
statusEl.textContent = data.status;
|
||
statusEl.className = `status-badge ${data.status}`;
|
||
|
||
document.getElementById('progress-fill').style.width = `${data.progress}%`;
|
||
document.getElementById('progress-text').textContent = `${data.progress}%`;
|
||
|
||
document.getElementById('query-result').style.display = 'block';
|
||
} else {
|
||
alert(data.error || '查询失败');
|
||
document.getElementById('query-result').style.display = 'none';
|
||
}
|
||
} catch (err) {
|
||
alert('网络错误，请稍后重试');
|
||
}
|
||
});
|
||
});
|