Datatables new layout
This commit is contained in:
24
resources/views/components/card.blade.php
Normal file
24
resources/views/components/card.blade.php
Normal file
@@ -0,0 +1,24 @@
|
||||
<div class="card mb-0 {{ isset($tabs) ? ($outline ?? config('boilerplate.theme.card.outline', false)) ? 'card-outline-tabs' : 'card-tabs' : ''}} {{ ($outline ?? config('boilerplate.theme.card.outline', false)) ? 'card-outline' : '' }} card-{{ $color ?? config('boilerplate.theme.card.default_color', 'info') }}">
|
||||
@if($title ?? $header ?? false)
|
||||
<div class="card-header {{ isset($tabs) ? ($outline ?? config('boilerplate.theme.card.outline', false)) ? 'p-0' : 'p-0 pt-1' : '' }} border-bottom-0">
|
||||
@isset($header)
|
||||
{{ $header }}
|
||||
@else
|
||||
<h3 class="card-title">{{ $title }}</h3>
|
||||
@isset($tools)
|
||||
<div class="card-tools">
|
||||
{{ $tools }}
|
||||
</div>
|
||||
@endisset
|
||||
@endisset
|
||||
</div>
|
||||
@endif
|
||||
<div class="card-body {{ $title ?? false ? ($outline ?? config('boilerplate.theme.card.outline', false)) ? 'pt-0' : '' : '' }}">
|
||||
{{ $slot }}
|
||||
</div>
|
||||
@isset($footer)
|
||||
<div class="card-footer">
|
||||
{{ $footer }}
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
@@ -1,9 +1,4 @@
|
||||
<div class="row pb-3">
|
||||
<div class="col text-right">
|
||||
<a href="{{ $route }}" class="btn btn-sm btn-primary">{{ $label }} <i class="fa fa-plus"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@component('boilerplate::card')
|
||||
{{$dataTable->table()}}
|
||||
@endcomponent
|
||||
<div id="{{ $model }}-datatable-content">
|
||||
@include('components.datatables.header')
|
||||
{{$dataTable->table(['class'=>'table table-bordered table-hover table-striped w-100'])}}
|
||||
</div>
|
||||
10
resources/views/components/datatables/buttons/add.blade.php
Normal file
10
resources/views/components/datatables/buttons/add.blade.php
Normal file
@@ -0,0 +1,10 @@
|
||||
<button type="button" class="btn bg-gradient-info btn-add"><i class="fa fa-plus-circle"></i></button>
|
||||
|
||||
@push('js')
|
||||
<script>
|
||||
$('#{{ $model }}-table-header .btn-add').click(function() {
|
||||
url = '{{ $route }}' + '/create/';
|
||||
window.location = url;
|
||||
});
|
||||
</script>
|
||||
@endpush
|
||||
@@ -0,0 +1,14 @@
|
||||
<div class="text-right datatable-export-buttons">
|
||||
|
||||
<button type="button" class="btn bg-gradient-secondary btn-print" data-placement="top" data-original-title="Imprimer le tableau">
|
||||
<i class="fa fa-print"></i>
|
||||
</button>
|
||||
|
||||
<button type="button" class="btn bg-gradient-secondary btn-excel">
|
||||
<i class="fa fa-file-excel"></i>
|
||||
</button>
|
||||
|
||||
<button type="button" class="btn bg-gradient-secondary btn-pdf">
|
||||
<i class="fa fa-file-pdf"></i>
|
||||
</button>
|
||||
</div>
|
||||
@@ -0,0 +1,4 @@
|
||||
<button type="button" class="btn bg-gradient-secondary btn-filter">
|
||||
<i class="fa fa-filter"></i>
|
||||
</button>
|
||||
|
||||
11
resources/views/components/datatables/header.blade.php
Normal file
11
resources/views/components/datatables/header.blade.php
Normal file
@@ -0,0 +1,11 @@
|
||||
<div class="row table-header" id="{{ $model }}-table-header">
|
||||
<div class="col-lg-6 col-md-10 col-sm-8 mb-2">
|
||||
@include('components.datatables.search')
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-6">
|
||||
@include('components.datatables.buttons.exports')
|
||||
</div>
|
||||
<div class="col-lg-2 col-md-2 col-sm-4 text-right">
|
||||
@include('components.datatables.buttons.add')
|
||||
</div>
|
||||
</div>
|
||||
19
resources/views/components/datatables/search.blade.php
Normal file
19
resources/views/components/datatables/search.blade.php
Normal file
@@ -0,0 +1,19 @@
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text"><i class="fa fa-search"></i></span>
|
||||
</div>
|
||||
<input type="text" class="form-control search-btn" placeholder="Rechercher..." value="">
|
||||
<div class="input-group-append">
|
||||
@include('components.datatables.buttons.filters')
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@push('js')
|
||||
<script>
|
||||
var $search = $('#{{ $model }}-table-header .search-btn');
|
||||
$search.on( 'keyup click', function () {
|
||||
var table = window.LaravelDataTables["{{ $model }}-table"];
|
||||
table.search($search.val()).draw();
|
||||
} );
|
||||
</script>
|
||||
@endpush
|
||||
Reference in New Issue
Block a user