devmtm/nova-custom-views

此软件包已被废弃,不再维护。作者建议使用https://github.com/DigitalCloud/nova-custom-views软件包。

一个 Laravel Nova 自定义视图。

v1.7 2018-11-12 11:42 UTC

This package is auto-updated.

Last update: 2022-07-07 13:27:38 UTC


README

Latest Stable Version Total Downloads Monthly Downloads Daily Downloads

Nova Custom Views

此软件包允许您为特定的 Nova 资源创建可定制的视图。

安装

composer require digitalcloud/nova-custom-views

然后您需要在 config/app.php 中添加服务提供者,在 NovaServiceProvider 之后。

 /*
    |--------------------------------------------------------------------------
    | Autoloaded Service Providers
    |--------------------------------------------------------------------------
    |
    | The service providers listed here will be automatically loaded on the
    | request to your application. Feel free to add your own services to
    | this array to grant expanded functionality to your applications.
    |
    */

    'providers' => [

        ...
        App\Providers\NovaServiceProvider::class,
        ...
        devmtm\NovaCustomViews\NovaCustomViewsServiceProvider::class,
        ...

创建一个新的视图,这与任何其他 Nova 工具、资源工具或字段的创建过程相同。您可以在终端中使用此命令

php artisan nova:views resource-name view-name

这将创建您的视图组件在 /nova-components/views/resource-name。如果您在先前的过程中已安装了依赖项,您可以直接继续使用

cd ./nova-components/views/resource-name && npm run watch

view-name 的允许值是 [index | lens | detail | create | update | attach | update-attached]

如果您不提供 view-name,它将创建所有先前的 nova 视图。

您可以在 /nova-components/views/resource-name/resources/js/views 中修改任何视图组件

示例用法:为用户资源创建自定义详细信息视图

要创建一个新视图,比如用户详细信息视图,您可以运行以下命令

php artisan nova:views user detail

这将创建一个新的路径:'/nova-components/views/user',其中包含所有生成的用户视图。新的视图扩展了默认的用户 nova 详细信息视图(使用 vue 混合)。您可以通过访问路径:'/nova-components/views/user/resources/js/views/Detail.vue' 来修改默认视图,并添加如下自定义代码

<template>
   <div>YOUR_CODE_HERE</div>
</template>

示例用法:创建自定义仪表板

要创建自定义仪表板视图,您可以运行以下命令

php artisan nova:dashboard

这将创建一个新的路径:'/nova-components/views/dashboard',其中包含自定义仪表板组件。新的视图扩展了默认 nova 仪表板视图(使用 vue 混合)。您可以通过访问路径:'/nova-components/views/user/resources/js/views/Dashboard.vue' 来修改仪表板视图,并添加如下自定义代码

<template>
   <div>YOUR_CODE_HERE</div>
</template>