333 lines
24 KiB
HTML
333 lines
24 KiB
HTML
{% extends 'base.html' %}
|
|
{% load i18n static custom_filters crispy_forms_filters %}
|
|
{% block title %}
|
|
{% trans 'Profile' %}
|
|
{% endblock %}
|
|
{% block content %}
|
|
<div class="container-fluid mb-3">
|
|
<div class="row align-items-center justify-content-between g-3 mb-4">
|
|
<div class="col-auto">
|
|
<h2 class="mb-0">{% trans 'Profile' %}</h2>
|
|
</div>
|
|
<div class="col-auto">
|
|
<div class="dropdown">
|
|
<button class="btn btn-phoenix-primary dropdown-toggle"
|
|
type="button"
|
|
data-bs-toggle="dropdown"
|
|
aria-expanded="false">
|
|
<span class="fas fa-cog me-2"></span>{{ _("Manage Profile") }}
|
|
</button>
|
|
<ul class="dropdown-menu dropdown-menu-end">
|
|
<li>
|
|
<a class="dropdown-item" href="{% url 'dealer_update' dealer.slug %}"><span class="fas fa-edit me-2"></span>{{ _("Edit Profile") }}</a>
|
|
</li>
|
|
<li>
|
|
<a class="dropdown-item" href="{% url 'billing_info' %}"><span class="fas fa-credit-card me-2"></span>{{ _("Billing Information") }}</a>
|
|
</li>
|
|
<li>
|
|
<a class="dropdown-item" href="{% url 'order_list' %}"><span class="fas fa-clipboard-list me-2"></span>{{ _("Plans History") }}</a>
|
|
</li>
|
|
<li>
|
|
<hr class="dropdown-divider">
|
|
</li>
|
|
<li>
|
|
<a class="dropdown-item text-danger"
|
|
href="{% url 'account_change_password' %}"><span class="fas fa-key me-2"></span>{{ _("Change Password") }}</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3 mb-4">
|
|
<div class="col-12">
|
|
<div class="card shadow-sm h-100">
|
|
<div class="card-body">
|
|
<div class="d-flex flex-column flex-sm-row align-items-sm-center g-3 g-sm-5 text-center text-sm-start">
|
|
<div class="col-12 col-sm-auto mb-3 mb-sm-0">
|
|
<input class="d-none" id="avatarFile" type="file" />
|
|
<label class="cursor-pointer avatar avatar-5xl border rounded-circle shadow-sm"
|
|
for="avatarFile">
|
|
{% if dealer.logo %}
|
|
<img src="{{ dealer.logo.url }}"
|
|
alt="{{ dealer.get_local_name }}"
|
|
class="rounded-circle"
|
|
style="max-width: 150px" />
|
|
{% else %}
|
|
<img src="{% static 'images/logos/logo.png' %}"
|
|
alt="{{ dealer.get_local_name }}"
|
|
class="rounded-circle"
|
|
style="max-width: 150px" />
|
|
{% endif %}
|
|
</label>
|
|
</div>
|
|
<div class="flex-1 col-12 col-sm ms-2">
|
|
<h3>{{ dealer.get_local_name }}</h3>
|
|
<p class="text-body-secondary mb-1">{% trans 'Joined' %} {{ dealer.joined_at|timesince }} {% trans 'ago' %}</p>
|
|
<span class="badge bg-primary-subtle text-primary">{% trans 'Last login' %}: {{ dealer.user.last_login|date:"D M d, Y H:i" }}</span>
|
|
</div>
|
|
<div class="col-12 col-sm-auto d-flex align-items-center justify-content-around flex-wrap mt-3 mt-sm-0">
|
|
<div class="text-center mx-3 mb-2 mb-sm-0">
|
|
<h6 class="mb-2 text-body-secondary">{% trans 'Total users'|capfirst %}</h6>
|
|
<h4 class="fs-7 text-body-highlight mb-2">{{ dealer.staff_count }}</h4>
|
|
<div class="progress" style="height: 5px; width: 100px;">
|
|
<div class="progress-bar bg-success"
|
|
role="progressbar"
|
|
style="width: {{ dealer.staff_count|get_percentage:allowed_users }}%"
|
|
aria-valuenow="{{ dealer.staff_count|get_percentage:allowed_users }}"
|
|
aria-valuemin="0"
|
|
aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
<div class="text-center mx-3 mb-2 mb-sm-0">
|
|
<h6 class="mb-2 text-body-secondary">{% trans 'Total cars'|capfirst %}</h6>
|
|
<h4 class="fs-7 text-body-highlight mb-2">{{ cars_count }}</h4>
|
|
<div class="progress" style="height: 5px; width: 100px;">
|
|
<div class="progress-bar bg-info"
|
|
role="progressbar"
|
|
style="width: {{ cars_count|get_percentage:allowed_cars }}%"
|
|
aria-valuenow="{{ cars_count|get_percentage:allowed_cars }}"
|
|
aria-valuemin="0"
|
|
aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-12">
|
|
<div class="card shadow-sm">
|
|
<div class="card-body">
|
|
<ul class="nav nav-tabs nav-justified" id="profileTabs" role="tablist">
|
|
<li class="nav-item" role="presentation">
|
|
<button class="nav-link active"
|
|
id="subscription-tab"
|
|
data-bs-toggle="tab"
|
|
data-bs-target="#subscription-pane"
|
|
type="button"
|
|
role="tab"
|
|
aria-controls="subscription-pane"
|
|
aria-selected="true">
|
|
<span class="fas fa-star me-2"></span>{{ _("Plan & Subscription") }}
|
|
</button>
|
|
</li>
|
|
<li class="nav-item" role="presentation">
|
|
<button class="nav-link"
|
|
id="contact-tab"
|
|
data-bs-toggle="tab"
|
|
data-bs-target="#contact-pane"
|
|
type="button"
|
|
role="tab"
|
|
aria-controls="contact-pane"
|
|
aria-selected="false">
|
|
<span class="fas fa-info-circle me-2"></span>{{ _("Company Details") }}
|
|
</button>
|
|
</li>
|
|
<li class="nav-item" role="presentation">
|
|
<button class="nav-link"
|
|
id="makes-tab"
|
|
data-bs-toggle="tab"
|
|
data-bs-target="#makes-pane"
|
|
type="button"
|
|
role="tab"
|
|
aria-controls="makes-pane"
|
|
aria-selected="false">
|
|
<span class="fas fa-car me-2"></span>{{ _("Car Brands") }}
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
<div class="tab-content pt-4" id="profileTabsContent">
|
|
<div class="tab-pane fade show active"
|
|
id="subscription-pane"
|
|
role="tabpanel"
|
|
aria-labelledby="subscription-tab">
|
|
<div class="row g-3">
|
|
<div class="col-12 col-lg-6">
|
|
<div class="card h-100 shadow-sm">
|
|
<div class="card-body">
|
|
<div class="d-flex align-items-center justify-content-between mb-3">
|
|
<h3 class="mb-0">{{ dealer.user.userplan.plan|capfirst }}</h3>
|
|
{% if dealer.user.userplan and not dealer.user.userplan.is_expired %}
|
|
<span class="badge bg-success-subtle text-success">{{ _("Active") }}</span>
|
|
{% elif dealer.user.userplan and dealer.user.userplan.is_expired %}
|
|
<span class="badge bg-danger-subtle text-danger">{{ _("Expired") }}</span>
|
|
{% else %}
|
|
<span class="badge bg-warning-subtle text-warning">{{ _("No Active Plan") }}</span>
|
|
{% endif %}
|
|
</div>
|
|
<p class="fs-9 text-body-secondary">
|
|
{% if dealer.user.userplan and not dealer.user.userplan.is_expired %}
|
|
{% trans 'Active until' %}: {{ dealer.user.userplan.expire }} <small>{% trans 'Days left' %}: {{ dealer.user.userplan.days_left }}</small>
|
|
{% else %}
|
|
{% trans 'Please subscribe or renew your plan to continue using our services.' %}
|
|
{% endif %}
|
|
</p>
|
|
<div class="d-flex align-items-end mb-3">
|
|
<h4 class="fw-bolder me-1">
|
|
{{ dealer.user.userplan.plan.planpricing_set.first.price }} <span class="icon-saudi_riyal"></span>
|
|
</h4>
|
|
</div>
|
|
<ul class="list-unstyled mb-4">
|
|
{% for line in dealer.user.userplan.plan.description|splitlines %}
|
|
<li class="d-flex align-items-center mb-1">
|
|
<span class="uil uil-check-circle text-success me-2"></span>
|
|
<span class="text-body-secondary">{{ line }}</span>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% comment %} <div class="d-flex justify-content-end gap-2">
|
|
{% if dealer.user.userplan.is_expired %}
|
|
<a href="{% url 'pricing_page' request.dealer.slug %}" class="btn btn-warning"><span class="fas fa-redo-alt me-2"></span>{{ _("Renew") }}</a>
|
|
{% endif %}
|
|
{% if dealer.user.userplan.plan.name != "Enterprise" %}
|
|
<a href="{% url 'pricing_page' request.dealer.slug %}" class="btn btn-primary"><span class="fas fa-rocket me-2"></span>{{ _("Upgrade Plan") }}</a>
|
|
{% endif %}
|
|
{% if not dealer.user.userplan %}
|
|
<a href="{% url 'pricing_page' request.dealer.slug %}" class="btn btn-success"><span class="fas fa-cart-plus me-2"></span>{{ _("Subscribe Now") }}</a>
|
|
{% endif %}
|
|
</div> {% endcomment %}
|
|
<div class="d-flex justify-content-end gap-2">
|
|
{% if not dealer.user.userplan %}
|
|
<a href="{% url 'pricing_page' request.dealer.slug %}"
|
|
class="btn btn-outline-primary"><span class="fas fa-cart-plus me-2"></span>{{ _("Subscribe Now") }}</a>
|
|
{% elif dealer.user.userplan.is_expired %}
|
|
<a href="{% url 'pricing_page' request.dealer.slug %}"
|
|
class="btn btn-outline-warning"><span class="fas fa-redo-alt me-2"></span>{{ _("Renew") }}</a>
|
|
{% elif dealer.user.userplan.plan.name != "Enterprise" %}
|
|
<a href="{% url 'pricing_page' request.dealer.slug %}"
|
|
class="btn btn-outline-primary"><span class="fas fa-rocket me-2"></span>{{ _("Upgrade Plan") }}</a>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-lg-6">
|
|
<div class="card h-100 shadow-sm">
|
|
<div class="card-body d-flex flex-column justify-content-center">
|
|
<div class="d-flex justify-content-between mb-4">
|
|
<h5 class="mb-0 text-body-highlight">{{ _("Manage Users & Cars") }}</h5>
|
|
</div>
|
|
<div class="mb-4">
|
|
<h6 class="text-body-secondary">{{ _("Total users") }}</h6>
|
|
<div class="progress" style="height: 10px;">
|
|
<div class="progress-bar bg-success"
|
|
role="progressbar"
|
|
style="width: {{ dealer.staff_count|get_percentage:allowed_users }}%"
|
|
aria-valuenow="{{ dealer.staff_count|get_percentage:allowed_users }}"
|
|
aria-valuemin="0"
|
|
aria-valuemax="100"></div>
|
|
</div>
|
|
<div class="d-flex justify-content-between text-body-secondary fs-9 mt-2">
|
|
<span>{{ _("Used") }}: {{ dealer.staff_count }}</span>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="mb-4">
|
|
<h6 class="text-body-secondary">{{ _("Total cars") }}</h6>
|
|
<div class="progress" style="height: 10px;">
|
|
<div class="progress-bar bg-info"
|
|
role="progressbar"
|
|
style="width: {{ cars_count|get_percentage:allowed_cars }}%"
|
|
aria-valuenow="{{ cars_count|get_percentage:allowed_cars }}"
|
|
aria-valuemin="0"
|
|
aria-valuemax="100"></div>
|
|
</div>
|
|
<div class="d-flex justify-content-between text-body-secondary fs-9 mt-2">
|
|
<span>{{ _("Used") }}: {{ cars_count }}</span>
|
|
|
|
</div>
|
|
</div>
|
|
<small class="text-body-secondary mt-auto">{{ _("Contact support to increase your limits") }}</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane fade"
|
|
id="contact-pane"
|
|
role="tabpanel"
|
|
aria-labelledby="contact-tab">
|
|
<div class="row g-3">
|
|
<div class="col-12 col-lg-6">
|
|
<div class="card h-100 shadow-sm">
|
|
<div class="card-body">
|
|
<h5 class="mb-3">{% trans 'Contact Information' %}</h5>
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="fas fa-location-dot me-3 text-primary"></span>
|
|
<div>
|
|
<h6 class="mb-0">{% trans 'Address' %}</h6>
|
|
<p class="mb-0 text-body-secondary">{{ dealer.address }}</p>
|
|
</div>
|
|
</div>
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="fas fa-envelope me-3 text-info"></span>
|
|
<div>
|
|
<h6 class="mb-0">{% trans 'Email' %}</h6>
|
|
<p class="mb-0 text-body-secondary">{{ dealer.user.email }}</p>
|
|
</div>
|
|
</div>
|
|
<div class="d-flex align-items-center">
|
|
<span class="fas fa-phone me-3 text-success"></span>
|
|
<div>
|
|
<h6 class="mb-0">{% trans 'Phone' %}</h6>
|
|
<p class="mb-0 text-body-secondary" dir="ltr">{{ dealer.phone_number }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-lg-6">
|
|
<div class="card h-100 shadow-sm">
|
|
<div class="card-body">
|
|
<h5 class="mb-3">{{ _("VAT Information") }}</h5>
|
|
<form action="{% url 'dealer_vat_rate_update' request.dealer.slug %}"
|
|
method="post">
|
|
{% csrf_token %}
|
|
{{ vatform|crispy }}
|
|
<button class="btn btn-phoenix-primary mt-3" type="submit">
|
|
<i class="fa-solid fa-pen-to-square me-1"></i>{% trans 'Update VAT' %}
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane fade"
|
|
id="makes-pane"
|
|
role="tabpanel"
|
|
aria-labelledby="makes-tab">
|
|
<div class="card h-100 shadow-sm">
|
|
<div class="card-body">
|
|
<h5 class="mb-4">{{ _("Makes you are selling") }}</h5>
|
|
<div class="d-flex flex-wrap gap-3 mb-4">
|
|
{% for make in car_makes %}
|
|
<div class="text-center p-2 border rounded-3">
|
|
{% if make.logo %}
|
|
<img src="{{ make.logo.url }}"
|
|
alt="{{ make.get_local_name }}"
|
|
class="rounded"
|
|
style="height: 48px;
|
|
width: auto;
|
|
background-color:white" />
|
|
{% endif %}
|
|
<p class="fs-8 text-body-secondary mt-1 mb-0">{{ make.get_local_name }}</p>
|
|
</div>
|
|
{% empty %}
|
|
<p class="text-body-secondary">{{ _("No car makes selected.") }}</p>
|
|
{% endfor %}
|
|
</div>
|
|
<a class="btn btn-phoenix-warning"
|
|
href="{% url 'assign_car_makes' request.dealer.slug %}"><span class="fas fa-plus me-2"></span>{{ _("Select Makes") }}</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %} |