shafafiyat/certificates/templates/certificates/step.html

  {% extends '_base.html' %}
  {% load static %}
  {% load processes_tags %}
  {% load humanize %}
  {% load accounts_tags %}
  
  {% 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' %}">
  <!-- Persian Date Picker CSS -->
  <link rel="stylesheet" href="https://unpkg.com/persian-datepicker@latest/dist/css/persian-datepicker.min.css">
  {% endblock %}
  
  {% block content %}
  {% include '_toasts.html' %}

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

  {% csrf_token %}
  <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">
            <button class="btn btn-outline-secondary" type="button" data-bs-toggle="modal" data-bs-target="#printHologramModal">
              <i class="bx bx-printer me-2"></i> پرینت
            </button>

            <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">
              <div class="card-body">
                <div class="d-flex mb-2">
                  <div class="ms-auto text-end">
                    <div>شماره درخواست: {{ instance.code }}</div>
                    <div>تاریخ: {{ cert.jissued_at }}</div>
                  </div>
                </div>
                <div class="text-center">
                  <h5 class="mt-2">{{ cert.rendered_title }}</h5>
                  {% if template.company %}<div class="text-muted">{{ template.company.name }}</div>{% endif %}
                </div>
                <div class="mb-3" style="white-space:pre-line; line-height:1.9;">
                  {{ cert.rendered_body|safe }}
                </div>
                <h6 class="mb-2">مشخصات چاه و کنتور هوشمند</h6>
                <div class="row g-2 small">
                  <div class="col-12 col-md-6">
                    <div class="d-flex gap-2"><span class="text-muted">موقعیت مکانی (UTM):</span><span class="fw-medium">{{ latest_report.utm_x|default:'-' }} , {{ latest_report.utm_y|default:'-' }}</span></div>
                    <div class="d-flex gap-2"><span class="text-muted">نیرو محرکه چاه:</span><span class="fw-medium">{{ latest_report.driving_force|default:'-' }}</span></div>
                    <div class="d-flex gap-2"><span class="text-muted">نوع کنتور:</span><span class="fw-medium">{{ latest_report.get_meter_type_display|default:'-' }}</span></div>
                    <div class="d-flex gap-2"><span class="text-muted">قطر لوله آبده (اینچ):</span><span class="fw-medium">{{ latest_report.discharge_pipe_diameter|default:'-' }}</span></div>
                    <div class="d-flex gap-2"><span class="text-muted">نوع مصرف:</span><span class="fw-medium">{{ latest_report.get_usage_type_display|default:'-' }}</span></div>
                    <div class="d-flex gap-2"><span class="text-muted">شماره سیم‌کارت:</span><span class="fw-medium">{{ latest_report.sim_number|default:'-' }}</span></div>
                  </div>
                  <div class="col-12 col-md-6">
                    <div class="d-flex gap-2"><span class="text-muted">سایز کنتور:</span><span class="fw-medium">{{ latest_report.meter_size|default:'-' }}</span></div>
                    <div class="d-flex gap-2"><span class="text-muted">شماره پروانه بهره‌برداری چاه:</span><span class="fw-medium">{{ latest_report.exploitation_license_number|default:'-' }}</span></div>
                    <div class="d-flex gap-2"><span class="text-muted">قدرت موتور:</span><span class="fw-medium">{{ latest_report.motor_power|default:'-' }}</span></div>
                    <div class="d-flex gap-2"><span class="text-muted">دبی قبل از کالیبراسیون:</span><span class="fw-medium">{{ latest_report.pre_calibration_flow_rate|default:'-' }}</span></div>
                    <div class="d-flex gap-2"><span class="text-muted">دبی بعد از کالیبراسیون:</span><span class="fw-medium">{{ latest_report.post_calibration_flow_rate|default:'-' }}</span></div>
                    <div class="d-flex gap-2"><span class="text-muted">نام شرکت کنتورساز:</span><span class="fw-medium">{{ latest_report.water_meter_manufacturer.name|default:'-' }}</span></div>
                    <div class="d-flex gap-2"><span class="text-muted">شماره سریال کنتور:</span><span class="fw-medium">{{ instance.well.water_meter_serial_number|default:'-' }}</span></div>
                  </div>
                </div>
                <div class="signature-section d-flex justify-content-end">
                  <div class="text-center">
                    <div>مهر و امضای تایید کننده</div>
                    <div class="text-muted">{{ template.company.name }}</div>
                    {% if template.company and template.company.signature %}
                      <img src="{{ template.company.signature.url }}" alt="seal" style="max-height:200px">
                    {% endif %}
                  </div>
                </div>
              </div>
              <div class="card-footer d-flex justify-content-between">
                {% 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 ms-sm-n2"></i>
                    قبلی
                  </a>
                {% else %}<span></span>{% endif %}
                <form method="post">
                  {% csrf_token %}
                  {% if request.user|is_broker %}
                    <button class="btn btn-primary" type="submit">تایید و پایان</button>
                  {% else %}
                    <button class="btn btn-primary" type="button" disabled>تایید و پایان</button>
                  {% endif %}
                </form>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!-- Print Hologram Modal -->
  <div class="modal fade" id="printHologramModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <form method="post" action="{% url 'certificates:certificate_print' instance.id %}" target="_blank">
          {% csrf_token %}
          <div class="modal-header">
            <h5 class="modal-title">کد یکتا هولوگرام</h5>
            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
          </div>
          <div class="modal-body">
            <label class="form-label">کد هولوگرام</label>
            <input type="text" class="form-control" name="hologram_code" value="{{ cert.hologram_code|default:'' }}" placeholder="مثال: 123456" required>
            <div class="form-text">این کد باید با کد هولوگرام روی گواهی یکسان باشد.</div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-label-secondary" data-bs-dismiss="modal">انصراف</button>
            <button type="submit" class="btn btn-primary">ثبت و پرینت</button>
          </div>
        </form>
      </div>
    </div>
  </div>
{% endblock %}