estiros / yii2-adminlte-asset
为 Yii 2.0 框架提供的 AdminLTE 后端主题资源包
Requires
- almasaeed2010/adminlte: ^2.4.0
- yiisoft/yii2: 2.*
- yiisoft/yii2-bootstrap: ~2.0.0
Suggests
- cebe/yii2-gravatar: Display user icons
- rmrevin/yii2-fontawesome: Font icons
- dev-master / 3.x-dev
- 3.0.0-alpha1
- 2.7.0-beta1
- 2.6.2
- 2.6.1
- 2.6.0
- 2.5.0
- 2.5.0-rc1
- 2.4.4
- 2.4.3
- 2.4.2
- 2.4.1
- 2.4.0
- 2.4.0-rc1
- 2.4.0-beta1
- 2.3.4
- 2.3.3
- 2.3.2
- 2.3.1
- 2.3.0
- 2.2.4
- 2.2.3
- 2.2.2
- 2.2.1
- 2.2.0
- 2.1.3
- 2.1.2
- 2.1.1
- 2.1.0
- 2.0.0
- 2.0.0-beta1
- 2.0.0-alpha1
- 1.1.1
- 1.1.0
- 1.0.x-dev
- 1.0.0
- 0.2.0
- 0.1.0
- dev-develop
- dev-feature/default-options
- dev-feature/scrutinizer
- dev-feature/fix-64
- dev-feature/tests
- dev-feature/phundament-sidebar-update
This package is not auto-updated.
Last update: 2024-09-28 11:00:58 UTC
README
基于 AdminLTE 的 Yii2 框架后端 UI,可访问 AdminLTE
此包包含一个 Yii 2.0 框架资源包,该包注册了 AdminLTE 用户界面的 CSS 文件。
CSS 文件通过 Yii 推荐的 fxp/composer-asset-plugin
v1.1.1 或更高版本安装。
安装
安装此扩展的首选方式是通过 composer。
要安装 AdminLTE v2,请运行
composer require dmstr/yii2-adminlte-asset "^2.1"
要安装 AdminLTE v1,请运行
composer require dmstr/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 安装
兼容性矩阵
有关其他 问题,请先在 GitHub 上搜索。
快速开始
安装扩展后,您可以重新配置视图组件的路径映射以进行 预览。
'components' => [ 'view' => [ 'theme' => [ 'pathMap' => [ '@app/views' => '@vendor/dmstr/yii2-adminlte-asset/example-views/yiisoft/yii2-app' ], ], ], ],
对于 phd5 应用
'components' => [ 'view' => [ 'theme' => [ 'pathMap' => [ '@app/views' => '@vendor/dmstr/yii2-adminlte-asset/example-views/testing/app' ], ], ], ],
此资源包提供了布局和视图的示例文件(请参阅文件夹 examples/
),它们**不应用于在 vendor/
文件夹中直接定制**。
因此,建议您**将视图复制到您的应用中**并根据您的需求进行调整。
定制
- 从
vendor/dmstr/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 $js = [ 'datatables/dataTables.bootstrap.min.js', // more plugin Js here ]; public $css = [ 'datatables/dataTables.bootstrap.css', // more plugin CSS here ]; public $depends = [ 'dmstr\web\AdminLteAsset', ]; }
由于此资源依赖于我们的 AdminLteAsset
,因此您只需注册一个资源,例如在您的 main.php
布局文件中。
皮肤
默认情况下,此扩展使用蓝色皮肤为 AdminLTE。您可以在配置文件中更改它。
'components' => [ 'assetManager' => [ 'bundles' => [ 'dmstr\web\AdminLteAsset' => [ 'skin' => 'skin-black', ], ], ], ],
然后只需替换 body 的类 skin-blue
。如果您不想在更改皮肤颜色时更改每个视图文件,可以使用 AdminLteHelper::skinClass()
。
<body class="<?= \dmstr\helpers\AdminLteHelper::skinClass() ?>">
注意:只有在通过配置覆盖皮肤时才使用 AdminLteHelper::skinClass()
。否则,您将无法获取正确的body CSS类。
以下是可用的皮肤列表
"skin-blue",
"skin-black",
"skin-red",
"skin-yellow",
"skin-purple",
"skin-green",
"skin-blue-light",
"skin-black-light",
"skin-red-light",
"skin-yellow-light",
"skin-purple-light",
"skin-green-light"
禁用皮肤文件加载,当使用捆绑资源时
Yii::$container->set(
AdminLteAsset::className(),
[
'skin' => false,
]
);
如果您想使用AdminLTE头部原生的DOM
<h1> About <small>static page</small> </h1>
则可以按照以下代码操作
/* @var $this yii\web\View */ $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>
左侧边栏菜单 - 小部件菜单
如果您需要将菜单的各个部分分开,只需将 li.header
项目添加到 items
'items' => [ ['label' => 'Gii', 'icon' => 'file-code-o', 'url' => ['/gii']], ['label' => 'Debug', 'icon' => 'dashboard', 'url' => ['/debug']], ['label' => 'MAIN NAVIGATION', 'options' => ['class' => 'header']], // here // ... a group items ['label' => '', 'options' => ['class' => 'header']], // ... a group items ['label' => '', 'options' => ['class' => 'header']], // ... a group items
为项目添加标签
'items' => [ [ 'label' => 'Mailbox', 'icon' => 'envelope-o', 'url' => ['/mailbox'], 'template'=>'<a href="{url}">{icon} {label}<span class="pull-right-container"><small class="label pull-right bg-yellow">123</small></span></a>' ], ]
默认情况下,图标将添加Font Awesome前缀
Gii CRUD生成器模板
告诉Gii关于我们的模板。设置在配置文件中完成
if (YII_ENV_DEV) { $config['modules']['gii'] = [ 'class' => 'yii\gii\Module', 'allowedIPs' => ['127.0.0.1', '::1', '192.168.0.*', '192.168.178.20'], 'generators' => [ //here 'crud' => [ 'class' => 'yii\gii\generators\crud\Generator', 'templates' => [ 'adminlte' => '@vendor/dmstr/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
更多信息
有关AdminLTE文档,请阅读https://almsaeedstudio.com/themes/AdminLTE/documentation/index.html
命名空间规则遵循Yii 2.0框架结构,例如,Asset Bundle使用
dmstr\web