README

简单的 Nova 卡片用于自定义表格

简单的卡片表格，包含您选择的数据。

它可以用于最新的订单列表或最新的帖子等。

注意：本文档仅适用于 v. > 2.* 版本

在版本 2 中添加：刷新（重新加载），为单元格添加 id 和类的可能性

在版本 3 中： 已移除刷新，解决了多个仪表板的问题

版本 4：添加对 Nova v. 4 的兼容性

安装

您可以通过 composer 将此包安装到使用 Nova 的 Laravel 应用中

composer require m1davp/nova-custom-table-card

您必须使用 NovaServiceProvider 注册卡片

// in app/Providers/NovaServiceProvder.php

// ...
public function cards()
{
    return [
        // ...

        // all the parameters are required excelpt title
        new \M1daVP\CustomTableCard\CustomTableCard(
            array $header, array $data, string $title, array $viewAll
        ),
    ];
}

使用示例

// ...
public function cards()
{
    return [
        // ...

        // all the parameters are required
        new \M1daVP\CustomTableCard\CustomTableCard(
            [
                new \M1daVP\CustomTableCard\Table\Cell('Order Number'),
                // Set sortable to true in a header Cell to allow its column's sorting
                (new \M1daVP\CustomTableCard\Table\Cell('Price'))->sortable(true)->class('text-right'),
            ], // header
            [
                (new \M1daVP\CustomTableCard\Table\Row(
                    new \M1daVP\CustomTableCard\Table\Cell('2018091001'),
                    (new \M1daVP\CustomTableCard\Table\Cell('20.50'))->class('text-right')->id('price-2')
                ))->viewLink('/resources/orders/1'),
                (new \M1daVP\CustomTableCard\Table\Row(
                    new \M1daVP\CustomTableCard\Table\Cell('2018091002'),
                    (new \M1daVP\CustomTableCard\Table\Cell('201.25'))->class('text-right')->id('price-2')
                )),
            ], // data
            'Orders,' // title
            ['label' => 'View All', 'link' => '/resources/orders'], // View All
        ),
    ];
}

或

// ...
public function cards()
{
    return [
        // ...

        // all the parameters are required except title
        (new \M1daVP\CustomTableCard\CustomTableCard)
            ->header([
                new \M1daVP\CustomTableCard\Table\Cell('Order Number'),
                // Set sortable to true in a header Cell to allow its column's sorting
                (new \M1daVP\CustomTableCard\Table\Cell('Price'))->sortable(true)->class('text-right'),
            ])
            ->data([
                (new \M1daVP\CustomTableCard\Table\Row(
                    new \M1daVP\CustomTableCard\Table\Cell('2018091001'),
                    (new \M1daVP\CustomTableCard\Table\Cell('20.50'))->class('text-right')->id('price-2')
                ))->viewLink('/resources/orders/1'),
                (new \M1daVP\CustomTableCard\Table\Row(
                    new \M1daVP\CustomTableCard\Table\Cell('2018091002'),
                    (new \M1daVP\CustomTableCard\Table\Cell('201.25'))->class('text-right')->id('price-2')
                )),
            ])
            ->title('Orders')
            ->viewAll(['label' => 'View All', 'link' => '/resources/orders']),
    ];
}

或

您可以在 Nova/Cards 目录中的示例下创建自己的类，该类将扩展 \M1daVP\CustomTableCard\CustomTableCard

在此独立的类中，您可以使用整洁的方式从模型中获取数据。

<?php

namespace App\Nova\Cards;

use App\Models\Order;

class LatestOrders extends \M1daVP\CustomTableCard\CustomTableCard
{
    public function __construct()
    {
        $header = collect(['Date', 'Order Number', 'Status', 'Price', 'Name']);

        $this->title('Latest Orders');
        $this->viewAll(['label' => 'View All', 'link' => '/resources/orders']);

        // $orders = Order::all();
        // Data from you model
        $orders = collect([
            ['date' => '2018-12-01', 'order_number' => '2018120101', 'status' => 'Ordered', 'price' => '20.55', 'name' => 'John Doe'],
            ['date' => '2018-12-01', 'order_number' => '2018120101', 'status' => 'Ordered', 'price' => '20.55', 'name' => 'John Doe'],
            ['date' => '2018-12-01', 'order_number' => '2018120101', 'status' => 'Ordered', 'price' => '20.55', 'name' => 'John Doe'],
            ['date' => '2018-12-01', 'order_number' => '2018120101', 'status' => 'Ordered', 'price' => '20.55', 'name' => 'John Doe'],
            ['date' => '2018-12-01', 'order_number' => '2018120101', 'status' => 'Ordered', 'price' => '20.55', 'name' => 'John Doe'],
            ['date' => '2018-12-01', 'order_number' => '2018120101', 'status' => 'Ordered', 'price' => '20.55', 'name' => 'John Doe'],
        ]);

        $this->header($header->map(function($value) {
            // Make the Status column sortable
            return ($value === 'Status') ?
                (new \M1daVP\CustomTableCard\Table\Cell($value))->sortable(true) :
                new \M1daVP\CustomTableCard\Table\Cell($value);
        })->toArray());

        $this->data($orders->map(function($order) {
            return new \M1daVP\CustomTableCard\Table\Row(
                new \M1daVP\CustomTableCard\Table\Cell($order['date']),
                new \M1daVP\CustomTableCard\Table\Cell($order['order_number']),
                // Instead of alphabetically ordering the status, set a sortableData value for better representation
                (new \M1daVP\CustomTableCard\Table\Cell($order['status'])->sortableData($this->getStatusSortableData($order['status']))),
                new \M1daVP\CustomTableCard\Table\Cell($order['price']),
                new \M1daVP\CustomTableCard\Table\Cell($order['name'])
            );
        })->toArray());
    }

    private function getStatusSortableData (string $status) : int
    {
        switch ($status) {
            case 'Ordered':
                return 1;            
            default:
                return 0.
        } 
    }
}

然后，在 NovaServiceProvider.php 中注册您的自定义类

protected function cards()
{
    return [
        ......
        new \App\Nova\Cards\LatestOrders,
     ];
 }

注意：如果您没有指定视图或视图所有，则显示图标将不可见。

表格样式定制

为了在您的表格中显示更多数据，您可以使用“紧凑”表格样式选项，该选项旨在增加表格行的视觉密度。

protected function cards()
{
    return [
        ...
        \M1daVP\CustomTableCard\CustomTableCard::make(
            ...
        )->style('tight'),
     ];
 }

或覆盖您自定义类上的 $style 属性

public $style = 'tight';