288 lines
9.3 KiB
HTML
288 lines
9.3 KiB
HTML
{% extends 'generic/base.html' %}
|
|
|
|
{% load render_table from django_tables2 %}
|
|
{% block css %}
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
|
|
<div id="view-filter-options">
|
|
<h3>Filter CID Users </h3>
|
|
<form action="" method="get">
|
|
{{ filter.form }}
|
|
<input class="btn btn-primary btn-sm mt-1 mb-1" type="submit" />
|
|
</form>
|
|
</div>
|
|
|
|
<div>
|
|
<span id="manage-span">
|
|
{% render_table table %}
|
|
</span>
|
|
</div>
|
|
|
|
<details>
|
|
<summary>
|
|
<h3>Add/Edit CID users</h3>
|
|
</summary>
|
|
<button id="add-exams-selected-cids">Change selected exams</button>
|
|
<button id="clear-exams-selected-cids">Clear selected exams</button>
|
|
<button id="activate-selected-cids">Activate selected</button>
|
|
<button id="deactivate-selected-cids">Deactivate selected</button>
|
|
<button id="delete-selected-cids">Delete selected</button>
|
|
<button id="toggle-internal">Toggle internal</button>
|
|
<p>Select exams below to add user to.</p>
|
|
<div class="exam-selectors">
|
|
<span>
|
|
Physics Exams<br />
|
|
<select id="physics-exams" multiple="multiple">
|
|
{% for name, id in physics_exams %}
|
|
<option value="{{id}}">{{name}}</option>
|
|
{% endfor %}
|
|
|
|
</select>
|
|
</span>
|
|
<span>
|
|
Rapid Exams<br />
|
|
<select id="rapid-exams" multiple="multiple">
|
|
{% for name, id in rapid_exams %}
|
|
<option value="{{id}}">{{name}}</option>
|
|
{% endfor %}
|
|
|
|
</select>
|
|
</span>
|
|
<span>
|
|
Sba Exams<br />
|
|
<select id="sbas-exams" multiple="multiple">
|
|
{% for name, id in sba_exams %}
|
|
<option value="{{id}}">{{name}}</option>
|
|
{% endfor %}
|
|
|
|
</select>
|
|
</span>
|
|
<span>
|
|
Long Exams<br />
|
|
<select id="longs-exams" multiple="multiple">
|
|
{% for name, id in longs_exams %}
|
|
<option value="{{id}}">{{name}}</option>
|
|
{% endfor %}
|
|
|
|
</select>
|
|
</span>
|
|
<span>
|
|
Anatomy Exams<br />
|
|
<select id="anatomy-exams" multiple="multiple">
|
|
{% for name, id in anatomy_exams %}
|
|
<option value="{{id}}">{{name}}</option>
|
|
{% endfor %}
|
|
|
|
</select>
|
|
</span>
|
|
|
|
|
|
</div>
|
|
<div>
|
|
Groups<br />
|
|
<select id="cid-groups">
|
|
<option value="">----</option>
|
|
{% for name, id in cid_user_groups %}
|
|
<option value="{{id}}">{{name}}</option>
|
|
{% endfor %}
|
|
|
|
</select>
|
|
<button id="add-group">Add Group to users</button>
|
|
</div>
|
|
<button id="add-new-cids">Add New (Blank) Users</button>
|
|
<input type="number" id="add-number" value="number to add"><br />
|
|
<button id="add-new-emails">Add New Users From Email</button>
|
|
<textarea id="emails-input" name="emails" rows="4" cols="50">Enter emails here</textarea>
|
|
</details>
|
|
|
|
{% endblock %}
|
|
|
|
{% block js %}
|
|
|
|
|
|
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/dt-1.11.3/r-2.2.9/datatables.min.css"/>
|
|
|
|
<script type="text/javascript" src="https://cdn.datatables.net/v/bs4/dt-1.11.3/r-2.2.9/datatables.min.js"></script>
|
|
|
|
<script>
|
|
jQuery.fn.dataTable.render.ellipsis = function ( cutoff, wordbreak, escapeHtml ) {
|
|
var esc = function ( t ) {
|
|
return t
|
|
.replace( /&/g, '&' )
|
|
.replace( /</g, '<' )
|
|
.replace( />/g, '>' )
|
|
.replace( /"/g, '"' );
|
|
};
|
|
|
|
return function ( d, type, row ) {
|
|
// Order, search and type get the original data
|
|
if ( type !== 'display' ) {
|
|
return d;
|
|
}
|
|
|
|
if ( typeof d !== 'number' && typeof d !== 'string' ) {
|
|
return d;
|
|
}
|
|
|
|
d = d.toString(); // cast numbers
|
|
|
|
if ( d.length <= cutoff ) {
|
|
return d;
|
|
}
|
|
|
|
var shortened = d.substr(0, cutoff-1);
|
|
|
|
// Find the last white space character in the string
|
|
if ( wordbreak ) {
|
|
shortened = shortened.replace(/\s([^\s]*)$/, '');
|
|
}
|
|
|
|
// Protect against uncontrolled HTML input
|
|
if ( escapeHtml ) {
|
|
shortened = esc( shortened );
|
|
}
|
|
|
|
return '<span class="ellipsis" title="'+esc(d)+'">'+shortened+'…</span>';
|
|
};
|
|
};
|
|
|
|
function postAjax(data) {
|
|
|
|
$.ajax({
|
|
url: "{% url 'generic:manage_cid_users' %}",
|
|
data: data,
|
|
type: "POST",
|
|
dataType: "json",
|
|
})
|
|
// $.ajax().done(), $.ajax().fail(), $ajax().always() are upto you. Add/change accordingly
|
|
.done(function (data) {
|
|
console.log(data);
|
|
|
|
if (data.status == "success") {
|
|
toastr.info('Added/Updated');
|
|
location.reload();
|
|
}
|
|
// show some message according to the response.
|
|
// For eg. A message box showing that the status has been changed
|
|
})
|
|
.always(function () {
|
|
console.log('[Done]');
|
|
})
|
|
|
|
}
|
|
|
|
function getGenericData() {
|
|
selected_cids = []
|
|
$("#manage-span tbody input:checked").each((n, el) => {
|
|
selected_cids.push(parseInt(el.value));
|
|
})
|
|
return {
|
|
csrfmiddlewaretoken: "{{ csrf_token }}",
|
|
physics_exams: JSON.stringify($("#physics-exams").val()),
|
|
rapid_exams: JSON.stringify($("#rapid-exams").val()),
|
|
sba_exams: JSON.stringify($("#sbas-exams").val()),
|
|
longs_exams: JSON.stringify($("#longs-exams").val()),
|
|
anatomy_exams: JSON.stringify($("#anatomy-exams").val()),
|
|
cid_groups: JSON.stringify($("#cid-groups").val()),
|
|
delete: false,
|
|
emails: JSON.stringify(false),
|
|
number_to_create: 0,
|
|
activate: false,
|
|
deactivate: false,
|
|
add_exams: false,
|
|
clear_exams: false,
|
|
toggle_internal: false,
|
|
selected_cids: JSON.stringify(selected_cids),
|
|
}
|
|
}
|
|
|
|
$(document).ready(function () {
|
|
|
|
{% if exams %}
|
|
$("table").DataTable({
|
|
columnDefs: [ {
|
|
targets: [6,7,8,9,10],
|
|
render: $.fn.dataTable.render.ellipsis( 17, true )
|
|
} ],
|
|
"paging": false,
|
|
});
|
|
{% else %}
|
|
$("table").DataTable({
|
|
"paging": false,
|
|
});
|
|
{% endif %}
|
|
|
|
$("#toggle-internal").click((evt) => {
|
|
data = getGenericData();
|
|
data["toggle_internal"] = true;
|
|
postAjax(data);
|
|
});
|
|
$("#add-new-emails").click((evt) => {
|
|
data = getGenericData();
|
|
data["emails"] = JSON.stringify($("#emails-input").val());
|
|
postAjax(data);
|
|
});
|
|
$("#add-group").click((evt) => {
|
|
data = getGenericData();
|
|
data["add_group"] = true;
|
|
postAjax(data);
|
|
});
|
|
$("#add-exams-selected-cids").click((evt) => {
|
|
data = getGenericData();
|
|
data["add_exams"] = true;
|
|
postAjax(data);
|
|
});
|
|
$("#clear-exams-selected-cids").click((evt) => {
|
|
data = getGenericData();
|
|
data["clear_exams"] = true;
|
|
postAjax(data);
|
|
});
|
|
$("#activate-selected-cids").click((evt) => {
|
|
data = getGenericData();
|
|
data["activate"] = true;
|
|
postAjax(data);
|
|
});
|
|
$("#deactivate-selected-cids").click((evt) => {
|
|
data = getGenericData();
|
|
data["deactivate"] = true;
|
|
postAjax(data);
|
|
});
|
|
$("#delete-selected-cids").click((evt) => {
|
|
data = getGenericData();
|
|
data["delete"] = true;
|
|
postAjax(data);
|
|
});
|
|
|
|
$("#add-new-cids").click((evt) => {
|
|
|
|
n = $("#add-number").get(0).value;
|
|
|
|
if (n < 1) {
|
|
toastr.info("You need to enter how many users to add.");
|
|
return
|
|
}
|
|
|
|
data = getGenericData();
|
|
data["number_to_create"] = n;
|
|
|
|
postAjax(data);
|
|
|
|
|
|
});
|
|
});
|
|
</script>
|
|
<style>
|
|
.exam-selectors {
|
|
display: flex;
|
|
}
|
|
|
|
.exam-selectors select {
|
|
height: 200px;
|
|
}
|
|
</style>
|
|
|
|
|
|
{% endblock %}
|