Update homepage and subpages

widget_alipins/homepage/admin.py

@@ -9,8 +9,8 @@ class DepartmentAdmin(admin.ModelAdmin):
 
 class WidgetUserAdmin(admin.ModelAdmin):
     model = WidgetUser
-    search_fields = ['first_name', 'middle_name', 'last_name', 'id_num', 'email', 'department']
-    list_display = ('first_name', 'middle_name', 'last_name', 'id_num', 'email', 'department')
+    search_fields = ['first_name', 'middle_name', 'last_name', 'id_num', 'email', 'department', 'image']
+    list_display = ('first_name', 'middle_name', 'last_name', 'id_num', 'email', 'department', 'image')
 
 admin.site.register(Department, DepartmentAdmin)
 admin.site.register(WidgetUser, WidgetUserAdmin)
\ No newline at end of file

widget_alipins/homepage/migrations/0006_widgetuser_image.py

+# Generated by Django 4.0.3 on 2022-05-16 19:24
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('homepage', '0005_alter_widgetuser_id_num'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='widgetuser',
+            name='image',
+            field=models.ImageField(blank=True, null=True, upload_to='homepage/'),
+        ),
+    ]

widget_alipins/homepage/models.py

@@ -18,6 +18,7 @@ class WidgetUser(models.Model):
     id_num = models.CharField(max_length=7, validators=[RegexValidator(r'^\d+$')])
     email = models.EmailField(max_length=200)
     department = models.ForeignKey(Department, on_delete=models.CASCADE, null=True)
+    image = models.ImageField(null = True, blank = True, upload_to = "homepage/")
 
     def __str__(self):
         full_name = self.first_name + " " + self.middle_name + " " + self.last_name

widget_alipins/homepage/templates/homepage/detail.html

+{% extends 'base.html' %}
+{% load static %}
+
+    {% block styles %}
+        <link rel="stylesheet" type="text/css" href="{% static 'homepage/style.css' %}">   
+    {% endblock %}
+
+{% block title %}{{user.user_id}}{% endblock %}
+{% block content %}
+    <h1>{{user.last_name}}, {{user.first_name}} {{user.middle_name}}</h1>
+    <div>
+        {% if user.image %}
+            <p style="text-align:center"><img src = "{{ user.image.url }}"></p><br>
+        {% endif %}
+        <ul>
+            <li>ID Number: {{user.id_num}}</li>
+            <li>Email Address: {{user.email}}</li>
+            <li>Department: {{user.department.dept_name}}</li>
+            <li>Home Unit: {{user.department.home_unit}}</li>
+        </ul>
+    </div>
+{% endblock %}
\ No newline at end of file

widget_alipins/homepage/templates/homepage/index.html

+{% extends 'base.html' %}
+{% load static %}
+
+    {% block styles %}
+        <link rel="stylesheet" type="text/css" href="{% static 'homepage/style.css' %}">   
+    {% endblock %}
+
+{% block title %}Homepage{% endblock %}
+{% block content %}
+    <h1>Welcome to Widget!</h1>
+        <div>
+            <h2>Widget Users:</h3>
+            {% if user_list %}
+                <ol>
+                {% for user in user_list %}
+                    <li><a href="{% url 'homepage:details' user.id%}">{{user.last_name}}, {{user.first_name}} {{user.middle_name}}</a></li>
+                {% endfor %}
+                </ol>
+            {% else %}
+                <p>There are no existing users.</p>
+            {% endif %}
+        </div>
+{% endblock %}
\ No newline at end of file

widget_alipins/homepage/urls.py

 from django.urls import path
-
 from . import views
 
+app_name = "homepage"
 urlpatterns = [
-    path('', views.index, name="indexHomepage")
+    path('', views.index, name="indexHomepage"),
+    path('<int:user_id>/details', views.details, name="details")
 ]
\ No newline at end of file

widget_alipins/homepage/views.py

-from django.http import HttpResponse
-
+from django.http import Http404
+from django.shortcuts import render
 from .models import WidgetUser
 
 def index(request):
-    display_output = "<u><b>WIDGET USERS</u></b>: <br>"
+    user_list = WidgetUser.objects.order_by("last_name")
+    context = {
+        "user_list": user_list
+    }
+
+    return render(request, "homepage/index.html", context)
 
-    for objects in WidgetUser.objects.all():
-        display_output += '''
-        <b>{last_name}, {first_name} {middle_name}</b>: {id}, {email}, {dept}, {home}<br>
-        '''.format(last_name = objects.last_name,
-            first_name = objects.first_name,
-            middle_name = objects.middle_name,
-            id = objects.id_num,
-            email = objects.email,
-            dept = objects.department.dept_name,
-            home = objects.department.home_unit)
+def details(request, user_id):
+   try:
+       user = WidgetUser.objects.get(pk=user_id)
+   except WidgetUser.DoesNotExist:
+       raise Http404("User does not exist!")
 
-    return HttpResponse(display_output)
+   return render(request, "homepage/detail.html", {"user": user})
\ No newline at end of file

widget_alipins/static/homepage/style.css

+body {
+    font-family: sans-serif, Arial, Helvetica;
+    color:#035700;
+    line-height: 2;
+}
+
+div {
+    margin: auto;
+    width: 50%;
+    border: 3px solid rgb(194, 7, 169);
+    padding: 30px 40px 40px 40px;
+}
+
+h1 {
+    font-size: 40px;
+    text-align: center;
+    text-decoration: underline;
+}
+
+h2 {
+    font-size: 28px;
+    margin: 0px 0px 10px 0px;
+    text-align: center;
+}
+
+ul {
+    list-style-type: none;
+}
+
+li {
+    font-size: 20px;
+}
+
+p {
+    font-size: 20px;
+}
+
+span {
+    font-weight: bold;
+}
+
+span.perfect {
+    color: rgb(96, 189, 96);
+}
+
+span.passing {
+    color:#bb5959
+}
+
+img {
+    border-radius: 50%;
+    max-width: 100%;
+    height: auto;
+}
+
+a {
+    color:#891fa3;
+}
\ No newline at end of file