xiongchuan/yii2-adminlte-treeview

A Bootstrap Treeview Generator for AdminLte Sidebar

dev-master 2016-12-26 10:43 UTC

This package is not auto-updated.

Last update: 2024-12-16 14:01:19 UTC


README

A Bootstrap Treeview Generator for AdminLte Sidebar,Based meysampg/yii2-treeview

Description

对 meysampg/yii2-treeview treemenu进行了简单的增强,原作者merge的太慢,我fork了一个。

It's just an extended version of yii\bootstrap\Nav for generating proper code for sidebar of AdminLte with support of badgets.

Installation

The preferred way to install this extension is through composer.

Either run

composer require xiongchuan/yii2-adminlte-treeview "*"

or add

"xiongchuan/yii2-adminlte-treeview": "*"

to the require section of your composer.json file.

Usage

Once the extension is installed, simply use it in your code by:

use xiongchuan\treeview\Treeview;

and use it on your code by

<!-- sidebar menu: : style can be found in sidebar.less -->
<?= Treeview::widget([
    'items' => [
      [
          'label' => Yii::t('app', 'Dashboard'),
          'icon' => 'fa fa-dashboard',
          'url' => Url::home(),
      ],
      [
          'label' => Yii::t('app', 'Messages'),
          'icon' => 'fa fa-envelope',
          'items' => [
              [
                  'label' => Yii::t('app', 'Inbox'),
                  'url' => ['/message/inbox'],
              ],
              [
                  'label' => Yii::t('app', 'Outbox'),
                  'url' => ['/message/outbox'],
              ],
              [
                  'label' => Yii::t('app', 'Create'),
                  'url' => ['/message/create'],
              ],
          ],
      ],
    ]
]) ?>

And simply output is what is needed:

dashboard_lte

Examples

H‍‍‍ere is a RTL example:

<!-- sidebar menu: : style can be found in sidebar.less -->
<?= Treeview::widget([
    'items' => [
        [
            'label' => 'داشبورد',
            'icon' => 'fa fa-dashboard',
            'url' => Url::home(),
        ],
        [
            'label' => 'پیام‌ها',
            'icon' => 'fa fa-envelope',
            'items' => [
                [
                    'label' => 'صندوق ورودی',
                    'url' => ['/message/inbox'],
                    'badget' => [
                        'text' => 4,
                        'color' => 'label-info',
                        'float' => 'left',
                    ],
                ],
                [
                    'label' => 'صندوق خروجی',
                    'url' => ['/message/outbox'],
                ],
                [
                    'label' => 'ایجاد پیام',
                    'url' => ['/message/create'],
                ],
            ],
        ],
    ]
]) ?>

dashboard_lte_rtl

and a LTR example:

<!-- sidebar menu: : style can be found in sidebar.less -->
<?= Treeview::widget([
    'items' => [
        [
            'label' => 'Dashboard',
            'icon' => 'fa fa-dashboard',
            'url' => Url::home(),
        ],
        [
            'label' => 'Message',
            'icon' => 'fa fa-envelope',
            'items' => [
                [
                    'label' => 'Inbox',
                    'url' => ['/message/inbox'],
                    'badget' => [
                        'text' => 4,
                        'color' => 'label-info',
                    ],
                ],
                [
                    'label' => 'Outbox',
                    'url' => ['/message/outbox'],
                ],
                [
                    'label' => 'Create',
                    'url' => ['/message/create'],
                ],
            ],
        ],
    ]
]) ?>

dashboard_lte_ltr

Configuration

There is no much configuration for this extension. Just it's needed to send an array of sidebar items to items property of Treeview. Also for color property of badget It can be a CSS class with color, for continence you can use this values:

  • label-default
  • label-success
  • label-info
  • label-danger
  • label-warning

Contribution

Report bugs, request a feature or do your modification and send a pull request :).