Improved the usability for Yii CGridView #55

This commit is contained in:
Andy Strobel 2014-06-05 17:15:52 +02:00
parent 096c759eda
commit 87c5f42a75
7 changed files with 120 additions and 22 deletions

View File

@ -15,18 +15,23 @@ $this->widget('zii.widgets.grid.CGridView', array(
array(
'value' => 'CHtml::image($data->profileImage->getUrl())',
'type' => 'raw',
'htmlOptions' => array('width' => '30px'),
),
array(
'name' => 'username',
'header' => 'Username',
'htmlOptions' => array('width' => '300px'),
'filter' => CHtml::activeTextField($model, 'username', array('placeholder' => Yii::t('AdminModule.user', 'Search for username'))),
),
array(
'name' => 'group_id',
'value' => 'Group::getGroupNameById($data->group_id)',
'filter' => GroupAdmin::gridItems(),
),
'email',
array(
'name' => 'email',
'header' => Yii::t('AdminModule.user', 'Email'),
'filter' => CHtml::activeTextField($model, 'username', array('placeholder' => Yii::t('AdminModule.user', 'Search for email'))),
),
array(
'class' => 'CButtonColumn',
'template' => '{view}',

View File

@ -13,11 +13,15 @@ $this->widget('zii.widgets.grid.CGridView', array(
/*'loadingCssClass' => 'loader',*/
'columns' => array(
array(
'name' => 'id',
'htmlOptions' => array('width' => '40px'),
'name' => 'name',
'header' => Yii::t('AdminModule.group', 'Group name'),
'filter' => CHtml::activeTextField($model, 'name', array('placeholder' => Yii::t('AdminModule.group', 'Search for group name'))),
),
array(
'name' => 'description',
'header' => Yii::t('AdminModule.group', 'Description'),
'filter' => CHtml::activeTextField($model, 'description', array('placeholder' => Yii::t('AdminModule.group', 'Search for description'))),
),
'name',
'description',
array(
'class' => 'CButtonColumn',
'template' => '{update}',

View File

@ -21,7 +21,8 @@ $this->widget('zii.widgets.grid.CGridView', array(
),
array(
'name' => 'name',
'header' => Yii::t('AdminModule.space', 'Name'),
'filter' => CHtml::activeTextField($model, 'name', array('placeholder' => Yii::t('AdminModule.space', 'Search for space name'))),
'header' => Yii::t('AdminModule.space', 'Space name'),
),
array(
'name' => 'visibility',
@ -53,6 +54,8 @@ $this->widget('zii.widgets.grid.CGridView', array(
),
array(
'name' => 'ownerUsernameSearch',
'header' => Yii::t('AdminModule.space', 'Space owner'),
'filter' => CHtml::activeTextField($model, 'ownerUsernameSearch', array('placeholder' => Yii::t('AdminModule.space', 'Search for space owner'))),
'value' => function($data, $row) {
if (!$data->owner)
return "-";
@ -126,3 +129,12 @@ $this->widget('zii.widgets.grid.CGridView', array(
'pagerCssClass' => 'pagination-container',
));
?>
<script type="text/javascript">
$( document ).ready(function() {
$('.grid-view-loading').show();
$('.grid-view-loading').css('display', 'block !important');
$('.grid-view-loading').css('opacity', '1 !important');
});
</script>

View File

@ -6,35 +6,38 @@ $this->widget('zii.widgets.grid.CGridView', array(
'dataProvider' => $model->resetScope()->notDeleted()->search(),
'filter' => $model,
'itemsCssClass' => 'table table-hover',
/* 'loadingCssClass' => 'loader', */
// 'loadingCssClass' => 'loader',
'columns' => array(
array(
'value' => 'CHtml::image($data->profileImage->getUrl())',
'type' => 'raw',
'htmlOptions' => array('class' => 'img-rounded', 'style' => 'width: 24px; height: 24px;'),
'htmlOptions' => array('width' => '30px'),
),
array(
'name' => 'username',
'header' => Yii::t('AdminModule.user', 'Username'),
'htmlOptions' => array('width' => '300px'),
'filter' => CHtml::activeTextField($model, 'username', array('placeholder' => Yii::t('AdminModule.user', 'Search for username'))),
),
array(
'name' => 'email',
'header' => Yii::t('AdminModule.user', 'Email'),
'filter' => CHtml::activeTextField($model, 'username', array('placeholder' => Yii::t('AdminModule.user', 'Search for email'))),
),
'email',
array(
'name' => 'super_admin',
'header' => Yii::t('AdminModule.user', 'Admin'),
'filter' => array("" => Yii::t('AdminModule.user', 'All'), 0 => Yii::t('AdminModule.user', 'No'), 1 => Yii::t('AdminModule.user', 'Yes')),
'htmlOptions' => array('width' => '80px'),
),
array(
'class' => 'CButtonColumn',
'template' => '{view}{update}{deleteOwn}',
'viewButtonUrl' => 'Yii::app()->createUrl("//user/profile", array("guid"=>$data->guid));',
'updateButtonUrl' => 'Yii::app()->createUrl("//admin/user/edit", array("id"=>$data->id));',
'htmlOptions' => array('width' => '90px'),
'buttons' => array
(
(
'view' => array
(
(
'label' => '<i class="fa fa-eye"></i>',
'imageUrl' => false,
'options' => array(
@ -47,7 +50,7 @@ $this->widget('zii.widgets.grid.CGridView', array(
),
),
'update' => array
(
(
'label' => '<i class="fa fa-pencil"></i>',
'imageUrl' => false,
'options' => array(
@ -60,7 +63,7 @@ $this->widget('zii.widgets.grid.CGridView', array(
),
),
'deleteOwn' => array
(
(
'label' => '<i class="fa fa-times"></i>',
'imageUrl' => false,
'url' => 'Yii::app()->createUrl("//admin/user/delete", array("id"=>$data->id));',
@ -88,4 +91,5 @@ $this->widget('zii.widgets.grid.CGridView', array(
),
'pagerCssClass' => 'pagination-container',
));
?>
?>

View File

@ -78,7 +78,7 @@ class AdminMenuWidget extends MenuWidget
$this->addItem(array(
'label' => Yii::t('AdminModule.base', 'About'),
'url' => Yii::app()->createUrl('admin/about'),
'icon' => '<i class="fa fa-info-sign"></i>',
'icon' => '<i class="fa fa-info-circle"></i>',
'sortOrder' => 10000,
'group' => 'manage',
'newItemCount' => 0,
@ -196,7 +196,7 @@ class AdminMenuWidget extends MenuWidget
$this->addItem(array(
'label' => Yii::t('AdminModule.base', 'Cron jobs'),
'url' => Yii::app()->createUrl('admin/setting/cronjob'),
'icon' => '<i class="fa fa-truck"></i>',
'icon' => '<i class="fa fa-history"></i>',
'group' => 'settings',
'sortOrder' => 1000,
'isActive' => (Yii::app()->controller->module && Yii::app()->controller->module->id == 'admin' && Yii::app()->controller->id == 'setting' && Yii::app()->controller->action->id == 'cronjob'),
@ -206,7 +206,7 @@ class AdminMenuWidget extends MenuWidget
$this->addItem(array(
'label' => Yii::t('AdminModule.base', 'Logging'),
'url' => Yii::app()->createUrl('admin/logging'),
'icon' => '<i class="icon-warning-sign"></i>',
'icon' => '<i class="fa fa-keyboard-o"></i>',
'group' => 'settings',
'sortOrder' => 1100,
'isActive' => (Yii::app()->controller->module && Yii::app()->controller->module->id == 'admin' && Yii::app()->controller->id == 'logging'),

View File

@ -385,7 +385,6 @@ h4 {
/* padding: 8px 16px;
font-weight: 600;
font-size: 14px;*/
padding: 4px 12px;
}
.input.btn {
@ -743,6 +742,40 @@ table td a:hover {
height: 32px;
width: 32px;
}
.grid-view .filters input,
.grid-view .filters select {
border: 2px solid #ededed;
box-shadow: none;
border-radius: 4px;
font-size: 12px;
padding: 4px;
}
.grid-view .filters input:focus,
.grid-view .filters select:focus {
border: 2px solid #4cd9c0;
outline: 0;
box-shadow: none;
}
.grid-view {
padding: 15px 0 0 0;
}
.grid-view img {
border-radius: 3px;
}
.grid-view table th {
font-size: 13px !important;
font-weight: bold !important;
}
.grid-view table tr {
font-size: 13px !important;
}
.grid-view .summary {
font-size: 12px;
color: #bac2c7;
}
.grid-view-loading {
background: url('../img/loader.gif') no-repeat top left;
}
.userInput,
.spaceInput {
background-color: #4cd9c0;

View File

@ -996,6 +996,46 @@ table {
width: 32px;
}
// CGridView
.grid-view .filters input, .grid-view .filters select {;
.form-control;
border-radius: 4px;
font-size: 12px;
padding: 4px;
}
.grid-view {
padding: 15px 0 0 0;
img {
border-radius: 3px;
}
table {
th {
font-size: 13px !important;
font-weight: bold !important;
}
tr {
font-size: 13px !important;
}
}
.summary {
//display: none;
font-size: 12px;
color: @colorFont1;
}
}
.grid-view-loading {
background: url('../img/loader.gif') no-repeat top left;
}
// User- & Space picker
.userInput, .spaceInput {
background-color: @colorInfo2;