@extends('layouts.dashboard')
@section('title','Update PJU | Monitoring Kelurahan')

@section('dashboard_content')
<div class="container-fluid container-fluid-spacing">
    <div class="content-header">
        <div class="row">
            <div class="col-sm-6">
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="{{url('/rt/home')}}"><i class="fas fa-home mr-1"></i>
                                Home</a>
                        </li>
                        <li class="breadcrumb-item active">PJU</li>
                        <li class="breadcrumb-item active">Edit</li>
                    </ol>
                </nav>
            </div>
        </div>
    </div>

    <div class="content-body mt-3">
        <div class="col-md-8">
            <div class="col-12 mb-2">
                <a href="#" data-uri="{{route('rt.pju.destroy', $pju->pju_id)}}" class="badge badge-danger"
                    data-toggle="modal" data-target="#confirmDeleteModal"><i class="fas fa-trash-alt"></i> Hapus
                    Data</a>
            </div>
            <form action="{{route('rt.pju.update', $pju->pju_id)}}" method="post" enctype="multipart/form-data">
                @csrf
                @method('patch')
                <div class="form-group">
                    <label for="pju_type">Tipe PJU:</label>
                    <select id="pju_type" name="pju_type"
                        class="form-control select2Edit @error('pju_type') is-invalid @enderror"
                        value="{{old('pju_type')}}" data-placeholder="Pilih Tipe PJU"
                        style="display: block !important; width: 100% !important;" required>
                        <option value=""></option>
                        <option value="1">Lampu Satu</option>
                        <option value="2">Lampu Dua</option>
                    </select>
                    @error('pju_type') <div class="invalid-feedback">{{$message}}</div> @enderror
                </div>
                <div class="form-group">
                    <label for="pju_status">Keterangan PJU:</label>
                    <select id="pju_status" name="pju_status"
                        class="form-control select2Edit @error('pju_status') is-invalid @enderror"
                        value="{{old('pju_status')}}" data-placeholder="Pilih Keterangan PJU"
                        style="display: block !important; width: 100% !important;" required>
                        <option value=""></option>
                        <option value="Available">Tersedia</option>
                        <option value="Repairing">Dalam Perbaikan</option>
                        <option value="Planning">Direncanakan</option>
                    </select>
                    @error('pju_status') <div class="invalid-feedback">{{$message}}</div> @enderror
                </div>

                <div id="mapRt" class="mb-5" style="height: 400px;"></div>

                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="pju_latitude">Latitude:</label>
                            <input id="pju_latitude" type="text"
                                class="form-control @error('pju_latitude') is-invalid @enderror"
                                placeholder="Latitude PJU" name="pju_latitude" value="{{$pju->pju_latitude}}" required>
                            @error('pju_latitude') <div class="invalid-feedback">{{$message}}</div> @enderror
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="pju_longitude">Longitude:</label>
                            <input id="pju_longitude" type="text"
                                class="form-control @error('pju_longitude') is-invalid @enderror"
                                placeholder="Longitude PJU" name="pju_longitude" value="{{$pju->pju_longitude}}"
                                required>
                            @error('pju_longitude') <div class="invalid-feedback">{{$message}}</div> @enderror
                        </div>
                    </div>
                </div>

                <div class="form-group">
                    <label for="upload_photo">Foto Penerangan Lampu Jalan:</label>
                    <div class="preview-zone hidden">
                        <div class="box box-solid">
                            <div class="box-header with-border">
                                <div><b>Preview</b></div>
                                <div class="box-tools pull-right">
                                    <button type="button" class="btn btn-danger btn-xs remove-preview">
                                        <i class="fa fa-times"></i> Hapus Foto
                                    </button>
                                </div>
                            </div>
                            <div class="box-body"></div>
                        </div>
                    </div>
                    <div class="dropzone-wrapper">
                        <div class="dropzone-desc">
                            <i class="fa fa-upload"></i>
                            <p>Choose an image file or drag it here.</p>
                        </div>
                        <input id="upload_photo" type="file" accept="image/*" name="pju_foto" class="dropzone" required>
                        @error('pju_foto') <div class="invalid-feedback">{{$message}}</div> @enderror
                    </div>
                </div>

                <button type="submit" class="btn btn-primary float-right">Submit</button>
            </form>
        </div>
    </div>
</div>

@endsection
@section('jsExternalAdd')
@include('layouts.mapsJS.pjuJS')
@endsection