/* Console interne — Catalogue (services et tarifs, incidents), Support (tickets), Administration (équipe
   interne, journal d'audit, paramètres). Design dev-admin2.jsx, données réelles. */
const SERVICES_STATUT = [['api','API LeMultiservice'],['askia','Askia'],['providence','La Providence'],['diotali','Diotali (registre)'],['wave','Wave'],['orange_money','Orange Money']];
const ETATS = [['operationnel','Opérationnel'],['ralenti','Ralenti'],['indisponible','Indisponible'],['maintenance','Maintenance']];
const ETAT_TON = {operationnel:'ok', ralenti:'warn', indisponible:'bad', maintenance:'info'};

function A2Catalog(){
  const toast = useToast(); const {peut} = useAdm(); const edit = peut('parametres');
  const [tab, setTab] = React.useState(0);
  const [d, recharger, etat] = useDonnees(() => api('GET', 'parametres'), []);
  const [sup] = useDonnees(() => api('GET', 'supervision?mode=live'), []);
  const [g, setG] = React.useState(null), [svc, setSvc] = React.useState(null), [load, setLoad] = React.useState(false);
  React.useEffect(() => { if(d){ setG(d.grades.map(x=>({...x, taux:String(Math.round(x.assurance_taux_pn*1000)/10), frais:String(Math.round(x.assurance_taux_frais*10000)/100)}))); setSvc(d.services); } }, [d]);
  const enregistrer = async () => { setLoad(true); try {
    await api('PATCH', 'parametres', {grades:g.map(x=>({code:x.code, assurance_taux_pn:(+x.taux.replace(',', '.'))/100, assurance_forfait:+String(x.assurance_forfait).replace(/\s/g,''), assurance_taux_frais:(+x.frais.replace(',', '.'))/100})), services:svc});
    toast('Services et tarifs enregistrés'); recharger(); } catch(e){ toast(e.message, 'bad'); } setLoad(false); };
  if(etat.erreur) return <Page max={1280}><PageHead title="Services et tarifs"/><Erreur e={etat.erreur} recharger={recharger}/></Page>;
  return <Page max={1280}><PageHead title="Services et tarifs" sub="Disponibilité des services et conditions par grade commercial." actions={edit && <Btn icon="floppy-disk" disabled={load||!g} onClick={enregistrer}>Enregistrer</Btn>}/>
    <Tabs opts={['Services','Grades et remises','Assureurs']} i={tab} set={setTab}/>
    {!d || !g ? <Skel h={200}/> : <>
    {tab===0 && <Grid cols="1fr 1fr">{Object.entries(SVCS).map(([k,v])=>{ const cfg = svc?.[k] || {}; return <Card key={k} style={{display:'flex', flexDirection:'column', gap:14}}><div style={{display:'flex', alignItems:'center', gap:12}}><SvcArt k={k} s={44}/><span style={{flex:1}}><span style={{display:'block', fontWeight:800, fontSize:15}}>{v.n}</span><span style={{display:'block', fontSize:12.5, color:V.ink3}}>{cfg.actif?'Disponible pour les partenaires':v.on?'Désactivé':'Affiché « Bientôt » (pas encore branché)'}</span></span><Toggle on={!!cfg.actif} set={x=>edit && v.on && setSvc({...svc, [k]:{...cfg, actif:x}})} label={v.n}/></div>
      <Field label="Plafond par défaut (nouveaux partenaires)"><Inp value={fmt(cfg.plafond_defaut||0)} onChange={ev=>setSvc({...svc, [k]:{...cfg, plafond_defaut:+ev.target.value.replace(/[^\d]/g,'')}})} trail="F CFA" disabled={!edit}/></Field></Card>; })}</Grid>}
    {tab===1 && <><Tbl cols={[{k:'g',l:'Grade',w:'.8fr'},{k:'r',l:'Remise sur la prime nette',w:'1fr'},{k:'f',l:'Remise fixe par contrat',w:'1fr'},{k:'s',l:'Frais de service',w:'1fr'},{k:'n',l:'Partenaires',w:'.6fr',r:1}]} rows={g.map((x,i)=>({g:<Badge tone="deep">{GRADE_L[x.code]}</Badge>,
      r:<div style={{width:120}}><Inp value={x.taux} onChange={ev=>{ const n=[...g]; n[i]={...x, taux:ev.target.value}; setG(n); }} trail="%" style={{height:38}} disabled={!edit}/></div>,
      f:<div style={{width:150}}><Inp value={x.assurance_forfait} onChange={ev=>{ const n=[...g]; n[i]={...x, assurance_forfait:ev.target.value.replace(/[^\d]/g,'')}; setG(n); }} trail="F" style={{height:38}} disabled={!edit}/></div>,
      s:<div style={{width:120}}><Inp value={x.frais} onChange={ev=>{ const n=[...g]; n[i]={...x, frais:ev.target.value}; setG(n); }} trail="%" style={{height:38}} disabled={!edit}/></div>, n:<b>{x.partenaires}</b>}))}/>
      <Notice tone="warn" title="Appliqué à chaque opération suivante">Montant débité = prime TTC − (prime nette × remise + remise fixe) + TTC × frais. L'ancien et le nouveau barème sont tracés dans le journal d'audit.</Notice></>}
    {tab===2 && <Grid cols="1fr 1fr">{(sup?.assureurs_24h||[{assureur:'askia'},{assureur:'providence'}]).map(x=>{ const st = d.statut_services?.[x.assureur] || 'operationnel'; return <Card key={x.assureur} style={{display:'flex', alignItems:'center', gap:14}}><img src={ASSUREURS[x.assureur]?.[1]} alt="" style={{width:48, height:48, borderRadius:14, objectFit:'contain', background:'#fff', border:`1px solid ${V.line}`}}/><span style={{flex:1}}><span style={{display:'block', fontWeight:800, fontSize:15}}>{ASS(x.assureur)}</span><span style={{display:'block', fontSize:12.5, color:V.ink3}}>Échecs 24 h (production) : {pct(x.taux||0)} · {x.operations||0} opér.</span></span><Badge tone={ETAT_TON[st]} dot>{(ETATS.find(y=>y[0]===st)||[])[1]}</Badge></Card>; })}
      <Notice tone="info">Le statut public se change dans Incidents et statut.</Notice></Grid>}</>}
  </Page>;
}

function A2Incidents(){
  const toast = useToast(); const {peut, rechargerMoi} = useAdm(); const edit = peut('incidents');
  const [d, recharger, etat] = useDonnees(() => api('GET', 'incidents'), []);
  const [nw, setNw] = React.useState(null), [maj, setMaj] = React.useState(null), [load, setLoad] = React.useState(false);
  const agir = async (fn, ok) => { setLoad(true); try { await fn(); toast(ok); setNw(null); setMaj(null); recharger(); rechargerMoi(); } catch(e){ toast(e.message, 'bad'); } setLoad(false); };
  const statut = async (k, v) => { try { await api('PATCH', 'parametres', {statut_services:{...d.statut_services, [k]:v}}); toast('Statut public mis à jour'); recharger(); } catch(e){ toast(e.message, 'bad'); } };
  if(etat.erreur) return <Page max={1280}><PageHead title="Incidents et statut"/><Erreur e={etat.erreur} recharger={recharger}/></Page>;
  return <Page max={1280}><PageHead title="Incidents et statut" sub="Ce que les partenaires voient sur leur page Aide et dans leurs notifications." actions={edit && <Btn icon="plus" onClick={()=>setNw({service:'providence', gravite:'ralenti', titre:'', message:'', notifier:false})}>Déclarer un incident</Btn>}/>
    <Grid cols="minmax(0,1.5fr) minmax(0,1fr)">
      <Card pad={0}>{!d ? <SkelRows/> : d.incidents.length ? d.incidents.map((x,i)=><div key={x.id} style={{display:'flex', gap:12, padding:'16px 20px', borderTop:i?`1px solid ${V.line}`:'none'}}><I n={x.statut==='resolu'?'check-circle':x.gravite==='maintenance'?'wrench':'warning'} s={20} c={TN[x.statut==='resolu'?'ok':x.gravite==='indisponible'?'bad':x.gravite==='maintenance'?'info':'warn'][1]} fill/>
        <span style={{flex:1, minWidth:0}}><span style={{display:'block', fontWeight:800, fontSize:14}}>{x.titre}</span>{x.message && <span style={{display:'block', fontSize:13, color:V.ink2, marginTop:2}}>{x.message}</span>}
          {(x.mises_a_jour||[]).map((u,k)=><span key={k} style={{display:'block', fontSize:12.5, color:V.ink2, marginTop:6, paddingLeft:10, borderLeft:`2px solid ${V.line}`}}>{u.message} <span style={{color:V.ink3}}>· {u.par}, {DC(u.le)}</span></span>)}
          <span style={{display:'block', fontSize:12, color:V.ink3, marginTop:6}}>{x.statut==='resolu' ? `Résolu · ${D(x.resolu_le)}` : `En cours · depuis ${DC(x.cree_le)}`} · {(SERVICES_STATUT.find(y=>y[0]===x.service)||[])[1]}</span></span>
        {edit && x.statut==='en_cours' && <Btn kind="secondary" sm onClick={()=>setMaj({id:x.id, message:'', resoudre:false})}>Mettre à jour</Btn>}</div>)
        : <EmptyS icon="check-circle" title="Aucun incident" sub="Tous les services fonctionnent normalement."/>}</Card>
      <Card><H s={16} style={{marginBottom:10}}>Statut public</H>{!d ? <SkelRows n={3}/> : SERVICES_STATUT.map(([k,l],i)=>{ const v = d.statut_services?.[k] || 'operationnel'; return <div key={k} style={{display:'flex', alignItems:'center', gap:10, padding:'10px 0', borderTop:i?`1px solid ${V.line}`:'none'}}><span style={{width:9, height:9, borderRadius:99, background:v==='operationnel'?'#2F8F6E':v==='indisponible'?'var(--bad)':v==='maintenance'?'var(--info)':'var(--warnDot)'}}></span><span style={{flex:1, fontWeight:600, fontSize:13.5}}>{l}</span>
        {peut('parametres') ? <Sel label={`Statut ${l}`} opts={ETATS} value={v} onChange={x=>statut(k, x)} style={{height:34, width:150, fontSize:12.5}}/> : <Badge tone={ETAT_TON[v]}>{(ETATS.find(y=>y[0]===v)||[])[1]}</Badge>}</div>; })}</Card></Grid>
    {nw && <Modal title="Déclarer un incident" icon="warning-diamond" tone="warn" onClose={()=>setNw(null)} foot={<><Btn kind="secondary" onClick={()=>setNw(null)}>Annuler</Btn><Btn disabled={nw.titre.length<5||load} onClick={()=>agir(()=>api('POST', 'incidents', nw), 'Incident publié')}>Publier</Btn></>}>
      <Grid cols="1fr 1fr" mcols="1fr"><Field label="Service touché"><Sel value={nw.service} onChange={v=>setNw({...nw, service:v})} opts={SERVICES_STATUT}/></Field><Field label="Gravité"><Sel value={nw.gravite} onChange={v=>setNw({...nw, gravite:v})} opts={[['ralenti','Ralenti'],['indisponible','Indisponible'],['maintenance','Maintenance planifiée']]}/></Field></Grid>
      <Field label="Titre"><Inp value={nw.titre} onChange={ev=>setNw({...nw, titre:ev.target.value})} placeholder="Ex. La Providence ralenti"/></Field>
      <Field label="Message aux partenaires"><textarea className="li" rows={3} value={nw.message} onChange={ev=>setNw({...nw, message:ev.target.value})} style={{...inpCss, height:'auto', padding:12, lineHeight:1.5}} placeholder="Impact, contournement, prochaine mise à jour."></textarea></Field>
      <Check on={nw.notifier} set={v=>setNw({...nw, notifier:v})}>Prévenir par email les partenaires en production (adresse d'alertes du dossier)</Check></Modal>}
    {maj && <Modal title="Mettre à jour l'incident" icon="warning-diamond" onClose={()=>setMaj(null)} foot={<><Btn kind="secondary" onClick={()=>setMaj(null)}>Annuler</Btn><Btn disabled={(!maj.message && !maj.resoudre)||load} onClick={()=>agir(()=>api('PATCH', `incidents/${maj.id}`, maj), maj.resoudre ? 'Incident résolu' : 'Mise à jour publiée')}>Publier</Btn></>}>
      <Field label="Nouvelle information" opt><textarea className="li" rows={3} value={maj.message} onChange={ev=>setMaj({...maj, message:ev.target.value})} style={{...inpCss, height:'auto', padding:12, lineHeight:1.5}}></textarea></Field>
      <Check on={maj.resoudre} set={v=>setMaj({...maj, resoudre:v})}>Incident résolu : le service repasse « opérationnel »</Check></Modal>}
  </Page>;
}

const TK_TON = {ouvert:'warn', en_cours:'info', resolu:'ok', ferme:'mute'};
const TK_L = {ouvert:'Ouvert', en_cours:'En cours', resolu:'Résolu', ferme:'Fermé'};
function A2Tickets({param}){
  const toast = useToast(); const {peut, rechargerMoi, moi} = useAdm(); const m = useMob(); const edit = peut('tickets');
  const [f, setF] = React.useState(0); const st = ['', 'ouvert', 'en_cours', 'resolu'][f];
  const [l, rechargerL, etatL] = useDonnees(() => api('GET', `tickets${st ? `?statut=${st}` : ''}`), [st]);
  const [sel, setSel] = React.useState(param || null);
  React.useEffect(() => { if(!sel && l?.donnees?.length && !m) setSel(l.donnees[0].id); }, [l]);
  const [t, rechargerT] = useDonnees(() => sel ? api('GET', `tickets/${sel}`) : Promise.resolve(null), [sel]);
  const [eq] = useDonnees(() => api('GET', 'equipe'), []);
  const [rep, setRep] = React.useState(''), [load, setLoad] = React.useState(false);
  const envoyer = async () => { setLoad(true); try { await api('POST', `tickets/${sel}/messages`, {texte:rep}); setRep(''); rechargerT(); rechargerL(); rechargerMoi(); } catch(e){ toast(e.message, 'bad'); } setLoad(false); };
  const changer = async (champs) => { try { await api('PATCH', `tickets/${sel}`, champs); rechargerT(); rechargerL(); rechargerMoi(); toast('Ticket mis à jour'); } catch(e){ toast(e.message, 'bad'); } };
  const liste = <Card pad={0}>{!l ? <SkelRows/> : l.donnees.length ? l.donnees.map((x,i)=><button key={x.id} className="lb lr" onClick={()=>setSel(x.id)} style={{display:'flex', gap:12, width:'100%', padding:'14px 18px', border:0, borderTop:i?`1px solid ${V.line}`:'none', background:sel===x.id?V.mint:'transparent', cursor:'pointer', textAlign:'left', fontFamily:V.body}}>
    <span style={{flex:1, minWidth:0}}><span style={{display:'block', fontWeight:700, fontSize:13.5, color:V.ink}}>{x.sujet}</span><span style={{display:'block', fontSize:12, color:V.ink3, marginTop:3}}>{x.partenaire} · {Depuis(x.maj_le || x.cree_le)}{x.priorite==='haute' ? ' · priorité haute' : ''}</span></span><Badge tone={TK_TON[x.statut]}>{TK_L[x.statut]}</Badge></button>)
    : <EmptyS icon="lifebuoy" title="Aucun ticket" sub="Aucune demande dans ce statut."/>}</Card>;
  const detail = t && <Card style={{display:'flex', flexDirection:'column', gap:14}}>{m && <Btn kind="ghost" sm icon="arrow-left" onClick={()=>setSel(null)} style={{alignSelf:'flex-start'}}>Tickets</Btn>}
    <div><Lbl>{t.partenaire} · priorité {t.priorite}</Lbl><H s={18} style={{marginTop:6}}>{t.sujet}</H></div>
    {edit && <div style={{display:'flex', gap:8, flexWrap:'wrap'}}><div style={{width:170}}><Sel label="Statut" opts={Object.entries(TK_L)} value={t.statut} onChange={v=>changer({statut:v})} style={{height:38}}/></div><div style={{width:150}}><Sel label="Priorité" opts={[['basse','Basse'],['normale','Normale'],['haute','Haute']]} value={t.priorite} onChange={v=>changer({priorite:v})} style={{height:38}}/></div>
      <div style={{width:200}}><Sel label="Assigné à" opts={[['0','Non assigné'], ...((eq?.donnees)||[]).filter(s=>s.statut==='actif').map(s=>[String(s.id), `${s.prenom} ${s.nom}`])]} value={String(t.assigne_a||0)} onChange={v=>changer({assigne_a:+v})} style={{height:38}}/></div></div>}
    {t.messages.map((x,i)=>{ const moiMsg = x.auteur_type==='staff'; return <div key={i} style={{alignSelf:moiMsg?'flex-end':'flex-start', maxWidth:'85%', padding:'12px 14px', borderRadius:moiMsg?'18px 18px 6px 18px':'18px 18px 18px 6px', background:moiMsg?V.mint:V.sub, fontSize:13.5, lineHeight:1.5, whiteSpace:'pre-wrap'}}>{x.texte}<span style={{display:'block', marginTop:6, fontSize:11.5, color:moiMsg?V.accD:V.ink3}}>{x.auteur}{moiMsg?' · Support LMS':` · ${t.partenaire}`} · {DC(x.le)}</span></div>; })}
    {edit && t.statut !== 'ferme' && <div style={{display:'flex', gap:8}}><div style={{flex:1}}><Inp value={rep} onChange={ev=>setRep(ev.target.value)} placeholder="Votre réponse…" onKeyDown={ev=>{ if(ev.key==='Enter' && rep.length>1) envoyer(); }}/></div><Btn icon="paper-plane-tilt" disabled={rep.length<2||load} onClick={envoyer}>Envoyer</Btn></div>}</Card>;
  return <Page max={1280}><PageHead title="Tickets" sub="Demandes de support des partenaires."/>
    <Seg opts={['Tous','Ouverts','En cours','Résolus']} i={f} set={setF}/>
    {etatL.erreur ? <Erreur e={etatL.erreur} recharger={rechargerL}/> : m ? (sel ? detail || <Skel h={200}/> : liste) :
    <div style={{display:'grid', gridTemplateColumns:'minmax(0,1fr) minmax(0,1.2fr)', gap:16, alignItems:'start'}}>{liste}{sel ? detail || <Card><Skel h={200}/></Card> : <Card><EmptyS icon="chat-circle-text" title="Sélectionnez un ticket"/></Card>}</div>}</Page>;
}

const DESC_ROLES = [['super_admin','Tout, y compris l\'équipe interne, les paramètres et les tarifs'],['conformite','Dossiers de production, conditions et suspension des partenaires'],['finance','Dépôts, ajustements de solde, résiliations'],['support','Tickets, incidents, consultation des partenaires']];
function A2Staff(){
  const toast = useToast(); const {peut} = useAdm(); const edit = peut('equipe');
  const [d, recharger, etat] = useDonnees(() => api('GET', 'equipe'), []);
  const [inv, setInv] = React.useState(null), [load, setLoad] = React.useState(false);
  const modifier = async (id, champs, ok) => { try { await api('PATCH', `equipe/${id}`, champs); toast(ok); recharger(); } catch(e){ toast(e.message, 'bad'); } };
  if(etat.erreur) return <Page max={1280}><PageHead title="Équipe interne"/><Erreur e={etat.erreur} recharger={recharger}/></Page>;
  return <Page max={1280}><PageHead title="Équipe interne" sub="Membres LeMultiservice ayant accès à cette console. Double authentification obligatoire." actions={edit && <Btn icon="user-plus" onClick={()=>setInv({prenom:'', nom:'', email:'', role:'support'})}>Inviter</Btn>}/>
    <Tbl chargement={!d} cols={[{k:'n',l:'Membre',w:'2fr'},{k:'r',l:'Rôle',w:'1.1fr'},{k:'f',l:'2FA',w:'.7fr'},{k:'l',l:'Dernière activité',w:'1fr',hideM:1},{k:'x',l:'',w:'100px',r:1}]} rows={(d?.donnees||[]).map(s=>({n:<span style={{display:'flex', alignItems:'center', gap:10, minWidth:0, opacity:s.statut==='retire'?.5:1}}><Av n={`${s.prenom} ${s.nom}`}/><span style={{minWidth:0}}><b style={{display:'block'}}>{s.prenom} {s.nom}{s.id===d.moi ? ' (vous)' : ''}</b><span style={{fontSize:12, color:V.ink3, fontWeight:500}}>{s.email}</span></span></span>,
      r:edit && s.id !== d.moi && s.statut==='actif' ? <div style={{width:150}}><Sel label="Rôle" opts={Object.entries(ROLES_STAFF)} value={s.role} onChange={v=>modifier(s.id, {role:v}, 'Rôle modifié')} style={{height:36, fontSize:13}}/></div> : <Badge>{ROLES_STAFF[s.role]}</Badge>,
      f:s.statut==='retire' ? <Badge>Retiré</Badge> : s.totp_actif ? <Badge tone="ok" icon="check-circle">Active</Badge> : <Badge tone="warn">À activer</Badge>, l:<span style={{color:V.ink2}}>{s.derniere_activite ? Depuis(s.derniere_activite) : 'Jamais'}</span>,
      x:edit && s.id !== d.moi ? (s.statut==='actif' ? <Btn kind="ghost" sm style={{color:V.bad}} onClick={()=>modifier(s.id, {statut:'retire'}, 'Membre retiré')}>Retirer</Btn> : <Btn kind="ghost" sm onClick={()=>modifier(s.id, {statut:'actif'}, 'Membre réactivé')}>Réactiver</Btn>) : null}))}/>
    <Grid cols="repeat(4,1fr)" mcols="1fr 1fr">{DESC_ROLES.map(r=><Card key={r[0]} pad={16}><b style={{fontSize:13.5}}>{ROLES_STAFF[r[0]]}</b><span style={{display:'block', marginTop:4, fontSize:12, color:V.ink3, lineHeight:1.45}}>{r[1]}</span></Card>)}</Grid>
    {inv && <Modal title="Inviter un membre" icon="user-plus" onClose={()=>setInv(null)} foot={<><Btn kind="secondary" onClick={()=>setInv(null)}>Annuler</Btn><Btn disabled={!inv.prenom||!inv.nom||!/\S+@\S+\.\S+/.test(inv.email)||load} onClick={async()=>{ setLoad(true); try { await api('POST', 'equipe', inv); toast(`Invitation envoyée à ${inv.email}`); setInv(null); recharger(); } catch(e){ toast(e.message, 'bad'); } setLoad(false); }}>Envoyer l'invitation</Btn></>}>
      <Grid cols="1fr 1fr" mcols="1fr 1fr"><Field label="Prénom"><Inp value={inv.prenom} onChange={e=>setInv({...inv, prenom:e.target.value})}/></Field><Field label="Nom"><Inp value={inv.nom} onChange={e=>setInv({...inv, nom:e.target.value})}/></Field></Grid>
      <Field label="Email"><Inp type="email" value={inv.email} onChange={e=>setInv({...inv, email:e.target.value})} placeholder="prenom.nom@lemultiservice.sn"/></Field>
      <Field label="Rôle"><Sel value={inv.role} onChange={v=>setInv({...inv, role:v})} opts={Object.entries(ROLES_STAFF)}/></Field>
      <Muted>Il reçoit un lien valable 48 heures pour choisir son mot de passe ; la double authentification lui est demandée à la première connexion.</Muted></Modal>}
  </Page>;
}

const CATS = [['','Toutes les actions'],['dossier','Dossiers'],['depot','Dépôts'],['partenaire','Partenaires'],['ajustement','Ajustements'],['demande','Résiliations'],['incident','Incidents'],['equipe','Équipe'],['parametres','Paramètres'],['securite','Sécurité']];
function A2Audit(){
  const [cat, setCat] = React.useState(''), [tous, setTous] = React.useState(0), [page, setPage] = React.useState(1);
  const [d, recharger, etat] = useDonnees(() => api('GET', `audit?page=${page}&acteur=${tous?'tous':'staff'}${cat?`&categorie=${cat}`:''}`), [cat, tous, page]);
  return <Page max={1280}><PageHead title="Journal d'audit" sub="Toutes les actions sensibles, non modifiable." actions={<Btn kind="secondary" icon="arrow-clockwise" onClick={recharger}>Actualiser</Btn>}/>
    <div style={{display:'flex', gap:8, flexWrap:'wrap'}}><Seg opts={['Équipe interne','Tout le monde']} i={tous} set={k=>{setTous(k); setPage(1);}}/><div style={{width:220}}><Sel label="Catégorie" value={cat} onChange={v=>{setCat(v); setPage(1);}} opts={CATS} style={{height:40}}/></div></div>
    {etat.erreur ? <Erreur e={etat.erreur} recharger={recharger}/> :
    <Tbl chargement={!d} cols={[{k:'d',l:'Date',w:'.8fr'},{k:'u',l:'Par',w:'1fr'},{k:'a',l:'Action',w:'2fr'},{k:'p',l:'Partenaire',w:'1.2fr',hideM:1}]} rows={(d?.donnees||[]).map(l=>({d:<Mono>{DC(l.date)}</Mono>, u:<span>{l.par}{l.acteur_type==='membre' && <span style={{display:'block', fontSize:11.5, color:V.ink3}}>partenaire</span>}</span>, a:<span style={{minWidth:0}}><b style={{fontWeight:600}}>{libelleAction(l.action)}</b>{l.cible && <span style={{display:'block', fontSize:12, color:V.ink3, overflow:'hidden', textOverflow:'ellipsis'}}>{l.cible}</span>}</span>, p:<span onClick={()=>l.partenaire_id && aller('partner', l.partenaire_id)} style={{color:V.ink2, cursor:l.partenaire_id?'pointer':undefined}}>{l.partenaire||'—'}</span>}))}
      empty={<EmptyS icon="clock-counter-clockwise" title="Journal vide"/>} foot={d && d.total > 50 && <Pager n={d.total} per={50} page={page} set={setPage}/>}/>}</Page>;
}

function A2Settings(){
  const toast = useToast(); const {peut} = useAdm(); const edit = peut('parametres');
  const [d, recharger, etat] = useDonnees(() => api('GET', 'parametres'), []);
  const [v, setV] = React.useState(null), [load, setLoad] = React.useState(false);
  React.useEffect(() => { if(d) setV({...d.plateforme, banque:{beneficiaire:'', banque:'', iban:'', swift:'', ...(d.plateforme.coordonnees_bancaires||{})}}); }, [d]);
  const up = (k) => (ev) => setV({...v, [k]:ev.target.value.replace(/[^\d]/g,'')});
  const upB = (k) => (ev) => setV({...v, banque:{...v.banque, [k]:ev.target.value}});
  const enregistrer = async () => { setLoad(true); try { await api('PATCH', 'parametres', {inscription_publique:v.inscription_publique, credit_sandbox_initial:+v.credit_sandbox_initial, seuil_double_validation:+v.seuil_double_validation, delai_revue_jours:+v.delai_revue_jours, grace_rotation_heures:+v.grace_rotation_heures, coordonnees_bancaires:v.banque}); toast('Paramètres enregistrés'); recharger(); } catch(e){ toast(e.message, 'bad'); } setLoad(false); };
  if(etat.erreur) return <Page max={1100}><PageHead title="Paramètres"/><Erreur e={etat.erreur} recharger={recharger}/></Page>;
  if(!v) return <Page max={1100}><PageHead title="Paramètres"/><Skel h={300}/></Page>;
  const banqueVide = !v.banque.iban;
  return <Page max={1100}><PageHead title="Paramètres" actions={edit && <Btn icon="floppy-disk" disabled={load} onClick={enregistrer}>Enregistrer</Btn>}/>
    {!edit && <Notice tone="info">Lecture seule : seul un super admin modifie les paramètres.</Notice>}
    <Grid cols="1fr 1fr">
      <Card style={{display:'flex', flexDirection:'column', gap:14}}><H s={16}>Coordonnées bancaires affichées aux partenaires</H>
        {banqueVide && <Notice tone="warn" title="Non renseignées">Tant qu'elles sont vides, la page de recharge par virement n'affiche pas de RIB.</Notice>}
        <Field label="Bénéficiaire"><Inp value={v.banque.beneficiaire} onChange={upB('beneficiaire')} placeholder="JOKKO TECH AI SAS" disabled={!edit}/></Field><Field label="Banque"><Inp value={v.banque.banque} onChange={upB('banque')} disabled={!edit}/></Field>
        <Field label="IBAN"><Inp value={v.banque.iban} onChange={upB('iban')} mono disabled={!edit}/></Field><Field label="SWIFT"><Inp value={v.banque.swift} onChange={upB('swift')} mono disabled={!edit}/></Field></Card>
      <div style={{display:'flex', flexDirection:'column', gap:16}}>
        <Card style={{display:'flex', alignItems:'center', gap:14}}><Tile icon="user-plus"/><span style={{flex:1}}><span style={{display:'block', fontWeight:800, fontSize:14}}>Inscription publique</span><span style={{display:'block', fontSize:12.5, color:V.ink3}}>{v.inscription_publique?'Tout le monde peut créer un compte partenaire.':'Désactivée : les partenaires sont ajoutés par l\'équipe.'}</span></span><Toggle on={!!v.inscription_publique} set={x=>edit && setV({...v, inscription_publique:x})} label="Inscription publique"/></Card>
        <Card style={{display:'flex', flexDirection:'column', gap:14}}><H s={16}>Sandbox et contrôles</H><Grid cols="1fr 1fr" mcols="1fr">
          <Field label="Crédit sandbox initial"><Inp value={fmt(+v.credit_sandbox_initial)} onChange={up('credit_sandbox_initial')} trail="F CFA" disabled={!edit}/></Field><Field label="Double validation au-delà de"><Inp value={fmt(+v.seuil_double_validation)} onChange={up('seuil_double_validation')} trail="F CFA" disabled={!edit}/></Field>
          <Field label="Délai cible de revue"><Inp value={v.delai_revue_jours} onChange={up('delai_revue_jours')} trail="jours" disabled={!edit}/></Field><Field label="Rotation de clé · période de grâce"><Inp value={v.grace_rotation_heures} onChange={up('grace_rotation_heures')} trail="heures" disabled={!edit}/></Field></Grid></Card></div>
    </Grid></Page>;
}
Object.assign(window, {A2Catalog, A2Incidents, A2Tickets, A2Staff, A2Audit, A2Settings});