insolita/yii2-adminlte-widgets

Widgets for AdminLTE theme (Box with remember collapse state, Timeline, Tile, Callout, SmallBox etc)

Maintainers

👁 Insolita

Package info

github.com/Insolita/yii2-adminlte-widgets

Type:yii2-extension

pkg:composer/insolita/yii2-adminlte-widgets

Statistics

Installs: 522 937

Dependents: 14

Suggesters: 0

Stars: 63

Open Issues: 0

3.2.3 2021-08-12 10:31 UTC

Requires

Requires (Dev)

None

Suggests

None

Provides

None

Conflicts

None

Replaces

None

MIT e7f7b5b57e5ecd4630eb7c66d0d8bf8b6f5e7824

  • insolita <donnainsolita.woop@gmail.com>

widgetyii2AdminLTE


README

Use 3.x tags for yii >= 2.0.13

Use 2.x tags for yii < 2.0.13

  • Box-widget with support collapse buttons and can save collapsed state in cookie support solid style
  • Tile-widget - similar as box, with same options but with background
  • Smallbox-widget
  • Alert-widget
  • Callout-widget
  • Infobox-widget
  • Flash-Alerts
  • [Timeline Widget] (http://almsaeedstudio.com/themes/AdminLTE/pages/UI/timeline.html) - see more info about it in file Timeline.md
  • ChatBox since 2.0
  • LteSetup since 2.0

See http://almsaeedstudio.com/themes/AdminLTE/pages/widgets.html and http://almsaeedstudio.com/themes/AdminLTE/pages/UI/general.html examples

CHANGELOG

Independent of any AdminLte AssetBundles If you want use cookie collapsing boxes, set correct dependencies in AssetManager

'components'=>[
//--------
 'assetManager'=>[
 'class'=>'yii\web\AssetManager',
 'bundles'=>[
 //--------
 'insolita\wgadminlte\JsCookieAsset'=>[
 'depends'=>[
 'yii\web\YiiAsset',
 'namespace\for\AdminLteAsset', // for example 'dmstr\web\AdminLteAsset', if we use https://github.com/dmstr/yii2-adminlte-asset
 ]
 ],
 'insolita\wgadminlte\CollapseBoxAsset'=>[
 'depends'=>[
 'insolita\wgadminlte\JsCookieAsset'
 ]
 ],
 ],
 ]
//--------

]

Installation

The preferred way to install this extension is through composer.

Either run

php composer.phar require --prefer-dist insolita/yii2-adminlte-widgets "^3.2"

or add

"insolita/yii2-adminlte-widgets": "^3.2"

to the "require" section of your composer.json file.

Usage

  • Box
 <?php \insolita\wgadminlte\LteBox::begin([
 'type'=>\insolita\wgadminlte\LteConst::TYPE_INFO,
 'isSolid'=>true,
 'boxTools'=>'<button class="btn btn-success btn-xs create_button" ><i class="fa fa-plus-circle"></i> Add</button>',
 'tooltip'=>'this tooltip description',
 'title'=>'Manage users',
 'footer'=>'total 44 active users',
 ])?>
 ANY BOX CONTENT HERE
 <?php \insolita\wgadminlte\LteBox::end()?>
  • Tile
 <?php \insolita\wgadminlte\LteBox::begin([
 'type'=>\insolita\wgadminlte\LteConst::COLOR_MAROON,
 'tooltip'=>'Useful information!',
 'title'=>'Attention!',
 'isTile'=>true
 ])?>
 ANY BOX CONTENT HERE
 <?php \insolita\wgadminlte\LteBox::end()?>
  • Box with content as property
 <?php \insolita\wgadminlte\LteBox::widget([
 'type'=>\insolita\wgadminlte\LteConst::COLOR_MAROON,
 'tooltip'=>'Useful information!',
 'title'=>'Attention!',
 'isTile'=>true,
 'body'=>'Some Box content'
 ])?>
  • CollapseBox (Based on LteBox)
 <?php \insolita\wgadminlte\CollapseBox::begin([
 'type'=>\insolita\wgadminlte\LteConst::TYPE_INFO,
 'collapseRemember' => true,
 'collapseDefault' => false,
 'isSolid'=>true,
 'boxTools'=>'<button class="btn btn-success btn-xs create_button" ><i class="fa fa-plus-circle"></i> Добавить</button>',
 'tooltip'=>'Описание содаржимого',
 'title'=>'Управление пользователями',
 ])?>
 ANY BOX CONTENT HERE
 <?php \insolita\wgadminlte\CollapseBox::end()?>
  • SmallBox
 <?php echo \insolita\wgadminlte\LteSmallBox::widget([
 'type'=>\insolita\wgadminlte\LteConst::COLOR_LIGHT_BLUE,
 'title'=>'90%',
 'text'=>'Free Space',
 'icon'=>'fa fa-cloud-download',
 'footer'=>'See All <i class="fa fa-hand-o-right"></i>',
 'link'=>Url::to("/user/list")
 ]);?>
  • InfoBox
 <?php echo \insolita\wgadminlte\LteInfoBox::widget([
 'bgIconColor'=>\insolita\wgadminlte\LteConst::COLOR_AQUA,
 'bgColor'=>'',
 'number'=>100500,
 'text'=>'Test Three',
 'icon'=>'fa fa-bolt',
 'showProgress'=>true,
 'progressNumber'=>66,
 'description'=>'Something about this'
 ])?>
  • Callout
 <?php \insolita\wgadminlte\Callout::widget([
 'type'=>\insolita\wgadminlte\LteConst::TYPE_WARNING,
 'head'=>'Operation Complete',
 'text'=>'Something text bla-bla-bla bla-bla-blabla-bla-blabla-bla-blabla-bla-blabla-bla-blabla-bla-bla'
 ]);?>
 <?php \insolita\wgadminlte\Callout::begin([
 'type'=>\insolita\wgadminlte\LteConst::TYPE_WARNING,
 'head'=>'Operation Complete'
 ]);?>
<?php \insolita\wgadminlte\Callout::end()?>
  • Alert
 <?=\insolita\wgadminlte\Alert::widget([
 'type'=>\insolita\wgadminlte\LteConst::TYPE_SUCCESS,
 'text'=>'Operation Complete',
 'closable'=>true
 ]);?>
 <?php
 \insolita\wgadminlte\Alert::begin([
 'type'=>\insolita\wgadminlte\LteConst::TYPE_SUCCESS,
 'closable'=>true
 ]);?>
 Some alert message
 <?php \insolita\wgadminlte\Alert::end()?>
  • FlashAlerts

Add in layout

 <?= \insolita\wgadminlte\FlashAlerts::widget([
 'errorIcon' => '<i class="fa fa-warning"></i>',
 'successIcon' => '<i class="fa fa-check"></i>',
 'successTitle' => 'Done!', //for non-titled type like 'success-first'
 'closable' => true,
 'encode' => false,
 'bold' => false,
 ]); ?>

And set flash messages anywhere

Yii::$app->session->setFlash('info1','Message1');
Yii::$app->session->setFlash('info2','Message2');
Yii::$app->session->setFlash('info3','Message3');
Yii::$app->session->setFlash('success-first','Message');
Yii::$app->session->setFlash('success-second','Message');

Since 2.0

  • ChatBox
<?php 
 \insolita\wgadminlte\LteChatBox::begin([
 'type' => \insolita\wgadminlte\LteConst::TYPE_PRIMARY,
 'footer'=>'<input type="text" name="newMessage">',
 'title'=>'Messages',
 'boxTools' => '<button class="btn btn-xs"><i class="fa fa-refresh"></i></button>'
 ]);
 echo \insolita\wgadminlte\LteChatMessage::widget([
 'isRight' => false,
 'author' => 'Artur Green',
 'message' => 'Some message bla-bla',
 'image'=>'https://almsaeedstudio.com/themes/AdminLTE/dist/img/user3-128x128.jpg',
 'createdAt' => '5 minutes ago'
]);
 echo \insolita\wgadminlte\LteChatMessage::widget([
 'isRight' => true,
 'author' => 'Jane Smith',
 'message' => 'Some message bla-bla',
 'image'=>'https://almsaeedstudio.com/themes/AdminLTE/dist/img/user1-128x128.jpg',
 'createdAt' => '2017-23-03 17:33'
 ]);
 \insolita\wgadminlte\LteChatBox::end();
?>

Widget for configure lte settings

Add in layout

<?php
 \insolita\wgadminlte\LteSetup::widget([
 'animationSpeed' => 'fast',
 'enableFastclick' => false,
 'navbarMenuSlimscroll'=>false
 //etc...
]);
?>

👁 Example