avantcorp/nova-notifications

Laravel Nova 工具,用于显示用户通知。

1.0.9 2021-08-17 17:16 UTC

This package is auto-updated.

Last update: 2024-09-18 00:03:41 UTC


README

Build Status Maintainability Test Coverage

快速链接

先决条件

  • Laravel Nova 应用
  • Laravel 广播已配置
  • Laravel Echo
  • Laravel 通知

安装

通过 composer 安装 composer require mirovit/nova-notifications

Laravel 会自动注册服务提供者。您需要将工具与 Laravel Nova 进行注册。

    public function tools()
    {
        return [
            // ...
            \Mirovit\NovaNotifications\NovaNotifications::make(),
        ];
    }

请确保您已在 routes/channels.php 或存储此逻辑的位置中验证了用户通道。

Broadcast::channel('App.Models.User.{id}', function ($user, $id) {
    return (int)$user->id === (int)$id;
});

Laravel Echo 默认不包含在 Nova 中,因此您需要为前端设置它。为此,请按照以下步骤操作

  • 安装 Echo
  • npm install
  • 在 resources/js 中创建一个 admin.js 文件
import Echo from 'laravel-echo';

// Sample instance with Pusher
window.Pusher = require('pusher-js');

window.Echo = new Echo({
    broadcaster: 'pusher',
    key: process.env.MIX_PUSHER_APP_KEY,
    cluster: process.env.MIX_PUSHER_APP_CLUSTER,
    encrypted: true
});
  • 添加到您的 webpack.mix.js
mix.js('resources/js/admin.js', 'public/js');
  • 添加到您的 Nova 布局.blade.php
// ...
<script src="{{ mix('app.js', 'vendor/nova') }}"></script>
<script src="{{ mix('js/admin.js') }}"></script>

此外,该包假设模型命名空间为 App\Models,如果您的项目不符合此要求,则前端与后端之间的认证将不起作用,并且通知将不会显示,除非刷新页面。有关如何修复此问题的说明,请参阅 配置 部分。

最后一步是手动发布 Nova 的布局文件,如果您尚未这样做的话。 cp vendor/laravel/nova/resources/views/layout.blade.php resources/views/vendor/nova/layout.blade.php

然后请将显示铃铛图标的部分视图放置在导航栏中,大致在 nova 的用户部分周围 - @include('nova-notifications::dropdown')

使用

从 Laravel 触发通知。示例通知

<?php

namespace App\Notifications;

use App\User;
use Illuminate\Bus\Queueable;
use Illuminate\Contracts\Queue\ShouldQueue;
use Illuminate\Notifications\Messages\BroadcastMessage;
use Illuminate\Notifications\Messages\MailMessage;
use Illuminate\Notifications\Notification;

class Created extends Notification
{
    use Queueable;

    private $user;


    /**
     * Create a new notification instance.
     *
     * @param User $user
     */
    public function __construct(User $user)
    {
        $this->user = $user;
    }

    /**
     * Get the notification's delivery channels.
     *
     * @param  mixed  $notifiable
     * @return array
     */
    public function via($notifiable)
    {
        return ['database', 'broadcast'];
    }

    /**
     * Get the array representation of the notification.
     *
     * @param  mixed  $notifiable
     * @return array
     */
    public function toArray($notifiable)
    {
        return \Mirovit\NovaNotifications\Notification::make()
            ->info('A new user was created.')
            ->subtitle('There is a new user in the system - ' . $this->user->name . '!')
            ->routeDetail('users', $this->user->id)
            ->toArray();

    }
}

可用方法

Notification::make($title = null, $subtitle = null)
    // Sets title
    ->title(string $value)
    // Sets subtitle
    ->subtitle(string $subtitle)
    // Link and route work similarly. Route has precedence over link, if you define both on an instance. You should generally use a one of them.
    ->link(string $url, bool $external = false)
    // Route to internal resource
    ->route(string $name, string $resourceName, $resourceId = null)
    // Helper methods for resource routing
    ->routeIndex(string $resourceName)
    ->routeCreate(string $resourceName)
    ->routeEdit(string $resourceName, $resourceId)
    ->routeDetail(string $resourceName, $resourceId)
    // Notification level - info, success or errro
    ->level(string $value)
    // Helpers to set title and level with one call
    ->info(string $value)
    ->success(string $value)
    ->error(string $value)
    // Set custom date for notification, defaults to current datetime
    ->createdAt(Carbon $value)
    // Add icon classes to be applied, ex: fas fa-info
    ->icon(string $value)
    ->showMarkAsRead(bool $value = true)
    ->showCancel(bool $value = true)
    ->toArray();

图标

为了显示图标,您需要确保它们已在您的项目中导入。您可以使用任何图标字体,例如 Font Awesome

FA 的示例用法:在 layout.blade.php 中添加 FA 的 CSS。

然后只需在通知上添加 ->icon() 方法,并指定用于渲染图标的类 fas fa-info

配置

该包发布了一个可选的配置文件。如果您使用不同的模型命名空间约定或希望覆盖包提供的默认控制器,则需要将配置发布到您的项目中。

请注意,该包假设的默认模型命名空间是 App\Models,因此如果您使用另一个命名空间,则需要调整 API 与前端之间的认证。

php artisan vendor:publish 并选择对应于 Mirovit\NovaNotifications\NovaNotificationsServiceProvider 的数字或全部发布。

翻译

该包已翻译成英文,如果您需要额外的翻译,请参阅 Laravel Nova 文档中的说明。

有人多次提到的问题是,对于人类来说,差异仅显示为英文,无论应用的区域设置如何。您需要将 moment.js 区域设置设置为适当的区域设置,这不是本包的责任。

定位您的布局文件 - resources/views/vendor/nova/layout.blade.php

找到

<!-- Build Nova Instance -->
<script>
    window.Nova = new CreateNova(config)
</script>

并用以下内容替换

<!-- Build Nova Instance -->
<script>
    window.Nova = new CreateNova(config)
    moment.locale('es-es') // this can come from a config setting, just an example of how to set it
</script>

演示

没有通知

No notifications

没有打开的通知

No notifications open

通知计数

Notifications count

通知成功

Notification success

通知信息

Notification info

通知错误

Notification error

打开通知

Notifications open

待办事项

  • 添加翻译
  • 添加自定义 Vue 布局文档
  • 允许在通知中添加外部链接
  • 添加对图标的支持
  • 操作定制