Prettifying a few client views

clients/urls.py

@@ -1,10 +1,11 @@
 from django.urls import path
 
-from .views import ClientRegistrationView, ClientProfileView
+from .views import ClientRegistrationView, ClientProfileView, ClientDashboardView
 
 app_name = "clients"
 
 urlpatterns = [
+    path('dashboard/', ClientDashboardView.as_view(), name="dashboard"),
     path('register/', ClientRegistrationView.as_view(), name="register"),
     path('profile/', ClientProfileView.as_view(), name="profile"),
 ]

clients/views.py

@@ -1,4 +1,4 @@
-from django.views.generic import CreateView, UpdateView
+from django.views.generic import CreateView, UpdateView, TemplateView
 from django.urls import reverse_lazy
 from django.shortcuts import redirect
 from django.contrib import messages
@@ -57,3 +57,6 @@ class ClientProfileView(InConstructionMixin, LoginRequiredMixin, UpdateView):
             return super().get(request, *args, **kwargs)
         except ClientProfile.DoesNotExist:
             return redirect("clients:register")
+
+class ClientDashboardView(InConstructionMixin, LoginRequiredMixin, TemplateView):
+    template_name = "clients/dashboard.html"

localauth/helpers.py

@@ -2,6 +2,8 @@ from django.conf import settings
 
 from geopy.geocoders import Nominatim
 
+import uuid
+
 def name_to_coords(name):
     geocoder = Nominatim(user_agent="JourneyJoker.at")
     
@@ -11,3 +13,6 @@ def name_to_coords(name):
 
 def profile_to_coords(profile):
     return name_to_coords("%s, %s, %s, %s" % (profile.address, profile.city, profile.zip, profile.country))
+
+def upload_path(instance, filename):
+    return f'userfiles/{instance.user.id}/{uuid.uuid4()}/{filename}'

localauth/models.py

@@ -6,7 +6,7 @@ from django.utils import timezone
 
 from django_countries.fields import CountryField
 
-from .helpers import profile_to_coords
+from .helpers import profile_to_coords, upload_path
 
 class UserManager(BaseUserManager):
     use_in_migrations = True
@@ -70,6 +70,10 @@ class AddressMixin(models.Model):
     state = models.CharField(max_length=64, null=True, blank=True)
     country = CountryField()
 
+    @property
+    def full_address(self):
+        return f"{self.street}, {self.city}, {self.zip}, {self.state}, {self.country}"
+
     class Meta:
         abstract = True
 
@@ -85,7 +89,13 @@ class LocationMixin(AddressMixin):
     class Meta:
         abstract = True
 
-class Profile(AddressMixin, models.Model):
+class ImageMixin(models.Model):
+    image = models.ImageField(upload_to=upload_path)
+
+    class Meta:
+        abstract = True
+
+class Profile(AddressMixin):
     user = models.OneToOneField(User, models.CASCADE)
     company = models.CharField(max_length=64, null=True, blank=True)
     vat_id = models.CharField(max_length=32, null=True, blank=True)

partners/models.py

@@ -1,19 +1,20 @@
 from django.contrib.gis.db import models
 
-from localauth.models import User, Profile, LocationMixin
+from localauth.models import User, Profile, LocationMixin, ImageMixin
 
 from django_countries.fields import CountryField
 
 class PartnerProfile(Profile):
     pass
 
-class Establishment(LocationMixin, models.Model):
+class Establishment(LocationMixin, ImageMixin):
     owner = models.ForeignKey(PartnerProfile, models.CASCADE)
     name = models.CharField(max_length=64)
     stars = models.IntegerField(null=True, blank=True)
     superior = models.BooleanField(default=False)
     verified = models.BooleanField(default=False)
 
-class RoomCategory(models.Model):
+class RoomCategory(ImageMixin):
     establishment = models.ForeignKey(Establishment, models.CASCADE)
     name = models.CharField(max_length=64)
+    price = models.DecimalField(max_digits=10, decimal_places=2)

templates/clients/base.html

@@ -0,0 +1,37 @@
+{% extends "frontend/base.html" %}
+{% block "content" %}
+        <!--===== INNERPAGE-WRAPPER ====-->
+        <section class="innerpage-wrapper">
+            <div id="dashboard" class="innerpage-section-padding">
+                <div class="container">
+                    <div class="row">
+                                <div class="col-12 col-md-12 col-lg-12 col-xl-12">
+                            <div class="dashboard-heading">
+                                <h2>Dein <span>Profil</span></h2>
+                                <p>Servus {{ request.user.get_full_name }}, willkommen in deinem JourneyJoker-Profil!</p>
+                                <p>Hier siehst du all deine gebuchten Reisen und kannst deine Daten verwalten!</p>
+                            </div><!-- end dashboard-heading -->
+                            
+                            <div class="dashboard-wrapper">
+                                <div class="row">
+                                
+                                    <div class="col-12 col-md-2 col-lg-2 dashboard-nav">
+                                        <ul class="nav nav-tabs">
+                                            <li class="nav-item active"><a class="nav-link" href="{% url "clients:dashboard" %}"><span><i class="fa fa-cogs"></i></span>Dashboard</a></li>
+                                            <li class="nav-item"><a class="nav-link" href="{% url "clients:profile" %}"><span><i class="fa fa-user"></i></span>Profil</a></li>
+                                            <li class="nav-item"><a class="nav-link" href="#"><span><i class="fa fa-briefcase"></i></span>Buchungen</a></li>
+                                            <li class="nav-item"><a class="nav-link" href="#"><span><i class="fa fa-heart"></i></span>Bewertungen</a></li>
+                                        </ul>
+                                    </div><!-- end columns -->
+                                    
+                                    {% block "dashboardcontent" %}
+                                    {% endblock %}
+                                    
+                                </div><!-- end row -->
+                            </div><!-- end dashboard-wrapper -->
+                        </div><!-- end columns -->
+                    </div><!-- end row -->
+                </div><!-- end container -->          
+            </div><!-- end dashboard -->
+        </section><!-- end innerpage-wrapper -->
+{% endblock %}

templates/clients/dashboard.html

@@ -0,0 +1,102 @@
+{% extends "clients/base.html" %}
+{% block "dashboardcontent" %}
+<div class="col-12 col-md-10 col-lg-10 dashboard-content">
+    <h2 class="dash-content-title">Deine Statistik</h2>
+    <div class="row info-stat">
+    
+        <div class="col-md-6 col-lg-3">
+            <div class="stat-block">
+                <span><i class="fa fa-heart"></i></span>
+                <h3>4</h3>
+                <p>Bewertungen</p>
+            </div><!-- end stat-block -->
+        </div><!-- end columns -->
+        
+        <div class="col-md-6 col-lg-3">
+            <div class="stat-block">
+                <span><i class="fa fa-euro-sign"></i></span>
+                <h3>12345</h3>
+                <p>Euro</p>
+            </div><!-- end stat-block -->
+        </div><!-- end columns -->
+        
+        <div class="col-md-6 col-lg-3">
+            <div class="stat-block">
+                <span><i class="fa fa-building"></i></span>
+                <h3>12</h3>
+                <p>Städte</p>
+            </div><!-- end stat-block -->
+        </div><!-- end columns -->
+        
+        <div class="col-md-6 col-lg-3">
+            <div class="stat-block">
+                <span><i class="fa fa-paper-plane"></i></span>
+                <h3>102</h3>
+                <p>Reisen</p>
+            </div><!-- end stat-block -->
+        </div><!-- end columns -->
+        
+    </div><!-- end row -->
+    
+    <div class="dashboard-listing recent-activity">
+        <h3 class="dash-listing-heading">Letzte Aktivitäten</h3>
+        <div class="table-responsive">
+            <table class="table table-hover">
+                <tbody>
+                    <tr>
+                        <td class="dash-list-icon recent-ac-icon"><i class="fa fa-heart"></i></td>
+                        <td class="dash-list-text recent-ac-text">Deine Bewertung für <span>Habbo Hotel</span> wurde freigeschaltet!</td>
+                        <td class="dash-list-btn del-field"><button class="btn">X</button></td>
+                    </tr>
+                    
+                    <tr>
+                        <td class="dash-list-icon recent-ac-icon"><i class="fa fa-building"></i></td>
+                        <td class="dash-list-text recent-ac-text">Wie war dein Aufenthalt bei <span>Habbo Hotel</span>? Gib eine Bewertung ab!</td>
+                        <td class="dash-list-btn del-field"><button class="btn">X</button></td>
+                    </tr>
+                    
+                    <tr>
+                        <td class="dash-list-icon recent-ac-icon"><i class="fa fa-bookmark"></i></td>
+                        <td class="dash-list-text recent-ac-text">Deine Buchung war erfolgreich! Mehr Details zu deinem Aufenthalt bei <span>Habbo Hotel</span>!</td>
+                        <td class="dash-list-btn del-field"><button class="btn">X</button></td>
+                    </tr>
+                    
+                    <tr>
+                        <td class="dash-list-icon recent-ac-icon"><i class="fa fa-question"></i></td>
+                        <td class="dash-list-text recent-ac-text">Du hast Angebote zu deiner Reiseanfrage erhalten! <span>Jetzt ansehen?</span></td>
+                        <td class="dash-list-btn del-field"><button class="btn">X</button></td>
+                    </tr>
+                    
+                    <tr>
+                        <td class="dash-list-icon recent-ac-icon"><i class="fa fa-check"></i></td>
+                        <td class="dash-list-text recent-ac-text">Deine Reiseanfrage wurde freigeschaltet! Bald wirst du erste Angebote erhalten!</td>
+                        <td class="dash-list-btn del-field"><button class="btn">X</button></td>
+                    </tr>
+                </tbody>
+            </table>
+        </div><!-- end table-responsive -->
+    </div><!-- end recent-activity -->
+    
+    <div class="dashboard-listing invoices">
+        <h3 class="dash-listing-heading">Rechnungen</h3>
+        <div class="table-responsive">
+            <table class="table table-hover">
+                <tbody>
+                    <tr>
+                        <td class="dash-list-icon invoice-icon"><i class="fa fa-bars"></i></td>
+                        <td class="dash-list-text invoice-text">
+                            <h4 class="invoice-title">Reiseanfrage</h4>
+                            <ul class="list-unstyled list-inline invoice-info">
+                                <li class="list-inline-item invoice-status green">Bezahlt</li>
+                                <li class="list-inline-item invoice-order"> Anfrage: #00214</li>
+                                <li class="list-inline-item invoice-date"> Erstellt: 25.03.2021</li>
+                            </ul>
+                        </td>
+                        <td class="dash-list-btn"><button class="btn btn-orange">Rechnung anzeigen</button></td>
+                    </tr>
+                </tbody>
+            </table>
+        </div><!-- end table-responsive -->
+    </div><!-- end invoices -->
+</div><!-- end columns -->
+{% endblock %}

templates/clients/profile.html

@@ -1,21 +1,34 @@
-{% extends "frontend/base.html" %}
+{% extends "clients/base.html" %}
 {% load i18n %}
 {% load bootstrap4 %}
-{% block "content" %}
+{% block "dashboardcontent" %}
-        <!--===== INNERPAGE-WRAPPER ====-->
+<div class="col-12 col-md-10 col-lg-10 dashboard-content user-profile">
-        <section class="innerpage-wrapper">
+    <h2 class="dash-content-title">Mein Profil</h2>
-            <div id="payment-success" class="section-padding">
+    <div class="card">
-        <div class="container text-center">
+        <div class="card-header"><h4>Profildetails</h4></div>
-            <div class="row d-flex justify-content-center">
+        <div class="card-body">
-                <div class="col-md-12 col-lg-8 col-lg-offset-2">
+            <div class="row">
-                        <h2>{% trans "Profildaten" %}</h2>
+                <div class="col-md-5 col-lg-4 user-img">
-                                <form method="POST"> 
+                    <img src="images/user-profile.jpg" class="img-fluid" alt="user-img" />
-				    {% csrf_token %}
+                </div><!-- end columns -->
-				    {% bootstrap_form form %}
+                
-				    <button class="btn btn-orange btn-block">{% trans "Anwenden" %}</button>
+                <div class="col-md-7 col-lg-8  user-detail">
+                    <ul class="list-unstyled">
+                        <li><span>Name:</span> {{ object.full_name }}</li>
+                        <li><span>Email:</span> {{ object.user.email }}</li>
+                        <li><span>Adresse:</span> {{ object.full_address }}</li>
+                    </ul>
+                    <button class="btn" data-toggle="modal" data-target="#edit-profile">Profil bearbeiten</button>
+                   </div><!-- end columns -->
+                
+                <div class="col-md-12 user-desc">
+                    <h4>Profil löschen</h4>
+                    <p>Um dein Profil zu löschen, klicke bitte auf den folgenden Button. Beachte bitte, dass du damit den Zugriff auf alle vergangenen Buchungen unwiderruflich verlierst. Natürlich kannst du jederzeit einen neuen Account erstellen, wenn du JourneyJoker wieder nutzen möchtest.</p>
+                
                 </div><!-- end columns -->
             </div><!-- end row -->
-        </div><!-- end container -->
+            
-    </div><!-- end coming-soon-text -->
+        </div><!-- end card-body -->
-</section><!-- end innerpage-wrapper -->
+    </div><!-- end panel-detault -->
+</div><!-- end columns -->
 {% endblock %}

templates/frontend/base.html

@@ -327,6 +327,9 @@
             
         </section><!-- end footer -->
     
+    {% block "modal" %}
+    {% endblock %}
+        
     </div>                
                         
     <!-- Page Scripts Starts -->