@extends('page')

@section('content')


<!-- Content Header (Page header) -->
  <section class="content-header">
    <div class="container-fluid">
      <div class="row mb-2">
        <div class="col-sm-6">
          <h1>Order # {{$order->id}}</h1>
        </div>
        <div class="col-sm-6">
          <ol class="breadcrumb float-sm-right">
            <li class="breadcrumb-item"><a href="{{ route('orders.index') }}">List Orders</a></li>
            <li class="breadcrumb-item active">Order Details</li>
          </ol>
        </div>
      </div>
    </div><!-- /.container-fluid -->
  </section>
<!-- Main content -->
  <section class="content">
    <div class="container-fluid">
      <div class="row">
        <div class="col-9">
          <div class="card card-info  card-outline">
            <!-- /.card-header -->
            <div class="row" style="padding: 1.25rem 1.25rem 0 1.25rem;">

                  @if(Auth::user()->hasRole(6) )
                    <div class="col-xs-5 col-sm-5 col-md-5">
                      <div class="form-group">
                          <h6><b>PLACED BY   :</b>@if($order->print_status == 1 && $company->company_id == 1) 
                                                    {{$order->companyCreator->name}} 
                                                  @else
                                                    {{$order->creator->name}} 
                                                  @endif</h6>
                      </div>
                      <div class="form-group">
                          <h6><b>VERIFIED BY  :</b> 
                                                  @if($order->print_status == 1 && $company->company_id == 1) 
                                                    {{$order->companyVerifier->name}} 
                                                  @else
                                                    {{$order->userVerifier->name }}
                                                  @endif
                                                </h6>
                      </div>  
                      <div class="form-group">
                          <h6><b>APPROVED BY :</b> @if($order->print_status == 1 && $company->company_id == 1) 
                                                    {{$order->companyApprover->name}} 
                                                  @else
                                                    {{$order->approver->name }}
                                                  @endif
                                                  </h6>
                      </div>
                      
                    </div>
                    <div class="col-xs-5 col-sm-5 col-md-5">
                      <div class="form-group">
                          <label>STATUS : </label>
                            @if($order->status == 0 )
                              <small class="badge badge-danger">Rejected</small>
                            @elseif($order->status == 1)
                              <small class="badge badge-primary">Veification Pending</small>
                            @elseif($order->status == 2)
                              <small class="badge badge-secondary">Verified</small>
                            @elseif($order->status == 3)
                              <small class="badge badge-info">Approved</small>
                            @elseif($order->status == 4)
                              <small class="badge badge-success">Printed</small>
                            @endif
                      </div>

                      <div class="form-group">
                          <h6><b>ORDER DATE :</b>{{date('d-m-Y', strtotime($order->date))}}</h6>
                      </div>
                    </div>

                  @endif
              </div>
            
            <div class="card-body input_fields_wrap">
                <div class="row">
              @php $x     = 1; @endphp
              @if($order)
                <table class="table table-bordered table-striped dataTable dtr-inline" cellspacing="0"  width="100%">
                    <thead> 
                      <tr>
                        <th>#</th>
                        <th>Product Details</th>
                        <th>Label Count</th>
                        <th></th>
                      </tr>
                    </thead>
                @foreach($order->products as $dkey =>  $details) 
                      <tbody>
                        <tr>
                          <td>{{$x}}</td>
                          <td class="pro_displaybox_form"> 
                                  <div class="col-md-3" style="float:left">
                                      <img src="{{asset('../storage/app/images/'.$details->products->product_image)}}" width="60"/>
                                  </div> 
                                  <div class="col-md-9" style="float:left">
                                      <div class="pro_details_box">
                                          <div class="prod_code">{{$details->products->product_code}}</div>
                                          <div class="separator">|</div>
                                          <div class="prod_name">{{$details->products->product_name}}</div>
                                          <div class="separator">|</div>  
                                          <div class="prod_brand">{{$details->products->brand_name}}</div>
                                          <div class="separator">|</div>
                                          <div class="prod_modeln">{{$details->products->model_number}}</div>
                                          @if($details->products->category)
                                              <div class="separator">|</div>
                                              <div class="prod_category">{{$details->products->category->category}}</div>
                                          @endif
                                      </div>
                                      <div style="font-size:13px;">{{$details->products->description}}</div> 
                                  </div>
                          </td>
                          <td>{{$details->label_count}}</td>
                          <td>
                              @if($details->batches->isNotEmpty())
                              <a href="{{url('order/batch_details/'.$details->id)}}"><button class="btn btn-info">{{$details->batches->count()}} Batches</button ></a>
                              @elseif($details->batches->isEmpty())
                                <a href="{{url('order/create-batch/'.$details->id)}}"><button class="btn btn-info">Create Batch</button ></a>
                              @endif
                          </td>
                        </tr>

                      </tbody>
                @php $x++; @endphp
                @endforeach
                </table>
              @endif
              
            </div>
              <div class="row">
                  @if($order->order_note != '')
                    <div class="col-xs-12 col-sm-12 col-md-12" style="float:left;">
                        <div class="form-group">
                            <label>Creator Note</label>
                            <p>{{$order->order_note}}</p>
                        </div>
                    </div>
                  @endif
                  @if($order->verifier_note != '')
                    <div class="col-xs-12 col-sm-12 col-md-12" style="float:left;">
                        <div class="form-group">
                            <label>Verifier Note</label>
                            <p>{{$order->verifier_note}}</p>
                        </div>
                    </div>
                  @endif
                  @if($order->approver_note != '')
                    <div class="col-xs-12 col-sm-12 col-md-12" style="float:left;">
                        <div class="form-group">
                            <label>Approver Note</label>
                            <p>{{$order->approver_note}}</p>
                        </div>
                    </div>
                  @endif
                    <div class="row card-body">
                        <div class="col-xs-6 col-sm-6 col-md-6 text-left"> 
                        <a href="{{url('orders')}}"> <button class="btn btn-secondary">Back </button> </a>
                        </div>
                    </div>
              </div>
            <!-- /.card-body -->
          </div>
          <!-- /.card -->
        </div>
</div>
        <div class="col-3">
          @include('components.dashboard.vertical')
        </div>
        <!-- /.col -->
      </div>
      <!-- /.row -->
    </div>
    <!-- /.container-fluid -->

    <div class="modal fade show" id="modal-product-details" style="" aria-modal="true" role="dialog">
        <div class="modal-dialog modal-lg ">
          <div class="modal-content">  
              <div class="modal-header">
                  <h4 class="modal-title" id="product-model-name">Large Modal</h4>
                  <button type="button" class="close close-model" data-dismiss="modal" aria-label="Close">
                      <span aria-hidden="true">×</span>
                  </button>
              </div>
              <div class="modal-body" style="height: 200px;">
                  <div class="row">
                    <div class="col-md-6" >
                      <h5>Image</h5>
                      <img id="product-model-image" height="60px">
                    </div>
                    <div class="col-md-6" >
                      <h5>Label</h5>
                      <img id="product-model-label" height="60px">
                    </div>
                    <div class="col-md-12"> &nbsp;
                    </div>
                  </div>                  
              </div>
              <div class="modal-footer justify-content-between">
                  <button type="button" class="btn btn-default close-model" data-dismiss="modal">Close</button>
              </div>
          </div>
        </div>

    </div>
  <script>

  $(document).ready(function() {
    $('.close-model').click(function(){
        $('#modal-product-details').modal('hide');
    });
    $('.order_preview').click(function() {
        var image_url           = '{{asset("storage/app/")}}'
        var product_details     = JSON.parse($(this).attr('product-data'));
        $('#product-model-name').html(product_details.product_name);
        $('#product-model-image').attr('src',image_url+'/images/'+product_details.product_image);
        $('#product-model-label').attr('src',image_url+'/product_label/'+product_details.product_label);
        $('#modal-product-details').modal('show');

    });
});
  </script>
@endsection