Add iframe view of KB categories

This commit is contained in:
Timothy Hobbs 2020-01-08 19:36:48 +01:00
parent 6579ac0e6f
commit 6a8ebd56a0
8 changed files with 108 additions and 112 deletions

View File

@ -17,10 +17,10 @@
<body id="bg-dark">
{% include "helpdesk/navigation-header.html" %}
<div id="wrapper">
{% include "helpdesk/navigation-sidebar.html" %}
<div id="content-wrapper">
<div class="container-fluid">
@ -43,35 +43,9 @@
<!-- /#wrapper -->
{% include "helpdesk/debug.html" %}
<!-- jQuery and Bootstrap Core -->
{% if helpdesk_settings.HELPDESK_USE_CDN %}
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>
{% else %}
<script src="{% static 'helpdesk/vendor/jquery/jquery.min.js' %}"></script>
<script src="{% static 'helpdesk/vendor/bootstrap/js/bootstrap.bundle.min.js' %}"></script>
{% endif %}
<!-- Core plugin JavaScript-->
<script src="{% static 'helpdesk/vendor/jquery-easing/jquery.easing.min.js' %}"></script>
<!-- Page level plugin JavaScript-->
<script src="{% static 'helpdesk/vendor/chart.js/Chart.min.js' %}"></script>
<script src="{% static 'helpdesk/vendor/datatables/js/jquery.dataTables.js' %}"></script>
<script src="{% static 'helpdesk/vendor/datatables/js/dataTables.bootstrap4.js' %}"></script>
<!-- jQuery UI DatePicker -->
<script src='{% static "helpdesk/vendor/jquery-ui/jquery-ui.min.js" %}' type='text/javascript' language='javascript'></script>
<link href="{% static 'helpdesk/vendor/jquery-ui/jquery-ui.css' %}" rel="stylesheet">
<!-- Metis Menu Plugin JavaScript -->
<script src="{% static 'helpdesk/vendor/metisMenu/metisMenu.min.js' %}"></script>
<!-- Custom Theme JavaScript -->
<script src="{% static 'helpdesk/js/sb-admin.js' %}"></script>
{% include 'helpdesk/base_js.html' %}
{% block helpdesk_js %}{% endblock %}
</body>

View File

@ -0,0 +1,27 @@
{% load static from staticfiles %}
<!-- jQuery and Bootstrap Core -->
{% if helpdesk_settings.HELPDESK_USE_CDN %}
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>
{% else %}
<script src="{% static 'helpdesk/vendor/jquery/jquery.min.js' %}"></script>
<script src="{% static 'helpdesk/vendor/bootstrap/js/bootstrap.bundle.min.js' %}"></script>
{% endif %}
<!-- Core plugin JavaScript-->
<script src="{% static 'helpdesk/vendor/jquery-easing/jquery.easing.min.js' %}"></script>
<!-- Page level plugin JavaScript-->
<script src="{% static 'helpdesk/vendor/chart.js/Chart.min.js' %}"></script>
<script src="{% static 'helpdesk/vendor/datatables/js/jquery.dataTables.js' %}"></script>
<script src="{% static 'helpdesk/vendor/datatables/js/dataTables.bootstrap4.js' %}"></script>
<!-- jQuery UI DatePicker -->
<script src='{% static "helpdesk/vendor/jquery-ui/jquery-ui.min.js" %}' type='text/javascript' language='javascript'></script>
<link href="{% static 'helpdesk/vendor/jquery-ui/jquery-ui.css' %}" rel="stylesheet">
<!-- Metis Menu Plugin JavaScript -->
<script src="{% static 'helpdesk/vendor/metisMenu/metisMenu.min.js' %}"></script>
<!-- Custom Theme JavaScript -->
<script src="{% static 'helpdesk/js/sb-admin.js' %}"></script>

View File

@ -1,4 +1,7 @@
{% extends "helpdesk/public_base.html" %}{% load i18n humanize %}
{% extends "helpdesk/public_base.html" %}
{% load i18n %}
{% block helpdesk_title %}{% blocktrans with category.title as kbcat %}{{ kbcat }}{% endblocktrans %}{% endblock %}
{% block helpdesk_breadcrumb %}
<li class="breadcrumb-item">
@ -8,51 +11,7 @@
{% endblock %}
{% block helpdesk_body %}
<h2>{% trans 'Knowledgebase Category' %}:{% blocktrans with category.title as kbcat %}{{ kbcat }}{% endblocktrans %}</h2>
<div class="card mb-3">
<div class="card-header">
<i class="fas fa-info-circle"></i>
{% blocktrans with category.title as kbcat %}You are viewing all items in the {{ kbcat }} category.{% endblocktrans %}
</div>
<div class="card-body">
<p>{{ category.description }}</p>
</div>
{% include 'helpdesk/kb_category_base.html' %}
</div>
<div id="accordion">
{% for item in items %}
<div class="card mb-3">
<button class="btn btn-link" data-toggle="collapse" data-target="#collapse{{item.id}}" aria-expanded="true" aria-controls="collapse{{item.id}}">
<div class="card-header" id="header{{item.id}}">
<h5 class="mb-0">
{{ item.title }}
</h5>
</div>
</button>
<div id="collapse{{item.id}}" class="collapse {% if item.id == selected_item %}show{% endif %}" aria-labelledby="header{{item.id}}" data-parent="#accordion">
<div class="card-body">
<p class="card-text">{{ item.question }}</p>
<p>{{ item.get_markdown }}</p>
<div class="row">
{% if request.user.pk %}
<div>
<a href='{% url "helpdesk:kb_vote" item.pk %}?vote=up'><button type="button" class="btn btn-success btn-circle btn-xl"><i class="fa fa-thumbs-up fa-lg"></i></button></a>
</div>
<div>
<a href='{% url "helpdesk:kb_vote" item.pk %}?vote=down'><button type="button" class="btn btn-danger btn-circle btn-xl"><i class="fa fa-thumbs-down fa-lg"></i></button></a>
</div>
{% blocktrans with recommendations=item.recommendations votes=item.votes %}{{ recommendations }} people found this answer useful of {{votes}}. {% endblocktrans %}
{% endif %}
<a href='{% url 'helpdesk:submit' %}?{% if category.queue %}queue={{category.queue.pk}};_readonly_fields_=queue;{%endif%}kbitem={{item.id}};{{query_param_string}}'><button type="button" class="btn btn-success btn-circle btn-xl float-right"><i class="fa fa-envelope fa-lg"></i> {% trans 'Get help with this topic' %}</button></a>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
{% if category.queue %}
<a href='{% url 'helpdesk:submit' %}?queue={{category.queue.pk}};_readonly_fields_=queue;{{query_param_string}}'><button type="button" class="btn btn-success btn-circle btn-xl float-right"><i class="fa fa-envelope fa-lg"></i> {% trans 'Get help with this topic' %}</button></a>
{% endif %}
{% endblock %}

View File

@ -0,0 +1,38 @@
{% load i18n %}
<h2>{% trans 'Knowledgebase Category' %}:{% blocktrans with category.title as kbcat %}{{ kbcat }}{% endblocktrans %}</h2>
<p>{{ category.description }}</p>
<div id="accordion">
{% for item in items %}
<div class="card mb-3">
<button class="btn btn-link" data-toggle="collapse" data-target="#collapse{{item.id}}" aria-expanded="true" aria-controls="collapse{{item.id}}">
<div class="card-header" id="header{{item.id}}">
<h5 class="mb-0">
{{ item.title }}
</h5>
</div>
</button>
<div id="collapse{{item.id}}" class="collapse {% if item.id == selected_item %}show{% endif %}" aria-labelledby="header{{item.id}}" data-parent="#accordion">
<div class="card-body">
<p class="card-text">{{ item.question }}</p>
<p>{{ item.get_markdown }}</p>
<div class="row">
{% if request.user.pk %}
<div>
<a href='{% url "helpdesk:kb_vote" item.pk %}?vote=up'><button type="button" class="btn btn-success btn-circle btn-xl"><i class="fa fa-thumbs-up fa-lg"></i></button></a>
</div>
<div>
<a href='{% url "helpdesk:kb_vote" item.pk %}?vote=down'><button type="button" class="btn btn-danger btn-circle btn-xl"><i class="fa fa-thumbs-down fa-lg"></i></button></a>
</div>
{% blocktrans with recommendations=item.recommendations votes=item.votes %}{{ recommendations }} people found this answer useful of {{votes}}. {% endblocktrans %}
{% endif %}
<a href='{% if iframe %}{% url 'helpdesk:submit_iframe' %}{% else %}{% url 'helpdesk:submit' %}{%endif%}?{% if category.queue %}queue={{category.queue.pk}};_readonly_fields_=queue;{%endif%}kbitem={{item.id}};{{query_param_string}}'><button type="button" class="btn btn-success btn-circle btn-xl float-right"><i class="fa fa-envelope fa-lg"></i> {% trans 'Get help with this topic' %}</button></a>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
{% if category.queue %}
<a href='{% if iframe %}{% url 'helpdesk:submit_iframe' %}{% else %}{% url 'helpdesk:submit' %}{%endif%}?queue={{category.queue.pk}};_readonly_fields_=queue;{{query_param_string}}'><button type="button" class="btn btn-success btn-circle btn-xl float-right"><i class="fa fa-envelope fa-lg"></i> {% trans 'Get help with this topic' %}</button></a>
{% endif %}

View File

@ -0,0 +1,13 @@
{% load i18n %}
{% load saved_queries %}
<head>
{% include 'helpdesk/base-head.html' %}
{% block helpdesk_head %}{% endblock %}
</head>
<body>
{% block helpdesk_body %}
{% include 'helpdesk/kb_category_base.html' %}
{% endblock %}
{% include 'helpdesk/base_js.html' %}
</body>

View File

@ -15,62 +15,35 @@
<body id="bg-dark">
{% include "helpdesk/navigation-header.html" %}
<div id="wrapper">
{% include "helpdesk/navigation-sidebar.html" %}
<div id="content-wrapper">
<div class="container-fluid">
<!-- Breadcrumbs-->
<ol class="breadcrumb">
{% block helpdesk_breadcrumb %}{% endblock %}
</ol>
{% block helpdesk_body %}{% endblock %}
</div>
<!-- /.container-fluid -->
{% include "helpdesk/attribution.html" %}
</div>
<!-- /.content-wrapper -->
</div>
<!-- /#wrapper -->
{% include "helpdesk/debug.html" %}
<!-- jQuery and Bootstrap Core -->
{% if helpdesk_settings.HELPDESK_USE_CDN %}
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>
{% else %}
<script src="{% static 'helpdesk/vendor/jquery/jquery.min.js' %}"></script>
<script src="{% static 'helpdesk/vendor/bootstrap/js/bootstrap.bundle.min.js' %}"></script>
{% endif %}
<!-- Core plugin JavaScript-->
<script src="{% static 'helpdesk/vendor/jquery-easing/jquery.easing.min.js' %}"></script>
<!-- Page level plugin JavaScript-->
<script src="{% static 'helpdesk/vendor/chart.js/Chart.min.js' %}"></script>
<script src="{% static 'helpdesk/vendor/datatables/js/jquery.dataTables.js' %}"></script>
<script src="{% static 'helpdesk/vendor/datatables/js/dataTables.bootstrap4.js' %}"></script>
<!-- jQuery UI DatePicker -->
<script src='{% static "helpdesk/vendor/jquery-ui/jquery-ui.min.js" %}' type='text/javascript' language='javascript'></script>
<link href="{% static 'helpdesk/vendor/jquery-ui/jquery-ui.css' %}" rel="stylesheet">
<!-- Metis Menu Plugin JavaScript -->
<script src="{% static 'helpdesk/vendor/metisMenu/metisMenu.min.js' %}"></script>
<!-- Custom Theme JavaScript -->
<script src="{% static 'helpdesk/js/sb-admin.js' %}"></script>
{% include 'helpdesk/base_js.html' %}
{% block helpdesk_js %}{% endblock %}
</body>
</html>
{% endwith %}

View File

@ -239,6 +239,10 @@ if helpdesk_settings.HELPDESK_KB_ENABLED:
url(r'^kb/(?P<slug>[A-Za-z0-9_-]+)/$',
kb.category,
name='kb_category'),
url(r'^kb_iframe/(?P<slug>[A-Za-z0-9_-]+)/$',
kb.category_iframe,
name='kb_category_iframe'),
]
urlpatterns += [

View File

@ -24,7 +24,7 @@ def index(request):
})
def category(request, slug):
def category(request, slug, iframe=False):
category = get_object_or_404(KBCategory, slug__iexact=slug)
items = category.kbitem_set.all()
selected_item = request.GET.get('kbitem', None)
@ -37,15 +37,23 @@ def category(request, slug):
del qparams['kbitem']
except KeyError:
pass
return render(request, 'helpdesk/kb_category.html', {
template = 'helpdesk/kb_category.html'
if iframe:
template = 'helpdesk/kb_category_iframe.html'
return render(request, template, {
'category': category,
'items': items,
'selected_item': selected_item,
'query_param_string': qparams.urlencode(),
'helpdesk_settings': helpdesk_settings,
'iframe': iframe,
})
def category_iframe(request, slug):
return category(request, slug, iframe=True)
def vote(request, item):
item = get_object_or_404(KBItem, pk=item)
vote = request.GET.get('vote', None)