wip calculator

This commit is contained in:
salam committed 2026-09-05 16:15:18 +02:00
1 parent 3d3748c353
commit 217636b564
14 files changed
+136 -220

No files matched your search

+22 -21
View File
@@ -2,35 +2,29 @@
namespace App\Livewire;
use Illuminate\Support\Facades\Log;
use Livewire\Component;
class BoardDispatcher extends Component
{
public array $lists = [];
public array $destLabels = ['DR', 'MR', 'RW', 'DC', 'DM', 'MC', 'AM', 'SW', 'DC', 'DM', 'MC', 'AM', 'SM', 'ST', 'DC', 'DM', 'MC', 'AM', 'DL', 'ML', 'LM'];
public string $boardVersion = '';
public function mount()
public function mount(array $filters)
{
$this->boardVersion = uniqid();
$this->lists['source-1'] = [
['id' => '1', 'name' => 'Source Item A', 'origin' => 'source-1'],
['id' => '2', 'name' => 'Source Item B', 'origin' => 'source-1'],
];
$this->lists['source-2'] = [
['id' => '3', 'name' => 'Source Item C', 'origin' => 'source-2'],
];
$this->lists['source-3'] = [
['id' => '4', 'name' => 'Source Item D', 'origin' => 'source-3'],
['id' => '5', 'name' => 'Source Item E', 'origin' => 'source-3'],
];
$this->lists['source-4'] = [
['id' => '6', 'name' => 'Source Item F', 'origin' => 'source-4'],
];
$this->lists = PlayerCalculator::load($filters);
for ($i = 1; $i <= 21; $i++) {
$active = [2, 4, 6, 9, 10, 11, 12, 15, 16, 17, 18, 19, 20, 21, 23, 24, 25, 26, 30, 32, 34];
for ($i = 1; $i <= 35; $i++) {
if (in_array($i, $active))
$this->lists["dest-{$i}"] = [];
else
$this->lists["blind-{$i}"] = [];
}
}
@@ -74,6 +68,10 @@ class BoardDispatcher extends Component
{
$itemId = (string) $itemId;
// Log::info($this->boardVersion);
// Log::info('itemId, currentListId', [$itemId, $currentListId]);
// Log::info('OLD LIST', $this->lists);
if (! isset($this->lists[$currentListId])) {
$this->boardVersion = uniqid();
@@ -93,12 +91,15 @@ class BoardDispatcher extends Component
if ($foundItem && isset($this->lists[$foundItem['origin']])) {
// Nur zurücklegen, wenn die Quelle wirklich frei ist
if (count($this->lists[$foundItem['origin']]) < 1) {
array_unshift($this->lists[$foundItem['origin']], $foundItem);
} else {
// Ausfallsicherheit gegen Datenverlust: Zurück in die Bucht schieben
array_unshift($this->lists[$currentListId], $foundItem);
}
// if (count($this->lists[$foundItem['origin']]) < 2) {
// Log::info('origin');
// array_unshift($this->lists[$foundItem['origin']], $foundItem);
// } else {
// // Ausfallsicherheit gegen Datenverlust: Zurück in die Bucht schieben
// array_unshift($this->lists[$currentListId], $foundItem);
// Log::info('box');
// }
}
$this->boardVersion = uniqid();
+1 -1
View File
@@ -6,7 +6,7 @@ class LoadGridPositions
{
public static function load()
{
$arr = [];
$arr = ['DR', 'MR', 'RW', 'DC', 'DM', 'MC', 'AM', 'SW', 'DC', 'DM', 'MC', 'AM', 'SM', 'ST', 'DC', 'DM', 'MC', 'AM', 'DL', 'ML', 'LM'];
$arr[] = 0;
$arr[] = 0;
+21 -23
View File
@@ -88,45 +88,43 @@ class PlayerCalculator extends Component
$colorlevel = round($matches->count() / 3);
if (in_array($val['player_position'], $positions_map['MIDFIELD'])) {
$position = 'MIDFIELD';
$position_color = 'info';
$origin = 'source-midfield';
$pcolor = 'info';
} elseif (in_array($val['player_position'], $positions_map['DEFENCE'])) {
$position = 'DEFENCE';
$position_color = 'success';
$origin = 'source-defence';
$pcolor = 'success';
} elseif (in_array($val['player_position'], $positions_map['ATTACK'])) {
$position = 'ATTACK';
$position_color = 'warning';
$origin = 'source-attack';
$pcolor = 'warning';
} elseif (in_array($val['player_position'], $positions_map['GOALKEEPER'])) {
$position = 'GOALKEEPER';
$position_color = 'gray';
$origin = 'source-goalkeeper';
$pcolor = 'gray';
} else {
$position = 'NO SPECIFIC POSITION';
$position_color = '';
$origin = 'NO SPECIFIC POSITION';
$pcolor = '';
}
$name = $val['player_name'];
$preferred_foot = $val['preferred_foot'] ?? '-';
$everage_minutes = round($minues_played / $events_played).' min';
$everage_minutes = round($minues_played / $events_played) . ' min';
if ($colorlevel > 1 && $events_played < $colorlevel) {
$color = 'danger';
$ecolor = 'danger';
} elseif ($events_played < $colorlevel * 2) {
$color = 'info';
$ecolor = 'info';
} else {
$color = 'success';
$ecolor = 'success';
}
$result[] = [
'player_id' => $player_id,
'player_name' => $name,
'position' => $position,
'type_color' => $position_color,
'event_color' => $color,
'info' => 'Ev '.$events_played.', '.$preferred_foot.', '.$everage_minutes,
$result[$origin][] = [
'id' => $player_id,
'name' => $name,
'origin' => $origin,
'pcolor' => $pcolor,
'ecolor' => $ecolor,
'info' => 'Ev ' . $events_played . ', ' . $preferred_foot . ', ' . $everage_minutes,
];
}
// dd($result);
return $result;
}
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 246 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 175 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 55 KiB

After

Width:  |  Height:  |  Size: 5.8 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 84 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 137 KiB

-38
View File
@@ -1,38 +0,0 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg" width="600.000000pt" height="98.000000pt" viewBox="0 0 600.000000 98.000000" preserveAspectRatio="xMidYMid meet">
<g transform="translate(0.000000,98.000000) scale(0.100000,-0.100000)" fill="#000" stroke="none">
<path d="M146 877 c-68 -89 -92 -212 -61 -308 10 -30 38 -94 63 -144 39 -77
46 -99 46 -150 0 -64 -20 -115 -70 -174 -14 -18 -24 -34 -21 -37 10 -10 290
-4 302 6 25 20 64 108 76 168 16 83 3 141 -61 271 -27 54 -53 117 -58 139 -16
70 10 150 74 230 l27 32 -146 0 -146 0 -25 -33z" />
<path d="M510 820 l0 -90 95 0 95 0 0 -335 0 -335 130 0 130 0 0 335 0 334 77
3 76 3 23 85 c13 47 24 86 24 88 0 1 -146 2 -325 2 l-325 0 0 -90z" />
<path d="M1237 853 c-72 -162 -92 -293 -83 -532 3 -97 9 -194 14 -216 l7 -40
133 -3 c72 -1 132 1 132 5 0 4 -6 42 -14 83 -8 41 -16 106 -18 143 l-3 68 105
0 105 0 -3 -68 c-3 -62 -15 -154 -29 -211 l-5 -23 133 3 133 3 8 39 c15 70 23
285 16 392 -8 118 -36 241 -77 342 l-28 67 -250 3 -250 2 -26 -57z m306 -70
c23 -52 67 -204 67 -232 0 -7 -35 -11 -100 -11 -65 0 -100 4 -100 11 0 53 82
289 100 289 4 0 19 -26 33 -57z" />
<path d="M1900 820 l0 -90 90 0 90 0 0 -335 0 -335 130 0 130 0 0 335 0 335
79 0 79 0 21 78 c12 43 21 84 21 90 0 9 -81 12 -320 12 l-320 0 0 -90z" />
<path d="M2600 485 l0 -425 135 0 135 0 -2 423 -3 422 -132 3 -133 3 0 -426z" />
<path d="M3023 862 c-37 -54 -51 -88 -63 -154 -14 -70 3 -137 65 -268 44 -93
55 -125 55 -165 0 -57 -25 -119 -71 -176 l-31 -39 154 0 154 0 31 53 c41 67
56 131 51 210 -3 52 -15 86 -66 193 -48 99 -62 139 -62 174 0 50 32 128 73
176 15 18 27 35 27 38 0 3 -64 6 -142 6 l-143 0 -32 -48z" />
<path d="M3400 820 l0 -90 90 0 90 0 0 -335 0 -335 130 0 130 0 0 335 0 335
78 0 79 0 21 79 c12 43 22 83 22 90 0 8 -89 11 -320 11 l-320 0 0 -90z" />
<path d="M4100 485 l0 -425 130 0 130 0 0 425 0 425 -130 0 -130 0 0 -425z" />
<path d="M4470 485 l0 -425 130 0 130 0 0 195 0 195 23 0 c35 0 82 -34 101
-75 21 -43 36 -135 36 -222 0 -98 -7 -93 147 -93 l134 0 -5 58 c-3 31 -8 91
-11 132 -9 108 -33 186 -69 224 -17 18 -38 36 -46 39 -12 4 -9 10 13 27 56 44
71 92 75 238 l4 132 -135 0 -135 0 -4 -137 c-3 -159 -17 -201 -73 -227 -18 -9
-38 -16 -44 -16 -8 0 -11 59 -11 190 l0 190 -130 0 -130 0 0 -425z" />
<path d="M5300 858 c-41 -95 -60 -188 -66 -323 -7 -154 10 -274 57 -396 l30
-79 273 0 274 0 21 50 c48 111 56 164 56 370 0 206 -8 251 -65 384 l-19 46
-269 0 -270 0 -22 -52z m326 -72 c14 -30 31 -85 39 -123 17 -78 20 -275 5
-354 -12 -65 -59 -199 -70 -199 -10 0 -60 113 -77 174 -21 79 -28 234 -13 323
13 84 65 233 81 233 6 0 21 -24 35 -54z" />
</g>
</svg>

Before

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

+44 -16
View File
@@ -1,18 +1,46 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="740" height="1110" viewBox="0 0 74 111">
<rect id="" width="74" height="111" fill="#008236"/>
<g fill="none" stroke="#00a63e" stroke-width="0.5" transform="translate(3 3)">
<path id="Border" d="M 0 0 h 68 v 105 h -68 Z"/>
<path id="Centre line" d="M 0 52.5 h 68"/>
<circle id="Centre circle" r="9.15" cx="34" cy="52.5"/>
<circle id="Centre mark" r="0.75" cx="34" cy="52.5" fill="#00a63e" stroke="none"/>
<g id="Penalty area">
<path id="Penalty area line" d="M 13.84 0 v 16.5 h 40.32 v -16.5"/>
<path id="Goal area line" d="M 24.84 0 v 5.5 h 18.32 v -5.5"/>
<circle id="Penalty mark" r="0.75" cx="34" cy="10.94" fill="#00a63e" stroke="none"/>
<path id="Penalty arc" d="M 26.733027 16.5 a 9.15 9.15 0 0 0 14.533946 0"/>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 1063 693" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;">
<g transform="matrix(1,0,0,1,-23.815342,-23.815342)">
<g transform="matrix(0,10,-10,0,1080,30)">
<rect id="Border" x="0" y="0" width="68" height="105" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
</g>
<g transform="matrix(0,10,-10,0,1080,30)">
<path id="Centre-line" serif:id="Centre line" d="M0,52.5l68,0" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
</g>
<g transform="matrix(0,10,-10,0,1080,30)">
<circle id="Centre-circle" serif:id="Centre circle" cx="34" cy="52.5" r="9.15" style="fill:none;stroke:#ffffff;stroke-width:0.3px;"/>
</g>
<g transform="matrix(0,10,-10,0,1080,30)">
<circle id="Centre-mark" serif:id="Centre mark" cx="34" cy="52.5" r="0.75" style="fill:none;stroke:#ffffff;stroke-width:0.3px;stroke-linejoin:round;stroke-miterlimit:2;"/>
</g>
<g transform="matrix(0,10,-10,0,1080,30)">
<g id="Penalty-area" serif:id="Penalty area">
<path id="Penalty-area-line" serif:id="Penalty area line" d="M13.84,0l0,16.5l40.32,0l0,-16.5" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
<path id="Goal-area-line" serif:id="Goal area line" d="M24.84,0l0,5.5l18.32,0l0,-5.5" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
<circle id="Penalty-mark" serif:id="Penalty mark" cx="34" cy="10.94" r="0.75" style="fill:none;stroke:#ffffff;stroke-width:0.3px;stroke-linejoin:round;stroke-miterlimit:2;"/>
<path id="Penalty-arc" serif:id="Penalty arc" d="M26.733,16.5c1.73,2.261 4.42,3.59 7.267,3.59c2.847,0 5.537,-1.329 7.267,-3.59" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
</g>
</g>
<g transform="matrix(0,10,-10,0,1080,30)">
<g id="Penalty-area1" serif:id="Penalty area" transform="matrix(-1,-0,0,-1,68,105)">
<path id="Penalty-area-line1" serif:id="Penalty area line" d="M13.84,0l0,16.5l40.32,0l0,-16.5" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
<path id="Goal-area-line1" serif:id="Goal area line" d="M24.84,0l0,5.5l18.32,0l0,-5.5" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
<circle id="Penalty-mark1" serif:id="Penalty mark" cx="34" cy="10.94" r="0.75" style="fill:none;stroke:#ffffff;stroke-width:0.3px;stroke-linejoin:round;stroke-miterlimit:2;"/>
<g transform="matrix(0,0.1,-0.1,0,71,-3)">
<use xlink:href="#_Image1" x="27" y="27" width="1056px" height="686px"/>
</g>
<g transform="matrix(0,0.1,-0.1,0,71,-3)">
<use xlink:href="#_Image2" x="27" y="27" width="1056px" height="686px"/>
</g>
<g transform="matrix(0,0.1,-0.1,0,71,-3)">
<use xlink:href="#_Image3" x="27" y="27" width="1056px" height="686px"/>
</g>
<path id="Penalty-arc1" serif:id="Penalty arc" d="M26.733,16.5c1.73,2.261 4.42,3.59 7.267,3.59c2.847,0 5.537,-1.329 7.267,-3.59" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
</g>
</g>
<g transform="matrix(0,10,-10,0,1080,30)">
<path id="Corner-arcs" serif:id="Corner arcs" d="M0,2c1.097,0 2,-0.903 2,-2m64,0c0,1.097 0.903,2 2,2m0,101c-1.097,0 -2,0.903 -2,2m-64,0c0,-1.097 -0.903,-2 -2,-2" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
</g>
</g>
<use xlink:href="#Penalty area" transform="rotate(180,34,52.5)" />
<path id="Corner arcs" d="M 0 2 a 2 2 0 0 0 2 -2M 66 0 a 2 2 0 0 0 2 2M 68 103 a 2 2 0 0 0 -2 2M 2 105 a 2 2 0 0 0 -2 -2"/>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.0 KiB

After

Width:  |  Height:  |  Size: 3.9 KiB

-43
View File
@@ -234,46 +234,3 @@ less padding in table
}
}
}
/* 1. Das Element, das am Mauszeiger klebt (Der Mirror) */
.gu-mirror {
position: fixed !important;
margin: 0 !important;
z-index: 9999 !important;
opacity: 0.95 !important;
pointer-events: none;
/* Verhindert, dass der Klon Maus-Events blockiert */
/* Styling für den Klon (Hell-Modus) */
background-color: rgb(255, 255, 255) !important;
border: 1px solid rgb(226, 232, 240) !important;
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.15), 0 10px 10px -5px rgba(0, 0, 0, 0.04) !important;
border-radius: 0.5rem !important;
transform: rotate(3deg);
/* Optionale leichte Drehung für einen dynamischen Look */
transition: transform 0.15s ease;
}
/* Dark Mode Anpassung für den Mirror (Wichtig in Filament!) */
.dark .gu-mirror {
background-color: rgb(31, 41, 55) !important;
border-color: rgb(55, 65, 81) !important;
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.5) !important;
}
/* 2. Der „Schatten“ am ursprünglichen Platz (Transit-Element) */
.gu-transit {
opacity: 0.3 !important;
border: 2px dashed rgb(99, 102, 241) !important;
/* Indigo-farbener gestrichelter Rahmen */
background-color: rgba(99, 102, 241, 0.05) !important;
}
.dark .gu-transit {
background-color: rgba(99, 102, 241, 0.1) !important;
}
/* 3. Sicherstellen, dass die Dropzones Platz für das Element bieten */
/* .drag-box {
@apply flex flex-col gap-0 bg-gray-100/50 border-2 border-dashed border-gray-300 rounded-xl text-xs p-0;
} */
@@ -1,4 +1,3 @@
<div>
<!-- Render the livewire element smoothly within the Filament modal context -->
@livewire('board-dispatcher')
@livewire('board-dispatcher', ['filters' => $this->filters])
</div>
@@ -1,15 +1,15 @@
<div class="space-y-6 max-h-[75vh] overflow-y-auto p-1" x-data="{ activeTab: '{{ collect(array_keys($lists))->first(fn($key) => str_starts_with($key, 'source-')) }}' }" id="dispatcher-board-root">
<div class="h-full p-1" x-data="{ activeTab: '{{ collect(array_keys($lists))->first(fn($key) => str_starts_with($key, 'source-')) }}' }" id="dispatcher-board-root">
<!-- 🌟 SPLIT HEADER -->
<div class="flex items-center justify-between border-b border-gray-200 dark:border-gray-700 pb-2 mb-4">
<div class="flex items-center justify-between border-b border-gray-200 dark:border-gray-600 py-2 mb-4">
<div class="flex-1 overflow-x-auto min-w-0">
<x-filament::tabs class="border-none p-0 m-0 flex items-center space-x-1">
<x-filament::tabs>
@foreach ($lists as $listId => $items)
@if (str_starts_with($listId, 'source-'))
<x-filament::tabs.item :alpine-active="'activeTab === \'' . $listId . '\''" x-on:click="activeTab = '{{ $listId }}'"
wire:key="tab-button-{{ $listId }}" class="cursor-pointer">
<div class="flex items-center space-x-1.5 leading-none">
<span class="uppercase">{{ str_replace('source-', 'S', $listId) }}</span>
<span class="uppercase">{{ str_replace('source-', '', $listId) }}</span>
<span
class="inline-flex items-center justify-center px-1 py-0.5 text-[10px] font-mono font-bold bg-primary-500/10 text-primary-600 dark:text-primary-400 rounded-md">
{{ count($items) }}
@@ -21,119 +21,90 @@
</x-filament::tabs>
</div>
<!-- RECHTE SEITE DES HEADERS: AKTIONEN -->
<div class="flex items-center space-x-2 pl-4 shrink-0" wire:key="modal-actions-right-side">
<div class="flex items-right space-x-2 pl-4 shrink-0" wire:key="modal-actions-right-side">
<!-- Copy-Button -->
<x-filament::button icon="heroicon-o-clipboard-document-list" size="md" tooltip="Copy"
x-on:click="$wire.resetBoard()" class="cursor-pointer" />
<!-- Calculate-Button -->
<x-filament::button icon="heroicon-o-calculator" size="md" tooltip="Calculate"
x-on:click="$wire.resetBoard()" class="cursor-pointer" />
<!-- Reset-Button -->
<x-filament::icon-button icon="heroicon-m-arrow-path" color="warning" size="md" label="Reset"
tooltip="Alle Elemente zurücksetzen"
@click.stop="
if (confirm('Möchten Sie wirklich alle Elemente in ihre Quell-Tabs zurücksetzen?')) {
// 💡 ALLE AKTIVEN SORTABLE-INSTANZEN IM BROWSER ZERSTÖREN, UM DEN CODELOCK ZU LÖSCHEN
document.querySelectorAll('.sortable-zone').forEach(el => {
if (el._sortableInstance) {
try {
el._sortableInstance.destroy();
el._sortableInstance = null;
} catch(err) {
// Ignoriert verwaiste Instanzen geräuschlos
}
}
});
// 💡 ERST JETZT DEN SERVER-RESET AUSFÜHREN
$wire.resetBoard();
}
"
class="cursor-pointer" />
<x-filament::button icon="heroicon-o-arrow-path" size="md" tooltip="Reset"
x-on:click="$wire.resetBoard()" class="cursor-pointer" />
<!-- Schließen-Button -->
<x-filament::icon-button icon="heroicon-m-x-mark" color="gray" size="md" label="Schließen"
x-on:click="close()" class="cursor-pointer" />
<x-filament::button icon="heroicon-o-x-mark" size="md" x-on:click="close()" tooltip="Close"
class="cursor-pointer" />
</div>
</div>
<!-- 🌟 SEKTION 1: SOURCES -->
<div>
<div class="text-xs font-bold uppercase tracking-wider text-primary-500 mb-3">Available Sources</div>
@foreach ($lists as $listId => $items)
@if (str_starts_with($listId, 'source-'))
<div x-show="activeTab === '{{ $listId }}'" class="transition-all"
wire:key="tab-panel-{{ $listId }}">
<x-filament::section compact>
<!-- Reiner HTML-Container mit Sortable-Klassenerkennung -->
<div id="{{ $listId }}"
class="sortable-zone space-y-2 border border-dashed border-gray-300 dark:border-gray-700 rounded-lg p-2 min-h-[120px]">
<div id="{{ $listId }}" class="sortable-zone grid grid-cols-5 gap-2 space-y-1 min-h-12">
@foreach ($items as $item)
<div data-id="{{ $item['id'] }}"
<x-filament::badge color="{{ $item['pcolor'] }}" data-id="{{ $item['id'] }}"
icon="phosphor-dots-six-vertical" icon-position="after"
wire:key="item-src-{{ $item['id'] }}-v-{{ $boardVersion }}"
class="bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-lg p-3 flex items-center justify-between shadow-sm cursor-grab active:cursor-grabbing">
<span
class="text-sm font-medium text-gray-900 dark:text-gray-100">{{ $item['name'] }}</span>
<svg class="h-4 w-4 text-gray-400 pointer-events-none" fill="none"
viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round"
d="M3.75 9h16.5m-16.5 6.75h16.5" />
</svg>
</div>
class="flex items-center justify-between shadow-sm cursor-grab active:cursor-grabbing">
<span class="text-sm font-medium text-gray-900 dark:text-gray-100">{{ $item['name'] }}
<div class="text-xs">{{ $item['info'] }}</div>
</span>
</x-filament::badge>
@endforeach
</div>
</x-filament::section>
</div>
@endif
@endforeach
</div>
<!-- 🌟 SEKTION 2: DESTINATIONS (21 BAYS) -->
<div>
<div class="text-xs font-bold uppercase tracking-wider text-success-500 mb-3">Target Destination Slots (21)
</div>
<div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-7 gap-3">
<div class="mt-7">
<div class="rounded-2xl grid grid-cols-7 grid-rows-5 p-5 gap-2 bg-cover bg-center bg-no-repeat aspect-7/5 max-w-4xl"
style="background-image: url({{ asset('images/soccerfield-middle.jpg') }});">
@foreach ($lists as $listId => $items)
@if (str_starts_with($listId, 'dest-'))
<div class="bg-gray-50 dark:bg-gray-800/40 border border-gray-200 dark:border-gray-700/50 rounded-xl p-3 flex flex-col min-h-[140px]"
<div class="rounded-xl flex flex-col bg-white/30 backdrop-blur-none drop-shadow-xl"
wire:key="box-{{ $listId }}">
<div class="flex items-center justify-between mb-2">
<span class="text-[11px] font-bold uppercase text-gray-500 dark:text-gray-400">Bay
{{ str_replace('dest-', '', $listId) }}</span>
<x-filament::badge color="success" size="xs">{{ count($items) }}</x-filament::badge>
<div class="font-bold text-md mx-auto">
{{-- {{ $destLabels[str_replace('dest-', '', $listId)] }} --}}
{{ array_shift($destLabels) }}
</div>
<!-- Reiner HTML-Container mit Sortable-Klassenerkennung -->
<div id="{{ $listId }}"
class="sortable-zone flex-1 space-y-1.5 border border-dashed border-gray-200 dark:border-gray-700 rounded-lg p-1.5 min-h-[80px]">
<div id="{{ $listId }}" class="sortable-zone flex-1 rounded-b-lg p-1">
@foreach ($items as $item)
<div data-id="{{ $item['id'] }}"
<x-filament::badge color="{{ $item['pcolor'] }}" data-id="{{ $item['id'] }}"
tooltip="{{ $item['info'] }}" icon="phosphor-dots-six-vertical"
icon-position="after"
wire:key="item-dst-{{ $item['id'] }}-v-{{ $boardVersion }}"
class="bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 text-xs rounded-md p-2 flex items-center justify-between gap-2 cursor-grab active:cursor-grabbing hover:border-danger-500 transition-all">
class="m-0 p-2 w-full h-full cursor-grab active:cursor-grabbing hover:border-danger-500 transition-all">
<span class="truncate font-medium text-gray-900 dark:text-gray-100 flex-1">
<div class=" font-medium text-gray-900 dark:text-gray-100 flex-1 text-wrap my-1">
{{ $item['name'] }}
</span>
</div>
<div class="flex items-center space-x-1 shrink-0">
<!-- Zuverlässiger, direkter Livewire-Löschcall -->
<button type="button"
title="Return to {{ str_replace('-', ' ', $item['origin']) }}"
wire:click="returnToOrigin('{{ $item['id'] }}', '{{ $listId }}')"
class="p-1 rounded text-gray-400 hover:text-danger-500 hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors cursor-pointer">
<svg class="h-3.5 w-3.5" fill="none" viewBox="0 0 24 24"
stroke-width="2.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round"
d="M6 18L18 6M6 6l12 12" />
</svg>
</button>
<svg class="h-3.5 w-3.5 text-gray-400 pointer-events-none" fill="none"
viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round"
d="M3.75 9h16.5m-16.5 6.75h16.5" />
</svg>
</div>
<div class=" flex flex-row gap-1 items-center justify-between">
<x-filament::icon-button icon="phosphor-x-circle" size="sm" color="gray"
wire:click="returnToOrigin('{{ $item['id'] }}', '{{ $listId }}')" />
{{ ucfirst(str_replace('source-', '', $item['origin'])) }}
</div>
</x-filament::badge>
@endforeach
</div>
</div>
@elseif (str_starts_with($listId, 'blind-'))
<div class=""></div>
@endif
@endforeach
</div>