// ─── تب قوانین عملیاتی ─────────────────────────────────────────────────────
// قانونِ کاربر (۲۰۲۶-۰۸-۰۴): این تب قبلاً فقط یه پیامِ «خالیه» بود. قوانینِ چرخه‌یِ
// لید (mrket_rules — همون MarketRulesTab که تو leadpool.jsx دوباره وصل شد) اینجا
// نمایش داده می‌شن — این‌ها اصلاً به distrules منتقل نشده بودن، فقط یتیم مونده بودن.
// قانونِ کاربر (۲۰۲۶-۰۸-۱۷): منطقِ اولویتِ «لیدِ پیشنهادیِ کارتابل» (crmModule.js،
// GET /dashboard → opportunities) قبلاً کاملاً هاردکد بود — حالا از جدولِ
// kartabl_priority_settings خونده می‌شه و از همین پنل قابلِ‌تنظیمه.
const KartablPrioritySettings = ({ api, toast }) => {
  const [s, setS] = React.useState(null);
  const [saving, setSaving] = React.useState(false);

  const load = () => api('/api/crm/admin/kartabl-priority-settings').then(r => setS(r.data || r)).catch(() => {});
  React.useEffect(() => { load(); }, []);

  const save = async (patch) => {
    setSaving(true);
    try {
      const r = await api('/api/crm/admin/kartabl-priority-settings', { method: 'PUT', body: JSON.stringify(patch) });
      setS(r.data || r);
      toast && toast('ذخیره شد ✓');
    } catch (e) { toast && toast(e.message || 'خطا در ذخیره', 'error'); }
    finally { setSaving(false); }
  };

  const moveSeg = (i, dir) => {
    const arr = [...s.segment_order];
    const j = i + dir;
    if (j < 0 || j >= arr.length) return;
    [arr[i], arr[j]] = [arr[j], arr[i]];
    save({ segment_order: arr });
  };

  const QUEUE_TIER_LABEL = { today: 'پیگیریِ امروز', untouched: 'کاملاً دست‌نخورده', followup: 'نیازمندِ پیگیری' };
  const moveQueueTier = (i, dir) => {
    const arr = [...s.queue_tier_order];
    const j = i + dir;
    if (j < 0 || j >= arr.length) return;
    [arr[i], arr[j]] = [arr[j], arr[i]];
    save({ queue_tier_order: arr });
  };

  if (!s) return null;

  return (
    <div style={{ background:'rgba(99,102,241,.08)', border:'1px solid rgba(99,102,241,.25)', borderRadius:10, padding:14, marginBottom:14, fontSize:12.5, color:'#cbd5e1' }}>
      <div style={{ fontWeight:700, color:'#e2e8f0', marginBottom:10 }}>⚙️ اولویتِ لیدِ پیشنهادیِ کارتابل</div>

      <div style={{ display:'flex', alignItems:'center', justifyContent:'space-between', padding:'6px 0', borderBottom:'1px solid rgba(255,255,255,.08)' }}>
        <div>
          <div style={{ color:'#e2e8f0' }}>اولویتِ ۱ — پیگیریِ زمان‌دارِ سررسیده</div>
          <div style={{ opacity:.65, fontSize:11 }}>لیدهایی که مشاور برایِ‌شون پیگیری ست کرده و زمانش رسیده، اول نشون داده بشن</div>
        </div>
        <label style={{ display:'flex', alignItems:'center', gap:6, cursor:'pointer' }}>
          <input type="checkbox" checked={!!s.tier1_enabled} disabled={saving} onChange={e => save({ tier1_enabled: e.target.checked })}/>
          فعال
        </label>
      </div>

      <div style={{ display:'flex', alignItems:'center', justifyContent:'space-between', padding:'6px 0', borderBottom:'1px solid rgba(255,255,255,.08)' }}>
        <div>
          <div style={{ color:'#e2e8f0' }}>اولویتِ کمپینِ فعالِ امروز</div>
          <div style={{ opacity:.65, fontSize:11 }}>لیدهایِ کمپینی که امروز بینِ تاریخِ شروع/پایانشه (از بخشِ اتوماسیون)، زودتر بیان تویِ کارتابل</div>
        </div>
        <label style={{ display:'flex', alignItems:'center', gap:6, cursor:'pointer' }}>
          <input type="checkbox" checked={!!s.campaign_priority_enabled} disabled={saving} onChange={e => save({ campaign_priority_enabled: e.target.checked })}/>
          فعال
        </label>
      </div>

      <div style={{ display:'flex', alignItems:'center', justifyContent:'space-between', padding:'6px 0', borderBottom:'1px solid rgba(255,255,255,.08)' }}>
        <div>
          <div style={{ color:'#e2e8f0' }}>لیدهایِ «بی‌پاسخ» اولویتِ ۱ نگیرن</div>
          <div style={{ opacity:.65, fontSize:11 }}>حتی اگه پیگیری‌شون سررسیده باشه، تويِ کارتابل بالا نیان — فقط از ستونِ بی‌پاسخِ خودشون قابلِ‌دیدن باشن</div>
        </div>
        <label style={{ display:'flex', alignItems:'center', gap:6, cursor:'pointer' }}>
          <input type="checkbox" checked={!!s.exclude_no_answer_from_tier1} disabled={saving} onChange={e => save({ exclude_no_answer_from_tier1: e.target.checked })}/>
          فعال
        </label>
      </div>

      <div style={{ display:'flex', alignItems:'center', gap:10, padding:'8px 0', borderBottom:'1px solid rgba(255,255,255,.08)' }}>
        <div style={{ flex:1 }}>مهلتِ اضافه برایِ «سررسیده»دانستنِ پیگیری (دقیقه)</div>
        <input type="number" defaultValue={s.overdue_grace_minutes} disabled={saving}
          onBlur={e => save({ overdue_grace_minutes: Number(e.target.value) || 0 })}
          style={{ width:70, padding:'4px 8px', borderRadius:6, border:'1px solid rgba(255,255,255,.2)', background:'rgba(0,0,0,.3)', color:'#e2e8f0', fontFamily:'inherit' }}/>
      </div>

      <div style={{ display:'flex', alignItems:'center', justifyContent:'space-between', padding:'8px 0', borderBottom:'1px solid rgba(255,255,255,.08)' }}>
        <div>
          <div style={{ color:'#e2e8f0' }}>اولویتِ ۲ — لیدِ جدید بر اساسِ سگمنت</div>
          <div style={{ opacity:.65, fontSize:11 }}>لیدهایِ بدونِ تماسِ قبلی، به‌ترتیبِ زیر</div>
        </div>
        <label style={{ display:'flex', alignItems:'center', gap:6, cursor:'pointer' }}>
          <input type="checkbox" checked={!!s.tier2_enabled} disabled={saving} onChange={e => save({ tier2_enabled: e.target.checked })}/>
          فعال
        </label>
      </div>

      <div style={{ display:'flex', alignItems:'center', gap:10, padding:'8px 0', borderBottom:'1px solid rgba(255,255,255,.08)' }}>
        <div style={{ flex:1 }}>نادیده‌گرفتنِ لیدهایِ تخصیص‌داده‌شده قبل از (دیتایِ تست)</div>
        <input type="date" defaultValue={s.assigned_after || ''} disabled={saving}
          onBlur={e => save({ assigned_after: e.target.value || null })}
          style={{ padding:'4px 8px', borderRadius:6, border:'1px solid rgba(255,255,255,.2)', background:'rgba(0,0,0,.3)', color:'#e2e8f0', fontFamily:'inherit' }}/>
      </div>

      <div style={{ display:'flex', gap:8, padding:'8px 0' }}>
        {s.segment_order.map((seg, i) => (
          <div key={seg} style={{ display:'flex', alignItems:'center', gap:4, background:'rgba(255,255,255,.06)', borderRadius:8, padding:'4px 8px' }}>
            <span>{i + 1}. {seg}</span>
            <button disabled={saving || i === 0} onClick={() => moveSeg(i, -1)} style={{ background:'none', border:'none', color:'#94a3b8', cursor:'pointer', fontSize:12 }}>◀</button>
            <button disabled={saving || i === s.segment_order.length - 1} onClick={() => moveSeg(i, 1)} style={{ background:'none', border:'none', color:'#94a3b8', cursor:'pointer', fontSize:12 }}>▶</button>
          </div>
        ))}
      </div>

      <div style={{ opacity:.6, marginTop:6, fontSize:11 }}>اولویتِ ۳ (fallback برایِ بقیه‌ی لیدها، همیشه فعال): وزنِ وضعیت/ستون (زیر) &gt; امتیاز &gt; تازگی.</div>

      <div style={{ fontWeight:700, color:'#e2e8f0', margin:'16px 0 10px' }}>📋 اولویتِ صفِ کاریِ امروز (GET /queue)</div>
      <div style={{ opacity:.65, fontSize:11, marginBottom:8 }}>ترتیب و فعال/غیرفعال‌بودنِ ۳ تیرِ صفِ کاری — مستقل از تنظیماتِ بالا (که فقط برایِ «لیدِ پیشنهادیِ بعدی»ست)</div>

      <div style={{ display:'flex', alignItems:'center', justifyContent:'space-between', padding:'6px 0', borderBottom:'1px solid rgba(255,255,255,.08)' }}>
        <div style={{ color:'#e2e8f0' }}>پیگیریِ امروز</div>
        <label style={{ display:'flex', alignItems:'center', gap:6, cursor:'pointer' }}>
          <input type="checkbox" checked={!!s.tier1_enabled} disabled={saving} onChange={e => save({ tier1_enabled: e.target.checked })}/>
          فعال
        </label>
      </div>
      <div style={{ display:'flex', alignItems:'center', justifyContent:'space-between', padding:'6px 0', borderBottom:'1px solid rgba(255,255,255,.08)' }}>
        <div style={{ color:'#e2e8f0' }}>کاملاً دست‌نخورده</div>
        <label style={{ display:'flex', alignItems:'center', gap:6, cursor:'pointer' }}>
          <input type="checkbox" checked={!!s.tier2_enabled} disabled={saving} onChange={e => save({ tier2_enabled: e.target.checked })}/>
          فعال
        </label>
      </div>
      <div style={{ display:'flex', alignItems:'center', justifyContent:'space-between', padding:'6px 0', borderBottom:'1px solid rgba(255,255,255,.08)' }}>
        <div style={{ color:'#e2e8f0' }}>نیازمندِ پیگیری</div>
        <label style={{ display:'flex', alignItems:'center', gap:6, cursor:'pointer' }}>
          <input type="checkbox" checked={!!s.tier3_enabled} disabled={saving} onChange={e => save({ tier3_enabled: e.target.checked })}/>
          فعال
        </label>
      </div>

      <div style={{ display:'flex', gap:8, padding:'10px 0', flexWrap:'wrap' }}>
        {(s.queue_tier_order || []).map((tier, i) => (
          <div key={tier} style={{ display:'flex', alignItems:'center', gap:4, background:'rgba(255,255,255,.06)', borderRadius:8, padding:'4px 8px' }}>
            <span>{i + 1}. {QUEUE_TIER_LABEL[tier] || tier}</span>
            <button disabled={saving || i === 0} onClick={() => moveQueueTier(i, -1)} style={{ background:'none', border:'none', color:'#94a3b8', cursor:'pointer', fontSize:12 }}>◀</button>
            <button disabled={saving || i === s.queue_tier_order.length - 1} onClick={() => moveQueueTier(i, 1)} style={{ background:'none', border:'none', color:'#94a3b8', cursor:'pointer', fontSize:12 }}>▶</button>
          </div>
        ))}
      </div>
    </div>
  );
};

const STATUS_FA = { new:'لیدِ جدید', interested:'علاقه‌مند', scheduled:'وقتِ گرفته‌شده', follow_up:'پیگیری', re_request:'درخواستِ مجدد', negotiating:'درحالِ مذاکره', ready_to_buy:'آماده‌یِ خرید' };

const KartablStatusWeights = ({ api, toast }) => {
  const [data, setData] = React.useState(null);
  const load = () => api('/api/crm/admin/kartabl-status-weights').then(r => setData(r.data || r)).catch(() => {});
  React.useEffect(() => { load(); }, []);

  const save = async (key_type, key_value, weight) => {
    try {
      await api('/api/crm/admin/kartabl-status-weights', { method:'PUT', body: JSON.stringify({ key_type, key_value, weight }) });
      toast && toast('وزن ذخیره شد ✓');
    } catch (e) { toast && toast(e.message || 'خطا در ذخیره', 'error'); }
  };

  if (!data) return null;

  const Row = ({ label, value, onSave }) => (
    <div style={{ display:'flex', alignItems:'center', justifyContent:'space-between', padding:'5px 0', borderBottom:'1px solid rgba(255,255,255,.06)' }}>
      <span>{label}</span>
      <input type="number" defaultValue={value} onBlur={e => onSave(Number(e.target.value) || 0)}
        style={{ width:60, padding:'3px 6px', borderRadius:6, border:'1px solid rgba(255,255,255,.2)', background:'rgba(0,0,0,.3)', color:'#e2e8f0', fontFamily:'inherit' }}/>
    </div>
  );

  return (
    <div style={{ background:'rgba(99,102,241,.08)', border:'1px solid rgba(99,102,241,.25)', borderRadius:10, padding:14, marginBottom:14, fontSize:12.5, color:'#cbd5e1' }}>
      <div style={{ fontWeight:700, color:'#e2e8f0', marginBottom:8 }}>⚖️ وزنِ اولویتِ کارتابل بر اساسِ وضعیت / ستون (اولویتِ ۳، fallback)</div>
      <div style={{ opacity:.65, fontSize:11, marginBottom:8 }}>عددِ بزرگ‌تر = اولویتِ بالاتر تویِ کارتابل. اگه لیدی هم وضعیتِ ثابت داشته باشه هم تویِ یه ستونِ سفارشی باشه، بیشترینِ وزن حساب می‌شه.</div>

      <div style={{ fontWeight:600, marginTop:6, marginBottom:4 }}>وضعیت‌هایِ ثابت</div>
      {data.statuses.map(s => (
        <Row key={s.key_value} label={STATUS_FA[s.key_value] || s.key_value} value={s.weight}
          onSave={w => save('status', s.key_value, w)}/>
      ))}

      {data.columns.length > 0 && (
        <>
          <div style={{ fontWeight:600, marginTop:10, marginBottom:4 }}>ستون‌هایِ سفارشیِ فروش‌یارها</div>
          {data.columns.map(c => (
            <Row key={c.key_value} label={c.label} value={c.weight}
              onSave={w => save('column', c.key_value, w)}/>
          ))}
        </>
      )}
    </div>
  );
};

// قانونِ کاربر (۲۰۲۶-۰۸-۱۹ → ۲۰۲۶-۰۸-۲۰): نحوه‌ی محاسبه‌ی «نرخ کانورت»/«نرخ پاسخ» فروشنده‌ها
// (پایه‌ی «لید نیاز» تویِ تارگت‌گذاریِ فروش) از پنلِ ادمین قابلِ‌تنظیمه — به‌ازایِ هر ماه جدا
// (نه یه سوییچِ سراسریِ ثابت)، و قابلِ‌گسترش (می‌شه پارامترِ سفارشیِ جدید هم اضافه کرد).
const SellerStatsSettings = ({ api, toast }) => {
  const { useState, useEffect } = React;
  const { fa } = window.SB_DATA;
  // قانونِ کاربر (۲۰۲۶-۰۸-۲۴): «period» حالا مستقیماً یه ماهِ شمسیِ کامله (نه ماهِ میلادی با
  // برچسبِ تقریبیِ شمسی) — jalaliMonthRange تویِ rules_shared.jsx تعریف شده.
  const [periodOffset, setPeriodOffset] = useState(0);
  const { jy, jm } = jalaliMonthRange(new Date(), periodOffset);
  const period = `${jy}-${String(jm).padStart(2, '0')}`;
  const periodLabelFa = `${JALALI_MONTHS[jm - 1]} ${fa(String(jy))}`;

  const [params,  setParams]  = useState(null);
  const [saving,  setSaving]  = useState(false);
  const [adding,  setAdding]  = useState(false);
  const [newParam, setNewParam] = useState({ key: '', label: '', description: '' });

  const load = () => api(`/api/crm/admin/seller-stats-params?period=${period}`).then(r => setParams((r.data || r).params || [])).catch(() => setParams([]));
  useEffect(() => { setParams(null); load(); }, [period]);

  const saveVal = async (key, value) => {
    setSaving(true);
    try {
      await api(`/api/crm/admin/seller-stats-params/${key}`, { method: 'PUT', body: JSON.stringify({ period, value }) });
      toast && toast('ذخیره شد ✓');
      load();
    } catch (e) { toast && toast(e.message || 'خطا در ذخیره', 'error'); }
    finally { setSaving(false); }
  };

  const addParam = async () => {
    if (!newParam.key.trim() || !newParam.label.trim()) return toast && toast('کلید و عنوان الزامی است', 'error');
    if (!/^[a-z0-9_]+$/.test(newParam.key.trim())) return toast && toast('کلید فقط حروفِ لاتینِ کوچک/عدد/آندرلاین', 'error');
    try {
      await api('/api/crm/admin/seller-stats-params', { method: 'POST', body: JSON.stringify({ period, ...newParam, value: '0', value_type: 'boolean' }) });
      toast && toast('پارامتر اضافه شد ✓ — یادت باشه بدونِ کدِ متناظر، فقط داده‌ست و اثری نداره');
      setAdding(false); setNewParam({ key: '', label: '', description: '' });
      load();
    } catch (e) { toast && toast(e.message || 'خطا در افزودن', 'error'); }
  };

  const removeParam = async (id) => {
    if (!confirm('این پارامترِ سفارشی حذف بشه؟')) return;
    try { await api(`/api/crm/admin/seller-stats-params/${id}`, { method: 'DELETE' }); load(); }
    catch (e) { toast && toast(e.message || 'خطا در حذف', 'error'); }
  };

  return (
    <CollapsibleSection icon="📊" title="محاسبه‌ی نرخ کانورت/پاسخ فروشنده‌ها" hint="پایه‌ی «لید نیاز» تویِ تارگت‌گذاریِ فروش">
      <div style={{ display:'flex', alignItems:'center', gap:8, marginBottom:12, background:'rgba(255,255,255,.04)', border:'1px solid rgba(255,255,255,.08)', borderRadius:9, padding:'6px 8px', width:'fit-content' }}>
        <button className="sw-btn sw-btn-ghost" style={{padding:'4px 9px',fontSize:11}} onClick={()=>setPeriodOffset(o=>o-1)}>→ ماهِ قبل</button>
        <div style={{fontSize:12,fontWeight:800,minWidth:90,textAlign:'center',color:'#e2e8f0'}}>{periodLabelFa}{periodOffset===0 && <span style={{fontSize:9,color:'#34d399',display:'block',fontWeight:700}}>(ماهِ جاری)</span>}</div>
        <button className="sw-btn sw-btn-ghost" style={{padding:'4px 9px',fontSize:11}} onClick={()=>setPeriodOffset(o=>o+1)}>ماهِ بعد ←</button>
        {periodOffset!==0 && <button className="sw-btn sw-btn-ghost" style={{padding:'4px 9px',fontSize:10}} onClick={()=>setPeriodOffset(0)}>بازگشت</button>}
      </div>

      {params === null ? (
        <div style={{ padding:16, textAlign:'center', color:'#374151', fontSize:12 }}>در حال بارگذاری...</div>
      ) : (
        <>
          {params.map(p => (
            <div key={p.key} style={{ position:'relative' }}>
              {p.value_type === 'number' ? (
                <div style={{ display:'flex', alignItems:'center', justifyContent:'space-between', padding:'8px 10px', borderBottom:'1px solid rgba(255,255,255,.06)' }}>
                  <div>
                    <div style={{ fontSize:12.5, color:'#e2e8f0', fontWeight:600 }}>{p.label}</div>
                    {p.description && <div style={{ fontSize:10.5, color:'#64748b', marginTop:2, maxWidth:420 }}>{p.description}</div>}
                  </div>
                  <input type="number" defaultValue={p.value} disabled={saving} key={p.value}
                    onBlur={e => { const v = Number(e.target.value); if (!Number.isNaN(v) && String(v) !== p.value) saveVal(p.key, String(v)); }}
                    style={{ ...RULES_INP, width:70, textAlign:'center' }}/>
                </div>
              ) : (
                <ToggleRow title={p.label} hint={p.description}
                  on={p.value === '1' || p.value === true} disabled={saving}
                  onClick={() => saveVal(p.key, (p.value === '1' || p.value === true) ? '0' : '1')}/>
              )}
              {!p.is_builtin && (
                <button onClick={() => removeParam(p.id)} title="حذفِ این پارامترِ سفارشی"
                  style={{ position:'absolute', top:8, left:8, width:20, height:20, borderRadius:6, border:'none', background:'rgba(239,68,68,0.12)', color:'#f87171', cursor:'pointer', fontSize:12, lineHeight:1 }}>{'×'}</button>
              )}
            </div>
          ))}

          {adding ? (
            <div style={{ ...RULES_CARD, display:'flex', flexDirection:'column', gap:8 }}>
              <input placeholder="کلید (لاتین، مثلاً no_answer_ratio)" value={newParam.key} onChange={e=>setNewParam(p=>({...p,key:e.target.value.trim()}))} style={RULES_INP}/>
              <input placeholder="عنوان نمایشی" value={newParam.label} onChange={e=>setNewParam(p=>({...p,label:e.target.value}))} style={RULES_INP}/>
              <input placeholder="توضیح (اختیاری)" value={newParam.description} onChange={e=>setNewParam(p=>({...p,description:e.target.value}))} style={RULES_INP}/>
              <div style={{ display:'flex', gap:8 }}>
                <button onClick={addParam} style={{ padding:'6px 14px', borderRadius:7, fontSize:11, cursor:'pointer', border:'none', background:'#6366F1', color:'#fff', fontWeight:600 }}>افزودن</button>
                <button onClick={()=>setAdding(false)} style={{ padding:'6px 14px', borderRadius:7, fontSize:11, cursor:'pointer', border:'1px solid rgba(255,255,255,.12)', background:'transparent', color:'#64748b' }}>انصراف</button>
              </div>
              <div style={{ fontSize:10, color:'#fbbf24' }}>⚠️ بدونِ کدِ محاسبه‌یِ متناظر، این پارامتر فقط ذخیره میشه و روی نتیجه اثری نداره.</div>
            </div>
          ) : (
            <button onClick={()=>setAdding(true)} style={{ marginTop:4, padding:'6px 14px', borderRadius:7, fontSize:11, cursor:'pointer', border:'1px dashed rgba(99,102,241,0.4)', background:'transparent', color:'#818CF8' }}>
              {'+ پارامتر جدید'}
            </button>
          )}
        </>
      )}
    </CollapsibleSection>
  );
};

const RulesOpsTab = ({ headers, toast }) => {
  const { fa } = window.SB_DATA;
  const token = localStorage.getItem(window.TOKEN_KEY);
  const h = headers || { 'Content-Type': 'application/json', Authorization: `Bearer ${token}` };
  const api = (url, opts = {}) => fetch(url, { headers: h, ...opts }).then(r => r.json());
  return (
    <>
      <KartablPrioritySettings api={api} toast={toast}/>
      <SellerStatsSettings api={api} toast={toast}/>
      <KartablStatusWeights api={api} toast={toast}/>
      <MarketRulesTab api={api} headers={h} toast={toast} fa={fa} />
    </>
  );
};