neiam /dms

{% extends "root.html" %}

{% block inner %}
<div class="container mx-auto px-4 py-8">
    <div class="max-w-2xl mx-auto">
        <div class="card bg-base-100 shadow-xl">
            <div class="card-body">
                <h2 class="card-title text-3xl mb-6">
                    <i class="fas fa-user-circle mr-3"></i>
                    User Profile
                </h2>
                
                <div class="space-y-4">
                    <div class="flex flex-col">
                        <label class="label">
                            <span class="text-sm font-semibold">Username</span>
                        </label>
                        <input 
                            type="text" 
                            value="{{ user.username }}" 
                            class="input" 
                            readonly 
                        />
                    </div>
                    
                    <div class="flex flex-col">
                        <label class="label">
                            <span class="text-sm font-semibold">Email</span>
                        </label>
                        <input 
                            type="email" 
                            value="{{ user.email }}" 
                            class="input" 
                            readonly 
                        />
                    </div>
                    
                    <div class="flex flex-col">
                        <label class="label">
                            <span class="text-sm font-semibold">Account Status</span>
                        </label>
                        <div class="flex items-center">
                            {% if user.is_active %}
                                <div class="badge badge-success gap-2">
                                    <i class="fas fa-check-circle"></i>
                                    Active
                                </div>
                            {% else %}
                                <div class="badge badge-error gap-2">
                                    <i class="fas fa-times-circle"></i>
                                    Inactive
                                </div>
                            {% endif %}
                        </div>
                    </div>
                    
                    <div class="flex flex-col">
                        <label class="label">
                            <span class="text-sm font-semibold">Member Since</span>
                        </label>
                        <input 
                            type="text" 
                            value="{{ user.created_at | dateformat }}" 
                            class="input" 
                            readonly 
                        />
                    </div>
                    
                    {% if user.last_login_at %}
                    <div class="flex flex-col">
                        <label class="label">
                            <span class="text-sm font-semibold">Last Login</span>
                        </label>
                        <input 
                            type="text" 
                            value="{{ user.last_login_at | dateformat }}" 
                            class="input" 
                            readonly 
                        />
                    </div>
                    {% endif %}
                </div>
                
                <div class="card-actions justify-end mt-8">
                    <div class="join">
                        <a href="/profile/edit" class="btn btn-primary join-item">
                            <i class="fas fa-edit mr-2"></i>
                            Edit Profile
                        </a>
                        <a href="/profile/change-password" class="btn btn-secondary join-item">
                            <i class="fas fa-key mr-2"></i>
                            Change Password
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}