Campaign Detail

In this video, we are going to create CampaignDetail view. Through this view, we will show all the necessary information of that campaign in detailed form.

Resources

• campaign-detail.html

Views

In the views.py, create a view named "CampaignDetailView".

# This view will inherit the LoginRequiredMixin because we want only authenticated users to access this view
# Then we will inheirt the detailview. Bacause we are going to render a single object information through this view.
class CampaignDetailView(LoginRequiredMixin, generic.DetailView):
    # Now, you have to specify the model for which you are creating this detailview.
    model = Campaign
    # Then, specify the template name for this view.
    template_name = "campaign/campaign-detail.html"

Templates

Now create a campaign-detail.html file in the campaign folder of templates.

I have attached campaign-detail.html file in the resources section. Please download it, copy its content and paste it in this file.

{% extends 'mysite/base.html' %}

{% block title %} 
    <title>Campaign Details</title>
{% endblock title %}

{% block content %}
<div class="card mb-3">
  <div class="card-body">
    <h5 class="card-title mb-4"><i class="fas fa-calendar"></i> Campaign Details</h5>
    <div class="container">

      <div class="row mb-1">
        <div class="col-5 col-sm-4 col-md-3 col-lg-2 fw-bold">
          Center Name
        </div>
        <div class="col-7 col-sm-8 col-md-9 col-lg-10">
          {{ object.center.name }}
        </div>
      </div>

      <div class="row mb-1">
        <div class="col-5 col-sm-4 col-md-3 col-lg-2 fw-bold">
          Vaccine Name
        </div>
        <div class="col-7 col-sm-8 col-md-9 col-lg-10">
          {{ object.vaccine.name }}
        </div>
      </div>

      <div class="row mb-1">
        <div class="col-5 col-sm-4 col-md-3 col-lg-2 fw-bold">
         Start Date
        </div>
        <div class="col-7 col-sm-8 col-md-9 col-lg-10">
          {{ object.start_date }}
        </div>
      </div>

      <div class="row mb-1">
        <div class="col-5 col-sm-4 col-md-3 col-lg-2 fw-bold">
         End Date
        </div>
        <div class="col-7 col-sm-8 col-md-9 col-lg-10">
          {{ object.end_date }}
        </div>
      </div>

      <div class="row mb-1">
        <div class="col-5 col-sm-4 col-md-3 col-lg-2 fw-bold">
         Registrations
        </div>
        <div class="col-7 col-sm-8 col-md-9 col-lg-10">
          0
        </div>
      </div>

      <div class="row mb-1">
        <div class="col-5 col-sm-4 col-md-3 col-lg-2 fw-bold">
         Agents Assigned
        </div>
        <div class="col-7 col-sm-8 col-md-9 col-lg-10">
          {% for agent in object.agents.all %}
          {{agent.get_full_name }},
          {% endfor %}
        </div>
      </div>

      <div class="row mb-1 btn-container">
        <div class="col-12">
          <button class="btn btn-sm btn-dark m-1">
            <a href="#"><i class="fas fa-eye"></i> View Registrations</a>
          </button>

          <button class="btn btn-sm btn-primary m-1">
            <a href="#"><i class="fas fa-eye"></i> View Slots</a>
          </button>

          <button class="btn btn-sm btn-success m-1">
            <a href="#"><i class="fas fa-pen"></i> Update Campaign</a>
          </button>

          <button class="btn btn-sm btn-danger m-1">
            <a href="#"><i class="fas fa-trash"></i> Delete Campaign</a>
          </button>
        </div>
      </div>
    </div>
  </div>
</div>
{% endblock content %}

Urls

Now, create a url path to access this view.

    path("<int:pk>/", views.CampaignDetailView.as_view(), name="campaign-detail"),

After that, we also have to add this url in the campaign-list.html.

<td><a href="{% url 'campaign:campaign-detail' campaign.id %}" class="btn-sm btn-outline-primary">View Details</a></td>

[Run the development server and see the changes]

Adding context data

In the template, as you can see I have mentioned a section for registrations. As of now, its value is hardcoded from our django template and it is set as 0.

Now, I want to show the total number of users who have registered for this campaign under this registration section.

For that, I have to use Vaccination model to get this value.

So, at first, import the Vaccination model.

from vaccination.models import Vaccination

Now, in the Campaign Detail view, we have to override the get_context_data. We will alwayds override this method whenever we have to pass extra data to our templates.

def get_context_data(self, **kwargs):
    context = super().get_context_data(**kwargs)
    # Here, add a new key for registration in the context.
    # Its value will be Vaccination.objects.filter(campaign=self.kwargs["pk"]).count()
    # here, we are filtering all the patient vaccination by their campaign id and then counting the total number of entries.
    context["registration"] = Vaccination.objects.filter(campaign=self.kwargs["pk"]).count()
    # Now, return the context.
    return context

[Run the developmenet server, create a registration for vaccination from the admin panel and see this values.]

In this way, we have wrote Campaign Detail View that renders the information for our vaccination campaign.