{% extends "sample_base.html" %}
{% load static %}
{% load crispy_forms_tags %}

{% block title %}
<title>Sample Index</title>
{% endblock title %}
{% block Style %}
<style>
  .search {
    width: 94%!important;
  }
  .data-search {
    justify-content: flex-start;
  }

</style>

{% endblock Style %}

{% block MainContent %}

<div class="contents">

    {% if messages %}
        {% for message in messages %}
            <div id="divID" class="alert alert-dismissible fade show {% if message.tags %}alert-{% if message.level == DEFAULT_MESSAGE_LEVELS.ERROR %}danger{% else %}{{ message.tags }}{% endif %}{% endif %}"
                role="alert">{{ message }}
                <button aria-label="Close" class="btn-close" data-bs-dismiss="alert" type="button"></button>
            </div>
        {% endfor %}
    {% endif %}

    <div class="table-area">
        <div class="table-title">
            <div class="row">
                <div class="col-md-4">
                    <div class="style-name">
                        <h4>Sample Index</h4>
                    </div>
                </div>
            </div>
        </div>

        <div class="tables table-responsive" id="styleList">
            <table class="table  table-striped table-hover align-middle">
                <thead>
                    <tr>
                        <th class="text-center" scope="col">SL</th>
                        <th class="text-center" scope="col">Style</th>
                        <th class="text-center" scope="col">Required Submission Date</th>
                        <th class="text-center" scope="col">Sample Type</th>
                        <th class="text-center" scope="col">Sample Status Sample End</th>
                        <th class="text-center" scope="col">Sample Section Department</th>
                        <th class="text-center" scope="col">Action</th>
                    </tr>
                </thead>
                <tbody>
                {% if sample %}
                    {% for item in sample %}
                    <tr>
                        <td class="align-middle">{{forloop.counter}}</td>
                        <td class="align-middle">{{ item.style }}</td>
                        <td class="align-middle">{{ item.req_submission_date }}</td>
                        <td class="align-middle">{{ item.sample_type }}</td>
                        <td class="align-middle">{{ item.sample_status_sample_end }}</td>
                        <td class="align-middle">{{ item.sample_assigned_to }}</td>
                        <td class="align-middle">
                            <ul class="action">
                                <li>
                                    <a href="{% url 'sample_app_sample_details' item.id %}">
                                        <i aria-hidden="true" class="fa fa-eye"></i>
                                    </a>
                                </li>
                            </ul>
                        </td>
                    </tr>
                    {% endfor %}
                {% else %}
                    <tr><td colspan="7" class="text-center">No Data Is Found</td></tr>
                {% endif %}
                </tbody>
            </table>
        </div>
    </div>
</div>
{% endblock MainContent %}

{% block meassage %}

{% include 'notifications/notifications.html' %}

{% endblock meassage %}

{% block JS %}
    <script src="{% static 'js/merchant_app/sample/script.js' %}"></script>  
{% endblock JS %}