/* ============ Documents ============ */
function Documents({search, notify}){
  const [typeF,setTypeF]=useState('all');
  const [open,setOpen]=useState(null);
  const docStatus={unpaid:{label:'Ожидает оплаты',pill:'pill-amber'},paid:{label:'Оплачен',pill:'pill-teal'},signed:{label:'Подписан',pill:'pill-teal'},available:{label:'Доступен',pill:'pill-sky'}};
  const rows=SW.documents.filter(d=>{
    if(typeF!=='all'&&d.type!==typeF) return false;
    const q=search.trim().toLowerCase();
    return !q||d.id.toLowerCase().includes(q)||d.cargo.toLowerCase().includes(q);
  });
  return (
    <div className="content fade-in">
      <PageHead title="Документы" sub="Закрывающие документы: счета-фактуры, акты, ж/д накладные">
        <button className="btn btn-dark" onClick={()=>notify('Архив документов выгружен')}><Icon name="download" size={18}/>Скачать все</button>
      </PageHead>
      <div className="chips" style={{marginBottom:16}}>
        {[['all','Все'],['invoice','Счета-фактуры'],['act','Акты'],['waybill','Накладные'],['bill','Счета на оплату']].map(([k,l])=>(
          <button key={k} className={'chip'+(typeF===k?' active':'')} onClick={()=>setTypeF(k)}>{l}</button>
        ))}
      </div>
      <div className="card" style={{padding:'8px 10px'}}>
        <table className="tbl">
          <thead><tr><th>Документ</th><th>Тип</th><th>Груз</th><th>Дата</th><th>Размер</th><th className="num">Сумма</th><th>Статус</th><th></th></tr></thead>
          <tbody>
            {rows.map(d=>(
              <tr key={d.id} onClick={()=>setOpen(d)}>
                <td><div className="row" style={{gap:11}}><div className="tile-ic tone-sky" style={{width:34,height:34}}><Icon name="doc" size={16}/></div><span className="t-strong">{d.id}</span></div></td>
                <td className="t-mut">{SW.DOC_TYPE[d.type]}</td>
                <td><span className="mono" style={{color:'var(--blue)'}}>{d.cargo}</span></td>
                <td className="mono">{SW.dstr(d.date)}</td>
                <td className="t-mut">{d.size}</td>
                <td className="num mono t-strong">{d.sum?SW.fmtMoney(d.sum):'—'}</td>
                <td><span className={'pill '+docStatus[d.status].pill}><span className="pdot"></span>{docStatus[d.status].label}</span></td>
                <td className="num" onClick={e=>e.stopPropagation()}><div className="row" style={{gap:4,justifyContent:'flex-end'}}>
                  <button className="kebab" onClick={()=>setOpen(d)} title="Просмотр"><Icon name="eye" size={16}/></button>
                  <button className="kebab" onClick={()=>notify('Скачивание '+d.id+'.pdf')} title="Скачать"><Icon name="download" size={16}/></button>
                </div></td>
              </tr>
            ))}
            {rows.length===0 && <tr><td colSpan={8}><Empty ic="doc" text="Документы не найдены"/></td></tr>}
          </tbody>
        </table>
      </div>
      {open && <DocModal doc={open} onClose={()=>setOpen(null)} notify={notify}/>}
    </div>
  );
}
window.Documents = Documents;