如何为每个小部件插入不同的图标

Question

如何为每个小部件插入不同的图标？

[
            'type'          => 'progress_white',
            'class'         => 'card mb-2',
            'progressClass' => 'progress-bar bg-primary',
            'value'         => $userCount,
            'description'   => 'Utenti registrati.',
            'progress'      => (int)$userCount/10*100, // integer
            'hint'          => 'Numero di utenti registrati al portale.',
        ],

html部分就是下面这部分

<div class="{{ $widget['wrapperClass'] ?? 'col-sm-6 col-md-4' }}">
<div class="{{ $widget['class'] ?? 'card' }}">
<div class="card-body">
  @if (isset($widget['value']))
  <div class="text-value">{!! $widget['value'] !!}</div>
  @endif

......

Answer 1

遗憾的是，您无法使用默认小部件创建自己的小部件。

@if(isset($widget['icon']))
   <div class="text-right" style="position:absolute;top:5px;right:15px;font-size: 40px;color: {{ $widget['icon_color'] ?? 'rgba(0,0,0,0.2)' }}">
      <span class="{{ $widget['icon'] }}"></span>
   </div>
@endif

将其放入卡体内class。样式可能需要稍微更改一下。

其他选项是 Backpack 使用基于 CoreUI 的新主题。可以查看 CoreUI 的文档，或在 https://backstrap.net

查看主题的源代码

Answer 2

你想要什么样的图标？如果您使用像 material 图标或 awesome 图标这样的图标集，您可以传递您的图标名称并在 "i" 标签中使用它，如下所示：

"icon" => "fa fa user"

在你的 blade:

<i class"{{$widget['icon']}}"></i>

如何为每个小部件插入不同的图标

how do I insert a different icon for each widgets

laravel

laravel-backpack