(() => {
const { PageHeader, SummaryStrip, DataTable, Money, StatusBadge, Button, Select, Tabs, Icon, Alert } = window.AmlakPlusDesignSystem_b3aa85;
const { Acts, match, Toolbar, Empty, cellTwo, num, upd } = window.APList;

const APPROVAL = { approved: 'وافق المالك', agreement: 'ضمن حد الاتفاق', info: 'للعلم', waiting: 'بانتظار موافقة المالك', office: 'مصروف مكتب' };
function ExpensesScreen() {
  const D = window.AP_DATA;
  const [rows, setRows] = React.useState(D.expenses);
  const [q, setQ] = React.useState('');
  const [prop, setProp] = React.useState('');
  const list = rows.filter((r) => (!prop || r.property === prop) && match(q, r.desc, r.property, r.vendor, r.cat));
  const held = rows.filter((r) => r.from === 'أموال المالك بحوزة المكتب');
  return (
    <>
      <PageHeader title="المصروفات" description="ما صُرف على العقارات ومن أين مُوّل. المصروف من أموال المالك يدخل تصفيته بعد الاعتماد." actions={<Button icon="Plus" onClick={() => window.apOpen('expense', { onSaved: (v) => setRows((rs) => [{ id: 'x' + Date.now(), date: '23/09/2026', property: v.scope === 'المكتب' ? 'المكتب' : (D.properties.find((p) => p.id === v.property) || {}).name, unit: v.unit || '—', cat: v.cat, desc: v.desc, amount: Number(v.amount), from: { held: 'أموال المالك بحوزة المكتب', office: 'صندوق المكتب', owner: 'دفعها المالك مباشرة' }[v.from], approval: v.approval === 'تُطلب الآن' ? 'waiting' : 'approved', vendor: v.vendor, status: v.approval === 'تُطلب الآن' ? 'awaitingApproval' : 'approved' }, ...rs]) })}>تسجيل مصروف</Button>} />
      <SummaryStrip items={[
        { label: 'من أموال الملاك — سبتمبر', amount: held.filter((r) => r.status === 'approved').reduce((s, r) => s + r.amount, 0), tone: 'brand', note: 'يُخصم في التصفية' },
        { label: 'بانتظار موافقة المالك', amount: rows.filter((r) => r.status === 'awaitingApproval').reduce((s, r) => s + r.amount, 0), tone: 'warning', note: 'لا يُخصم حتى الموافقة' },
        { label: 'مصروفات المكتب', amount: rows.filter((r) => r.from === 'صندوق المكتب').reduce((s, r) => s + r.amount, 0), tone: 'neutral', note: 'لا تمس أموال الملاك' }
      ]} />
      <div style={{ marginTop: 14 }}>
        <Toolbar q={q} setQ={setQ} ph="الوصف أو المورد أو البند"><Select value={prop} onChange={(e) => setProp(e.target.value)} placeholder="كل العقارات" options={D.properties.map((p) => p.name).concat('المكتب')} /></Toolbar>
        {!list.length ? <Empty onClear={() => { setQ(''); setProp(''); }} /> : <DataTable caption="المصروفات" rows={list} columns={[
          { key: 'd', header: 'التاريخ', render: (r) => num(r.date) },
          { key: 'p', header: 'العقار / الوحدة', render: (r) => cellTwo(r.property, r.unit !== '—' ? 'وحدة ' + r.unit : 'أجزاء مشتركة') },
          { key: 'desc', header: 'البيان', wrap: true, render: (r) => <>{r.desc}<small>{r.cat} · {r.vendor}</small></> },
          { key: 'amt', header: 'المبلغ', numeric: true, render: (r) => <Money value={r.amount} /> },
          { key: 'from', header: 'التمويل', render: (r) => <>{r.from}<small>{APPROVAL[r.approval]}</small></> },
          { key: 's', header: 'الحالة', render: (r) => <StatusBadge size="sm" status={r.status} /> },
          { key: 'a', header: <span className="ap-sr-only">إجراءات</span>, render: (r) => <Acts>{r.status === 'awaitingApproval' ? <Button size="sm" variant="secondary" icon="Handshake" onClick={() => window.apOpen('ownerApproval', { ...r, onSaved: (v) => upd(setRows, r.id, { status: v.decision === 'yes' ? 'approved' : 'rejected', approval: v.decision === 'yes' ? 'approved' : 'waiting' }) })}>توثيق الموافقة</Button> : <Button size="sm" variant="ghost" iconOnly icon="Paperclip" label="الفاتورة" onClick={() => window.apOpen('attachments', { name: r.desc })} />}</Acts> }
        ]} />}
      </div>
    </>
  );
}
window.AP_FORMS.ownerApproval = { title: 'توثيق موافقة المالك', sub: (c) => c && (c.desc + ' · ' + c.property), width: 560, fields: [
  { t: 'summary', rows: (c) => [['المبلغ', c.amount, 'money'], ['حد الاتفاق', 1000, 'money']] },
  { k: 'decision', l: 'رد المالك', t: 'radio', def: 'yes', o: [{ value: 'yes', label: 'وافق' }, { value: 'no', label: 'رفض / أجّل' }] },
  { k: 'how', l: 'كيف وصلت الموافقة', t: 'select', o: ['هاتفيًا', 'واتساب — لقطة مرفقة', 'خطاب موقع', 'بوابة الملاك'], def: 'هاتفيًا' },
  { k: 'proof', l: 'الإثبات', t: 'file', opt: true }
], submit: 'حفظ', done: { title: 'وُثق رد المالك', text: (v) => v.decision === 'yes' ? 'اعتُمد المصروف ويدخل التصفية القادمة.' : 'رُفض المصروف ولن يُخصم من أموال المالك.' } };

const SST = { draft: ['draft', 'مسودة'], awaitingApproval: ['awaitingApproval', 'بانتظار الاعتماد'], approved: ['approved', 'معتمدة — لم تُسلَّم'], partial: ['partial', 'سُلّم جزئيًا'], paid: ['paid', 'سُلّمت'] };
function SettlementsScreen({ openOwner }) {
  const D = window.AP_DATA;
  const [rows, setRows] = React.useState(D.settlements);
  const [period, setPeriod] = React.useState('');
  const [st, setSt] = React.useState('all');
  const [batch, setBatch] = React.useState(false);
  const list = rows.filter((r) => (!period || r.period === period) && (st === 'all' || r.status === st));
  const owed = rows.filter((r) => ['approved', 'partial'].includes(r.status)).reduce((s, r) => s + r.net - r.delivered, 0);
  return (
    <>
      <PageHeader title="حسابات وتصفيات الملاك" description="تصفية كل مالك لكل فترة: تحصيل مؤكد − مصروفات معتمدة − أتعاب = صافي، ثم التسليم كحدث مستقل." actions={<><Button variant="secondary" icon="Plus" onClick={() => window.apOpen('settlement')}>تصفية مالك واحد</Button><Button icon="HandCoins" onClick={() => setBatch(true)}>تصفية مجمعة حسب فترة</Button></>} />
      <SummaryStrip items={[
        { label: 'مستحق للتسليم', amount: owed, tone: 'danger', note: 'معتمد ولم يُسلَّم' },
        { label: 'بانتظار الاعتماد', value: rows.filter((r) => r.status === 'awaitingApproval').length, tone: 'warning', note: 'تصفيات' },
        { label: 'سُلّم في سبتمبر', amount: rows.reduce((s, r) => s + r.delivered, 0), tone: 'success', note: 'تحويل وشيك' }
      ]} />
      <Tabs style={{ marginTop: 18 }} label="حالة التصفية" value={st} onChange={setSt} tabs={[{ id: 'all', label: 'الكل', count: rows.length }, ...['draft', 'awaitingApproval', 'approved', 'partial', 'paid'].filter((k) => SST[k]).map((k) => ({ id: k, label: SST[k][1], count: rows.filter((r) => r.status === k).length }))]} />
      <div className="kit-toolbar" style={{ marginTop: 14 }}><Select value={period} onChange={(e) => setPeriod(e.target.value)} placeholder="كل الفترات" options={['سبتمبر 2026', 'أغسطس 2026']} /></div>
      <DataTable caption="التصفيات" rows={list} footer columns={[
        { key: 'o', header: 'المالك', render: (r) => cellTwo(r.owner, r.period) },
        { key: 'c', header: 'التحصيل المؤكد', numeric: true, render: (r) => <Money value={r.collected} /> },
        { key: 'd', header: 'الخصومات', numeric: true, render: (r) => <Money value={-r.deductions} tone="muted" /> },
        { key: 'f', header: 'الأتعاب', numeric: true, render: (r) => <Money value={-r.fee} tone="muted" /> },
        { key: 'n', header: 'الصافي', numeric: true, render: (r) => <b><Money value={r.net} /></b>, footer: <Money value={list.reduce((s, r) => s + r.net, 0)} /> },
        { key: 'rem', header: 'المتبقي للتسليم', numeric: true, render: (r) => <Money value={r.net - r.delivered} tone={r.net - r.delivered > 0 && r.status !== 'draft' ? 'danger' : 'muted'} />, footer: <Money value={list.filter((r) => r.status !== 'draft').reduce((s, r) => s + r.net - r.delivered, 0)} tone="danger" /> },
        { key: 's', header: 'الحالة', render: (r) => <StatusBadge size="sm" status={SST[r.status][0]} label={SST[r.status][1]} /> },
        { key: 'a', header: <span className="ap-sr-only">إجراءات</span>, render: (r) => <Acts>
          {(r.status === 'draft' || r.status === 'awaitingApproval') && <Button size="sm" variant="secondary" icon="Check" onClick={() => window.apOpen('approve', { subtitle: 'تصفية ' + r.owner + ' — ' + r.period, onSaved: (v) => v.decision === 'approve' && upd(setRows, r.id, { status: 'approved' }) })}>اعتماد</Button>}
          {(r.status === 'approved' || r.status === 'partial') && <Button size="sm" icon="Send" onClick={() => window.apOpen('ownerDelivery', { ...r, onSaved: (v) => { const d = r.delivered + Number(v.amount); upd(setRows, r.id, { delivered: d, status: d >= r.net ? 'paid' : 'partial' }); } })}>تسليم</Button>}
          <Button size="sm" variant="ghost" iconOnly icon="Printer" label="طباعة الكشف" onClick={() => window.apDoc('settlement', { owner: r.ownerId, period: r.period })} />
          <Button size="sm" variant="ghost" iconOnly icon="ExternalLink" label="ملف المالك" onClick={() => openOwner(r.ownerId)} />
        </Acts> }
      ]} />
      <p className="kit-scope">الاعتماد لا يعني التسليم. التسليم الجزئي يُبقي المتبقي ظاهرًا حتى يكتمل. التحويلات المباشرة للمالك لا تدخل «التحصيل المؤكد» هنا.</p>
      {batch && window.SettlementBatchDialog && <window.SettlementBatchDialog onClose={() => setBatch(false)} onSaved={() => { setBatch(false); setRows(D.settlements); setSt('draft'); }} />}
    </>
  );
}

function ManagementScreen() {
  const D = window.AP_DATA;
  const [tab, setTab] = React.useState('agreements');
  return (
    <>
      <PageHeader title="اتفاقات وأتعاب الإدارة" description="كيف تُحسب أتعاب المكتب لكل مالك، وحد الصرف بدون موافقته، وما سدده المالك من الأتعاب." actions={tab === 'agreements' ? <Button icon="Plus" onClick={() => window.apOpen('agreement')}>اتفاق جديد</Button> : null} />
      <Tabs label="أقسام الأتعاب" value={tab} onChange={setTab} tabs={[{ id: 'agreements', label: 'الاتفاقات', count: D.agreements.length }, { id: 'fees', label: 'الأتعاب المستحقة' }, { id: 'payments', label: 'سداد المالك المباشر' }]} />
      <div style={{ marginTop: 14 }}>
      {tab !== 'agreements' && window.ManagementFees && <window.ManagementFees tab={tab} />}
      {tab === 'agreements' && <>
      <DataTable caption="الاتفاقات" rows={D.agreements} columns={[
        { key: 'o', header: 'المالك', render: (g) => cellTwo(g.owner, g.scope) },
        { key: 'b', header: 'أساس الأتعاب', render: (g) => cellTwo(g.value, g.basis) },
        { key: 's', header: 'التصفية', render: (g) => g.settle },
        { key: 'c', header: 'حد الصرف', numeric: true, render: (g) => <Money value={g.expensesCap} /> },
        { key: 'f', header: 'يسري من', render: (g) => num(g.from) },
        { key: 'st', header: 'الحالة', render: (g) => <StatusBadge size="sm" status={g.status} label={g.status === 'awaitingApproval' ? 'بانتظار توقيع المالك' : 'ساري'} /> },
        { key: 'a', header: <span className="ap-sr-only">إجراءات</span>, render: (g) => <Acts><Button size="sm" variant="secondary" icon="Pencil" onClick={() => window.apOpen('agreement', g)}>تعديل</Button><Button size="sm" variant="ghost" iconOnly icon="Paperclip" label="نسخة الاتفاق" onClick={() => window.apOpen('attachments', { name: 'اتفاق ' + g.owner })} /></Acts> }
      ]} />
      <Alert tone="neutral" style={{ marginTop: 14 }}>الأتعاب تُحسب على قبض المكتب المؤكد فقط. تعديل الاتفاق يسري على الفترات القادمة ولا يعيد حساب تصفيات معتمدة.</Alert>
      </>}
      </div>
    </>
  );
}

function CustodyScreen() {
  const D = window.AP_DATA;
  const [rows, setRows] = React.useState(D.custody);
  return (
    <>
      <PageHeader title="العهد والمطابقة" description="النقد بيد كل موظف حتى يسلّمه. التسليم يحتاج تأكيد المستلم." actions={<Button variant="secondary" icon="HandCoins" onClick={() => window.apOpen('custodyGive')}>صرف عهدة</Button>} />
      <SummaryStrip items={[
        { label: 'نقد لدى الموظفين', amount: rows.reduce((s, r) => s + r.cash, 0), tone: 'warning', note: rows.filter((r) => r.cash).length + ' موظفين' },
        { label: 'الصندوق الرئيسي', amount: 18400, tone: 'brand', note: 'عهدة أحمد الزهراني' },
        { label: 'فروقات مفتوحة', amount: 20, tone: 'danger', note: 'قيد تسوية مسودة' }
      ]} />
      <section className="kit-group" style={{ marginTop: 16 }}>
        <header><h2>أرصدة العهد</h2><p>الرصيد = ما قبضه نقدًا − ما صرفه − ما سلّمه.</p></header>
        <DataTable caption="أرصدة العهد" rows={rows} columns={[
          { key: 'm', header: 'الموظف', render: (r) => r.member },
          { key: 'c', header: 'الرصيد النقدي', numeric: true, render: (r) => <Money value={r.cash} tone={r.cash ? undefined : 'muted'} size="md" /> },
          { key: 'l', header: 'آخر تسليم', render: (r) => num(r.lastHand) },
          { key: 's', header: 'الحالة', render: (r) => <StatusBadge size="sm" tone={r.status === 'open' ? 'warning' : 'neutral'} showIcon={false} label={r.status === 'open' ? 'عهدة مفتوحة' : 'مغلقة'} /> },
          { key: 'a', header: <span className="ap-sr-only">إجراءات</span>, render: (r) => <Acts>{r.cash > 0 && <Button size="sm" icon="ArrowLeftRight" onClick={() => window.apOpen('custodyHandover', { ...r, onSaved: () => upd(setRows, r.id, { cash: 0, lastHand: '23/09/2026' }) })}>تسليم ومطابقة</Button>}</Acts> }
        ]} />
      </section>
      <section className="kit-group">
        <header><h2>آخر الحركات</h2></header>
        <DataTable caption="حركة العهد" rows={D.custodyMoves} columns={[
          { key: 'd', header: 'التاريخ', render: (r) => num(r.date) },
          { key: 'm', header: 'الموظف', render: (r) => r.member },
          { key: 'k', header: 'النوع', render: (r) => r.kind },
          { key: 'x', header: 'البيان', wrap: true, render: (r) => r.desc },
          { key: 'a', header: 'المبلغ', numeric: true, render: (r) => <Money value={r.amount} showSign tone={r.amount < 0 ? 'muted' : undefined} /> }
        ]} />
      </section>
    </>
  );
}

function BooksScreen() {
  const D = window.AP_DATA;
  const [rows, setRows] = React.useState(D.journal);
  const [src, setSrc] = React.useState('');
  const [q, setQ] = React.useState('');
  const list = rows.filter((r) => (!src || r.source === src) && match(q, r.id, r.desc, r.debit, r.credit));
  return (
    <>
      <PageHeader title="الدفاتر والقيود" description="قيود اليومية الناتجة عن كل عملية. القيد المرحّل لا يُعدل؛ يُعكس." actions={<><Button variant="secondary" icon="BookOpen" onClick={() => window.apOpen('report', D.reports[5])}>ميزان المراجعة</Button><Button icon="Plus" onClick={() => window.apOpen('journal', { onSaved: (v) => setRows((rs) => [{ id: 'JV-2026-0320', date: '23/09/2026', desc: v.desc, source: 'قيد يدوي', debit: v.debit, credit: v.credit, amount: Number(v.amount), status: 'draft' }, ...rs]) })}>قيد يدوي</Button></>} />
      <Toolbar q={q} setQ={setQ} ph="رقم القيد أو البيان أو الحساب"><Select value={src} onChange={(e) => setSrc(e.target.value)} placeholder="كل المصادر" options={['سند قبض', 'مصروف', 'عهدة', 'عكس', 'قيد يدوي']} /></Toolbar>
      {!list.length ? <Empty onClear={() => { setQ(''); setSrc(''); }} /> : <DataTable caption="القيود" rows={list} columns={[
        { key: 'id', header: 'القيد', render: (r) => cellTwo(<bdi className="ap-ltr">{r.id}</bdi>, r.date) },
        { key: 'desc', header: 'البيان', wrap: true, render: (r) => <>{r.desc}<small>المصدر: {r.source}</small></> },
        { key: 'dr', header: 'مدين', render: (r) => r.debit },
        { key: 'cr', header: 'دائن', render: (r) => r.credit },
        { key: 'amt', header: 'المبلغ', numeric: true, render: (r) => <Money value={r.amount} struck={r.status === 'reversed'} /> },
        { key: 's', header: 'الحالة', render: (r) => <StatusBadge size="sm" status={r.status === 'posted' ? 'confirmed' : r.status} label={r.status === 'posted' ? 'مرحّل' : undefined} /> },
        { key: 'a', header: <span className="ap-sr-only">إجراءات</span>, render: (r) => <Acts>{r.status === 'draft' ? <Button size="sm" variant="secondary" icon="Check" onClick={() => window.apOpen('approve', { subtitle: r.id + ' · ' + r.desc, onSaved: (v) => v.decision === 'approve' && upd(setRows, r.id, { status: 'posted' }) })}>ترحيل</Button> : r.status === 'posted' && r.source === 'قيد يدوي' ? <Button size="sm" variant="ghost" iconOnly icon="Undo2" label="عكس القيد" onClick={() => window.apOpen('reverse', { receipt: r.id, amount: r.amount, tenant: r.desc, date: r.date })} /> : null}</Acts> }
      ]} />}
    </>
  );
}

function ReportsScreen() {
  const D = window.AP_DATA;
  return (
    <>
      <PageHeader title="التقارير" description="كل تقرير يُبنى من العمليات المؤكدة، ويفصل ما بانتظار التحقق وما حُوّل للمالك مباشرة." />
      {window.OperationalReportCards && <window.OperationalReportCards />}
      <div className="kit-cards">{D.reports.map((r) => <article key={r.id} className="kit-card">
        <div style={{ display: 'flex', gap: 12, alignItems: 'flex-start' }}><span className="kit-card__icon"><Icon name={r.icon} size={20} /></span><div><h3>{r.title}</h3><p style={{ display: 'block' }}>{r.desc}</p></div></div>
        <div style={{ display: 'flex', gap: 6 }}><Button size="sm" variant="secondary" icon="Eye" onClick={() => window.apOpen('report', r)}>إعداد وعرض</Button><Button size="sm" variant="ghost" icon="Download" onClick={() => window.apOpen('backup')}>Excel</Button></div>
      </article>)}</div>
    </>
  );
}

Object.assign(window, { ExpensesScreen, SettlementsScreen, ManagementScreen, CustodyScreen, BooksScreen, ReportsScreen });
})();