README

此存储库不再积极维护

Voyager Frontend

缺失的 Laravel 管理后台的前端。

这个 Laravel 包为 Voyager 项目添加了前端视图、路由和资源。

它包含前端布局（例如，页眉、页脚等）的基本结构和使用 Foundation 框架的主题资源。

由 Pivotal Agency 构建。

先决条件

• PHP >= 7.1.3
  • PHP 扩展 sqlite3（必需，用于 teamtnt/tntsearch）
• Node & NPM
• Composer
• Laravel 要求

安装

1. 安装 Laravel + Voyager （用您自己的值替换 $VARs）

# 1.0 Install Laravel
composer create-project --prefer-dist laravel/laravel $DIR_NAME

# 1.1 Require Voyager
cd $DIR_NAME && composer require tcg/voyager

# 1.2 Copy .env.example to .env and update the DB & App URL config
cp .env.example .env

# 1.3 Generate a Laravel key
php artisan key:generate

# 1.4 Install Laravel frontend - Only on Laravel 7+
php artisan ui bootstrap --auth

# 1.5 Run the Voyager Installer
php artisan voyager:install

# 1.6 Create a Voyager Admin User
php artisan voyager:admin $YOUR_EMAIL --create

2. 安装 Voyager 前端

# 2.0 Require this Package in your fresh Laravel/Voyager project
composer require pvtl/voyager-frontend

# 2.1 Run the Installer
composer dump-autoload && php artisan voyager-frontend:install

# 2.3 Build the front-end theme assets
npm install
npm run dev

# 2.4 Set the Laravel search driver in your .env
echo "SCOUT_DRIVER=tntsearch" >> .env

遇到问题？请参阅下面的故障排除部分。

有了 Cron 吗？

这是对在您的服务器上设置标准 Laravel cron 的一个提醒。Voyager 前端包有几个计划任务，所以依赖于 cron 的运行。

* * * * * php /path-to-your-project/artisan schedule:run >> /dev/null 2>&1

主题开发

SCSS & JS

当您准备开始美化前端时，您可以在更新 SCSS 和/或 JS 文件后使用以下命令

覆盖视图

假设您想更新前端页眉的布局

1. 创建目录 resources/views/vendor/voyager-frontend
   • 您放入此处的任何文件都将替换此包中包含的默认视图
2. 从 vendor/pvtl/voyager-frontend/resources/views/（在本例中，是 partials/header.blade.php）复制相应的文件到相应的文件结构并更新

因此现在您将会有

    /resources
        /views
            /vendor
                /voyager-frontend
                    /partials
                        /header.blade.php

对 header.blade.php 的任何更改都会自动反映在网站上。

缩略图 / 图片缩放

此包包含一个自动图片缩放功能。当您在前端 blade 模板中引用图片时，只需调用类似以下内容

{{ imageUrl($pathToImage, $width, $height, $config = ['crop' => false, 'quality' => 100] ) ?: '/default.png' }}

<!-- For example for a 300px wide thumbnail scaled down (i.e. no cropping) -->
<img src="{{ imageUrl($blockData->image, 300, null, ['crop' => false]) ?: '/default.png' }}" />

<!-- Or a 200px by 100px cropped thumbnail -->
<img src="{{ imageUrl($blockData->image, 200, 100) ?: '/default.png' }}" />

“CDN”您的图片

该函数将输出一个绝对 URL，其中主机名将是 APP_URL - 但是您可以在 .env 文件中添加一个 ASSET_URL 变量以使用不同的主机名。

搜索

生成索引

此模块包含一个计划任务来重新生成索引，一旦您为 Laravel 设置了任务，它将自动运行。如果您需要手动测试和重新生成搜索索引，可以手动运行命令 php artisan voyager-frontend:generate-search-indices。

配置搜索（使用 Laravel Scout）

默认情况下，此模块在您在 .env 文件中定义以下变量后，将自动包含“搜索”的“页面”和“帖子”模型 - 查看 Laravel Scout 文档

SCOUT_DRIVER=tntsearch

但是，您可以扩展并定义自己的“可搜索”模型以包含在搜索结果中，方法是将“可搜索”特征附加到它们上。

class Page extends Model
{
    use Searchable;

    public $asYouType = false;

    /**
     * Get the indexed data array for the model.
     * @return array
     */
    public function toSearchableArray()
    {
        $array = $this->toArray();

        // customise the searchable array
        
        return $array
    }
}

然后您可以通过将您的“可搜索”模型合并到配置键中（最好使用 Service Provider）来挂钩到搜索配置：scout.tntsearch.searchableModels。

$this->mergeConfigFrom(self::PACKAGE_DIR . 'path/to/config/scout.php', 'scout.tntsearch.searchableModels');

您的配置文件应包含类似于此模块 scout.php 配置中的值

<?php

return [
    '\My\Searchable\Models\Namespace',
];

测试

您可以通过将Pvtl/Test包切换到包目录并运行Composer脚本来进行测试。

  cd packages/pivotal/test;
  composer run test

故障排除

错误：类VoyagerFrontendDatabaseSeeder不存在

只需再次运行php artisan voyager-frontend:install

错误：命令"npm i ..."失败。

运行npm install，然后再次尝试运行php artisan voyager-frontend:install