/* intake-tasks-panel.jsx — IntakeTask list + route queue (P3 · KSH-350) */
(function () {
  const { Badge, Button } = window.DesignSystem_9e0a09;
  const { Ic } = window;
  const { useState, useEffect, useCallback } = React;

  const ROLE_LABEL = { measurer: 'Замерщик', manager: 'Менеджер', designer: 'Дизайнер', client: 'Клиент', foreman: 'Прораб' };
  const KIND_ICON = { measure_field: 'ruler', measure_order: 'calendar', client: 'user', dp_brief: 'palette' };

  function useIntakeFeed(dealId) {
    const FI = window.FormInstances;
    const reload = useCallback(() => {
      if (!FI) return { tasks: [], routes: [] };
      return {
        tasks: FI.loadAllOpenTasks(dealId ? { dealId } : {}),
        routes: FI.loadOpenRoutes(dealId || undefined),
      };
    }, [dealId, FI]);
    const [data, setData] = useState(reload);

    useEffect(() => {
      setData(reload());
      const onUp = () => setData(reload());
      window.addEventListener('remontpro:forms-updated', onUp);
      window.addEventListener('remontpro:measure-submitted', onUp);
      window.addEventListener('remontpro:intake-route', onUp);
      window.addEventListener('remontpro:intake-updated', onUp);
      return () => {
        window.removeEventListener('remontpro:forms-updated', onUp);
        window.removeEventListener('remontpro:measure-submitted', onUp);
        window.removeEventListener('remontpro:intake-route', onUp);
        window.removeEventListener('remontpro:intake-updated', onUp);
      };
    }, [reload]);

    return data;
  }

  function IntakeRouteQueue({ dealId, compact, onAcknowledge }) {
    const FI = window.FormInstances;
    const { routes } = useIntakeFeed(dealId);
    if (!FI || !routes.length) return null;

    return (
      <div className={compact ? 'it-routes it-routes-compact' : 'it-routes'}>
        {routes.map((r) => (
          <div key={r.id} className="it-route-row">
            <span className="it-route-ic"><Ic n={r.type === 'dp_queue' ? 'palette' : 'hard-hat'} s={15} /></span>
            <div className="it-route-main">
              <div className="it-route-t">{r.title}</div>
              <div className="it-route-s">{r.dealId} · {r.at ? r.at.slice(0, 16).replace('T', ' ') : ''}</div>
            </div>
            <Badge tone={r.type === 'dp_queue' ? 'info' : 'success'} dot>{r.type === 'dp_queue' ? 'ДП' : 'Прораб'}</Badge>
            {onAcknowledge && (
              <Button variant="ghost" size="sm" onClick={() => { FI.acknowledgeRoute(r.id); onAcknowledge(r); }}>Принято</Button>
            )}
          </div>
        ))}
      </div>
    );
  }

  function IntakeTasksPanel({ dealId, assigneeRole, title, sub, emptyText, onOpenDeal }) {
    const FI = window.FormInstances;
    const { tasks } = useIntakeFeed(dealId);
    const filtered = tasks.filter((t) => {
      if (assigneeRole && t.assigneeRole !== assigneeRole) return false;
      return true;
    });

    if (!FI) {
      return <div className="it-empty">FormInstances не загружен</div>;
    }

    return (
      <div className="it-panel">
        {(title || sub) && (
          <div className="it-head">
            {title && <div className="it-title">{title}</div>}
            {sub && <div className="it-sub">{sub}</div>}
          </div>
        )}
        {!filtered.length ? (
          <div className="it-empty">{emptyText || 'Нет открытых задач по формам'}</div>
        ) : (
          <div className="uni-list">
            {filtered.map((t) => (
              <div key={t.id} className="uni-row" style={{ cursor: 'default' }}>
                <span className="lk-q-ic" style={{ background: 'var(--primary-soft)', color: 'var(--primary)' }}>
                  <Ic n={KIND_ICON[t.kind] || 'clipboard-list'} s={16} />
                </span>
                <div className="uni-main">
                  <div className="uni-t">{t.title}</div>
                  <div className="uni-s">{t.dealId} · {ROLE_LABEL[t.assigneeRole] || t.assigneeRole || 'исполнитель'}</div>
                </div>
                <div style={{ display: 'flex', gap: 6, flexWrap: 'wrap', justifyContent: 'flex-end' }}>
                  {onOpenDeal && (
                    <Button variant="ghost" size="sm" onClick={() => onOpenDeal(t.dealId)}>Сделка</Button>
                  )}
                  <Button variant="primary" size="sm" iconLeft={<Ic n="external-link" s={13} />}
                    onClick={() => { window.open(t.url, '_blank'); }}>
                    Открыть форму
                  </Button>
                  <Button variant="ghost" size="sm" onClick={() => FI.completeTask(t.dealId, t.id)}>Готово</Button>
                </div>
              </div>
            ))}
          </div>
        )}
      </div>
    );
  }

  function IntakeCalcSyncBanner({ dealId }) {
    const FI = window.FormInstances;
    const intake = window.loadSiteIntake ? window.loadSiteIntake(dealId) : null;
    const { routes } = useIntakeFeed(dealId);
    const hint = FI ? FI.loadCalcInboxHint(dealId) : null;
    const route = routes[0];
    if (!intake || intake.status !== 'measurement_done') return null;

    return (
      <div className="cc-intake-attn cc-intake-attn-ok">
        <Ic n="check-circle" s={16} c="var(--success-strong)" />
        <span>
          Замер в SiteIntake · {(intake.rooms || []).length} помещ.
          {route ? ' · ' + route.title : ''}
          {hint ? ' · ' + hint.label : ''}
        </span>
        {route && (
          <Badge tone={route.type === 'dp_queue' ? 'info' : 'success'} dot>
            {route.type === 'dp_queue' ? 'Маршрут: ДП' : 'Маршрут: прораб'}
          </Badge>
        )}
      </div>
    );
  }

  window.IntakeTasksPanel = IntakeTasksPanel;
  window.IntakeRouteQueue = IntakeRouteQueue;
  window.IntakeCalcSyncBanner = IntakeCalcSyncBanner;
})();