diff --git a/public/js/mykad-reader-customer.js b/public/js/mykad-reader-customer.js index caca8e5..3c53b65 100644 --- a/public/js/mykad-reader-customer.js +++ b/public/js/mykad-reader-customer.js @@ -205,7 +205,7 @@ let original_photo_loader = document.querySelector("#photo-mykad").src; let mykad_modal = document.querySelector("#daftar_pelanggan_mykad_reader"); let photo_container = mykad_modal.querySelector("#photo-mykad-container"); - modal_form.querySelector("input[name='name']").value = data.OrgName; + modal_form.querySelector("textarea[name='name']").value = data.OrgName; modal_form.querySelector("input[name='noic']").value = getMyKadNumberWithoutHypens(data.IDNum); modal_form.querySelector("input[name='tarikh_lahir']").value = getFormattedDateOfBirth(data.BirthDate); modal_form.querySelector("input[name='negeri_lahir']").value = data.BirthPlace; diff --git a/public/js/poskod-concerns.js b/public/js/poskod-concerns.js new file mode 100644 index 0000000..e69de29 diff --git a/resources/views/customers/index.blade.php b/resources/views/customers/index.blade.php index 986a32f..0826ae5 100644 --- a/resources/views/customers/index.blade.php +++ b/resources/views/customers/index.blade.php @@ -6,6 +6,15 @@ visibility: hidden; position: absolute; } + + .select2-container .select2-selection--single { + height: 37px; + } + + .select2-container .select2-selection--single .select2-selection__rendered { + padding-left: 0px; + } +
@@ -121,13 +130,7 @@
Ahli
-
- -
+
@@ -137,15 +140,18 @@
Poskod
Daerah
-
+ +
+ +
Negeri
-
+
Umur
Bangsa
+
No KP
Tarikh Lahir
@@ -267,13 +273,13 @@
Alamat
-
+
Poskod
-
+
Daerah
-
+
Negeri
-
+
Umur
Bangsa
@@ -393,9 +399,9 @@
Poskod
Daerah
-
+
Negeri
-
+
Umur
Bangsa
@@ -548,6 +554,81 @@ reader.readAsDataURL(this.files[0]); }); + + let handlePoskodDetail_NotFound = (modal) => { + let input_negeri = modal.querySelector('input#negeri'); + let input_daerah = modal.querySelector('input#daerah'); + let select_daerah = modal.querySelector('select#select-daerah'); + + input_daerah.closest('div.col-md-8').style.display = 'none' ; + input_daerah.disabled = 'true'; + + select_daerah.closest('div.col-md-8').style.display = 'block' ; + select_daerah.disabled = false; + select_daerah.readOnly = false; + + input_negeri.value = ''; + input_negeri.placeholder = ''; + + + let getAllNegeri = () => { + return fetch(api_url+'/api/daerah'); + }; + + + let data_daerah = getAllNegeri().then(response => response.json()) + .then(x => x.map(y => { + return { + "id": y.koddaerah, + "text": y.namadaerah + ' - ' + y.negeri.negeri, + } + })).then(x => { + $('#select-daerah').select2({ + placeholder: "Sila pilih daerah pelanggan", + dropdownParent: $('#daftar_pelanggan'), + closeOnSelect: true, + data: x, + }); + }).then(() => $('#select-daerah').val('').trigger('change')); + + }; + + $('select.select2-daerah').on('select2:select', function (e) { + + let caller = e.target || e.srcElement; + let modal = caller.closest('div.modal.fade'); + + let selected_daerah = e.params.data; + + let getDaerahDetail = (koddaerah) => { + return fetch(api_url+'/api/daerah/'+koddaerah) + .then(response => response.json()) + .then(x => fetch(api_url+'/api/negeri/'+x.kodnegeri)) + .then(response => response.json()) + }; + + let input_negeri = modal.querySelector('input#negeri'); + + getDaerahDetail(selected_daerah.id).then(x => input_negeri.value = x.negeri); + }); + + let handlePoskodDetail_Found = (modal) => { + let input_negeri = modal.querySelector('input#negeri'); + let input_daerah = modal.querySelector('input#daerah'); + let select_daerah = modal.querySelector('select#select-daerah'); + + select_daerah.closest('div.col-md-8').style.display = 'none' ; + select_daerah.disabled = 'true'; + + input_daerah.closest('div.col-md-8').style.display = 'block' ; + input_daerah.disabled = false; + + input_negeri.readOnly = true; + input_negeri.placeholder = ''; + input_daerah.readOnly = true; + input_daerah.placeholder = ''; + }; + $('#poskod').change(function(){ var poskod = this.value; @@ -555,6 +636,14 @@ method:'GET', url:api_url+'/api/poskod/'+poskod, success:function(poskod_detail){ + + let parent_modal = document.querySelector('#daftar_pelanggan'); + + if(Object.keys(poskod_detail).length === 0){ + handlePoskodDetail_NotFound(parent_modal); + return; + } + var koddaerah = poskod_detail['koddaerah']; var kodnegeri = poskod_detail['kodnegeri']; $.ajax({ @@ -571,10 +660,69 @@ $('#daerah').val(daerah['namadaerah']); } }); + + handlePoskodDetail_Found(parent_modal); } }); }); + $('#daftar_pelanggan_mykad_reader input#poskod').change(function(){ + var poskod = this.value; + + $.ajax({ + method:'GET', + url:api_url+'/api/poskod/'+poskod, + success:function(poskod_detail){ + + let parent_modal = document.querySelector('#daftar_pelanggan_mykad_reader'); + + if(Object.keys(poskod_detail).length === 0){ + handlePoskodDetail_NotFound(parent_modal); + return; + } + + var koddaerah = poskod_detail['koddaerah']; + var kodnegeri = poskod_detail['kodnegeri']; + $.ajax({ + url:api_url+'/api/negeri/'+kodnegeri, + method:'GET', + success:function(negeri){ + $('#daftar_pelanggan_mykad_reader #negeri').val(negeri['negeri']); + } + }); + $.ajax({ + url:api_url+'/api/daerah/'+koddaerah, + method:'GET', + success:function(daerah){ + $('#daftar_pelanggan_mykad_reader #daerah').val(daerah['namadaerah']); + } + }); + + handlePoskodDetail_Found(parent_modal); + } + }); + }); + + + $('#daftar_pelanggan_mykad_reader textarea#alamat').change(function(){ + let modal = document.querySelector('#daftar_pelanggan_mykad_reader'); + let input_poskod = modal.querySelector('input#poskod'); + let input_daerah = modal.querySelector('input#daerah'); + let input_negeri = modal.querySelector('input#negeri'); + + input_negeri.value = ''; + + input_daerah.value = ''; + + input_poskod.value = ''; + + input_poskod.readOnly = false; + input_daerah.readOnly = true; + input_negeri.readOnly = true; + + input_poskod.focus(); + }); + $('#passport_poskod').change(function(){ var poskod = this.value;