Files
mylesen/resources/views/penjaja/ori_onemap-mohon.blade.php

828 lines
43 KiB
PHP

@extends('layouts.appmin')
@section('tajuk')
Permohonan Lesen Penjaja
@endsection
@section('css')
<!-- Select2 -->
<link rel="stylesheet" href="{{ asset('plugins/select2/css/select2.min.css') }}">
<link rel="stylesheet" href="{{ asset('plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css') }}">
<link href="{{ asset('css/jsapi-template-main.css') }}" rel="stylesheet" type="text/css"/>
<link href="https://js.arcgis.com/4.25/esri/css/main.css" rel="stylesheet" type="text/css" />
<style>
#viewDiv {
padding: 0;
margin: 0;
height: 50vh;
width: 100%;
touch-action: none;
}
</style>
@endsection
@section('breadcrumb')
<ul class="breadcrumbs mb-3">
<li class="nav-home">
<a href="#">
<i class="icon-home"></i>
</a>
</li>
<li class="separator">
<i class="icon-arrow-right"></i>
</li>
<li class="nav-item">
<a href="#">Penjaja</a>
</li>
<li class="separator">
<i class="icon-arrow-right"></i>
</li>
<li class="nav-item">
<a href="#">Permohonan Baru</a>
</li>
</ul>
@endsection
@section('content')
@if (session('success'))
<div class="alert alert-success" role="alert">
{{ session('success') }}
</div>
@endif
<form action="{{route('penjaja-simpan_mohon')}}" method="post" enctype="multipart/form-data">
@csrf
<input type="hidden" name="pemohon_id" value="{{$user->id}}">
<input type="hidden" name="mohon_id" value="{{$permohonan?->id}}">
<div class="row mt-4">
<div class="col-sm-12 col-lg-6">
<div class="card mb-3">
<div class="card-header">
<h3 class="card-title">MAKLUMAT PERIBADI PEMOHON</h3>
</div> <!-- /.card-header -->
<div class="card-body">
<dl class="row">
<dt class="col-sm-3 col-md-2">No KP</dt>
<dd class="col-sm-9 col-md-10">{{ old('nokp', $user->nokp) }}</dd>
<dt class="col-sm-3 col-md-2">Nama</dt>
<dd class="col-sm-9 col-md-10">{{ old('name', $user->name) }}</dd>
<dt class="col-sm-3 col-md-2">Email</dt>
<dd class="col-sm-3 col-md-4">{{ old('email', $user->email) }}</dd>
<dt class="col-sm-3 col-md-2">No Telefon</dt>
<dd class="col-sm-3 col-md-4">{{ old('notelefon', $user->notelefon) }}</dd>
<dt class="col-sm-3 col-md-2">Alamat</dt>
<dd class="col-sm-9 col-md-10">{{ old('alamat', $user->alamat) }}</dd>
<dt class="col-sm-3 col-md-2">Jantina</dt>
<dd class="col-sm-9 col-md-4">{{ old('jantina', $user->jantina) }}</dd>
<dt class="col-sm-3 col-md-2">Bangsa</dt>
<dd class="col-sm-9 col-md-4">{{ old('bangsa', $user->bangsa) }}</dd>
</dl>
</div>
</div>
<div class="card mb-3">
<div class="card-header">
<h3 class="card-title">MAKLUMAT PERNIAGAAN ( SSM )</h3>
</div> <!-- /.card-header -->
<div class="card-body">
<div class="row">
<div class="col-md-6 mb-3">
<label for="nossm">No SSM</label>
<input id="nossm" name="nossm" type="text"
value="{{ old('nossm', $permohonan?->syarikat?->nossm) }}" autofocus
class="form-control @error('nossm') is-invalid @enderror">
@error('nossm')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
<div class="col-md-6 mb-3">
<label for="jenis_perniagaan">Jenis Perniagaan</label>
<select id="jenis_perniagaan" name="jenis_perniagaan" class="form-select @error('jenis_perniagaan') is-invalid @enderror" required>
<option value=""></option>
<option value="milikan tunggal" {{ old('jenis_perniagaan', $permohonan?->syarikat?->jenis_perniagaan) == 'milikan tunggal' ? 'selected' : ''}}>milikan tunggal</option>
<option value="perkongsian" {{ old('jenis_perniagaan', $permohonan?->syarikat?->jenis_perniagaan) == 'perkongsian' ? 'selected' : ''}}>perkongsian</option>
<option value="perkongsian liabiliti terhad" {{ old('jenis_perniagaan', $permohonan?->syarikat?->jenis_perniagaan) == 'perkongsian liabiliti terhad' ? 'selected' : ''}}>perkongsian liabiliti terhad</option>
<option value="sendirian berhad" {{ old('jenis_perniagaan', $permohonan?->syarikat?->jenis_perniagaan) == 'sendirian berhad' ? 'selected' : ''}}>sendirian berhad</option>
<option value="berhad" {{ old('jenis_perniagaan', $permohonan?->syarikat?->jenis_perniagaan) == 'berhad' ? 'selected' : ''}}>berhad</option>
<option value="koperasi" {{ old('jenis_perniagaan', $permohonan?->syarikat?->jenis_perniagaan) == 'koperasi' ? 'selected' : ''}}>koperasi</option>
<option value="pertubuhan/persatuan/kelab" {{ old('jenis_perniagaan', $permohonan?->syarikat?->jenis_perniagaan) == 'pertubuhan/persatuan/kelab' ? 'selected' : ''}}>pertubuhan/persatuan/kelab</option>
</select>
@error('jenis_perniagaan')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="row">
<div class="mb-3">
<label for="nama_perniagaan">Nama Perniagaan</label>
<input id="nama_perniagaan" name="nama_perniagaan" type="text"
value="{{ old('nama_perniagaan', $permohonan?->syarikat?->name) }}" required autofocus autocomplete="nama_perniagaan"
class="form-control @error('nama_perniagaan') is-invalid @enderror">
@error('nama_perniagaan')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="row">
<div class="col-md-12 mb-3">
<label for="alamat_perniagaan">Alamat Perniagaan</label>
<textarea id="alamat_perniagaan" name="alamat_perniagaan" type="text" class="form-control" required>{{ old('alamat_perniagaan', $permohonan?->syarikat?->alamat) }}</textarea>
</div>
</div>
<div class="row mb-3">
<div class="col-md-6">
<label for="notelefon_perniagaan">No Telefon</label>
<input id="notelefon_perniagaan" name="notelefon_perniagaan" type="text" class="form-control" value="{{ old('notelefon_perniagaan', $permohonan?->syarikat?->notelefon) }}" required autofocus autocomplete="notelefon_perniagaan" />
</div>
<div class="col-md-6">
<label for="bil_cawangan">Bil Cawangan</label>
<input id="bil_cawangan" name="bil_cawangan" type="text" class="form-control" value="{{ old('bil_cawangan', $permohonan?->syarikat?->bil_cawangan) }}" required autofocus autocomplete="bil_cawangan" />
</div>
</div>
</div>
</div>
<div class="card mb-3">
<div class="card-header">
<h3 class="card-title">PERMOHONAN LESEN PENJAJA</h3>
</div> <!-- /.card-header -->
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="mb-3">
<label for="jenis_penjaja">Jenis Penjaja</label>
<select id="jenis_penjaja" class="form-select @error('jenis_penjaja') is-invalid @enderror" name="jenis_penjaja">
<option value="">Pilih Jenis Penjaja</option>
<option value="berpusat" {{ old('jenis_penjaja', $permohonan?->jenis) == 'berpusat' ? 'selected' : '' }}>Sementera (Kawasan Berpusat)</option>
<option value="sementara" {{ old('jenis_penjaja', $permohonan?->jenis) == 'sementara' ? 'selected' : '' }}>Sementara (Tepi Jalan)</option>
<option value="buah bermusim" {{ old('jenis_penjaja', $permohonan?->jenis) == 'buah bermusim' ? 'selected' : '' }}>Buah Bermusim</option>
<option value="foodtruck" {{ old('jenis_penjaja', $permohonan?->jenis) == 'foodtruck' ? 'selected' : '' }}>Foodtruck</option>
<option value="car boot sale" {{ old('jenis_penjaja', $permohonan?->jenis) == 'car boot sale' ? 'selected' : '' }}>Car Boot Sale</option>
<option value="lain-lain" {{ old('jenis_penjaja', $permohonan?->jenis) == 'lain-lain' ? 'selected' : '' }}>Lain-lain</option>
</select>
@error('jenis_penjaja')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="col-md-6">
<div class="mb-3">
<label for="jenis_penjaja_lain">Nyatakan Jenis Penjaja Lain</label>
<input id="jenis_penjaja_lain" class="form-control @error('jenis_penjaja_lain') is-invalid @enderror" type="text" name="jenis_penjaja_lain" disabled value="{{ old('jenis_penjaja_lain', $permohonan?->jenis_lain) }}" autofocus autocomplete="jenis_penjaja_lain">
@error('jenis_penjaja_lain')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="col-md-6">
<div class="mb-3">
<label for="jenis_kenderaan">Jenis Kenderaan</label>
<select id="jenis_kenderaan" class="form-select @error('jenis_kenderaan') is-invalid @enderror" name="jenis_kenderaan">
<option value=""></option>
<option value="kereta sorong" {{ old('jenis_kenderaan', $permohonan?->jenis_kenderaan) == 'kereta sorong' ? 'selected' : ''}}>kereta sorong</option>
<option value="basikal" {{ old('jenis_kenderaan', $permohonan?->jenis_kenderaan) == 'basikal' ? 'selected' : ''}}>basikal</option>
<option value="motosikal" {{ old('jenis_kenderaan', $permohonan?->jenis_kenderaan) == 'motosikal' ? 'selected' : ''}}>motosikal</option>
<option value="beca / basikal roda tiga" {{ old('jenis_kenderaan', $permohonan?->jenis_kenderaan) == 'beca / basikal roda tiga' ? 'selected' : ''}}>beca / basikal roda tiga</option>
<option value="motosikal roda tiga" {{ old('jenis_kenderaan', $permohonan?->jenis_kenderaan) == 'motosikal roda tiga' ? 'selected' : ''}}>motosikal roda tiga</option>
<option value="kereta / wagon" {{ old('jenis_kenderaan', $permohonan?->jenis_kenderaan) == 'kereta / wagon' ? 'selected' : ''}}>kereta / wagon</option>
<option value="van" {{ old('jenis_kenderaan', $permohonan?->jenis_kenderaan) == 'van' ? 'selected' : ''}}>van</option>
<option value="lori" {{ old('jenis_kenderaan', $permohonan?->jenis_kenderaan) == 'lori' ? 'selected' : ''}}>lori</option>
</select>
@error('jenis_kenderaan')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
<small>Penjaja berkenderaan / Foodtruck / Car boot Sale sahaja</small>
</div>
</div>
<div class="col-md-6">
<div class="mb-3">
<label for="no_pendaftaran">No Pendaftaran Kenderaan</label>
<input id="no_pendaftaran" class="form-control @error('no_pendaftaran') is-invalid @enderror" type="text" name="no_pendaftaran" value="{{ old('no_pendaftaran', $permohonan?->no_pendaftaran) }}" autofocus autocomplete="no_pendaftaran">
@error('no_pendaftaran')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="col-md-6">
<div class="mb-3">
<label for="status_tanah">Status Tanah</label>
<select id="status_tanah" class="form-select @error('status_tanah') is-invalid @enderror" name="status_tanah">
<option value="">Pilih Status Tanah</option>
<option value="hak milik persendirian" {{ old('status_tanah', $permohonan?->status_tanah) == 'hak milik persendirian' ? 'selected' : '' }}>hak milik persendirian</option>
<option value="tanah kerajaan(rezab)" {{ old('status_tanah', $permohonan?->status_tanah) == 'tanah kerajaan(rezab)' ? 'selected' : '' }}>tanah kerajaan(rezab)</option>
<option value="tanah sewa" {{ old('status_tanah', $permohonan?->status_tanah) == 'tanah sewa' ? 'selected' : '' }}>tanah sewa</option>
<option value="tapak parkir" {{ old('status_tanah', $permohonan?->status_tanah) == 'tapak parkir' ? 'selected' : '' }}>tapak parkir</option>
<option value="lain-lain" {{ old('status_tanah', $permohonan?->status_tanah) == 'lain-lain' ? 'selected' : '' }}>lain-lain</option>
</select>
@error('status_tanah')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="col-md-8">
<div class="row">
<div class="col-12">
<div class="mb-3">
<label for="kawasan">Kawasan Penjajaan</label>
<select name="kawasan" id="kawasan" class="form-select" required>
</select>
@error('kawasan')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="col-12">
<div class="mb-3">
<label for="taman">Taman</label>
<select id="taman" name="taman" class="form-select" disabled>
<option value="">-- Sila Pilih Taman --</option>
</select>
@error('taman')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="col-12">
<div class="mb-3">
<label for="jalan">Jalan</label>
<select id="jalan" class="form-select" name="jalan" disabled>
<option value="">-- Sila Pilih Jalan --</option>
</select>
@error('jalan')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="col-12">
<div class="mb-3">
<label for="penempatan">Pusat Penempatan(jika ada)</label>
<select name="penempatan" id="penempatan" class="form-select">
<option value="">-- Sila Pilih Penempatan Berpusat --</option>
</select>
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="row">
<div class="col-md-12">
<div class="mb-3">
<label for="masa_jualan_mula">Masa Mula Jualan</label>
<input id="masa_jualan_mula" class="form-control @error('masa_jualan_mula') is-invalid @enderror" type="time" name="masa_jualan_mula" value="{{ old('masa_jualan_mula', $permohonan?->masa_jualan_mula) }}" autofocus autocomplete="masa_jualan_mula">
@error('masa_jualan_mula')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="col-md-12">
<div class="mb-3">
<label for="masa_jualan_tamat">Masa Tamat Jualan</label>
<input id="masa_jualan_tamat" class="form-control @error('masa_jualan_tamat') is-invalid @enderror" type="time" name="masa_jualan_tamat" value="{{ old('masa_jualan_tamat', $permohonan?->masa_jualan_tamat) }}" autofocus autocomplete="masa_jualan_tamat">
@error('masa_jualan_tamat')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12"><small>Kosongkan jika tidak berkaitan</small></div>
<div class="col-md-4">
<div class="mb-3">
<label for="makanan">Makanan</label>
<textarea id="makanan" class="form-control @error('makanan') is-invalid @enderror" name="makanan" autofocus autocomplete="makanan" rows="3" cols="40">{{ old('makanan', $permohonan?->makanan) }}</textarea>
@error('makanan')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="col-md-4">
<div class="mb-3">
<label for="minuman">Minuman</label>
<textarea id="minuman" class="form-control @error('minuman') is-invalid @enderror" name="minuman" autofocus autocomplete="minuman" rows="3" cols="40" >{{ old('minuman', $permohonan?->minuman) }}</textarea>
@error('minuman')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="col-md-4">
<div class="mb-3">
<label for="lain">Lain-lain</label>
<textarea id="lain" class="form-control @error('lain') is-invalid @enderror" name="lain" autofocus autocomplete="lain" rows="3" cols="40" >{{ old('lain', $permohonan?->lain) }}</textarea>
@error('lain')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
</div>
</div>
</div>
</div> <!-- /.col -->
<div class="col-sm-12 col-lg-6">
<div class="card mb-3">
<div class="card-header">
<h3 class="card-title">DOKUMEN DIPERLUKAN</h3>
</div> <!-- /.card-header -->
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="mb-3">
<label for="doc_kad_pengenalan">Salinan Kad Pengenalan</label>
<input id="doc_kad_pengenalan" class="form-control @error('doc_kad_pengenalan') is-invalid @enderror" type="file" name="doc_kad_pengenalan" value="{{ old('doc_kad_pengenalan') }}" autofocus autocomplete="doc_kad_pengenalan"/>
@error('doc_kad_pengenalan')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="col-md-6">
@if(!is_null($doc_kad_pengenalan))
@if ($doc_kad_pengenalan->pivot->jenis_dokumen === 'pdf')
<a href="{{ route('dokumen.view', [$permohonan?->id, $doc_kad_pengenalan->pivot->path]) }}" target="_blank">View PDF</a>
@else
<img src="{{ route('dokumen.view', [$permohonan?->id, $doc_kad_pengenalan->pivot->path]) }}" alt="Salinan IC" style="max-width: 100px;">
@endif
@endif
</div>
<div class="col-6">
<div class="mb-3">
<label for="doc_gambar">Gambar Berukuran Passport</label>
<input id="doc_gambar" class="form-control @error('doc_gambar') is-invalid @enderror" type="file" name="doc_gambar" value="{{ old('doc_gambar') }}" autofocus autocomplete="doc_gambar"/>
@error('doc_gambar')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="col-md-6">
@if(!is_null($doc_gambar))
@if ($doc_gambar->pivot->jenis_dokumen === 'pdf')
<a href="{{ route('dokumen.view', [$permohonan?->id, $doc_gambar->pivot->path]) }}" target="_blank">View PDF</a>
@else
<img src="{{ route('dokumen.view', [$permohonan?->id, $doc_gambar->pivot->path]) }}" alt="Gambar Passport" style="max-width: 100px;">
@endif
@endif
</div>
<div class="col-6">
<div class="mb-3">
<label for="doc_lokasi">Gambar Lokasi / Pelan</label>
<input id="doc_lokasi" class="form-control @error('doc_lokasi') is-invalid @enderror" type="file" name="doc_lokasi" value="{{ old('doc_lokasi') }}" autofocus autocomplete="doc_lokasi"/>
@error('doc_lokasi')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
</div>
<div class="col-md-6">
@if(!is_null($doc_lokasi))
@if ($doc_lokasi->pivot->jenis_dokumen === 'pdf')
<a href="{{ route('dokumen.view', [$permohonan?->id, $doc_lokasi->pivot->path]) }}" target="_blank">View PDF</a>
@else
<img src="{{ route('dokumen.view', [$permohonan?->id, $doc_lokasi->pivot->path]) }}" alt="Gambar Lokasi" style="max-width: 100px;">
@endif
@endif
</div>
<div class="col-6">
<div class="mb-3">
<label for="doc_kebenaran">Surat kebenaran pemilik tanah / pemegang rezab /perjanjian yang sah</label>
<input id="doc_kebenaran" class="form-control" type="file" name="doc_kebenaran" value="{{ old('doc_kebenaran') }}" autofocus autocomplete="doc_kebenaran"/>
</div>
</div>
<div class="col-md-6">
@if(!is_null($doc_kebenaran))
@if ($doc_kebenaran->pivot->jenis_dokumen === 'pdf')
<a href="{{ route('dokumen.view', [$permohonan?->id, $doc_kebenaran->pivot->path]) }}" target="_blank">View PDF</a>
@else
<img src="{{ route('dokumen.view', [$permohonan?->id, $doc_kebenaran->pivot->path]) }}" alt="Surat Kebenaran" style="max-width: 100px;">
@endif
@endif
</div>
<div class="col-6">
<div class="mb-3">
<label for="doc_kenderaan">Gambar Kenderaan</label>
<input id="doc_kenderaan" class="form-control" type="file" name="doc_kenderaan" value="{{ old('doc_kenderaan') }}" autofocus autocomplete="doc_kenderaan"/>
</div>
</div>
<div class="col-md-6">
@if(!is_null($doc_kenderaan))
@if ($doc_kenderaan->pivot->jenis_dokumen === 'pdf')
<a href="{{ route('dokumen.view', [$permohonan?->id, $doc_kenderaan->pivot->path]) }}" target="_blank">View PDF</a>
@else
<img src="{{ route('dokumen.view', [$permohonan?->id, $doc_kenderaan->pivot->path]) }}" alt="Gambar Kenderaan" style="max-width: 100px;">
@endif
@endif
</div>
<div class="col-6">
<div class="mb-3">
<label for="doc_kenderaan_geran">Salinan Geran Kenderaan</label>
<input id="doc_kenderaan_geran" class="form-control" type="file" name="doc_kenderaan_geran" value="{{ old('doc_kenderaan_geran') }}" autofocus autocomplete="doc_kenderaan_geran"/>
</div>
</div>
<div class="col-md-6">
@if(!is_null($doc_kenderaan_geran))
@if ($doc_kenderaan_geran->pivot->jenis_dokumen === 'pdf')
<a href="{{ route('dokumen.view', [$permohonan?->id, $doc_kenderaan_geran->pivot->path]) }}" target="_blank">View PDF</a>
@else
<img src="{{ route('dokumen.view', [$permohonan?->id, $doc_kenderaan_geran->pivot->path]) }}" alt="Gambar Kenderaan" style="max-width: 100px;">
@endif
@endif
</div>
<div class="col-6">
<div class="mb-3">
<label for="doc_suntikan_ty2">Salinan Sijil Suntikan TY2 (Pengendali makanan sahaja)</label>
<input id="doc_suntikan_ty2" class="form-control" type="file" name="doc_suntikan_ty2" value="{{ old('doc_suntikan_ty2') }}" autofocus autocomplete="doc_suntikan_ty2"/>
</div>
</div>
<div class="col-md-6">
@if(!is_null($doc_suntikan_ty2))
@if ($doc_suntikan_ty2->pivot->jenis_dokumen === 'pdf')
<a href="{{ route('dokumen.view', [$permohonan?->id, $doc_suntikan_ty2->pivot->path]) }}" target="_blank">View PDF</a>
@else
<img src="{{ route('dokumen.view', [$permohonan?->id, $doc_suntikan_ty2->pivot->path]) }}" alt="Salinan Suntikan" style="max-width: 100px;">
@endif
@endif
</div>
<div class="col-6">
<div class="mb-3">
<label for="doc_kursus_makanan">Salinan Sijil Kursus Pengendalian Makanan</label>
<input id="doc_kursus_makanan" class="form-control" type="file" name="doc_kursus_makanan" value="{{ old('doc_kursus_makanan') }}" autofocus autocomplete="doc_kursus_makanan"/>
</div>
</div>
<div class="col-md-6">
@if(!is_null($doc_kursus_makanan))
@if ($doc_kursus_makanan->pivot->jenis_dokumen === 'pdf')
<a href="{{ route('dokumen.view', [$permohonan?->id, $doc_kursus_makanan->pivot->path]) }}" target="_blank">View PDF</a>
@else
<img src="{{ route('dokumen.view', [$permohonan?->id, $doc_kursus_makanan->pivot->path]) }}" alt="Salinan Sijil Kursus Pengendalian Makanan" style="max-width: 100px;">
@endif
@endif
</div>
</div>
</div>
</div>
<div class="card mb-3">
<div class="card-header">
<h3 class="card-title">LOKASI PENJAJAAN</h3>
</div> <!-- /.card-header -->
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="mb-3">
<label for="longitude">Longitud</label>
<input id="longitude" class="form-control" type="text" name="longitude" value="{{ old('longitude', $permohonan?->longitude) }}" autofocus autocomplete="longitude"/>
</div>
</div>
<div class="col-md-6">
<div class="mb-3">
<label for="latitude">Latitud</label>
<input id="latitude" class="form-control" type="text" name="latitude" value="{{ old('latitude', $permohonan?->latitude) }}" autofocus autocomplete="latitude"/>
</div>
</div>
</div>
<div id="viewDiv"></div>
</div>
</div>
</div> <!-- /.col -->
</div> <!--end::Row-->
<div class="row mt-4">
<div class="col-lg-12">
<div class="card">
<div class="card-body text-center">
<input id="hantar" class="btn btn-primary" type="submit" value="Simpan"/>
</div> <!-- /.card-header -->
</div> <!-- /.card-header -->
</div> <!-- /.col -->
</div> <!--end::Row-->
</form>
@endsection
@section('js')
<script>
const defaultKawasanId = "{{ $permohonan->kawasan_id ?? '' }}";
const defaultTamanId = "{{ $permohonan->taman_id ?? '' }}";
const defaultJalanId = "{{ $permohonan->jalan_id ?? '' }}";
const defaultPenempatanId = "{{ $permohonan->penempatan_id ?? '' }}";
</script>
<script>
$(document).ready(function () {
// Load Kawasan
$.getJSON('/get_kawasan', function (data) {
$('#kawasan').append('<option value="">-- Sila Pilih Kawasan --</option>');
$.each(data, function (i, kawasan) {
$('#kawasan').append($('<option>', {
value: kawasan.id,
text: kawasan.nama,
selected: kawasan.id == defaultKawasanId
}));
});
// Kalau ada defaultTamanId, load taman
if (defaultKawasanId && defaultTamanId) {
loadTaman(defaultKawasanId, defaultTamanId);
}
});
// Load Penempatan
$.getJSON('/get_penempatan', function (data) {
$('#penempatan').append('<option value="">-- Sila Pilih Penempatan --</option>');
$.each(data, function (i, penempatan) {
$('#penempatan').append($('<option>', {
value: penempatan.id,
text: penempatan.nama,
selected: penempatan.id == defaultPenempatanId
}));
});
});
// Bila kawasan ditukar
$('#kawasan').change(function () {
let kawasanId = $(this).val();
$('#taman').empty().append('<option value="">-- Sila Pilih Taman --</option>');
$('#jalan').empty().append('<option value="">-- Sila Pilih Jalan --</option>').prop('disabled', true);
if (kawasanId) {
loadTaman(kawasanId);
} else {
$('#taman').prop('disabled', true);
}
});
// Bila taman ditukar
$('#taman').change(function () {
let tamanId = $(this).val();
$('#jalan').empty().append('<option value="">-- Sila Pilih Jalan --</option>');
if (tamanId) {
loadJalan(tamanId);
} else {
$('#jalan').prop('disabled', true);
}
});
function loadTaman(kawasanId, selectedTamanId = null) {
$.getJSON('/get_taman', { kawasan_id: kawasanId }, function (data) {
$.each(data, function (i, taman) {
$('#taman').append($('<option>', {
value: taman.id,
text: taman.nama,
selected: taman.id == selectedTamanId
}));
});
$('#taman').prop('disabled', false);
// Kalau ada defaultJalanId, terus load jalan
if (selectedTamanId && defaultJalanId) {
loadJalan(selectedTamanId, defaultJalanId);
}
});
}
function loadJalan(tamanId, selectedJalanId = null) {
$.getJSON('/get_jalan', { taman_id: tamanId }, function (data) {
$.each(data, function (i, jalan) {
$('#jalan').append($('<option>', {
value: jalan.id,
text: jalan.nama,
selected: jalan.id == selectedJalanId
}));
});
$('#jalan').prop('disabled', false);
});
}
});
</script>
<?php
$long = isset($permohonan?->longitude) ? $permohonan?->longitude : 103.58197;
$lat = isset($permohonan?->latitude) ? $permohonan?->latitude : 1.48348;
?>
<!-- Select2 -->
<script src="{{ asset('plugins/select2/js/select2.full.min.js') }}"></script>
<script type="text/javascript" src="https://js.arcgis.com/4.25/"></script>
<script type="text/javascript">
require([
"esri/Map",
"esri/views/MapView",
"esri/widgets/Home",
"esri/widgets/ScaleBar",
"esri/widgets/LayerList",
"esri/widgets/Legend",
"esri/widgets/Expand",
"esri/widgets/Compass",
"esri/layers/Layer",
"esri/layers/GraphicsLayer",
"esri/Graphic",
"esri/geometry/support/webMercatorUtils"
], (
Map, MapView, Home, ScaleBar, LayerList, Legend,
Expand, Compass, Layer, GraphicsLayer, Graphic, webMercatorUtils
) => {
// const layerUrl = "https://onemap.mbip.gov.my/arcgis/rest/services/Hosted/Maklumat_Lot/FeatureServer";
const map = new Map({basemap: "topo-vector"});
const view = new MapView({
container: "viewDiv",
map: map,
center: [{{$long}}, {{$lat}}] ,
zoom: 12
});
//Construct a SimpleMarkerSymbol object
var markerSymbol = {
type: "simple-marker",
color:[226,15,5],
size: 14,
outline:{
color:[255,255,255],
width:2
}
};
@if(!is_null($permohonan?->longitude))
//Construct a point object
var point1 = {
type:"point",
longitude:{{$permohonan?->longitude}},
latitude:{{$permohonan?->latitude}}
};
//Construct a Graphic object
var graphic1 = new Graphic({
geometry:point1,
symbol: markerSymbol
});
// Construct a GraphicsLayer with Graphic objects
var layer = new GraphicsLayer({
graphics: [graphic1]
});
@else
// Construct a GraphicsLayer with Graphic objects
var layer = new GraphicsLayer({
graphics: []
});
@endif
layer.title = "Kedudukan Penjaja";
// createFeatureLayers(layerUrl);
// async function createFeatureLayers(url) {
// const featureService = await Layer.fromArcGISServerUrl(url);
// map.add(featureService);
// map.add(layer);
// }
// Function to make graphics draggable
function makeGraphicDraggable(graphic) {
let moveGraphic = false;
view.on("drag", (event) => {
if (moveGraphic) {
event.stopPropagation();
//const point = view.toMap({ x: event.x, y: event.y });
const point = event.mapPoint;
graphic.geometry = point;
}
});
view.on("pointer-down", (event) => {
const screenPoint = { x: event.x, y: event.y };
view.hitTest(screenPoint).then((response) => {
if (response.results.length > 0 && response.results[0].graphic === graphic) {
moveGraphic = true;
}
});
});
view.on("pointer-up", () => {
if (moveGraphic) {
const { longitude, latitude } = webMercatorUtils.webMercatorToGeographic(graphic.geometry);
console.log(`New position - Longitude: ${longitude}, Latitude: ${latitude}`);
$("#latitude").val(latitude);
$("#longitude").val(longitude);
moveGraphic = false;
}
});
}
// Add a new marker on map click if no marker exists
view.on("click", (event) => {
if (layer.graphics.length === 0) {
// const point = view.toMap({ x: event.x, y: event.y });
const point = event.mapPoint;
const newGraphic = new Graphic({
geometry: point,
symbol: markerSymbol
});
layer.add(newGraphic);
makeGraphicDraggable(newGraphic);
const { longitude, latitude } = webMercatorUtils.webMercatorToGeographic(newGraphic.geometry);
console.log(`Added marker at - Longitude: ${longitude}, Latitude: ${latitude}`);
$("#latitude").val(latitude);
$("#longitude").val(longitude);
$("#waze").attr('href', 'https://waze.com/ul?ll='+latitude+','+longitude+'&z=10');
} else {
console.log('Marker already exists.');
}
});
const homeBtn = new Home({
view: view
});
const scaleBar = new ScaleBar({
view: view,
unit: "dual"
});
const layerList = new LayerList({
view: view
});
const legend = new Legend({
view: view
});
const layerListExpand = new Expand({
view: view,
content: layerList,
expanded: false,
expandTooltip: "Expand LayerList"
});
const legendExpand = new Expand({
view: view,
content: legend,
expandTooltip: "Expand Legend",
expanded: false
});
const compass = new Compass({
view: view,
visible: false
});
view.ui.add(homeBtn, "top-left");
view.ui.add(scaleBar, "bottom-right");
view.ui.add(layerListExpand, "top-right");
view.ui.add(legendExpand, "bottom-left");
view.ui.add(compass, "top-left");
// load the Compass only when the view is rotated
view.watch('rotation', function (rotation) {
if (rotation && !compass.visible) {
compass.visible = true;
}
});
});
</script>
@endsection