new mapper new colors

2026-02-15 12:33:43 +01:00
1 parent d077b6a429
commit f1b0f43ded
@@ -46,10 +46,14 @@ class MapperLeft extends Component implements HasActions, HasSchemas, HasTable

    public $search_values = [];

+    public $search_color = 'info';
+
    protected $listeners = [
        'refreshMapperLeft' => '$refresh',
    ];

+    public function isRemovingAllFilters() {}
+
    public function removeTableFilter(string $filterName, ?string $field = null, bool $shouldTriggerUpdatedFiltersHook = true): void
    {
        if (($key = array_search($field, $this->search_values)) !== false) {
@@ -68,7 +72,8 @@ class MapperLeft extends Component implements HasActions, HasSchemas, HasTable
                IconColumn::make('country.icon')->icon(fn (string $state): string => $state)->label(''),
                TextColumn::make('competition_group.name')->label('Group')
                    ->wrap()
-                    ->tooltip('Click to filter by this group')
+                    ->color('primary')
+                    ->tooltip('Filter by group')
                    ->description(fn ($record): string => $record->country?->name ?? '')
                    ->action(function ($record) {
                        if ($record?->competition_group_id ?? null && ! in_array($record->competition_group_id, $this->tableFilters['events']['competition_group_id'])) {
@@ -78,10 +83,9 @@ class MapperLeft extends Component implements HasActions, HasSchemas, HasTable
                    }),
                TextColumn::make('starttime')
                    ->sortable()
-                    ->time('H:i')
-                    ->alignCenter()
-                    ->description(fn ($record): string => Carbon::parse($record->starttime)->format('d. M. y')),
-                MapperLeftColumn::make('left')->label(''),
+                    ->time('d. M. y H:i')
+                    ->alignCenter(),
+                MapperLeftColumn::make('left')->label('Event')->alignCenter(),
            ])
            ->defaultSort('starttime')
            ->searchable(['home.name', 'away.name'])
@@ -234,7 +238,7 @@ class MapperLeft extends Component implements HasActions, HasSchemas, HasTable
                        $indicators = [];
                        if ($this->search_values) {
                            foreach ($this->search_values as $value) {
-                                $indicators[] = Indicator::make($value)->removeField($value)->color('info');
+                                $indicators[] = Indicator::make($value)->removeField($value)->color($this->search_color);
                            }
                        }

@@ -246,9 +250,15 @@ class MapperLeft extends Component implements HasActions, HasSchemas, HasTable
            ->persistFiltersInSession()
            ->deferFilters(false)
            ->toolbarActions([
-                Action::make('refreshMapperLeft')
+                Action::make('refresh_left')
+                    ->hiddenLabel()
+                    ->icon('phosphor-arrows-counter-clockwise')
+                    ->size(Size::Small)
+                    ->action(function (Component $livewire) {
+                        $this->dispatch('refreshMapperLeft');
+                    }),
+                Action::make('reload_left')
                    ->hiddenLabel()
-                    ->color('gray')
                    ->icon('phosphor-x')
                    ->size(Size::Small)
                    ->action(function (Component $livewire) {
@@ -267,13 +277,12 @@ class MapperLeft extends Component implements HasActions, HasSchemas, HasTable
    }

    #[On('search_left')]
-    public function searchLeft($str)
+    public function searchLeft($string)
    {
-        $this->search_values = SearchString::explode($str);
+        $t = explode('|', $string);
+        $this->search_values = SearchString::explode($t[0]);

-        // foreach ($this->search_values as $key => $value) {
-        //     $this->tableFilters['events'][$key] = null;
-        // }
+        $this->search_color = $t[1];

        $this->dispatch('refreshMapperLeft');
    }
@@ -45,6 +45,8 @@ class MapperRight extends Component implements HasActions, HasSchemas, HasTable

    public $search_values = [];

+    public $search_color = 'info';
+
    protected $listeners = [
        'refreshMapperRight' => '$refresh',
    ];
@@ -64,15 +66,15 @@ class MapperRight extends Component implements HasActions, HasSchemas, HasTable
            ->query(LoadProvider::load($this->search_values, auth()->user()))
            ->striped()
            ->columns([
-                MapperRightColumn::make('right')->label(''),
+                MapperRightColumn::make('left')->label('Event')->alignCenter(),
                TextColumn::make('starttime')
                    ->sortable()
-                    ->time('H:i')
-                    ->alignCenter()
-                    ->description(fn ($record): string => Carbon::parse($record->starttime)->format('d. M. y')),
+                    ->time('d. M. y H:i')
+                    ->alignCenter(),
                TextColumn::make('group')
                    ->wrap()
-                    ->tooltip('Click to filter by this group')
+                    ->color('primary')
+                    ->tooltip('Filter by group')
                    ->description(fn ($record): string => $record->country_betsapi?->name.' '.$record->country)
                    ->action(function ($record) {
                        if ($record?->group_id ?? null && ! in_array($record->group_id, $this->tableFilters['events']['group_id'])) {
@@ -253,7 +255,7 @@ class MapperRight extends Component implements HasActions, HasSchemas, HasTable
                        $indicators = [];
                        if ($this->search_values) {
                            foreach ($this->search_values as $value) {
-                                $indicators[] = Indicator::make($value)->removeField($value)->color('info');
+                                $indicators[] = Indicator::make($value)->removeField($value)->color($this->search_color);
                            }
                        }

@@ -270,9 +272,15 @@ class MapperRight extends Component implements HasActions, HasSchemas, HasTable
            ->filtersFormColumns(3)
            ->deferFilters(false)
            ->toolbarActions([
-                Action::make('refreshMapperRight')
+                Action::make('refresh_right')
+                    ->hiddenLabel()
+                    ->icon('phosphor-arrows-counter-clockwise')
+                    ->size(Size::Small)
+                    ->action(function (Component $livewire) {
+                        $this->dispatch('refreshMapperRight');
+                    }),
+                Action::make('reload_right')
                    ->hiddenLabel()
-                    ->color('gray')
                    ->icon('phosphor-x')
                    ->size(Size::Small)
                    ->action(function (Component $livewire) {
@@ -281,7 +289,6 @@ class MapperRight extends Component implements HasActions, HasSchemas, HasTable
                        $livewire->fill(['tableSearch' => '']);
                        $livewire->resetTableFiltersForm(); // Clears all filters
                        $this->dispatch('refreshMapperRight');
-                        // $this->dispatch('refreshMapperLeft');
                    }),
            ]);
    }
@@ -292,13 +299,12 @@ class MapperRight extends Component implements HasActions, HasSchemas, HasTable
    }

    #[On('search_right')]
-    public function searchRight($str)
+    public function searchRight($string)
    {
-        $this->search_values = SearchString::explode($str);
+        $t = explode('|', $string);
+        $this->search_values = SearchString::explode($t[0]);

-        // foreach ($this->tableFilters['events'] as $key => $value) {
-        //     $this->tableFilters['events'][$key] = null;
-        // }
+        $this->search_color = $t[1];

        $this->dispatch('refreshMapperRight');
    }
@@ -58,14 +58,12 @@ class AppServiceProvider extends ServiceProvider
        Carbon::setLocale(app()->getLocale());

        FilamentColor::register([
-            'primary' => Color::Gray,
+            'primary' => Color::Blue,
            'danger' => Color::Red,
            'gray' => Color::Zinc,
-            'info' => Color::Blue,
+            'info' => Color::Lime,
            'success' => Color::Green,
            'warning' => Color::Orange,
-            'home' => Color::Sky,
-            'away' => Color::Lime,
        ]);
    }
 }
@@ -76,24 +76,6 @@ button[wire\:click="resetTableFiltersForm"] {
    @apply grid grid-cols-3 justify-start
 }

-#mapper {
-    @layer components {
-        .fi-ta-ctn {
-            & .fi-ta-header-toolbar {
-                @apply !flex-row-reverse;
-                flex-wrap: inherit;
-            }
-        }
-
-        .fi-pagination {
-            & .fi-pagination-overview {
-                display: block;
-                font-size: 11px;
-            }
-        }
-    }
-}
-
 /* Styling Radio Lable */

 .fi-fo-radio {
@@ -108,17 +90,18 @@ button[wire\:click="resetTableFiltersForm"] {
 #mapper_left .fi-dropdown-list-item {
    padding: 2px;
 }
-
+*/

 #mapper_right .fi-ta-filter-indicators button,
 #mapper_left .fi-ta-filter-indicators button {
+    /** remove all filters not working */
    display: none;
 }

 #mapper_right .fi-ta-filter-indicators div button,
 #mapper_left .fi-ta-filter-indicators div button {
    display: block;
-} */
+}

 /**
 less padding in table
@@ -140,10 +123,6 @@ less padding in table
        }
    }

-    .fi-ta-table thead {
-        display: none;
-    }
-
    .fi-ta-filters-above-content-ctn {
        @apply py-3
    }
@@ -161,6 +140,26 @@ less padding in table
    }
 }

+
+#mapper {
+    @layer components {
+        .fi-ta-ctn {
+            & .fi-ta-header-toolbar {
+                @apply !flex-row-reverse;
+                flex-wrap: inherit;
+            }
+        }
+
+        .fi-pagination {
+            & .fi-pagination-overview {
+                display: block;
+                font-size: 11px;
+            }
+        }
+    }
+}
+
+
 /* Optional: Decrease overall table container padding */
 /* .fi-ta-ctn {
    padding-top: 0.5rem !important;
@@ -1,5 +1,5 @@
 <div
-    class="text-gray-400 bg-gray-50 border border-gray-300 dark:text-primary-500 dark:!border-gray-800 dark:bg-gray-900 rounded">
+    class="text-gray-400 bg-gray-50 border border-gray-300 dark:text-gray-500 dark:!border-gray-800 dark:bg-gray-900 rounded">

    {{ $slot }}
 </div>
@@ -1,3 +1,3 @@
-<div class="text-primary-600 dark:text-primary-500">
-{{ $slot }}
+<div class="text-gray-600 dark:text-gray-500">
+    {{ $slot }}
 </div>
@@ -1,3 +1,3 @@
-<div class="text-primary-700 dark:text-primary-500">
+<div class="text-gray-700 dark:text-gray-500">
    {{ $slot }}
-</div>
+</div>
@@ -1,5 +1,5 @@
 <div
-    class="grid grid-cols-4 text-xs gap-1 p-1 text-gray-400  dark:text-primary-500 border rounded border-gray-200 dark:border-gray-800 bg-gray-100 dark:bg-gray-900 text-center shadow">
+    class="grid grid-cols-4 text-xs gap-1 p-1 text-gray-400  dark:text-gray-500 border rounded border-gray-200 dark:border-gray-800 bg-gray-100 dark:bg-gray-900 text-center shadow">
    <div class="text-nowrap">{{ $title }}</div>

    @if ($red)
@@ -1,32 +1,30 @@
-<li class="cursor-grab drag-and-drop__item p-3 flex flex-1 justify-between w-full gap-3" 
-    id="{{ $record->id }}"
-    x-data="{ moveoverleft: false }" 
+<li class="cursor-grab drag-and-drop__item p-3 flex flex-1 justify-between w-full gap-3" id="{{ $record->id }}"
+    x-data="{ moveoverleft: false }"
    x-on:dragstart.self="
        dragging = true;
        event.dataTransfer.effectAllowed = 'move';
        event.dataTransfer.setData('text/plain', event.target.id);"
-    x-on:dragover.prevent="moveoverleft = true" 
-    x-on:dragleave.prevent="moveoverleft = false"
-    x-on:drop="moveoverleft = false" :class="moveoverleft ? 'bg-blue-600/20! rounded':''"
+    x-on:dragover.prevent="moveoverleft = true" x-on:dragleave.prevent="moveoverleft = false"
+    x-on:drop="moveoverleft = false" :class="moveoverleft ? 'bg-blue-600/20! rounded' : ''"
    x-on:drop.prevent="
        const id = event.dataTransfer.getData('text/plain');
        const target = event.target.closest('li');
        if(document.getElementById(id).getAttribute('mapper') !=target.getAttribute('mapper'))
        $wire.mountAction('left', { event_id: id, id: target.id, mover:'left' });"
-    draggable="true" 
-    mapper="left">
+    draggable="true" mapper="left">

    <div class="flex justify-center gap-4 w-full my-calendar font-bold">
-        <div class="text-lime-500 text-wrap text-right">{{ $record->home->name }}</div>
+        <x-filament::link x-on:click="search_right='{{ $record->home->name }}|success'" class="text-wrap text-right"
+            color="success" tooltip="Click to search">
+            {{ $record->home->name }}
+        </x-filament::link>
+
        <div>-</div>
-        <div class="text-sky-500 text-wrap">{{ $record->away->name }}</div>
+        <x-filament::link x-on:click="search_right='{{ $record->away->name }}|warning'" class="text-wrap"
+            color="warning" tooltip="Click to search">
+            {{ $record->away->name }}
+        </x-filament::link>
    </div>

-    <div class="grid grid-cols-3 gap-4">
-        @include('filament.tables.columns.parts.search-left', ['find' => $record->home->name, 'color' => 'away'])
-
-        @include('filament.tables.columns.parts.search-left', ['find' => $record->away->name, 'color' => 'home'])
-
-        @include('filament.tables.columns.parts.move-botton')
-    </div>
+    @include('filament.tables.columns.parts.move-botton')
 </li>
@@ -1,33 +1,31 @@
-<li class="cursor-grab drag-and-drop__item p-3 flex flex-1 gap-3 justify-between" 
-    id="{{ $record->event_id }}"
-    x-data="{ moveoverright: false }" 
+<li class="cursor-grab drag-and-drop__item p-3 flex flex-1 gap-3 justify-between" id="{{ $record->event_id }}"
+    x-data="{ moveoverright: false }"
    x-on:dragstart.self="
        dragging = true;
        event.dataTransfer.effectAllowed = 'move';
        event.dataTransfer.setData('text/plain', event.target.id);"
-    x-on:dragover.prevent="moveoverright = true" 
-    x-on:dragleave.prevent="moveoverright = false"
-    x-on:drop="moveoverright = false" :class="moveoverright ? 'bg-blue-600/20! rounded':''"
+    x-on:dragover.prevent="moveoverright = true" x-on:dragleave.prevent="moveoverright = false"
+    x-on:drop="moveoverright = false" :class="moveoverright ? 'bg-blue-600/20! rounded' : ''"
    x-on:drop.prevent="
        const id = event.dataTransfer.getData('text/plain');
        const target = event.target.closest('li');
        if(document.getElementById(id).getAttribute('mapper') !=target.getAttribute('mapper'))
        $wire.mountAction('right', { id: id, event_id: target.id, mover:'right' });"
-    draggable="true" 
-    mapper="right">
+    draggable="true" mapper="right">

-    <div class="grid grid-cols-3 gap-4">
-        @include('filament.tables.columns.parts.move-botton')
-        
-        @include('filament.tables.columns.parts.search-right', ['find' => $record->home, 'color' => 'away'])
-        
-        @include('filament.tables.columns.parts.search-right', ['find' => $record->away, 'color' => 'home'])
+    @include('filament.tables.columns.parts.move-botton')

-    </div>
+    <div class="flex justify-center gap-4 w-full my-calendar font-bold">
+        <x-filament::link x-on:click="search_left='{{ $record->home }}|success'" class="text-wrap text-right"
+            color="success" tooltip="Click to search">
+            {{ $record->home }}
+        </x-filament::link>

-    <div class="flex justify-center gap-4 w-full font-bold">
-        <div class="text-lime-500 text-wrap text-right">{{ $record->home }}</div>
        <div>-</div>
-        <div class="text-sky-500 text-wrap">{{ $record->away }}</div>
+        <x-filament::link x-on:click="search_left='{{ $record->away }}|warning'" class="text-wrap" color="warning"
+            tooltip="Click to search">
+            {{ $record->away }}
+        </x-filament::link>
+
    </div>
 </li>
@@ -1,4 +1,4 @@
 <div class="my-auto">
-    {{-- <x-filament::icon-button icon="phosphor-arrows-out" size="xs" outlined/> --}}
-    <x-phosphor-arrows-out class="h-4" color="gray"></x-phosphor-arrows-out>
+    <x-filament::button icon="phosphor-arrows-out" size="xs" tooltip="Click and drag" />
+    {{-- <x-phosphor-arrows-out class="h-4" color="gray"></x-phosphor-arrows-out> --}}
 </div>
@@ -1,3 +1,4 @@
 <div class="my-auto">
-    <x-filament::icon-button icon="phosphor-magnifying-glass" color="{{ $color }}" outlined size="xs" x-on:click="search_right='{{ $find }}';" />
-</div>
+    <x-filament::button icon="phosphor-magnifying-glass" color="{{ $color }}" size="xs"
+        x-on:click="search_right='{{ $find }}|{{ $color }}'; " />
+</div>
@@ -1,3 +1,4 @@
 <div class="my-auto">
-    <x-filament::icon-button icon="phosphor-magnifying-glass" color="{{ $color }}" outlined size="xs" x-on:click="search_left='{{ $find }}'; " />
+    <x-filament::button icon="phosphor-magnifying-glass" color="{{ $color }}" size="xs"
+        x-on:click="search_left='{{ $find }}|{{ $color }}'; " />
 </div>
@@ -1,5 +1,5 @@
 <div class="flex flex-row gap-10 justify-between">
-    
+
    <div class="flex flex-row gap-2">
        <x-filament::button size="xs" tooltip="Clear all orange filter" wire:click="clearAllFilter" color="gray"
            icon="phosphor-x" />
@@ -19,53 +19,52 @@
    <div></div>

    @role('partner_porgramm')
-    <div class="flex flex-row gap-2">
-        <x-filament::button size="xs" wire:poll.20s="setDifferences" :color="auth()->user()->bookmaker_partner_differences ? 'info' : 'gray'"
-        wire:click="toggleBookmakerPartnerDiffrences"
-        tooltip="{{ auth()->user()->bookmaker->name .
-            ' ' .
-            $this->bookmakerCount .
-            ' - ' .
-            auth()->user()->partnerbookmaker->name .
-            ' ' .
-            $this->partnerCount }}">
-        Missing
-        @if ($this->bookmakerPartnerDiffrences == 0)
-            <x-filament::badge size="xs" color="gray">
-                0
-            </x-filament::badge>
-        @else
-            <x-filament::badge size="xs" color="danger">
-                {{ $this->bookmakerPartnerDiffrences }}
-            </x-filament::badge>
-        @endif
-        </x-filament::button>
-        <x-filament::button size="xs" tooltip="Show {{ auth()->user()->partnerbookmaker->name }}"
-            wire:click="toggleShowPartner" 
-            :color="auth()->user()->partner_show ? 'info' : 'gray'" 
-            icon="phosphor-users-duotone">
-        </x-filament::button>
+        <div class="flex flex-row gap-2">
+            <x-filament::button size="xs" wire:poll.20s="setDifferences" :color="auth()->user()->bookmaker_partner_differences ? 'primary' : 'gray'"
+                wire:click="toggleBookmakerPartnerDiffrences"
+                tooltip="{{ auth()->user()->bookmaker->name .
+                    ' ' .
+                    $this->bookmakerCount .
+                    ' - ' .
+                    auth()->user()->partnerbookmaker->name .
+                    ' ' .
+                    $this->partnerCount }}">
+                Missing
+                @if ($this->bookmakerPartnerDiffrences == 0)
+                    <x-filament::badge size="xs" color="gray">
+                        0
+                    </x-filament::badge>
+                @else
+                    <x-filament::badge size="xs" color="danger">
+                        {{ $this->bookmakerPartnerDiffrences }}
+                    </x-filament::badge>
+                @endif
+            </x-filament::button>
+            <x-filament::button size="xs" tooltip="Show {{ auth()->user()->partnerbookmaker->name }}"
+                wire:click="toggleShowPartner" :color="auth()->user()->partner_show ? 'primary' : 'gray'" icon="phosphor-users-duotone">
+            </x-filament::button>

-        <x-filament::button disabled="true" size="xs" wire:click="toggleComparePartner"
-            tooltip="Filter events where odds are different"
-            :disabled="auth()->user()->partner_show ? false : true" 
-            :color="auth()->user()->partner_compare ? 'info' : 'gray'" icon="phosphor-exclude-square-duotone">
-        </x-filament::button>
+            <x-filament::button disabled="true" size="xs" wire:click="toggleComparePartner"
+                tooltip="Filter events where odds are different" :disabled="auth()->user()->partner_show ? false : true" :color="auth()->user()->partner_compare ? 'primary' : 'gray'"
+                icon="phosphor-exclude-square-duotone">
+            </x-filament::button>

-        <x-filament::button size="xs" wire:click="toggleMultiline" :tooltip="auth()->user()->is_multiline_direct ? 'Multiline slots are disabled' : 'Multiline slots are active'" :color="auth()->user()->is_multiline_direct ? 'info' : 'gray'"
-            :icon="auth()->user()->is_multiline_direct ? 'phosphor-not-equals' : 'phosphor-equals'">
-        </x-filament::button>
-    </div>
+            <x-filament::button size="xs" wire:click="toggleMultiline" :tooltip="auth()->user()->is_multiline_direct
+                ? 'Multiline slots are disabled'
+                : 'Multiline slots are active'" :color="auth()->user()->is_multiline_direct ? 'primary' : 'gray'"
+                :icon="auth()->user()->is_multiline_direct ? 'phosphor-not-equals' : 'phosphor-equals'">
+            </x-filament::button>
+        </div>
    @endrole
-    
+
    <div class="flex flex-row gap-2">
-        <x-filament::button size="xs" wire:click="setAllOnlyNone(0)" :color="auth()->user()->all_only_none == 0 ? 'info' : 'gray'" icon="phosphor-stack-duotone"
-            tooltip="All Events">
+        <x-filament::button size="xs" wire:click="setAllOnlyNone(0)" :color="auth()->user()->all_only_none == 0 ? 'primary' : 'gray'"
+            icon="phosphor-stack-duotone" tooltip="All Events">
        </x-filament::button>
        <x-filament::button size="xs" wire:click="setAllOnlyNone(1)" icon="phosphor-plus-square-duotone"
-            :color="auth()->user()->all_only_none == 1 ? 'info' : 'gray'" tooltip="Events with {{ auth()->user()->bookmaker->name }}">
+            :color="auth()->user()->all_only_none == 1 ? 'primary' : 'gray'" tooltip="Events with {{ auth()->user()->bookmaker->name }}">
        </x-filament::button>
-        <x-filament::button size="xs" wire:click="setAllOnlyNone(2)" :color="auth()->user()->all_only_none == 2 ? 'info' : 'gray'"
+        <x-filament::button size="xs" wire:click="setAllOnlyNone(2)" :color="auth()->user()->all_only_none == 2 ? 'primary' : 'gray'"
            icon="phosphor-minus-square-duotone" tooltip="Events without {{ auth()->user()->bookmaker->name }}">
        </x-filament::button>
    </div>
@@ -84,7 +83,7 @@
                </x-filament::button>
            @else
                <x-filament::button size="xs" class="flex flex-col justify-center gap-0"
-                    tooltip="{{ $toggle['name'] }}" wire:click="toggleBettype({{ $toggle['id'] }})" :color="!$toggle['is_active'] ? 'gray' : 'info'">
+                    tooltip="{{ $toggle['name'] }}" wire:click="toggleBettype({{ $toggle['id'] }})" :color="!$toggle['is_active'] ? 'gray' : 'primary'">
                    <div class="m-0 p-0">{{ $toggle['short'] }}</div>
                </x-filament::button>
            @endif