laravel-frontend-presets/white-dashboard

Laravel 10.x 适用于白色仪表盘的前端预设

v1.0.5 2023-03-13 13:50 UTC

This package is auto-updated.

Last update: 2024-09-12 11:10:32 UTC


README

version license GitHub issues open GitHub issues closed

使用为 Laravel 框架 9.x 及以上版本构建的 Bootstrap 4 管理仪表盘,加速您的Web开发。

如果您想获得更多功能,请使用White Dashboard PRO Laravel升级至PRO版本。

注意

我们建议在从头开始的项目上安装此预设,否则您的项目设计可能会损坏。

先决条件

如果您还没有安装带有 PHP 和 MySQL 的 Apache 本地环境,请使用以下链接之一

此外,您还需要安装 Composer: https://getcomposer.org.cn/doc/00-intro.md

以及 Laravel: https://laravel.net.cn/docs/10.x

安装

初始化 Laravel 新实例(并进行所有必要的配置)后,使用以下提供的方法之一安装预设

通过 composer

  1. Cd 进入您的 Laravel 应用程序
  2. 在终端中输入:composer require laravel/uiphp artisan ui vue --auth
  3. 通过 composer require laravel-frontend-presets/white-dashboard 安装此预设。无需注册服务提供者。Laravel 9.x 及以上版本可以自动检测该软件包。
  4. 运行 php artisan ui white 命令安装 Argon 预设。这将安装所有必要的资源以及自定义的认证视图,它还会在 routes/web.php 中添加认证路由(注意:如果您多次运行此命令,请确保清理 routes/web.php 中的重复认证条目)
  5. 在终端运行 composer dump-autoload
  6. 运行 php artisan migrate --seed 创建基本的用户表

通过存档

  1. 在应用程序的根目录中创建一个 presets 文件夹
  2. 下载 repo 的存档并解压缩
  3. white-dashboard-master 文件夹复制粘贴到预设(在第 2 步中创建)中,并将其重命名为 white
  4. 打开 composer.json 文件
  5. "LaravelFrontendPresets\\WhitePreset\\": "presets/white/src" 添加到 autoload/psr-4autoload-dev/psr-4
  6. LaravelFrontendPresets\WhitePreset\WhitePresetServiceProvider::class 添加到 config/app.php 文件
  7. 在终端中输入:composer require laravel/uiphp artisan ui vue --auth
  8. 在终端运行 composer dump-autoload
  9. 运行 php artisan ui white 命令安装 White Dashboard 预设。这将安装所有必要的资源以及自定义的认证视图,它还会在 routes/web.php 中添加认证路由(注意:如果您多次运行此命令,请确保清理 routes/web.php 中的重复认证条目)
  10. 运行 php artisan migrate --seed 创建基本的用户表

用法

注册用户或使用邮箱 admin@white.com密码 登录,开始测试预设功能(确保运行迁移和种子文件,以便这些凭证可用)。

除了仪表板和认证页面,此预设还包括编辑个人资料页面。所有必要的文件(控制器、请求、视图)都预装好,并添加了所有所需的路由到 routes/web.php。请记住,所有功能都可以通过使用上述凭证登录或注册自己的用户来查看。

仪表板

您可以通过点击左侧边栏中的 "仪表板" 链接或添加 /home 到 URL 来访问仪表板。

个人资料编辑

您可以选择编辑当前登录用户的个人资料(更改姓名、电子邮件和密码)。要访问此页面,只需点击左侧边栏中的 "用户个人资料" 链接或将 /profile 添加到 URL。

App\Http\Controllers\ProfileController 负责更新用户信息。

public function update(ProfileRequest $request)
{
    auth()->user()->update($request->all());

    return back()->withStatus(__('Profile successfully updated.'));
}

在编辑个人资料时,您无需担心输入错误的数据,因为已经添加了验证规则来防止这种情况(请参阅 App\Http\Requests\ProfileRequest)。如果您尝试更改密码,您会看到在 App\Http\Requests\PasswordRequest 中添加了其他验证规则。注意,在此文件中,您还有一个可以在 App\Rules\CurrentPasswordCheckRule 中找到的自定义验证规则。

public function rules()
{
    return [
        'old_password' => ['required', 'min:6', new CurrentPasswordCheckRule],
        'password' => ['required', 'min:6', 'confirmed', 'different:old_password'],
        'password_confirmation' => ['required', 'min:6'],
    ];
}

目录

版本

演示

文档

White Dashboard Laravel 的文档托管在我们的 网站 上。

文件结构

├───app
│   ├───Http
│   │   ├───Controllers
│   │   │       HomeController.php
│   │   │       PageController.php
│   │   │       ProfileController.php
│   │   │       UserController.php
│   │   │       
│   │   └───Requests
│   │           PasswordRequest.php
│   │           ProfileRequest.php
│   │           UserRequest.php
│   │           
│   └───Rules
│           CurrentPasswordCheckRule.php
│           
├───database
│   └───seeds
│           DatabaseSeeder.php
│           UsersTableSeeder.php
│           
└───resources
    ├───assets
    │   ├───css
    │   │       white-dashboard.css
    │   │       white-dashboard.css.map
    │   │       white-dashboard.min.css
    │   │       nucleo-icons.css
    │   │       theme.css
    │   │       
    │   ├───demo
    │   │       demo.css
    │   │       demo.js
    │   │       
    │   ├───fonts
    │   │       nucleo.eot
    │   │       nucleo.ttf
    │   │       nucleo.woff
    │   │       nucleo.woff2
    │   │       
    │   ├───img
    │   │       anime3.png
    │   │       anime6.png
    │   │       apple-icon.png
    │   │       bg5.jpg
    │   │       card-primary.png
    │   │       default-avatar.png
    │   │       emilyz.jpg
    │   │       favicon.png
    │   │       header.jpg
    │   │       img_3115.jpg
    │   │       james.jpg
    │   │       mike.jpg
    │   │       
    │   ├───js
    │   │   │   white-dashboard.js
    │   │   │   white-dashboard.js.map
    │   │   │   white-dashboard.min.js
    │   │   │   theme.js
    │   │   │   
    │   │   ├───core
    │   │   │       bootstrap.min.js
    │   │   │       jquery.min.js
    │   │   │       popper.min.js
    │   │   │       
    │   │   └───plugins
    │   │           bootstrap-notify.js
    │   │           chartjs.min.js
    │   │           perfect-scrollbar.jquery.min.js
    │   │           
    │   └───scss
    │       │   white-dashboard.scss
    │       │   
    │       └───white-dashboard
    │           ├───bootstrap
    │           │   │   _alert.scss
    │           │   │   _badge.scss
    │           │   │   _breadcrumb.scss
    │           │   │   _button-group.scss
    │           │   │   _buttons.scss
    │           │   │   _card.scss
    │           │   │   _carousel.scss
    │           │   │   _close.scss
    │           │   │   _code.scss
    │           │   │   _custom-forms.scss
    │           │   │   _dropdown.scss
    │           │   │   _forms.scss
    │           │   │   _functions.scss
    │           │   │   _grid.scss
    │           │   │   _images.scss
    │           │   │   _input-group.scss
    │           │   │   _jumbotron.scss
    │           │   │   _list-group.scss
    │           │   │   _media.scss
    │           │   │   _mixins.scss
    │           │   │   _modal.scss
    │           │   │   _nav.scss
    │           │   │   _navbar.scss
    │           │   │   _pagination.scss
    │           │   │   _popover.scss
    │           │   │   _print.scss
    │           │   │   _progress.scss
    │           │   │   _reboot.scss
    │           │   │   _root.scss
    │           │   │   _tables.scss
    │           │   │   _tooltip.scss
    │           │   │   _transitions.scss
    │           │   │   _type.scss
    │           │   │   _utilities.scss
    │           │   │   _variables.scss
    │           │   │   
    │           │   ├───mixins
    │           │   │       _alert.scss
    │           │   │       _background-variant.scss
    │           │   │       _badge.scss
    │           │   │       _border-radius.scss
    │           │   │       _box-shadow.scss
    │           │   │       _breakpoints.scss
    │           │   │       _buttons.scss
    │           │   │       _caret.scss
    │           │   │       _clearfix.scss
    │           │   │       _float.scss
    │           │   │       _forms.scss
    │           │   │       _gradients.scss
    │           │   │       _grid-framework.scss
    │           │   │       _grid.scss
    │           │   │       _hover.scss
    │           │   │       _image.scss
    │           │   │       _list-group.scss
    │           │   │       _lists.scss
    │           │   │       _nav-divider.scss
    │           │   │       _pagination.scss
    │           │   │       _reset-text.scss
    │           │   │       _resize.scss
    │           │   │       _screen-reader.scss
    │           │   │       _size.scss
    │           │   │       _table-row.scss
    │           │   │       _text-emphasis.scss
    │           │   │       _text-hide.scss
    │           │   │       _text-truncate.scss
    │           │   │       _transition.scss
    │           │   │       _visibility.scss
    │           │   │       
    │           │   └───utilities
    │           │           _align.scss
    │           │           _background.scss
    │           │           _borders.scss
    │           │           _clearfix.scss
    │           │           _display.scss
    │           │           _embed.scss
    │           │           _flex.scss
    │           │           _float.scss
    │           │           _position.scss
    │           │           _screenreaders.scss
    │           │           _shadows.scss
    │           │           _sizing.scss
    │           │           _spacing.scss
    │           │           _text.scss
    │           │           _visibility.scss
    │           │           
    │           ├───custom
    │           │   │   _alerts.scss
    │           │   │   _buttons.scss
    │           │   │   _card.scss
    │           │   │   _checkboxes-radio.scss
    │           │   │   _dropdown.scss
    │           │   │   _fixed-plugin.scss
    │           │   │   _footer.scss
    │           │   │   _forms.scss
    │           │   │   _functions.scss
    │           │   │   _images.scss
    │           │   │   _input-group.scss
    │           │   │   _misc.scss
    │           │   │   _mixins.scss
    │           │   │   _modal.scss
    │           │   │   _navbar.scss
    │           │   │   _rtl.scss
    │           │   │   _sidebar-and-main-panel.scss
    │           │   │   _tables.scss
    │           │   │   _type.scss
    │           │   │   _utilities.scss
    │           │   │   _variables.scss
    │           │   │   _white-content.scss
    │           │   │   
    │           │   ├───cards
    │           │   │       _card-chart.scss
    │           │   │       _card-map.scss
    │           │   │       _card-plain.scss
    │           │   │       _card-task.scss
    │           │   │       _card-user.scss
    │           │   │       
    │           │   ├───mixins
    │           │   │       opacity.scss
    │           │   │       _alert.scss
    │           │   │       _background-variant.scss
    │           │   │       _badges.scss
    │           │   │       _buttons.scss
    │           │   │       _dropdown.scss
    │           │   │       _forms.scss
    │           │   │       _icon.scss
    │           │   │       _inputs.scss
    │           │   │       _modals.scss
    │           │   │       _page-header.scss
    │           │   │       _popovers.scss
    │           │   │       _vendor-prefixes.scss
    │           │   │       _wizard.scss
    │           │   │       
    │           │   ├───utilities
    │           │   │       _backgrounds.scss
    │           │   │       _floating.scss
    │           │   │       _helper.scss
    │           │   │       _position.scss
    │           │   │       _shadows.scss
    │           │   │       _sizing.scss
    │           │   │       _spacing.scss
    │           │   │       _text.scss
    │           │   │       _transform.scss
    │           │   │       
    │           │   └───vendor
    │           │           _plugin-animate-bootstrap-notify.scss
    │           │           _plugin-perfect-scrollbar.scss
    │           │           
    │           └───plugins
    │                   _plugin-perfect-scrollbar.scss
    │                   
    └───views
        │   dashboard.blade.php
        │   welcome.blade.php
        │   
        ├───alerts
        │       feedback.blade.php
        │       success.blade.php
        │       
        ├───auth
        │   │   login.blade.php
        │   │   register.blade.php
        │   │   verify.blade.php
        │   │   
        │   └───passwords
        │           email.blade.php
        │           reset.blade.php
        │           
        ├───layouts
        │       │   app.blade.php
        │       │   footer.blade.php
        │       │   
        │       └───navbars
        │           │   navbar.blade.php
        │           │   sidebar.blade.php
        │           │   
        │           └───navs
        │                   auth.blade.php
        │                   guest.blade.php
        │           
        ├───pages
        │       icons.blade.php
        │       language.blade.php
        │       map.blade.php
        │       maps.blade.php
        │       notifications.blade.php
        │       rtl.blade.php
        │       tables.blade.php
        │       table_list.blade.php
        │       typography.blade.php
        │       upgrade.blade.php
        │       
        ├───profile
        │       edit.blade.php
        │       
        └───users
                index.blade.php

浏览器支持

目前,我们正式支持以下浏览器的最后两个版本

资源

变更日志

有关最近更改的更多信息,请参阅 变更日志

鸣谢

问题报告

我们使用 GitHub Issues 作为 White Dashboard Laravel 的官方错误跟踪器。以下是我们用户在报告问题时的一些建议:

  1. 请确保您正在使用 White Dashboard Laravel 的最新版本。检查我们的 网站 仪表板中的 CHANGELOG。
  2. 提供可重现问题的步骤将缩短修复时间。
  3. 某些问题可能特定于浏览器,因此指定您在哪个浏览器遇到问题可能有助于解决问题。

许可

有用链接

社交媒体

Creative Tim

Twitter: https://twitter.com/CreativeTim?ref=wdl-readme

Facebook: https://#/CreativeTim?ref=wdl-readme

Dribbble: https://dribbble.com/creativetim?ref=wdl-readme

Instagram: https://www.instagram.com/CreativeTimOfficial?ref=wdl-readme

Updivision

Twitter: https://twitter.com/updivision?ref=wdl-readme

Facebook: https://#/updivision?ref=wdl-readme

LinkedIn: https://www.linkedin.com/company/updivision?ref=wdl-readme

Updivision博客: https://updivision.com/blog/?ref=wdl-readme

鸣谢