@extends('layouts.dashboard')
@section('title','Update Saluran Tertutup | 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">Saluran Tertutup</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.salurantertutup.destroy', $salurantertutup->saluran_tertutup_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.salurantertutup.update', $salurantertutup->saluran_tertutup_id)}}" method="post"
                enctype="multipart/form-data">
                @csrf
                @method('patch')
                <div class="form-group">
                    <label for="saluran_tertutup_status">Keterangan Saluran Tertutup:</label>
                    <select id="saluran_tertutup_status" name="saluran_tertutup_status"
                        class="form-control select2Edit @error('saluran_tertutup_status') is-invalid @enderror"
                        value="{{old('saluran_tertutup_status')}}"
                        oninvalid="this.setCustomValidity('Masukkan Keterangan Saluran Tertutup disini')"
                        oninput="this.setCustomValidity('')" data-placeholder="Pilih Keterangan Saluran Tertutup"
                        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('saluran_tertutup_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="saluran_tertutup_latitude">Latitude:</label>
                            <input id="saluran_tertutup_latitude" type="text"
                                class="form-control @error('saluran_tertutup_latitude') is-invalid @enderror"
                                placeholder="Latitude Saluran Tertutup" name="saluran_tertutup_latitude"
                                value="{{$salurantertutup->saluran_tertutup_latitude}}"
                                oninvalid="this.setCustomValidity('Masukkan latitude disini')"
                                oninput="this.setCustomValidity('')" required>
                            @error('saluran_tertutup_latitude') <div class="invalid-feedback">{{$message}}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="saluran_tertutup_longitude">Longitude:</label>
                            <input id="saluran_tertutup_longitude" type="text"
                                class="form-control @error('saluran_tertutup_longitude') is-invalid @enderror"
                                placeholder="Longitude Saluran Tertutup" name="saluran_tertutup_longitude"
                                value="{{$salurantertutup->saluran_tertutup_longitude}}"
                                oninvalid="this.setCustomValidity('Masukkan longitude disini')"
                                oninput="this.setCustomValidity('')" required>
                            @error('saluran_tertutup_longitude') <div class="invalid-feedback">{{$message}}</div>
                            @enderror
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <label for="upload_photo">Foto Saluran Tertutup:</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="saluran_tertutup_foto" class="dropzone" required>
                        @error('saluran_tertutup_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.saluranTertutupJS')
@endsection