@extends('dash.layouts.app')

@section('title')
    Orders
@endsection

@section('css')
    <!-- DataTables -->
    <link rel="stylesheet" href="{{ asset('dash/plugins/datatables/dataTables.bootstrap.css') }}">
@endsection


@section('content')
    <!-- Main content -->
    <section class="content">
        <div class="row">
            <div class="col-xs-12">
                <div class="box">
                    <div class="box-header">
                        <div class="pull-left">
                            <h3 class="box-title">Order Details</h3>
                        </div>
                    </div>
                    <!-- /.box-header -->
                    <div class="box-body">
                        <div class="row">
                            <div class="col-md-5">
                                <table class="table table-bordered">
                                    <tr>
                                        <td width="25%">Name</td>
                                        <td>{{$trail->name}}</td>
                                    </tr>

                                    <tr>
                                        <td width="25%">Email</td>
                                        <td>{{$trail->email}}</td>
                                    </tr>

                                    <tr>
                                        <td width="25%">Phone</td>
                                        <td>{{$trail->phone}}</td>
                                    </tr>

                                    <tr>
                                        <td width="25%">Subject</td>
                                        <td>{{$trail->subject}}</td>
                                    </tr>

                                    <tr>
                                        <td width="25%">Note</td>
                                        <td>{{$trail->note}}</td>
                                    </tr>


                                    <tr>
                                        <td width="25%">Status</td>
                                        <td>
                                            @if($trail->status == 0)
                                                <a href="{{url('admin/free-trail/change-status/'.$trail->id)}}" class="btn btn-warning btn-sm" style="margin-top: 10px">Pending</a>
                                            @else
                                                <a href="{{url('admin/free-trail/change-status/'.$trail->id)}}" class="btn btn-success btn-sm" style="margin-top: 10px">Complete</a>
                                            @endif
                                        </td>
                                    </tr>

                                </table>
                            </div>

                            <div class="col-md-7">
                               <div class="row">
                                   @foreach($trail->trailImages as $image)
                                      <div class="col-md-4" style="height: 150px; overflow: hidden; margin-bottom: 10px">
                                          <div style="height: 120px; overflow: hidden">
                                              <img src="{{asset($image->image)}}" class="img-responsive img-thumbnail" style="height: 100%">
                                          </div>
                                          <a href="{{url($image->image)}}" class="btn btn-sm btn-primary btn-block" target="_blank"> <i class="fa fa-download"></i> Download  </a>
                                      </div>
                                   @endforeach
                               </div>
                              
                            </div>
                        </div>
                    </div>
                    <!-- /.box-body -->
                </div>
                <!-- /.box -->
            </div>
            <!-- /.col -->
        </div>
        <!-- /.row -->
    </section>
    <!-- /.content -->
@endsection

@section('js')

@endsection