* change UI of buttons in table footer.

This commit is contained in:
Catouse
2016-03-07 13:35:13 +08:00
parent d97d22c0db
commit 18f97e6478
5 changed files with 32 additions and 46 deletions
+2 -25
View File
@@ -672,38 +672,15 @@ EOT;
* Create select buttons include 'selectAll' and 'selectReverse'.
*
* @param string $scope the scope of select reverse.
* @param bool $asGroup
* @param string $appendClass
* @static
* @access public
* @return string
*/
static public function selectButton($scope = "", $asGroup = true, $appendClass = '')
static public function selectButton($scope = "", $appendClass = 'btn')
{
$string = <<<EOT
<script>
$(function()
{
if($('body').data('bindSelectBtn')) return;
$('body').data('bindSelectBtn', true);
$(document).on('click', '.check-all, .check-inverse, #allchecker, #reversechecker', function()
{
var e = $(this);
if(e.closest('.datatable').length) return;
scope = e.data('scope');
scope = scope ? $('#' + scope) : e.closest('.table');
if(!scope.length) scope = e.closest('form');
scope.find('input:checkbox').each(e.hasClass('check-inverse') ? function() { $(this).prop("checked", !$(this).prop("checked"));} : function() { $(this).prop("checked", true);});
});
});
</script>
EOT;
global $lang;
if($asGroup) $string .= "<div class='btn-group'>";
$string .= "<a id='allchecker' class='btn btn-select-all check-all $appendClass' data-scope='$scope' href='javascript:;' >{$lang->selectAll}</a>";
$string .= "<a id='reversechecker' class='btn btn-select-reverse check-inverse $appendClass' data-scope='$scope' href='javascript:;'>{$lang->selectReverse}</a>";
if($asGroup) $string .= "</div>";
return $string;
return "<div class='checkbox $appendClass'><label><input type='checkbox' data-scope='$scope' class='rows-selector'> $lang->select</label></div>";
}
/**
+1
View File
@@ -73,6 +73,7 @@ $lang->fold = '-';
$lang->preShortcutKey = '[Shortcut key:←]';
$lang->nextShortcutKey = '[Shortcut key:→]';
$lang->select = 'Select';
$lang->selectAll = 'All';
$lang->selectReverse = 'Inverse';
$lang->notFound = 'Sorry, the object not found.';
+1
View File
@@ -73,6 +73,7 @@ $lang->fold = '-';
$lang->preShortcutKey = '[快捷键:←]';
$lang->nextShortcutKey = '[快捷键:→]';
$lang->select = '选择';
$lang->selectAll = '全选';
$lang->selectReverse = '反选';
$lang->loading = '稍候...';
+22 -17
View File
@@ -649,28 +649,33 @@ function setComment()
*/
function autoCheck()
{
$(document).on('click', '.tablesorter tr :checkbox', function(){clickInCheckbox = 1;});
$(document).on('click', '.tablesorter:not(.table-datatable) tr', function()
var checkRow = function()
{
if(document.activeElement.type != 'select-one' && document.activeElement.type != 'text')
{
if(typeof(clickInCheckbox) != 'undefined' && clickInCheckbox == 1)
var $this = $(this);
var $tr = $(this).closest('tr');
var $checkbox = $tr.find(':checkbox');
var isChecked = $checkbox.prop('checked');
if(!$this.is(':checkbox'))
{
clickInCheckbox = 0;
}
else
{
if($(this).find(':checkbox').attr('checked'))
{
$(this).find(':checkbox').attr('checked', false);
}
else
{
$(this).find(':checkbox').attr('checked', true);
}
isChecked = !isChecked;
$checkbox.prop('checked', isChecked);
}
if(!$tr.hasClass('.active-disabled')) $tr.toggleClass('active', isChecked);
$tr.closest('.table').find('.rows-selector').prop('checked', false);
}
};
$('.tablesorter:not(.table-datatable)').on('click', 'tbody > tr :checkbox', function(e){checkRow.call(this); e.stopPropagation();}).on('click', 'tbody > tr', checkRow);
$(document).on('change', '.rows-selector:checkbox', function()
{
var $checkbox = $(this);
if($checkbox.closest('.datatable').length) return;
var scope = $checkbox.data('scope');
var $target = scope ? $('#' + scope) : $checkbox.closest('.table');
var isChecked = $checkbox.prop('checked');
$target.find('tbody > tr').toggleClass('active', isChecked).find('td :checkbox').prop('checked', isChecked);
});
}
@@ -1264,7 +1269,7 @@ function setModal4List(triggerClass, replaceID, callback, width)
*/
function setTableBehavior()
{
$('#wrap .table:not(.table-data, .table-form, .active-disabled)').on('click', 'tbody tr:not(.active-disabled) td', function(){$(this).closest('tr').toggleClass('active');});
$('#wrap .table:not(.table-data, .table-form, .active-disabled, .tablesorter)').on('click', 'tbody tr:not(.active-disabled) td', function(){$(this).closest('tr').toggleClass('active');});
$('#wrap .outer > .table, #wrap .outer > form > .table, #wrap .outer > .mian > .table, #wrap .outer > .mian > form > .table, #wrap .outer > .container > .table').not('.table-data, .table-form, .table-custom').addClass('table table-condensed table-hover table-striped tablesorter');
}
+6 -4
View File
@@ -518,6 +518,7 @@ body {font-size: 13px; color:#141414;padding-bottom: 40px;}
.outer .table thead tr th {text-align: center;}
.outer .table thead tr th.text-left {text-align: left;}
.outer .table tbody td {vertical-align: middle;}
.outer .table tbody > tr > td:first-child {text-align: left}
.outer .table th {vertical-align: middle;}
.outer .table tr > th:first-child, .outer .table tr > td:first-child {padding-left: 10px}
.outer .table tr > th:last-child, .outer .table tr > td:last-child {padding-right: 10px}
@@ -530,7 +531,7 @@ body {font-size: 13px; color:#141414;padding-bottom: 40px;}
.outer .table.table-data.table-borderless tbody > tr:last-child td, .outer .table.table-form tbody > tr:last-child td {border: none}
.outer .table tfoot td {border-top: 1px solid #ddd}
.outer .table tfoot .form-control {padding: 1px 8px; height: 30px}
.outer .table tfoot .btn {padding-top: 4px; padding-bottom: 4px;}
.outer .table tfoot .btn {padding: 2px 6px; font-size: 13px; line-height: 20px;}
.outer .table tfoot .btn > i {display: inline-block; margin-right: 1px; opacity: 0.8}
.outer .table tfoot .datepicker-wrapper:before {top: 5px}
.outer .table tfoot .form-control.form-date {width: 110px}
@@ -538,10 +539,11 @@ body {font-size: 13px; color:#141414;padding-bottom: 40px;}
.outer .table tfoot .chosen-single {padding: 4px 6px; height: 30px; }
.outer .table tfoot .chosen-container-single .chosen-single abbr {top: 4px;}
.table-actions {float: left;}
.table-actions > .btn-group, .table-actions > .btn, .table-actions > .input-group, .table-actions > .text {float: left; margin-right: 10px;}
.table-actions > .text {line-height: 30px; color: #808080}
.table-actions > .checkbox {float: left; margin: 0}
.table-actions > .btn-group, .table-actions > .btn, .table-actions > .input-group, .table-actions > .text {float: left; margin-right: 6px;}
.table-actions > .text {line-height: 24px; color: #808080}
.table-actions > .text strong {color: #333}
.outer .table tfoot .pager {margin: 0;}
.outer .table tfoot .pager {margin: -3px 0;}
/* color of a when visited */
.outer .table tbody td > a:visited, #crumbs > a:visited, .side > a:visited {color: #551A8B}