資源工具與 工具 很類似;然而,資源工具并不會顯示在 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 門或策略向這些路由添加授權。
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
組件將接收多個 Vueprops
:resourceName
,resourceId
和 field
。resourceId
屬性包含工具當前附加到的資源的主鍵。向控制器發(fā)出請求時,可以使用 resourceId
。
field
屬性提供對可能可用的任何工具 選項 的訪問:
const issueRefunds = this.field.issuesRefunds;
您的 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
更多建議: