lpj/resources/views/permohonan/authorization/show.blade.php

@extends('layouts.main')

@section('breadcrumbs')
    {{ Breadcrumbs::render(request()->route()->getName()) }}
@endsection

@section('content')
    <div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
        @include('lpj::component.detail-jaminan',['backLink' => 'authorization.index'])

        <div class="card">
            <form action="{{ route('authorization.update', $permohonan->id) }}" method="POST" id="authorizationForm" enctype="multipart/form-data">
                <input type="hidden" name="_method" value="PUT">
                @csrf
                <div class="card-body lg:py-7.5">
                    <div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                        <label class="form-label max-w-56">
                            Catatan
                        </label>
                        <div class="flex flex-wrap items-baseline w-full">
                            <textarea class="textarea" rows="3" type="number" id="keterangan" name="keterangan"></textarea>
                            <em class="alert text-danger text-sm" id="keterangan-message"></em>
                        </div>
                    </div>
                    <div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5 mt-2" id="fileUploadSection">
                        <label class="form-label max-w-56">
                            Upload File Revisi
                        </label>
                        <div class="flex flex-wrap items-baseline w-full">
                            <input type="file" class="file-input" id="revisionFile" name="attachment">
                            <em class="alert text-danger text-sm hidden" id="file-message"></em>
                        </div>
                    </div>
                </div>
                <div class="card-footer flex justify-end">
                    <button type="submit" name="status" value="preregister" class="btn btn-success">
                        Approve
                    </button>
                    <button type="submit" name="status" value="revisi" id="revisi" class="btn btn-warning ml-3">
                        Revisi
                    </button>
                </div>
            </form>
        </div>
    </div>
@endsection

@push('scripts')
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            const form = document.getElementById('authorizationForm');
            const keterangan = document.getElementById('keterangan');
            const revisiBtn = document.getElementById('revisi');
            const keteranganMessage = document.getElementById('keterangan-message');

            const revisionFile = document.getElementById('revisionFile');
            const fileMessage = document.getElementById('file-message');


            form.addEventListener('submit', function(event) {
                if (event.submitter === revisiBtn && keterangan.value.trim() === '') {
                    event.preventDefault();
                    keteranganMessage.textContent = 'Catatan harus diisi.';
                } else {
                    keteranganMessage.textContent = '';
                }

                if (event.submitter === revisiBtn && !revisionFile.files.length) {
                    event.preventDefault();
                    fileMessage.textContent = 'File revisi harus diunggah.';
                    fileMessage.classList.remove('hidden');
                } else {
                    fileMessage.classList.add('hidden');
                }
            });

            // Add event listener for typing in keterangan textarea
            keterangan.addEventListener('input', function() {
                keteranganMessage.classList.add('hidden');
            });

            // Add event listener for file selection
            revisionFile.addEventListener('change', function() {
                fileMessage.classList.add('hidden');
            });
        });
    </script>
@endpush