Laravel Nova 資源工具

2023-02-16 17:09 更新

總覽

資源工具與 工具 很類似;然而,資源工具并不會顯示在 Nova 的側邊欄,而是顯示在特定的資源詳情頁。 與 Nova 工具一樣,資源工具具有高度的可自定義性,并且主要由一個完全由你控制的單文件 Vue 組件構成。

定義工具

可以使用 Artisan 命令使用 nova:resource-tool 生成資源工具。默認情況下,所有新工具都將放置在應用程序的 nova-components 目錄中。使用 nova:resource-tool 命令生成工具時,傳遞給該命令的工具名稱應遵循 Composer 供應商/程序包格式。因此,如果我們要構建 Stripe 檢查器工具,則可以運行以下命令:

artisan nova:resource-tool acme / stripe-in??spector

生成工具時,Nova 會提示您安裝工具的 NPM 依賴項,編譯其資產(chǎn)并更新應用程序的 composer.json 文件。所有自定義工具都已在您的應用程序中注冊為 Composer “路徑” 存儲庫。

Nova 資源工具包括構建工具所需的所有支架。每個工具甚至都包含其自己的 composer.json 文件,并準備與 GitHub 上的世界或您選擇的源代碼控制提供商共享。

注冊工具

Nova 資源工具可能已在資源的 fields 方法中注冊。此方法返回資源可用的字段數(shù)組。要注冊您的資源工具,請將您的工具添加到此方法返回的字段數(shù)組中:

use Acme\StripeInspector\StripeInspector;

/**
 * 獲取資源顯示的字段
 *
 * @param  \Illuminate\Http\Request  $request
 * @return array
 * /
public function fields(Request $request)
{
    return [
        ID::make('ID', 'id')->sortable(),

        StripeInspector::make()->canSee(function ($request) {
            return false;
        }),
    ];
}

工具選項

通常,你應該允許工具的使用者可以自定義工具的配置選項。可以通過在工具類上公開方法來做到這一點。這些方法可以調用工具的基礎 withMeta 方法,以將信息添加到工具的元數(shù)據(jù)中,該元數(shù)據(jù)將在您的 Tool.vue 組件中可用withMeta 方法接受鍵 / 值選項數(shù)組:

<?php

namespace Acme\StripeInspector;

use Laravel\Nova\ResourceTool;

class StripeInspector extends ResourceTool
{
    /**
     * 獲取資源工具的顯示名稱
     *
     * @return string
     */
    public function name()
    {
        return 'Stripe Inspector';
    }

    /**
     * 表示條紋檢查員應允許退款
     *
     * @return $this
     */
    public function issuesRefunds()
    {
        return $this->withMeta(['issuesRefunds' => true]);
    }

    /**
     * 獲取資源工具的組件名稱
     *
     * @return string
     */
    public function component()
    {
        return 'stripe-inspector';
    }
}

建筑工具

Nova 生成的每個工具都包括其自己的服務提供商和 “工具” 類。以 stripe-in??spector 工具為例,該工具類位于 src / StripeInspector.php。

該工具的服務提供程序也位于該工具的 src 目錄中,并且已在該工具的 composer.json 文件中注冊,以便可以由 Laravel 框架自動加載。

授權

如果您只想將給定工具公開給某些用戶,則可以將 canSee 方法鏈接到工具的注冊上。canSee 方法接受一個閉包,該閉包應返回 true 或 false。閉包將收到傳入的 HTTP 請求:

使用Acme \ StripeInspector \ StripeInspector;

/ **
 *獲取資源顯示的字段。
 *
 * @param \ Illuminate \ Http \ Request $ request
 * @返回數(shù)組
 * /
公共功能字段(請求$ request)
{
    返回[
        ID :: make('ID','id')-> sortable(),

        StripeInspector :: make()-> canSee(function($ request){
            返回false;
        }),
    ];
}

路由

通常,您將需要定義工具調用的 Laravel 路線。 Nova 生成您的工具時,它會創(chuàng)建一個 routes / api.php 路由文件。如果需要,您可以使用此文件來定義工具所需的任何路徑。

工具的 ToolServiceProvider 在路由組內自動定義此文件中的所有路由。路由組指定該組內的所有路由應接收 / nova-vendor / tool-name 前綴,其中 tool-name 是工具的 “kebab-case” 名稱。因此,例如, / nova-vendor / stripe-in??spector。您可以隨意修改此路由組定義,但要確保您的 Nova 工具將與其他 Nova 軟件包共存。

路由授權

在為您的工具構建路由時,您應該始終 使用 Laravel 門或策略向這些路由添加授權。

資產(chǎn)

Nova 生成您的工具時,將為您生成 resources / js 和 resources / sass 目錄。這些目錄包含工具的 JavaScript 和 Sass 樣式表。這些目錄中感興趣的主要文件是:resources / js / components / Tool.vue 和 resources / sass / tool.scss

Tool.vue 文件是包含工具前端的單文件 Vue 組件。您可以根據(jù)需要從該文件中自由構建工具。您的工具可以使用 Axios 發(fā)出 HTTP 請求,Axios 可以在全球使用。另外,moment.js 和 underscore.js 庫是全局可用的。

資源工具屬性

資源工具的 Tool.vue 組件將接收多個 VuepropsresourceName,resourceId 和 field。resourceId 屬性包含工具當前附加到的資源的主鍵。向控制器發(fā)出請求時,可以使用 resourceIdfield 屬性提供對可能可用的任何工具 選項 的訪問:

const issueRefunds = this.field.issuesRefunds;

注冊資產(chǎn)

您的 Nova 工具的服務提供商會注冊您工具的已編譯資產(chǎn),以便它們可用于 Nova 前端:

/ **
 *引導所有應用程序服務。
 *
 * @返回無效
 * /
公共功能boot()
{
    $ this-> app-> booted(function(){
        $ this-> routes();
    });

    Nova :: serving(function(ServingNova $ event){
        Nova :: script('stripe-inspector',__DIR __。'/ .. / dist / js / tool.js');
        Nova :: style('stripe-inspector',__DIR __。'/ .. / dist / css / tool.css');
    });
}

JavaScript 引導程序和路由

您的組件被引導并注冊在 resources / js / tool.js 文件中。您可以根據(jù)需要隨意修改此文件或在此處注冊其他組件。

編譯資源

Nova 創(chuàng)建資源工具的同時生成一個 webpack.mix.js 文件。你可以使用 NPM dev 和 prod 命令進行構建:

// 在本地開發(fā)環(huán)境下編譯資源...
npm run dev

// 編譯并壓縮資源...
npm run prod

此外,你還可以運行 NPM watch 命令在文件改動時自動編譯:

npm run watch


以上內容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號