parent
6b9504eedb
commit
3ae01ed458
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -0,0 +1,18 @@ |
|||||||
|
# Generated by Django 5.1.4 on 2025-01-12 03:35 |
||||||
|
|
||||||
|
from django.db import migrations, models |
||||||
|
|
||||||
|
|
||||||
|
class Migration(migrations.Migration): |
||||||
|
|
||||||
|
dependencies = [ |
||||||
|
('main', '0005_user_login_profile_alter_servicerequest_service_and_more'), |
||||||
|
] |
||||||
|
|
||||||
|
operations = [ |
||||||
|
migrations.AddField( |
||||||
|
model_name='servicerequest', |
||||||
|
name='phone_number', |
||||||
|
field=models.CharField(blank=True, max_length=15, null=True), |
||||||
|
), |
||||||
|
] |
@ -0,0 +1,22 @@ |
|||||||
|
# Generated by Django 5.1.4 on 2025-01-12 03:41 |
||||||
|
|
||||||
|
from django.db import migrations, models |
||||||
|
|
||||||
|
|
||||||
|
class Migration(migrations.Migration): |
||||||
|
|
||||||
|
dependencies = [ |
||||||
|
('main', '0006_servicerequest_phone_number'), |
||||||
|
] |
||||||
|
|
||||||
|
operations = [ |
||||||
|
migrations.RemoveField( |
||||||
|
model_name='servicerequest', |
||||||
|
name='phone_number', |
||||||
|
), |
||||||
|
migrations.AddField( |
||||||
|
model_name='user', |
||||||
|
name='phone_number', |
||||||
|
field=models.CharField(blank=True, max_length=15, null=True), |
||||||
|
), |
||||||
|
] |
@ -0,0 +1,18 @@ |
|||||||
|
# Generated by Django 5.1.4 on 2025-01-12 10:38 |
||||||
|
|
||||||
|
from django.db import migrations, models |
||||||
|
|
||||||
|
|
||||||
|
class Migration(migrations.Migration): |
||||||
|
|
||||||
|
dependencies = [ |
||||||
|
('main', '0007_remove_servicerequest_phone_number_user_phone_number'), |
||||||
|
] |
||||||
|
|
||||||
|
operations = [ |
||||||
|
migrations.AlterField( |
||||||
|
model_name='servicerequest', |
||||||
|
name='is_approved', |
||||||
|
field=models.BooleanField(blank=True, null=True), |
||||||
|
), |
||||||
|
] |
@ -0,0 +1,18 @@ |
|||||||
|
# Generated by Django 5.1.4 on 2025-01-12 10:38 |
||||||
|
|
||||||
|
from django.db import migrations, models |
||||||
|
|
||||||
|
|
||||||
|
class Migration(migrations.Migration): |
||||||
|
|
||||||
|
dependencies = [ |
||||||
|
('main', '0008_alter_servicerequest_is_approved'), |
||||||
|
] |
||||||
|
|
||||||
|
operations = [ |
||||||
|
migrations.AlterField( |
||||||
|
model_name='servicerequest', |
||||||
|
name='is_approved', |
||||||
|
field=models.BooleanField(blank=True, default=False, null=True), |
||||||
|
), |
||||||
|
] |
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -0,0 +1,126 @@ |
|||||||
|
{% extends 'base.html' %} |
||||||
|
{% load static %} |
||||||
|
|
||||||
|
{% block content %} |
||||||
|
<style> |
||||||
|
body { |
||||||
|
background-color: #f8f9fa; |
||||||
|
} |
||||||
|
.profile-header { |
||||||
|
background-color: #007bff; |
||||||
|
color: white; |
||||||
|
padding: 20px; |
||||||
|
border-radius: 10px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: space-between; |
||||||
|
margin-bottom: 20px; |
||||||
|
} |
||||||
|
.profile-header .left { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
.profile-header img { |
||||||
|
border-radius: 50%; |
||||||
|
width: 100px; |
||||||
|
height: 100px; |
||||||
|
margin-right: 20px; |
||||||
|
} |
||||||
|
.profile-details { |
||||||
|
margin-bottom: 20px; |
||||||
|
} |
||||||
|
.card { |
||||||
|
border: none; |
||||||
|
border-radius: 10px; |
||||||
|
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); |
||||||
|
} |
||||||
|
.status-badge { |
||||||
|
padding: 5px 10px; |
||||||
|
border-radius: 5px; |
||||||
|
color: white; |
||||||
|
} |
||||||
|
.status-active { |
||||||
|
background-color: #28a745; |
||||||
|
} |
||||||
|
.status-complete { |
||||||
|
background-color: #17a2b8; |
||||||
|
} |
||||||
|
</style> |
||||||
|
|
||||||
|
<div class="container mt-4"> |
||||||
|
<!-- Profile Header --> |
||||||
|
<div class="profile-header"> |
||||||
|
<div class="left"> |
||||||
|
{% if user.profile and user.profile.url %} |
||||||
|
<img src="{{ user.profile.url }}" alt="Profile Picture"> |
||||||
|
{% else %} |
||||||
|
<img src="{% static 'img/dummypic.png' %}" alt="Profile Picture"> |
||||||
|
{% endif %} |
||||||
|
|
||||||
|
<div> |
||||||
|
<h2>{{ user.first_name|capfirst }} {{ user.last_name|capfirst }}</h2> |
||||||
|
<p>Customer ID: {{ user.id }}</p> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div> |
||||||
|
<p>Member Since: {{ user.member_since|date:"b - Y" }}</p> |
||||||
|
<p>Status: Active</p> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<!-- Profile Details --> |
||||||
|
<div class="profile-details"> |
||||||
|
<div class="row"> |
||||||
|
<div class="col-md-12"> |
||||||
|
<div class="card p-6"> |
||||||
|
<h5>Contact Information</h5> |
||||||
|
<p>Email: {{ user.email }}</p> |
||||||
|
<p>Phone: (+977) {{ user.phone_number }}</p> |
||||||
|
<p>Address: {{ user.address }}</p> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
{% if request.user == user %} |
||||||
|
<!-- Pending/Active Requests --> |
||||||
|
<div class="recent-activities"> |
||||||
|
<h4 class="mb-3">Pending/Active Requests</h4> |
||||||
|
<div class="card p-3"> |
||||||
|
<ul class="list-group list-group-flush"> |
||||||
|
{% for req in pending_requests %} |
||||||
|
<li class="list-group-item d-flex justify-content-between align-items-center"> |
||||||
|
{{ req.service_offered }} request from {{ req.client.first_name|capfirst }} {{ req.client.last_name|capfirst }} |
||||||
|
<a class="status-badge status-active">Accept</a> |
||||||
|
</li> |
||||||
|
{% empty %} |
||||||
|
<li class="list-group-item d-flex justify-content-between align-items-center"> |
||||||
|
Hurray! There are no Pending Requests till now. |
||||||
|
</li> |
||||||
|
{% endfor %} |
||||||
|
</ul> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<!-- Completed Services --> |
||||||
|
<div class="recent-activities mt-4"> |
||||||
|
<h4 class="my-3">Completed/Active Requests</h4> |
||||||
|
<div class="card p-3"> |
||||||
|
<ul class="list-group list-group-flush"> |
||||||
|
{% for service in current %} |
||||||
|
<li class="list-group-item d-flex justify-content-between align-items-center"> |
||||||
|
{{ service.service_offered }} request from {{ service.client.first_name|capfirst }} {{ service.client.last_name|capfirst }} |
||||||
|
<a class="status-badge status-complete">Complete</a> |
||||||
|
</li> |
||||||
|
{% empty %} |
||||||
|
<li class="list-group-item d-flex justify-content-between align-items-center"> |
||||||
|
There are no active tasks right now. |
||||||
|
</li> |
||||||
|
{% endfor %} |
||||||
|
</ul> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
{% endif %} |
||||||
|
</div> |
||||||
|
{% endblock %} |
||||||
|
|
@ -0,0 +1,164 @@ |
|||||||
|
{% extends 'base.html' %} |
||||||
|
|
||||||
|
{% block content %} |
||||||
|
<style> |
||||||
|
/* General Styles */ |
||||||
|
body { |
||||||
|
margin: 0; |
||||||
|
font-family: Arial, sans-serif; |
||||||
|
} |
||||||
|
|
||||||
|
h1, h2 { |
||||||
|
text-align: center; |
||||||
|
color: #333; |
||||||
|
} |
||||||
|
|
||||||
|
.section { |
||||||
|
padding: 50px 20px; |
||||||
|
background-color: #fdf6e3; /* Beige background */ |
||||||
|
margin: 20px auto; |
||||||
|
width: 80%; |
||||||
|
border-radius: 8px; |
||||||
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); |
||||||
|
opacity: 0; |
||||||
|
transform: translateX(-100px); |
||||||
|
transition: all 0.8s ease-in-out; |
||||||
|
} |
||||||
|
|
||||||
|
.section.visible { |
||||||
|
opacity: 1; |
||||||
|
transform: translateX(0); |
||||||
|
} |
||||||
|
|
||||||
|
.service { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
margin-top: 20px; |
||||||
|
} |
||||||
|
|
||||||
|
.service img { |
||||||
|
width: 100px; |
||||||
|
height: 100px; |
||||||
|
border-radius: 8px; |
||||||
|
margin-right: 20px; |
||||||
|
} |
||||||
|
|
||||||
|
.service p { |
||||||
|
font-size: 16px; |
||||||
|
line-height: 1.6; |
||||||
|
} |
||||||
|
|
||||||
|
.services-grid { |
||||||
|
display: grid; |
||||||
|
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); |
||||||
|
gap: 20px; |
||||||
|
margin-top: 40px; |
||||||
|
} |
||||||
|
|
||||||
|
.grid-item { |
||||||
|
background-color: #ffffff; |
||||||
|
padding: 20px; |
||||||
|
border-radius: 8px; |
||||||
|
text-align: center; |
||||||
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); |
||||||
|
opacity: 0; |
||||||
|
transform: translateY(100px); |
||||||
|
transition: all 0.8s ease-in-out; |
||||||
|
} |
||||||
|
|
||||||
|
.grid-item.visible { |
||||||
|
opacity: 1; |
||||||
|
transform: translateY(0); |
||||||
|
} |
||||||
|
|
||||||
|
.grid-item img { |
||||||
|
width: 80px; |
||||||
|
height: 80px; |
||||||
|
margin-bottom: 10px; |
||||||
|
} |
||||||
|
|
||||||
|
.grid-item h3 { |
||||||
|
margin: 10px 0; |
||||||
|
font-size: 18px; |
||||||
|
} |
||||||
|
|
||||||
|
.grid-item p { |
||||||
|
font-size: 14px; |
||||||
|
color: #555; |
||||||
|
} |
||||||
|
</style> |
||||||
|
</head> |
||||||
|
<body> |
||||||
|
<h1>Services</h1> |
||||||
|
|
||||||
|
<section class="section" id="service-1"> |
||||||
|
<h2>Our Services</h2> |
||||||
|
<div class="service"> |
||||||
|
<img src="https://via.placeholder.com/100" alt="Service Image"> |
||||||
|
<p>I am a tech-savvy individual with a Bachelor's degree in Software Development, seeking employment as a mobile game developer. I am passionate about consistently advancing my knowledge and skills. I have attended multiple seminars and boot camps on coding and game development.</p> |
||||||
|
</div> |
||||||
|
</section> |
||||||
|
|
||||||
|
<section class="section" id="service-2"> |
||||||
|
<h2>What We Offer</h2> |
||||||
|
<div class="service"> |
||||||
|
<img src="https://via.placeholder.com/100" alt="Service Image"> |
||||||
|
<p>I am a tech-savvy individual with a Bachelor's degree in Software Development, seeking employment as a mobile game developer. I am passionate about consistently advancing my knowledge and skills. I have attended multiple seminars and boot camps on coding and game development.</p> |
||||||
|
</div> |
||||||
|
</section> |
||||||
|
|
||||||
|
<section class="section" id="services-grid"> |
||||||
|
<h2>Our Web App Provides</h2> |
||||||
|
<div class="services-grid"> |
||||||
|
<div class="grid-item"> |
||||||
|
<img src="https://via.placeholder.com/80" alt="Feature 1"> |
||||||
|
<h3>Feature 1</h3> |
||||||
|
<p>Detail about the first feature of the web app.</p> |
||||||
|
</div> |
||||||
|
<div class="grid-item"> |
||||||
|
<img src="https://via.placeholder.com/80" alt="Feature 2"> |
||||||
|
<h3>Feature 2</h3> |
||||||
|
<p>Detail about the second feature of the web app.</p> |
||||||
|
</div> |
||||||
|
<div class="grid-item"> |
||||||
|
<img src="https://via.placeholder.com/80" alt="Feature 3"> |
||||||
|
<h3>Feature 3</h3> |
||||||
|
<p>Detail about the third feature of the web app.</p> |
||||||
|
</div> |
||||||
|
<div class="grid-item"> |
||||||
|
<img src="https://via.placeholder.com/80" alt="Feature 4"> |
||||||
|
<h3>Feature 4</h3> |
||||||
|
<p>Detail about the fourth feature of the web app.</p> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</section> |
||||||
|
|
||||||
|
<script> |
||||||
|
// Function to check if element is in viewport |
||||||
|
function isInViewport(element) { |
||||||
|
const rect = element.getBoundingClientRect(); |
||||||
|
return ( |
||||||
|
rect.top >= 0 && |
||||||
|
rect.left >= 0 && |
||||||
|
rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && |
||||||
|
rect.right <= (window.innerWidth || document.documentElement.clientWidth) |
||||||
|
); |
||||||
|
} |
||||||
|
|
||||||
|
// Function to add "visible" class to sections |
||||||
|
function handleScroll() { |
||||||
|
const sections = document.querySelectorAll('.section, .grid-item'); |
||||||
|
sections.forEach(section => { |
||||||
|
if (isInViewport(section)) { |
||||||
|
section.classList.add('visible'); |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
// Listen for scroll event |
||||||
|
window.addEventListener('scroll', handleScroll); |
||||||
|
|
||||||
|
// Trigger scroll event on load to show elements already in view |
||||||
|
window.addEventListener('load', handleScroll); |
||||||
|
</script> |
||||||
|
{% endblock %} |
@ -0,0 +1,144 @@ |
|||||||
|
body { |
||||||
|
background-color:#ffffff; |
||||||
|
} |
||||||
|
.navbar .navbar-brand { |
||||||
|
margin-right: auto; |
||||||
|
} |
||||||
|
.navbar .nav { |
||||||
|
margin: 0 auto; |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
.navbar .login { |
||||||
|
margin-left: auto; |
||||||
|
} |
||||||
|
.search-bar { |
||||||
|
margin-top: 20px; |
||||||
|
display: flex; |
||||||
|
justify-content: center; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
.search-bar input { |
||||||
|
width: 50%; |
||||||
|
border-radius: 50px; |
||||||
|
} |
||||||
|
.profile-card { |
||||||
|
border: 1px solid #ddd; |
||||||
|
border-radius: 10px; |
||||||
|
overflow: hidden; |
||||||
|
transition: transform 0.3s ease, box-shadow 0.3s ease; |
||||||
|
} |
||||||
|
.profile-card:hover { |
||||||
|
transform: translateY(-10px); |
||||||
|
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); |
||||||
|
} |
||||||
|
.profile-card img { |
||||||
|
width: 100%; |
||||||
|
height: 200px; |
||||||
|
object-fit: cover; |
||||||
|
object-position: 10%; |
||||||
|
} |
||||||
|
.profile-card .card-body { |
||||||
|
padding: 15px; |
||||||
|
} |
||||||
|
.profile-card .card-title { |
||||||
|
font-size: 1.25rem; |
||||||
|
font-weight: bold; |
||||||
|
margin-bottom: 10px; |
||||||
|
} |
||||||
|
.profile-card .card-text { |
||||||
|
font-size: 0.9rem; |
||||||
|
color: #555; |
||||||
|
} |
||||||
|
.profile-card .price { |
||||||
|
font-size: 1.1rem; |
||||||
|
font-weight: bold; |
||||||
|
color: #007bff; |
||||||
|
} |
||||||
|
.profile-card .availability { |
||||||
|
font-size: 0.9rem; |
||||||
|
color: #28a745; |
||||||
|
} |
||||||
|
|
||||||
|
.category-bar { |
||||||
|
background-color: #f8f9fa; /* Light background */ |
||||||
|
padding: 20px; |
||||||
|
border-radius: 10px; |
||||||
|
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); /* Subtle shadow */ |
||||||
|
} |
||||||
|
|
||||||
|
.category-bar h4 { |
||||||
|
font-size: 1.25rem; |
||||||
|
font-weight: bold; |
||||||
|
margin-bottom: 15px; |
||||||
|
color: #333; |
||||||
|
} |
||||||
|
|
||||||
|
.category-bar ul { |
||||||
|
padding-left: 0; |
||||||
|
} |
||||||
|
|
||||||
|
.category-bar .category-link { |
||||||
|
display: block; |
||||||
|
padding: 10px 15px; |
||||||
|
margin: 5px 0; |
||||||
|
color: #555; |
||||||
|
text-decoration: none; |
||||||
|
border-radius: 5px; |
||||||
|
transition: background-color 0.3s ease, color 0.3s ease; |
||||||
|
} |
||||||
|
|
||||||
|
.category-bar .category-link:hover { |
||||||
|
background-color: #007bff; /* Highlight on hover */ |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
|
||||||
|
/* odd */ |
||||||
|
.form-container { |
||||||
|
font-family: Arial, sans-serif; |
||||||
|
margin: auto; |
||||||
|
padding: 30px; |
||||||
|
background: rgba(255, 255, 255, 0.9); |
||||||
|
border-radius: 8px; |
||||||
|
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); |
||||||
|
width: 600px; |
||||||
|
} |
||||||
|
.form-container h2 { |
||||||
|
margin-bottom: 20px; |
||||||
|
} |
||||||
|
.form-group { |
||||||
|
margin-bottom: 15px; |
||||||
|
} |
||||||
|
.form-group label { |
||||||
|
display: block; |
||||||
|
margin-bottom: 5px; |
||||||
|
} |
||||||
|
.form-group input, |
||||||
|
.form-group textarea, |
||||||
|
.form-group select { |
||||||
|
width: 100%; |
||||||
|
padding: 10px; |
||||||
|
border: 1px solid #ccc; |
||||||
|
border-radius: 5px; |
||||||
|
} |
||||||
|
.form-group input[type="file"] { |
||||||
|
padding: 5px; |
||||||
|
} |
||||||
|
.form-group button { |
||||||
|
width: 100%; |
||||||
|
padding: 10px; |
||||||
|
background-color: #007BFF; |
||||||
|
color: #fff; |
||||||
|
border: none; |
||||||
|
border-radius: 5px; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
.form-group button:hover { |
||||||
|
background-color: #0056b3; |
||||||
|
} |
||||||
|
.form-wrapper { |
||||||
|
display: flex; |
||||||
|
justify-content: center; |
||||||
|
align-items: center; |
||||||
|
min-height: 100vh; |
||||||
|
background: url('img/backgroung-form.jpg') no-repeat center center/cover; |
||||||
|
} |
After Width: | Height: | Size: 266 KiB |
After Width: | Height: | Size: 109 KiB |
After Width: | Height: | Size: 21 KiB |
After Width: | Height: | Size: 492 KiB |
Loading…
Reference in new issue