{% extends "base.html" %}
{% from "tasks_board/_editor.html" import task_editor with context %}
{% block title %}کارها — {{ APP_NAME }}{% endblock %}
{% block extra_css %}<link rel="stylesheet" href="{{ url_for('static', filename='css/todo.css') }}">{% endblock %}
{% block content %}

<div class="page-header">
  <a class="btn btn-ghost back-btn" href="{{ url_for('dashboard.index') }}">‹ بازگشت</a>
  <h1 class="title">کارها</h1>
  <div class="spacer"></div>
  <button type="button" class="btn btn-gold" onclick="document.getElementById('todoFolderDialog').showModal()">+ پوشه جدید</button>
</div>

<form method="get" action="{{ url_for('tasks_board.view', key='all') }}">
  <input type="search" name="q" class="search-bar" value="{{ q }}"
         placeholder="جستجو در کارها — عنوان، یادداشت یا نام مشتری ...">
</form>

<!-- ---------- فیلتر مسئول ---------- -->
<div class="todo-filters no-print">
  <a class="todo-filter{% if not assignee_value %} is-active{% endif %}" href="{{ url_for('tasks_board.index') }}">همه</a>
  <a class="todo-filter{% if assignee_value == 'me' %} is-active{% endif %}" href="{{ url_for('tasks_board.index', assignee='me') }}">مال من</a>
  {% for person in users %}
  <a class="todo-filter{% if assignee_value == person.id|string %} is-active{% endif %}"
     href="{{ url_for('tasks_board.index', assignee=person.id) }}">{{ person.full_name }}</a>
  {% endfor %}
</div>

<!-- ---------- نماهای آماده ---------- -->
<div class="stats-row todo-views">
  {% for view in views %}
  <a class="glass-card stat-card todo-view" data-color="{{ view.color }}"
     href="{{ url_for('tasks_board.view', key=view.key, assignee=assignee_value or None) }}">
    <span class="muted">{{ view.title }}</span>
    <span class="stat-value">{{ jalali.to_fa_digits(counts.get(view.key, 0)) }}</span>
    <span class="muted">{{ view.hint }}</span>
  </a>
  {% endfor %}
</div>

<!-- ---------- پوشه‌ها ---------- -->
{% macro folder_card(row) %}
{% set folder_row = row.folder %}
{% set percent = (row.done * 100 // row.total) if row.total else 0 %}
<div class="glass-card todo-folder" data-color="{{ folder_row.color }}">
  <a class="todo-folder-link" href="{{ url_for('tasks_board.folder', folder_id=folder_row.id) }}">
    <span class="todo-folder-dot"></span>
    <span class="todo-folder-name">{{ folder_row.name }}</span>
    <span class="muted">{{ jalali.to_fa_digits(row.done) }} از {{ jalali.to_fa_digits(row.total) }}</span>
  </a>
  <div class="todo-progress" aria-hidden="true"><span style="width:{{ percent }}%"></span></div>
  <div class="todo-folder-foot">
    {% if row.is_complete %}<span class="todo-chip todo-chip-done">✓ تمام شد</span>{% endif %}
    {% if row.open %}<span class="muted">{{ jalali.to_fa_digits(row.open) }} تسک باز</span>{% endif %}
    <div class="spacer"></div>
    <form method="post" action="{{ url_for('tasks_board.update_folder', folder_id=folder_row.id) }}">
      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
      <input type="hidden" name="is_archived" value="{{ '0' if folder_row.is_archived else '1' }}">
      <button type="submit" class="btn btn-ghost todo-icon-btn"
              title="{{ 'بازگرداندن از بایگانی' if folder_row.is_archived else 'بایگانی پوشه' }}">{{ '↩' if folder_row.is_archived else '🗄' }}</button>
    </form>
    {% if current_user.is_admin() %}
    <form method="post" action="{{ url_for('tasks_board.delete_folder', folder_id=folder_row.id) }}"
          data-confirm="پوشه «{{ folder_row.name }}» و همه‌ی {{ jalali.to_fa_digits(row.total) }} تسکش برای همه‌ی کاربران حذف شود؟&#10;این کار برگشت‌پذیر نیست.">
      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
      <button type="submit" class="btn btn-ghost todo-icon-btn" title="حذف پوشه">🗑</button>
    </form>
    {% endif %}
  </div>
</div>
{% endmacro %}

<div class="page-header todo-section-head">
  <span class="subtitle">پوشه‌ها</span>
  <div class="spacer"></div>
  <span class="muted">{{ jalali.to_fa_digits(active_folders|length) }} پوشه‌ی باز</span>
</div>

<div class="todo-folders">
  {% for row in active_folders %}{{ folder_card(row) }}{% else %}
  <div class="record-card-empty">هنوز پوشه‌ای نساخته‌اید. با «+ پوشه جدید» شروع کنید.</div>
  {% endfor %}
</div>

{% if done_folders %}
<div class="page-header todo-section-head">
  <span class="subtitle">پوشه‌های تمام‌شده</span>
  <div class="spacer"></div>
  <span class="muted">همه‌ی تسک‌هایشان تیک خورده است</span>
</div>
<div class="todo-folders">{% for row in done_folders %}{{ folder_card(row) }}{% endfor %}</div>
{% endif %}

{% if archived_folders %}
<details class="todo-archive">
  <summary>بایگانی ({{ jalali.to_fa_digits(archived_folders|length) }} پوشه)</summary>
  <div class="todo-folders">{% for row in archived_folders %}{{ folder_card(row) }}{% endfor %}</div>
</details>
{% endif %}

<!-- ---------- پوشه جدید ---------- -->
<dialog id="todoFolderDialog" class="todo-sheet todo-sheet-small" aria-labelledby="todoFolderDialogTitle">
  <form method="post" action="{{ url_for('tasks_board.create_folder') }}">
    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
    <div class="todo-sheet-head">
      <span class="subtitle" id="todoFolderDialogTitle">پوشه جدید</span>
      <button type="button" class="btn btn-ghost todo-icon-btn" aria-label="بستن"
              onclick="document.getElementById('todoFolderDialog').close()">✕</button>
    </div>
    <div class="todo-sheet-body">
      <div class="todo-field">
        <label class="field-label">نام پوشه</label>
        <input type="text" name="name" maxlength="120" placeholder="مثلاً: تماس هفته بعد" required>
      </div>
      <div class="todo-field">
        <label class="field-label">رنگ</label>
        <select name="color">
          {% for key, label in folder_colors %}<option value="{{ key }}">{{ label }}</option>{% endfor %}
        </select>
      </div>
    </div>
    <div class="todo-sheet-foot">
      <div class="todo-sheet-buttons">
        <button type="submit" class="btn btn-gold">✓ ساختن پوشه</button>
        <button type="button" class="btn btn-ghost" onclick="document.getElementById('todoFolderDialog').close()">انصراف</button>
      </div>
    </div>
  </form>
</dialog>

{{ task_editor(folders, users, priorities, repeat_choices, quick_dates) }}
{% endblock %}

{% block extra_js %}<script src="{{ url_for('static', filename='js/todo.js') }}"></script>{% endblock %}