{% extends "base.html" %}

{% block content %}
<div class="container">
    <ul class="nav nav-pills mb-3 nav-tabs" id="pills-tab" role="tablist">
        <li class="nav-item">
            <a class="nav-link active" id="block-hash-tab" data-toggle="tab" href="#block-hash" role="tab" aria-controls="block-hash" aria-selected="true">Block Hashlist</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" id="file-hash-tab" data-toggle="tab" href="#file-hash" role="tab" aria-controls="file-hash" aria-selected="false">Transaction Hashlist</a>
        </li>
    </ul>
</div>
    <div class="tab-content" id="myTabContent">
        <div class="tab-pane fade show active" id="block-hash" role="tabpanel" aria-labelledby="block-hash-tab">  
            <div class="container">
                <table class="table">
                    <thead class="thead-colour">
                        <tr>
                            <th>Block Mint Date</th>
                            <th>Blockhash</th>
                        </tr>
                    </thead>
                        {% for hash in hashchain %}
                        <tr>
                            <td>{{ hash.mint_date }}</td>
                            <td>{{ hash.blockhash }}</td>
                        </tr>
                        {% endfor %}
                </table>
            </div>
        </div>
    <div class="tab-pane fade" id="file-hash" role="tabpanel" aria-labelledby="file-hash-tab">
        <table class="table">
            <thead class="thead-colour">
                <tr>
                    <th>Filehash</th>
                    <th>Transaction Date</th>
                    <th>Transaction Price</th>
                    <th>Transaction Hash</th>
                </tr>
            </thead>
                {% for tx in txlist %}
                <tr>
                    <td>{{ tx.filehash }}</td>
                    <td>{{ tx.datetime }}</td>
                    <td>{{ tx.price }}</td>
                    <td>{{ tx.txhash }}</td>
                </tr>
                {% endfor %}
        </table>
    </div>

{% endblock %}