@extends('layouts.app')

@section('content')
<div class="panel panel-default">
    <div class="panel-heading">services found by '{{$search_query}}'</div>
    

    <div class="panel-body">
       	<form method="post" action="{{ route('billing-services.search')}}" >
	    <input type="hidden" value="{{csrf_token()}}" name="_token" />
	        <div class="form-group">
	            <label for="title">Search billing service by description, reference or customer:</label>
	            <input type="text" class="form-control" name="search" value="{{$search_query}}" />
	        </div>
	         <button type="submit" class="btn btn-primary">search</button>
	     </form>
        <table class="table">
         <thead>
        	<tr>
        		<th>customer</th>
        		<th>reference</th>
        		<th>service</th>
        		<th>fee</th>
        		<th>billing period</th>
        		<th>next billed</th>        		
        		<th></th>
        	</tr>
        </thead>
			@foreach( $services as $service )
				<tr @if( $service->canseled_date != null ) style="background-color: #f8d7da;"  @elseif( $service->do_not_bill == 1 && $service->canseled_date == null ) style="background-color: #b8daff;"  @endif>
					<td>
						@if( $service->customer_id == 0 )
						<div style="color: red">Not linked to customer</div>
						@else
						<div style="color: green">{{$service->customer->xero_name}}</div>
						@endif
					</td>
					<td>
						{{$service->service_ref}}
					</td>
					<td>
						<a target="_blank" href="{{ route('billing-services.show',$service->id)}}">{{$service->description}}</a>
					</td>
					<td>
						{{$service->fee}}
					</td>
					<td>
						@if( $service->renew == 1 ) Monthly  @endif
						@if( $service->renew == 2 ) Quarterly  @endif
						@if( $service->renew == 3 ) Annually  @endif
					</td>
					<td>
						{{$service->next_billed}}
					</td>
					
					
					
					<td>
						<a  class="btn btn-primary" href="{{ route('billing-services.edit',$service->id)}}">Edit</a>
					</td>
					
				</tr>
			@endforeach
		</table>

		
    </div>
</div>
@endsection