README

基于 AdminLTE 的 Yii2 框架后端 UI

本包包含一个Yii 2.0 框架资源包，用于注册 AdminLTE 用户界面的 CSS 文件。

这些 CSS 文件通过 Yii 推荐的 fxp/composer-asset-plugin v1.1.1 或更高版本安装。

安装

安装此扩展的首选方式是通过 composer。

要安装 AdminLTE v2，请运行

composer require memouk/yii2-adminlte-asset "^2.1"

要安装 AdminLTE v1，请运行

composer require memouk/yii2-adminlte-asset "^1"

常见问题解答

Web 字体使用

AdminLTE 在 2.4.0 版本中取消了 Web 字体的包含，因此您需要手动包含您想要的字体，例如。

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic">

不建议在生产环境中通过 CDN 包含，请根据您项目的资源打包工作流进行调整。

有关详细信息，请参阅 #140。

升级

升级时，请参阅 AdminLTE 升级指南，了解您需要在视图中进行的调整。

Composer 安装

有关 DmitryBaranovskiy/eve.git 的问题，请参阅 #128 和 #113。

兼容性矩阵

有关其他问题，请首先在 GitHub 上搜索。

快速入门

安装扩展后，您可以通过重新配置视图组件的路径映射来获得一个预览。

对于 Yii 2 高级应用模板或基本应用模板

'components' => [
    'view' => [
         'theme' => [
             'pathMap' => [
                '@app/views' => '@vendor/memouk/yii2-adminlte-asset/example-views/yiisoft/yii2-app'
             ],
         ],
    ],
],

对于 phd5 应用程序

'components' => [
    'view' => [
        'theme' => [
            'pathMap' => [
                '@app/views' => '@vendor/memouk/yii2-adminlte-asset/example-views/testing/app'
            ],
        ],
    ],
],

此资源包提供了布局和视图的示例文件（请参阅文件夹 examples/），它们不打算直接在 vendor/ 文件夹中自定义。

因此，建议您将视图复制到您的应用程序中，并根据需要进行调整。

自定义

从 vendor/memouk/yii2-adminlte-asset/example-views/yiisoft/yii2-app（或其他主题）复制文件到 @app/views。
如果您之前已添加，请通过删除路径映射来从您的应用程序中删除自定义 view 配置。
根据 vendor/almasaeed2010/adminlte/pages 的 html 标记编辑您的视图

AdminLTE 插件

AdminLTE 插件的资源不包括在我们的 AdminLteAsset 中，但您可以在 vendor/almasaeed2010/adminlte/plugins 下的您的供应商目录中找到这些文件。因此，如果您想使用任何这些插件，我们建议您创建一个自定义包，其中列出您需要的插件文件。

use yii\web\AssetBundle;
class AdminLtePluginAsset extends AssetBundle
{
    public $sourcePath = '@vendor/almasaeed2010/adminlte/plugins';
    public $css = [
        'chart.js/Chart.min.css',
        // more plugin CSS here
    ];
    public $js = [
        'chart.js/Chart.bundle.min.js'
        // more plugin Js here
    ];
    public $depends = [
        'memouk\adminlte\web\AdminLteAsset',
    ];
}

由于此资源依赖于我们的 AdminLteAsset，因此它是您必须注册的唯一资源，例如在您的 main.php 布局文件中。

自定义内容头部

如果您想使用 AdminLTE 头部的原生 DOM

<h1>
    About <small>static page</small>
</h1>

则可以遵循以下代码

/* @var yii\web\View $this */

$this->params['breadcrumbs'][] = 'About';

$this->beginBlock('content-header'); ?>
About <small>static page</small>
<?php $this->endBlock(); ?>

<div class="site-about">
    <p> This is the About page. You may modify the following file to customize its content: </p>
    <code><?= __FILE__ ?></code>
</div>

左侧侧边栏菜单 - 小部件菜单

如果您需要分隔菜单的部分，只需将header选项添加到items中的项目即可。

    'items' => [
        ['label' => 'Gii', 'iconType' => 'far' 'icon' => 'file-code', 'url' => ['/gii']],
        ['label' => 'Debug', 'icon' => 'dashboard-alt', 'url' => ['/debug']],
        ['label' => 'MAIN NAVIGATION', 'header' => true], // here
        // ... a group items
        ['label' => '', 'header' => true],
        // ... a group items
        ['label' => '', 'header' => true],
        // ... a group items

为项目添加徽章。

'items' => [
    [
        'label' => 'Mailbox',
        'iconType' => 'far',
        'icon' => 'envelope',
        'url' => ['/mailbox'],
        'badge' => '<span class="badge badge-info right">123</span>'
    ],
]

默认情况下，图标将添加Font Awesome的前缀。

Gii CRUD生成器的模板。

告诉Gii关于我们的模板。设置在配置文件中进行。

if (YII_ENV_DEV) {
    $config['modules']['gii'] = [
        'class' => 'yii\gii\Module',
        'generators' => [ // HERE
            'crud' => [
                'class' => 'yii\gii\generators\crud\Generator',
                'templates' => [
                    'adminlte' => '@vendor/memouk/yii2-adminlte-asset/gii/templates/crud/simple',
                ]
            ]
        ],
    ];
}

测试

前往测试文件夹并启动测试栈。

cd tests
docker-compose up -d

在测试应用程序中安装yii2-adminlte-asset。

docker-compose exec php composer install

在浏览器中打开测试URL。

http://docker.local:20580/test
http://docker.local:20580/test/login

memouk / yii2-adminlte-asset

维护者

详细信息