From 278388d97059804aa142856d5f8b91cfa1937c94 Mon Sep 17 00:00:00 2001
From: sungguh <sungguhterlalukamu@yahoo.fr>
Date: Thu, 11 Mar 2021 11:14:25 +0700
Subject: [PATCH] up

---
 .../Android/src/main/AndroidManifest.xml      |   4 +-
 app/app.js                                    |  13 ++
 app/informasi/informasi-page.xml              |   3 +
 app/localdb_helper.js                         |  23 +-
 app/pengecekan/pengecekan-page.js             | 219 +++++++++++++-----
 app/pengecekan/pengecekan-page.xml            |  84 ++++---
 app/riwayat/riwayat-detail-page.js            |  37 ++-
 app/riwayat/riwayat-detail-page.xml           |  79 ++++---
 app/riwayat/riwayat-page.js                   |  31 ++-
 app/riwayat/riwayat-page.xml                  |  10 +-
 10 files changed, 374 insertions(+), 129 deletions(-)

diff --git a/app/App_Resources/Android/src/main/AndroidManifest.xml b/app/App_Resources/Android/src/main/AndroidManifest.xml
index 898b2b7..3e19fb6 100644
--- a/app/App_Resources/Android/src/main/AndroidManifest.xml
+++ b/app/App_Resources/Android/src/main/AndroidManifest.xml
@@ -1,7 +1,9 @@
 <?xml version="1.0" encoding="utf-8"?>
 <manifest
-    xmlns:android="http://schemas.android.com/apk/res/android" package="__PACKAGE__" android:versionCode="5" android:versionName="1.2">
+    xmlns:android="http://schemas.android.com/apk/res/android" package="__PACKAGE__" android:versionCode="6" android:versionName="1.3">
     <supports-screens android:smallScreens="true" android:normalScreens="true" android:largeScreens="true" android:xlargeScreens="true" />
+    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
+    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
     <uses-permission android:name="android.permission.INTERNET" />
     <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
     <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
diff --git a/app/app.js b/app/app.js
index aec02e9..87cf6c7 100644
--- a/app/app.js
+++ b/app/app.js
@@ -3,6 +3,19 @@ const ModeLoadingIndicator = require('@nstudio/nativescript-loading-indicator').
 
 global.gLocalstorage = [];
 global.gConfig = {
+    "connectionOption": { 
+        message: 'Sedang mengecek jaringan internet...',
+        margin: 10,
+        dimBackground: true,
+        color: '#FFFFFF',
+        backgroundColor: '#FFFFFF',
+        userInteractionEnabled: true,
+        hideBezel: true, 
+        mode: ModeLoadingIndicator.Indeterminate,
+        android: {
+            cancelable: false,
+        }
+    },
     "searchOption": {
         message: 'Sedang mengecek data...',
         margin: 10,
diff --git a/app/informasi/informasi-page.xml b/app/informasi/informasi-page.xml
index 998cb96..10e4b45 100644
--- a/app/informasi/informasi-page.xml
+++ b/app/informasi/informasi-page.xml
@@ -25,6 +25,9 @@
             <Label text="Rilis Pertama" textWrap="true" fontSize="20" color="#212121" marginTop="10" />
             <Label text="22 November 2020 (v1.1)" textWrap="true" fontSize="13" color="#616161" />
             
+            <Label text="Versi Saat Ini" textWrap="true" fontSize="20" color="#212121" marginTop="10" />
+            <Label text="v1.3" textWrap="true" fontSize="13" color="#616161" />
+            
             <Label text="Pembuat" textWrap="true" fontSize="20" color="#212121" marginTop="10" />
             <Label text="Kang cahya" textWrap="true" fontSize="13" color="#616161" />
             
diff --git a/app/localdb_helper.js b/app/localdb_helper.js
index 38311e2..f22b645 100644
--- a/app/localdb_helper.js
+++ b/app/localdb_helper.js
@@ -208,4 +208,25 @@ exports.drop = function(xkey="ldkc"){
             "message" : "Database has been dropped."
         };
     }
-};
\ No newline at end of file
+};
+
+exports.getCurrentTime = function(){
+    var d = new Date();
+
+    var p = d.getFullYear(),
+        q = d.getMonth()+1,
+        r = d.getDate(),
+        s = d.getHours(),
+        t = d.getMinutes(),
+        u = d.getSeconds();
+
+    var months = ["Jan", "Feb", "Mar", "Apr", "Mei", "Jun", "Jul", "Agu", "Sep", "Okt", "Nov", "Des"],
+        monthName = months[d.getMonth()];
+
+    var days = ["Minggu", "Senin", "Selasa", "Rabu", "Kamis", "Jum'at", "Sabtu"],
+        dayName = days[d.getDay()];
+
+    var result = dayName + ", " + r+"/"+monthName+"/"+p+" "+s+":"+t+":"+u;
+
+    return result;
+}
\ No newline at end of file
diff --git a/app/pengecekan/pengecekan-page.js b/app/pengecekan/pengecekan-page.js
index b1f97b3..06586cc 100644
--- a/app/pengecekan/pengecekan-page.js
+++ b/app/pengecekan/pengecekan-page.js
@@ -6,6 +6,7 @@ const LoadingIndicatorModule = require("@nstudio/nativescript-loading-indicator"
 const Xloading = new LoadingIndicatorModule();
 const snackBarModule = require("@nstudio/nativescript-snackbar").SnackBar;
 const snackbar = new snackBarModule();
+const connectivityModule = require("tns-core-modules/connectivity");
 const bottom = require("../bottom/bottom-page");
 const riwayat = require("../riwayat/riwayat-page");
 
@@ -20,8 +21,76 @@ function searchMode(search=true){
     }
 }
 
-exports.onLoaded = function(){
+function checkConnection(){
+    const type = connectivityModule.getConnectionType();
+    let message = "";
+    switch (type) {
+        case connectivityModule.connectionType.none:
+            message = "Tidak terhubung ke jaringan Internet";
+            context.set("connectedText", message);
+            context.set("connected", false);
+            break;
+        case connectivityModule.connectionType.wifi:
+            message = "Sedang terhubung menggunakan koneksi WIFI";
+            context.set("connectedText", message);
+            context.set("connected", true);
+            break;
+        case connectivityModule.connectionType.mobile:
+            message = "Sedang terhubung menggunakan koneksi Mobile";
+            context.set("connectedText", message);
+            context.set("connected", true);
+            break;
+        case connectivityModule.connectionType.ethernet:
+            message = "Sedang terhubung menggunakan koneksi Hotspot";
+            context.set("connectedText", message);
+            context.set("connected", true);
+            break;
+        default:
+            message = "Tidak terhubung ke jaringan Internet";
+            context.set("connectedText", message);
+            context.set("connected", false);
+            break;
+    }
 
+    snackbar.action({
+        actionText: "OKE",
+        actionTextColor: '#FFEB3B',
+        snackText: message,
+        textColor: '#FFFFFF',
+        hideDelay: 5000,
+        backgroundColor: '#333',
+        maxLines: 15, // Optional, Android Only
+        isRTL: false
+    });
+}
+
+function isConn(){
+    const type = connectivityModule.getConnectionType();
+    if(type === connectivityModule.connectionType.none ){
+        context.set("connectedText", "Tidak terhubung ke jaringan Internet");
+        context.set("connected", false);
+        return false;
+    } else if(type === connectivityModule.connectionType.wifi) {
+        context.set("connectedText", "Sedang terhubung menggunakan koneksi WIFI");
+        context.set("connected", true);
+        return true;
+    } else if(type === connectivityModule.connectionType.mobile){
+        context.set("connectedText", "Sedang terhubung menggunakan koneksi Mobile");
+        context.set("connected", true);
+        return true;
+    } else if(type === connectivityModule.connectionType.ethernet){
+        context.set("connectedText", "Sedang terhubung menggunakan koneksi Hotspot");
+        context.set("connected", true);
+        return true;
+    } else {
+        context.set("connectedText", "Tidak terhubung ke jaringan Internet");
+        context.set("connected", false);
+        return false;
+    }
+}
+
+exports.onLoaded = function(){
+    context.set("isValid", false);
 };
 
 exports.onNavigatingTo = function(args) {
@@ -29,78 +98,124 @@ exports.onNavigatingTo = function(args) {
     context = new Observable();
 
     searchMode();
+    checkConnection();
     
     page.bindingContext = context;
 };
 
 exports.ceknoktp = function(){
-    if((context.fullname == "" && context.nik == "") || (context.fullname == undefined && context.nik == undefined)){
-        snackbar.action({
-            actionText: "OKE",
-            actionTextColor: '#FFEB3B',
-            snackText: "Nama Lengkap & No. KTP tidak boleh kosong!",
-            textColor: '#FFFFFF',
-            hideDelay: 7000,
-            backgroundColor: '#333',
-            maxLines: 15, // Optional, Android Only
-            isRTL: false
-        });
-    } else {
-        Xloading.show(gConfig.searchOption);
-        TimerModule.setTimeout(() => {
-            NpModule.nikParse(context.nik, function(result){
-                if(result.status == "success"){
-                    let data = result.data;
-                    context.set("kelamin", data.kelamin);
-                    context.set("lahir", data.tambahan.pasaran);
-                    context.set("provinsi", data.provinsi);
-                    context.set("kotakab", data.kotakab);
-                    context.set("kecamatan", data.kecamatan);
-                    context.set("kodepos", data.tambahan.kodepos);
-                    context.set("usia", data.tambahan.usia);
-                    context.set("ultah", data.tambahan.ultah);
-                    context.set("zodiak", data.tambahan.zodiak);
-                    data.fullname = context.fullname;
-                    
-                    let a = lsHelper.insert(data);
-                    if(a.success){
-                        searchMode(false);
-                    } else {
-                        snackbar.action({
+    Xloading.show(gConfig.searchOption);
+    if(isConn()){
+        if((context.fullname == "" && context.nik == "") || (context.fullname == undefined && context.nik == undefined)){
+            snackbar.action({
+                actionText: "OKE",
+                actionTextColor: '#FFEB3B',
+                snackText: "Nama Lengkap & No. KTP tidak boleh kosong!",
+                textColor: '#FFFFFF',
+                hideDelay: 7000,
+                backgroundColor: '#333',
+                maxLines: 15, // Optional, Android Only
+                isRTL: false
+            });
+            Xloading.hide();
+        } else {
+            TimerModule.setTimeout(() => {
+                NpModule.nikParse(context.nik, function(result){
+                    if(result.status == "success"){
+                        let data = result.data;
+                        context.set("kelamin", data.kelamin);
+                        context.set("lahir", data.lahir);
+                        context.set("provinsi", data.provinsi);
+                        context.set("kotakab", data.kotakab);
+                        context.set("kecamatan", data.kecamatan);
+                        context.set("uniqcode", data.uniqcode);
+                        context.set("kodepos", data.tambahan.kodepos);
+                        context.set("pasaran", data.tambahan.pasaran);
+                        context.set("usia", data.tambahan.usia);
+                        context.set("ultah", data.tambahan.ultah);
+                        context.set("zodiak", data.tambahan.zodiak);
+                        context.set("isValid", true);
+                        context.set("status", "VALID");
+                        context.set("statusColor", "#4CAF50");
+                        context.set("datechecker", lsHelper.getCurrentTime());
+                        data.fullname = context.fullname;
+                        data.datechecker = lsHelper.getCurrentTime();
+                        
+                        let a = lsHelper.insert(data);
+                        if(a.success){
+                            searchMode(false);
+                        } else {
+                            snackbar.action({
+                                actionText: "OKE",
+                                actionTextColor: '#FFEB3B',
+                                snackText: a.message,
+                                textColor: '#FFFFFF',
+                                hideDelay: 5000,
+                                backgroundColor: '#333',
+                                maxLines: 15, // Optional, Android Only
+                                isRTL: false
+                            });
+                        }
+                    } else { 
+                        console.log(result);
+                        let a = lsHelper.insert({
+                            fullname: context.fullname,
+                            nik: context.nik,
+                            datechecker: lsHelper.getCurrentTime()
+                        });
+                        if(a.success){
+                            searchMode(false);
+                            if(result.status == "error"){
+                                context.set("isValid", false);
+                                context.set("status", "TIDAK VALID");
+                                context.set("statusColor", "#f44336");
+                                context.set("datechecker", lsHelper.getCurrentTime());
+                            }
+                        }
+                        /* snackbar.action({
                             actionText: "OKE",
                             actionTextColor: '#FFEB3B',
-                            snackText: a.message,
+                            snackText: "No. KTP tidak valid! Harap periksa kembali.",
                             textColor: '#FFFFFF',
-                            hideDelay: 5000,
+                            hideDelay: 7000,
                             backgroundColor: '#333',
                             maxLines: 15, // Optional, Android Only
                             isRTL: false
-                        });
+                        }); */
                     }
-                } else { 
-                    snackbar.action({
-                        actionText: "OKE",
-                        actionTextColor: '#FFEB3B',
-                        snackText: "No. KTP tidak valid! Harap periksa kembali.",
-                        textColor: '#FFFFFF',
-                        hideDelay: 7000,
-                        backgroundColor: '#333',
-                        maxLines: 15, // Optional, Android Only
-                        isRTL: false
-                    });
-                }
-                Xloading.hide();
+                    Xloading.hide();
+                });
+            }, 1500);
+        }
+    } else {
+        TimerModule.setTimeout(() => {
+            snackbar.action({
+                actionText: "OKE",
+                actionTextColor: '#FFEB3B',
+                snackText: "Mohon cek jaringan Internet kamu!",
+                textColor: '#FFFFFF',
+                hideDelay: 5000,
+                backgroundColor: '#333',
+                maxLines: 15, // Optional, Android Only
+                isRTL: false
             });
+            Xloading.hide();
         }, 1500);
     }
 };
 
 exports.ceklagi = function(){
-    /* context.set("fullname", "");
-    context.set("nik", ""); */
     searchMode();
 };
 
+exports.recheckConnection = function(){
+    Xloading.show(gConfig.connectionOption);
+    TimerModule.setTimeout(() => {
+        checkConnection();
+        Xloading.hide();
+    }, 3000);
+};
+
 exports.lihatriwayat = function(){
     bottom.moveToNav(1);
     riwayat.refreshPageTap();
diff --git a/app/pengecekan/pengecekan-page.xml b/app/pengecekan/pengecekan-page.xml
index 3eb2d9f..9be2aff 100644
--- a/app/pengecekan/pengecekan-page.xml
+++ b/app/pengecekan/pengecekan-page.xml
@@ -5,47 +5,71 @@
     xmlns="http://schemas.nativescript.org/tns.xsd">
 
     <GridLayout rows="*,auto,auto,*">
-        <GridLayout rows="*,auto,auto,auto,auto,auto,*" columns="30,*,30" row="1" visibility="{{ isSearchForm ? 'visible' : 'collapsed' }}">
+        <GridLayout rows="*,auto,auto,auto,auto,auto,auto,auto,*" columns="30,*,30" row="1" visibility="{{ isSearchForm ? 'visible' : 'collapsed' }}">
             <Image src="font://&#xf2c2;" color="#8130ff" width="75" decodeWidth="100" decodeHeight="100" loadMode="async" class="fas t-36" row="1" col="1" />
             <TextField hint="Nama Lengkap" text="{{ fullname }}" color="#616161" backgroundColor="#F5F5F5" paddingLeft="25" borderWidth="0" borderRadius="25" marginTop="30" returnKeyType="next" height="50" row="2" col="1" />
             <Label text="* Untuk keamanan data, pada bagian Nama Lengkap tidak harus sama dengan yang ada di KTP." textWrap="true" fontSize="11" paddingLeft="25" paddingRight="25" paddingBottom="10" color="#c62828" row="3" col="1" />
             <TextField hint="No. KTP" text="{{ nik }}" color="#616161" backgroundColor="#F5F5F5" paddingLeft="25" borderWidth="0" borderRadius="25" keyboardType="number" height="50" row="4" col="1" />
-            <Button text="CEK NO KTP" tap="ceknoktp" color="#FFF" backgroundColor="#8130ff" borderWidth="0" borderRadius="25" marginTop="35" marginLeft="35" marginRight="35" row="5" col="1" />
+            <Button text="CEK NO KTP" visibility="{{ connected ? 'visible' : 'collapsed' }}" tap="ceknoktp" color="#FFF" backgroundColor="#8130ff" borderWidth="0" borderRadius="25" marginTop="35" marginLeft="35" marginRight="35" row="5" col="1" />
+            <Label text="{{ connectedText }}" textWrap="true" fontSize="11" marginLeft="35" marginRight="35" color="#9E9E9E" row="6" col="1" marginTop="35" horizontalAlignment="center" />
+            <Button text="CEK KONEKSI INTERNET" visibility="{{ !connected ? 'visible' : 'collapsed' }}" tap="recheckConnection" color="#FFF" backgroundColor="#f44336" borderWidth="0" borderRadius="25" marginLeft="35" marginRight="35" row="7" col="1" />
         </GridLayout>
         <ScrollView height="100%" width="100%" orientation="vertical" marginTop="60" row="2" visibility="{{ isResult ? 'visible' : 'collapsed' }}">
             <StackLayout marginLeft="20" marginRight="20" marginBottom="70">
-                <Label text="No. KTP" textWrap="true" fontSize="13" color="#BDBDBD" />
-                <Label text="{{ nik }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
+                <Label text="Status KTP" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                <GridLayout columns="auto,auto">
+                    <Image src="{{ isValid ? 'font://&#xf058;' : 'font://&#xf057;' }}" class="fas" width="15" color="{{ isValid ? '#4CAF50' : '#f44336' }}" col="0" />
+                    <Label text="{{ ' ' + status }}" textWrap="true" fontSize="15" color="{{ statusColor }}" fontWeight="bold" col="1" />
+                </GridLayout>
+
+                <Label text="No. KTP" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                <Label text="{{ nik }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
                 
                 <Label text="Nama Lengkap" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-                <Label text="{{ fullname }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
-                
-                <Label text="Kelamin" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-                <Label text="{{ kelamin }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
-                
-                <Label text="Lahir" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-                <Label text="{{ lahir }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
-                
-                <Label text="Provinsi" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-                <Label text="{{ provinsi }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
-                
-                <Label text="Kota/Kab" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-                <Label text="{{ kotakab }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
+                <Label text="{{ fullname }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
                 
-                <Label text="Kecamatan" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-                <Label text="{{ kecamatan }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
+                <Label text="Dicek pada" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                <Label text="{{ datechecker }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
                 
-                <Label text="Kode Pos" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-                <Label text="{{ kodepos }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
-                
-                <Label text="Usia" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-                <Label text="{{ usia }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
-                
-                <Label text="Ulang Tahun" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-                <Label text="{{ ultah }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
-                
-                <Label text="Zodiak" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-                <Label text="{{ zodiak }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
+                <StackLayout visibility="{{ isValid ? 'visible' : 'collapsed' }}">
+                    <Label text="DATA KTP" textWrap="true" fontSize="24" color="#8130ff" marginTop="15" />
+                    <Label text="DALAM FORMAT TERBATAS" textWrap="true" fontSize="13" color="#8130ff" />
+
+                    <Label text="Kelamin" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                    <Label text="{{ kelamin }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                    
+                    <Label text="Lahir" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                    <Label text="{{ lahir }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                    
+                    <Label text="Provinsi" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                    <Label text="{{ provinsi }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                    
+                    <Label text="Kota/Kab" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                    <Label text="{{ kotakab }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                    
+                    <Label text="Kecamatan" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                    <Label text="{{ kecamatan }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                    
+                    <Label text="Uniqcode" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                    <Label text="{{ uniqcode }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                    
+                    <Label text="INFO TAMBAHAN" textWrap="true" fontSize="24" color="#8130ff" marginTop="15" />
+
+                    <Label text="Kode Pos" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                    <Label text="{{ kodepos }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                    
+                    <Label text="Pasaran" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                    <Label text="{{ pasaran }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                    
+                    <Label text="Usia" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                    <Label text="{{ usia }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                    
+                    <Label text="Ulang Tahun" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                    <Label text="{{ ultah }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                    
+                    <Label text="Zodiak" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                    <Label text="{{ zodiak }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                </StackLayout>
 
                 <Button text="CEK LAGI" tap="ceklagi" color="#FFF" backgroundColor="#8130ff" borderWidth="0" borderRadius="25" marginTop="35" />
                 <Button text="LIHAT RIWAYAT" tap="lihatriwayat" color="#8130ff" backgroundColor="#FFF" borderWidth="0" borderRadius="25" marginTop="10" />
diff --git a/app/riwayat/riwayat-detail-page.js b/app/riwayat/riwayat-detail-page.js
index 400229d..c280104 100644
--- a/app/riwayat/riwayat-detail-page.js
+++ b/app/riwayat/riwayat-detail-page.js
@@ -21,17 +21,32 @@ exports.onNavigatingTo = function(args) {
     });
 
     timerModule.setTimeout(() => {
-        context.set("fullname", ndata.data.fullname);
-        context.set("nik", ndata.data.nik);
-        context.set("kelamin", ndata.data.kelamin);
-        context.set("lahir", ndata.data.tambahan.pasaran);
-        context.set("provinsi", ndata.data.provinsi);
-        context.set("kotakab", ndata.data.kotakab);
-        context.set("kecamatan", ndata.data.kecamatan);
-        context.set("kodepos", ndata.data.tambahan.kodepos);
-        context.set("usia", ndata.data.tambahan.usia);
-        context.set("ultah", ndata.data.tambahan.ultah);
-        context.set("zodiak", ndata.data.tambahan.zodiak);
+        if(ndata.data.isValid){
+            context.set("fullname", ndata.data.fullname);
+            context.set("nik", ndata.data.nik);
+            context.set("kelamin", ndata.data.kelamin);
+            context.set("lahir", ndata.data.lahir);
+            context.set("provinsi", ndata.data.provinsi);
+            context.set("kotakab", ndata.data.kotakab);
+            context.set("kecamatan", ndata.data.kecamatan);
+            context.set("uniqcode", ndata.data.uniqcode);
+            context.set("kodepos", ndata.data.tambahan.kodepos);
+            context.set("pasaran", ndata.data.tambahan.pasaran);
+            context.set("usia", ndata.data.tambahan.usia);
+            context.set("ultah", ndata.data.tambahan.ultah);
+            context.set("zodiak", ndata.data.tambahan.zodiak);
+            context.set("isValid", ndata.data.isValid);
+            context.set("status", ndata.data.status);
+            context.set("statusColor", ndata.data.statusColor);
+            context.set("datechecker", ndata.data.datechecker);
+        } else {
+            context.set("fullname", ndata.data.fullname);
+            context.set("nik", ndata.data.nik);
+            context.set("isValid", ndata.data.isValid);
+            context.set("status", ndata.data.status);
+            context.set("statusColor", ndata.data.statusColor);
+            context.set("datechecker", ndata.data.datechecker);
+        }
     }, 150);
 
     page.bindingContext = context;
diff --git a/app/riwayat/riwayat-detail-page.xml b/app/riwayat/riwayat-detail-page.xml
index cd1e1a1..b3dcc18 100644
--- a/app/riwayat/riwayat-detail-page.xml
+++ b/app/riwayat/riwayat-detail-page.xml
@@ -9,40 +9,61 @@
     </ActionBar>
 
     <ScrollView height="100%" width="100%" orientation="vertical" marginTop="30">
-        <StackLayout marginLeft="20" marginRight="20" paddingBottom="70">
-            <Label text="No. KTP" textWrap="true" fontSize="13" color="#BDBDBD" />
-            <Label text="{{ nik }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
+        <StackLayout marginLeft="20" marginRight="20" marginBottom="70">
+            <Label text="Status KTP" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+            <GridLayout columns="auto,auto">
+                <Image src="{{ isValid ? 'font://&#xf058;' : 'font://&#xf057;' }}" class="fas" width="15" color="{{ isValid ? '#4CAF50' : '#f44336' }}" col="0" />
+                <Label text="{{ ' ' + status }}" textWrap="true" fontSize="15" color="{{ statusColor }}" fontWeight="bold" col="1" />
+            </GridLayout>
+
+            <Label text="No. KTP" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+            <Label text="{{ nik }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
             
             <Label text="Nama Lengkap" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-            <Label text="{{ fullname }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
-            
-            <Label text="Kelamin" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-            <Label text="{{ kelamin }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
-            
-            <Label text="Lahir" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-            <Label text="{{ lahir }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
-            
-            <Label text="Provinsi" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-            <Label text="{{ provinsi }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
-            
-            <Label text="Kota/Kab" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-            <Label text="{{ kotakab }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
+            <Label text="{{ fullname }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
             
-            <Label text="Kecamatan" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-            <Label text="{{ kecamatan }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
+            <Label text="Dicek pada" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+            <Label text="{{ datechecker }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
             
-            <Label text="Kode Pos" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-            <Label text="{{ kodepos }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
-            
-            <Label text="Usia" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-            <Label text="{{ usia }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
-            
-            <Label text="Ulang Tahun" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-            <Label text="{{ ultah }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
-            
-            <Label text="Zodiak" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
-            <Label text="{{ zodiak }}" textWrap="true" fontSize="15" color="#8130ff" fontWeight="bold" />
+            <StackLayout visibility="{{ isValid ? 'visible' : 'collapsed' }}">
+                <Label text="DATA KTP" textWrap="true" fontSize="24" color="#8130ff" marginTop="15" />
+                <Label text="DALAM FORMAT TERBATAS" textWrap="true" fontSize="13" color="#8130ff" />
+
+                <Label text="Kelamin" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                <Label text="{{ kelamin }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                
+                <Label text="Lahir" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                <Label text="{{ lahir }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                
+                <Label text="Provinsi" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                <Label text="{{ provinsi }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                
+                <Label text="Kota/Kab" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                <Label text="{{ kotakab }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                
+                <Label text="Kecamatan" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                <Label text="{{ kecamatan }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                
+                <Label text="Uniqcode" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                <Label text="{{ uniqcode }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                
+                <Label text="INFO TAMBAHAN" textWrap="true" fontSize="24" color="#8130ff" marginTop="15" />
 
+                <Label text="Kode Pos" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                <Label text="{{ kodepos }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                
+                <Label text="Pasaran" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                <Label text="{{ pasaran }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                
+                <Label text="Usia" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                <Label text="{{ usia }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                
+                <Label text="Ulang Tahun" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                <Label text="{{ ultah }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+                
+                <Label text="Zodiak" textWrap="true" fontSize="13" color="#BDBDBD" marginTop="10" />
+                <Label text="{{ zodiak }}" textWrap="true" fontSize="15" color="#9E9E9E" fontWeight="bold" />
+            </StackLayout>>
         </StackLayout>
     </ScrollView>
 </Page>
\ No newline at end of file
diff --git a/app/riwayat/riwayat-page.js b/app/riwayat/riwayat-page.js
index 969e2d3..95d2bf6 100644
--- a/app/riwayat/riwayat-page.js
+++ b/app/riwayat/riwayat-page.js
@@ -27,7 +27,35 @@ function loadData(){
     if(db.success){
         if(db.data.length > 0){
             dataFound();
-            datalist.push(lsHelper.get().data);
+            let data = lsHelper.get().data;
+            for (let i = 0; i < data.length; i++) {
+                if(typeof data[i].lahir !== 'undefined'){
+                    datalist.push({
+                        nik: data[i].nik,
+                        fullname: data[i].fullname,
+                        kelamin: data[i].kelamin,
+                        lahir: data[i].lahir,
+                        provinsi: data[i].provinsi,
+                        kotakab: data[i].kotakab,
+                        kecamatan: data[i].kecamatan,
+                        uniqcode: data[i].uniqcode,
+                        tambahan: data[i].tambahan,
+                        datechecker: data[i].datechecker,
+                        isValid: true,
+                        status: "VALID",
+                        statusColor: "#4CAF50"
+                    });
+                } else {
+                    datalist.push({
+                        nik: data[i].nik,
+                        fullname: data[i].fullname,
+                        datechecker: data[i].datechecker,
+                        isValid: false,
+                        status: "TIDAK VALID",
+                        statusColor: "#f44336"
+                    });
+                }
+            }
         } else {
             dataFound(false);
             datalist.push([]);
@@ -37,6 +65,7 @@ function loadData(){
         datalist.push([]);
     }
     context.set("items", datalist);
+    console.log(datalist); 
 }
 
 exports.onLoaded = function(args) {
diff --git a/app/riwayat/riwayat-page.xml b/app/riwayat/riwayat-page.xml
index 4f894a1..a4aed91 100644
--- a/app/riwayat/riwayat-page.xml
+++ b/app/riwayat/riwayat-page.xml
@@ -13,10 +13,12 @@
         <!-- <SearchBar id="searchBar" row="0" hint="Search document ..." text="{{ qeyword }}" clear="onClear" fontSize="15" submit="onSubmit" /> -->
         <ListView height="100%" row="1" items="{{ items }}" itemTap="onItemTap" separatorColor="#9E9E9E" class="list-group" visibility="{{ isFound ? 'visible' : 'collapsed' }}">
             <ListView.itemTemplate>
-                <StackLayout class="list-group-item">
-                    <Label text="{{ fullname }}" fontSize="13" textWrap="true" class="title" />
-                    <Label text="{{ nik }}" fontStyle="italic" color="#9E9E9E" textWrap="true" />
-                </StackLayout>
+                <GridLayout class="list-group-item" columns="*,auto" rows="auto,auto,auto">
+                    <Label text="{{ 'KTP ' + status }}" textWrap="true" fontSize="10" marginTop="5" color="{{ statusColor }}" fontWeight="bold" row="0" col="1" />
+                    <Label text="{{ fullname }}" fontSize="13" textWrap="true" class="title" col="0" row="0" />
+                    <Label text="{{ nik }}" fontStyle="italic" color="#9E9E9E" textWrap="true" col="0" row="1" />
+                    <Label text="{{ 'Dicek pada ' + datechecker }}" color="#BDBDBD" textWrap="true" col="0" row="2" />
+                </GridLayout>
             </ListView.itemTemplate>
         </ListView> 
         <GridLayout rows="auto,auto,auto,*" marginTop="100" row="2" class="page__content" visibility="{{ isNotFound ? 'visible' : 'collapsed' }}">