[FEATURE] 서비스 통계 (#318)

* refactor: 코드 리팩토링 (#316)

* feat: 서비스 통계 페이지 (#316)

* feat: 프론트 완성 (#316)

* feat: 프론트 수정 (#316)

* feat: 칼럼명 변경 (#316)

* feat: 서비스 통계 (#316)

* feat: 차트 옵션 (#316)

config/urls.py

@@ -27,5 +27,6 @@
     path('qna/', include('qna.urls')),
     path('api/', include('api.urls')),
     path('team/', views.team, name='team'),
+    path('statistics/', views.statistics, name='statistics'),
     path('robots.txt', TemplateView.as_view(template_name="robots.txt", content_type='text/plain')),
 ]

core/views.py

@@ -1,10 +1,12 @@
-import datetime
+from datetime import datetime, date
 import json
+from itertools import accumulate
+
 import pandas as pd
 from django.contrib import messages
 from django.contrib.auth.decorators import login_required
 from django.contrib.auth.models import User
-from django.db.models import Q, Sum
+from django.db.models import Q, Sum, Count, F
 from django.shortcuts import render, redirect, get_object_or_404
 from django.contrib.auth.hashers import check_password
 from sangmyung_univ_auth import completed_courses
@@ -19,7 +21,7 @@
 
 def home(request):
     departments = Department.objects.filter(url__isnull=False)
-    dept_num, today = departments.count(), datetime.date.today()
+    dept_num, today = departments.count(), date.today()
     st, _ = Statistics.objects.get_or_create(date=today)
     visit_total = Statistics.objects.aggregate(Sum('visit_count'))['visit_count__sum']
     user_num = format(User.objects.all().count(), ',')
@@ -32,10 +34,6 @@ def home(request):
     return response
 
 
-def team(request):
-    return render(request, 'core/team.html')
-
-
 @login_required
 def mypage(request):
     user = request.user
@@ -194,3 +192,41 @@ def member_del(request):
             return redirect('home')
     messages.error(request, '⚠️ 비밀번호가 일치하지 않습니다.')
     return redirect('core:mypage')
+
+
+def team(request):
+    return render(request,  'core/team.html')
+
+
+def data_members():
+    user_counts = (
+        User.objects.values('date_joined__date')
+        .annotate(count=Count('id'))
+        .order_by('date_joined__date')
+    )
+    return [
+        [entry['date_joined__date'].strftime('%Y-%m-%d'), cumulative_count]
+        for entry, cumulative_count in zip(
+            user_counts, accumulate(entry['count'] for entry in user_counts)
+        )
+    ]
+
+
+def data_visitors():
+    stats = Statistics.objects.order_by('-id')[:7].values('date', 'visit_count')
+    return [
+        [datetime.strptime(stat['date'], '%Y-%m-%d').strftime('%m.%d'),
+         stat['visit_count'],
+         stat['visit_count']]
+        for stat in stats
+    ][::-1]
+
+
+def statistics(request):
+    context = {
+        "data_members": data_members(),
+        "data_visitors": data_visitors(),
+        "user_total": format(User.objects.all().count(), ','),
+        "visit_total": format(Statistics.objects.aggregate(Sum('visit_count'))['visit_count__sum'], ',')
+    }
+    return render(request,  'core/statistics.html', context)

static/js/chart.js

@@ -0,0 +1,34 @@
+function drawChart() {
+    const visitors = new google.visualization.DataTable();
+    visitors.addColumn('string', '날짜');
+    visitors.addColumn('number', '방문자 수');
+    visitors.addColumn({type:'number', role:'annotation'})
+    visitors.addRows(visitors_data);
+    const chart = new google.visualization.ColumnChart(document.getElementById('chart_visitors'));
+    chart.draw(visitors, options);
+
+    const members = new google.visualization.DataTable();
+    members.addColumn('date', '날짜');
+    members.addColumn('number', '회원 수');
+    members.addRows(members_data);
+    const charts = new google.visualization.LineChart(document.getElementById('chart_members'));
+    charts.draw(members, options);
+
+    window.addEventListener('resize', drawChart, false)
+}
+
+const options = {
+    colors: ['rgb(1, 42, 127)'],
+    vAxis: {
+        minValue: 0
+    },
+    hAxis: {
+        format: 'MMM yyyy',
+    },
+    width: '100%',
+    height: 400,
+};
+
+google.charts.load('current', {'packages':['corechart', 'bar']});
+google.charts.load('current', {packages: ['corechart', 'line']});
+google.charts.setOnLoadCallback(drawChart);

templates/core/statistics.html

@@ -0,0 +1,23 @@
+{% extends 'base.html' %}
+{% load static %}
+{% block main_area %}
+    <div class="container" style="margin-top: 4rem; margin-bottom: 4rem; text-align: center;">
+        <h2>총 회원 수</h2>
+        <h2 style="color:var(--sangmyung);"><b>{{ user_total }}</b></h2>
+        <div id="chart_members"></div>
+
+        <h2 style="margin-top: 2rem;">총 방문자 수</h2>
+        <h2 style="color:var(--sangmyung);"><b>{{ visit_total }}</b></h2>
+        <div id="chart_visitors"></div>
+    </div>
+{% endblock %}
+
+{% block js %}
+    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
+    <script type="text/javascript" src="{% static 'js/chart.js' %}"></script>
+    <script type="text/javascript">
+        const data_member = {{ data_members|safe }};
+        const visitors_data = {{ data_visitors|safe }};
+        const members_data = data_member.map(x => [new Date(x[0]), x[1]]);
+    </script>
+{% endblock %}