Entradas

Chat en la aplicación de Yii2 utilizando WebSocket

Imagen
 1.-  Añadir en el composer.json: "consik/yii2-websocket": "^1.0" 2.- Ejecutar el composer update en el cmd: composer update --prefer-dist WebSockets es una conexión bidereccional del navegador web  con el servidor. Una vez que la conexión de Websocket esta establecida se mantiene abierta hasta que el cliente o el servidor decide cerrarla. Con esta conexión abierta el cliente o el servidor puede enviar un mensaje en cualquier momento, esto hace que la programación web se vuelva enteramente conducida por eventos, no solo cuando el usuario la inicie. Ratchet es una librería de PHP WebSocket  cuyos componentes pueden hacer que la aplicación soporte WebSockets en el lado del servidor. Con este widget podemos utilizar la librería de Ratchet y hacer nuestro chat asi como graficos en tiempo real etc. 3.- Revisar la documentación: https://github.com/consik/yii2-websocket http://socketo.me/ 4.- Vamos a crear una carpeta que le vamos a llamar daemons (siguiendo el ejemplo que...

Google Chart con Pjax

Imagen
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 action...

Implementación de Google Chart en Yii2 ("scotthuangzl/yii2-google-chart")

Imagen
 1.- Colocar en el archivo de composer.json: "scotthuangzl/yii2-google-chart": "dev-master" 2.- Ejecutar en el archivo de cmd:  composer update --prefer-dist 3.- Colocar en el Controlador: use scotthuangzl\googlechart\GoogleChart; 4.- En el controlador, en el método actionChart que se creó en una entrada anterior:         $dataSale[]= [Yii::t('app', 'Authors'),Yii::t('app', 'Total Sales')];         $modelArray =   Author::find()->orderBy('total_sale DESC')->limit(10)->all();          foreach ($modelArray as $value) {               $dataSale[] = [$value['name'],(double)$value['total_sale']];         }            $chartGoogleSale =  GoogleChart::widget(              array('visualization' => 'ColumnChart',                 'data' =...

Instalación de un Widget de Gráficos (FusionChart)

Imagen
 1.- Adicionar en el composer: "ptrnov/yii2-fusionchart": "*" 2.- Ejecutar en el cmd del proyecto: composer update --prefer-dist 3.- Crear un archivo para la vista con nombre chart.php: <?php use ptrnov\fusionchart\ChartAsset; /* @var $this yii\web\View */ /* @var $searchModel backend\modules\bookstore\models\Author\AuthorSearch */ /* @var $dataProvider yii\data\ActiveDataProvider */ $this->title = Yii::t('app', 'Chart'); $this->params['breadcrumbs'][] = $this->title; ChartAsset::register($this);      ?> <div class="row">     <div class="col-sm-6">         <div class="book-chart">             <?=$chartBook?>         </div>     </div>     <div class="col-sm-6">         <div class="sale-chart">         <?=$chartSale?>         </div> ...

Implementando un formulario tipo Wizard con un formulario Tabular

Imagen
Vamos a estar unificando varios formularios en uno, y además utilizando el formulario tabular de esta extensión:  1.- Instalar widget de formwizard, añadir al composer.json: "buttflattery/yii2-formwizard":"@dev" 1.1.- Ejecutar  en el cmd de la carpeta del proyecto: composer update --prefer-dist 2.- Colocar en el form el use del widget: use buttflattery\formwizard\FormWizard; 3.- Colocar el form: <?= FormWizard::widget(     [         'formOptions' => [             'id' => 'my_form_tabular'                      ],         'theme' => FormWizard::THEME_ARROWS,         'labelNext' => Yii::t('app', 'Next'),         'labelPrev' => Yii::t('app', 'Previous'),         'labelFinish' => Yii::t('app', 'Finish'),                  'ste...

Formulario con Select2 Kartik Múltiple

Imagen
En esta entrada les muestro como modificar el formulario para que podamos ingresar múltiples elementos en el selector y como guardar en el modelo:  1.- Modificar el formulario colocando los selectores:  <?=  $form->field($model, 'author_id')->widget(Select2::classname(), [     'data' => ArrayHelper::map(Author::find()->all(), 'id', 'name'),     'theme' => Select2::THEME_BOOTSTRAP,     'size' => Select2::LARGE,     'options' => ['placeholder' => Yii::t('app', 'Select...')],     'pluginOptions' => [         'allowClear' => true     ], ]);      ?>    <?=  $form->field($model, 'bookArray')->widget(Select2::classname(), [     'data' => ArrayHelper::map(Book::find()->all(), 'id', 'name'),     'theme' => Select2::THEME_BOOTSTRAP,     'size' => Select2::LARGE, ...

Formulario con Select2

Imagen
En esta entrada les muestro como modificar un formulario generado de una tabla de muchos a muchos:  1.- Modificar el formulario colocando los selectores:  <?=  $form->field($model, 'author_id')->widget(Select2::classname(), [     'data' => ArrayHelper::map(Author::find()->all(), 'id', 'name'),     'theme' => Select2::THEME_BOOTSTRAP,     'size' => Select2::LARGE,     'options' => ['placeholder' => Yii::t('app', 'Select...')],     'pluginOptions' => [         'allowClear' => true     ], ]);      ?>  <?=  $form->field($model, 'book_id')->widget(Select2::classname(), [     'data' => ArrayHelper::map(Book::find()->all(), 'id', 'name'),     'theme' => Select2::THEME_BOOTSTRAP,     'size' => Select2::LARGE,     'options' => ['placeholder' => Yii::t...

Categoría Detalle Yii2 Variante 2

Imagen
 Pasos para crear la variante 2 de categoría detalle: 1.- Generar el crud de author_book       Model Class:      backend\modules\bookstore\models\AuthorBook\AuthorBook      Search Model Class:      backend\modules\bookstore\models\AuthorBook\AuthorBookSearch      Controller Class:      backend\modules\bookstore\controllers\AuthorBookController      View Path:      @backend/modules/bookstore/views/author-book 2.- Agregar una columna:  [     'attribute' => 'author_id',       'value' => 'author.name',      'group' => true,  // enable grouping,     'groupedRow' => true,                    // move grouped column to a single grouped row     'groupOddCssClass' => 'kv-grouped-row',  // configure odd group cell css class ...

Bootstrap 4 en la Plantilla de Yii2

Imagen
Pasos para colocar bootstrap4 en la plantilla de Yii2 1.- En el archivo frontend/assets/AppAsset.php sustituir bootstrap por bootstrap4                   public $depends = [         'yii\web\YiiAsset',         'yii\bootstrap\BootstrapAsset',     ];           Sustituir por:       public $depends = [         'yii\web\YiiAsset',         'yii\bootstrap4\BootstrapAsset',     ];      2.- En el archivo  frontend/views/layouts/main.php:      use yii\bootstrap\Nav;      use yii\bootstrap\NavBar;      use yii\widgets\Breadcrumbs;      use common\widgets\Alert;      Sustituir por:      use yii\bootstrap4\Nav;      use yii\bootstrap4\NavBar;      use yii\bootstrap4...

Columna Expandible de Kartik Categoría Detalle

 1.- Crear las tablas en la base de datos: CREATE TABLE `yii2_proyecto`.`author` ( `id` INT NOT NULL AUTO_INCREMENT , `name` VARCHAR(255) NOT NULL , PRIMARY KEY (`id`)) ENGINE = InnoDB; CREATE TABLE `yii2_proyecto`.`author` ( `id` INT NOT NULL AUTO_INCREMENT , `name` VARCHAR(255) NOT NULL , PRIMARY KEY (`id`)) ENGINE = InnoDB; CREATE TABLE `yii2_proyecto`.`author_book` ( `id` INT NOT NULL AUTO_INCREMENT , `author_id` INT NOT NULL , `book_id` INT NOT NULL , PRIMARY KEY (`id`)) ENGINE = InnoDB; ALTER TABLE `author_book` ADD FOREIGN KEY (`author_id`) REFERENCES `author`(`id`) ON DELETE CASCADE ON UPDATE CASCADE; ALTER TABLE `author_book` ADD FOREIGN KEY (`book_id`) REFERENCES `book`(`id`) ON DELETE CASCADE ON UPDATE CASCADE; 2.- Crear el módulo: Module Class: frontend\modules\library\Module; Module ID: library Añadir en el main.php:  'library' =>         [             'class' => 'frontend\modules\library\Module',   ...

Modificando el template de gii con el Gridview de Kartik

Imagen
 1.- Sustituir para colocar el use a la extensión de Kartik use <?= $generator->indexWidgetType === 'grid' ? "yii\\grid\\GridView" : "yii\\widgets\\ListView" ?>; por use <?= $generator->indexWidgetType === 'grid' ? "kartik\\grid\\GridView" : "yii\\widgets\\ListView" ?>; 2.- Eliminar la línea: <h1><?= "<?= " ?>Html::encode($this->title) ?></h1> 3.- Incluir esta línea en en Gridview para activar pjax:    'pjax'=> <?= $generator->enablePjax ? "true" : "false"  ?>, 4.- Añadir estas líneas debajo del pjax:        'responsive'=>true,         'hover'=>true,         'toolbar'=>[             '{export}',             '{toggleData}'         ],         'panel' => [             'heading'=> $this->title,    ...

RBAC Yii2 utilizando la extensión "yii2mod/yii2-rbac": "*"

Les muestro como hacer la configuración del módulo de RBAC en Yii2 utilizando una extensión que nos va a facilitar mucho la creación de los permisos y roles.  1.- Colocar en el composer.json      "yii2mod/yii2-rbac": "*" 2.- Ejecutar en el cmd de la carpeta del proyecto      composer update --prefer-dist  3.- Añadir en el common/config/main.php dentro de modules         'rbac' => [             'class' => 'yii2mod\rbac\Module',         ], 4.- En el common/config/main.php dentro de components:           'authManager' => [             'class' => 'yii\rbac\DbManager',             'defaultRoles' => ['guest', 'user'],         ],   5.-Ejecutar en el cmd de la carpeta del proyecto: php yii migrate/up --migrationPath=@yii/rbac/migrations ** Este código nos va a aña...

Habilitar botones de Ver, Modificar y Eliminar en el GridView de Yii2 con Bootstrap 4

 Les muestro dos variantes para habilitar los botones de ver, modificar, eliminar en el GridView de Yii2 que desaparecen al utilizar la plantilla de AdminLTE3: 1.- Añadir el AppAsset en el frontend/views/layout/main.php     frontend\assets\AppAsset::register($this); 2.- Sustituir en el frontend/assets/AppAsset.php la línea  'yii\bootstrap\BootstrapAsset'; por:  'yii\bootstrap4\BootstrapAsset'; 3.- Añadir en el css que está en frontend/web/css/site.css      .glyphicon {           font-family: "Font Awesome 5 Free";      }      .glyphicon-eye-open:before {           content: "\f06e";           color: var(--success);      }      .glyphicon-pencil:before {           content: "\f044";           color: var(--primary);      }  ...