{% extends 'base.html' %}

{% load static %}

{% load crispy_forms_tags %}

{% block title %} Profile | IQChem {% endblock %}

{% block content %}
    <h3>USER PROFILE</h3>
    <p>Chemical Section Platform</p>
    
    <hr style="background-color: rgb(48, 25, 52); color: rgb(48, 25, 52);">
    <div class="col-md-12 col-lg-6">
        <h3>Hello {{u.fname}}&nbsp;{{u.lname}}</h3>
        <p class="mb-2">USERNAME : {{u.username}}</p>
        <p class="mb-2">EMAIL : {{u.email}}</p>
        <p class="mb-2">ROLE : {{u.role}}</p>
        <p class="mb-2">DATE REGISTERED : {{u.datetime_registered}}</p>
        <p class="mb-2">VERIFIED : {{u.is_verified}}</p>
        <p class="mb-5">LAST LOGIN DATE : {{u.last_login_date}}</p>
        <a href="/change_password/{{u.id}}" class="btn btn-outline-primary" onclick="if (confirm(`Are you sure you want to change your password?`)){return true;}else{event.stopPropagation();event.preventDefault();}">CHANGE PASSWORD</a>
        {% if u.role == 'SUPERADMIN' %}
        <a href="/admin" class="btn btn-primary" onclick="if (confirm(`Are you sure you want to open the admin panel?`)){return true;}else{event.stopPropagation();event.preventDefault();}">ADMIN</a>
        {% endif %}

        {% if u.role == 'SUPERADMIN' or u.role == 'ADMIN' %}
            <a href="/administrator" class="btn btn-dark" onclick="if (confirm(`Are you sure you want to open the user-admin panel?`)){return true;}else{event.stopPropagation();event.preventDefault();}">USER-ADMIN</a>
        {% endif %}
    </div>

    <script>
        $(document).ready(function(){});
    </script>
    
{% endblock %}