Produkty Objednávky Zákazníci Dokumentace
Nepřihlášen Uživatel 1 Uživatel 2 Uživatel 3
Část III · Sloupce

9. Barva

addColor($alias, $title, $colors = [], $multi = true) – hodnotou sloupce je sama barva (CSS zápis) a v buňce se z ní stane barevné kolečko.

Ukázka

Táž barva třikrát: s pojmenovanou nabídkou, se seznamem barev bez názvů a bez filtru. Data jsou tentokrát v poli v komponentě – barvu v sandboxu žádná tabulka nemá.

Zdrojový kód

php app/Modules/AdminModule/Components/Docs/Columns/ColumnColorGridControl/ColumnColorGridControl.php
<?php

declare(strict_types=1);

namespace App\Components\Docs\Columns\ColumnColorGridControl;

use Xart\Grid\Button\ButtonManager;
use Xart\Grid\Column\ColumnManager;
use Xart\Grid\Control\GridControl;
use Xart\Grid\DataOutput\Row;
use Xart\Grid\DataSource\ArrayDataSource;
use Xart\Grid\DataSource\DataSource;

/**
 * Dokumentace, kapitola 9 – Barva.
 *
 * Jediný grid v části III, který nestojí nad e-shopem: barvu v něm nemá žádná tabulka sandboxu,
 * takže si štítky drží komponenta v poli (ArrayDataSource, kapitola 4).
 */
class ColumnColorGridControl extends GridControl
{
    /** Nabídka pro filtr: [CSS barva => název]. Tytéž barvy, jaké mají štítky v datech. */
    private const Palette = [
        '#fa5252' => 'Červená',
        '#fd7e14' => 'Oranžová',
        '#fab005' => 'Žlutá',
        '#40c057' => 'Zelená',
        '#228be6' => 'Modrá',
        '#7950f2' => 'Fialová',
    ];


    /**
     * Štítky, kterými se v (jiné) aplikaci značí objednávky.
     *
     * @return list<array<string, mixed>>
     */
    private function labels(): array
    {
        return [
            ['id' => 1, 'name' => 'Reklamace', 'color' => '#fa5252', 'usage' => 34],
            ['id' => 2, 'name' => 'Čeká na platbu', 'color' => '#fab005', 'usage' => 121],
            ['id' => 3, 'name' => 'Expres', 'color' => '#fd7e14', 'usage' => 18],
            ['id' => 4, 'name' => 'Vyřízeno', 'color' => '#40c057', 'usage' => 402],
            ['id' => 5, 'name' => 'Velkoobchod', 'color' => '#228be6', 'usage' => 57],
            ['id' => 6, 'name' => 'Dárkové balení', 'color' => '#7950f2', 'usage' => 12],
            ['id' => 7, 'name' => 'Storno', 'color' => '#fa5252', 'usage' => 25],
            ['id' => 8, 'name' => 'Ověřit adresu', 'color' => '#228be6', 'usage' => 9],
        ];
    }


    public function createDataSource(): DataSource
    {
        // Táž barva pod třemi aliasy – jeden sloupec by nemohl mít tři různé filtry.
        $rows = [];
        foreach ($this->labels() as $label) {
            $label['color_list'] = $label['color'];
            $label['color_none'] = $label['color'];
            $rows[] = $label;
        }

        return new ArrayDataSource($rows, 'id');
    }


    public function columns(ColumnManager $cm): void
    {
        $cm->add('name', 'Štítek');

        // Nabídka s názvy: klíč je barva, hodnota její název ve filtru.
        $cm->addColor('color', 'Barva', self::Palette);

        // Seznam samotných barev – nabídka je jen z barevných koleček, není co pojmenovat.
        $cm->addColor('color_list', 'Barva (bez názvů)', array_keys(self::Palette));

        // Bez nabídky sloupec filtr nedostane.
        $cm->addColor('color_none', 'Barva (bez filtru)');

        $cm->addNumber('usage', 'Použití', 0);
    }


    public function buttons(ButtonManager $bm): void
    {
    }


    public function rows(Row $row): void
    {
    }


    public function render(): void
    {
        $this->template->render(__DIR__ . '/ColumnColorGridControl.latte');
    }
}

Nabídka filtru

['#fa5252' => 'Červená', …] Nabídka s názvy – klíčem je barva, hodnotou její jméno.
['#fa5252', '#40c057', …] Jen barvy; nabídka je z koleček, není co pojmenovat.
[] (výchozí) Sloupec filtr nedostane vůbec.

Filtr je ColorFilter, potomek téhož AbstractSelectFilter jako addSelect() – porovnává se tedy na přesnou shodu zápisu. #fa5252 a red jsou pro databázi dvě různé hodnoty, i když je prohlížeč nakreslí stejně; nabídka musí sedět na to, co je v datech.

Řazení a export

  • Řazení se vypíná samo (disableOrdering()) – abecední pořadí hexů nikomu nic neříká.
  • Do exportu jde zápis barvy jako text a tatáž barva se použije jako pozadí buňky tam, kde to formát umí (XLSX, PDF).
  • Prázdná hodnota nechá buňku prázdnou, žádné kolečko se nekreslí.

Kdy raději enum

Pokud je barev pevná sada, patří spíš do enumu s HasColor (kapitola 8.2): v databázi pak zůstane srozumitelný název stavu, ne hex, a barvu jde kdykoli změnit v kódu, aniž by se sahalo na data. addColor() je pro případ, kdy si barvu vybírá uživatel a v databázi opravdu leží její zápis.