{% extends "base.html" %}
{% block title %}تنظیمات{% endblock %}
{% block page_title %}<i class="bi bi-sliders"></i> تنظیمات سیستم{% endblock %}

{% block content %}

<div class="alert alert-info mb-4">
  <i class="bi bi-info-circle-fill me-2"></i>
  تغییرات تنظیمات تلگرام و بله پس از <strong>راه‌اندازی مجدد سرویس</strong> اعمال می‌شوند.
  تنظیمات هوش مصنوعی بلافاصله اعمال می‌شوند.
</div>

<ul class="nav nav-tabs mb-4" id="settingsTabs">
  <li class="nav-item">
    <a class="nav-link active" data-bs-toggle="tab" href="#telegram">
      <i class="bi bi-telegram me-1" style="color:#0088cc"></i>تلگرام
    </a>
  </li>
  <li class="nav-item">
    <a class="nav-link" data-bs-toggle="tab" href="#bale">
      <i class="bi bi-chat-dots me-1" style="color:#e91e63"></i>بله
    </a>
  </li>
  <li class="nav-item">
    <a class="nav-link" data-bs-toggle="tab" href="#ai">
      <i class="bi bi-cpu me-1" style="color:#7c3aed"></i>هوش مصنوعی
    </a>
  </li>
  <li class="nav-item">
    <a class="nav-link" data-bs-toggle="tab" href="#system">
      <i class="bi bi-gear me-1"></i>سیستم
    </a>
  </li>
</ul>

<div class="tab-content">

  {# ── Telegram ──────────────────────────────────────────────── #}
  <div class="tab-pane fade show active" id="telegram">
    <div class="card">
      <div class="card-header d-flex align-items-center gap-2">
        <i class="bi bi-telegram fs-5" style="color:#0088cc"></i>
        <h6 class="mb-0">تنظیمات تلگرام</h6>
        <span class="badge ms-auto" style="background:rgba(224,104,79,.16);color:#f0a595;font-size:.7rem">نیاز به راه‌اندازی مجدد</span>
      </div>
      <div class="card-body">
        <form method="POST" action="{{ url_for('settings.save') }}">
          <input type="hidden" name="category" value="telegram">
          {% set tg = data.telegram %}

          <div class="row g-3 mb-3">
            <div class="col-md-6">
              <label class="form-label" for="tg_api_id">API ID</label>
              <input type="text" class="form-control font-mono" name="telegram.api_id"
                     id="tg_api_id" value="{{ tg.get('telegram.api_id','') }}">
              <div class="form-text">از <a href="https://my.telegram.org" target="_blank">my.telegram.org</a> دریافت کنید</div>
            </div>
            <div class="col-md-6">
              <label class="form-label" for="tg_api_hash">API Hash</label>
              <div class="input-group">
                <input type="password" class="form-control font-mono" name="telegram.api_hash"
                       id="tg_api_hash" value="{{ tg.get('telegram.api_hash','') }}">
                <button type="button" class="btn btn-outline-secondary" onclick="toggleVis('tg_api_hash')"><i class="bi bi-eye"></i></button>
              </div>
            </div>
          </div>

          <div class="mb-3">
            <label class="form-label" for="tg_session">Session String</label>
            <div class="input-group">
              <input type="password" class="form-control font-mono" name="telegram.session_string"
                     id="tg_session" value="{{ tg.get('telegram.session_string','') }}"
                     style="font-size:.75rem">
              <button type="button" class="btn btn-outline-secondary" onclick="toggleVis('tg_session')"><i class="bi bi-eye"></i></button>
            </div>
            <div class="form-text">Session string احراز هویت Telethon.</div>
          </div>

          <div class="mb-3">
            <label class="form-label" for="tg_bot_token">Bot Token (اختیاری)</label>
            <input type="text" class="form-control font-mono" name="telegram.bot_token"
                   id="tg_bot_token" value="{{ tg.get('telegram.bot_token','') }}"
                   placeholder="در صورت استفاده از ربات">
          </div>

          <button type="submit" class="btn btn-primary">
            <i class="bi bi-floppy me-1"></i>ذخیره تنظیمات تلگرام
          </button>
        </form>
      </div>
    </div>
  </div>

  {# ── Bale ──────────────────────────────────────────────────── #}
  <div class="tab-pane fade" id="bale">
    <div class="card">
      <div class="card-header d-flex align-items-center gap-2">
        <i class="bi bi-chat-dots fs-5" style="color:#e91e63"></i>
        <h6 class="mb-0">تنظیمات بله (Bale)</h6>
        <span class="badge ms-auto" style="background:rgba(224,104,79,.16);color:#f0a595;font-size:.7rem">نیاز به راه‌اندازی مجدد</span>
      </div>
      <div class="card-body">
        <form method="POST" action="{{ url_for('settings.save') }}">
          <input type="hidden" name="category" value="bale">
          {% set bl = data.bale %}

          <div class="mb-3">
            <label class="form-label" for="bale_token">Bot Token بله</label>
            <div class="input-group">
              <input type="password" class="form-control font-mono" name="bale.bot_token"
                     id="bale_token" value="{{ bl.get('bale.bot_token','') }}">
              <button type="button" class="btn btn-outline-secondary" onclick="toggleVis('bale_token')"><i class="bi bi-eye"></i></button>
            </div>
            <div class="form-text">توکن ربات دریافت‌شده از BotFather بله</div>
          </div>

          <div class="row g-3 mb-4">
            <div class="col-md-6">
              <label class="form-label" for="bale_chat_id">Chat ID مقصد</label>
              <input type="text" class="form-control font-mono" name="bale.chat_id"
                     id="bale_chat_id" value="{{ bl.get('bale.chat_id','') }}">
              <div class="form-text">شناسه کانال یا گروه مقصد در بله</div>
            </div>
            <div class="col-md-6">
              <label class="form-label" for="bale_base_url">Base URL</label>
              <input type="text" class="form-control font-mono" name="bale.base_url"
                     id="bale_base_url" value="{{ bl.get('bale.base_url','https://tapi.bale.ai') }}">
            </div>
          </div>

          <button type="submit" class="btn btn-primary">
            <i class="bi bi-floppy me-1"></i>ذخیره تنظیمات بله
          </button>
        </form>
      </div>
    </div>
  </div>

  {# ── AI ────────────────────────────────────────────────────── #}
  <div class="tab-pane fade" id="ai">

    <div class="alert alert-info mb-4" style="font-size:.85rem">
      <i class="bi bi-info-circle-fill me-2"></i>
      روشن/خاموش بودن پردازش AI حالا به‌ازای هر قانون فوروارد تنظیم می‌شود — به
      <a href="{{ url_for('forward_rules.index') }}">فوروارد خودکار</a> مراجعه کنید.
      این‌جا فقط اتصال کلی به سرویس AI تنظیم می‌شود.
    </div>

    {# AI Connection Settings #}
    <div class="card">
      <div class="card-header d-flex align-items-center gap-2">
        <i class="bi bi-cpu fs-5" style="color:#7c3aed"></i>
        <h6 class="mb-0">تنظیمات اتصال هوش مصنوعی</h6>
        <span class="badge ms-auto" style="background:#f5f3ff;color:#7c3aed;font-size:.7rem">بلافاصله اعمال می‌شود</span>
      </div>
      <div class="card-body">
        <form method="POST" action="{{ url_for('settings.save') }}">
          <input type="hidden" name="category" value="ai">
          {% set ai = data.ai %}

          <div class="mb-3">
            <label class="form-label" for="ai_key">API Key</label>
            <div class="input-group">
              <input type="password" class="form-control font-mono" name="ai.api_key"
                     id="ai_key" value="{{ ai.get('ai.api_key','') }}">
              <button type="button" class="btn btn-outline-secondary" onclick="toggleVis('ai_key')"><i class="bi bi-eye"></i></button>
            </div>
          </div>

          <div class="mb-3">
            <label class="form-label" name="ai_base_url">Base URL</label>
            <input type="text" class="form-control font-mono" name="ai.base_url"
                   id="ai_base_url" value="{{ ai.get('ai.base_url','') }}"
                   placeholder="https://api.openai.com/v1">
            <div class="form-text">برای API‌های سازگار با OpenAI (مثل Edrac، Together، Groq)</div>
          </div>

          <div class="row g-3 mb-4">
            <div class="col-md-6">
              <label class="form-label" for="ai_model">نام مدل</label>
              <input type="text" class="form-control font-mono" name="ai.model"
                     id="ai_model" value="{{ ai.get('ai.model','') }}"
                     placeholder="gpt-4o / qwen3-32b / ...">
            </div>
            <div class="col-md-3">
              <label class="form-label" for="ai_temp">Temperature</label>
              <input type="number" class="form-control font-mono" name="ai.temperature"
                     id="ai_temp" value="{{ ai.get('ai.temperature','0.7') }}"
                     min="0" max="2" step="0.1">
              <div class="form-text">۰ تا ۲ (پیشنهاد: ۰.۷)</div>
            </div>
            <div class="col-md-3">
              <label class="form-label" for="ai_timeout">Timeout (ثانیه)</label>
              <input type="number" class="form-control font-mono" name="ai.timeout"
                     id="ai_timeout" value="{{ ai.get('ai.timeout','60') }}"
                     min="5" max="300">
            </div>
          </div>

          <button type="submit" class="btn btn-primary">
            <i class="bi bi-floppy me-1"></i>ذخیره تنظیمات هوش مصنوعی
          </button>
        </form>
      </div>
    </div>
  </div>

  {# ── System ────────────────────────────────────────────────── #}
  <div class="tab-pane fade" id="system">
    <div class="card">
      <div class="card-header d-flex align-items-center gap-2">
        <i class="bi bi-gear-fill fs-5 text-muted"></i>
        <h6 class="mb-0">تنظیمات سیستم</h6>
      </div>
      <div class="card-body">
        <form method="POST" action="{{ url_for('settings.save') }}">
          <input type="hidden" name="category" value="system">
          {% set sys = data.system %}

          <div class="row g-3 mb-4">
            <div class="col-md-6">
              <label class="form-label" for="media_dir">پوشه ذخیره رسانه</label>
              <input type="text" class="form-control font-mono" name="system.media_dir"
                     id="media_dir" value="{{ sys.get('system.media_dir','downloaded_media') }}">
              <div class="form-text">مسیر نسبی یا مطلق برای ذخیره فایل‌های دانلودشده</div>
            </div>
            <div class="col-md-3">
              <label class="form-label" for="poll_interval">فاصله نظرسنجی (ثانیه)</label>
              <input type="number" class="form-control font-mono" name="system.poll_interval"
                     id="poll_interval" value="{{ sys.get('system.poll_interval','15') }}"
                     min="5" max="300">
            </div>
            <div class="col-md-3">
              <label class="form-label" for="admin_port">پورت پنل مدیریت</label>
              <input type="number" class="form-control font-mono" name="system.admin_port"
                     id="admin_port" value="{{ sys.get('system.admin_port','5000') }}"
                     min="1024" max="65535">
              <div class="form-text">نیاز به راه‌اندازی مجدد دارد</div>
            </div>
          </div>

          <button type="submit" class="btn btn-primary">
            <i class="bi bi-floppy me-1"></i>ذخیره تنظیمات سیستم
          </button>
        </form>
      </div>
    </div>
  </div>

</div><!-- /tab-content -->
{% endblock %}

{% block scripts %}
<script>
function toggleVis(id) {
  var f = document.getElementById(id);
  f.type = f.type === 'password' ? 'text' : 'password';
}

// Activate tab from URL hash on load
const hash = location.hash.replace('#','');
if (hash) {
  const tab = document.querySelector('#settingsTabs [href="#' + hash + '"]');
  if (tab) bootstrap.Tab.getOrCreateInstance(tab).show();
}
</script>
{% endblock %}