Yii2 GridView是实现yii网格视图的小部件,一般用于报表视图的展示。今天,结合DataProvider(ArrayDataProvider以及SqlDataProvider)说一下GridView中的几个Columns(SerialColumn,DataColumn,ActionColumn)。
教程一
1.页面显示的时间戳转换
a.
[
'label'=>'创建日期',
'attribute' => 'created_at',
'filter' => false, //不显示搜索框
'value' => function($data) {
return date('Y-m-d H:i:s',$data->created_at); }
],
b.
[
'label'=>'创建日期',
'attribute' => 'created_at',
'format' => ['date', 'php:Y-m-d H:i:s'],
],
2.为字段加超链接
[
'attribute'=>'title’,
'format'=>'raw’,
'value'=> function($data){return Html::a($data->title,['exam/index',
'id' => $data->_id],['title' => '审核']);}
],
[
'label'=>'更多操作’,
'format'=>'raw’,
'value' => function($data) {
$url = "http://www.baidu.com”;
return Html::a('添加权限组', $url, ['title' => '审核']); }
],
3.下拉菜单搜索
[
'label' => '当前状态',
'attribute' => 'status',
'filter' => Html::dropDownList('AppBaseSearch[status
]',$searchModel-> status,
[ '' => '请选择',
‘0' => '审核拒绝',
‘1' => '审核通过',
]),
'value' => function($date) {
switch ($date-> status) {
case 1';
return '审核通过';
break;
case ‘0';
return '审核拒绝';
break;
default:
return '未知状态';
break;
}
}
],
4.私人定制增删改按钮
[
'header' => "查看/审核",
'class' => 'yii\grid\ActionColumn',
'template'=> '{view} {update} {delete}',
'headerOptions' => ['width' => '140'],
'buttons' => [
'view' => function ($url, $model, $key) {
return Html::a(Html::tag('span', '', ['class' => "glyphicon fa fa-eye"]), ['admin/view-app', 'id'=>$model->app_id], ['class' => "btn btn-xs btn-success", 'title' => '查看']);
},
'update' => function ($url, $model, $key) use($uid){
return Html::a('通过', ['admin/reviewapp','id'=>$model->app_id, 'status’=>1], ['class' => "btn btn-xs btn-info"]);
},
'delete' => function ($url, $model, $key) {
return Html::a('拒绝', ['admin/reviewapp', 'id' => $model->app_id, 'status’=>0], ['class' => "btn btn-xs btn-danger"]);
}
]
],
教程二
1. SerialColumn
SerialColumn就是连续的列,主要用于网格的行号,属于自增式的列。用法很简单:
echo GridView::widget([ 'dataProvider' => $dataProvider, 'columns' => [ ['class' => 'yii\grid\SerialColumn'], // 连续编号 // 其他数据列和操作列 ]]);
展示结果:
| # | | 1 | | 2 |
2. DataColumn
DataColumn主要展示数据的,所有跟数据有关的展示基本都在这个Column中实现。因此用法也很多,但是有一条,如果对数据不做处理,那么字段必须是ArrayDataProvider对象的allModels的二维数组的key或者是SqlDataProvider对象sql查询结果二维数组的key。
用法一:表头即字段名,首字母大写
echo GridView::widget([ 'dataProvider' => $dataProvider, 'columns' => [ 'orderNo', //订单编号 'username' // 用户名 ]]);
展示结果:
用法二:定义表头并格式化数据
echo GridView::widget([ 'dataProvider' => $dataProvider, 'columns' => [ 'time:date:日期', 'pv:raw:PV', 'uv:raw:UV', ]]);
展示结果:
用法三:数据过滤,class、attribute、label、format均不是必须要的。class默认是yii\grid\DataColumn,attribute是指定排序的字段key,一定是dataProvider中提供的数据的key,如果不指定,对于过滤的数据,不能点击表头排序。
echo GridView::widget([ 'dataProvider' => $dataProvider, 'columns' => [ [ 'value' => function($data) { if (isset($data['time'])) { return date('Y-m-d', $data['time']); } }, 'attribute' => 'time', //用于排序,如果不写,不能点击表头排序,非必须 'label' => '日期', // 自定义表头,非必须 'format' => 'raw', // 格式方式,非必须 ], 'pv:raw:PV', [ 'class' => 'yii\grid\DataColumn', 'value' => function ($data) { if (isset($data['orderCr'])) { return ($data['orderCr'] * 100) . '%'; } }, 'attribute' => 'orderCr', 'label' => '下单转化率', 'format' => 'raw', ], ]]);
3. ActionColumn
ActionColumn是对一行数据进行操作的句柄。class指定处理的类,必须。 header指定表头显示,如果不写,默认为空。非必须。template中默认有三个:{view} {update} {delete},如果需要其他的,自行添加,比如下面添加了{onshelf} {offshelf}{robot}这三个。buttons除了默认的三个可以不写,其他都必须写。
echo GridView::widget([
'dataProvider' => $dataProvider,
'columns' => [
[
'class' => 'yii\grid\ActionColumn',
'header' => '操作’,
'template' => '{view} {update} {delete} {onshelf} {offshelf} {robot}',
'buttons' => [
'onshelf' => function ($url, $model, $key){
return $model['status'] ? '' : Html::a('<span class="glyphicon glyphicon-ok"></span>',
['item/shelf'],
['title' => '上架商品', 'data' => ['method' => 'post', 'id' => $key, 'type' => 'on'], 'class'=> 'shelf']);
},
'offshelf' => function ($url, $model, $key){
return $model['status'] ? Html::a('<span class="glyphicon glyphicon-remove"></span>',
['item/shelf'],
['title' => '下架商品', 'data' => ['method' => 'post', 'id' => $key, 'type' => 'off'], 'class'=> 'shelf']) : '';
},
'robot' => function ($url, $model, $key){
return Html::a('<span class="glyphicon glyphicon-knight"></span>',
['robot/like', 'id' => $model['pid'] ],
['title' => '自动点赞', 'class' => 'post-autolike', 'data' => ['method' => 'post']]) ;
},
]
],
],
]);
展示效果: