{% extends 'dbase.html' %}
{% load static thumbnail %}

{% block extra_css %}
    <style>
        .archidex-mt10 { margin-top: 10px; }
    </style>
{% endblock extra_css %}

{% block page_header %}
    {% comment %}
    <h2 class="ui dividing header">
        {{ title }}


        <div class="ui right floated primary button">
            Primary
            <i class="right chevron icon"></i>
        </div>

    </h2>
    {% endcomment %}
    <h1 class="ui dividing header">
        {{ title }}
        <a class="ui right floated red button" href="{% url 'debit:debit_participant_list' %}">
            Back
        </a>
        {% comment %}
        {% if object.is_checked_in %}
            <a class="ui right floated yellow button" href="{% url 'visitors:print_pass_preview' object.pk %}">
                Print Pass
            </a>
        {% else %}
            <a class="ui right floated teal button" href="{% url 'visitors:check_in' object.pk %}">
                Check In
            </a>
        {% endif %}
        {% endcomment %}
    </h1>
{% endblock page_header %}

{% block content %}
    <div class="ui container ">
        <table class="ui fixed table">
            <thead>
                <tr>
                    <th colspan="2">Debit Participant Profile</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>
                        Name
                    </td>
                    <td>
                        {{ object.participant_name }}
                    </td>
                </tr>
                            
                <tr>
                    <td>
                        NRIC
                    </td>
                    <td>
                        {{ object.participant_id_no  }}
                    </td>
                </tr>
            </tbody>
        </table>
    </div>

    <div class="ui container archidex-mt10">
        <table class="ui fixed table">           
            <tbody>
               
                <tr>
                    <td>
                        Address 1
                    </td>
                    <td>
                        {{ object.address_1 }}
                    </td>
                </tr>
                <tr>
                    <td>
                        Address 2
                    </td>
                    <td>
                        {{ object.address_2 }}
                    </td>
                </tr>
                <tr>
                    <td>
                        Town
                    </td>
                    <td>
                        {{ object.town }}
                    </td>
                </tr>
                <tr>
                    <td>
                        Postcode
                    </td>
                    <td>
                        {{ object.poscode }}
                    </td>
                </tr>
                <tr>
                    <td>
                        State
                    </td>
                    <td>
                        {{ object.state }}
                    </td>
                </tr>
                <tr>
                    <td>
                        Mobile no.
                    </td>
                    <td>
                        {{ object.mobile_no }}
                    </td>
                </tr>
                <tr>
                    <td>
                        Alternate Mobile no.
                    </td>
                    <td>
                        {{ object.alt_mobile_no }}
                    </td>
                </tr>
                <tr>
                    <td>
                        Email
                    </td>
                    <td>
                        {{ object.email|default:"-" }}
                    </td>
                </tr>
                <tr>
                    <td>
                        Receipt Image
                    </td>
                    <td>
                        <a href="{{ object.image_receipt.url }}"><img src="{{ object.image_receipt.url }}" style="max-width: 100%; max-height: 100%;" alt="" /></a>
                    </td>
                </tr>
                <tr>
                    <td>
                        Debit Reciept Image
                    </td>
                    <td>
                        <a href="{{ object.image_baby.url }}"><img src="{{ object.image_baby.url }}" style="max-width: 100%; max-height: 100%;" alt="" /></a>
                    </td>
                </tr>
                <tr>
                    <td>
                        Purchase Outlet
                    </td>
                    <td>
                        {{ object.purchase_outlet }}
                    </td>
                </tr>
            </tbody>
        </table>
    </div>


{% endblock %}

{% block extra_js %}
{% endblock extra_js %}