88 lines
2.8 KiB
HTML
88 lines
2.8 KiB
HTML
<!DOCTYPE html>
|
|||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<title>调试 - 新建项目</title>
|
||
|
|
<style>
|
||
|
|
body { padding: 20px; font-family: Arial; }
|
||
|
|
.log { background: #f5f5f5; padding: 10px; margin: 10px 0; border-radius: 5px; }
|
||
|
|
button { padding: 10px 20px; background: #667eea; color: white; border: none; border-radius: 5px; cursor: pointer; margin: 5px; }
|
||
|
|
input, textarea { width: 100%; padding: 8px; margin: 5px 0; border: 1px solid #ddd; border-radius: 4px; }
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<h1>新建项目调试页面</h1>
|
||
|
|
|
||
|
|
<div>
|
||
|
|
<h3>测试1: 按钮点击</h3>
|
||
|
|
<button id="test-btn">点击测试</button>
|
||
|
|
<div id="log1" class="log">等待点击...</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div>
|
||
|
|
<h3>测试2: 创建项目</h3>
|
||
|
|
<input type="text" id="project-name" placeholder="项目名称">
|
||
|
|
<textarea id="project-desc" placeholder="项目描述" rows="3"></textarea>
|
||
|
|
<button id="create-btn">创建项目</button>
|
||
|
|
<div id="log2" class="log">等待创建...</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div>
|
||
|
|
<h3>测试3: 项目列表</h3>
|
||
|
|
<button id="list-btn">加载项目</button>
|
||
|
|
<div id="log3" class="log">等待加载...</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
const log = (id, msg) => {
|
||
|
|
document.getElementById(id).innerHTML += `<div>${new Date().toLocaleTimeString()}: ${msg}</div>`;
|
||
|
|
};
|
||
|
|
|
||
|
|
// 测试1
|
||
|
|
document.getElementById('test-btn').addEventListener('click', () => {
|
||
|
|
log('log1', '✅ 按钮点击事件正常');
|
||
|
|
});
|
||
|
|
|
||
|
|
// 测试2
|
||
|
|
document.getElementById('create-btn').addEventListener('click', async () => {
|
||
|
|
const name = document.getElementById('project-name').value;
|
||
|
|
const desc = document.getElementById('project-desc').value;
|
||
|
|
|
||
|
|
if (!name) {
|
||
|
|
log('log2', '❌ 请输入项目名称');
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
log('log2', '发送请求...');
|
||
|
|
|
||
|
|
try {
|
||
|
|
const response = await fetch('/api/projects', {
|
||
|
|
method: 'POST',
|
||
|
|
headers: { 'Content-Type': 'application/json' },
|
||
|
|
body: JSON.stringify({ name, description: desc, created_by: 'debug' })
|
||
|
|
});
|
||
|
|
|
||
|
|
const data = await response.json();
|
||
|
|
log('log2', `✅ 创建成功: ${JSON.stringify(data)}`);
|
||
|
|
} catch (error) {
|
||
|
|
log('log2', `❌ 错误: ${error.message}`);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
// 测试3
|
||
|
|
document.getElementById('list-btn').addEventListener('click', async () => {
|
||
|
|
log('log3', '加载中...');
|
||
|
|
try {
|
||
|
|
const response = await fetch('/api/projects');
|
||
|
|
const data = await response.json();
|
||
|
|
log('log3', `✅ 获取到 ${data.length} 个项目`);
|
||
|
|
data.forEach(p => log('log3', `- ${p.name}`));
|
||
|
|
} catch (error) {
|
||
|
|
log('log3', `❌ 错误: ${error.message}`);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|