CrestRoad/laravel/resources/views/library/list.blade.php

215 lines
11 KiB
PHP

@php
$role = json_decode(auth()->user()->roles);
$abm = '1670746453-9d3caf22-22d5-4d1e-8891-cfc2e3d7cdc9';
@endphp
@extends('layouts.vertical', ['page_title' => 'Datatables'])
@section('css')
<!-- third party css -->
<link href="{{ asset('assets/libs/datatables/datatables.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('assets/libs/bootstrap-datepicker/bootstrap-datepicker.min.css') }}" rel="stylesheet"
type="text/css" />
<!-- third party css end -->
@endsection
@section('content')
<!-- Start Content-->
<div class="container-fluid">
<!-- start page title -->
<div class="row">
<div class="col-md-6 p-2">
<h4 class="page-title">{{ $title }} Management</h4>
</div>
<div class="col-md-6 p-2">
@if (!in_array($abm, $role))
@if (isset($buttons))
@foreach ($buttons as $button)
<a href="{{ $button['link'] }}"
class="btn btn-{{ $button['title'] == 'Add New' ? 'success' : 'dark' }} waves-effect waves-light float-end me-2"
id="btn-{{ strtolower(str_replace(' ', '-', $button['title'])) }}">{{ $button['title'] }}</a>
@endforeach
@endif
@endif
</div>
</div>
<!-- end page title -->
@if (session()->has('message'))
<div class="alert alert-success">
{{ session()->get('message') }}
</div>
@endif
@if (session()->has('error'))
<div class="alert alert-danger">
{{ session()->get('error') }}
</div>
@endif
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-body">
<table id="list-page-datatable" class="table w-100 nowrap">
<thead>
<tr>
@foreach ($fields as $field => $props)
<th>{{ $props['title'] }}</th>
@endforeach
</tr>
</thead>
<tbody>
@foreach ($items as $item)
<tr>
@foreach ($fields as $field => $props)
@if ($field != 'actions')
<td>
@switch($props['type'])
@case('image')
<img src="{{ $item->{$field} }}" class="img-thumbnail">
@break
@case('text')
@case('select')
{{ isset($item->{$field}) ? $item->{$field} : '' }}
@break
@case('date')
{{ date('d M Y', strtotime($item->{$field})) }}
@break
@case('datetime')
{{ date('d M Y, h:iA', strtotime($item->{$field})) }}
@break
@endswitch
</td>
@else
<td>
@foreach ($props['buttons'] as $key => $button)
@switch($button)
@case('edit')
@if (!in_array($abm, $role))
<a href="{{ $base_url }}/edit?id={{ $item->id }}"
class="action-icon"> <i
class="mdi mdi-square-edit-outline text-warning"></i></a>
@endif
@break
@case('delete')
@if (!in_array($abm, $role))
<a href="{{ $base_url }}/delete?id={{ $item->id }}"
class="action-icon"> <i
class="mdi mdi-delete text-danger"></i></a>
@endif
@break
@default
@php
if (isset($button['href']) && $button['href'] != '') {
$href = $item->{$button['href']};
} else {
$querystring = $button['querystring'];
foreach ((array) $item as $k => $v) {
if (strpos($querystring, '{' . strtoupper($k) . '}') !== false) {
$querystring = str_replace('{' . strtoupper($k) . '}', $v, $querystring);
}
}
$href = $base_url . '/' . $key . '?' . $querystring;
}
$target = '_self';
if (isset($button['target']) && $button['target'] != '') {
$target = $button['target'];
}
@endphp
<a href="{{ $href }}" target="{{ $target }}"
class="action-icon"> <i
class="mdi mdi-{{ $button['icon'] }}"></i></a>
@endswitch
@endforeach
</td>
@endif
@endforeach
</tr>
@endforeach
</tbody>
</table>
</div> <!-- end card body-->
</div> <!-- end card -->
</div><!-- end col-->
</div>
<!-- end row-->
</div> <!-- container -->
<!-- Right modal content -->
<div id="date_filter_modal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header border-0">
<h4 class="modal-title" id="standard-modalLabel">Filter results by date</h4>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="row">
<form method="get" id="form-date-filter">
<div class="col-12">
<div class="mb-3">
<label class="form-label">From Date</label>
<input type="text" name="startdate" class="form-control" data-provide="datepicker"
value="{{ isset($startdate) ? date('m/d/Y', strtotime($startdate)) : '' }}"
data-date-autoclose="true">
</div>
</div>
<div class="col-12">
<div class="mb-3">
<label class="form-label">To Date</label>
<input type="text" name="enddate" class="form-control" data-provide="datepicker"
value="{{ isset($enddate) ? date('m/d/Y', strtotime($enddate)) : '' }}"
data-date-autoclose="true">
</div>
</div>
</div>
<button type="submit" class="btn btn-success btn-sm">Filter</button>
<button type="button" class="btn btn-danger btn-sm" data-bs-dismiss="modal">Close</button>
</form>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<style type="text/css">
.img-thumbnail {
max-width: 100px
}
</style>
@endsection
@section('script')
<!-- third party js -->
<script src="{{ asset('assets/libs/datatables/datatables.min.js') }}"></script>
<script src="{{ asset('assets/libs/bootstrap-datepicker/bootstrap-datepicker.min.js') }}"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#list-page-datatable').DataTable({
stateSave: true,
"scrollX": true,
"language": {
"paginate": {
"previous": "<i class='mdi mdi-chevron-left'>",
"next": "<i class='mdi mdi-chevron-right'>"
}
},
"drawCallback": function() {
$('.dataTables_paginate > .pagination').addClass('pagination-rounded');
}
});
$("#btn-date-filter").click(function() {
$("#date_filter_modal").modal("show")
})
});
</script>
<!-- end demo js-->
@endsection