14# created job detail page

jobs/models.py

@@ -2,7 +2,7 @@ from django.db import models
 from django.template.defaultfilters import slugify
 
 from jobportal import settings
-
+from ckeditor.fields import RichTextField
 
 class Category(models.Model):
     title = models.CharField(max_length=100)
@@ -32,7 +32,7 @@ class Job(models.Model):
 
     job_type = models.CharField(max_length=20, blank=False, default=None, choices=CHOICES)
     location = models.CharField(max_length=200, blank=False, default=None)
-    description = models.TextField(blank=False, default=None)
+    description = RichTextField(blank=False, default=None)
     publishing_date = models.DateTimeField(auto_now_add=True)
     slug = models.SlugField(default=None, editable=False)
     employer = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE, default=None)

jobs/urls.py

@@ -5,4 +5,5 @@ app_name = "jobs"
 urlpatterns = [
     path('', HomeView.as_view(), name="home"),
     path('create-job/', CreateJobView.as_view(), name="create_job"),
+    path('detail/<slug>/<int:pk>/', SingleJobView.as_view(), name="single_job"),
 ]

jobs/views.py

@@ -2,7 +2,7 @@ from django.contrib.auth.decorators import login_required
 from django.contrib.messages.views import SuccessMessageMixin
 from django.utils.decorators import method_decorator
 
-from django.views.generic import TemplateView, ListView, CreateView
+from django.views.generic import TemplateView, ListView, CreateView, DetailView
 
 from jobs.forms import CreateJobForm
 from jobs.models import Job, Category
@@ -33,3 +33,14 @@ class CreateJobView(SuccessMessageMixin, CreateView):
         job.employer = self.request.user
         job.save()
         return super(CreateJobView, self).form_valid(form)
+
+
+class SingleJobView(DetailView):
+    template_name = 'jobs/single.html'
+    model = Job
+    context_object_name = 'job'
+
+    def get_context_data(self, **kwargs):
+        context = super(SingleJobView, self).get_context_data(**kwargs)
+        context['categories'] = Category.objects.all()
+        return context

templates/jobs/index.html

@@ -227,7 +227,7 @@
 						  </div>
 
 						  <div class="ml-auto d-flex">
-						  	<a href="job-single.html" class="btn btn-primary py-2 mr-1">Apply Job</a>
+						  	<a href="{% url 'jobs:single_job' job.slug job.pk %}" class="btn btn-primary py-2 mr-1">Apply Job</a>
                 <a href="#" class="btn btn-danger rounded-circle btn-favorite d-flex align-items-center">
                 	<span class="icon-heart"></span>
                 </a>

templates/jobs/single.html

@@ -0,0 +1,48 @@
+{% extends 'base.html' %}
+{% load static %}
+{% block content %}
+
+<div class="hero-wrap js-fullheight" style="background-image: url('{% static 'images/bg_2.jpg' %}');" data-stellar-background-ratio="0.5">      <div class="overlay"></div>
+      <div class="container">
+        <div class="row no-gutters slider-text js-fullheight align-items-end justify-content-start" data-scrollax-parent="true">
+          <div class="col-md-8 ftco-animate text-center text-md-left mb-5" data-scrollax=" properties: { translateY: '70%' }">
+          	<p class="breadcrumbs" data-scrollax="properties: { translateY: '30%', opacity: 1.6 }"><span class="mr-3"><a href="index.html">Home <i class="ion-ios-arrow-forward"></i></a></span> <span class="mr-3"><a href="blog.html">Blog <i class="ion-ios-arrow-forward"></i></a></span> <span>Single</span></p>
+            <h1 class="mb-3 bread" data-scrollax="properties: { translateY: '30%', opacity: 1.6 }">Job detail</h1>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <section class="ftco-section ftco-degree-bg">
+      <div class="container">
+        <div class="row">
+          <div class="col-md-8 ftco-animate">
+            <h2 class="mb-3">{{ job.title }}</h2>
+            <p>{{ job.description|safe }}</p>
+
+          </div> <!-- .col-md-8 -->
+          <div class="col-md-4 sidebar ftco-animate">
+            <div class="sidebar-box">
+              <form action="#" class="search-form">
+                <div class="form-group">
+                  <span class="icon icon-search"></span>
+                  <input type="text" class="form-control" placeholder="Type a keyword and hit enter">
+                </div>
+              </form>
+            </div>
+            <div class="sidebar-box ftco-animate">
+              <div class="categories">
+                <h3>Categories</h3>
+                  {% for category in categories %}
+                <li><a href="#">{{ category.title }} <span>{{ category.job_count }}</span></a></li>
+                  {% endfor %}
+              </div>
+            </div>
+
+          </div>
+
+        </div>
+      </div>
+    </section> <!-- .section -->
+
+{% endblock %}