2
0
mirror of https://github.com/ACSPRI/queXS synced 2024-04-02 12:12:16 +00:00

New look,

Fetures: checkboxes transformed to toggle switches, clockpicker for time input
readonly input fields :  input time with clockpicker  only (to avoid input typing and format mistakes), better visualisation for year and weeks selection (in addsgift.php)
This commit is contained in:
Alex
2015-03-23 16:59:35 +03:00
parent c876fbd21a
commit a4e32c4d66
4 changed files with 603 additions and 595 deletions

View File

@@ -137,14 +137,14 @@ if (isset($_POST['submit']))
} }
xhtml_head(T_("Add shifts"),true,array("../css/shifts.css"),array("../js/window.js")); xhtml_head(T_("Shift management"),true,array("../include/bootstrap-3.3.2/css/bootstrap.min.css","../include/clockpicker/dist/bootstrap-clockpicker.min.css","../include/bootstrap-toggle/css/bootstrap-toggle.min.css","../css/custom.css"),array("../js/jquery-2.1.3.min.js","../include/bootstrap-3.3.2/js/bootstrap.min.js","../include/clockpicker/dist/bootstrap-clockpicker.js","../include/bootstrap-toggle/js/bootstrap-toggle.min.js","../js/window.js"));
//"../css/shifts.css",
/** /**
* Display warning if timezone data not installed * Display warning if timezone data not installed
* *
*/ */
$sql = "SELECT CONVERT_TZ(NOW(),'Australia/Victoria','UTC') as t"; $sql = "SELECT CONVERT_TZ(NOW(),'SYSTEM','UTC') as t";
$rs = $db->GetRow($sql); $rs = $db->GetRow($sql);
if (empty($rs) || !$rs || empty($rs['t'])) if (empty($rs) || !$rs || empty($rs['t']))
@@ -160,37 +160,37 @@ if (empty($rs) || !$rs || empty($rs['t']))
* @todo Use javascript to add shifts if necessarry outside the template * @todo Use javascript to add shifts if necessarry outside the template
*/ */
print "<h2>" . T_("Add shifts in your Time Zone") . "</h2>"; print "<h3 class='col-sm-4'>" . T_("Add shifts in your Time Zone") . "</h3>";
print "<p>" . T_("Shifts allow you to restrict appointments being made, and interviewers to working on a particlar project at defined times.") . "</p>"; print "<p class='well col-sm-8'>" . T_("Shifts allow you to restrict appointments being made, and interviewers to working on a particlar project at defined times.") . "</p>";
print "<h3>" . T_("Select a questionnaire from the list below") . "</h3>"; print "<div class='clearfix form-group'><h3 class='col-sm-4 text-right'>" . T_("Select a questionnaire") . ":</h3>";
display_questionnaire_chooser($questionnaire_id); display_questionnaire_chooser($questionnaire_id,false, "form-inline", "form-control");
print "</div><div class='panel-body'>";
if ($questionnaire_id != false) if ($questionnaire_id != false)
{ {
print "<p>" . T_("Select year") . ": "; print "<h4>" . T_("Select year") . ":&emsp;&ensp;";
for ($i = $year - 1; $i < $year + 4; $i++) for ($i = $year - 1; $i < $year + 4; $i++)
{ {
if ($i == $year) if ($i == $year)
print "$i "; print "<span class='btn-lg btn btn-default'><b class='fa text-danger '>$i</b></span>";
else else
print "<a href=\"?year=$i&amp;woy=$woy&amp;questionnaire_id=$questionnaire_id\">$i</a> "; print "<a href=\"?year=$i&amp;woy=$woy&amp;questionnaire_id=$questionnaire_id\"> $i </a> ";
} }
print "</p>"; print "</h4>";
print "<p>" . T_("Select week of year") . ": "; print "<h4>" . T_("Select week") . ":&emsp;";
for ($i = 1; $i <= 53; $i++) for ($i = 1; $i <= 53; $i++)
{ {
if ($i == $woy) if ($i == $woy)
print "$i "; print "<span class='btn-lg btn btn-default'><b class='fa text-danger '>$i</b></span>";
else else
print "<a href=\"?woy=$i&amp;year=$year&amp;questionnaire_id=$questionnaire_id\">$i</a> "; print "<a href=\"?woy=$i&amp;year=$year&amp;questionnaire_id=$questionnaire_id\"> $i </a> ";
} }
print "</p>"; print "</h4>";
$sql = "SELECT shift_id, dt, dta,start,end $sql = "SELECT shift_id, dt, dta,start,end
FROM ( FROM (
@@ -232,10 +232,10 @@ if ($questionnaire_id != false)
$daysofweek[$key]['description'] = $val['dtd'] . " " . $val['dto']; $daysofweek[$key]['description'] = $val['dtd'] . " " . $val['dto'];
?> ?>
<form method="post" action=""> <form method="post" action="" class="panel-body">
<table> <table class="table-bordered table-condensed table-hover">
<?php <?php
print "<tr><th>" . T_("Day") . "</th><th>" . T_("Start") . "</th><th>" . T_("End") . "</th><th>" . T_("Use shift?") . "</th></tr>"; print "<thead><tr><th>" . T_("Day") . "</th><th>" . T_("Start") . "</th>&ensp;<th>" . T_("End") . "</th><th>" . T_("Use shift?") . "</th></tr></thead>";
$count = 1; $count = 1;
foreach($shifts as $shift) foreach($shifts as $shift)
{ {
@@ -253,21 +253,26 @@ if ($questionnaire_id != false)
} }
print "<tr><td>"; print "<tr><td>";
display_chooser($daysofweek, $prefix . "dow_$shift_id", false, true, false, false, false, array("dt",$shift['dt'])); display_chooser($daysofweek, $prefix . "dow_$shift_id", false, true, false, false, false, array("dt",$shift['dt']));
print "</td><td><input size=\"8\" name=\"" . $prefix ."start_$shift_id\" maxlength=\"8\" type=\"text\" value=\"{$shift['start']}\"/></td><td><input name=\"" . $prefix ."end_$shift_id\" type=\"text\" size=\"8\" maxlength=\"8\" value=\"{$shift['end']}\"/></td><td><input name=\"" . $prefix ."use_$shift_id\" type=\"checkbox\" $checked/></td></tr>"; print "</td><td><div class=\"input-group clockpicker\"><input readonly size=\"8\" name=\"" . $prefix ."start_$shift_id\" maxlength=\"8\" type=\"time\" value=\"{$shift['start']}\" class=\"form-control \"/><span class=\"input-group-addon\"><span class=\"glyphicon glyphicon-time fa\"></span></span></div></td><td><div class=\"input-group clockpicker\"><input readonly name=\"" . $prefix ."end_$shift_id\" type=\"text\" size=\"8\" maxlength=\"8\" value=\"{$shift['end']}\" class=\"form-control\"/><span class=\"input-group-addon\"><span class=\"glyphicon glyphicon-time fa\"></span></span></div></td><td class=\"text-center\"><input name=\"" . $prefix ."use_$shift_id\" type=\"checkbox\" class=\"form-control fa\" data-toggle=\"toggle\" data-size=\"\" data-on=" . TQ_("Yes") . " data-off=" . TQ_("No") . " $checked/></td></tr>";
$count++; $count++;
} }
?> ?>
<!--<tr><td/><td/><td/><td>Select all</td></tr>--> <!--<tr><td/><td/><td/><td>Select all</td></tr>-->
</table> </table></br>
<!--<p><input type="submit" name="addshift" value="Add Shift"/></p>--> <!--<p><input type="submit" name="addshift" value="Add Shift"/></p>-->
<p><input type="submit" name="submit" value="<?php echo T_("Submit changes"); ?>"/></p> <input type="submit" name="submit" value="<?php echo T_("Save changes"); ?>" class="btn btn-primary"/>
<p><input type="hidden" name="year" value="<?php echo $year; ?>"/></p> <input type="hidden" name="year" value="<?php echo $year; ?>"/>
<p><input type="hidden" name="woy" value="<?php echo $woy; ?>"/></p> <input type="hidden" name="woy" value="<?php echo $woy; ?>"/>
<p><input type="hidden" name="qid" value="<?php echo $questionnaire_id; ?>"/></p> <input type="hidden" name="qid" value="<?php echo $questionnaire_id; ?>"/>
</form> </form>
<?php <?php
} }
print "</div>";
xhtml_foot(); xhtml_foot();
?> ?>
<script type="text/javascript">
$('.clockpicker').clockpicker({
autoclose: true
});
</script>

View File

@@ -118,7 +118,7 @@ if (empty($rs) || !$rs || empty($rs['t']))
print "<div class='alert alert-danger'><a href='http://dev.mysql.com/doc/mysql/en/time-zone-support.html'>" . T_("Your database does not have timezones installed, please see here for details") . "</a></div>"; print "<div class='alert alert-danger'><a href='http://dev.mysql.com/doc/mysql/en/time-zone-support.html'>" . T_("Your database does not have timezones installed, please see here for details") . "</a></div>";
print "<div><a class='btn btn-default' href='availabilitygroup.php'>" . T_("Go back") . "</a></div>"; print "<div><a class='btn btn-default' href='availabilitygroup.php'>" . T_("Go back") . "</a></div><br/>";
$sql = "SELECT description $sql = "SELECT description
@@ -129,9 +129,8 @@ $rs = $db->GetRow($sql);
$description = $rs['description']; $description = $rs['description'];
print "<h3>" . T_("Time slot name") . " :&emsp;<span class = 'text-primary'>" . $rs['description'] . "</span></h3>"; print "<h3>" . T_("Time slot") . " :&emsp;<span class = 'text-primary '>" . $rs['description'] . "</span></h3>";
print "<div class='well'>" . T_("Enter the start and end times for each day of the week to restrict calls within") . "</div>";
/** /**
* Begin displaying currently loaded restriction times * Begin displaying currently loaded restriction times
*/ */
@@ -151,9 +150,12 @@ translate_array($daysofweek,array("description"));
?> ?>
<div class=" panel-body col-sm-4"><form method="post" action=""> <div class=" panel-body col-sm-4"><form method="post" action="">
<p><label class="control-label"for="description"><?php echo T_("Time slot group name"); ?>: </label><input class="form-control" type="text" name="description" id="description" value="<?php echo $description;?>"/></p> <p><label class="control-label"for="description"><?php echo T_("Edit Time slot group name"); ?>: </label><input class="form-control" type="text" name="description" id="description" value="<?php echo $description;?>"/></p>
<table class="table-hover table-condensed "><thead class="highlight"> <table class="table-hover table-condensed "><thead class="highlight">
<?php <?php
print "<div class='well text-info'>" . T_("Enter the start and end times for each day of the week to restrict calls within") . "</div>";
print "<tr><th>" . T_("Day") . "</th><th>" . T_("Start") . "</th><th>" . T_("End") . "</th></tr></thead><tbody>"; print "<tr><th>" . T_("Day") . "</th><th>" . T_("Start") . "</th><th>" . T_("End") . "</th></tr></thead><tbody>";
$count = 0; $count = 0;
foreach($availabilitys as $availability) foreach($availabilitys as $availability)

View File

@@ -137,12 +137,14 @@ translate_array($daysofweek,array("description"));
{ {
print "<tr id='row-$count' ><td>";//class='row_to_clone' /* these are not the rows to clone...*/ print "<tr id='row-$count' ><td>";//class='row_to_clone' /* these are not the rows to clone...*/
display_chooser($daysofweek, "day[$count]", false, true, false, false, false, array("description",$shift['dt'])); display_chooser($daysofweek, "day[$count]", false, true, false, false, false, array("description",$shift['dt']));
print "</td><td><input class=\"form-control clockpicker\" size=\"8\" name=\"start[$count]\" maxlength=\"8\" type=\"text\" value=\"{$shift['start']}\"/></td><td><input class=\"form-control clockpicker\" name=\"end[$count]\" type=\"text\" size=\"8\" maxlength=\"8\" value=\"{$shift['end']}\"/></td></tr>"; print "</td><td><div class=\"input-group clockpicker\"><input readonly class=\"form-control\" size=\"8\" name=\"start[$count]\" maxlength=\"8\" type=\"text\" value=\"{$shift['start']}\"/><span class=\"input-group-addon\"><span class=\"glyphicon glyphicon-time fa\"></span></span></div></td>
<td><div class=\"input-group clockpicker\"><input readonly class=\"form-control\" name=\"end[$count]\" type=\"text\" size=\"8\" maxlength=\"8\" value=\"{$shift['end']}\"/><span class=\"input-group-addon\"><span class=\"glyphicon glyphicon-time fa\"></span></span></div></td></tr>";
$count++; $count++;
} }
print "<tr class='row_to_clone' id='row-$count'><td>"; print "<tr class='row_to_clone' id='row-$count'><td>";
display_chooser($daysofweek, "day[$count]", false, true, false, false, false, false); display_chooser($daysofweek, "day[$count]", false, true, false, false, false, false);
print "</td><td><input class=\"form-control clockpicker\" size=\"8\" name=\"start[$count]\" maxlength=\"8\" type=\"text\" value=\"08:00:00\"/></td><td><input class=\"form-control clockpicker\" name=\"end[$count]\" type=\"text\" size=\"8\" maxlength=\"8\" value=\"20:00:00\"/></td></tr>"; print "</td><td><div class=\"input-group clockpicker\"><input readonly class=\"form-control\" size=\"8\" name=\"start[$count]\" maxlength=\"8\" type=\"text\" value=\"08:00:00\"/><span class=\"input-group-addon\"><span class=\"glyphicon glyphicon-time fa\"></span></span></div></td>
<td><div class=\"input-group clockpicker\"><input readonly class=\"form-control\" name=\"end[$count]\" type=\"text\" size=\"8\" maxlength=\"8\" value=\"20:00:00\"/><span class=\"input-group-addon\"><span class=\"glyphicon glyphicon-time fa\"></span></span></div></td></tr>";
?> ?>

View File

@@ -102,7 +102,7 @@ if (empty($rs) || !$rs || empty($rs['t']))
/** /**
* Display warning if timezone data not installed * Display warning if timezone data not installed
*
*/ */
//print "<h1>" . T_("Set default shift times") . "</h1>"; //print "<h1>" . T_("Set default shift times") . "</h1>";
@@ -135,15 +135,14 @@ translate_array($daysofweek,array("description"));
print "<tr id='row-$count'><td>";// class='row_to_clone' /* these are not the rows to clone...*/ print "<tr id='row-$count'><td>";// class='row_to_clone' /* these are not the rows to clone...*/
display_chooser($daysofweek, "day[$count]", false, true, false, false, false, array("description",$shift['dt'])); display_chooser($daysofweek, "day[$count]", false, true, false, false, false, array("description",$shift['dt']));
print "</td> print "</td>
<td> <input class=\"form-control clockpicker\" size=\"8\" maxlength=\"8\" name=\"start[$count]\" type=\"text\" value=\"{$shift['start']}\"/></td> <td><div class=\"input-group clockpicker\"><input readonly class=\"form-control\" size=\"8\" maxlength=\"8\" name=\"start[$count]\" type=\"text\" value=\"{$shift['start']}\"/><span class=\"input-group-addon\"><span class=\"glyphicon glyphicon-time fa\"></span></span></div></td>
<td> <input class=\"form-control clockpicker\" size=\"8\" maxlength=\"8\" name=\"end[$count]\" type=\"text\" value=\"{$shift['end']}\"/></td> <td><div class=\"input-group clockpicker\"><input readonly class=\"form-control\" size=\"8\" maxlength=\"8\" name=\"end[$count]\" type=\"text\" value=\"{$shift['end']}\"/><span class=\"input-group-addon\"><span class=\"glyphicon glyphicon-time fa\"></span></span></div></td></tr>";
</tr>";
$count++; $count++;
} }
print "<tr class='row_to_clone' id='row-$count'><td>"; print "<tr class='row_to_clone' id='row-$count'><td>";
display_chooser($daysofweek, "day[$count]", false, true, false, false, false, false); display_chooser($daysofweek, "day[$count]", false, true, false, false, false, false);
print " </td> <td><input class=\"form-control clockpicker\" size=\"8\" maxlength=\"8\" name=\"start[$count]\" type=\"text\" value=\"08:00:00\"/></td> print " </td><td><div class=\"input-group clockpicker\"><input readonly class=\"form-control\" size=\"8\" maxlength=\"8\" name=\"start[$count]\" type=\"text\" value=\"08:00:00\"/><span class=\"input-group-addon\"><span class=\"glyphicon glyphicon-time fa\"></span></span></div></td>
<td><input class=\"form-control clockpicker\" size=\"8\" maxlength=\"8\" name=\"end[$count]\" type=\"text\" value=\"20:00:00\"/></td></tr>"; <td><div class=\"input-group clockpicker\"><input readonly class=\"form-control\" size=\"8\" maxlength=\"8\" name=\"end[$count]\" type=\"text\" value=\"20:00:00\"/><span class=\"input-group-addon\"><span class=\"glyphicon glyphicon-time fa\"></span></span></div></td></tr>";
?> ?>
</tbody></table> </tbody></table>