资源工具

总览

资源工具与 工具 很类似;然而,资源工具并不会显示在Nova的侧边栏,而是显示在特定的资源详情页。 与Nova 工具一样, 资源工具具有高度的可自定义性,并且主要由一个完全由你控制的单文件Vue组件构成。

##定义工具

可以使用Artisan命令使用nova:resource-tool生成资源工具。默认情况下,所有新工具都将放置在应用程序的nova-components目录中。使用nova:resource-tool命令生成工具时,传递给该命令的工具名称应遵循Composer供应商/程序包格式。因此,如果我们要构建Stripe检查器工具,则可以运行以下命令:

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

生成工具时,Nova会提示您安装工具的NPM依赖项,编译其资产并更新应用程序的composer.json文件。所有自定义工具都已在您的应用程序中注册为Composer“路径”存储库。

Nova资源工具包括构建工具所需的所有支架。每个工具甚至都包含其自己的composer.json文件,并准备与GitHub上的世界或您选择的源代码控制提供商共享。

##注册工具

Nova资源工具可能已在资源的fields方法中注册。此方法返回资源可用的字段数组。要注册您的资源工具,请将您的工具添加到此方法返回的字段数组中:

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方法,以将信息添加到工具的元数据中,该元数据将在您的Tool.vue组件中可用withMeta方法接受键/值选项数组:

<?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方法接受一个闭包,该闭包应返回truefalse。闭包将收到传入的HTTP请求:

使用Acme \ StripeInspector \ StripeInspector;

/ **
 *获取资源显示的字段。
 *
 * @param \ Illuminate \ Http \ Request $ request
 * @返回数组
 * /
公共功能字段(请求$ request)
{
    返回[
        ID :: make('ID''id')-> sortable(),

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

###路由

通常,您将需要定义工具调用的Laravel路线。 Nova生成您的工具时,它会创建一个routes / api.php路由文件。如果需要,您可以使用此文件来定义工具所需的任何路径。

工具的ToolServiceProvider在路由组内自动定义此文件中的所有路由。路由组指定该组内的所有路由应接收/ nova-vendor / tool-name前缀,其中tool-name是工具的“ kebab-case”名称。因此,例如,/ nova-vendor / stripe-in​​spector。您可以随意修改此路由组定义,但要确保您的Nova工具将与其他Nova软件包共存。

路由授权

在为您的工具构建路由时,您应该始终**使用Laravel门或策略向这些路由添加授权。

###资产

Nova生成您的工具时,将为您生成resources / jsresources / sass目录。这些目录包含工具的JavaScript和Sass样式表。这些目录中感兴趣的主要文件是:resources / js / components / Tool.vueresources / sass / tool.scss

Tool.vue文件是包含工具前端的单文件Vue组件。您可以根据需要从该文件中自由构建工具。您的工具可以使用Axios发出HTTP请求,Axios可以在全球使用。另外,moment.jsunderscore.js库是全局可用的。

####资源工具属性

资源工具的Tool.vue组件将接收多个VuepropsresourceNameresourceIdfieldresourceId属性包含工具当前附加到的资源的主键。向控制器发出请求时,可以使用resourceIdfield属性提供对可能可用的任何工具选项的访问:

const issueRefunds = this.field.issuesRefunds;

####注册资产

您的Nova工具的服务提供商会注册您工具的已编译资产,以便它们可用于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文件中。您可以根据需要随意修改此文件或在此处注册其他组件。

编译资源

Nova 创建资源工具的同时生成一个 webpack.mix.js 文件。你可以使用NPM devprod 命令进行构建:

// 在本地开发环境下编译资源...
npm run dev

// 编译并压缩资源...
npm run prod

此外,你还可以运行 NPM watch 命令在文件改动时自动编译:

npm run watch

本文章首发在 LearnKu.com 网站上。

本译文仅用于学习和交流目的,转载请务必注明文章译者、出处、和本文链接
我们的翻译工作遵照 CC 协议,如果我们的工作有侵犯到您的权益,请及时联系我们。
上一篇 下一篇
《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
《L05 电商实战》
从零开发一个电商项目,功能包括电商后台、商品 & SKU 管理、购物车、订单管理、支付宝支付、微信支付、订单退款流程、优惠券等
贡献者:5
讨论数量: 0
发起讨论 只看当前版本


暂无话题~