@props(['service' => new \App\Models\Service()])

<div class="card border-0 shadow-none">
    <div class="card-header collapsible cursor-pointer rotate" data-bs-toggle="collapse" data-bs-target="#service_general">
        <div class="card-title">
            <h3>{{ __('A. General Information') }}</h3>
        </div>
        <div class="card-toolbar rotate-180">
            <i class="ki-duotone ki-down fs-1"></i>
        </div>
    </div>
    <div id="service_general" class="collapse show">
        <div class="card-body">

            <h4 class="card-subtitle">{{ __('Service Information') }}</h4>

            <div class="card-subbody">
                <!--begin::Row-->
                <div class="row mb-3">
                    <!--begin::Label-->
                    <label for="image" class="col-lg-3 col-form-label fw-semibold fs-6 required">{{ __('Image') }}</label>
                    <!--end::Label-->
                    <!--begin::Col-->
                    <div class="col-lg-8">
                        <!-- Dropzone Section (appears below the image) -->
                        <div class="dropzone dropzone-image" id="dzImage" style="margin-top: 5px;">
                            <!--begin::Message-->
                            <div class="dz-message needsclick">
                                <i class="ki-duotone ki-file-up fs-3x text-primary"><span class="path1"></span><span class="path2"></span></i>
                                <!--begin::Info-->
                                <div class="ms-4">
                                    <h3 class="fs-5 fw-bold text-gray-900 mb-1">Drop files here or click to
                                        upload.</h3>
                                    <span class="fs-7 fw-semibold text-gray-500">Upload file</span>
                                </div>
                                <!--end::Info-->
                            </div>
                            <!--end::Message-->
                        </div>
                        <p class="text-muted">(Support JPEG/JPG/PNG format only, with Maximum size of 2MB per image)</p>
                        <div id="image-container">
                            @php
                                $oldImages = old('image', []);
                                $storedImages =
                                    $application->services && $application->services->attachments ? $application->services->attachments->where('type', 'image')->pluck('path')->toArray() : [];
                                $imagePaths = array_unique(!empty($oldImages) ? $oldImages : $storedImages);
                            @endphp

                            @if (!empty($imagePaths))
                                @foreach ($imagePaths as $image)
                                    <input type="hidden" name="image[]" value="{{ $image }}" class="uploaded-image">
                                @endforeach
                            @endif
                        </div>
                        @error('image')
                            <span class="text-sm text-danger">
                                {{ $message }}
                            </span>
                        @enderror
                    </div>
                    <!--end::Col-->
                </div>
                <!--end::Row-->

                <!--begin::Row-->
                <div class="row mb-3">
                    <!--begin::Label-->
                    <label for="name" class="col-lg-3 col-form-label fw-semibold fs-6 required">{{ __('Service Name') }}</label>
                    <!--end::Label-->
                    <!--begin::Col-->
                    <div class="col-lg-8">
                        <textarea class="form-control form-control-sm" name="name" id="name" rows="3">{{ old('name', $service->name ?? '') }}</textarea>
                        @error('name')
                            <span class="text-sm text-danger">
                                {{ $message }}
                            </span>
                        @enderror
                    </div>
                    <!--end::Col-->
                </div>
                <!--end::Row-->

                <!--begin::Row-->
                <div class="row mb-3">
                    <!--begin::Label-->
                    <label for="provider_name" class="col-lg-3 col-form-label fw-semibold fs-6 required">{{ __('Service Provider Name') }}</label>
                    <!--end::Label-->
                    <!--begin::Col-->
                    <div class="col-lg-8">
                        <input type="text" class="form-control form-control-sm" name="provider_name" id="provider_name" value="{{ old('provider_name', $service->provider_name ?? '') }}">
                        @error('provider_name')
                            <span class="text-sm text-danger">
                                {{ $message }}
                            </span>
                        @enderror
                    </div>
                    <!--end::Col-->
                </div>
                <!--end::Row-->

                <!--begin::Row-->
                <div class="row mb-3">
                    <!--begin::Label-->
                    <label for="contact_website" class="col-lg-3 col-form-label fw-semibold fs-6 required">{{ __('Contact Website') }}</label>
                    <!--end::Label-->
                    <!--begin::Col-->
                    <div class="col-lg-8">
                        <input type="text" class="form-control form-control-sm" name="contact_website" id="contact_website" value="{{ old('contact_website', $service->contact_website ?? '') }}">
                        @error('contact_website')
                            <span class="text-sm text-danger">
                                {{ $message }}
                            </span>
                        @enderror
                    </div>
                    <!--end::Col-->
                </div>
                <!--end::Row-->

                <!--begin::Row-->
                <div class="row mb-3">
                    <!--begin::Label-->
                    <label for="description" class="col-lg-3 col-form-label fw-semibold fs-6 required">{{ __('Service Desription') }}</label>
                    <!--end::Label-->
                    <!--begin::Col-->
                    <div class="col-lg-8">
                        <textarea class="form-control form-control-sm" name="description" id="description" placeholder="Doing cleaning comprehensive cleaning service." rows="3">{{ old('description', $service->description ?? '') }}</textarea>
                        @error('description')
                            <span class="text-sm text-danger">
                                {{ $message }}
                            </span>
                        @enderror
                    </div>
                    <!--end::Col-->
                </div>
                <!--end::Row-->

                <!--begin::Row-->
                <div class="row mb-3">
                    <!--begin::Label-->
                    <label for="type" class="col-lg-3 col-form-label fw-semibold fs-6 required">{{ __('Service Type') }}</label>
                    <!--end::Label-->
                    <!--begin::Col-->
                    <div class="col-lg-8">
                        @foreach (\App\Models\Service::TYPE as $key => $label)
                            <div class="form-check form-check-custom form-check-xs form-check-success mb-2">
                                <input class="form-check-input" type="checkbox" name="type[]" id="type_{{ $key }}" value="{{ $key }}"
                                    {{ in_array($key, old('type', $service->type ?? [])) ? 'checked' : '' }}>
                                <label class="form-check-label" for="type_{{ $key }}">{{ $label }}</label>
                            </div>
                        @endforeach
                    </div>
                    <!--end::Col-->
                </div>
                <!--end::Row-->

                <!--begin::Row-->
                <div class="row mb-3">
                    <!--begin::Label-->
                    <label for="service_brochure" class="col-lg-3 col-form-label fw-semibold fs-6 required">{{ __('Service Brochure') }}</label>
                    <!--end::Label-->
                    <!--begin::Col-->
                    <div class="col-lg-8">
                        <!-- Dropzone Section (appears below the service_brochure) -->
                        <div class="dropzone dropzone-file" id="dzServiceBrochure" style="margin-top: 5px;">
                            <!--begin::Message-->
                            <div class="dz-message needsclick">
                                <button type="button" class="btn btn-sm btn-secondary">Choose File</button>
                                <span class="align-self-center text-muted ms-2">No file selected</span>
                            </div>
                            <!--end::Message-->
                        </div>
                        <p class="text-muted">(Support PDF format only with max size of 10MB)</p>
                        <input type="hidden" name="service_brochure" id="service_brochure" value="{{ old('service_brochure', $service_brochure->path ?? '') }}">
                        @error('service_brochure')
                            <span class="text-sm text-danger">
                                {{ $message }}
                            </span>
                        @enderror
                    </div>
                    <!--end::Col-->
                </div>
                <!--end::Row-->

                <!--begin::Row-->
                <div class="row mb-3">
                    <!--begin::Label-->
                    <label for="bumiputera" class="col-lg-3 col-form-label fw-semibold fs-6 required">{{ __('Bumiputera
                                            Status') }}</label>
                    <!--end::Label-->
                    <!--begin::Col-->
                    <div class="col-lg-8 mt-3">
                        <div class="form-check form-check-xs form-check-success form-check-inline">
                            <input class="form-check-input" type="radio" name="bumiputera" id="bumiputera_yes" value="1"
                                {{ old('bumiputera', $service->bumiputera ?? '') == '1' ? 'checked' : '' }}>
                            <label class="form-check-label" for="bumiputera_yes">Yes</label>
                        </div>

                        <div class="form-check form-check-xs form-check-success form-check-inline">
                            <input class="form-check-input" type="radio" name="bumiputera" id="bumiputera_no" value="0"
                                {{ old('bumiputera', $service->bumiputera ?? '') == '0' ? 'checked' : '' }}>
                            <label class="form-check-label" for="bumiputera_no">No</label>
                        </div>
                        @error('bumiputera')
                            <span class="text-sm text-danger">
                                {{ $message }}
                            </span>
                        @enderror
                    </div>
                    <!--end::Col-->
                </div>
                <!--end::Row-->

                <!--begin::Row-->
                <div class="row mb-3">
                    <!--begin::Label-->
                    <label for="register_with_e_perolehan" class="col-lg-3 col-form-label fw-semibold fs-6 required">{{ __('Registered With E-perolehan') }}</label>
                    <!--end::Label-->
                    <!--begin::Col-->
                    <div class="col-lg-8 mt-3">
                        <div class="form-check form-check-xs form-check-success form-check-inline">
                            <input class="form-check-input" type="radio" name="register_with_e_perolehan" id="register_with_e_perolehan_yes" value="1"
                                {{ old('register_with_e_perolehan', $service->register_with_e_perolehan ?? '') == '1' ? 'checked' : '' }}>
                            <label class="form-check-label" for="register_with_e_perolehan_yes">Yes</label>
                        </div>

                        <div class="form-check form-check-xs form-check-success form-check-inline">
                            <input class="form-check-input" type="radio" name="register_with_e_perolehan" id="register_with_e_perolehan_no" value="0"
                                {{ old('register_with_e_perolehan', $service->register_with_e_perolehan ?? '') == '0' ? 'checked' : '' }}>
                            <label class="form-check-label" for="register_with_e_perolehan_no">No</label>
                        </div>
                        @error('register_with_e_perolehan')
                            <span class="text-sm text-danger">
                                {{ $message }}
                            </span>
                        @enderror
                    </div>
                    <!--end::Col-->
                </div>
                <!--end::Row-->
            </div>
        </div>
    </div>
</div>