KoPKB/kaunter
2
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases 1 Wiki Activity

Add new code on change card reader to Iris MyKad reader

Browse Source
This commit is contained in:
afiq.hamzah
2022-10-20 11:11:15 +08:00
parent 6fcf201d12
commit 34331e09fc
6 changed files with 585 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/css/loader.css
Vendored
+121
View File
@@ -0,0 +1,121 @@
/* Absolute Center Spinner */
.loading {
position: fixed;
z-index: 999;
height: 2em;
width: 2em;
overflow: show;
margin: auto;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
/* Transparent Overlay */
.loading:before {
content: '';
display: block;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: radial-gradient(rgba(20, 20, 20,.8), rgba(0, 0, 0, .8));
background: -webkit-radial-gradient(rgba(20, 20, 20,.8), rgba(0, 0, 0,.8));
}
/* :not(:required) hides these rules from IE9 and below */
.loading:not(:required) {
/* hide "loading..." text */
font: 0/0 a;
color: transparent;
text-shadow: none;
background-color: transparent;
border: 0;
}
.loading:not(:required):after {
content: '';
display: block;
font-size: 10px;
width: 1em;
height: 1em;
margin-top: -0.5em;
-webkit-animation: spinner 150ms infinite linear;
-moz-animation: spinner 150ms infinite linear;
-ms-animation: spinner 150ms infinite linear;
-o-animation: spinner 150ms infinite linear;
animation: spinner 150ms infinite linear;
border-radius: 0.5em;
-webkit-box-shadow: rgba(255,255,255, 0.75) 1.5em 0 0 0, rgba(255,255,255, 0.75) 1.1em 1.1em 0 0, rgba(255,255,255, 0.75) 0 1.5em 0 0, rgba(255,255,255, 0.75) -1.1em 1.1em 0 0, rgba(255,255,255, 0.75) -1.5em 0 0 0, rgba(255,255,255, 0.75) -1.1em -1.1em 0 0, rgba(255,255,255, 0.75) 0 -1.5em 0 0, rgba(255,255,255, 0.75) 1.1em -1.1em 0 0;
box-shadow: rgba(255,255,255, 0.75) 1.5em 0 0 0, rgba(255,255,255, 0.75) 1.1em 1.1em 0 0, rgba(255,255,255, 0.75) 0 1.5em 0 0, rgba(255,255,255, 0.75) -1.1em 1.1em 0 0, rgba(255,255,255, 0.75) -1.5em 0 0 0, rgba(255,255,255, 0.75) -1.1em -1.1em 0 0, rgba(255,255,255, 0.75) 0 -1.5em 0 0, rgba(255,255,255, 0.75) 1.1em -1.1em 0 0;
}
/* Animation */
@-webkit-keyframes spinner {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-moz-keyframes spinner {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-o-keyframes spinner {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes spinner {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
public/js/iris-mykad-websocket-client-api.js
Vendored
+258
View File
@@ -0,0 +1,258 @@
WebSocketManager = {
url:"",
init: function(url) {
WebSocketManager.url = url;
},
open: function(callback, slot) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"OPEN","Slot":"'+ slot +'"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
wsocket.close();
callback(obj);
};
},
listReader: function(callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"LIST_READER"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode);
};
},
close: function(callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"CLOSE"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
wsocket.close();
callback(obj);
};
},
verifyFPTemplate: function(callback, ThumbCode, Bas64FPLeft, Bas64FPRight) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"VERIFY_FP_TEMPLATE","ThumbCode":"'+ ThumbCode +'","Bas64FPLeft":"'+ Bas64FPLeft +'","Bas64FPRight":"'+ Bas64FPRight +'"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
wsocket.close();
callback(obj.RespCode, obj.RespMessage);
};
},
readMyKad: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"READ_MYKAD"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode, obj.RespSW12AndApiName);
};
},
readAllText: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"READ_ALL_TEXT"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode, obj.RespSW12AndApiName);
};
},
readPhoto: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"READ_PHOTO"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode, obj.RespSW12AndApiName);
};
},
readBio: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"READ_BIO"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode, obj.RespSW12AndApiName);
};
},
readMyKid: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"READ_MYKID"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode, obj.RespSW12AndApiName);
};
},
FPBioEnrol: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"FP_BIO_ENROL"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
//var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(obj);
};
},
getThumbImage: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"GET_MYKAD_THUMB_IMAGE"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode, obj.RespSW12AndApiName);
};
},
getThumbBin1: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"GET_THUMB_BIN1"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode, obj.RespSW12AndApiName);
};
},
getThumbBin2: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"GET_THUMB_BIN2"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode, obj.RespSW12AndApiName);
};
},
FPBioEnrolBin1: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"FP_BIO_ENROL_BIN1"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
//var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(obj);
};
},
FPBioEnrolBin2: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"FP_BIO_ENROL_BIN2"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
//var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(obj);
};
},
FPBioVerify: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"FP_BIO_VERIFY"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode, obj.RespSW12AndApiName);
};
},
FPBioVerifyBin: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"FP_BIO_VERIFY_BIN"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode, obj.RespSW12AndApiName);
};
},
FPBioVerifyLeft: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"FP_BIO_VERIFY_LEFT"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode, obj.RespSW12AndApiName);
};
},
FPBioVerifyBinLeft: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"FP_BIO_VERIFY_BIN_LEFT"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode, obj.RespSW12AndApiName);
};
},
FPBioVerifyRight: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"FP_BIO_VERIFY_RIGHT"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode, obj.RespSW12AndApiName);
};
},
FPBioVerifyBinRight: function (callback) {
wsocket = new WebSocket(WebSocketManager.url);
wsocket.onopen = function () {
wsocket.send('{"Cmd":"FP_BIO_VERIFY_BIN_RIGHT"}');
};
wsocket.onmessage = function (evt) {
var obj = JSON.parse(evt.data);
var data = JSON.parse(obj.RespMessage);
wsocket.close();
callback(data, obj.RespCode, obj.RespSW12AndApiName);
};
}
}
public/js/mykad-reader-customer.js
Vendored
+191
View File
@@ -0,0 +1,191 @@
let button_read_mykad = document.getElementById("button_read_mykad");
let button_close_modal = document.querySelector("#daftar_pelanggan button.btn.btn-danger");
let showLoader = () => {
let pageLoader = document.getElementById('page_loader');
pageLoader.removeAttribute('class');
pageLoader.classList.add('loading');
};
let hideLoader = () => {
let pageLoader = document.getElementById('page_loader');
pageLoader.removeAttribute('class');
};
function handleMyKadReader()
{
showLoader();
WebSocketManager.init("wss://localhost:5963/mykadwebsocket");
WebSocketManager.listReader(callbackDoneGetListCardReader);
}
function callbackDoneGetListCardReader(data, respcode)
{
if(respcode === -1){
console.log({'location': 'callbackDoneGetListCardReader', 'data' : data} );
}
let slots = data.toString().split(',');
WebSocketManager.open(doneOpenReaderConnection, slots[0]);
}
function doneOpenReaderConnection(data)
{
WebSocketManager.readMyKad(callBackAfterReadMykad);
}
function callBackAfterReadMykad(data, respcode, sw12AndApiName)
{
if(respcode !== 0){
hideLoader();
Swal.fire({icon: 'error', title: sw12AndApiName,});
return;
}
checkIfMyKadExists(data.IDNum)
.then(response => response[0])
.then(response => {
if (response === 'no-data') {
populateDaftarPelangganModal(data);
} else {
let input_search_noic = document.getElementById("noic");
let form_search_noic = document.querySelector("form[name='frmsearch']");
let getMyKadNumberWithoutHypens = myKadNumber => myKadNumber.replace(/-/g, '');
input_search_noic.value = getMyKadNumberWithoutHypens(data.IDNum);
form_search_noic.submit();
}
})
.catch(error => {
Swal.fire({
icon: 'error',
title: error,
});
});
hideLoader();
}
function checkIfMyKadExists(myKadNumber){
let myKadNumberWithoutHyphens = myKadNumber.replace(/-/g, '');
const url = wakil_caricustomer_endpoint + '/?icno=' + myKadNumberWithoutHyphens;
return fetch(url).then((response) => response.json());
}
let populateDaftarPelangganModal = (data) => {
$('#daftar_pelanggan').modal('show');
let modal_form = document.querySelector(".modal-body .row.form-group");
const religions = [
['01', 'Islam'],
['02', 'Hindu'],
['03', 'Buddha'],
['04', 'Kristian'],
['05', 'Lain-lain'],
];
const races = [
['M', 'Melayu'],
['C', 'Cina'],
['I', 'India'],
['L', 'Lain-lain'],
];
let getCodeFromValue = (needle, haystack) => {
let title_cased_text = needle.split(' ')
.map(w => w[0].toUpperCase() + w.substring(1).toLowerCase())
.join(' ');
return haystack.filter(x => x[1] == title_cased_text)[0][0];
};
let getMyKadNumberWithoutHypens = (IDNum) => {
return IDNum.replace(/-/g, '');
}
let getFormattedDateOfBirth = (date_of_birth) => {
let date_of_birth_hyphenated = date_of_birth.replace(/(\d{4})(\d{2})(\d{2})/, "$1-$2-$3");
const [year, month, day] = date_of_birth_hyphenated.split('-');
return day + '/' + month + '/' + year;
};
let getAgeFromDateOfBirth = (date_of_birth) => {
let date_of_birth_hyphenated = date_of_birth.replace(/(\d{4})(\d{2})(\d{2})/, "$1-$2-$3");
const [birth_year, birth_month, birth_day] = date_of_birth_hyphenated.split('-');
let formatBirthMonth = (birth_month) => {
let newbirthMonth = birth_month < 9 ? birth_month[1] : birth_month;
return newbirthMonth;
};
const count_leap_year = countLeapYears(birth_year, formatBirthMonth(birth_month), birth_day) - 1;
const start = new Date(date_of_birth_hyphenated),
end = new Date(),
diff = new Date(end - start),
days = ((diff / 1000 / 60 / 60 / 24) - count_leap_year) / 365;
return parseInt(days);
};
let getBumiputeraStatus = (race) => {
const non_bumiputera_ethnicity = ['INDIA', 'CINA'];
let isBumiputera = !non_bumiputera_ethnicity.includes(race);
return isBumiputera;
};
let photo_container = document.getElementById("photo-mykad-container");
let photo = document.getElementById("photo-mykad");
photo.src = 'data:image/jpeg;base64, ' + data.Base64Photo;
modal_form.querySelector("input[name='name']").value = data.Name;
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;
modal_form.querySelector("input[name='jantina']").value = data.Gender == 'LELAKI' ? 'Lelaki' : 'Perempuan';
modal_form.querySelector("input[name='warganegara']").checked = data.Citizenship === 'WARGANEGARA' ? true : false;
modal_form.querySelector("input[name='bumiputera']").checked = getBumiputeraStatus(data.Race);
modal_form.querySelector("select[name='agama']").value = getCodeFromValue(data.Religion, religions);
modal_form.querySelector("textarea[name='alamat']").value = [data.Address1, data.Address2, data.Address3].join(", ");
let getPostCode = (postCodeCity) => postCodeCity.replace(/\D/g, '');
modal_form.querySelector("input[name='poskod']").value = getPostCode(data.PostcodeCity);
let getCityName = (postCodeCity) => postCodeCity.replace(/\d/g, '');
modal_form.querySelector("input[name='daerah']").value = getCityName(data.PostcodeCity);
modal_form.querySelector("input[name='negeri']").value = data.State;
modal_form.querySelector("input[name='age']").value = getAgeFromDateOfBirth(data.BirthDate);
modal_form.querySelector("select[name='bangsa']").value = getCodeFromValue(data.Race, races);
calculatePassportAge();
photo_container.classList.remove('d-none');
photo_container.classList.add('d-flex');
$('#daftar_pelanggan').modal('show');
}
let hideMykadPhoto = () => {
let photo = document.getElementById("photo-mykad");
let photo_container = document.getElementById("photo-mykad-container");
photo.src = '';
photo_container.classList.add('d-none');
photo_container.classList.remove('d-flex');
};
button_read_mykad.addEventListener("click", handleMyKadReader);
button_close_modal.addEventListener("click", hideMykadPhoto);
public/js/mykad-reader.js
Vendored
-153
View File
@@ -1,153 +0,0 @@
let button_read_mykad = document.getElementById("button_read_mykad");
let button_close_modal = document.querySelector("#daftar_pelanggan button.btn.btn-danger");
let removeCRLFfromString = (response_text) => {
return response_text.replace(/[\n\r]+/g, '').replace(/\s{2,10}/g, ' ');
};
const myKad_reader_error = new Error('Sila sambungkan pembaca MyKad dengan betul');
let getMyKadDetail = () => {
return fetch(mykad_reader_endpoint)
.then(response => response.text())
.then(response => removeCRLFfromString(response))
.then(response => JSON.parse(response))
.catch(error => {
throw myKad_reader_error;
});
};
let checkIfMyKadExist = (myKadNumber) => {
const url = wakil_caricustomer_endpoint + '/?icno=' + myKadNumber;
return fetch(url).then((response) => response.json());
};
let handleMyKadReader = () => {
let myKadDetail;
getMyKadDetail()
.then(response => myKadDetail = response[0])
.then(() => {
if (myKadDetail.ReadStatus === 'ERROR') {
throw myKad_reader_error;
}
})
.then(() => checkIfMyKadExist(myKadDetail.IdNo))
.then(response => response[0])
.then(response => {
if (response === 'no-data') {
populateDaftarPelangganModal(myKadDetail);
} else {
let input_search_noic = document.getElementById("noic");
let form_search_noic = document.querySelector("form[name='frmsearch']");
input_search_noic.value = myKadDetail.IdNo;
form_search_noic.submit();
}
})
.catch(error => {
Swal.fire({
icon: 'error',
title: error,
});
});
};
let populateDaftarPelangganModal = (data) => {
let modal_form = document.querySelector(".modal-body .row.form-group");
const religions = [
['01', 'Islam'],
['02', 'Hindu'],
['03', 'Buddha'],
['04', 'Kristian'],
['05', 'Lain-lain'],
];
const ethnicities = [
['M', 'Melayu'],
['C', 'Cina'],
['I', 'India'],
['L', 'Lain-lain'],
];
let getCodeFromValue = (needle, haystack) => {
let title_cased_text = needle.split(' ')
.map(w => w[0].toUpperCase() + w.substring(1).toLowerCase())
.join(' ');
return haystack.filter(x => x[1] == title_cased_text)[0][0];
};
let getFormattedDateOfBirth = (date_of_birth) => {
const [year, month, day] = date_of_birth.split('-');
return day + '/' + month + '/' + year;
};
let getAgeFromDateOfBirth = (date_of_birth) => {
const [birth_year, birth_month, birth_day] = date_of_birth.split('-');
const count_leap_year = countLeapYears(birth_year, birth_month, birth_day) - 1;
const start = new Date(date_of_birth),
end = new Date(),
diff = new Date(end - start),
days = ((diff / 1000 / 60 / 60 / 24) - count_leap_year) / 365;
return parseInt(days);
};
let getBumiputeraStatus = (ethnicity) => {
const non_bumiputera_ethnicity = ['INDIA', 'CINA'];
let isBumiputera = !non_bumiputera_ethnicity.includes(ethnicity);
return isBumiputera;
};
let photo_container = document.getElementById("photo-mykad-container");
let photo = document.getElementById("photo-mykad");
photo.src = 'data:image/png;base64, ' + data.Photo;
modal_form.querySelector("input[name='name']").value = data.Name;
modal_form.querySelector("input[name='noic']").value = data.IdNo;
modal_form.querySelector("input[name='tarikh_lahir']").value = getFormattedDateOfBirth(data.DateOfBirth);
modal_form.querySelector("input[name='negeri_lahir']").value = data.State;
modal_form.querySelector("input[name='jantina']").value = data.Gender == 'L' ? 'Lelaki' : 'Perempuan';
modal_form.querySelector("input[name='warganegara']").checked = data.Citizenship === 'WARGANEGARA' ? true : false;
modal_form.querySelector("input[name='bumiputera']").checked = getBumiputeraStatus(data.Ethnicity);
modal_form.querySelector("select[name='agama']").value = getCodeFromValue(data.Religion, religions);
modal_form.querySelector("textarea[name='alamat']").value = [data.Address1, data.Address2, data.Address3].join(", ");
modal_form.querySelector("input[name='poskod']").value = data.Postcode;
modal_form.querySelector("input[name='daerah']").value = data.Town;
modal_form.querySelector("input[name='negeri']").value = data.State;
modal_form.querySelector("input[name='age']").value = getAgeFromDateOfBirth(data.DateOfBirth);
modal_form.querySelector("select[name='bangsa']").value = getCodeFromValue(data.Ethnicity, ethnicities);
calculatePassportAge();
photo_container.classList.remove('d-none');
photo_container.classList.add('d-flex');
$('#daftar_pelanggan').modal('show');
};
let hideMykadPhoto = () => {
let photo = document.getElementById("photo-mykad");
let photo_container = document.getElementById("photo-mykad-container");
photo.src = '';
photo_container.classList.add('d-none');
photo_container.classList.remove('d-flex');
};
button_read_mykad.addEventListener("click", handleMyKadReader);
button_close_modal.addEventListener("click", hideMykadPhoto);
resources/views/customers/index.blade.php
+6 -2
View File
@@ -898,11 +898,15 @@
}
}
</script>
@push('additional_scripts')
<script>
// mycard-read endpoint initialization
let mykad_reader_endpoint = "{{ config('mykad-reader.endpoint') }}";
let wakil_caricustomer_endpoint = "{{ route('wakil.caricustomer') }}";
</script>
<script src="{{ asset('js/mykad-reader.js') }}"></script>
<script src="{{ asset('js/iris-mykad-websocket-client-api.js') }}"></script>
<script src="{{ asset('js/mykad-reader-customer.js') }}"></script>
@endpush
@endsection
resources/views/layouts/app.blade.php
+9 -2
View File
@@ -21,6 +21,7 @@
<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<link href="{{ asset('css/main.css') }}" rel="stylesheet">
<link href="{{ asset('css/loader.css') }}" rel="stylesheet">
<link href="{{ asset('vendor/adminlte/dist/css/adminlte.css') }}" rel="stylesheet">
<link href="{{ asset('vendor/fontawesome-free/css/all.css') }}" rel="stylesheet">
<link href="{{ asset('vendor/DataTables/datatables.min.css') }}" rel="stylesheet">
@@ -91,6 +92,7 @@
}
@endphp
<div id="app">
<div id="page_loader" class="not-loading"></div>
<nav class="navbar navbar-expand-md navbar-light bg-white shadow-sm" style="height:100px;">
<div class="container">
<a class="navbar-brand" href="#" style="cursor:not-allowed;">
@@ -293,13 +295,16 @@
</div>
@php
$gadaiNumber = $gadai == null ? '0' : count($gadaiNumber);
$listSerahNumber = $listserah == null ? '0' : count($listserah);
if($auth_user['role_harian'] == 'teller')
{
echo '<div class="col-3">
<div class="col-12 pl-5">
<div class="row">
<h5 class="pr-3">G : <span class="text-success">' . $gadai ?? count($gadai) . '</span></h5>
<h5>T : <span class="text-danger">' . $listserah ?? count($listserah) . '</span></h5>
<h5 class="pr-3">G : <span class="text-success">' .$gadaiNumber. '</span></h5>
<h5>T : <span class="text-danger">' .$listSerahNumber. '</span></h5>
</div>
</div>
</div>';
@@ -340,4 +345,6 @@
@yield('footer')
</body>
{{-- JS Stack--}}
@stack('additional_scripts')
</html>