diff --git a/app/Http/Controllers/AnalisaController.php b/app/Http/Controllers/AnalisaController.php
index 394904e..24729b7 100644
--- a/app/Http/Controllers/AnalisaController.php
+++ b/app/Http/Controllers/AnalisaController.php
@@ -90,14 +90,17 @@ class AnalisaController extends Controller
             }
         }
 
-        //Harga Emas
-
+        
+        $financemonth = Http::get(config('api.url') .'/portal/financeMonth/',['icno' => $kpbaru])->json();
 
+        // dd(json_encode($financemonth));
 
         
-        // $StatistikBulanan = Http::get(config('api.url') .'/portal/financeMonth/',['icno' => $kpbaru])->json();
-     
+        $financemonth = json_encode(array_values($financemonth));
+
+        // dd($financemonth);
+        
         // return view('analisa.index', compact("totalgadai",'bilangan_belum_tebus','belum_tebus','hargaemasterdahulu','bilangan_melebihi_6_bulan','bilakandilelong'));
-        return view('includes.analisaportal', compact("totalgadai",'bilangan_belum_tebus','belum_tebus','hargaemasterdahulu','bilangan_melebihi_6_bulan','bilakandilelong'));
+        return view('includes.analisaportal', compact("totalgadai",'bilangan_belum_tebus','belum_tebus','hargaemasterdahulu','bilangan_melebihi_6_bulan','bilakandilelong','financemonth'));
     }
 }
diff --git a/public/argon/js/argon.js b/public/argon/js/argon.js
index fc5d8a1..832012b 100644
--- a/public/argon/js/argon.js
+++ b/public/argon/js/argon.js
@@ -905,215 +905,3 @@ var Charts = (function() {
 	};
 
 })();
-
-//
-// Orders chart
-//
-
-var OrdersChart = (function() {
-
-	//
-	// Variables
-	//
-
-	var $chart = $('#chart-orders');
-	var $ordersSelect = $('[name="ordersSelect"]');
-
-
-	//
-	// Methods
-	//
-
-	// Init chart
-	function initChart($chart) {
-
-		var datafinance = [];
-		var PembiayaanBulanan = new Array();
-		var BayaranBulanan = new Array();
-		var NamaBulan = new Array();
-		
-		$.ajax({
-			url: api_url + '/portal/financeMonth/',
-			data:{'icno' : icno},
-			method:'GET',
-			async:false,
-			success:function(data){
-				datafinance = data;
-			}
-		});
-
-		$.each(datafinance,function(index,finance){
-			PembiayaanBulanan.push(finance['pembiayaan']);
-			BayaranBulanan.push(finance['bayaran']);
-			NamaBulan.push(finance['namabulan']);
-		});
-
-		PembiayaanBulanan.reverse();
-		BayaranBulanan.reverse();
-		NamaBulan.reverse();
-
-		const formatter = new Intl.NumberFormat('en-US', {
-		});
-
-		// Create chart
-		var ordersChart = new Chart($chart, {
-			type: 'bar',
-			options: {
-				scales: {
-					yAxes: [{
-						ticks: {
-							callback: function(value) {
-								if (!(value % 10)) {
-									//return '$' + value + 'k'
-									return formatter.format(value)
-								}
-							}
-						}
-					}]
-				},
-				tooltips: {
-					callbacks: {
-						label: function(item, data) {
-							var label = data.datasets[item.datasetIndex].label || '';
-							var yLabel = item.yLabel;
-							var content = '';
-
-							if (data.datasets.length > 1) {
-								content += '<span class="popover-body-label mr-auto">' + label + '</span>';
-							}
-
-							content += '<span class="popover-body-value">' + yLabel + '</span>';
-							
-							return content;
-						}
-					}
-				}
-			},
-			data: {
-				labels: NamaBulan,
-				datasets: [{
-					label: 'Pembiayaan',
-					data: PembiayaanBulanan
-				}]
-			}
-		});
-
-		// Save to jQuery object
-		$chart.data('chart', ordersChart);
-	}
-
-
-	// Init chart
-	if ($chart.length) {
-		initChart($chart);
-	}
-
-})();
-
-//
-// Charts
-//
-
-'use strict';
-
-//
-// Sales chart
-//
-
-var SalesChart = (function() {
-
-	// Variables
-
-	var $chart = $('#chart-sales');
-
-
-	// Methods
-
-	function init($chart) {
-
-		var datafinance = [];
-		var PembiayaanBulanan = new Array();
-		var BayaranBulanan = new Array();
-		var NamaBulan = new Array();
-		
-		$.ajax({
-			url: api_url + '/portal/financeMonth/',
-			data:{'icno' : icno},
-			method:'GET',
-			async:false,
-			success:function(data){
-				datafinance = data;
-			}
-		});
-
-		$.each(datafinance,function(index,finance){
-			PembiayaanBulanan.push(finance['pembiayaan']);
-			BayaranBulanan.push(finance['bayaran']);
-			NamaBulan.push(finance['namabulan']);
-		});
-
-		PembiayaanBulanan.reverse();
-		BayaranBulanan.reverse();
-		NamaBulan.reverse();
-
-		const formatter = new Intl.NumberFormat('en-US', {
-		});
-
-		var salesChart = new Chart($chart, {
-			type: 'line',
-			options: {
-				scales: {
-					yAxes: [{
-						gridLines: {
-							color: Charts.colors.gray[900],
-							zeroLineColor: Charts.colors.gray[900]
-						},
-						ticks: {
-							callback: function(value) {
-								if (!(value % 10)) {
-									return 'RM' + formatter.format(value);
-								}
-							}
-						}
-					}]
-				},
-				tooltips: {
-					callbacks: {
-						label: function(item, data) {
-							var label = data.datasets[item.datasetIndex].label || '';
-							var yLabel = item.yLabel;
-							var content = '';
-
-							if (data.datasets.length > 1) {
-								content += '<span class="popover-body-label mr-auto">' + label + '</span>';
-							}
-
-							content += '<span class="popover-body-value">RM' + formatter.format(yLabel) + '</span>';
-							return content;
-						}
-					}
-				}
-			},
-			data: {
-				labels: NamaBulan,
-				datasets: [{
-					label: 'Prestasi',
-					data: BayaranBulanan
-				}]
-			}
-		});
-
-		// Save to jQuery object
-
-		$chart.data('chart', salesChart);
-
-	};
-
-
-	// Events
-
-	if ($chart.length) {
-		init($chart);
-	}
-
-})();
diff --git a/resources/views/includes/analisaportal.blade.php b/resources/views/includes/analisaportal.blade.php
index 03b5aec..3df6afc 100644
--- a/resources/views/includes/analisaportal.blade.php
+++ b/resources/views/includes/analisaportal.blade.php
@@ -191,7 +191,7 @@
                                 @foreach($belum_tebus as $index1=>$bt)
                                 <tr>
                                     <td>{{ $bt['norujukan'] }}</td>
-                                    <td>{{ $bt['pinjaman'] }}</td>
+                                    <td>{{ number_format($bt['pinjaman'],2) }}</td>
                                 </tr>
                                 @endforeach
                                 <!-- <tr>
@@ -266,7 +266,11 @@
 <script>
     var api_url = "{{  config('api.url') }}";
     var icno = "{{ Auth::User()->icno }}";
+    var datafin = "{{ $financemonth }}";
 
+    datafin = datafin.replace(/&quot;/g, '\"');
+    datafin = JSON.parse(datafin);
+   
     var hargaemastable = $('#harga_emas').DataTable({
         "bLengthChange": false,
         "bFilter": false,
@@ -295,6 +299,601 @@
             }
         }
     });
+
+
+
+//
+// Charts
+//
+
+'use strict';
+
+var Charts = (function() {
+
+	// Variable
+
+	var $toggle = $('[data-toggle="chart"]');
+	var mode = 'light';//(themeMode) ? themeMode : 'light';
+	var fonts = {
+		base: 'Open Sans'
+	}
+
+	// Colors
+	var colors = {
+		gray: {
+			100: '#f6f9fc',
+			200: '#e9ecef',
+			300: '#dee2e6',
+			400: '#ced4da',
+			500: '#adb5bd',
+			600: '#8898aa',
+			700: '#525f7f',
+			800: '#32325d',
+			900: '#212529'
+		},
+		theme: {
+			'default': '#172b4d',
+			'primary': '#5e72e4',
+			'secondary': '#f4f5f7',
+			'info': '#11cdef',
+			'success': '#2dce89',
+			'danger': '#f5365c',
+			'warning': '#fb6340'
+		},
+		black: '#12263F',
+		white: '#FFFFFF',
+		transparent: 'transparent',
+	};
+
+
+	// Methods
+
+	// Chart.js global options
+	function chartOptions() {
+
+		// Options
+		var options = {
+			defaults: {
+				global: {
+					responsive: true,
+					maintainAspectRatio: false,
+					defaultColor: (mode == 'dark') ? colors.gray[700] : colors.gray[600],
+					defaultFontColor: (mode == 'dark') ? colors.gray[700] : colors.gray[600],
+					defaultFontFamily: fonts.base,
+					defaultFontSize: 13,
+					layout: {
+						padding: 0
+					},
+					legend: {
+						display: false,
+						position: 'bottom',
+						labels: {
+							usePointStyle: true,
+							padding: 16
+						}
+					},
+					elements: {
+						point: {
+							radius: 0,
+							backgroundColor: colors.theme['primary']
+						},
+						line: {
+							tension: .4,
+							borderWidth: 4,
+							borderColor: colors.theme['primary'],
+							backgroundColor: colors.transparent,
+							borderCapStyle: 'rounded'
+						},
+						rectangle: {
+							backgroundColor: colors.theme['warning']
+						},
+						arc: {
+							backgroundColor: colors.theme['primary'],
+							borderColor: (mode == 'dark') ? colors.gray[800] : colors.white,
+							borderWidth: 4
+						}
+					},
+					tooltips: {
+						enabled: false,
+						mode: 'index',
+						intersect: false,
+						custom: function(model) {
+
+							// Get tooltip
+							var $tooltip = $('#chart-tooltip');
+
+							// Create tooltip on first render
+							if (!$tooltip.length) {
+								$tooltip = $('<div id="chart-tooltip" class="popover bs-popover-top" role="tooltip"></div>');
+
+								// Append to body
+								$('body').append($tooltip);
+							}
+
+							// Hide if no tooltip
+							if (model.opacity === 0) {
+								$tooltip.css('display', 'none');
+								return;
+							}
+
+							function getBody(bodyItem) {
+								return bodyItem.lines;
+							}
+
+							// Fill with content
+							if (model.body) {
+								var titleLines = model.title || [];
+								var bodyLines = model.body.map(getBody);
+								var html = '';
+
+								// Add arrow
+								html += '<div class="arrow"></div>';
+
+								// Add header
+								titleLines.forEach(function(title) {
+									html += '<h3 class="popover-header text-center">' + title + '</h3>';
+								});
+
+								// Add body
+								bodyLines.forEach(function(body, i) {
+									var colors = model.labelColors[i];
+									var styles = 'background-color: ' + colors.backgroundColor;
+									var indicator = '<span class="badge badge-dot"><i class="bg-primary"></i></span>';
+									var align = (bodyLines.length > 1) ? 'justify-content-left' : 'justify-content-center';
+									html += '<div class="popover-body d-flex align-items-center ' + align + '">' + indicator + body + '</div>';
+								});
+
+								$tooltip.html(html);
+							}
+
+							// Get tooltip position
+							var $canvas = $(this._chart.canvas);
+
+							var canvasWidth = $canvas.outerWidth();
+							var canvasHeight = $canvas.outerHeight();
+
+							var canvasTop = $canvas.offset().top;
+							var canvasLeft = $canvas.offset().left;
+
+							var tooltipWidth = $tooltip.outerWidth();
+							var tooltipHeight = $tooltip.outerHeight();
+
+							var top = canvasTop + model.caretY - tooltipHeight - 16;
+							var left = canvasLeft + model.caretX - tooltipWidth / 2;
+
+							// Display tooltip
+							$tooltip.css({
+								'top': top + 'px',
+								'left': left + 'px',
+								'display': 'block',
+								'z-index': '100'
+							});
+
+						},
+						callbacks: {
+							label: function(item, data) {
+								var label = data.datasets[item.datasetIndex].label || '';
+								var yLabel = item.yLabel;
+								var content = '';
+
+								if (data.datasets.length > 1) {
+									content += '<span class="badge badge-primary mr-auto">' + label + '</span>';
+								}
+
+								content += '<span class="popover-body-value">' + yLabel + '</span>' ;
+								return content;
+							}
+						}
+					}
+				},
+				doughnut: {
+					cutoutPercentage: 83,
+					tooltips: {
+						callbacks: {
+							title: function(item, data) {
+								var title = data.labels[item[0].index];
+								return title;
+							},
+							label: function(item, data) {
+								var value = data.datasets[0].data[item.index];
+								var content = '';
+
+								content += '<span class="popover-body-value">' + value + '</span>';
+								return content;
+							}
+						}
+					},
+					legendCallback: function(chart) {
+						var data = chart.data;
+						var content = '';
+
+						data.labels.forEach(function(label, index) {
+							var bgColor = data.datasets[0].backgroundColor[index];
+
+							content += '<span class="chart-legend-item">';
+							content += '<i class="chart-legend-indicator" style="background-color: ' + bgColor + '"></i>';
+							content += label;
+							content += '</span>';
+						});
+
+						return content;
+					}
+				}
+			}
+		}
+
+		// yAxes
+		Chart.scaleService.updateScaleDefaults('linear', {
+			gridLines: {
+				borderDash: [2],
+				borderDashOffset: [2],
+				color: (mode == 'dark') ? colors.gray[900] : colors.gray[300],
+				drawBorder: false,
+				drawTicks: false,
+				lineWidth: 0,
+				zeroLineWidth: 0,
+				zeroLineColor: (mode == 'dark') ? colors.gray[900] : colors.gray[300],
+				zeroLineBorderDash: [2],
+				zeroLineBorderDashOffset: [2]
+			},
+			ticks: {
+				beginAtZero: true,
+				padding: 10,
+				callback: function(value) {
+					if (!(value % 10)) {
+						return value
+					}
+				}
+			}
+		});
+
+		// xAxes
+		Chart.scaleService.updateScaleDefaults('category', {
+			gridLines: {
+				drawBorder: false,
+				drawOnChartArea: false,
+				drawTicks: false
+			},
+			ticks: {
+				padding: 20
+			},
+			maxBarThickness: 10
+		});
+
+		return options;
+
+	}
+
+	// Parse global options
+	function parseOptions(parent, options) {
+		for (var item in options) {
+			if (typeof options[item] !== 'object') {
+				parent[item] = options[item];
+			} else {
+				parseOptions(parent[item], options[item]);
+			}
+		}
+	}
+
+	// Push options
+	function pushOptions(parent, options) {
+		for (var item in options) {
+			if (Array.isArray(options[item])) {
+				options[item].forEach(function(data) {
+					parent[item].push(data);
+				});
+			} else {
+				pushOptions(parent[item], options[item]);
+			}
+		}
+	}
+
+	// Pop options
+	function popOptions(parent, options) {
+		for (var item in options) {
+			if (Array.isArray(options[item])) {
+				options[item].forEach(function(data) {
+					parent[item].pop();
+				});
+			} else {
+				popOptions(parent[item], options[item]);
+			}
+		}
+	}
+
+	// Toggle options
+	function toggleOptions(elem) {
+		var options = elem.data('add');
+		var $target = $(elem.data('target'));
+		var $chart = $target.data('chart');
+
+		if (elem.is(':checked')) {
+
+			// Add options
+			pushOptions($chart, options);
+
+			// Update chart
+			$chart.update();
+		} else {
+
+			// Remove options
+			popOptions($chart, options);
+
+			// Update chart
+			$chart.update();
+		}
+	}
+
+	// Update options
+	function updateOptions(elem) {
+		var options = elem.data('update');
+		var $target = $(elem.data('target'));
+		var $chart = $target.data('chart');
+
+		// Parse options
+		parseOptions($chart, options);
+
+		// Toggle ticks
+		toggleTicks(elem, $chart);
+
+		// Update chart
+		$chart.update();
+	}
+
+	// Toggle ticks
+	function toggleTicks(elem, $chart) {
+
+		if (elem.data('prefix') !== undefined || elem.data('prefix') !== undefined) {
+			var prefix = elem.data('prefix') ? elem.data('prefix') : '';
+			var suffix = elem.data('suffix') ? elem.data('suffix') : '';
+
+			// Update ticks
+			$chart.options.scales.yAxes[0].ticks.callback = function(value) {
+				if (!(value % 10)) {
+					return prefix + value + suffix;
+				}
+			}
+
+			// Update tooltips
+			$chart.options.tooltips.callbacks.label = function(item, data) {
+				var label = data.datasets[item.datasetIndex].label || '';
+				var yLabel = item.yLabel;
+				var content = '';
+
+				if (data.datasets.length > 1) {
+					content += '<span class="popover-body-label mr-auto">' + label + '</span>';
+				}
+
+				content += '<span class="popover-body-value">' + prefix + yLabel + suffix + '</span>';
+				return content;
+			}
+
+		}
+	}
+
+
+	// Events
+
+	// Parse global options
+	if (window.Chart) {
+		parseOptions(Chart, chartOptions());
+	}
+
+	// Toggle options
+	$toggle.on({
+		'change': function() {
+			var $this = $(this);
+
+			if ($this.is('[data-add]')) {
+				toggleOptions($this);
+			}
+		},
+		'click': function() {
+			var $this = $(this);
+
+			if ($this.is('[data-update]')) {
+				updateOptions($this);
+			}
+		}
+	});
+
+
+	// Return
+
+	return {
+		colors: colors,
+		fonts: fonts,
+		mode: mode
+	};
+
+})();
+
+
+//
+// Orders chart
+//
+
+var OrdersChart = (function() {
+
+//
+// Variables
+//
+
+var $chart = $('#chart-orders');
+var $ordersSelect = $('[name="ordersSelect"]');
+
+
+//
+// Methods
+//
+
+// Init chart
+function initChart($chart) {
+
+    var PembiayaanBulanan = new Array();
+    var BayaranBulanan = new Array();
+    var NamaBulan = new Array();
+    
+
+    $.each(datafin,function(index,finance){
+        PembiayaanBulanan.push(finance['pembiayaan']);
+        BayaranBulanan.push(finance['bayaran']);
+        NamaBulan.push(finance['namabulan']);
+    });
+
+
+    const formatter = new Intl.NumberFormat('en-US', {
+    });
+
+    // Create chart
+    var ordersChart = new Chart($chart, {
+        type: 'bar',
+        options: {
+            scales: {
+                yAxes: [{
+                    ticks: {
+                        callback: function(value) {
+                            if (!(value % 10)) {
+                                //return '$' + value + 'k'
+                                return formatter.format(value)
+                            }
+                        }
+                    }
+                }]
+            },
+            tooltips: {
+                callbacks: {
+                    label: function(item, data) {
+                        var label = data.datasets[item.datasetIndex].label || '';
+                        var yLabel = item.yLabel;
+                        var content = '';
+
+                        if (data.datasets.length > 1) {
+                            content += '<span class="popover-body-label mr-auto">' + label + '</span>';
+                        }
+
+                        content += '<span class="popover-body-value">' + yLabel + '</span>';
+                        
+                        return content;
+                    }
+                }
+            }
+        },
+        data: {
+            labels: NamaBulan,
+            datasets: [{
+                label: 'Pembiayaan',
+                data: PembiayaanBulanan
+            }]
+        }
+    });
+
+    // Save to jQuery object
+    $chart.data('chart', ordersChart);
+}
+
+
+// Init chart
+if ($chart.length) {
+    initChart($chart);
+}
+
+})();
+
+//
+// Charts
+//
+
+'use strict';
+
+//
+// Sales chart
+//
+
+var SalesChart = (function() {
+
+// Variables
+
+var $chart = $('#chart-sales');
+
+
+// Methods
+
+function init($chart) {
+
+    var PembiayaanBulanan = new Array();
+    var BayaranBulanan = new Array();
+    var NamaBulan = new Array();
+    
+    $.each(datafin,function(index,finance){
+        PembiayaanBulanan.push(finance['pembiayaan']);
+        BayaranBulanan.push(finance['bayaran']);
+        NamaBulan.push(finance['namabulan']);
+    });
+
+    
+    const formatter = new Intl.NumberFormat('en-US', {
+    });
+
+    var salesChart = new Chart($chart, {
+        type: 'bar',
+        options: {
+            scales: {
+                yAxes: [{
+                    gridLines: {
+                        color: Charts.colors.gray[900],
+                        zeroLineColor: Charts.colors.gray[900]
+                    },
+                    ticks: {
+                        callback: function(value) {
+                            if (!(value % 10)) {
+                                return 'RM' + formatter.format(value);
+                            }
+                        }
+                    }
+                }]
+            },
+            tooltips: {
+                callbacks: {
+                    label: function(item, data) {
+                        var label = data.datasets[item.datasetIndex].label || '';
+                        var yLabel = item.yLabel;
+                        var content = '';
+
+                        if (data.datasets.length > 1) {
+                            content += '<span class="popover-body-label mr-auto">' + label + '</span>';
+                        }
+
+                        content += '<span class="popover-body-value">RM' + formatter.format(yLabel) + '</span>';
+                        return content;
+                    }
+                }
+            }
+        },
+        data: {
+            labels: NamaBulan,
+            datasets: [{
+                label: 'Prestasi',
+                data: BayaranBulanan
+            }]
+        }
+    });
+
+    // Save to jQuery object
+
+    $chart.data('chart', salesChart);
+
+};
+
+
+// Events
+
+if ($chart.length) {
+    init($chart);
+}
+
+})();
+
 </script>
 
 @endsection
\ No newline at end of file
diff --git a/resources/views/includes/bayaran/pembayaransag.blade.php b/resources/views/includes/bayaran/pembayaransag.blade.php
index 0f236fe..b16e4d2 100644
--- a/resources/views/includes/bayaran/pembayaransag.blade.php
+++ b/resources/views/includes/bayaran/pembayaransag.blade.php
@@ -115,7 +115,7 @@
                                             <th>No</th>
                                             <th>No Rujukan</th>
                                             <th>Pembiayaan Asal</th>
-                                            <th>B. Pembiayaan</th>
+                                            <th>Baki Pembiayaan</th>
                                             <th>Tempoh</th>
                                             <th>Keuntungan</th>
                                             <th>Bayaran</th>
@@ -266,7 +266,7 @@
                                             {{ $bayar['norujukan'] }}
                                         </td>
                                         <td>
-                                            <script>$("input[name=txtbayarantawarruq]")</script>
+                                            <p id="spantransaksi{{ $counter }}">0.00</p>
                                         </td>
 
                                     </tr>
@@ -293,7 +293,8 @@
                 </div>
 
 
-                <div class="d-flex justify-content-end col-12 mt-3 align-self-end">
+                <div class="d-flex justify-content-between col-12 mt-3 align-self-end">
+                    <a href="{{ route('pembayaransag') }}" type="button" class="btn btn-danger">Batal</a>
                     <button type="submit" id="bayarsbmt" class="btn btn-primary" disabled onclick="loadingbtn();">Bayar</button>
                 </div>
             </div>
@@ -302,6 +303,16 @@
 </div>
 
 <script>
+
+    $(document).ready(function() {
+    $(window).keydown(function(event){
+        if(event.keyCode == 13) {
+        event.preventDefault();
+        return false;
+        }
+    });
+    });
+
     const formatter = new Intl.NumberFormat('en-US', {
         minimumFractionDigits: 2
     });
@@ -348,8 +359,6 @@
         return false;
     }
 
-    // let total = 0;
-
     $("select[name=sltbayaran]").change(function(e) {
         let selected = $('option:selected', this).attr('value');
         let jenis = $(this).data('jenis');
@@ -365,6 +374,8 @@
         } else {
             // $(this).closest('tr').find("input").val();
             $(this).closest('tr').find("input").attr('readonly', false);
+            $(this).closest('tr').find(".txtbayaran").val(upah);
+            $(this).closest('tr').find(".bayaran").val(upah);
             calculateall(jenis, taglel);
 
         }
@@ -424,6 +435,18 @@
             $(this).closest('tr').find('.bayaran').val(upah);
             calculateall(jenis, taglel);
             return false;
+        }else if(bayar < parseFloat(upah) && parseFloat(upah) !== 0.00)
+        {
+            $("#bayarsbmt").prop('disabled', false);
+            Swal.fire(
+                'Amaran!',
+                'Bayaran tidak boleh kurang daripada upah!',
+                'error'
+            )
+            $(this).val(upah);
+            $(this).closest('tr').find('.bayaran').val(upah);
+            calculateall(jenis, taglel);
+            return false;
         }
 
         $(this).closest('tr').find('.bayaran').val(this.value);
@@ -446,7 +469,10 @@
 
         });
 
-        $('#selepas_tawarruq').find('input[name=txtbayarantawarruq]').each(function() {
+        $('#selepas_tawarruq').find('input[name=txtbayarantawarruq]').each(function(index) {
+
+            $('#spantransaksi' + (index+1)).text(formatter.format(this.value));
+
             sumtawarruq += parseFloat(this.value) || 0;
 
             if (this.value <= 0 || this.value == '') {
@@ -471,7 +497,6 @@
         window.addEventListener('pageshow', function(event) {
                 if (event.persisted || window.performance && window.performance.navigation.type == 2) {
                     $('#logout-form').submit();
-                    // location.reload();
                 }
             },
             false);
diff --git a/resources/views/includes/bayaran/senaraibayaransag.blade.php b/resources/views/includes/bayaran/senaraibayaransag.blade.php
index efeb303..8d7cb91 100644
--- a/resources/views/includes/bayaran/senaraibayaransag.blade.php
+++ b/resources/views/includes/bayaran/senaraibayaransag.blade.php
@@ -36,7 +36,7 @@
         </nav>
     </div>
 </div>
-
+{{-- 
 <div class="row justify-space-between py-2">
     <div class="col-lg-6 col-md-8 col-sm-6 mx-auto">
         <div class="nav-wrapper position-relative end-0">
@@ -49,9 +49,10 @@
             </ul>
         </div>
     </div>
-</div>
+</div> --}}
 
-<div class="container col-11 shadow-lg p-3 bg-white rounded">
+{{-- <div class="container col-11 shadow-lg p-3 bg-white rounded"> --}}
+<div class="container col-11 p-3">
     <div class="tab-content tab-space">
         <form method="post" action="{{ route('payment.action') }}" onsubmit="return validateform()">
             @csrf
@@ -66,11 +67,12 @@
                                     <thead class="thead-light">
                                         <tr>
                                             <th>#</th>
+                                            <th>Ar-Rahn</th>
                                             <th>No Rujukan</th>
-                                            <th>Pembiayaan</th>
-                                            <th>B. Pembiayaan</th>
-                                            <th>Keuntungan (6bulan)</th>
-                                            <th>Keuntungan</th>
+                                            <th>Pembiayaan Asal</th>
+                                            <th>Baki Pembiayaan</th>
+                                            <th>Keuntungan Semasa</th>
+                                            <th>Status</th>
                                         </tr>
                                     </thead>
                                     <tbody class="list">
@@ -104,9 +106,15 @@
                                             @endphp
                                             <tr {{ ($searchonline) ? 'style=background-color:#81ecec;' : '' }}>
                                                 <td>
-                                                    <input type="checkbox" name="chkboxsag[]" value="{{ $bt['norujukan'] }}" id="sag-{{ $loop->iteration }}" data-norujukan="{{ $bt['norujukan'] }}" {{ ($searchonline || $koskeuntungan <= 0) ? 'disabled' : '' }} />
+                                                    <input type="checkbox" name="chkboxsag[]" value="{{ $bt['norujukan'] }}" id="sag-{{ $loop->iteration }}" data-norujukan="{{ $bt['norujukan'] }}" {{ ($searchonline) ? 'disabled' : '' }} />
                                                     {{-- <i data-toggle="tooltip" title="Hooray!" class="fas fa-exclamation-circle ml-3 text-right" style="font-size: 20px;"></i> --}}
                                                 </td>
+                                                <td>
+                                                    @php
+                                                        $namacawangan = Http::get(config('api.url') . '/api/cawangan/detail/' . $bt['kodcaw'] )->json();
+                                                        echo ucwords(strtolower(substr($namacawangan[0]['namacaw'],8)));
+                                                    @endphp
+                                                </td>
                                                 <th scope="row">
                                                     <div class="media align-items-center">
                                                         <div class="media-body">
@@ -124,10 +132,12 @@
                                                     {{ number_format($bt['bakipjm'],2) }}
                                                 </td>
                                                 <td>
-                                                    {{ number_format($bt['bakiupah'],2) }}
+                                                    {{ is_numeric($koskeuntungan) ? number_format($koskeuntungan,2) :  $koskeuntungan }}
                                                 </td>
                                                 <td>
-                                                    {{ number_format($koskeuntungan,2) }}
+                                                    @if($bt['taglel'] === 1)
+                                                        <span class="badge alert-danger">Akan Dilelong</span>
+                                                    @endif
                                                 </td>
                                             </tr>
                                             @endif
@@ -141,8 +151,8 @@
                 </div>
             </div>
 
-            <div class="d-flex justify-content-end mt-2">
-                <button type="submit" class="btn btn-primary" onclick="loadingbtn();">Checkout <span class="rounded bg-red ml-2 pr-1 pl-1" id="totalsag">0</span></button>
+            <div class="d-flex justify-content-end mt-4">
+                <button type="submit" class="btn btn-primary" onclick="loadingbtn();"><span class="mr-3">Checkout</span> <span class="badge alert-warning text-dark font-weight-bold" style="font-size:12px;" id="totalsag">0</span></button>
             </div>
 
         </form>
@@ -151,21 +161,21 @@
 </div>
 
 <script>
-    var belumtawarruqtable = $('#belum_tawarruq').DataTable({
-        "bLengthChange": false,
-        "bFilter": true,
-        "pagingType": "numbers",
-        "paging" : false,
-        language: {
-            'paginate': {
-                'previous': '<span class="fas fa-backward fa-1.5x"></span>',
-                'next': '<span class="fas fa-forward"></span>'
-            }
-        },
-        "pageLength": 10,
-        "scrollX": true
+    // var belumtawarruqtable = $('#belum_tawarruq').DataTable({
+    //     "bLengthChange": false,
+    //     "bFilter": true,
+    //     "pagingType": "numbers",
+    //     "paging" : false,
+    //     language: {
+    //         'paginate': {
+    //             'previous': '<span class="fas fa-backward fa-1.5x"></span>',
+    //             'next': '<span class="fas fa-forward"></span>'
+    //         }
+    //     },
+    //     "pageLength": 10,
+    //     "scrollX": true
 
-    });
+    // });
 
     var selepastawarruqtable = $('#selepas_tawarruq').DataTable({
         "bLengthChange": false,
@@ -186,7 +196,13 @@
         var count = parseInt($('#totalsag').text());
         if ($(this).is(':checked')) {
             var total = count + 1;
-            $('#totalsag').text(total);
+
+            if(total <= 3)
+            {
+                $('#totalsag').text(total);
+            }else{
+                $(this).prop('checked', false);
+            }
         } else {
             var total = count - 1;
             $('#totalsag').text(total);
diff --git a/resources/views/includes/home.blade.php b/resources/views/includes/home.blade.php
index 645e3af..d037cd6 100644
--- a/resources/views/includes/home.blade.php
+++ b/resources/views/includes/home.blade.php
@@ -34,7 +34,7 @@
         </div>
         <div class="card-body text-center">
             <h5 class="font-weight-normal">
-                <a>Rekod Pembelian</a>
+                <a>Rekod Pembayaran</a>
             </h5>
             <a type="button" href="{{ route('semaksag') }}" class="btn bg-gradient-primary btn-sm mb-0 mt-3">Enter</a>
         </div>
@@ -82,7 +82,7 @@
         </div>
         <div class="card-body text-center">
             <h5 class="font-weight-normal">
-                <a>Analisa</a>
+                <a>Ringkasan Transaksi Pembiayaan</a>
             </h5>
             <a type="button" href="{{ route('analisa.index') }}" class="btn bg-gradient-primary btn-sm mb-0 mt-3">Enter</a>
         </div>
diff --git a/resources/views/includes/main/head.blade.php b/resources/views/includes/main/head.blade.php
index 424d0d7..bcd7068 100644
--- a/resources/views/includes/main/head.blade.php
+++ b/resources/views/includes/main/head.blade.php
@@ -118,8 +118,8 @@
 
 <script>
     $(function() {
-        setTimeout(() => {
+        // setTimeout(() => {
             $(".portalloader").fadeOut(300);
-        }, 300)
+        // }, 300)
     })
 </script>
\ No newline at end of file
diff --git a/resources/views/includes/main/navigation.blade.php b/resources/views/includes/main/navigation.blade.php
index e5e0325..89ca5af 100644
--- a/resources/views/includes/main/navigation.blade.php
+++ b/resources/views/includes/main/navigation.blade.php
@@ -78,7 +78,7 @@
                     </button>
                     <div class="collapse navbar-collapse pt-3 pb-2 py-lg-0 w-100" id="navigation">
                         <ul class="navbar-nav navbar-nav-hover ms-auto">
-                            <li class="nav-item ms-lg-auto">
+                            {{-- <li class="nav-item ms-lg-auto">
                                 <a class="nav-link nav-link-icon me-2" href="{{ route('semaksag') }}">
                                     <i class="fa fa-list-alt me-1"></i>
                                     <p class="d-inline text-sm z-index-1 font-weight-bold" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Senarai Rekod Gadaian & Tebusan">Rekod Pembelian</p>
@@ -95,7 +95,7 @@
                                     <i class="fa fa-line-chart me-1"></i>
                                     <p class="d-inline text-sm z-index-1 font-weight-bold" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Analisa Marhun">Analisa</p>
                                 </a>
-                            </li>
+                            </li> --}}
                             <li class="nav-item ms-lg-auto">
                                 <a class="nav-link nav-link-icon me-2" href="{{ route('profile.edit') }}">
                                     <i class="fa fa-user me-1"></i>
@@ -103,7 +103,7 @@
                                 </a>
                             </li>
                             <li class="nav-item my-auto ms-3 ms-lg-0">
-                                <a href="{{ route('logout') }}" class="btn btn-sm  bg-white  mb-0 me-1 mt-2 mt-md-0" onclick="event.preventDefault();document.getElementById('logout-form').submit();">
+                                <a href="{{ route('logout') }}" class="btn btn-sm bg-white border mb-0 me-1 mt-2 mt-md-0" onclick="event.preventDefault();document.getElementById('logout-form').submit();">
                                     <span>{{ __('Logout') }}</span>
                                 </a>
                     </div>
diff --git a/resources/views/includes/rekod/pilihcawangan.blade.php b/resources/views/includes/rekod/pilihcawangan.blade.php
index cea9c12..88cb686 100644
--- a/resources/views/includes/rekod/pilihcawangan.blade.php
+++ b/resources/views/includes/rekod/pilihcawangan.blade.php
@@ -41,8 +41,8 @@
         <p class="lead text-dark pe-md-5 me-md-5">
             Sila pilih cawangan
         </p>
-        <select class="form-select" aria-label="Default select example" name="sltcawangan">
-            <option selected disabled>Open this select menu</option>
+        <select class="form-select custom-select" aria-label="Default select example" name="sltcawangan">
+            <option selected disabled>Pilihan Cawangan</option>
             @foreach($cawangan as $index1=>$caw)
             <option value="{{ $caw['kodcaw'] }}">{{ $caw['namacawangan'] }}</option>
             <input type="hidden" name="namacawangan" id="namacawangan" value="{{ $caw['namacawangan'] }}">
diff --git a/resources/views/includes/rekod/rekodsag.blade.php b/resources/views/includes/rekod/rekodsag.blade.php
index f659559..e00e1f1 100644
--- a/resources/views/includes/rekod/rekodsag.blade.php
+++ b/resources/views/includes/rekod/rekodsag.blade.php
@@ -84,7 +84,7 @@
 <hr class="dark my-md-6 mt-2 mx-7"> -->
 <div class="container col-11 shadow-lg p-3 mb-5 bg-white rounded">
     <div class="card-header border-0">
-        <h5 class="mb-0 text-primary">Tawarruq</h5>
+        <h5 class="mb-0 text-primary">Transaksi Bayaran</h5>
     </div>
     <!-- Light table -->
     <div class="table-responsive table-bordered">
@@ -144,7 +144,7 @@
 <!-- <hr class="dark my-md-6 mt-2 mx-7"> -->
 <div class="container col-11 shadow-lg p-3 mb-5 bg-white rounded">
     <div class="card-header border-0">
-        <h5 class="mb-0 text-primary">Penyata Terdahulu</h5>
+        <h5 class="mb-0 text-primary">Penyata Yang Sudah Ditebus</h5>
     </div>
     <!-- Light table -->
     <div class="table-responsive table-bordered">
@@ -163,6 +163,7 @@
             </thead>
             <tbody class="list">
                 @foreach($sudah_tebus as $index=>$st)
+                @if($st['hargajualan'] != '')
                 <tr style="text-align: center;">
                     <th scope="row">
                         <div class="media align-items-center">
@@ -193,6 +194,7 @@
                         {{ $st['t_update'] }}
                     </td>
                 </tr>
+                @endif
                 @endforeach
             </tbody>
         </table>
@@ -223,13 +225,9 @@
     });
 
     var selepastawarruqtable = $('#selepas_tawarruq').DataTable({
-        // dom: 'Bfrtip',
-        // buttons: [
-        //   'copy', 'excel', 'pdf'
-        // ],
         "bLengthChange": false,
         "bFilter": true,
-        "pagingType": "simple",
+        // "pagingType": "simple_numbers",
         "pageLength": 5,
         language: {
             'paginate': {
@@ -245,7 +243,7 @@
     var sudahtebustable = $('#saghistory').DataTable({
         "bLengthChange": false,
         "bFilter": true,
-        "pagingType": "simple",
+        // "pagingType": "simple",
         "pageLength": 5,
         language: {
             'paginate': {
diff --git a/resources/views/penyata/penyata.blade.php b/resources/views/penyata/penyata.blade.php
index 8ce6b9e..7241277 100644
--- a/resources/views/penyata/penyata.blade.php
+++ b/resources/views/penyata/penyata.blade.php
@@ -215,6 +215,8 @@
             <td>{{ number_format($gad['pinjaman'],2) }}</td>
     </tr>
     @endforeach
+    @php $total = $gad['pinjaman'];@endphp
+
     @foreach($transaction as $index=>$trans)
     <tr>
             <td>@php 
@@ -227,12 +229,16 @@
                 switch($trans['trans_type']){
 
                     case 'T': echo 'Pembayaran Tebus';
+                            $penebusan = 'T';
                     break;
                     case 'A': echo 'Pembayaran Ansuran';
+                            $penebusan = 'A';
                     break;
                     case 'S': echo 'Pembayaran Tebus Sebahagian';
+                            $penebusan = 'S';
                     break;
                     case 'P': echo 'Pembayaran Tambah Pinjaman';
+                            $penebusan = 'P';
                     break;
                 }
 
@@ -246,8 +252,9 @@
                 <td>{{ number_format($trans['duit_masuk'],2) }}</td>
                 <td></td>
             @endif
+            {{-- <td>{{ number_format($trans['bakiharga'],2) }}</td> --}}
+            <td>@php  $total = floatval($total) - floatval($trans['duit_masuk']); if($total < 0) echo '0.00'; else echo number_format($total,2); @endphp</td>
 
-            <td>{{ number_format($trans['bakiharga'],2) }}</td>
     </tr>
     @endforeach
     <tr>
@@ -256,7 +263,7 @@
         <td></td>
         <td></td>
         <td></td>
-        <td style="font-weight:bold;">{{ number_format($gad['bakipjm'],2) }}</td>
+        <td style="font-weight:bold;">{{ ($penebusan === 'T') ? '0.00' : number_format($gad['bakipjm'],2) }}</td>
     </tr>
     </table>