Google Chart con Pjax
1.- Crear la tabla:
CREATE TABLE `yii2_proyecto`.`author_sales` ( `id` INT NOT NULL AUTO_INCREMENT , `author_id` INT NOT NULL , `dateSale` DATE NOT NULL , `quantityBook` INT NOT NULL , PRIMARY KEY (`id`)) ENGINE = InnoDB;
ALTER TABLE `author_sales` ADD FOREIGN KEY (`author_id`) REFERENCES `author`(`id`) ON DELETE CASCADE ON UPDATE CASCADE;
2.- Crear Modelo
Table Name:
author_sales
Model Class Name:
AuthorSales
Namespace:
backend\modules\bookstore\models\AuthorSales
3.- En el model añadir el use con la tabla author que está relacionada:
use backend\modules\bookstore\models\Author\Author;
4.- Generar el crud:
Model Class:
backend\modules\bookstore\models\AuthorSales\AuthorSales
Search Model Class:
backend\modules\bookstore\models\AuthorSales\AuthorSalesSearch
Controller Class:
backend\modules\bookstore\controllers\AuthorSalesController
View Path:
@backend/modules/bookstore/views/author-sales
5.- Ingresar valores a la tabla
6.- Añadir en el controlador:
public function actionChart()
{
$request = Yii::$app->request;
$model = new AuthorSales();
$model->dateSale = $request->get('dateSale',null);
return $this->render('chart', [
'model' => $model
]);
}
7.- Añadir en el modelo:
public function getDataPieChart(){
if($this->dateSale == null){
$this->dateSale = date('Y-m-d');
}
$modelArray = (new \yii\db\Query())
->select(['author.name','author_sales.quantityBook'])
->from('author_sales')
->innerJoin('author','author.id = author_sales.author_id')
->where(['dateSale'=>$this->dateSale])
->orderBy('quantityBook DESC')
->limit(10)->all();
$dataSale[]= [Yii::t('app', 'Authors'),Yii::t('app', 'Books')];
foreach ($modelArray as $value) {
$dataSale[] = [$value['name'],(double)$value['quantityBook']];
}
return $dataSale;
}
8.- Crear una vista chart.php:
<?php
use yii\helpers\Html;
use scotthuangzl\googlechart\GoogleChart;
use yii\widgets\Pjax;
use yii\widgets\ActiveForm;
use yii\web\JsExpression;
/* @var $this yii\web\View */
/* @var $model backend\modules\bookstore\models\AuthorSales\AuthorSales */
$this->title = Yii::t('app', 'Chart');
$this->params['breadcrumbs'][] = ['label' => Yii::t('app', 'Author Sales'), 'url' => ['index']];
$this->params['breadcrumbs'][] = $this->title;
?>
<div class="author-sales-create">
<?php $form = ActiveForm::begin(['action' => ['chart'],
'method' => 'get',]); ?>
<?= $form->field($model, 'dateSale')->widget(\yii\jui\DatePicker::classname(), [
'dateFormat' => 'yyyy-MM-dd',
'options'=>[
'autocomplete' => 'off',
'onchange'=>new JsExpression('
$.pjax({
url: "chart",
data:{"dateSale": $(this).val()},
type: "GET",
container: "#chart-div-ajax",
replace: true,
push: true,
timeout: false,
scrollTo:false
});')
]
]) ?>
<?php ActiveForm::end(); ?>
<?php Pjax::begin(['id' => 'chart-div-ajax'
]);
?>
<?php
echo GoogleChart::widget(
array(
'visualization' => 'PieChart',
'data' => $model->getDataPieChart(),
'options' => array(
'title' => Yii::t('app', 'Total Libros'),
'legend'=> ['position'=>'left','alignment'=>'center'],
'pointSize'=> 15,
'width'=>'100%',
'height'=>500,
'backgroundColor'=>[ 'fill'=>'transparent' ],
'colors'=> ['#e0440e', '#e6693e', '#ec8f6e', '#f3b49f', '#f6c7b6'],
'is3D'=> true
)));
?>
<?php Pjax::end(); ?>
</div>
Comentarios
Publicar un comentario