Responsive Dashboard hinzugefügt
This commit is contained in:
aschwarz
8
templates/modern/dashboard/footer.html
Normal file
8
templates/modern/dashboard/footer.html
Normal file
@ -0,0 +1,8 @@
|
||||
<footer class="py-4 bg-light mt-auto">
|
||||
<div class="container-fluid px-4">
|
||||
<div class="d-flex align-items-center justify-content-between small">
|
||||
<div class="text-muted">Copyright © JU & MI 2023</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
106
templates/modern/dashboard/index.html
Normal file
106
templates/modern/dashboard/index.html
Normal file
@ -0,0 +1,106 @@
|
||||
{if $action == ''}
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
|
||||
<meta name="description" content="" />
|
||||
<meta name="author" content="" />
|
||||
<title>Login - SB Admin</title>
|
||||
<link href="css/styles.css" rel="stylesheet" />
|
||||
<script src="all.js" crossorigin="anonymous"></script>
|
||||
<script src="../jquery/jquery-3.4.1.min.js"></script>
|
||||
<script src="../js/lottie_bodymovin/lottie.min.js"></script>
|
||||
<style type="text/css">
|
||||
.lottie-container {
|
||||
justify-content: center;
|
||||
top: 40px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 20px;
|
||||
height: 180px;
|
||||
pointer-events: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="navtop"></div>
|
||||
{literal}
|
||||
<script>
|
||||
$(function(){
|
||||
$("#footer").load("footer.php");
|
||||
});
|
||||
</script>
|
||||
{/literal}
|
||||
<div id="layoutAuthentication">
|
||||
<div id="layoutAuthentication_content">
|
||||
<main>
|
||||
{if $index_error == '1'}
|
||||
<div class="alert alert-warning" role="alert">
|
||||
{$index_error_text}
|
||||
</div>
|
||||
{/if}
|
||||
<div class="container">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-5">
|
||||
<div class="card shadow-lg border-0 rounded-lg mt-5">
|
||||
<div class="card-header">
|
||||
<h3 class="text-center font-weight-light my-4">JU & MI Login</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<form action=?action=anmeld method="POST" name="login">
|
||||
<div class="form-floating mb-3">
|
||||
<input class="form-control" id="inputEmail" name="mail" type="email" placeholder="Mailadresse" />
|
||||
<label for="inputEmail">Mailadresse</label>
|
||||
</div>
|
||||
<div class="form-floating mb-3">
|
||||
<input class="form-control" id="inputPassword" name="password" type="password" placeholder="Passwort" />
|
||||
<label for="inputPassword">Passwort</label>
|
||||
</div>
|
||||
<!--<div class="form-check mb-3">
|
||||
<input class="form-check-input" id="inputRememberPassword" type="checkbox" value="" />
|
||||
<label class="form-check-label" for="inputRememberPassword">Remember Password</label>
|
||||
</div>
|
||||
-->
|
||||
<div class="d-flex align-items-center justify-content-between mt-4 mb-0">
|
||||
<!--<a class="small" href="password.html">Forgot Password?</a>-->
|
||||
|
||||
<input type='submit' class="btn btn-primary" name='senden' value="Login">
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="card-footer text-center py-3">
|
||||
<!--<div class="small"><a href="register.html">Need an account? Sign up!</a></div>-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="lottie-container" id="lottie-container"></div>
|
||||
<script type="text/javascript">
|
||||
var item = bodymovin.loadAnimation({
|
||||
wrapper: document.getElementById('lottie-container'),
|
||||
animType: 'svg',
|
||||
loop: true,
|
||||
autoplay: true,
|
||||
path: '../media/data.json'
|
||||
});
|
||||
</script>
|
||||
</main>
|
||||
</div>
|
||||
<div id="layoutAuthentication_footer">
|
||||
<!-- footer -->
|
||||
<div id="footer"></div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
|
||||
<script src="js/scripts.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
{/if}
|
||||
{if $action == 'anmeld'}
|
||||
{if $index_login == '1'}
|
||||
<meta http-equiv="refresh" content="0; URL=startseite.php">
|
||||
{/if}
|
||||
{/if}
|
||||
77
templates/modern/dashboard/nav.html
Normal file
77
templates/modern/dashboard/nav.html
Normal file
@ -0,0 +1,77 @@
|
||||
<div id="layoutSidenav_nav">
|
||||
<nav class="bg-juandmi sb-sidenav accordion sb-sidenav-dark" id="sidenavAccordion">
|
||||
<div class="sb-sidenav-menu">
|
||||
<div class="nav">
|
||||
<!--<div class="sb-sidenav-menu-heading">Core</div>-->
|
||||
<a class="nav-link" href="startseite.php">
|
||||
<div class="sb-nav-link-icon"><i class="fas fa-tachometer-alt"></i></div>
|
||||
Home
|
||||
</a>
|
||||
<div class="sb-sidenav-menu-heading">Umfrage</div>
|
||||
<a class="nav-link" href="survey_erfassen.php?new=1">
|
||||
<div class="sb-nav-link-icon"><i class="fas fa-tachometer-alt"></i></div>
|
||||
Erstellen
|
||||
</a>
|
||||
<!--
|
||||
<a class="nav-link collapsed" href="#" data-bs-toggle="collapse" data-bs-target="#collapseLayouts" aria-expanded="false" aria-controls="collapseLayouts">
|
||||
<div class="sb-nav-link-icon"><i class="fas fa-columns"></i></div>
|
||||
Erstellen
|
||||
<div class="sb-sidenav-collapse-arrow"><i class="fas fa-angle-down"></i></div>
|
||||
</a>
|
||||
<div class="collapse" id="collapseLayouts" aria-labelledby="headingOne" data-bs-parent="#sidenavAccordion">
|
||||
<nav class="sb-sidenav-menu-nested nav">
|
||||
<a class="nav-link" href="layout-static.html">Static Navigation</a>
|
||||
<a class="nav-link" href="layout-sidenav-light.html">Light Sidenav</a>
|
||||
</nav>
|
||||
</div>
|
||||
<a class="nav-link collapsed" href="#" data-bs-toggle="collapse" data-bs-target="#collapsePages" aria-expanded="false" aria-controls="collapsePages">
|
||||
<div class="sb-nav-link-icon"><i class="fas fa-book-open"></i></div>
|
||||
Pages
|
||||
<div class="sb-sidenav-collapse-arrow"><i class="fas fa-angle-down"></i></div>
|
||||
</a>
|
||||
<div class="collapse" id="collapsePages" aria-labelledby="headingTwo" data-bs-parent="#sidenavAccordion">
|
||||
<nav class="sb-sidenav-menu-nested nav accordion" id="sidenavAccordionPages">
|
||||
<a class="nav-link collapsed" href="#" data-bs-toggle="collapse" data-bs-target="#pagesCollapseAuth" aria-expanded="false" aria-controls="pagesCollapseAuth">
|
||||
Authentication
|
||||
<div class="sb-sidenav-collapse-arrow"><i class="fas fa-angle-down"></i></div>
|
||||
</a>
|
||||
<div class="collapse" id="pagesCollapseAuth" aria-labelledby="headingOne" data-bs-parent="#sidenavAccordionPages">
|
||||
<nav class="sb-sidenav-menu-nested nav">
|
||||
<a class="nav-link" href="login.html">Login</a>
|
||||
<a class="nav-link" href="register.html">Register</a>
|
||||
<a class="nav-link" href="password.html">Forgot Password</a>
|
||||
</nav>
|
||||
</div>
|
||||
<a class="nav-link collapsed" href="#" data-bs-toggle="collapse" data-bs-target="#pagesCollapseError" aria-expanded="false" aria-controls="pagesCollapseError">
|
||||
Error
|
||||
<div class="sb-sidenav-collapse-arrow"><i class="fas fa-angle-down"></i></div>
|
||||
</a>
|
||||
<div class="collapse" id="pagesCollapseError" aria-labelledby="headingOne" data-bs-parent="#sidenavAccordionPages">
|
||||
<nav class="sb-sidenav-menu-nested nav">
|
||||
<a class="nav-link" href="401.html">401 Page</a>
|
||||
<a class="nav-link" href="404.html">404 Page</a>
|
||||
<a class="nav-link" href="500.html">500 Page</a>
|
||||
</nav>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
-->
|
||||
<div class="sb-sidenav-menu-heading">Administration</div>
|
||||
<a class="nav-link" href="startseite.php">
|
||||
<div class="sb-nav-link-icon"><i class="fas fa-chart-area"></i></div>
|
||||
Systemparameter
|
||||
</a>
|
||||
<!--
|
||||
<a class="nav-link" href="tables.html">
|
||||
<div class="sb-nav-link-icon"><i class="fas fa-table"></i></div>
|
||||
Tables
|
||||
</a>
|
||||
-->
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-juandmi sb-sidenav-footer">
|
||||
<div class="small">Eingeloggt als:</div>
|
||||
{$nav_name}
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
30
templates/modern/dashboard/navtop.html
Normal file
30
templates/modern/dashboard/navtop.html
Normal file
@ -0,0 +1,30 @@
|
||||
<!--Navigation top-->
|
||||
<nav class="bg-juandmi sb-topnav navbar navbar-expand navbar-dark">
|
||||
<!-- Navbar Brand-->
|
||||
<a class="navbar-brand ps-3" href="index.html">Administration JU & MI</a>
|
||||
<!-- Sidebar Toggle: js/scripts.js in der callbackfunktion vom Load aufrufen beim einbetten-->
|
||||
<button class="btn btn-link btn-sm order-1 order-lg-0 me-4 me-lg-0" id="sidebarToggle" href="#!"><i class="fas fa-bars"></i></button>
|
||||
<!-- Navbar Search-->
|
||||
<form class="d-none d-md-inline-block form-inline ms-auto me-0 me-md-3 my-2 my-md-0">
|
||||
<!--
|
||||
<div class="input-group">
|
||||
<input class="form-control" type="text" placeholder="Search for..." aria-label="Search for..." aria-describedby="btnNavbarSearch" />
|
||||
<button class="btn btn-primary" id="btnNavbarSearch" type="button"><i class="fas fa-search"></i></button>
|
||||
</div>
|
||||
-->
|
||||
</form>
|
||||
<!-- Navbar-->
|
||||
<ul class="navbar-nav ms-auto ms-md-0 me-3 me-lg-4">
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" id="navbarDropdown" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false"><i class="fas fa-user fa-fw"></i></a>
|
||||
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdown">
|
||||
<!--
|
||||
<li><a class="dropdown-item" href="tables.html">Settings</a></li>
|
||||
<li><a class="dropdown-item" href="#!">Activity Log</a></li>
|
||||
<li><hr class="dropdown-divider" /></li>
|
||||
-->
|
||||
<li><a class="dropdown-item" href="logout.php">Logout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
55
templates/modern/dashboard/startseite.html
Normal file
55
templates/modern/dashboard/startseite.html
Normal file
@ -0,0 +1,55 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
|
||||
<meta name="description" content="" />
|
||||
<meta name="author" content="" />
|
||||
<title>Dashboard - SB Admin</title>
|
||||
<link href="../bootstrap/node_modules/bootstrap/dist/css/bootstrap.ali.css" rel="stylesheet">
|
||||
<!-- nochmals bootstrap.css mit Erweiterungen vom Dashboard -->
|
||||
<link href="css/styles.css" rel="stylesheet" />
|
||||
<!-- icons in nav-->
|
||||
<script src="all.js" crossorigin="anonymous"></script>
|
||||
<script src="../jquery/jquery-3.4.1.min.js"></script>
|
||||
</head>
|
||||
<body class="sb-nav-fixed">
|
||||
<div id="navtop"></div>
|
||||
{literal}
|
||||
<script>
|
||||
$(function(){
|
||||
// im Navbar muss der toggle in der Callbackfunktion definiert werden. Sonst findet jquery getelementbyID nicht
|
||||
$("#navtop").load('navtop.php', null, function(){$.getScript('js/scripts.js');});
|
||||
$("#navleft").load("nav.php");
|
||||
$("#footer").load("footer.php");
|
||||
});
|
||||
</script>
|
||||
{/literal}
|
||||
<div id="layoutSidenav">
|
||||
<!-- Navigation left -->
|
||||
<div id="navleft"></div>
|
||||
<div id="layoutSidenav_content">
|
||||
<main>
|
||||
<br>
|
||||
<div class="container-fluid">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<i class="fas fa-user me-1"></i>
|
||||
Herzlich willkommen {$startseite_name}
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<p class="card-text">Herzlich willkommen zur Administration von Jugendchor & Miteinander.<br><br>
|
||||
Bitte Treffen Sie im Menü eine Auswahl!
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<!-- footer -->
|
||||
<div id="footer"></div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="../bootstrap/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
379
templates/modern/dashboard/survey_erfassen.html
Normal file
379
templates/modern/dashboard/survey_erfassen.html
Normal file
@ -0,0 +1,379 @@
|
||||
{if $action == ''}
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="../jquery/jquery-ui.css">
|
||||
<link rel="stylesheet" href="../jquery/jquery.timepicker.min.css">
|
||||
<script src="../jquery/jquery-1.12.4.js"></script>
|
||||
<script src="../jquery/jquery-ui.js"></script>
|
||||
<script src="../jquery/globalize.js"></script>
|
||||
<script src="../jquery/globalize.culture.de-DE.js"></script>
|
||||
<script src="../jquery/jquery.mousewheel.js"></script>
|
||||
<script src="../jquery/jquery.timepicker.min.js"></script>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link href="../bootstrap/node_modules/bootstrap/dist/css/bootstrap.ali.css" rel="stylesheet">
|
||||
<script src="../bootstrap/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<!-- nochmals bootstrap.css mit Erweiterungen vom Dashboard -->
|
||||
<link href="css/styles.css" rel="stylesheet" />
|
||||
<!-- icons in nav-->
|
||||
<script src="all.js" crossorigin="anonymous"></script>
|
||||
<link rel="stylesheet" href="../bootstrap/node_modules/bootstrap-icons/font/bootstrap-icons.css">
|
||||
<style type="text/css">
|
||||
.spinner {
|
||||
width: 112px;
|
||||
height: 15px;
|
||||
font-size: 12px !important;
|
||||
}
|
||||
.btn-group > .btn{
|
||||
margin-bottom:20px;
|
||||
border-radius:20px !important;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
$( function() {
|
||||
$( ".spinner" ).spinner({
|
||||
change: function (event, ui) {
|
||||
<!--calc_erm_78();-->
|
||||
},
|
||||
spin: function (event, ui) {
|
||||
<!--calc_erm_78();-->
|
||||
},
|
||||
start: function (event, ui) {
|
||||
<!--calc_erm_78();-->
|
||||
},
|
||||
stop: function (event, ui) {
|
||||
<!--calc_erm_78();-->
|
||||
},
|
||||
step: 1,
|
||||
numberFormat: "i",
|
||||
min:0,
|
||||
decimals:0
|
||||
});
|
||||
Globalize.culture( "de-DE" );
|
||||
} );
|
||||
|
||||
function trackKeys(evnt,regEx) {
|
||||
var keyCode = evnt.keyCode ? evnt.keyCode : evnt.which;
|
||||
return !!String.fromCharCode(keyCode).match(regEx);
|
||||
}
|
||||
//-->
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
$(".datepicker").datepicker({
|
||||
prevText: '< zurück', prevStatus: '',
|
||||
prevJumpText: '<<', prevJumpStatus: '',
|
||||
changeMonth: true,
|
||||
changeYear: true,
|
||||
nextText: 'Vor >', nextStatus: '',
|
||||
nextJumpText: '>>', nextJumpStatus: '',
|
||||
currentText: 'Heute', currentStatus: '',
|
||||
todayText: 'Heute', todayStatus: '',
|
||||
clearText: '-', clearStatus: '',
|
||||
closeText: 'schließen', closeStatus: '',
|
||||
monthNames: ['Januar','Februar','März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember'],
|
||||
monthNamesShort: ['Jan','Feb','Mär','Apr','Mai','Jun','Jul','Aug','Sep','Okt','Nov','Dez'],
|
||||
dayNames: ['Sonntag','Montag','Dienstag','Mittwoch','Donnerstag','Freitag','Samstag'],
|
||||
dayNamesShort: ['So','Mo','Di','Mi','Do','Fr','Sa'],
|
||||
dayNamesMin: ['So','Mo','Di','Mi','Do','Fr','Sa'],
|
||||
weekHeader: 'Wo',
|
||||
weekStatus: 'Woche des Monats',
|
||||
showMonthAfterYear: false,
|
||||
showOn: 'focus',
|
||||
firstDay: 1,
|
||||
numberOfMonths : 1,
|
||||
yearRange: "c-5:+5",
|
||||
showButtonPanel : true,
|
||||
altField : "#datepicker_input",
|
||||
dateFormat : "dd.mm.yy",
|
||||
showWeek: true
|
||||
});
|
||||
$.datepicker._gotoToday = function(id) {
|
||||
$(id).datepicker('setDate', new Date()).datepicker('hide').blur();
|
||||
}
|
||||
|
||||
});
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function(){
|
||||
$('input.timepicker').timepicker({
|
||||
timeFormat: 'HH:mm',
|
||||
interval: 30,
|
||||
minTime: '00:00',
|
||||
maxTime: '23:00',
|
||||
startTime: '0',
|
||||
dynamic: false,
|
||||
dropdown: true,
|
||||
scrollbar: true
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body class="sb-nav-fixed">
|
||||
<div id="navtop"></div>
|
||||
{literal}
|
||||
<script>
|
||||
$(function(){
|
||||
// im Navbar muss der toggle in der Callbackfunktion definiert werden. Sonst findet jquery getelementbyID nicht
|
||||
$("#navtop").load('navtop.php', null, function(){$.getScript('js/scripts.js');});
|
||||
$("#navleft").load("nav.php");
|
||||
$("#footer").load("footer.php");
|
||||
});
|
||||
</script>
|
||||
{/literal}
|
||||
<div id="layoutSidenav">
|
||||
<!-- Navigation left -->
|
||||
<div id="navleft"></div>
|
||||
<div id="layoutSidenav_content">
|
||||
<main>
|
||||
<form action="?action=fragen" method='post' name='erfassen'>
|
||||
{if $umfrageerf_error == '1'}
|
||||
<div class="alert alert-warning" role="alert">
|
||||
{$umfrageerf_error_text}
|
||||
</div>
|
||||
{/if}
|
||||
<div class="container-fluid">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<i class="fas fa-table me-1"></i>
|
||||
Zeitraum der Umfrage und Bezeichnung
|
||||
</div>
|
||||
<div class="row mt-0 mt-sm-4 mb-0 mb-sm-4">
|
||||
<div class="col-12 col-md-4">Link verfügbar ab Datum:</div>
|
||||
<div class="col-12 col-md-8"><input type="text" class="datepicker form-control" name="datumvon" id="datumvon" value="{$umfrageerf_value_datumvon}"></div>
|
||||
</div>
|
||||
<div class="row mt-0 mt-sm-4 mb-0 mb-sm-4">
|
||||
<div class="col-12 col-md-4">Link verfügbar ab Uhrzeit:</div>
|
||||
<div class="col-12 col-md-8"><input type="text" class="timepicker form-control" name="zeitvon" id="zeitvon" value="{$umfrageerf_value_zeitvon}" onKeypress="return trackKeys(event,/[0-9,:]/);"></div>
|
||||
</div>
|
||||
<div class="row mt-0 mt-sm-4 mb-0 mb-sm-4">
|
||||
<div class="col-12 col-md-4">Link verfügbar bis Datum:</div>
|
||||
<div class="col-12 col-md-8"><input type="text" class="datepicker form-control" name="datumbis" id="datumbis" value="{$umfrageerf_value_datumbis}"></div>
|
||||
</div>
|
||||
<div class="row mt-0 mt-sm-4 mb-0 mb-sm-4">
|
||||
<div class="col-12 col-md-4">Link verfügbar bis Uhrzeit:</div>
|
||||
<div class="col-12 col-md-8"><input type="text" class="timepicker form-control" name="zeitbis" id="zeitbis" value="{$umfrageerf_value_zeitbis}" onKeypress="return trackKeys(event,/[0-9,:]/);"></div>
|
||||
</div>
|
||||
<div class="row mt-0 mt-sm-4 mb-0 mb-sm-4">
|
||||
<div class="col-12 col-md-4">Headline der Umfrage:</div>
|
||||
<div class="col-12 col-md-8"><input class="form-control" type="text" name="headline" id="headline" value="{$umfrageerf_value_headline}" size="60"></div>
|
||||
</div>
|
||||
<div class="row mt-0 mt-sm-4 mb-0 mb-sm-4">
|
||||
<div class="col-12 col-md-4">Bemerkungsfeld am Ende der Umfrage:</div>
|
||||
<div class="col-12 col-md-8">
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" type="checkbox" name="freitext" id="freitext" value="{$umfrageerf_value_freitext}" {if $umfrageerf_value_freitext == 1} checked {/if}>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 btn-group">
|
||||
<input type='submit' class="btn btn-primary" name='senden' value="Weiter - Fragen erfassen">
|
||||
</div>
|
||||
</form>
|
||||
</main>
|
||||
<!-- footer -->
|
||||
<div id="footer"></div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
{/if}
|
||||
{if $action == 'fragen'}
|
||||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="description" content="Scrollable tab for Bootstrap 5">
|
||||
<meta name="keywords" content="Bootstrap, Bootstrap 5, Tabs">
|
||||
<meta name="author" content="Federico Navarrete">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link href="../bootstrap/node_modules/bootstrap/dist/css/bootstrap.ali.css" rel="stylesheet">
|
||||
<script src="../bootstrap/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<!-- nochmals bootstrap.css mit Erweiterungen vom Dashboard -->
|
||||
<link href="css/styles.css" rel="stylesheet" />
|
||||
<!-- icons in nav-->
|
||||
<script src="all.js" crossorigin="anonymous"></script>
|
||||
<link rel="stylesheet" href="../bootstrap/node_modules/bootstrap-icons/font/bootstrap-icons.css">
|
||||
<script src="../jquery/jquery-3.4.1.min.js"></script>
|
||||
<!-- jQuery UI CSS
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
|
||||
-->
|
||||
<script src="../jquery/jquery-ui.js"></script>
|
||||
<style>
|
||||
.btn-group > .btn{
|
||||
margin-bottom:20px;
|
||||
border-radius:20px !important;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
{literal}
|
||||
|
||||
|
||||
function keysave(ele) {
|
||||
if(event.key === 'Enter') {
|
||||
erfassensave();
|
||||
}
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
|
||||
//Helper function to keep table row from collapsing when being sorted
|
||||
var fixHelperModified = function(e, tr) {
|
||||
var $originals = tr.children();
|
||||
var $helper = tr.clone();
|
||||
$helper.children().each(function(index)
|
||||
{
|
||||
$(this).width($originals.eq(index).width())
|
||||
});
|
||||
return $helper;
|
||||
};
|
||||
|
||||
//Make diagnosis table sortable
|
||||
$("#sortable tbody").sortable({
|
||||
helper: fixHelperModified,
|
||||
stop: function(event,ui) {
|
||||
renumber_table('#sortable')
|
||||
var order = $('#sortable tbody').sortable('toArray', { attribute: 'data-sort-id'});
|
||||
console.log(order.join(','));
|
||||
sortOrder = order.join(',');
|
||||
$.post(
|
||||
'../controller/reihenfolge.ajax.php',
|
||||
{'action':'updateSortedRows','sortOrder':sortOrder},
|
||||
function(data){
|
||||
var a = data.split('|***|');
|
||||
if(a[1]=="update"){
|
||||
$('#msg').show().delay(1000).fadeOut(500);
|
||||
$('#msg').html(a[0]);
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
}
|
||||
}).disableSelection();
|
||||
|
||||
|
||||
});
|
||||
|
||||
//Renumber table rows
|
||||
function renumber_table(tableID) {
|
||||
$(tableID + " tr").each(function() {
|
||||
count = $(this).parent().children().index($(this)) + 1;
|
||||
$(this).find('.priority').html(count);
|
||||
});
|
||||
}
|
||||
|
||||
{/literal}
|
||||
</script>
|
||||
<style type="text/css">
|
||||
.ui-sortable tr {
|
||||
cursor:pointer;
|
||||
}
|
||||
.ui-sortable tr:hover {
|
||||
background:rgba(244,251,17,0.45);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<!--<body onload="if(document.erfassen)document.erfassen.{$umfrageerf_focus}.focus();return false;">-->
|
||||
<body class="sb-nav-fixed">
|
||||
<div id="navtop"></div>
|
||||
{literal}
|
||||
<script>
|
||||
$(function(){
|
||||
// im Navbar muss der toggle in der Callbackfunktion definiert werden. Sonst findet jquery getelementbyID nicht
|
||||
$("#navtop").load('navtop.php', null, function(){$.getScript('js/scripts.js');});
|
||||
$("#navleft").load("nav.php");
|
||||
$("#footer").load("footer.php");
|
||||
});
|
||||
</script>
|
||||
{/literal}
|
||||
<div id="layoutSidenav">
|
||||
<!-- Navigation left -->
|
||||
<div id="navleft"></div>
|
||||
<div id="layoutSidenav_content">
|
||||
<main>
|
||||
<!--Anwendung-->
|
||||
<script src="../js/components/admin_erfassen.js"></script>
|
||||
<div class="container-fluid">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<i class="fas fa-table me-1"></i>
|
||||
Frage & Antworten erfassen
|
||||
</div>
|
||||
<div class="row mt-0 mt-sm-4 mb-0 mb-sm-4">
|
||||
<div class="col-12 col-md-4">Frage:</div>
|
||||
<div class="col-12 col-md-8"><input class="form-control" type="text" name="frage" id="frage" value="{$umfrageerf_value_frage}" size="60" onkeydown="keysave(this)"></div>
|
||||
</div>
|
||||
<div class="row mt-0 mt-sm-4 mb-0 mb-sm-4">
|
||||
<div class="col-12 col-md-4">Antwort:</div>
|
||||
<div class="col-12 col-md-8"><input class="form-control" type="text" name="antwort" id="antwort" value="{$umfrageerf_value_antwort}" size="60" onkeydown="keysave(this)"></div>
|
||||
</div>
|
||||
<div class="row mt-0 mt-sm-4 mb-0 mb-sm-4">
|
||||
<div class="col-12 col-md-4">Mehrfachantworten erlauben:</div>
|
||||
<div class="col-12 col-md-8"><input class="form-check-input" type="checkbox" name="multiple" id="multiple" value="1" onclick="erf_multiple();" {if $umfrageerf_value_multiple == 1} checked {/if}></div>
|
||||
</div>
|
||||
</div>
|
||||
<p align='center'>
|
||||
<div class="col-12">
|
||||
<a type="submit" href="?" class="btn btn-light btn-sm">Zurück</a>
|
||||
<button class="btn btn-primary btn-sm" id="save" onclick="erfassensave();">Speichern</button>
|
||||
</div>
|
||||
</p>
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<i class="fas fa-table me-1"></i>
|
||||
Vorschau der Fragen
|
||||
</div>
|
||||
<div class="w-100 pt-3">
|
||||
<div class="scroller scroller-left float-start mt-2"><i class="bi bi-caret-left-fill"></i></div>
|
||||
<div class="scroller scroller-right float-end mt-2"><i class="bi bi-caret-right-fill"></i></div>
|
||||
<div class="wrapper-nav">
|
||||
<nav class="nav nav-tabs list mt-2" id="myTab" role="tablist">
|
||||
{section name=table_data1 loop=$table_data1}
|
||||
<a {if $table_data1[table_data1].ufid == $umfrageerf_gesp_werte_value_ufid2} class="nav-item nav-link pointer active" {else} class="nav-item nav-link pointer" {/if} data-bs-target="#tab{$table_data1[table_data1].ufid}" href="?action=fragen&tabufid={$table_data1[table_data1].ufid}&erfassen=1"role="tab" aria-controls="public" {if $smarty.section.table_data1.rownum == $umfrageerf_gesp_werte_value_ufid2} aria-selected="true" {/if}>Frage {$smarty.section.table_data1.rownum}</a>
|
||||
{/section}
|
||||
<a class="nav-item nav-link pointer" data-bs-target="#neuefrage" href="?action=fragen&tabufid=neuefrage&erfassen=1" role="tab">Neue Frage</a>
|
||||
</nav>
|
||||
</div>
|
||||
<div class="tab-content p-3" id="myTabContent">
|
||||
<div role="tabpanel" class="tab-pane fade active show mt-2" id="tab{$umfrageerf_gesp_werte_value_ufid2}" aria-labelledby="public-tab" >
|
||||
<h6>{$umfrageerf_value_frage}</h6>
|
||||
<br>
|
||||
{if $table_data2_anz > 0}
|
||||
<table class="table" id="sortable">
|
||||
<thead>
|
||||
<tr>
|
||||
<th width="20%">Sortierung</th>
|
||||
<th width="60%">Antwort</th>
|
||||
<th width="20%">Löschen</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="tb">
|
||||
{section name=table_data2 loop=$table_data2}
|
||||
<tr data-sort-id="{$table_data2[table_data2].uaid}">
|
||||
<td valign="middle" class="priority">{$smarty.section.table_data2.rownum}</td>
|
||||
<td valign="middle">{$table_data2[table_data2].antwort}</td>
|
||||
<td valign="middle"><button class="btn btn-delete btn-danger btn-sm" onclick="onClickDelete({$table_data2[table_data2].uaid})">Löschen</button></td>
|
||||
</tr>
|
||||
{/section}
|
||||
</table>
|
||||
<div id="msg"></div>
|
||||
{/if}
|
||||
<p align='center'><button class="btn btn-delete btn-danger btn-sm" onclick="onClickDeleteQuestion({$umfrageerf_value_ufid})">Frage Löschen</button></p>
|
||||
</div>
|
||||
<div class="tab-pane fade mt-2" id="neuefrage" role="tabpanel" aria-labelledby="group-dropdown2-tab" >
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<!-- footer -->
|
||||
<div id="footer"></div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="../bootstrap/node_modules/move-js/move.js"></script>
|
||||
<link href="../bootstrap/dist/scrollable-tabs.min.css" rel="stylesheet">
|
||||
<script src="../bootstrap/dist/scrollable-tabs.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
{/if}
|
||||
Reference in New Issue
Block a user