New changes.

osinaweb/billing/add/urls.py

@@ -6,5 +6,4 @@ urlpatterns = [
     path('product', views.add_product, name='addproduct'),
     path('service', views.add_service, name='addservice'),
     path('order', views.add_order, name='addorder'),
-    path('invoice/<int:order_id>/', views.add_invoice_pdf, name='addinvoice'),
 ]

osinaweb/billing/add/views.py

@@ -5,7 +5,7 @@ from django.http import JsonResponse, HttpResponse
 from django.template.loader import get_template
 from django.conf import settings
 import os
-from weasyprint import HTML, CSS  
+
 
 
 def add_product (request, *args, **kwargs):
@@ -109,69 +109,6 @@ def add_order (request, *args, **kwargs):
 
 
 
-def add_invoice_pdf(request, order_id):
-
-    order = get_object_or_404(Order, id=order_id)
-
-    
-    current_year = str(timezone.now().year)[-2:]
-    last_invoice = Invoice.objects.filter(invoice_number__startswith=current_year).order_by('-invoice_number').first()
-    if last_invoice:
-        last_invoice_number = int(last_invoice.invoice_number.split('-')[1].split('+')[0])
-        new_invoice_number = f"${current_year}-{last_invoice_number + 1}"
-    else:
-        new_invoice_number = f"${current_year}-1425"
-
-
-    invoice = Invoice.objects.create(
-        invoice_number = new_invoice_number,
-        order=order,
-        date_created=datetime.now(),
-    )
-
-    template = get_template('details_templates/invoice-details.html')
-    context = {'order': order} 
-    html_string = template.render(context)
-
-    # Define the CSS string with Poppins font
-    css_string = '''
-        @font-face {
-            font-family: 'Poppins';
-            src: url('path_to_poppins_font_file.ttf') format('truetype');  /* Update the path to the font file */
-        }
-        
-        body {
-            font-family: 'Poppins', sans-serif;  /* Use Poppins font for the entire document */
-        }
-        
-        /* Your existing CSS styles */
-        /* Add or modify styles as needed */
-    '''
-
-    # Generate PDF
-    pdf = HTML(string=html_string).write_pdf(
-        stylesheets=[
-            CSS(string=css_string),
-            CSS(string='@page { margin: 30px; }')
-        ],
-        presentational_hints=True
-    )
-
-
-    # Save PDF to a file
-    pdf_file_path = os.path.join(settings.MEDIA_ROOT, f'invoice_{invoice.id}.pdf')
-    with open(pdf_file_path, 'wb') as pdf_file:
-        pdf_file.write(pdf)
-
-    # Associate PDF file path with the Invoice object
-    invoice.pdf = pdf_file_path
-    invoice.save()
-
-    # Return PDF
-    response = HttpResponse(pdf, content_type='application/pdf')
-    response['Content-Disposition'] = 'attachment; filename="my_pdf.pdf"'
-
-    return response
 
 
 

osinaweb/customercore/templates/listing_pages/products.html

@@ -12,6 +12,8 @@
             <p class="cursor-pointer" id="hostingSolutions">Cloud Hosting</p>
         </div>
 
+        
+        <!-- OSITCOM SOLUTIONS CONTAINER -->
         <div class="w-full flex flex-col gap-10 mt-10" id="solutionsContainer">
             <div class="w-full p-5 bg-gray-50 border-gray-100 shadow-md">
                 <div class="flex justify-between items-center">
@@ -27,7 +29,7 @@
 
                 <div class="w-full grid grid-cols-1 l:grid-cols-3 gap-5 mt-5">
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-t-md bg-white">
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
                         <p class="text-secondosiblue uppercase font-poppinsBold text-xl s:text-2xl text-center">Basic
                         </p>
 
@@ -38,7 +40,7 @@
                     </div>
 
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-b-md bg-white">
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
                         <p class="text-secondosiblue uppercase font-poppinsBold text-xl s:text-2xl text-center">Standard
                         </p>
 
@@ -49,7 +51,7 @@
                     </div>
 
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-t-md bg-white">
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
                         <p class="text-secondosiblue uppercase font-poppinsBold text-xl s:text-2xl text-center">Premium
                         </p>
 
@@ -61,7 +63,7 @@
                 </div>
             </div>
 
-            <!-- <div class="w-full p-5 bg-gray-50 border-gray-100 shadow-md">
+            <div class="w-full p-5 bg-gray-50 border-gray-100 shadow-md">
                 <div class="flex justify-between items-center">
                     <img src="{% static 'images/ositcom_logos/osicardblue.png' %}" class="w-[180px]">
 
@@ -71,62 +73,39 @@
                 </div>
 
 
-                <div class="w-full grid grid-cols-3 gap-5 mt-20">
+                <div class="w-full grid grid-cols-1 l:grid-cols-3 gap-5 mt-5">
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-t-md bg-white">
-                        <p class="text-secondosiblue uppercase font-poppinsBold text-3xl text-center">Basic</p>
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
+                        <p class="text-secondosiblue uppercase font-poppinsBold text-2xl text-center">Basic</p>
 
                         <div class="w-full flex flex-col justify-center items-center">
                             <p class="text-osiblue font-poppinsLight text-2xl font-semibold">$0</p>
                             <p class="text-gray-500">monthly/restaurant</p>
                         </div>
                     </div>
-
-                    <div class="relative">
-                        <div
-                            class="w-full px-5 py-3 text-white text-center font-semibold text-xl bg-osiblue rounded-t-md absolute top-[-50px]">
-                            <p>Best Value</p>
-                        </div>
-
-                        <div
-                            class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-b-md bg-white">
-                            <p class="text-secondosiblue uppercase font-poppinsBold text-3xl text-center">Standard</p>
-
-                            <div class="w-full flex flex-col justify-center items-center">
-                                <p class="text-osiblue font-poppinsLight text-2xl font-semibold">$89</p>
-                                <p class="text-gray-500">monthly/restaurant</p>
                 </div>
             </div>
         </div>
 
-                    <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-t-md bg-white">
-                        <p class="text-secondosiblue uppercase font-poppinsBold text-3xl text-center">Premium</p>
-
-                        <div class="w-full flex flex-col justify-center items-center">
-                            <p class="text-osiblue font-poppinsLight text-2xl font-semibold">$169</p>
-                            <p class="text-gray-500">monthly/restaurant</p>
-                        </div>
-                    </div>
-                </div>
-            </div> -->
-        </div>
-
 
+        <!-- HOSTING SOLUTIONS CONTAINER -->
         <div class="w-full flex flex-col gap-10 mt-10 hidden" id="hostingSolutionsContainer">
             <div class="w-full p-5 bg-gray-50 border-gray-100 shadow-md">
                 <div class="flex justify-between items-center">
                     <p class="font-poppinsExtraBold text-base s:text-2xl text-osiblue">Shared Hosting</p>
 
+                    <a href="{% url 'sharedhostingplans' %}">
                         <button
                         class="bg-osiblue border border-osiblue text-white px-5 py-2 rounded-md cursor-pointer hover:bg-white hover:text-osiblue duration-300">More
                         Details</button>
+                    </a>
+
                 </div>
 
 
                 <div class="w-full grid grid-cols-1 l:grid-cols-3 gap-5 mt-5">
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-t-md bg-white">
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
                         <p class="text-secondosiblue uppercase font-poppinsBold text-xl xll:text-2xl text-center">Shared
                             Basic</p>
 
@@ -138,7 +117,7 @@
                     </div>
 
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-b-md bg-white">
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
                         <p class="text-secondosiblue uppercase font-poppinsBold text-xl xll:text-2xl text-center">Shared
                             Plus
                         </p>
@@ -151,7 +130,7 @@
                     </div>
 
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-t-md bg-white">
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
                         <p class="text-secondosiblue uppercase font-poppinsBold text-xl xll:text-2xl text-center">Shared
                             Power</p>
 
@@ -169,15 +148,18 @@
                 <div class="flex justify-between items-center">
                     <p class="font-poppinsExtraBold text-base s:text-2xl text-osiblue">Cloud VPS Hosting</p>
 
+                    <a href="{% url 'cloudvpshostingplans' %}">
                         <button
                         class="bg-osiblue border border-osiblue text-white px-5 py-2 rounded-md cursor-pointer hover:bg-white hover:text-osiblue duration-300">More
                         Details</button>
+                    </a>
+
                 </div>
 
 
                 <div class="w-full grid grid-cols-1 l:grid-cols-2 xxlg:grid-cols-4 gap-5 mt-5">
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-t-md bg-white">
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
                         <p class="text-secondosiblue uppercase font-poppinsBold text-xl xll:text-2xl text-center">
                             OSICLOUD 1</p>
 
@@ -189,7 +171,7 @@
                     </div>
 
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-b-md bg-white">
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
                         <p class="text-secondosiblue uppercase font-poppinsBold text-xl xll:text-2xl text-center">
                             OSICLOUD 2</p>
 
@@ -202,7 +184,7 @@
                     </div>
 
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-t-md bg-white">
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
                         <p class="text-secondosiblue uppercase font-poppinsBold text-xl xll:text-2xl text-center">
                             OSICLOUD 3</p>
 
@@ -214,7 +196,7 @@
                     </div>
 
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-t-md bg-white">
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
                         <p class="text-secondosiblue uppercase font-poppinsBold text-xl xll:text-2xl text-center">
                             OSICLOUD 4</p>
 
@@ -233,15 +215,17 @@
                 <div class="flex justify-between items-center">
                     <p class="font-poppinsExtraBold text-base s:text-2xl text-osiblue">Dedicated CPU Servers</p>
 
+                    <a href="{% url 'dedicatedserversplans' %}">
                         <button
                         class="bg-osiblue border border-osiblue text-white px-5 py-2 rounded-md cursor-pointer hover:bg-white hover:text-osiblue duration-300">More
                         Details</button>
+                    </a>
                 </div>
 
 
                 <div class="w-full grid grid-cols-1 l:grid-cols-2 xxlg:grid-cols-4 gap-5 mt-5">
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-t-md bg-white">
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
                         <p class="text-secondosiblue uppercase font-poppinsBold text-xl xll:text-2xl text-center">
                             DEDICATED 1</p>
 
@@ -254,7 +238,7 @@
                     </div>
 
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-b-md bg-white">
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
                         <p class="text-secondosiblue uppercase font-poppinsBold text-xl xll:text-2xl text-center">
                             DEDICATED 2
                         </p>
@@ -268,7 +252,7 @@
                     </div>
 
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-t-md bg-white">
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
                         <p class="text-secondosiblue uppercase font-poppinsBold text-xl xll:text-2xl text-center">
                             DEDICATED 3</p>
 
@@ -281,7 +265,7 @@
                     </div>
 
                     <div
-                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-t-md bg-white">
+                        class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-md bg-white">
                         <p class="text-secondosiblue uppercase font-poppinsBold text-xl xll:text-2xl text-center">
                             DEDICATED 4</p>
 

osinaweb/customercore/templates/products/osicard-plans.html

@@ -0,0 +1,142 @@
+{% extends "customer_main.html" %}
+{%load static%}
+
+{% block modules_section %}
+<!-- This block is intentionally left empty to exclude the modules section -->
+{% endblock modules_section %}
+
+{% block content %}
+
+
+<div class="w-full px-5 s:px-9 flex flex-col gap-5 mt-5 mb-5">
+    <div class="w-full h-fit bg-white rounded-md shadow-md px-5 py-9 flex flex-col justify-center items-center">
+        <img src="{% static 'images/ositcom_logos/osicardblue.png' %}" class="w-[180px] s:w-[250px]">
+
+        <!-- PRICING ON DESKTOP -->
+        <div class="w-full hidden l:grid grid-cols-3 mt-24">
+            <div class="w-full h-full border border-gray-200 p-9 flex flex-col gap-5 items-center">
+                <p class="text-secondosiblue uppercase font-poppinsBold text-2xl text-center">Basic</p>
+
+                <div class="w-full flex flex-col justify-center items-center">
+                    <p class="text-osiblue font-poppinsLight text-2xl font-semibold">$0</p>
+                    <p class="text-gray-500">monthly/restaurant</p>
+                </div>
+
+                <a href="">
+                    <button
+                        class="w-fit px-9 py-2 bg-secondosiblue border border-secondosiblue text-white uppercase hover:bg-white hover:text-secondosiblue duration-300">Get
+                        Started
+                    </button>
+                </a>
+
+                <div class="w-full flex flex-col gap-3 mt-5">
+                    <h1 class="text-gray-500 text-[17px] font-light">Features:</h1>
+
+                    <div class="w-full flex flex-col">
+                        <div class="flex justify-start items-center gap-2 py-1">
+                            <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                            <p class="font-semibold text-secondosiblue">Online Ordering (75 Orders)</p>
+                        </div>
+                        <div class="flex justify-start items-center gap-2 py-1">
+                            <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                            <p class="font-light text-secondosiblue">Restaurant Website</p>
+                        </div>
+                        <div class="flex justify-start items-center gap-2 py-1">
+                            <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                            <p class="font-light text-secondosiblue">Branded Mobile App</p>
+                        </div>
+                        <div class="flex justify-start items-center gap-2 py-1">
+                            <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                            <p class="font-light text-secondosiblue">QR Code Menu</p>
+                        </div>
+                        <div class="flex justify-start items-center gap-2 py-1">
+                            <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                            <p class="font-light text-secondosiblue">Loyalty Program</p>
+                        </div>
+                        <div class="flex justify-start items-center gap-2 py-1">
+                            <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                            <p class="font-light text-secondosiblue">50+ Free Website Templates</p>
+                        </div>
+                        <div class="flex justify-start items-center gap-2 py-1">
+                            <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                            <p class="font-light text-secondosiblue">Multi Location</p>
+                        </div>
+                        <div class="flex justify-start items-center gap-2 py-1">
+                            <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                            <p class="font-light text-secondosiblue">Online Payments</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+
+        <!-- PRICING ON MOBILE -->
+        <div class="w-full flex l:hidden flex-col gap-10 mt-10">
+            <div>
+                <div class="w-full p-9 border border-gray-200 flex flex-col items-center gap-5 rounded-t-md">
+                    <p class="text-secondosiblue uppercase font-poppinsBold text-xl text-center">Basic</p>
+
+                    <div class="w-full flex flex-col justify-center items-center">
+                        <p class="text-osiblue font-poppinsLight text-xl font-semibold">$0</p>
+                        <p class="text-gray-500">monthly/restaurant</p>
+                    </div>
+
+                    <a href="">
+                        <button
+                            class="w-fit px-9 py-2 bg-secondosiblue border border-secondosiblue text-white uppercase hover:bg-white hover:text-secondosiblue duration-300">Get
+                            Started
+                        </button>
+                    </a>
+                </div>
+
+                <div
+                    class="w-full bg-secondosiblue text-white py-3 px-5 text-center flex justify-center items-center gap-2 border border-secondosiblue hover:bg-white hover:text-secondosiblue duration-300 openFeaturesDropdown">
+                    <p>View Features</p>
+                    <i class="fas fa-angle-down"></i>
+                </div>
+
+                <div class="w-full flex flex-col p-5 border border-gray-200 featuresContainer hidden">
+                    <div class="flex justify-start items-center gap-2 py-1">
+                        <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                        <p class="font-semibold text-secondosiblue">Online Ordering (75 Orders)</p>
+                    </div>
+                    <div class="flex justify-start items-center gap-2 py-1">
+                        <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                        <p class="font-light text-secondosiblue">Restaurant Website</p>
+                    </div>
+                    <div class="flex justify-start items-center gap-2 py-1">
+                        <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                        <p class="font-light text-secondosiblue">Branded Mobile App</p>
+                    </div>
+                    <div class="flex justify-start items-center gap-2 py-1">
+                        <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                        <p class="font-light text-secondosiblue">QR Code Menu</p>
+                    </div>
+                    <div class="flex justify-start items-center gap-2 py-1">
+                        <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                        <p class="font-light text-secondosiblue">Loyalty Program</p>
+                    </div>
+                    <div class="flex justify-start items-center gap-2 py-1">
+                        <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                        <p class="font-light text-secondosiblue">50+ Free Website Templates</p>
+                    </div>
+                    <div class="flex justify-start items-center gap-2 py-1">
+                        <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                        <p class="font-light text-secondosiblue">Multi Location</p>
+                    </div>
+                    <div class="flex justify-start items-center gap-2 py-1">
+                        <img src="{% static 'images/icons/greencheckmark.png' %}" class="w-[20px]">
+                        <p class="font-light text-secondosiblue">Online Payments</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+
+<!---------------------- JS SCRIPTS -------------------->
+<script type="text/javascript" src='{% static "js/customer_dashboard/pricing-dropdown.js" %}'></script>
+
+{% endblock %}

osinaweb/customercore/urls.py

@@ -11,6 +11,7 @@ urlpatterns = [
 
     # PRODUCTS URL
     path("osimenu-plans/", views.osimenu_plans, name="osimenuplans"),
+    path("osicard-plans/", views.osicard_plans, name="osicardplans"),
     path("shared-hosting-plans/", views.shared_hosting_plans, name="sharedhostingplans"),
     path("cloud-vps-hosting-plans/", views.cloud_vps_hosting_plans, name="cloudvpshostingplans"),
     path("dedicated-servers-plans/", views.dedicated_servers_plans, name="dedicatedserversplans"),

osinaweb/customercore/views.py

@@ -61,6 +61,16 @@ def osimenu_plans(request, *args, **kwargs):
     return render(request, 'products/osimenu-plans.html', context)
 
 
+@customer_login_required
+def osicard_plans(request, *args, **kwargs):
+    
+    context = {
+        
+    }
+
+    return render(request, 'products/osicard-plans.html', context)
+
+
 
 @customer_login_required
 def shared_hosting_plans(request, *args, **kwargs):