Updated datatables, using @pa instead of @js/@css, using conditionalPaging in datatables

resources/views/theme/backend/adminlte/service/widget/admin/movement.blade.php

@@ -1,13 +1,13 @@
 @use(App\Models\Service)
 <!-- Show client movements -->
 <div class="card card-dark">
-	<div class="card-header">
+	<div class="card-header p-2">
 		<h3 class="card-title">Service Movements</h3>
 	</div>
 
-	<div class="card-body">
+	<div class="card-body p-2">
 		@if(($x=Service::movements($user))->count())
-			<table class="table table-striped table-hover" id="service_movements">
+			<table class="table table-sm table-striped table-hover" id="service_movements">
 				<thead>
 				<tr>
 					<th>ID</th>
@@ -56,15 +56,13 @@
 	</div>
 </div>
 
-@section('page-styles')
-	@css(datatables,bootstrap4|rowgroup)
-@append
-@section('page-scripts')
-	@js(datatables,bootstrap4|rowgroup)
+@pa(datatables,rowgroup|conditionalpaging)
 
+@section('page-scripts')
 	<script type="text/javascript">
 		$(document).ready(function() {
-			$('#service_movements').DataTable( {
+			$('#service_movements').DataTable({
+				conditionalPaging: true,
 				order: [3, 'asc'],
 				rowGroup: {
 					dataSrc: 1,

resources/views/theme/backend/adminlte/service/widget/billinghistory.blade.php

@@ -1,5 +1,5 @@
 <!-- $o=Service::class -->
-<table class="table table-sm" id="svc_bill_hist">
+<table class="table table-sm table-striped" id="svc_bill_hist">
 	<thead>
 		<tr>
 			<th>Invoice</th>
@@ -25,15 +25,13 @@
 	</tbody>
 </table>
 
-@section('page-styles')
-	@css(datatables,bootstrap4)
-@append
-@section('page-scripts')
-	@js(datatables,bootstrap4)
+@pa(datatables,conditionalpaging)
 
+@section('page-scripts')
 	<script type="text/javascript">
 		$(document).ready(function() {
 			$('#svc_bill_hist').DataTable({
+				conditionalPaging: true,
 				language: {
 					emptyTable: "No Invoices"
 				},