use App\Models\Talep;
use Illuminate\Support\Facades\Storage;
use Livewire\Component;
use Livewire\WithFileUploads;

class TalepBelgeleri extends Component
{
    use WithFileUploads;

    public Talep $talep;

    /** @var array<int, \Livewire\Features\SupportFileUploads\TemporaryUploadedFile> */
    public array $belgeler = [];

    /** @var array<int, int> Kaydedince silinecek kayıtlı belgeler */
    public array $silinecekler = [];

    protected function rules(): array
    {
        return [
            // Toplam 5 belge: kayıtlılar sayılır, silinecekler sayılmaz.
            'belgeler' => ['array', 'max:'.max(0, 5 - $this->kayitlilar()->count())],
            'belgeler.*' => ['file', 'mimes:pdf,jpg,png', 'max:2048'],
        ];
    }

    public function updatedBelgeler(): void
    {
        $this->validate(['belgeler.*' => $this->rules()['belgeler.*']]);
    }

    public function kayitliBelgeyiKaldir(int $id): void
    {
        $this->silinecekler[] = $id;
    }

    public function kaydet(): void
    {
        $this->validate();

        $this->talep->belgeler()->whereKey($this->silinecekler)->get()->each->delete();

        foreach ($this->belgeler as $belge) {
            $this->talep->belgeler()->create([
                'ad' => $belge->getClientOriginalName(),
                'yol' => $belge->store('talepler/'.$this->talep->id, 'public'),
                'boyut' => $belge->getSize(),
            ]);
        }

        $this->reset('belgeler', 'silinecekler');
    }

    private function kayitlilar()
    {
        return $this->talep->belgeler()->whereKeyNot($this->silinecekler);
    }

    public function render()
    {
        return view('livewire.talep-belgeleri', [
            'kayitliBelgeler' => $this->kayitlilar()->get()->map(fn ($belge) => [
                'id' => $belge->id,
                'name' => $belge->ad,
                'url' => Storage::disk('public')->url($belge->yol),
                'size' => $belge->boyut,
            ]),
        ]);
    }
}

public function fotograflariSirala(array $sira): void
{
    foreach ($sira as $konum => $oge) {
        if ($oge['type'] === 'existing') {
            $this->urun->fotograflar()->whereKey($oge['id'])->update(['sira' => $konum]);
        }
    }

    // Geçici yüklemeler de aynı sıraya (id = getFilename()).
    $yuklemeSirasi = collect($sira)->where('type', 'upload')->pluck('id')->flip();

    $this->fotograflar = collect($this->fotograflar)
        ->sortBy(fn ($foto) => $yuklemeSirasi[$foto->getFilename()] ?? PHP_INT_MAX)
        ->values()
        ->all();
}

public function update(Request $request, Talep $talep): RedirectResponse
{
    $kaldirilan = $request->input('kaldirilan_ekler', []);
    $kalan = 5 - $talep->ekler()->whereKeyNot($kaldirilan)->count();

    $request->validate([
        'ekler' => ['array', 'max:'.max(0, $kalan)],
        'ekler.*' => ['file', 'mimes:pdf,jpg,png', 'max:2048'],
        'kaldirilan_ekler' => ['array'],
        'kaldirilan_ekler.*' => ['integer'],
    ]);

    $talep->ekler()->whereKey($kaldirilan)->get()->each->delete();

    foreach ($request->file('ekler', []) as $ek) {
        $talep->ekler()->create([
            'ad' => $ek->getClientOriginalName(),
            'yol' => $ek->store('talepler/'.$talep->id),
            'boyut' => $ek->getSize(),
        ]);
    }

    return back();
}

<acun:file-upload model="belgeler" multiple />

<div class="mt-4 flex justify-end gap-2">
    <acun:button variant="white" x-data x-on:click="$dispatch('file-upload-reset', { model: 'belgeler' })">Vazgeç</acun:button>
    <acun:button wire:click="kaydet" wire:loading.attr="disabled" wire:target="belgeler,kaydet">Kaydet</acun:button>
</div>

import { registerFileUpload } from '@acunsoft/acun-ui-pro';

document.addEventListener('alpine:init', () => {
    registerFileUpload(window.Alpine, {
        transport: {
            concurrency: 3,
            upload(file, { onProgress }) {
                const request = new XMLHttpRequest();
                const promise = new Promise((resolve, reject) => {
                    request.upload.onprogress = (event) => onProgress((event.loaded / event.total) * 100);
                    request.onload = () => (request.status < 300 ? resolve(JSON.parse(request.response).id) : reject(new Error('failed')));
                    request.onerror = () => reject(new Error('failed'));
                    request.onabort = () => reject(Object.assign(new Error('cancelled'), { cancelled: true }));
                });
                const body = new FormData();
                body.append('file', file);
                request.open('POST', '/yuklemeler');
                request.setRequestHeader('X-CSRF-TOKEN', document.querySelector('meta[name=csrf-token]').content);
                request.send(body);

                return { promise, cancel: () => request.abort() };
            },
        },
    });
});