Files
kaunter/resources/views/customers/index.blade.php
T
LAPTOP-DGCU80CH\user1 15cf079e2d latest
2020-12-24 10:56:32 +08:00

303 lines
17 KiB
PHP

@extends('layouts.app')
@section('content')
<style>
.file {
visibility: hidden;
position: absolute;
}
</style>
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-body">
<div class="text-center">
<h5 class="text-uppercase">masukkan nombor kad pengenalan</h5>
<form action="{{ route('customer.search') }}" method="GET">
<div class="row justify-content-center">
<div class="col-md-7">
<div class="input-group my-3">
<input type="text" class="form-control" name="noic" placeholder="No Kad Pengenalan Pelanggan" aria-label="No Kad Pengenalan Pelanggan" autocomplete="off" value="{{$search == false ? '' : $noic ?? ''}}" aria-describedby="button-addon2">
<div class="input-group-append">
<button class="btn btn-outline-primary" type="submit" id="button-addon2">Sahkan</button>
</div>
</div>
</div>
</div>
</form>
</div>
@if($search == true )
<div class="text-center mt-3">
<button type="button" style="margin:auto" class="btn btn-primary" data-toggle="modal" data-target="#daftar_pelanggan">
Daftar Pelanggan
</button>
</div>
@endif
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="daftar_pelanggan" tabindex="-1" data-backdrop="static" aria-labelledby="ModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="ModalLabel">Daftar Pelanggan</h5>
</div>
<div class="modal-body">
<form action="{{ route('customer.store') }}" method="POST">
@csrf
<div class="row form-group">
<div class="col-md-6">
<div class="row form-group">
<div class="col-md-4">Nama</div>
<div class="col-md-8"><input class="form-control" type="text" name="name" id="name" autocomplete="off"></div>
<div class="col-md-4">No KP</div>
<div class="col-md-8"><input class="form-control" type="text" name="noic" id="noic" value="{{$noic ?? ''}}" readonly></div>
<div class="col-md-4">Tarikh Lahir</div>
<div class="col-md-8"><input class="form-control" type="text" name="tarikh_lahir" id="tarikh_lahir" readonly></div>
<div class="col-md-4">Negeri Lahir</div>
<div class="col-md-8"><input class="form-control" type="text" name="negeri_lahir" id="negeri_lahir" readonly></div>
<div class="col-md-4">Jantina</div>
<div class="col-md-8"><input class="form-control" type="text" name="jantina" id="jantina" readonly></div>
<div class="col-md-4">Alamat</div>
<div class="col-md-8"><textarea style="resize:none" name="alamat" id="alamat" cols="30" rows="3"></textarea></div>
<div class="col-md-4">Poskod</div>
<div class="col-md-8"><input class="form-control" type="text" name="poskod" id="poskod" autocomplete="off"></div>
<div class="col-md-4">Daerah</div>
<div class="col-md-8"><input class="form-control" type="text" name="daerah" id="daerah" readonly autocomplete="off"></div>
<div class="col-md-4">Negeri</div>
<div class="col-md-8"><input class="form-control" type="text" name="negeri" id="negeri" readonly autocomplete="off"></div>
<div class="col-md-4">No Telefon 1</div>
<div class="col-md-8"><input class="form-control" type="text" name="main_phone" id="main_phone" autocomplete="off"></div>
<div class="col-md-4">No Telefon 2</div>
<div class="col-md-8"><input class="form-control" type="text" name="alternate_phone" id="alternate_phone" autocomplete="off"></div>
<div class="col-md-12 ml-4">
<div class="form-group row">
<div class="form-check form-check-inline">
<input class="form-check-input" type="checkbox" id="warganegara" name="warganegara" value="warganegara">
<label class="form-check-label" for="warganegara">Warganegara</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="checkbox" id="bumiputera" name="bumiputera" value="bumiputera">
<label class="form-check-label" for="bumiputera">Bumiputera</label>
</div>
</div>
</div>
<div class="col-md-4">Agama</div>
<div class="col-md-8">
<select class="form-control" name="agama" id="agama">
<option disabled selected value> -- Pilih Agama -- </option>
<option value="islam">Islam</option>
<option value="hindu">Hindu</option>
<option value="buddha">Buddha</option>
<option value="kristian">Kristian</option>
<option value="lain">Lain-lain</option>
</select>
</div>
<div class="col-md-4">Ahli</div>
<div class="col-md-8">
<select class="form-control" name="kumpulan_sahabat" id="kumpulan_sahabat">
<option value="tidak">Tidak</option>
<option value="PKINK">Kumpulan PKINK</option>
<option value="sahabat">Sahabat</option>
</select>
</div>
</div>
</div>
<div class="col-md-6">
<div class="row form-group">
<div class="col-md-12" style="margin-left:auto;margin-right:auto">
<img src="" id="preview" style="width:250px;height:250px" class="img-thumbnail">
</div>
<div class="col-md-12">
<input type="file" name="customer_image" id="customer_image" accept="image/*">
<!-- <input type="file" name="customer_image" id="customer_image" class="file" accept="image/*">
<div class="input-group my-3">
<input type="text" class="form-control" readonly placeholder="Upload File" id="file" name="file">
<div class="input-group-append">
<button type="button" class="browse btn btn-primary">Browse...</button>
</div>
</div> -->
</div>
<div class="col-md-4">Umur</div>
<div class="col-md-8"><input class="form-control" type="text" name="age" id="age" readonly></div>
<div class="col-md-4">Bangsa</div>
<div class="col-md-8">
<select class="form-control" name="bangsa" id="bangsa">
<option disabled selected value> -- Pilih Bangsa -- </option>
<option value="M">Melayu</option>
<option value="C">Cina</option>
<option value="I">India</option>
<option value="L">Lain-lain</option>
</select>
</div>
<div class="col-md-4">Bank</div>
<div class="col-md-8">
<select class="form-control" name="bank_name" data-placeholder="Pilih Bank" id="bank_name">
<option disabled selected value> -- Pilih Bank -- </option>
@foreach($bank as $banks)
<option value="{{ $banks['abbreviation'] }}">{{ $banks['name'] }}</option>
@endforeach
</select>
</div>
<div class="col-md-4">No Akaun Bank</div>
<div class="col-md-8"><input class="form-control" type="text" name="no_akaun" id="no_akaun"></div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-dismiss="modal">Batal</button>
<input type="submit" name="submit" class="btn btn-primary" value="Terima">
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
var api_url = "<?php echo $api_url ?>";
$(document).ready(function(){
var noic = $('#noic').val();
identifyIC(noic);
});
$(document).on("click", ".browse", function() {
var file = $(this).parents().find(".file");
file.trigger("click");
});
$('input[type="file"]').change(function(e) {
var fileName = e.target.files[0].name;
$("#file").val(fileName);
var reader = new FileReader();
reader.onload = function(e) {
// get loaded data and render thumbnail.
document.getElementById("preview").src = e.target.result;
};
// read the image file as a data URL.
reader.readAsDataURL(this.files[0]);
});
$('#poskod').change(function(){
var poskod = this.value;
$.ajax({
method:'GET',
url:api_url+'/api/poskod/'+poskod,
success:function(poskod_detail){
// console.log(poskod_detail);
var koddaerah = poskod_detail['koddaerah'];
var kodnegeri = poskod_detail['kodnegeri'];
$.ajax({
url:api_url+'/api/negeri/'+kodnegeri,
method:'GET',
success:function(negeri){
$('#negeri').val(negeri['negeri']);
}
});
$.ajax({
url:api_url+'/api/daerah/'+koddaerah,
method:'GET',
success:function(daerah){
$('#daerah').val(daerah['namadaerah']);
}
});
}
});
});
function identifyIC(noic){
if(noic.match(/^(\d{2})(\d{2})(\d{2})-?\d{2}-?\d{4}$/)) {
var year = noic.slice(0,2);
var month = noic.slice(2,4);
var day = noic.slice(4,6);
var nl = noic.slice(6,8);
var last_ic = noic.slice(8,12);
var now = new Date().getFullYear().toString();
var decade = now.substr(0, 2);
if (now.substr(2,2) > year) {
year = parseInt(decade.concat(year.toString()), 10);
}
if (parseInt(last_ic,10)%2 != 0){
var jantina = 'Lelaki';
}
else{
var jantina = 'Perempuan';
}
var johor_ic = ['01','21','22','23','24'];
var kedah_ic = ['02','25','26','27'];
var kelantan_ic = ['03','28','29'];
var melaka_ic = ['04','30'];
var negeri_ic = ['05','31','59'];
var pahang_ic = ['06','32','33'];
var penang_ic = ['07','34','35'];
var perak_ic = ['08','36','37','38','39'];
var perlis_ic = ['09','40'];
var selangor_ic = ['10','41','42','43','44'];
var terengganu_ic = ['11','45','46'];
var sabah_ic = ['12','47','48','49'];
var sarawak_ic = ['13','50','51','52','53'];
var kl_ic = ['14','54','55','56','57'];
var labuan_ic = ['15','58'];
var putrajaya_ic = ['16'];
var unknown_ic = ['82'];
if(johor_ic.indexOf(nl)>=0){
var negeri_lahir = 'Johor';
}else if(kedah_ic.indexOf(nl)>=0){
var negeri_lahir = 'Kedah';
}else if(kelantan_ic.indexOf(nl)>=0){
var negeri_lahir = 'Kelantan';
}else if(melaka_ic.indexOf(nl)>=0){
var negeri_lahir = 'Melaka';
}else if(negeri_ic.indexOf(nl)>=0){
var negeri_lahir = 'Negeri Sembilan';
}else if(pahang_ic.indexOf(nl)>=0){
var negeri_lahir = 'Pahang';
}else if(penang_ic.indexOf(nl)>=0){
var negeri_lahir = 'Pulau Pinang';
}else if(perak_ic.indexOf(nl)>=0){
var negeri_lahir = 'Perak';
}else if(perlis_ic.indexOf(nl)>=0){
var negeri_lahir = 'Perlis';
}else if(selangor_ic.indexOf(nl)>=0){
var negeri_lahir = 'Selangor';
}else if(terengganu_ic.indexOf(nl)>=0){
var negeri_lahir = 'Terengganu';
}else if(sabah_ic.indexOf(nl)>=0){
var negeri_lahir = 'Sabah';
}else if(sarawak_ic.indexOf(nl)>=0){
var negeri_lahir = 'Sarawak';
}else if(kl_ic.indexOf(nl)>=0){
var negeri_lahir = 'Kuala Lumpur';
}else if(labuan_ic.indexOf(nl)>=0){
var negeri_lahir = 'Labuan';
}else if(putrajaya_ic.indexOf(nl)>=0){
var negeri_lahir = 'Putrajaya';
}else if(unknown_ic.indexOf(nl)>=0){
var negeri_lahir = 'Negeri Tidak Diketahui';
}
var date = new Date(year, (month - 1), day, 0, 0, 0, 0);
var age = parseInt(now,10) - date.getFullYear();
$('#age').val(age);
var tarikh_lahir = day + '/' + month + '/' + date.getFullYear();
$('#jantina').val(jantina);
$('#tarikh_lahir').val(tarikh_lahir);
$('#negeri_lahir').val(negeri_lahir);
}
}
</script>
@endsection