`mockups/admin/A08.html`

42 lines
<!doctype html><html lang="en"><head>
<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
<title>A08 · Activity Feed — RENTV Admin</title>
<link rel="stylesheet" href="../assets/base.css"><link rel="stylesheet" href="admin.css">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
<style>
  body{background:#0d1014;color:#e7ecf1;font-family:'Inter',system-ui,sans-serif}
  .wrap{max-width:860px;margin:0 auto;padding:14px 20px}
  .tl{position:relative;padding-left:30px;margin-top:8px}
  .tl::before{content:"";position:absolute;left:8px;top:6px;bottom:6px;width:2px;background:#232a32}
  .ev{position:relative;padding-bottom:20px}
  .ev::before{content:"";position:absolute;left:-30px;top:3px;width:14px;height:14px;border-radius:50%;background:#0d1014;border:3px solid #c8102e}
  .ev.firm::before{border-color:#37d67a}.ev.broker::before{border-color:#7cc0ff}
  .ev .t{font-size:11px;color:#8b939b;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
  .ev .card{background:#11161c;border:1px solid #232a32;border-radius:11px;padding:13px 15px;margin-top:5px}
  .ev .nm{font-weight:700;font-size:15px}.ev .f{font-size:12.5px;color:#9aa4ad;margin-top:2px}
  .ev .acts{margin-top:11px}
  .ev .metric{float:right;font-weight:800}
</style></head>
<body>
<div class="admhead" data-eln><h1>RENTV Admin · <span>Activity Feed</span></h1><div class="fresh" id="fresh"></div></div>
<div class="wrap"><div class="tl" data-eln id="tl"></div></div>
<script src="../assets/chrome.js"></script><script src="admin-core.js"></script>
<script>
ADM.mount('A08', d=>{
  const esc=ADM.esc;
  // interleave recorded transfers (owners, dated) with broker/firm registry events
  const ev=[];
  d.owners.forEach(o=>ev.push({k:'owner',date:o.recording_date,x:o}));
  d.firms.slice(0,10).forEach(f=>ev.push({k:'firm',date:null,x:f}));
  d.brokers.slice(0,14).forEach(b=>ev.push({k:'broker',date:null,x:b}));
  // dated first (newest), then registry items
  ev.sort((a,b)=>(new Date(b.date||0))-(new Date(a.date||0)));
  document.getElementById('fresh').textContent='Recorded transfers + registry activity · newest first';
  document.getElementById('tl').innerHTML=ev.map(e=>{
    if(e.k==='owner'){const o=e.x;return `<div class="ev"><div class="t">${RENTV.dstr(o.recording_date)} · Recorded transfer</div><div class="card"><span class="metric">${RENTV.shortUsd(o.assessed_total)}</span><div class="nm">${esc(o.address||o.ain)}</div><div class="f">${esc(o.type_label)} · ${esc(o.use_desc||'')}</div><div class="acts">${ADM.actions('owners',o)}</div></div></div>`;}
    if(e.k==='firm'){const f=e.x;return `<div class="ev firm"><div class="t">Registry · Brokerage</div><div class="card"><span class="metric">${(f.agent_count||0).toLocaleString()}</span><div class="nm">${esc(f.name)}</div><div class="f">${esc(ADM.loc(f)||'')} · ${(f.agent_count||0).toLocaleString()} agents</div><div class="acts">${ADM.actions('firms',f)}</div></div></div>`;}
    const b=e.x;return `<div class="ev broker"><div class="t">Registry · ${esc(b.license_type||'Licensee')}</div><div class="card"><div class="nm">${esc(b.name)}</div><div class="f">${esc(b.firm_name||'—')} · ${esc(b.city||'')} · DRE ${esc(b.license_no||'')}</div><div class="acts">${ADM.actions('brokers',b)}</div></div></div>`;
  }).join('');
});
</script></body></html>