@extends('layouts.app')
@section('titlePage', 'Manage Page')
@section('content')
<script>
    document.getElementById("kts-5").classList.add("is-expanded");
    document.getElementById("ktss-5").classList.add("active","is-expanded");
</script>
<div class="page-wrapper">
	 <!-- [ breadcrumb ] start -->
	 <div class="breadcrumb-header justify-content-between">
        <div class="left-content">
        <h4 class="text-primary font-weight-bold py-3 mb-0">GRAPHS</h4>

        </div>
        <div class="justify-content-center mt-2">
            <ol class="breadcrumb breadcrumb-style3">
                <li class="breadcrumb-item tx-15"><a href="{{ route_client_master('master.graph.index') }}"><i class="feather icon-home"></i></a></li>
                <li class="breadcrumb-item active">Manage Graphs</a></li>
            </ol>
        </div>
    </div>
   <!-- [ breadcrumb ] end -->
    <!-- [ Main Content ] start -->
    <div class="row">
        <!-- DOM/Jquery table start -->
        <div class="col-sm-12">
            <div class="card">
                <div class="card-header">
                    <a href="{{ route_client_master('master.graph.create') }}" class="btn btn-primary">Create</a>
                </div>
                @include('common.alert')
                <div class="card-body">
					<div class="mb-3">
						<form method="GET" id="form">
							<div class="row">
								<div class="col-md-4">
									<input type="text" id="title" value="{{request()->get('title')}}" name="title" class="form-control" placeholder="Title" title="Title">
								</div>
								<div class="col-md-4">
									<select class="form-control" name="type" id="type">
										<option value="">-- Select Type --</option>
										@foreach (\App\Graph::getOptionTypes() as $type)
											@php
												$selected = "";
												if (!empty(request()->get('type'))) {
													$selected = $type == request()->get('type') ? "selected" : "";
												}
											@endphp
										<option value="{{$type}}" {{$selected}}>{{ucfirst($type)}}</option>
										@endforeach
									</select>
								</div>
								<div class="col-md-4">
									<button class="btn btn-primary"><i class="fa fa-search"></i> Search</button>
									<button type="button"class="btn btn-secondary"><i class="fa fa-times"></i> Reset</button>
								</div>
							</div>
						</form>
					</div>
                    <div class="table-responsive">
                        <table class="table table-bordered table-striped mg-b-0 text-md-nowrap">
                            <thead>
                                <tr>
                                    <th class="wd-25p">Title</th>
                                    <th class="wd-20p">Type</th>
                                    <th class="wd-40p">Description</th>
                                    <th> Action</th>
                                </tr>
                            </thead>
                            <tbody>
								@foreach ($data as $value)
								<tr>
									<td>{{ $value->title }}</td>
									<td>{{ ucfirst($value->type) }}</td>
									<td class="html-description">{!! $value->description !!}</td>
									<td>
			                            <div class="btn-icon-list btn-list justify-content-around">
                                        <a href="{{ route_client_master('master.graph.show', $value->id) }}" class="btn btn-circle-lg btn-primary-light flex-center"><i class="si si-eye"></i></a>
                                        <a href="{{ route_client_master('master.graph.edit', $value->id) }}" class="btn btn-circle-lg btn-primary-light flex-center"><i class="fe fe-edit tx-16"></i></a>
										<form action="{{ route_client_master('master.graph.destroy', $value->id) }}" method="POST" class="delete">
											@csrf
											@method('DELETE')
											<button type="submit" class="btn btn-circle-lg btn-danger flex-center"><i class="fe fe-trash tx-16"></i></button>
										</form>
                                        </div>
									</td>
								</tr>
								@endforeach
							</tbody>
                            <tfoot>
                                <tr>
                                    <th>Title</th>
                                    <th>Type</th>
                                    <th>Description</th>
                                    <th>Action</th>
                                </tr>
                            </tfoot>
                        </table>
						{{-- Pagination --}}
                        <div class="row">
								<div class="col-sm-12 col-md-12">
									<div class="pagination custom-pagination justify-content-end mb-0" id="dt-ajax-array_paginate">
									
                                        {!! $data->appends(Request::all())->links() !!}
									</div>
								</div>
							</div>
                    </div>
                </div>
            </div>
        </div>
        <!-- DOM/Jquery table end -->
    </div>
    <!-- [ Main Content ] end -->
</div>
@endsection
@section('script')
    <script>
        $('.reset').on('click',function (e) {
            $('#title').val('');
            $('#type').val('');
        });
    </script>
@endsection