Updated users page for bootstrap 3.

This commit is contained in:
Alex Tselegidis 2015-07-25 14:04:23 +02:00
parent 6c6a597064
commit 651c2c5101
4 changed files with 98 additions and 45 deletions

View file

@ -214,7 +214,7 @@
</div> </div>
<div class="details column col-md-7"> <div class="details column col-md-7">
<div class="btn-toolbar col-md-5"> <div>
<div class="add-edit-delete-group btn-group"> <div class="add-edit-delete-group btn-group">
<button id="add-provider" class="btn btn-primary"> <button id="add-provider" class="btn btn-primary">
<span class="glyphicon glyphicon-plus"></span> <span class="glyphicon glyphicon-plus"></span>
@ -356,44 +356,72 @@
</thead> </thead>
<tbody> <tbody>
<tr> <tr>
<td><label class="checkbox"><input type="checkbox" id="monday" /> <td>
<?php echo $this->lang->line('monday'); ?></label></td> <div class="checkbox">
<label><input type="checkbox" id="monday" />
<?php echo $this->lang->line('monday'); ?></label>
</div>
</td>
<td><input type="text" id="monday-start" class="work-start" /></td> <td><input type="text" id="monday-start" class="work-start" /></td>
<td><input type="text" id="monday-end" class="work-end" /></td> <td><input type="text" id="monday-end" class="work-end" /></td>
</tr> </tr>
<tr> <tr>
<td><label class="checkbox"><input type="checkbox" id="tuesday" /> <td>
<?php echo $this->lang->line('tuesday'); ?></label></td> <div class="checkbox">
<label><input type="checkbox" id="tuesday" />
<?php echo $this->lang->line('tuesday'); ?></label>
</div>
</td>
<td><input type="text" id="tuesday-start" class="work-start" /></td> <td><input type="text" id="tuesday-start" class="work-start" /></td>
<td><input type="text" id="tuesday-end" class="work-end" /></td> <td><input type="text" id="tuesday-end" class="work-end" /></td>
</tr> </tr>
<tr> <tr>
<td><label class="checkbox"><input type="checkbox" id="wednesday" /> <td>
<?php echo $this->lang->line('wednesday'); ?></label></td> <div class="checkbox">
<label><input type="checkbox" id="wednesday" />
<?php echo $this->lang->line('wednesday'); ?></label>
</div>
</td>
<td><input type="text" id="wednesday-start" class="work-start" /></td> <td><input type="text" id="wednesday-start" class="work-start" /></td>
<td><input type="text" id="wednesday-end" class="work-end" /></td> <td><input type="text" id="wednesday-end" class="work-end" /></td>
</tr> </tr>
<tr> <tr>
<td><label class="checkbox"><input type="checkbox" id="thursday" /> <td>
<?php echo $this->lang->line('thursday'); ?></label></td> <div class="checkbox">
<label><input type="checkbox" id="thursday" />
<?php echo $this->lang->line('thursday'); ?></label>
</div>
</td>
<td><input type="text" id="thursday-start" class="work-start" /></td> <td><input type="text" id="thursday-start" class="work-start" /></td>
<td><input type="text" id="thursday-end" class="work-end" /></td> <td><input type="text" id="thursday-end" class="work-end" /></td>
</tr> </tr>
<tr> <tr>
<td><label class="checkbox"><input type="checkbox" id="friday" /> <td>
<?php echo $this->lang->line('friday'); ?></label></td> <div class="checkbox">
<label><input type="checkbox" id="friday" />
<?php echo $this->lang->line('friday'); ?></label>
</div>
</td>
<td><input type="text" id="friday-start" class="work-start" /></td> <td><input type="text" id="friday-start" class="work-start" /></td>
<td><input type="text" id="friday-end" class="work-end" /></td> <td><input type="text" id="friday-end" class="work-end" /></td>
</tr> </tr>
<tr> <tr>
<td><label class="checkbox"><input type="checkbox" id="saturday" /> <td>
<?php echo $this->lang->line('saturday'); ?></label></td> <div class="checkbox">
<label><input type="checkbox" id="saturday" />
<?php echo $this->lang->line('saturday'); ?></label>
</div>
</td>
<td><input type="text" id="saturday-start" class="work-start" /></td> <td><input type="text" id="saturday-start" class="work-start" /></td>
<td><input type="text" id="saturday-end" class="work-end" /></td> <td><input type="text" id="saturday-end" class="work-end" /></td>
</tr> </tr>
<tr> <tr>
<td><label class="checkbox"><input type="checkbox" id="sunday" /> <td>
<?php echo $this->lang->line('sunday'); ?></label></td> <div class="checkbox">
<label><input type="checkbox" id="sunday" />
<?php echo $this->lang->line('sunday'); ?></label>
</div>
</td>
<td><input type="text" id="sunday-start" class="work-start" /></td> <td><input type="text" id="sunday-start" class="work-start" /></td>
<td><input type="text" id="sunday-end" class="work-end" /></td> <td><input type="text" id="sunday-end" class="work-end" /></td>
</tr> </tr>

View file

@ -569,7 +569,7 @@ body .form-horizontal .controls {
#users-page #providers .switch-view strong { #users-page #providers .switch-view strong {
display: inline-block; display: inline-block;
float: left; float: left;
margin: 8px 20px; margin: 3px 20px;
font-size: 17px; font-size: 17px;
} }

View file

@ -55,18 +55,34 @@ var BackendUsers = {
BackendUsers.wp.bindEventHandlers(); BackendUsers.wp.bindEventHandlers();
// Fill the services and providers list boxes. // Fill the services and providers list boxes.
var html = '<div class="col-md-12">';
$.each(GlobalVariables.services, function(index, service) { $.each(GlobalVariables.services, function(index, service) {
var html = '<label class="checkbox"><input type="checkbox" data-id="' + service.id + '" />' html +=
+ service.name + '</label>'; '<div class="checkbox">' +
$('#provider-services').append(html); '<label class="checkbox">' +
'<input type="checkbox" data-id="' + service.id + '" />' +
service.name +
'</label>' +
'</div>';
}); });
html += '</div>';
$('#provider-services').html(html);
$('#provider-services').jScrollPane({ mouseWheelSpeed: 70 }); $('#provider-services').jScrollPane({ mouseWheelSpeed: 70 });
var html = '<div class="col-md-12">';
$.each(GlobalVariables.providers, function(index, provider) { $.each(GlobalVariables.providers, function(index, provider) {
var html = '<label class="checkbox"><input type="checkbox" data-id="' + provider.id + '" />' html +=
+ provider.first_name + ' ' + provider.last_name + '</label>'; '<div class="checkbox">' +
$('#secretary-providers').append(html); '<label class="checkbox">' +
'<input type="checkbox" data-id="' + provider.id + '" />' +
provider.first_name + ' ' + provider.last_name +
'</label>' +
'</div>';
}); });
html += '</div>';
$('#secretary-providers').html(html);
$('#secretary-providers').jScrollPane({ mouseWheelSpeed: 70 }); $('#secretary-providers').jScrollPane({ mouseWheelSpeed: 70 });
$('#reset-working-plan').qtip({ $('#reset-working-plan').qtip({
@ -126,12 +142,21 @@ var BackendUsers = {
GlobalVariables.providers = response; GlobalVariables.providers = response;
$('#secretary-providers').data('jsp').destroy(); $('#secretary-providers').data('jsp').destroy();
$('#secretary-providers').html('');
var html = '<div class="col-md-12">';
$.each(GlobalVariables.providers, function(index, provider) { $.each(GlobalVariables.providers, function(index, provider) {
var html = '<label class="checkbox"><input type="checkbox" data-id="' + provider.id + '" />' html +=
+ provider.first_name + ' ' + provider.last_name + '</label>'; '<div class="checkbox">' +
$('#secretary-providers').append(html); '<label class="checkbox">' +
'<input type="checkbox" data-id="' + provider.id + '" />' +
provider.first_name + ' ' + provider.last_name +
'</label>' +
'</div>';
}); });
html += '</div>';
$('#secretary-providers').html(html);
$('#secretary-providers input[type="checkbox"]').prop('disabled', true); $('#secretary-providers input[type="checkbox"]').prop('disabled', true);
$('#secretary-providers').jScrollPane({ mouseWheelSpeed: 70 }); $('#secretary-providers').jScrollPane({ mouseWheelSpeed: 70 });
}, 'json'); }, 'json');

View file

@ -55,17 +55,17 @@ WorkingPlan.prototype.setup = function(workingPlan) {
'<td class="break-start editable">' + brk.start + '</td>' + '<td class="break-start editable">' + brk.start + '</td>' +
'<td class="break-end editable">' + brk.end + '</td>' + '<td class="break-end editable">' + brk.end + '</td>' +
'<td>' + '<td>' +
'<button type="button" class="btn edit-break" title="' + EALang['edit'] + '">' + '<button type="button" class="btn btn-sm edit-break" title="' + EALang['edit'] + '">' +
'<i class="icon-pencil"></i>' + '<span class="glyphicon glyphicon-pencil"></span>' +
'</button>' + '</button>' +
'<button type="button" class="btn delete-break" title="' + EALang['delete'] + '">' + '<button type="button" class="btn btn-sm delete-break" title="' + EALang['delete'] + '">' +
'<i class="icon-remove"></i>' + '<span class="glyphicon glyphicon-remove"></span>' +
'</button>' + '</button>' +
'<button type="button" class="btn save-break hidden" title="' + EALang['save'] + '">' + '<button type="button" class="btn btn-sm save-break hidden" title="' + EALang['save'] + '">' +
'<i class="icon-ok"></i>' + '<span class="glyphicon glyphicon-ok"></span>' +
'</button>' + '</button>' +
'<button type="button" class="btn cancel-break hidden" title="' + EALang['cancel'] + '">' + '<button type="button" class="btn btn-sm cancel-break hidden" title="' + EALang['cancel'] + '">' +
'<i class="icon-ban-circle"></i>' + '<span class="glyphicon glyphicon-ban-circle"></span>' +
'</button>' + '</button>' +
'</td>' + '</td>' +
'</tr>'; '</tr>';
@ -178,17 +178,17 @@ WorkingPlan.prototype.bindEventHandlers = function() {
'<td class="break-start editable">09:00</td>' + '<td class="break-start editable">09:00</td>' +
'<td class="break-end editable">10:00</td>' + '<td class="break-end editable">10:00</td>' +
'<td>' + '<td>' +
'<button type="button" class="btn edit-break" title="' + EALang['edit'] + '">' + '<button type="button" class="btn btn-sm edit-break" title="' + EALang['edit'] + '">' +
'<i class="icon-pencil"></i>' + '<span class="glyphicon glyphicon-pencil"></span>' +
'</button>' + '</button>' +
'<button type="button" class="btn delete-break" title="' + EALang['delete'] + '">' + '<button type="button" class="btn btn-sm delete-break" title="' + EALang['delete'] + '">' +
'<i class="icon-remove"></i>' + '<span class="glyphicon glyphicon-remove"></span>' +
'</button>' + '</button>' +
'<button type="button" class="btn save-break hidden" title="' + EALang['save'] + '">' + '<button type="button" class="btn btn-sm save-break hidden" title="' + EALang['save'] + '">' +
'<i class="icon-ok"></i>' + '<span class="glyphicon glyphicon-ok"></span>' +
'</button>' + '</button>' +
'<button type="button" class="btn cancel-break hidden" title="' + EALang['cancel'] + '">' + '<button type="button" class="btn btn-sm cancel-break hidden" title="' + EALang['cancel'] + '">' +
'<i class="icon-ban-circle"></i>' + '<span class="glyphicon glyphicon-ban-circle"></span>' +
'</button>' + '</button>' +
'</td>' + '</td>' +
'</tr>'; '</tr>';