fix(master-land): create func js get regency and get district
This commit is contained in:
parent
3f39f5c536
commit
f8d8165492
|
@ -0,0 +1,23 @@
|
|||
<?php
|
||||
|
||||
namespace App\Http\Controllers;
|
||||
|
||||
use App\Models\District;
|
||||
use App\Models\Regency;
|
||||
use Dflydev\DotAccessData\Data;
|
||||
use Illuminate\Http\Request;
|
||||
|
||||
class LocationController extends Controller
|
||||
{
|
||||
public function getRegencies($provinceId)
|
||||
{
|
||||
$regencies = Regency::where('province_id', $provinceId)->get();
|
||||
return response()->json(['success' => true, 'data' => $regencies]);
|
||||
}
|
||||
|
||||
public function getDistricts($regencyId)
|
||||
{
|
||||
$distircts = District::where('regency_id', $regencyId)->get();
|
||||
return response()->json(['success' => true, 'data' => $distircts]);
|
||||
}
|
||||
}
|
|
@ -4,6 +4,7 @@
|
|||
|
||||
use App\Http\Controllers\Controller;
|
||||
use App\Models\Land;
|
||||
use App\Models\Province;
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\Support\Facades\Validator;
|
||||
|
||||
|
@ -12,7 +13,8 @@ class LandController extends Controller
|
|||
public function index()
|
||||
{
|
||||
$lands = Land::orderBy('created_at', 'desc')->get();
|
||||
return view('master-data.lahan.index', compact('lands'));
|
||||
$provinces = Province::all();
|
||||
return view('master-data.lahan.index', compact('lands', 'provinces'));
|
||||
}
|
||||
|
||||
public function store(Request $request)
|
||||
|
|
|
@ -0,0 +1,14 @@
|
|||
<?php
|
||||
|
||||
namespace App\Models;
|
||||
|
||||
use Illuminate\Database\Eloquent\Factories\HasFactory;
|
||||
use Illuminate\Database\Eloquent\Model;
|
||||
|
||||
class District extends Model
|
||||
{
|
||||
use HasFactory;
|
||||
|
||||
protected $table = 'districts';
|
||||
protected $guarded = [];
|
||||
}
|
|
@ -1,3 +1,150 @@
|
|||
var map;
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
// Initialize the first map
|
||||
map = L.map("map", {
|
||||
attributionControl: false,
|
||||
}).setView([-8.157416852745705, 113.72281580436439], 16);
|
||||
|
||||
// Add tile layers to both maps
|
||||
L.tileLayer("https://tile.openstreetmap.org/{z}/{x}/{y}.png", {
|
||||
maxZoom: 19,
|
||||
}).addTo(map);
|
||||
|
||||
$("#showModal").on("shown.bs.modal", function () {
|
||||
map.invalidateSize();
|
||||
});
|
||||
});
|
||||
|
||||
var form = document.getElementById("add-form");
|
||||
var provinceField = form.querySelector("#province-field");
|
||||
var provinceVal = new Choices(provinceField);
|
||||
|
||||
var regencyContainer = form.querySelector("#regency-container");
|
||||
var regencyField = form.querySelector("#regency-field");
|
||||
var regencyVal = new Choices(regencyField, {
|
||||
shouldSort: false,
|
||||
});
|
||||
|
||||
var districtContainer = form.querySelector("#district-container");
|
||||
var districtField = form.querySelector("#district-field");
|
||||
var districtVal = new Choices(districtField, {
|
||||
shouldSort: false,
|
||||
});
|
||||
|
||||
var mapContainer = form.querySelector("#map-container");
|
||||
|
||||
var loading = form.querySelector("#loading");
|
||||
|
||||
function getRegencies(provinceId) {
|
||||
regencyContainer.style.display = "none";
|
||||
districtContainer.style.display = "none";
|
||||
loading.style.display = "block";
|
||||
mapContainer.style.display = "none";
|
||||
|
||||
const url = "/location/get-regency/" + provinceId;
|
||||
$.ajax({
|
||||
url: url,
|
||||
type: "GET",
|
||||
success: function (response) {
|
||||
if (response.success) {
|
||||
loading.style.display = "none";
|
||||
const data = response.data;
|
||||
|
||||
regencyVal.clearStore();
|
||||
regencyVal.clearChoices();
|
||||
|
||||
regencyVal.value = "";
|
||||
regencyVal.setChoices([
|
||||
{
|
||||
value: "",
|
||||
label: "Pilih Kabupaten",
|
||||
selected: true,
|
||||
disabled: true,
|
||||
},
|
||||
]);
|
||||
|
||||
if (Array.isArray(data)) {
|
||||
regencyVal.setChoices(
|
||||
data.map((regency) => ({
|
||||
value: regency.id,
|
||||
label: regency.name,
|
||||
selected: false,
|
||||
disabled: false,
|
||||
}))
|
||||
);
|
||||
regencyContainer.style.display = "block";
|
||||
} else {
|
||||
mapContainer.style.display = "block";
|
||||
mapContainer.innerHTML =
|
||||
"<p class='text-center text-muted'>Terjadi kesalaahan saat mengambil data, silahkan coba beberapa saat lagi</p>";
|
||||
}
|
||||
}
|
||||
},
|
||||
error: function (xhr, status, error) {
|
||||
mapContainer.style.display = "block";
|
||||
mapContainer.innerHTML =
|
||||
"<p class='text-center text-muted'>Terjadi kesalaahan saat mengambil data, silahkan coba beberapa saat lagi</p>";
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function showmap(districtId) {
|
||||
mapContainer.style.display = "block";
|
||||
map.invalidateSize();
|
||||
}
|
||||
|
||||
function getDistricts(regencyId) {
|
||||
districtContainer.style.display = "none";
|
||||
loading.style.display = "block";
|
||||
mapContainer.style.display = "none";
|
||||
|
||||
const url = "/location/get-district/" + regencyId;
|
||||
$.ajax({
|
||||
url: url,
|
||||
type: "GET",
|
||||
success: function (response) {
|
||||
if (response.success) {
|
||||
loading.style.display = "none";
|
||||
const data = response.data;
|
||||
|
||||
districtVal.clearStore();
|
||||
districtVal.clearChoices();
|
||||
|
||||
districtVal.value = "";
|
||||
districtVal.setChoices([
|
||||
{
|
||||
value: "",
|
||||
label: "Pilih Kecamatan",
|
||||
selected: true,
|
||||
disabled: true,
|
||||
},
|
||||
]);
|
||||
|
||||
if (Array.isArray(data)) {
|
||||
districtVal.setChoices(
|
||||
data.map((district) => ({
|
||||
value: district.id,
|
||||
label: district.name,
|
||||
selected: false,
|
||||
disabled: false,
|
||||
}))
|
||||
);
|
||||
districtContainer.style.display = "block";
|
||||
} else {
|
||||
mapContainer.style.display = "block";
|
||||
mapContainer.innerHTML =
|
||||
"<p class='text-center text-muted'>Terjadi kesalaahan saat mengambil data, silahkan coba beberapa saat lagi</p>";
|
||||
}
|
||||
}
|
||||
},
|
||||
error: function (xhr, status, error) {
|
||||
mapContainer.style.display = "block";
|
||||
mapContainer.innerHTML =
|
||||
"<p class='text-center text-muted'>Terjadi kesalaahan saat mengambil data, silahkan coba beberapa saat lagi</p>";
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function updateData(land) {
|
||||
var form = document.getElementById("edit-form");
|
||||
var landName = document.getElementById("landname-edit-field");
|
||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -21,7 +21,7 @@
|
|||
<link href="assets/css/app.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- custom Css-->
|
||||
<link href="assets/css/custom.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
@stack('other-css')
|
||||
|
||||
</head>
|
||||
|
||||
|
@ -605,6 +605,7 @@ class="form-check-input">
|
|||
|
||||
<!-- App js -->
|
||||
<script src="assets/js/app.js"></script>
|
||||
<script src="assets/libs/jquery/jquery.min.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
|
@ -1,6 +1,17 @@
|
|||
@extends('layouts.app')
|
||||
@push('title', 'Data Tanah')
|
||||
@section('content')
|
||||
@push('other-css')
|
||||
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
|
||||
integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin="" />
|
||||
|
||||
<style>
|
||||
#map {
|
||||
height: 200px;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
@endpush
|
||||
<div class="page-content">
|
||||
<div class="container-fluid">
|
||||
|
||||
|
@ -167,23 +178,28 @@ class="fw-medium link-primary">#VZ2101</a></td>
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="rentalstart-field" class="form-label">Mulai Dari</label>
|
||||
<input type="date" id="rentalstart-field" class="form-control"
|
||||
name="rental_start" value="{{ old('rental_start') }}"
|
||||
placeholder="Masukan Tanggal Mulai" required />
|
||||
<div class="invalid-feedback">
|
||||
Masukan Tanggal Mulai
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="mb-3">
|
||||
<label for="rentalstart-field" class="form-label">Mulai Dari</label>
|
||||
<input type="date" id="rentalstart-field" class="form-control"
|
||||
name="rental_start" value="{{ old('rental_start') }}"
|
||||
placeholder="Masukan Tanggal Mulai" required />
|
||||
<div class="invalid-feedback">
|
||||
Masukan Tanggal Mulai
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="rentaluntil-field" class="form-label">Sampai</label>
|
||||
<input type="date" id="rentaluntil-field" class="form-control"
|
||||
name="rental_until" value="{{ old('rental_start') }}"
|
||||
placeholder="Masukan Tanggal Sampai" required />
|
||||
<div class="invalid-feedback">
|
||||
Masukan Tanggal Sampai
|
||||
<div class="col-md-6">
|
||||
<div class="mb-3">
|
||||
<label for="rentaluntil-field" class="form-label">Sampai</label>
|
||||
<input type="date" id="rentaluntil-field" class="form-control"
|
||||
name="rental_until" value="{{ old('rental_start') }}"
|
||||
placeholder="Masukan Tanggal Sampai" required />
|
||||
<div class="invalid-feedback">
|
||||
Masukan Tanggal Sampai
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -198,17 +214,24 @@ class="fw-medium link-primary">#VZ2101</a></td>
|
|||
|
||||
<div class="mb-3">
|
||||
<label for="province-field" class="form-label">Provinsi</label>
|
||||
<select name="province_id" id="province-field" class="form-control" required>
|
||||
<select name="province_id" id="province-field" class="form-control" required
|
||||
onchange="getRegencies(this.value)">
|
||||
<option value="" selected disabled>Pilih Provinsi</option>
|
||||
@foreach ($provinces as $province)
|
||||
<option value="{{ $province->id }}"
|
||||
{{ old('province_id') == $province->id ? 'selected' : '' }}>
|
||||
{{ $province->name }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
<div class="invalid-feedback">
|
||||
Harap Pilih Provinsi
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<div class="mb-3" id="regency-container" style="display: none">
|
||||
<label for="regency-field" class="form-label">Kabupaten atau Kota</label>
|
||||
<select name="regency_id" id="regency-field" class="form-control" required>
|
||||
<select name="regency_id" id="regency-field" class="form-control" required
|
||||
onchange="getDistricts(this.value)">
|
||||
<option value="" selected disabled>Pilih Kabupaten atau Kota</option>
|
||||
</select>
|
||||
<div class="invalid-feedback">
|
||||
|
@ -216,9 +239,10 @@ class="fw-medium link-primary">#VZ2101</a></td>
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<div class="mb-3" id="district-container" style="display: none">
|
||||
<label for="district-field" class="form-label">Kecamatan</label>
|
||||
<select name="district_id" id="district-field" class="form-control" required>
|
||||
<select name="district_id" id="district-field" class="form-control" required
|
||||
onchange="showmap(this.value)">
|
||||
<option value="" selected disabled>Pilih Kecamatan</option>
|
||||
</select>
|
||||
<div class="invalid-feedback">
|
||||
|
@ -226,14 +250,15 @@ class="fw-medium link-primary">#VZ2101</a></td>
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="status-field" class="form-label">Deskripsi</label>
|
||||
<textarea name="description" id="status-field" rows="5" placeholder="Masukan Deskripsi" class="form-control"
|
||||
required>{{ old('description') }}</textarea>
|
||||
<div class="invalid-feedback">
|
||||
Masukan Deskripsi
|
||||
<div id="loading" class="text-center" style="display: none">
|
||||
<div class="spinner-border text-primary" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="map-container" style="display: none">
|
||||
<div id="map"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<div class="hstack gap-2 justify-content-end">
|
||||
|
@ -338,5 +363,9 @@ class="form-control" required>{{ old('description') }}</textarea>
|
|||
<script src="assets/js/pages/customJs/master-data/lahan/index.js"></script>
|
||||
|
||||
<script src="assets/js/pages/form-validation.init.js"></script>
|
||||
|
||||
<!-- Make sure you put this AFTER Leaflet's CSS -->
|
||||
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"
|
||||
integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script>
|
||||
@endpush
|
||||
@endsection
|
||||
|
|
|
@ -7,6 +7,7 @@
|
|||
use App\Http\Controllers\Auth\RegisteredUserController;
|
||||
use App\Http\Controllers\Auth\TwoStepVerifyController;
|
||||
use App\Http\Controllers\DashboardController;
|
||||
use App\Http\Controllers\LocationController;
|
||||
use App\Http\Controllers\MasterData\IndicatorController;
|
||||
use App\Http\Controllers\MasterData\LandController;
|
||||
use App\Http\Controllers\MasterData\RuleController;
|
||||
|
@ -59,6 +60,11 @@
|
|||
Route::middleware(['auth', 'verifiedAcount'])->group(function () {
|
||||
Route::post('/logout', [AuthenticatedSessionController::class, 'destroy'])->name('auth.logout');
|
||||
|
||||
Route::prefix('location')->controller(LocationController::class)->name('location.')->group(function () {
|
||||
Route::get('/get-regency/{id}', 'getRegencies')->name('get_regencies');
|
||||
Route::get('/get-district/{id}', 'getDistricts')->name('get_districts');
|
||||
});
|
||||
|
||||
Route::middleware('admin')->group(function () {
|
||||
Route::get('/dashboard-admin', [DashboardController::class, 'admin'])->name('dashboard.admin');
|
||||
|
||||
|
|
Loading…
Reference in New Issue