digitaleagenturnc/dasettings/templates/dasettings/settings.html

537 lines
22 KiB
HTML

{% extends "users/base.html" %}
{% load counter_tag %}
{% block content %}
<div aria-live="polite" aria-atomic="true" class="d-flex justify-content-center align-items-center" style="min-height: 200px; max-width: 250px; position: fixed; margin-top: -3%; margin-left: 70.5%; z-index: 10">
<!-- Then put toasts within -->
<div id="notchange_done" class="toast alert-success" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-header">
<strong class="mr-auto">Gespeichert</strong>
<!--<button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>-->
</div>
<div class="toast-body">
<div id="toast_savecontent">Änderungen wurden gespeichert.</div>
</div>
</div>
</div>
<div aria-live="polite" aria-atomic="true" class="d-flex justify-content-center align-items-center" style="min-height: 200px; max-width: 250px; position: fixed; margin-top: -3%; margin-left: 70.5%; z-index: 10">
<!-- Then put toasts within -->
<div id="notchange_err" class="toast alert-danger" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-header">
<strong class="mr-auto">Fehler aufgetreten</strong>
<!--
<button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
-->
</div>
<div class="toast-body">
<div id="toast_errcontent">Bitte kontaktieren Sie den Support.</div>
</div>
</div>
</div>
<div class="content-section col-12">
<h3>Einstellungen</i></b>{% if request.user.profile.showtooltips %}&nbsp;<small><i data-toggle="tooltip" data-placement="top" title="Hier können Agenturweite Einstellungen (Mitarbeiter, Gruppen, Agenturinfos, Bereiche und Tätigkeiten, Abrechnung, Module usw.) verwaltet werden." class="far fa-question-circle"></i></small>{% endif %}</h3>
<hr>
<ul class="nav nav-tabs" id="settingsTabs" role="tablist">
<!--
<li class="nav-item">
<a class="nav-link active" id="profil-tab" data-toggle="tab" href="#profil" role="tab" aria-controls="profil" aria-selected="false" ><i class="fas fa-user"></i>&nbsp;Profil</a>
</li>
-->
<li class="nav-item">
<a class="nav-link" id="notifications-tab" data-toggle="tab" href="#notifications" role="tab" aria-controls="notifications-tab" aria-selected="false"><i class="fas fa-bell"></i>&nbsp;Benachrichtigungen</a>
</li>
{% if user|usergperm:"agencyinfo" %}
<li class="nav-item">
<a class="nav-link" id="agency-tab" data-toggle="tab" href="#agency" role="tab" aria-controls="agency" aria-selected="false"><i class="fas fa-briefcase"></i>&nbsp;Agentur</a>
</li>
{% endif %}
{% if user|usergperm:"agencyinfo" %}
<li class="nav-item">
<a class="nav-link" id="calc-tab" data-toggle="tab" href="#calc" role="tab" aria-controls="calc" aria-selected="false"><i class="fas fa-coins"></i>&nbsp;Abrechnung</a>
</li>
{% endif %}
{% if user|usergperm:"agencynetwork" %}
<li class="nav-item">
<a class="nav-link" id="agencynetwork-tab" data-toggle="tab" href="#agencynetwork" role="tab" aria-controls="agencynetwork" aria-selected="false"><i class="fas fa-project-diagram"></i>&nbsp;Agenturverbund</a>
</li>
{% endif %}
{% if user|usergperm:"structuremanager" %}
<li class="nav-item">
<a class="nav-link" id="structure-tab" data-toggle="tab" href="#structure" role="tab" aria-controls="structure" aria-selected="false"><i class="fas fa-columns"></i>&nbsp;Struktur</a>
</li>
{% endif %}
{% if user|usergperm:"usermanager" %}
<li class="nav-item">
<a class="nav-link" id="user-tab" data-toggle="tab" href="#user" role="tab" aria-controls="user" aria-selected="false"><i class="fas fa-users"></i>&nbsp;Mitarbeiter</a>
</li>
{% endif %}
{% if user|usergperm:"groupmanager" %}
<li class="nav-item">
<a class="nav-link" id="groups-tab" data-toggle="tab" href="#groups" role="tab" aria-controls="groups" aria-selected="false"><i class="fas fa-users-cog"></i>&nbsp;Gruppen</a>
</li>
{% endif %}
{% if user|usergperm:"modulesconfig" %}
<li class="nav-item">
<a class="nav-link" id="moduls-tab" data-toggle="tab" href="#moduls" role="tab" aria-controls="moduls" aria-selected="false"><i class="fas fa-sliders-h"></i>&nbsp;Module</a>
</li>
{% endif %}
</ul>
<div class="tab-content" id="settingsTabsContent">
<!--
<div class="tab-pane fade show" id="profil" role="tabpanel" aria-labelledby="profil-tab">
<h5 class="mt-3">Profileinstellungen{% if request.user.profile.showtooltips %}&nbsp;<small><i data-toggle="tooltip" data-placement="top" title="Hier können Sie Einstellungen an ihrem Profil vornehmen (E-Mail, Passwort und, ob die Tooltips angezeigt werden sollen). Alle anderen Einstellungen werden von Mitarbeitern mit entsprechenden Gruppenrechten verwaltet." class="far fa-question-circle"></i></small>{% endif %}</h5>
<hr>
WURDE AUSKOMMENTNTIERT, IST ABER DJANGO
block profil_content
include "dasettings/profil_content.html"
endblock
</div>
-->
<div class="tab-pane fade" id="notifications" role="tabpanel" aria-labelledby="notifications-tab">
<h5 class="mt-3">Benachrichtigungen{% if request.user.profile.showtooltips %}&nbsp;<small><i data-toggle="tooltip" data-placement="top" title="Stellen Sie hier ein, welche Art der Benachrichtigung (E-Mail oder Push) Sie für welches Ereignis (Gruppenzuweisungen, Veröffentlichung eines Standards, neue Agenturnews usw.) erhalten möchten." class="far fa-question-circle"></i></small>{% endif %}</h5>
{% block notifications_content %}
{% include "dasettings/notifications_content.html" %}
{% endblock %}
</div>
{% if user|usergperm:"agencyinfo" %}
<div class="tab-pane fade" id="agency" role="tabpanel" aria-labelledby="agency-tab">
<h5 class="mt-3">Agenturinformationen{% if request.user.profile.showtooltips %}&nbsp;<small><i data-toggle="tooltip" data-placement="top" title="Verwalten Sie hier die Informationen Ihrer Agentur, z.B. Adresse, E-Mailadresse und Telefon." class="far fa-question-circle"></i></small>{% endif %}
<small><i onclick="javascript:$('#youtubevideoinformation_agency').modal('toggle');" class="far fa-play-circle"></i></small>
</h5>
<hr>
{% block agency_content %}
{% include "dasettings/agency_content.html" %}
{% endblock %}
</div>
{% endif %}
{% if user|usergperm:"agencyinfo" %}
<div class="tab-pane fade" id="calc" role="tabpanel" aria-labelledby="calc-tab">
<h5 class="mt-3">Abrechnung{% if request.user.profile.showtooltips %}&nbsp;<small><i data-toggle="tooltip" data-placement="top" title="Hier können Sie die aktuellen Abrechnungsinfos einsehen." class="far fa-question-circle"></i></small>{% endif %}</h5>
<hr>
{% block calc_content %}
{% include "dasettings/calc_content.html" %}
{% endblock %}
</div>
{% endif %}
{% if user|usergperm:"agencynetwork" %}
<div class="tab-pane fade" id="agencynetwork" role="tabpanel" aria-labelledby="agencynetwork-tab">
<h5 class="mt-3">Agenturverbünde{% if request.user.profile.showtooltips %}&nbsp;<small><i data-toggle="tooltip" data-placement="top" title="Verwalten Sie hier Ihre eigenen Agenturverbünde und in welchen Sie Mitglied sind." class="far fa-question-circle"></i></small>{% endif %}
<small><i onclick="javascript:$('#youtubevideoinformation_agencynetwork').modal('toggle');" class="far fa-play-circle"></i></small>
</h5>
<hr>
{% block agencynetwork_content %}
{% include "dasettings/agencynetwork_content.html" %}
{% endblock %}
</div>
{% endif %}
{% if user|usergperm:"structuremanager" %}
<div class="tab-pane fade" id="structure" role="tabpanel" aria-labelledby="structure-tab">
<h5 class="mt-3">Struktur{% if request.user.profile.showtooltips %}&nbsp;<small><i data-toggle="tooltip" data-placement="top" title="Richten Sie hier Bereiche und Tätigkeiten ein, um diese in Standards und Organigramm als Agenturstruktur zu nutzen." class="far fa-question-circle"></i></small>{% endif %}
<small><i onclick="javascript:$('#youtubevideoinformation_structure').modal('toggle');" class="far fa-play-circle"></i></small>
</h5>
<hr>
{% block structure_content %}
{% include "dasettings/structure_content.html" %}
{% endblock %}
</div>
{% endif %}
{% if user|usergperm:"usermanager" %}
<div class="tab-pane fade" id="user" role="tabpanel" aria-labelledby="user-tab">
<h5 class="mt-3">Mitarbeiter{% if request.user.profile.showtooltips %}&nbsp;<small><i data-toggle="tooltip" data-placement="top" title="Legen Sie hier neue Mtarbeiter an, weisen ihnen Gruppen zu und ändern Sie Stammdaten wie Foto, Namen und Agenturfunktion." class="far fa-question-circle"></i></small>{% endif %}
<small><i onclick="javascript:$('#youtubevideoinformation_users').modal('toggle');" class="far fa-play-circle"></i></small>
</h5>
<hr>
{% block user_content %}
{% include "dasettings/user_content.html" %}
{% endblock %}
</div>
{% endif %}
{% if user|usergperm:"groupmanager" %}
<div class="tab-pane fade" id="groups" role="tabpanel" aria-labelledby="groups-tab">
<h5 class="mt-3">Gruppen{% if request.user.profile.showtooltips %}&nbsp;<small><i data-toggle="tooltip" data-placement="top" title="Hier werden Gruppen erstellt und bearbeitet sowie Mitglieder der Gruppen hinzugefügt und entfernt. Zudem können Rechte der Gruppen vergeben werden." class="far fa-question-circle"></i></small>{% endif %}
<small><i onclick="javascript:$('#youtubevideoinformation_users').modal('toggle');" class="far fa-play-circle"></i></small>
</h5>
<hr>
{% block groups_content %}
{% include "dasettings/groups_content.html" %}
{% endblock %}
</div>
{% endif %}
{% if user|usergperm:"modulesconfig" %}
<div class="tab-pane fade" id="moduls" role="tabpanel" aria-labelledby="moduls-tab">
<h5 class="mt-3">Module{% if request.user.profile.showtooltips %}&nbsp;<small><i data-toggle="tooltip" data-placement="top" title="Hier werden Module aktiviert oder deaktiviert sowie individuelle Einstellungen der Module gemacht. Wird ein Modul deaktiviert, gehen Einstellungen und Dateien nicht verloren." class="far fa-question-circle"></i></small>{% endif %}</h5>
{% block moduls_content %}
{% include "dasettings/moduls_content.html" %}
{% endblock %}
</div>
{% endif %}
</div>
</div>
<script type="text/javascript">
var defaultsettingsview = "notifications";
/* COOKIE FOR SAVING OPEN TAB */
$(document).ready(function(){
$(".toast").toast({
autohide: true,
delay : 3000
});
//Check prev Side
var activeTab = localStorage.getItem('activeTabSettings');
if(activeTab){
if($('#' + activeTab).find().prevObject.length != 0){
$('#' + activeTab).tab('show');
$(".nav-link").removeClass("active");
$("#" + activeTab + "-tab").addClass("active");
}
else{
$("#notifications-tab").addClass("active");
$('#notifications').tab('show');
}
}
else{
$("#notifications-tab").addClass("active");
$('#notifications').tab('show');
}
});
$('#settingsTabs a').on('click', function (e) {
e.preventDefault();
$(this).tab('show');
lastview_name = $(this)[0]['hash'].substring(1);
localStorage.setItem('activeTabSettings', lastview_name);
});
</script>
<!-- YOUTUBE PART START -->
<!--
//COPY THAT
<small><i onclick="javascript:$('#youtubevideoinformation').modal('toggle');" class="far fa-play-circle"></i></small>
-->
<script type="text/javascript">
//CHANGEhttps://youtu.be/
var VIDEOURL_agn = "CazKG4mSlH0"
var MODALNAME_agn = "#youtubevideoinformation_agencynetwork"
var VIDEOTITLE_agn = "Informationsvideo Agenturverbünde"
//CHANGEhttps://youtu.be/
var VIDEOURL_structure = "0qyqkSDSx4M"
var MODALNAME_structure = "#youtubevideoinformation_structure"
var VIDEOTITLE_structure = "Informationsvideo Struktur"
//CHANGE
var VIDEOURL_users = "r0dHJ6jYqBU"
var MODALNAME_users = "#youtubevideoinformation_users"
var VIDEOTITLE_users = "Informationsvideo Mitarbeiter und Gruppen"
//CHANGE
var VIDEOURL_agency = "tdYMRIzEcs8"
var MODALNAME_agency = "#youtubevideoinformation_agency"
var VIDEOTITLE_agency = "Informationsvideo Agentur und Agenturfunktionen"
$(document).ready(function(){
$("#modaltitle_video_agn").html(VIDEOTITLE_agn);
//VIDEOCONTROLS
$( MODALNAME_agn ).on('shown.bs.modal', function(e){
player_agn.playVideo();
});
$( MODALNAME_agn ).on('hidden.bs.modal', function(e){
player_agn.pauseVideo();
});
});
//VIDEOPLAYER
var player_agn;
var player_structure;
var player_users;
function onYouTubeIframeAPIReady() {
player_agn = new YT.Player('video-placeholder_agn', {
width: 760,
height: 500,
videoId: VIDEOURL_agn,
});
player_structure = new YT.Player('video-placeholder_structure', {
width: 760,
height: 500,
videoId: VIDEOURL_structure,
});
player_users = new YT.Player('video-placeholder_users', {
width: 760,
height: 500,
videoId: VIDEOURL_users,
});
player_agency = new YT.Player('video-placeholder_agency', {
width: 760,
height: 500,
videoId: VIDEOURL_agency,
});
}
</script>
<!-- VIDEOMODAL -->
<div class="modal fade" id="youtubevideoinformation_agencynetwork" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modaltitle_video_agn"></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body" style="min-height: 500px;">
<div id="video-placeholder_agn"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
</div>
</div>
</div>
</div>
<!-- YOUTUBE PART ENDE -->
<!-- YOUTUBE PART START -->
<!--
//COPY THAT
<small><i onclick="javascript:$('#youtubevideoinformation_structure').modal('toggle');" class="far fa-play-circle"></i></small>
-->
<script type="text/javascript">
$(document).ready(function(){
$("#modaltitle_video_structure").html(VIDEOTITLE_structure);
//VIDEOCONTROLS
$( MODALNAME_structure ).on('shown.bs.modal', function(e){
player_structure.playVideo();
});
$( MODALNAME_structure ).on('hidden.bs.modal', function(e){
player_structure.pauseVideo();
});
});
</script>
<!-- VIDEOMODAL -->
<div class="modal fade" id="youtubevideoinformation_structure" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modaltitle_video_structure"></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body" style="min-height: 500px;">
<div id="video-placeholder_structure"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
</div>
</div>
</div>
</div>
<!-- YOUTUBE PART START -->
<!--
//COPY THAT
<small><i onclick="javascript:$('#youtubevideoinformation_structure').modal('toggle');" class="far fa-play-circle"></i></small>
-->
<script type="text/javascript">
$(document).ready(function(){
$("#modaltitle_video_users").html(VIDEOTITLE_users);
//VIDEOCONTROLS
$( MODALNAME_users ).on('shown.bs.modal', function(e){
player_users.playVideo();
});
$( MODALNAME_users ).on('hidden.bs.modal', function(e){
player_users.pauseVideo();
});
});
</script>
<!-- VIDEOMODAL -->
<div class="modal fade" id="youtubevideoinformation_users" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modaltitle_video_users"></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body" style="min-height: 500px;">
<div id="video-placeholder_users"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
$("#modaltitle_video_agency").html(VIDEOTITLE_agency);
//VIDEOCONTROLS
$( MODALNAME_agency ).on('shown.bs.modal', function(e){
player_agency.playVideo();
});
$( MODALNAME_agency ).on('hidden.bs.modal', function(e){
player_agency.pauseVideo();
});
});
</script>
<!-- VIDEOMODAL -->
<div class="modal fade" id="youtubevideoinformation_agency" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modaltitle_video_agency"></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body" style="min-height: 500px;">
<div id="video-placeholder_agency"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
</div>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="externalAccessUpdate" tabindex="20" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Externer Zugriff gesperrt</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
Der externe Zugriff wurde gesperrt.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="externalAccessUpdateAllow" tabindex="20" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Externer Zugriff erlaubt</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
Der externe Zugriff ist nun erlaubt. Kopieren Sie die entsprechenden Links unter Abwesenheiten in Ihre Kalender ein.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="externalAccessConfirm" tabindex="20" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Externen Zugriff aktivieren</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
Möchten Sie wirklich den externen Zugriff per Link auf Ihre Abwesenheitsinformationen aktivieren (nötig für z.B. Google-Kalender)? Stellen Sie sicher, dass diese Links nicht an Dritte weitergegeben werden!
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" onclick="javascript:updateExAccess()">Ja, Zugriff aktivieren</button>
<button type="button" class="btn " data-dismiss="modal">Abbrechen</button>
</div>
</div>
</div>
</div>
<script src="https://www.youtube.com/iframe_api"></script>
<!-- YOUTUBE PART ENDE -->
<!-- Abwesenheit -->
<script type="text/javascript">
function allowExAccess(){
$("#modulesettings_module_timemanagement").modal("toggle");
$("#externalAccessConfirm").modal("toggle");
}
function updateExAccess(){
$.ajax(
{
type: "GET",
url: "{% url 'dasettings-ajax' %}",
data:{
newvalue : "true",
agency : {{request.user.profile.agency.pk}},
action : 'changeexternalaccess'
},
success: function( data )
{
$("#externalAccessConfirm").modal("toggle");
$("#externalAccessUpdateAllow").modal("show");
$('#externalAccessUpdateAllow').on('hidden.bs.modal', function (e) {
location.href = location.href;
})
}
});
}
</script>
{% endblock content %}