youpi/youpi-notifications

一个用于实时通知的Laravel Nova工具。

dev-main 2022-05-03 03:26 UTC

This package is auto-updated.

Last update: 2024-09-30 01:50:15 UTC


README

#Nova youpi-notifications laravel nova中的youpi通知

Build Status Maintainability Test Coverage

快速链接

先决条件

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

安装

通过composer安装 composer require youpi/youpi-notifications

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

    public function tools()
    {
        return [
            // ...
            \Youpi\YoupiNotifications\YoupiNotifications::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

然后将显示铃铛图标的局部视图放置在导航栏中

views/vendor/nova/layout.blade.php中查找

<dropdown class="ml-auto h-9 flex items-center dropdown-right">
    @include('nova::partials.user')
</dropdown>

替换为

@include('YoupiNotifications::dropdown')
<dropdown class="ml-8 h-9 flex items-center dropdown-right">
    @include('nova::partials.user')
</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 \Youpi\YoupiNotifications\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 error
    
    ->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)
    // URL to the sound that the notification should make
    ->sound('https://url-to-a-sound-file')
    // If `play_sound` is set to true in your config, every notification will play the default sound. You can disable the sound per notification here.
    ->playSound(bool $value = true)
    // Whether to show the toasted popup notification
    ->displayToasted(bool $value = true)
    // Alias to invoke the displayToasted() with false
    ->hideToasted()
    ->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布局的文档
  • 允许通知中包含外部链接
  • 添加对图标的支持
  • 操作自定义