{% extends "base.html" %}

{% block main_content %}
<div class="container">
	<h3>{{page_title}}</h3>
	<div class="row col-lg-12">
		<label class="form-control-plaintext col-lg-2">Start Time:</label>
		<label class="form-control-plaintext col-lg-10">{{imp.start_time|vicdate}}</label>
	</div>
	<div class="row col-lg-12">
		<label class="form-control-plaintext col-lg-2">Duration:</label>
		<label class="form-control-plaintext col-lg-10">{{duration}}</label>
	</div>
	<div class="row col-lg-12">
		<label class="form-control-plaintext col-lg-2">Last Update:</label>
		<label class="form-control-plaintext col-lg-10">{{imp.last_update|vicdate}}</label>
	</div>
	<div class="row col-lg-12">
		<label class="form-control-plaintext col-lg-2">Current state:</label>
		<label class="form-control-plaintext col-lg-10">{{imp.state}}</label>
	</div>
	<div class="row col-lg-12">
		<label class="form-control-plaintext col-lg-2">Current File:</label>
		<label class="form-control-plaintext col-lg-10">{{imp.current_file}}</label>
	</div>
	<div class="row col-lg-12">
		{% set prog=(imp.current_pass/imp.num_passes*100)|round|int %}
		<label class="form-control-plaintext col-lg-2">Passes:</label>
		<div class="col-lg-10 px-0">
			<div class="progress" style="height:80%">
				<div class="progress-bar" role="progressbar" style="width: {{prog}}%;" aria-valuenow="{{prog}}" aria-valuemin="0" aria-valuemax="100">{{imp.current_pass}} of {{imp.num_passes}} - {{prog}}%</div>
			</div>
		</div>
	</div>
	<div class="row col-lg-12">
		{% set prog=(imp.current_file_num/imp.num_files*100)|round|int %}
		<label class="form-control-plaintext col-lg-2">Files in pass:</label>
		<div class="col-lg-10 px-0">
			<div class="progress" style="height:80%">
				<div class="progress-bar bg-info" role="progressbar" style="width: {{prog}}%;" aria-valuenow="{{prog}}" aria-valuemin="0" aria-valuemax="100">{{imp.current_file_num}} of {{imp.num_files}} - {{prog}}%</div>
			</div>
		</div>
	</div>
    <div class="row col-lg-12">
        <table id="import_tbl" class="table table-striped table-sm" data-toolbar="#toolbar" data-search="true">
            <thead><tr class="thead-light"><th>When</th><th>Details</th></tr></thead>
            <tbody>
            {% for log in logs %}
                <tr><td>{{log.log_date|vicdate}}</td><td>{{log.log}}</td></tr>
            {% endfor %}
            </tbody>
        </table>
    </div>
</div class="containter">
{% endblock main_content %}