{% extends '_base.html' %}
{% load static %}
{% load processes_tags %}
{% load humanize %}

{% block sidebar %}
    {% include 'sidebars/admin.html' %}
{% endblock sidebar %}

{% block navbar %}
    {% include 'navbars/admin.html' %}
{% endblock navbar %}

{% block title %}{{ step.name }} - درخواست {{ instance.code }}{% endblock %}

{% block style %}
<link rel="stylesheet" href="{% static 'assets/vendor/libs/bs-stepper/bs-stepper.css' %}">
{% endblock %}

{% block content %}
{% include '_toasts.html' %}

<!-- Instance Info Modal -->
{% instance_info_modal instance %}

<div class="container-xxl flex-grow-1 container-p-y">
  <div class="row">
    <div class="col-12 mb-4">
      <div class="d-flex align-items-center justify-content-between mb-3">
        <div>
          <h4 class="mb-1">{{ step.name }}: {{ instance.process.name }}</h4>
          <small class="text-muted d-block">
            {% instance_info instance %}
          </small>
        </div>
        <div class="d-flex gap-2">
          <a href="{% url 'contracts:contract_print' instance.id %}" target="_blank" class="btn btn-outline-secondary">
            <i class="bx bx-printer me-2"></i> پرینت
          </a>
          <a href="{% url 'processes:request_list' %}" class="btn btn-outline-secondary">
            <i class="bx bx-chevron-right bx-sm ms-sm-n2"></i>
            بازگشت
          </a>
          
        </div>
      </div>

      <div class="bs-stepper wizard-vertical vertical mt-2">
        {% stepper_header instance step %}
        <div class="bs-stepper-content">
          <div class="card border">
            <div class="card-body">
              <div class="small text-end text-muted mb-2">تاریخ: {{ contract.jcreated_date }} | کد درخواست: {{ instance.code }}</div>
              <h5 class="text-center mb-3">
                {% if instance.broker and instance.broker.company %}
                {{ instance.broker.company.name }}
              {% elif template.company %}
                {{ template.company.name }}
              {% else %}
                شرکت آب منطقه‌ای
              {% endif %}</h5>
              <h4 class="text-center mb-3">{{ contract.template.name }}</h4>
              {% if can_view_contract_body %}
                <hr>
                <div class="contract-body" style="white-space: pre-line; line-height:1.9;">{{ contract.rendered_body|safe }}</div>
                <hr>
                <div class="row mt-4">
                  <div class="col-6 text-center">
                    <div>امضای مشترک</div>
                    <div style="height:210px;border:1px dashed #ccc; margin-top:10px;"></div>
                  </div>
                  <div class="col-6 text-center">
                    <div>امضای شرکت</div>
                    <div style="height:210px;border:1px dashed #ccc; margin-top:10px;">
                      {% if instance.broker and instance.broker.company and instance.broker.company.signature %}
                        <img src="{{ instance.broker.company.signature.url }}" alt="امضای شرکت" style="max-height:200px;">
                      {% elif template.company and template.company.signature %}
                        <img src="{{ template.company.signature.url }}" alt="امضای شرکت" style="max-height:200px;">
                      {% endif %}
                    </div>
                  </div>
                </div>
              {% else %}
                <div class="alert alert-warning mb-0">شما دسترسی به مشاهده متن قرارداد را ندارید.</div>
              {% endif %}
            </div>
          </div>
          <form method="post" class="d-flex justify-content-between mt-3">
            {% csrf_token %}
            {% if previous_step %}
              <a href="{% url 'processes:step_detail' instance.id previous_step.id %}" class="btn btn-label-secondary">
                <i class="bx bx-chevron-right bx-sm me-sm-2"></i>
                قبلی
              </a>
            {% else %}
              <span></span>
            {% endif %}
            {% if next_step %}
              {% if is_broker and step_instance.status != 'completed' %}
                <button type="submit" class="btn btn-primary">تایید
                </button>
              {% else %}
              <a href="{% url 'processes:step_detail' instance.id next_step.id %}" class="btn btn-primary">
                بعدی
                <i class="bx bx-chevron-left bx-sm me-sm-n2"></i>
              </a>
              {% endif %}
            {% else %}
              {% if is_broker %}
                <button class="btn btn-success" type="submit">اتمام</button>
              {% else %}
                <button class="btn btn-success" type="button" disabled>اتمام</button>
              {% endif %}
            {% endif %}
          </form>
        </div>
      </div>
    </div>
  </div>
</div>
{% endblock %}


