novadaemon/filament-pretty-json

只读字段,用于在filamentphp表单中显示漂亮的JSON

资助包维护!
novadaemon

安装次数: 65,460

依赖者: 0

建议者: 0

安全: 0

星标: 21

关注者: 1

分支: 7

开放问题: 1

语言:JavaScript

v2.2.5 2024-08-16 18:25 UTC

README

只读字段,用于在您的 filamentphp 表单中显示漂亮的JSON。

安装

您可以通过composer安装此包

composer require novadaemon/filament-pretty-json

此包支持Filament 2.x和3.x。

用法

只需像使用任何其他Filament字段一样使用组件即可。它在资源查看页面上非常完美,能够很好地融合。

use Novadaemon\FilamentPrettyJson\PrettyJson;

class FileResource extends Resource
{
    public static function form(Form $form): Form
    {
        return $form
            ->schema([
                PrettyJson::make('json')
            ]);
    }
}

字段的值可以被转换为字符串、JSON、数组、对象、AsArrayObject或实现Jsonable接口的对象

/**
 * @var string[]
 */
protected $casts = [
    'card_info' => 'string',
    // OR 'card_info' => 'json',
    // OR 'card_info' => 'array',
    // OR 'card_info' => 'object',
    // OR 'card_info' => AsArrayObject::class,
    // OR 'card_info' => CustomCast::class,
];

自定义

可选地,您可以使用以下命令发布视图

php artisan vendor:publish --tag="filament-pretty-json-views"

此外,您还可以覆盖您的样式表中的CSS规则。

pre.prettyjson {
    color: black;
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid rgb(229, 231, 235);
    border-radius: 0.5rem;
    padding: 10px 20px;
    overflow: auto;
    font-size: 12px;
}

:is(.dark) pre.prettyjson {
    opacity: .7;
    --tw-bg-opacity: 1;
    --tw-border-opacity: 1;
    border: 1px solid rgb(75 85 99/var(--tw-border-opacity));
    color: rgb(209 213 219/var(--tw-text-opacity));
}

:is(.dark) pre.prettyjson span.json-key {
    color: red !important;
}

:is(.dark) pre.prettyjson span.json-string {
    color: aquamarine !important;
}

:is(.dark) pre.prettyjson span.json-value {
    color: deepskyblue !important;
}

贡献

贡献非常轻松,并且非常受赞赏!只需发送一个PR或创建一个issue即可!

致谢

许可

MIT许可证(MIT)。请参阅许可文件以获取更多信息。

屏幕截图

Screenshot