README

symfony bundle 的仪表板

安装

请确保已全局安装 Composer，如 Composer 文档中的安装章节所述。

使用 Symfony Flex 的应用程序

打开命令行控制台，进入项目目录并执行

composer require ics/dashboard-bundle

未使用 Symfony Flex 的应用程序

步骤 1：下载 Bundle

打开命令行控制台，进入项目目录并执行以下命令以下载此 Bundle 的最新稳定版本

composer require ics/dashboard-bundle

步骤 2：启用 Bundle

然后，通过将其添加到项目 config/bundles.php 文件中注册的 Bundle 列表中启用该 Bundle

// config/bundles.php

return [
    // ...
    ICS\DashboardBundle\DashboardBundle::class => ['all' => true],
];

步骤 3：添加 Bundle 路由

在应用的 config/routes.yaml 中添加路由

# config/routes.yaml

# ...
dashboard_bundle:
    resource: '@DashboardBundle/config/routes.yaml'
    prefix: /dashboard
# ...

步骤 4：安装数据库

安装数据库

# Installer la base de données

php bin/console doctrine:schema:create

更新数据库

# Mise a jour la base de données

php bin/console doctrine:schema:update -f

配置

步骤 1：仪表板配置

    # config/packages/dashboard.yaml

    dashboard:
        dashboards:
            homepage:
                nbColumns: 12
                widgets:
                    datetime:
                        entity: ICS\DashboardBundle\Entity\DTWidget
                        libelle: Date and Time
                        icon: fa fa-clock
                        group: Generic
                        roles: ['ROLE_USER']
                    help:
                        entity: ICS\DashboardBundle\Entity\HelpWidget
                        libelle: Help
                        icon: fa fa-question-circle
                        group: Generic
                        roles: ['ROLE_USER']
                    postit:
                        entity: ICS\DashboardBundle\Entity\PostitWidget
                        libelle: Post-It
                        icon: fa fa-sticky-note
                        group: Generic
                        roles: ['ROLE_USER']

步骤 2：Twig 集成

    {# templates/index.html.twig #}

    {% extends 'base.html.twig' %}

    {% block title %}Homepage{% endblock %}

    {% block stylesheets %}
        {{ renderDashBoardcss('homepage') }}
    {% endblock %}

    {% block body %}
        {{ renderDashBoard('homepage') }}
    {% endblock %}

    {% block javascripts %}
        {{ renderDashBoardjs('homepage') }}
    {% endblock %}

小部件开发

步骤 1：创建实体

首先，编写一个继承自 Widget 的实体。

它必须至少有 getUI() 方法。它也可以有 getJs() 和 getCss() 方法，以向您的 Widget 添加 JavaScript 或 CSS。

<?php

namespace ICS\DashboardBundle\Entity;

use Doctrine\ORM\Mapping as ORM;
use ICS\DashboardBundle\Form\Type\DTWidgetType;
use Twig\Environment;

/**
 * @ORM\Table(name="dtwidgets", schema="dashboard")
 * @ORM\Entity
 */
class DTWidget extends Widget
{
    /**
     * @ORM\Column(type="string", nullable=false)
     */
    private $timezone = 'Europe/Paris';
    protected $configForm = DTWidgetType::class;
    protected $resize = false;

    public function __construct(Environment $twig)
    {
        parent::__construct($twig);
        $this->setWidth(2);
        $this->setHeight(2);
    }

    public function getJs()
    {
        if (null == $this->twig) {
            return '';
        }

        return $this->twig->render('@Dashboard/Generic/DTWidget.js.twig', ['widget' => $this]);
    }

    public function getUI()
    {
        if (null == $this->twig) {
            return '';
        }

        return $this->twig->render('@Dashboard/Generic/DTWidget.html.twig', ['widget' => $this]);
    }

    /**
     * Get the value of timezone.
     */
    public function getTimezone()
    {
        return $this->timezone;
    }

    /**
     * Set the value of timezone.
     *
     * @return self
     */
    public function setTimezone($timezone)
    {
        $this->timezone = $timezone;

        return $this;
    }

步骤 2：集成到配置中

在集成之前，不要忘记更新数据库。

    # ....
                widgets:
                    datetime:
                        entity: ICS\DashboardBundle\Entity\DTWidget
                        libelle: Date and Time
                        icon: fa fa-clock
                        group: Generic
                        roles: ['ROLE_USER']
    # ...