Router.register('/personnel', async () => {
  const data = await API.personnel().catch(() => ({ list: [] }));
  const items = (data.list || []).map(p => `<li><span>${p.name || '人员'}</span><span class="badge">${p.role || ''}</span></li>`).join('');
  const html = `
    <div class="grid cols-2">
      <div class="card">
        <div style="font-weight:600;margin-bottom:8px">人员录入</div>
        <div class="field"><label>姓名</label><input id="person-name" class="input" /></div>
        <div class="field"><label>岗位</label><input id="person-role" class="input" /></div>
        <div class="actions"><button id="person-submit" class="btn">提交</button></div>
      </div>
      <div class="card">
        <div style="font-weight:600;margin-bottom:8px">人员信息</div>
        <ul id="person-list" class="list">${items || '<li>暂无数据</li>'}</ul>
      </div>
    </div>`;
  setTimeout(() => {
    const btn = document.getElementById('person-submit');
    btn?.addEventListener('click', async () => {
      const name = document.getElementById('person-name').value.trim();
      const role = document.getElementById('person-role').value.trim();
      if (!name) return API.toast('请输入姓名');
      btn.disabled = true;
      try {
        await API.addPersonnel(name, role);
        API.toast('已提交');
        const data2 = await API.personnel().catch(() => ({ list: [] }));
        const listEl = document.getElementById('person-list');
        if (listEl) listEl.innerHTML = (data2.list || []).map(p => `<li><span>${p.name || '人员'}</span><span class="badge">${p.role || ''}</span></li>`).join('') || '<li>暂无数据</li>';
      } catch(e) {
        API.toast('提交失败');
      } finally {
        btn.disabled = false;
      }
    });
  }, 0);
  return html;
});