Major fixes

osinaweb/osinacore/forms.py

@@ -1,7 +1,13 @@
 from django import forms
+from .models import *
 
 class CustomLoginForm(forms.Form):
     username = forms.CharField(label='Username', max_length=150)
     password = forms.CharField(label='Password', widget=forms.PasswordInput)
 
 
+
+class SignUpForm(forms.ModelForm):
+    class Meta:
+        model = CustomerProfile
+        fields = ['first_name', 'last_name', 'email', 'password', 'mobile_number', 'status', 'reference', 'personal_website', 'business']

osinaweb/osinacore/migrations/0021_alter_customerprofile_business_and_more.py

@@ -0,0 +1,66 @@
+# Generated by Django 4.2.5 on 2023-09-16 11:04
+
+from django.conf import settings
+from django.db import migrations, models
+import django.db.models.deletion
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        migrations.swappable_dependency(settings.AUTH_USER_MODEL),
+        ('osinacore', '0020_task'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='customerprofile',
+            name='business',
+            field=models.ForeignKey(blank=True, null=True, on_delete=django.db.models.deletion.CASCADE, to='osinacore.business'),
+        ),
+        migrations.AlterField(
+            model_name='customerprofile',
+            name='email',
+            field=models.EmailField(blank=True, max_length=254, unique=True),
+        ),
+        migrations.AlterField(
+            model_name='customerprofile',
+            name='first_name',
+            field=models.CharField(blank=True, max_length=50),
+        ),
+        migrations.AlterField(
+            model_name='customerprofile',
+            name='last_name',
+            field=models.CharField(blank=True, max_length=50),
+        ),
+        migrations.AlterField(
+            model_name='customerprofile',
+            name='mobile_number',
+            field=models.CharField(blank=True, max_length=50),
+        ),
+        migrations.AlterField(
+            model_name='customerprofile',
+            name='password',
+            field=models.CharField(blank=True, max_length=128),
+        ),
+        migrations.AlterField(
+            model_name='customerprofile',
+            name='personal_website',
+            field=models.URLField(blank=True, null=True),
+        ),
+        migrations.AlterField(
+            model_name='customerprofile',
+            name='reference',
+            field=models.ForeignKey(blank=True, null=True, on_delete=django.db.models.deletion.CASCADE, to='osinacore.reference'),
+        ),
+        migrations.AlterField(
+            model_name='customerprofile',
+            name='status',
+            field=models.CharField(blank=True, choices=[('Active', 'Active'), ('Suspended', 'Suspended'), ('Terminated', 'Terminated')], max_length=200),
+        ),
+        migrations.AlterField(
+            model_name='customerprofile',
+            name='user',
+            field=models.OneToOneField(blank=True, on_delete=django.db.models.deletion.CASCADE, to=settings.AUTH_USER_MODEL),
+        ),
+    ]

osinaweb/osinacore/migrations/0022_customerprofile_customer_id.py

@@ -0,0 +1,18 @@
+# Generated by Django 4.2.5 on 2023-09-17 18:19
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('osinacore', '0021_alter_customerprofile_business_and_more'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='customerprofile',
+            name='customer_id',
+            field=models.CharField(blank=True, max_length=20, null=True),
+        ),
+    ]

osinaweb/osinacore/migrations/0023_task_assigned_to.py

@@ -0,0 +1,19 @@
+# Generated by Django 4.2.5 on 2023-09-17 18:56
+
+from django.db import migrations, models
+import django.db.models.deletion
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('osinacore', '0022_customerprofile_customer_id'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='task',
+            name='assigned_to',
+            field=models.ForeignKey(null=True, on_delete=django.db.models.deletion.CASCADE, to='osinacore.staffprofile'),
+        ),
+    ]

osinaweb/osinacore/models.py

@@ -8,6 +8,9 @@ from datetime import datetime
 class Reference(models.Model):
     name = models.CharField(max_length=50)
     date = models.DateField(blank=True)
+    def __str__(self):
+        return self.name
+
 
 
 class Business(models.Model):
@@ -34,27 +37,41 @@ class Business(models.Model):
     logo = models.ImageField()
     class Meta:
         verbose_name_plural = u'Businesses'
+    def __str__(self):
+        return self.name
 
 
 
 class CustomerProfile(models.Model):
-    user = models.OneToOneField(User, on_delete=models.CASCADE)
-    first_name = models.CharField(max_length=50)
-    last_name = models.CharField(max_length=50)
-    email = models.EmailField(unique=True)
-    mobile_number = models.CharField(max_length=50)
-    password = models.CharField(max_length=128)
-    personal_website = models.URLField(null=True)
+    user = models.OneToOneField(User, on_delete=models.CASCADE, blank=True)
+    first_name = models.CharField(max_length=50, blank=True)
+    last_name = models.CharField(max_length=50, blank=True)
+    email = models.EmailField(unique=True,blank=True)
+    mobile_number = models.CharField(max_length=50, blank=True)
+    password = models.CharField(max_length=128, blank=True)
+    personal_website = models.URLField(null=True, blank=True)
     STATUS_CHOICES = (
         ('Active', 'Active'),
         ('Suspended', 'Suspended'),
         ('Terminated', 'Terminated'),
     )
-    status = models.CharField(max_length=200, choices=STATUS_CHOICES)
-    reference = models.ForeignKey(Reference, on_delete=models.CASCADE, null=True)
-    business = models.ForeignKey(Business, on_delete=models.CASCADE, null=True)
+    status = models.CharField(max_length=200, choices=STATUS_CHOICES, blank=True)
+    reference = models.ForeignKey(Reference, on_delete=models.CASCADE, null=True, blank=True)
+    business = models.ForeignKey(Business, on_delete=models.CASCADE, null=True, blank=True)
+    customer_id = models.CharField(max_length=20, null=True, blank=True) 
     def __str__(self):
         return self.user.username
+    def save(self, *args, **kwargs):
+        if not self.customer_id:
+            # Get the last two digits of the current year
+            current_year = str(datetime.now().year)[-2:]
+            # Find the maximum project ID in the database and increment it
+            max_id = CustomerProfile.objects.aggregate(models.Max('customer_id'))['customer_id__max']
+            new_id = str(int(max_id[-4:]) + 1).zfill(4) if max_id else '0001'  # If no existing records, start with '0001'
+            self.customer_id =  current_year + new_id  # Add 'p' prefix
+        super(CustomerProfile, self).save(*args, **kwargs)
+
+        
 
 
 
@@ -174,5 +191,4 @@ class Task(models.Model):
     description = models.TextField()
     start_date = models.CharField(max_length=200)
     end_date = models.CharField(max_length=200)
-
-    
+    assigned_to =  models.ForeignKey(StaffProfile, on_delete=models.CASCADE, null=True)

osinaweb/osinacore/views.py

@@ -85,8 +85,10 @@ def my_tasks(request, *args, **kwargs):
 
 @login_required
 def customers(request, *args, **kwargs):
+    customers = CustomerProfile.objects.all().order_by('-id')
     
     context = {
+    'customers' : customers,
 
     }
     return render(request, 'customers.html', context)
@@ -161,22 +163,31 @@ def createtask_epic(request):
 
 @login_required
 def add_customer(request):
+    businesses = Business.objects.all().order_by('-id')
+    references = Reference.objects.all().order_by('-id')
     context = {      
+    'businesses' : businesses, 
+    'references' :references
 
     }
     return render(request, 'add-customer.html', context)
 
 @login_required
-def customerdetails(request):
+def customerdetails(request, customer_id):
+    customer = get_object_or_404(CustomerProfile, customer_id=customer_id)
     context = {      
+    'customer'  : customer,
 
     }
     return render(request, 'customer-details.html', context)
     
+
 @login_required
 def addbusiness(request):
+
     context = {
 
+
     }
     return render(request, 'add-business.html', context)
 
@@ -191,6 +202,7 @@ def businessdetails(request):
 
 
 
+
 # Modals views
 
 def add_note_modal(request, *args, **kwargs):
@@ -413,3 +425,69 @@ def save_task(request):
         # Redirect to the detailed project page
         redirect_url = reverse('detailed-project', args=[project.project_id])  
         return redirect(redirect_url)
+
+
+
+@login_required
+def save_business(request):
+    if request.method == 'POST':
+        name = request.POST.get('name')
+        email= request.POST.get('email')
+        financial_number = request.POST.get('financial_number')
+        phone_number = request.POST.get('phone_number')
+        vat = request.POST.get('vat')
+        commercial_registration = request.POST.get('commercial_registration')
+        website = request.POST.get('website')
+        business_type = request.POST.get('business_type')
+        logo = request.POST.get('logo')
+
+        business = Business(
+        name = name,
+        email = email,
+        financial_number = financial_number,
+        vat = vat,
+        commercial_registration = commercial_registration,
+        website = website,
+        business_type = business_type,
+        logo = logo,
+        phone_number = phone_number,
+        )
+        business.save()
+
+
+       
+    return render(request, 'add-business.html') 
+
+
+def save_customer(request):
+    if request.method == 'POST':
+        form = SignUpForm(request.POST)
+        if form.is_valid():
+            email = form.cleaned_data['email']
+            first_name = form.cleaned_data['first_name'].replace(" ", "")  # Remove spaces
+            last_name = form.cleaned_data['last_name'].replace(" ", "")  # Remove spaces
+            
+            username = f"{first_name.lower()}{last_name.lower()}"
+            original_username = username
+            counter = 1  # Initialize a counter to add numbers
+            
+            while User.objects.filter(username=username).exists():
+                # If the username already exists, append the counter to it
+                username = f"{original_username.lower()}{counter}"
+                counter += 1
+            
+            user = User.objects.create_user(
+                username=username,
+                email=email,
+                password=form.cleaned_data['password']
+            )
+            user.first_name = form.cleaned_data['first_name']
+            user.last_name = form.cleaned_data['last_name']
+            user.save()
+
+            customer_profile = form.save(commit=False)
+            customer_profile.user = user
+            customer_profile.save()
+
+    return redirect('customers')
+

osinaweb/osinaweb/urls.py

@@ -28,10 +28,10 @@ urlpatterns = [
     path('my-tasks/', login_required(views.my_tasks), name='my-tasks'),
     path('customers/', views.customers, name='customers'),
     path('addcustomer/', views.add_customer, name='addcustomer'),
-    path('customerdetails/', views.customerdetails, name='customerdetails'),
+    path('customerdetails/<str:customer_id>/', views.customerdetails, name='customerdetails'),
     path('addbusiness/', views.addbusiness, name='addbusiness'),
     path('businessdetails/', views.businessdetails, name='businessdetails'),
-    path('detailedproject/<str:project_id>/', views.detailed_project, name='detailed-project'),
+    path('projectdetails/<str:project_id>/', views.detailed_project, name='detailed-project'),
     path('createproject/', views.create_project, name='createproject'),
     path('createepic/<str:project_id>/', views.create_epic, name='createepic'),
     path('createtask/', views.create_task, name='createtask'),
@@ -56,4 +56,6 @@ urlpatterns = [
     path('save_project/', views.save_project, name='save_project'),
     path('save_epic/', views.save_epic, name='save_epic'),
     path('save_task/', views.save_task, name='save_task'),
+    path('save_business/', views.save_business, name='save_business'),
+    path('save_customer/', views.save_customer, name='save_customer'),
 ]

osinaweb/templates/add-business.html

@@ -9,16 +9,18 @@
         <h1 class="text-3xl text-slate-800 text-center font-semibold">
             Add Business
         </h1>
-        <form>
-            <div class="w-full flex flex-col gap-3 justify-center items-center mt-5">
-                <input type="text" placeholder="Name"
-                    class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md" required>
+        <form  method="POST" action="{% url 'save_business' %}">
+            {% csrf_token %}
+            <input name="name" type="text" placeholder="Name"
+                class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-4"
+                required>
 
-                <div class="inbox-box border border-gray-300 py-1 px-3 w-full rounded-md">
+            <div class="inbox-box border border-gray-300 py-1 px-3 w-full rounded-md mt-4">
                 <div class="flex items-center justify-between">
-                        <input required name="cv" type="file" id="actual-btn" accept="image/*" hidden multiple />
-                        <span id="file-name" class="text-gray-500 text-base focus:outline-none outline-none">Upload
-                            Business
+                    <input name="logo" required name="cv" type="file" id="actual-btn" accept="image/*" hidden
+                        multiple />
+                    <span id="file-name"
+                        class="text-gray-500 text-base focus:outline-none outline-none">Upload Business
                         Logo</span>
                     <label for="actual-btn"
                         class="bg-transparent text-gray-500 border border-white px-4 py-2 h-14 cursor-pointer flex items-center"><i
@@ -43,42 +45,60 @@
                 });
             </script>
 
-                <input type="email" placeholder="Email"
-                    class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md" required>
+            <input name="email" type="email" placeholder="Email"
+                class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-4"
+                required>
 
-                <input type="number" placeholder="Financial Number"
-                    class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md" required>
+            <input name="financial_number" type="number" placeholder="Financial Number"
+                class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-4"
+                required>
 
-                <div class="w-full flex justify-start items-center gap-2">
-                    <input type="checkbox" required>
+            <div class="w-full flex justify-start items-center gap-2 mt-4">
+                <input name="vat"type="checkbox" id="vatCheckbox" onchange="updateVatValue(this.checked)" required>
                 <label class="text-slate-800">Vat</label>
             </div>
           
-                <input type="number" placeholder="Commercial registration"
-                    class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md" required>
  
-                <input type="number" placeholder="Mobile Number"
-                    class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md" required>
             
-                <input type="text" placeholder="Website"
-                    class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md">
+            <script>
+            function updateVatValue(checked) {
+              const vatInput = document.querySelector('input[name="vat"]');
+              vatInput.value = checked ? 'True' : 'False';
+            }
+            </script>
+
+            <input name="commercial_registration" type="commercial_registration" placeholder="Commercial registration"
+                class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-4"
+                required>
 
+            <input name="phone_number" type="number" placeholder="Mobile Number"
+                class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-4"
+                required>
 
-                <select id=""
-                    class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500">
+            <input name="website" type="text" placeholder="Website"
+                class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-4">
+
+
+            <select name="business_type" id=""
+                class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500 mt-4">
                 <option value="" selected disabled>Business Type</option>
-                    <option value="">Healthcare</option>
-                    <option value="">Associations</option>
-                    <option value="">Education</option>
-                    <option value="">Non-profit</option>
+                <option value="ASSOCIATIONS">Associations</option>
+                <option value="HEALTHCARE">Healthcare</option>
+                <option value="LUXURY">Luxury</option>
+                <option value="MANUFACTURING">Manufacturing</option>
+                <option value="NON-PROFIT">Non-Profit</option>
+                <option value="Education">Education</option>
+                <option value="ENTERTAINMENT">Entertainment</option>
+                <option value="LOGISTICS">Logistics</option>
+                <option value="RETAIL">Retail</option>
+                <option value="AUTOMOTIVE">Automotive</option>
             </select>
 
             <div class="w-full flex justify-center items-center mt-3">
-                    <button
+                <button type="submit"
                     class="w-fit py-1 px-3 bg-blue-500 rounded-md outline-none text-white border border-blue-500 text-xl cursor-pointer hover:bg-white hover:text-blue-500">Add
                     Business</button>
             </div>
-            </div>
         </form>
     </div>
 </div>

osinaweb/templates/add-customer.html

@@ -9,46 +9,40 @@
         <h1 class="text-3xl text-slate-800 text-center font-semibold">
             Add Customer
         </h1>
-        <form>
+        <form method="POST" action="{% url 'save_customer' %}">
+            {% csrf_token %}
             <div class="w-full flex flex-col gap-3 justify-center items-center mt-5">
-                <!-- <select id=""
-                    class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500"
-                    required>
-                    <option value="" selected disabled>User</option>
-                    <option value="">Not a User</option>
-                    <option value="">Emile</option>
-                    <option value="">Salim</option>
-                </select> -->
 
-                <input type="text" placeholder="First Name"
+                <input name="first_name" type="text" placeholder="First Name"
                     class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md" required>
 
-                <input type="text" placeholder="Last Name"
+                <input name="last_name" type="text" placeholder="Last Name"
                     class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md" required>
 
-                <input type="email" placeholder="Email"
+                <input name="email" type="email" placeholder="Email"
                     class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md" required>
 
-                <input type="number" placeholder="Mobile Number"
+                <input name="mobile_number" type="number" placeholder="Mobile Number"
                     class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md" required>
 
-                <input type="text" placeholder="Personal Website"
+                <input name="personal_website" type="text" placeholder="Personal Website"
                     class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md">
-
-                <select id=""
+                <select name="status" 
                     class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500"
                     required>
                     <option value="" selected disabled>Status</option>
-                    <option value="">Active</option>
-                    <option value="">Suspended</option>
-                    <option value="">Terminated</option>
+                    <option value="Active">Active</option>
+                    <option value="Suspended">Suspended</option>
+                    <option value="Terminated">Terminated</option>
                 </select>
 
-                <select id=""
+                <select name="reference" 
                     class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500"
                     required>
                     <option value="" selected disabled>Reference</option>
-                    <option value="">Nataly</option>
+                    {% for reference in references %}
+                    <option value="{{reference.id}}">{{reference.name}}</option>
+                    {% endfor %}
                 </select>
 
                 <select id="businessTypeSelect"
@@ -61,85 +55,17 @@
                 <div class="w-[80%] mx-auto border border-gray-300 rounded-md py-5 px-3 bg-white hidden"
                     id="addBusinessContainer">
                     <h1 class="text-3xl text-slate-800 text-center font-semibold">
-                        Add Business
+                        Select Business
                     </h1>
 
                   <div class="w-full mt-2">
-                        <form>
-                            <input type="text" placeholder="Name"
-                                class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-4"
-                                required>
-
-                            <div class="inbox-box border border-gray-300 py-1 px-3 w-full rounded-md mt-4">
-                                <div class="flex items-center justify-between">
-                                    <input required name="cv" type="file" id="actual-btn" accept="image/*" hidden
-                                        multiple />
-                                    <span id="file-name"
-                                        class="text-gray-500 text-base focus:outline-none outline-none">Upload Business
-                                        Logo</span>
-                                    <label for="actual-btn"
-                                        class="bg-transparent text-gray-500 border border-white px-4 py-2 h-14 cursor-pointer flex items-center"><i
-                                            class="fa fa-upload"></i></label>
-
-                                </div>
-                            </div>
-
-                            <!-- WHEN THE USER CHOOSE A FILE THE NAME OF THE FILE WILL APPEAR IN THE SPAN -->
-                            <script>
-                                const fileInput = document.getElementById('actual-btn');
-                                const fileNameSpan = document.getElementById('file-name');
-
-                                fileInput.addEventListener('change', (event) => {
-                                    const selectedFiles = event.target.files;
-                                    if (selectedFiles.length > 0) {
-                                        const fileNames = Array.from(selectedFiles).map(file => file.name).join(', ');
-                                        fileNameSpan.textContent = fileNames;
-                                    } else {
-                                        fileNameSpan.textContent = 'Upload Documents (PDF, docx)';
-                                    }
-                                });
-                            </script>
-
-                            <input type="email" placeholder="Email"
-                                class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-4"
-                                required>
-
-                            <input type="number" placeholder="Financial Number"
-                                class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-4"
-                                required>
-
-                            <div class="w-full flex justify-start items-center gap-2 mt-4">
-                                <input type="checkbox" required>
-                                <label class="text-slate-800">Vat</label>
-                            </div>
-
-                            <input type="number" placeholder="Commercial registration"
-                                class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-4"
-                                required>
-
-                            <input type="number" placeholder="Mobile Number"
-                                class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-4"
-                                required>
-
-                            <input type="text" placeholder="Website"
-                                class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-4">
-
-
-                            <select id=""
-                                class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500 mt-4">
-                                <option value="" selected disabled>Business Type</option>
-                                <option value="">Healthcare</option>
-                                <option value="">Associations</option>
-                                <option value="">Education</option>
-                                <option value="">Non-profit</option>
+                    <select name="business" class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500">
+                    <option value="" selected disabled>Business Name</option>
+                    {% for  business in businesses %}
+                    <option value="{{business.id}}">{{business.name}}</option>
+                    {% endfor %}
                     </select>
                  
-                            <div class="w-full flex justify-center items-center mt-3">
-                                <button
-                                    class="w-fit py-1 px-3 bg-blue-500 rounded-md outline-none text-white border border-blue-500 text-xl cursor-pointer hover:bg-white hover:text-blue-500">Add
-                                    Business</button>
-                            </div>
-                        </form>
                   </div>
                 </div>
 
@@ -158,9 +84,11 @@
                     });
 
                 </script>
+                 <input name="password" type="password" placeholder="Password"
+                 class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md" required>
 
                 <div class="w-full flex justify-center items-center mt-3">
-                    <button
+                    <button type="submit"
                         class="w-fit py-1 px-3 bg-blue-500 rounded-md outline-none text-white border border-blue-500 text-xl cursor-pointer hover:bg-white hover:text-blue-500">Add
                         Customer</button>
                 </div>

osinaweb/templates/customer-details.html

@@ -57,9 +57,24 @@
 <div class="w-full flex items-stretch justify-between gap-[2.5%] px-10 pb-5">
     <!-- LEFT SIDE / TASK DETAIL SECTION -->
     <div class="w-[74.5%] bg-white h-fit rounded-md shadow-md p-5">
-        <div class="w-full bg-gray-300 rounded-t-md flex flex-col justify-center items-center py-2">
-            <h1 class="text-3xl text-white font-semibold">Emile Elliye</h1>
-        </div>
+        {% if customer.status == 'Active' %}
+        <div class="w-full bg-green-700 rounded-t-md flex flex-col justify-center items-center py-2">
+            <h1 class="text-3xl text-white font-semibold">{{customer.first_name}} {{customer.last_name}}</h1>
+            <p class="text-white text-base">{{customer.customer_id}}</p>
+        </div>
+        {% endif %}
+        {% if customer.status == 'Suspended' %}
+        <div class="w-full bg-red-500 rounded-t-md flex flex-col justify-center items-center py-2">
+            <h1 class="text-3xl text-white font-semibold">{{customer.first_name}} {{customer.last_name}}</h1>
+            <p class="text-white text-base">{{customer.customer_id}}</p>
+        </div>
+        {% endif %}
+        {% if customer.status == 'Terminated' %}
+        <div class="w-full bg-gray-500 rounded-t-md flex flex-col justify-center items-center py-2">
+            <h1 class="text-3xl text-white font-semibold">{{customer.first_name}} {{customer.last_name}}</h1>
+            <p class="text-white text-base">{{customer.customer_id}}</p>
+        </div>
+        {% endif %}
         <div class="w-full h-[70px] flex justify-end items-center bg-gray-100 shadow-md rounded-md px-3 py-1 mt-4">
             <div class="flex justify-end items-center gap-3">
                 <button
@@ -73,37 +88,59 @@
         <div class="w-full flex flex-col gap-4 mt-5">
             <div>
                 <p class="text-gray-500 text-xl">First Name: <span
-                        class="text-slate-800 text-xl font-semibold">Emile</span></p>
+                        class="text-slate-800 text-xl font-semibold">{{customer.first_name}}</span></p>
             </div>
 
             <div>
                 <p class="text-gray-500 text-xl">Last Name: <span
-                        class="text-slate-800 text-xl font-semibold">Ellye</span></p>
+                        class="text-slate-800 text-xl font-semibold">{{customer.last_name}}</span></p>
             </div>
 
             <div>
                 <p class="text-gray-500 text-xl">Email: <span
-                        class="text-slate-800 text-xl font-semibold">emile.e@ositcom.com</span></p>
+                        class="text-slate-800 text-xl font-semibold">{{customer.email}}</span></p>
             </div>
-
+           {% if customer.personal_website %}
             <div>
                 <p class="text-gray-500 text-xl">Personal Website: <span
-                        class="text-slate-800 text-xl font-semibold">www.ositcom.com</span></p>
+                        class="text-slate-800 text-xl font-semibold">{{customer.personal_website}}</span></p>
             </div>
+            {% endif %}
          
+
+            {% if customer.status == 'Active' %}
             <div>
                 <p class="text-gray-500 text-xl">Status: <span
-                        class="text-green-700 text-xl font-semibold">Active</span></p>
+                        class="text-green-700 text-xl font-semibold">{{customer.status}}</span></p>
             </div>
+            {% endif %}
+
+
+            {% if customer.status == 'Suspended' %}
+            <div>
+                <p class="text-gray-500 text-xl">Status: <span
+                        class="text-red-500 text-xl font-semibold">{{customer.status}}</span></p>
+            </div>
+            {% endif %}
+
+
+            {% if customer.status == 'Terminated' %}
+            <div>
+                <p class="text-red-500 text-xl">Status: <span
+                        class="text-gray-500 text-xl font-semibold">{{customer.status}}</span></p>
+            </div>
+            {% endif %}
 
             <div>
                 <p class="text-gray-500 text-xl">Reference: <span
-                        class="text-green-700 text-xl font-semibold">Salim</span></p>
+                        class="text-slate-800 text-xl font-semibold">{{customer.reference}}</span></p>
             </div>
         </div>
 
 
         <!-- BUSINESS -->
+
+        {% if customer.business %}
         <div class="mt-4">
             <p class="text-gray-500 text-xl">Business:</p>
             <div class="w-full px-4">
@@ -129,13 +166,13 @@
                         <!-- ROW -->
                         <div class="w-full h-[50px] flex justify-between items-center border-b border-gray-300">
                             <div class="w-[35%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-sm">Ositcom</p>
+                                <p class="text-sm">{{customer.business.name}}</p>
                             </div>
                             <div class="w-[30%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-sm">Associations</p>
+                                <p class="text-sm">{{customer.business.business_type}}</p>
                             </div>
                             <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-sm">2567776</p>
+                                <p class="text-sm">{{customer.business.financial_number}}</p>
                             </div>
                             <div class="w-[15%] h-full flex justify-center items-center gap-3">
                                 <a href="{% url 'businessdetails' %}">
@@ -151,16 +188,13 @@
                                 </div>
                             </div>
                         </div>
-                        <div class="w-full">
-                            <a href="{% url 'addbusiness' %}">
-                                <button class="w-full border-b border-gray-300 text-gray-500 py-3 bg-gray-100">ADD
-                                    BUISNESS</button>
-                            </a>
-                        </div>
+                
                     </div>
                 </div>
             </div>
         </div>
+        {% endif %}
+
     </div>
     <!-- RIGHT SIDE / USERS ACTIVITY -->
     <div class="w-[23%] bg-white flex-1 rounded-md shadow-md p-5">
@@ -273,40 +307,6 @@
                 </div>
             </div>
 
-            <!-- 4TH ROW -->
-            <div class="w-full flex flex-col py-3">
-                <div class="w-full flex flex-col justify-center items-start gap-2">
-                    <div class="w-full flex justify-between items-center gap-2">
-                        <div class="flex justify-start gap-2">
-                            <div class="w-[45px] h-[45px] rounded-full">
-                                <img src='{% static "images/avatar.svg" %}' alt="user profile"
-                                    class="w-full h-full object-cover">
-                            </div>
-                            <div class="flex flex-col">
-                                <h1 class="text-sm text-slate-700 font-semibold">Nataly</h1>
-                                <p class="text-sm text-gray-500">11:30 AM</p>
-                            </div>
-                        </div>
-                        <div class="cursor-pointer">
-                            <i class="fa fa-thumbs-up" style="color: rgb(184, 184, 184); font-size: 15px;"></i>
-                        </div>
-                    </div>
-
-                    <!-- Status -->
-                    <div class="w-full">
-                        <p class="text-sm text-gray-500">Closed - Create the Osina home page</p>
-                    </div>
-
-                    <!-- Add comment section -->
-                    <div class="w-full h-fit flex justify-between items-center border border-gray-200 mt-2 rounded-md">
-                        <input type="text" placeholder="Add Comment..."
-                            class="outline-none text-gray-500 p-2 w-[100%] text-sm h-[40px] rounded-tl-md rounded-bl-md">
-                        <button class="w-fit px-3 py-2 bg-slate-800 rounded-tr-md rounded-br-md">
-                            <i class="fa fa-send" style="color: white; font-size: 15px;"></i>
-                        </button>
-                    </div>
-                </div>
-            </div>
         </div>
     </div>
 </div>

osinaweb/templates/customers.html

@@ -107,92 +107,41 @@
 
                     <!-- TABLE BODY -->
                     <div class="w-full">
+                        {% for customer in customers %}
                         <!-- 1st row -->
                         <div class="w-full h-[60px] flex justify-between items-center border-b border-gray-300">
                             <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Nataly</p>
+                                <p class="text-gray-500">{{customer.first_name}}</p>
                             </div>
                             <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Abi Wajeh</p>
+                                <p class="text-gray-500">{{customer.last_name}}</p>
                             </div>
                             <div class="w-[15%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">nataly.aw</p>
+                                <p class="text-gray-500">{{customer.user.username}}</p>
                             </div>
+                            {% if customer.status == 'Active' %}
                             <div
                                 class="w-[15%] h-full border-r border-gray-300 flex justify-center items-center bg-green-700">
-                                <p class="text-white">Active</p>
-                            </div>
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Business</p>
-                            </div>
-                            <div class="w-[10%] h-full flex justify-center items-center gap-3">
-                                <a href="{% url 'customerdetails' %}">
-                                    <div class="text-[15px] text-blue-500 cursor-pointer">
-                                        <i class="fa fa-eye"></i>
-                                    </div>
-                                </a>
-                                <div class="text-[15px] text-blue-500 cursor-pointer">
-                                    <i class="fa fa-edit"></i>
-                                </div>
-                                <div class="text-[15px] text-red-500 cursor-pointer">
-                                    <i class="fa fa-trash"></i>
-                                </div>
-                            </div>
-                        </div>
-
-                        <!-- 2nd row -->
-                        <div class="w-full h-[60px] flex justify-between items-center border-b border-gray-300">
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Rachel</p>
-                            </div>
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Hanna</p>
-                            </div>
-                            <div class="w-[15%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">-</p>
+                                <p class="text-white">{{customer.status}}</p>
                             </div>
+                            {% endif %}
+                            {% if customer.status == 'Terminated' %}
                             <div
                                 class="w-[15%] h-full border-r border-gray-300 flex justify-center items-center bg-gray-500">
-                                <p class="text-white">Terminated</p>
-                            </div>
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">-</p>
-                            </div>
-                            <div class="w-[10%] h-full flex justify-center items-center gap-3">
-                                <a>
-                                    <div class="text-[15px] text-blue-500 cursor-pointer">
-                                        <i class="fa fa-eye"></i>
-                                    </div>
-                                </a>
-                                <div class="text-[15px] text-blue-500 cursor-pointer">
-                                    <i class="fa fa-edit"></i>
-                                </div>
-                                <div class="text-[15px] text-red-500 cursor-pointer">
-                                    <i class="fa fa-trash"></i>
-                                </div>
-                            </div>
-                        </div>
-
-                        <!-- 3rd row -->
-                        <div class="w-full h-[60px] flex justify-between items-center border-b border-gray-300">
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Aya</p>
-                            </div>
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Rifai</p>
-                            </div>
-                            <div class="w-[15%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">aya.rf</p>
+                                <p class="text-white">{{customer.status}}</p>
                             </div>
+                            {% endif %}
+                            {% if customer.status == 'Suspended' %}
                             <div
                                 class="w-[15%] h-full border-r border-gray-300 flex justify-center items-center bg-red-500">
-                                <p class="text-white">Suspended</p>
+                                <p class="text-white">{{customer.status}}</p>
                             </div>
+                            {% endif %}
                             <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">-</p>
+                                <p class="text-gray-500">{{customer.business}}</p>
                             </div>
                             <div class="w-[10%] h-full flex justify-center items-center gap-3">
-                                <a>
+                                <a href="{% url 'customerdetails' customer.customer_id  %}">
                                     <div class="text-[15px] text-blue-500 cursor-pointer">
                                         <i class="fa fa-eye"></i>
                                     </div>
@@ -205,138 +154,8 @@
                                 </div>
                             </div>
                         </div>
+                        {% endfor %}
 
-                        <!-- 4th row -->
-                        <div class="w-full h-[60px] flex justify-between items-center border-b border-gray-300">
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Emile</p>
-                            </div>
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Elliye</p>
-                            </div>
-                            <div class="w-[15%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">salim.e</p>
-                            </div>
-                            <div
-                                class="w-[15%] h-full border-r border-gray-300 flex justify-center items-center bg-green-700">
-                                <p class="text-white">Active</p>
-                            </div>
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Business</p>
-                            </div>
-                            <div class="w-[10%] h-full flex justify-center items-center gap-3">
-                                <a>
-                                    <div class="text-[15px] text-blue-500 cursor-pointer">
-                                        <i class="fa fa-eye"></i>
-                                    </div>
-                                </a>
-                                <div class="text-[15px] text-blue-500 cursor-pointer">
-                                    <i class="fa fa-edit"></i>
-                                </div>
-                                <div class="text-[15px] text-red-500 cursor-pointer">
-                                    <i class="fa fa-trash"></i>
-                                </div>
-                            </div>
-                        </div>
-
-                        <!-- 5th row -->
-                        <div class="w-full h-[60px] flex justify-between items-center border-b border-gray-300">
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Emilio</p>
-                            </div>
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Emilio</p>
-                            </div>
-                            <div class="w-[15%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">-</p>
-                            </div>
-                            <div
-                                class="w-[15%] h-full border-r border-gray-300 flex justify-center items-center bg-gray-500">
-                                <p class="text-white">Terminated</p>
-                            </div>
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Cars and Classics</p>
-                            </div>
-                            <div class="w-[10%] h-full flex justify-center items-center gap-3">
-                                <a>
-                                    <div class="text-[15px] text-blue-500 cursor-pointer">
-                                        <i class="fa fa-eye"></i>
-                                    </div>
-                                </a>
-                                <div class="text-[15px] text-blue-500 cursor-pointer">
-                                    <i class="fa fa-edit"></i>
-                                </div>
-                                <div class="text-[15px] text-red-500 cursor-pointer">
-                                    <i class="fa fa-trash"></i>
-                                </div>
-                            </div>
-                        </div>
-
-                        <!-- 6th row -->
-                        <div class="w-full h-[60px] flex justify-between items-center border-b border-gray-300">
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Arze</p>
-                            </div>
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Elliye</p>
-                            </div>
-                            <div class="w-[15%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Arze.e</p>
-                            </div>
-                            <div
-                                class="w-[15%] h-full border-r border-gray-300 flex justify-center items-center bg-green-700">
-                                <p class="text-white">Active</p>
-                            </div>
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">-</p>
-                            </div>
-                            <div class="w-[10%] h-full flex justify-center items-center gap-3">
-                                <a>
-                                    <div class="text-[15px] text-blue-500 cursor-pointer">
-                                        <i class="fa fa-eye"></i>
-                                    </div>
-                                </a>
-                                <div class="text-[15px] text-blue-500 cursor-pointer">
-                                    <i class="fa fa-edit"></i>
-                                </div>
-                                <div class="text-[15px] text-red-500 cursor-pointer">
-                                    <i class="fa fa-trash"></i>
-                                </div>
-                            </div>
-                        </div>
-
-                        <!-- 7th row -->
-                        <div class="w-full h-[60px] flex justify-between items-center border-b border-gray-300">
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Reine</p>
-                            </div>
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">Habshy</p>
-                            </div>
-                            <div class="w-[15%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">reine.h</p>
-                            </div>
-                            <div
-                                class="w-[15%] h-full border-r border-gray-300 flex justify-center items-center bg-red-500">
-                                <p class="text-white">Suspended</p>
-                            </div>
-                            <div class="w-[20%] h-full border-r border-gray-300 flex justify-center items-center">
-                                <p class="text-gray-500">-</p>
-                            </div>
-                            <div class="w-[10%] h-full flex justify-center items-center gap-3">
-                                <a>
-                                    <div class="text-[15px] text-blue-500 cursor-pointer">
-                                        <i class="fa fa-eye"></i>
-                                    </div>
-                                </a>
-                                <div class="text-[15px] text-blue-500 cursor-pointer">
-                                    <i class="fa fa-edit"></i>
-                                </div>
-                                <div class="text-[15px] text-red-500 cursor-pointer">
-                                    <i class="fa fa-trash"></i>
-                                </div>
-                            </div>
-                        </div>
                     </div>
                 </div>
             </div>
@@ -454,40 +273,7 @@
                 </div>
             </div>
 
-            <!-- 4TH ROW -->
-            <div class="w-full flex flex-col py-3">
-                <div class="w-full flex flex-col justify-center items-start gap-2">
-                    <div class="w-full flex justify-between items-center gap-2">
-                        <div class="flex justify-start gap-2">
-                            <div class="w-[45px] h-[45px] rounded-full">
-                                <img src='{% static "images/avatar.svg" %}' alt="user profile"
-                                    class="w-full h-full object-cover">
-                            </div>
-                            <div class="flex flex-col">
-                                <h1 class="text-sm text-slate-700 font-semibold">Nataly</h1>
-                                <p class="text-sm text-gray-500">11:30 AM</p>
-                            </div>
-                        </div>
-                        <div class="cursor-pointer">
-                            <i class="fa fa-thumbs-up" style="color: rgb(184, 184, 184); font-size: 15px;"></i>
-                        </div>
-                    </div>
-
-                    <!-- Status -->
-                    <div class="w-full">
-                        <p class="text-sm text-gray-500">Closed - Create the Osina home page</p>
-                    </div>
                
-                    <!-- Add comment section -->
-                    <div class="w-full h-fit flex justify-between items-center border border-gray-200 mt-2 rounded-md">
-                        <input type="text" placeholder="Add Comment..."
-                            class="outline-none text-gray-500 p-2 w-[100%] text-sm h-[40px] rounded-tl-md rounded-bl-md">
-                        <button class="w-fit px-3 py-2 bg-slate-800 rounded-tr-md rounded-br-md">
-                            <i class="fa fa-send" style="color: white; font-size: 15px;"></i>
-                        </button>
-                    </div>
-                </div>
-            </div>
         </div>
     </div>
 </div>

osinaweb/templates/project-details.html

@@ -370,6 +370,8 @@
                 <div class="w-full p-3 bg-white rounded-md shadow-lg">
                     <p class="text-gray-500 text-xl">Related Tasks:</p>
                     <!-- TASK 1 -->
+
+                    {% for task in tasks %}
                     <div class="w-full bg-white h-fit rounded-md border border-gray-300 mt-3">
                         <!-- TABLE HEADER -->
                         <div class="w-full flex h-[70px] rounded-t-md">
@@ -462,6 +464,7 @@
                             </div>
                         </div>
                     </div>
+                    {% endfor %}
 
                 </div>
             </div>