{{-- {{dd($work_order->work_department)}} --}}
<div class="tab-content">
  @if(($work_order->work_status != 'Completed' && $work_order->work_status != 'Closed' && $work_order->work_status != 'Hold') && in_array(user_id(),$work_order->technician_id) )

<div class='col-md-6 col-lg-4'>

  {!!Form::horizontal_open()
    ->id('workorder-menu-create3')
    ->method('POST')
    ->files('true')
    ->enctype('multipart/form-data')
    ->action(trans_url('admin/work_order/adminmateriallistdetails_add/'.$work_order->getRouteKey()))
  !!}
  
                     
          {!! Form::date('date2')
           ->addClass('pickdate')
          -> label('Date')
          ->disabled()

          -> placeholder('Please enter date')
          -> addGroupClass('form-group-sm')
          !!}
         
          {!! Form::select('store_id')
          ->readonly(user('admin.web')->access_other_work_department?false:true)
          -> options(WorkDepartment::stores(),$work_order->work_department->store_id)
          -> label(trans('material::material_receipt.label.store_id'))
          -> addGroupClass('form-group-sm')
          -> required()
          -> placeholder(trans('material::material_receipt.placeholder.store_id'))
          !!}


            {!! Form::select('material_ref')
          ->options([],$work_order->work_department->store_id)
          -> label('Material Code')
          -> addGroupClass('form-group-sm')
          -> required()
          !!}

          {!! Form::text('material_name')
          -> label('Material Name')
          -> placeholder(' ') 
          -> addGroupClass('form-group-sm')      
          -> readonly()
          !!}

          {!! Form::text('serial_no')
          -> label('Batch/Serial No.')
          -> placeholder(' ') 
          -> addGroupClass('form-group-sm')      
          -> readonly()
          !!}

          {!! Form::hidden('unit')
          -> id('unit')
          !!}
          {!! Form::hidden('price')
          -> id('price')
          !!}
          {!! Form::hidden('manufacturer_id')
          -> id('manufacturer_id')
          !!}
          {!! Form::hidden('supplier_id')
          -> id('supplier_id')
          !!}



  

        <div class="form-group form-group-sm">
          <label class="control-label col-lg-3 col-md-6 col-sm-6"> 
            Quantity<sup>*</sup>
          </label>
          <div class="col-lg-9 col-md-6  col-sm-6">
            <div class="input-group">
              {!! Form::number('quantity')
                  -> min(0)
                  -> placeholder('Please enter quantity')
                  -> required()
                  ->min(1)
                  -> raw()!!}
              <span id="qty_unit" class="input-group-addon">Unit</span>
            </div>
          </div>
        </div>
        
          {!! Form::textarea('description')
            ->rows(2)
            -> required()

           -> label('Description')
           -> placeholder('i.e. supplier details, warranty period, serial number, etc')
           -> addGroupClass('form-group-sm')
           !!}
           <br>
           <button type="button" class="btn btn-primary btn-sm" id="btn_adds"  ><i class="fa fa-floppy-o"></i> Add Material</button>
         
           {!! Form::close() !!}
              
    </div>
    
   
  <div class='col-md-6 col-lg-8' id="btnns">
    @else

    <div class='col-lg-12' id="btnns">
  @endif

</div>
</div>


<style type="text/css">
  select[readonly]{
       pointer-events: none;
         touch-action: none;
 
       background: #eee;
         box-shadow: none;
     }
 
 select[readonly].select2-hidden-accessible + .select2-container {
         pointer-events: none;
         touch-action: none;
     }
 
     select[readonly].select2-hidden-accessible + .select2-container .select2-selection {
         background: #eee;
         box-shadow: none;
     }
    
     select[readonly].select2-hidden-accessible + .select2-container .select2-selection__arrow, select[readonly].select2-hidden-accessible + .select2-container .select2-selection__clear {
         display: none;
     }
     .form-horizontal .checkbox-inline { 
         min-width: 77px; 
         margin-left: 0px !important; 
       }
       label.checkbox-inline{
         font-size: 12px;
       }
       label.radio-inline{
         font-size: 12px;
       }
       .select2-container{ width: 100% !important; }
 
 </style>
 
  <script>
  
  $(document).ready(function(){
    $('.pickdate').pickadate({ 
      max:new Date(),
      min:new Date("{!!$work_order->getOriginal('created_at')!!}"),
      format: 'dd mmm, yyyy',
      formatSubmit: 'yyyy-mm-dd',
      hiddenSuffix: '',
      selectMonths: true,
      selectYears: true,
      onStart: function() {
        this.set({ select: new Date()});
      }
    }).prop('type','text');
   
   $("#btnns").load('{{ trans_url("/admin/work_order/adminmateriallistdetails/table") }}'+'/'+'{{$work_order->getRouteKey()}}');

   $("#material_ref").select2({
            ajax: {
                url: "{{ trans_url('admin/material/material/apiItems/material') }}",
                dataType: 'json',
                delay: 250,
                data: function(params) {
                    return {
                        q: params.term, // search term
                        store_id: $('#store_id').val(),
                        // materialId: $('#material_type').val(),
                        page: params.page
                      };
                },
                processResults: function(data, params) {

                    params.page = params.page || 1;
                    return {
                        results: data.items,
                        pagination: {
                            more: (params.page * 30) < data.total_count
                        }
                    };
                },
                cache: false,
            },
            escapeMarkup: function(markup) {
                return markup;
            }, // let our custom formatter work
            
            templateResult: formatRepo, // omitted for brevity, see the source of this page
            templateSelection: formatRepoSelection // omitted for brevity, see the source of this page
        });


        function formatRepo(repo) {
            if (repo.loading) return repo.name;
            var markup = "<div class='select2-result-repository clearfix'>" +
                "<div class='select2-result'><span>" + repo.item_code + "&nbsp;-&nbsp;"+repo.item_desc+"&nbsp;-&nbsp;"+repo.manufacture+"&nbsp;-&nbsp;"+repo.batch_no+" </span><span>" + repo.stock+ "</span></div>";

            return markup;
        }


        function formatRepoSelection(repo) {
          $("#price").val('');
          $("#serial_no").val('');
          $("#manufacturer_id").val('');
          $("#supplier_id").val('');
          $("#material_name").val('');
          $("#unit").val('');
          
          $("#qty_unit").html(repo.issue_unit);
          $("#unit").val(repo.issue_unit);
          $("#material_name").val(repo.item_desc);
          $("#manufacturer_id").val(repo.manufacture);
          $("#supplier_id").val(repo.vendor_name);
          $("#serial_no").val(repo.batch_no);
          $("#price").val(repo.purchase_cost);
          $("#quantity").attr("max",repo.stock);
          $("#quantity").val(1);
            return repo.item_code?repo.item_code:repo.item_desc;
            
        }

        $("#material_type").change(function () {
          $("#material_ref").empty();
        })


  });
  $('#store_id').change(function () {
    $("#price").val('');
          $("#serial_no").val('');
          $("#manufacturer_id").val('');
          $("#supplier_id").val('');
          $("#material_ref").empty();
          $("#unit").val('');
          $("#material_name").val('');
  })
  $('#btn_adds').click(function(event){  
  event.preventDefault();
            $('#btn_adds').prop("disabled", true);

            var $f = $('#workorder-menu-create3');
            if($f.valid() == false) {
              $('#btn_adds').prop("disabled", false);

            toastr.error('Please enter valid information.', 'Error');
            return false;
            }

          $.getJSON({
                    type: 'POST',
                    url: $f.attr('action'),
                    data: $f.serialize(),
                    beforeSend: function () {
                      $('#btn_adds').prop("disabled", true);

                  },
                  complete: function () {
                    $('#btn_adds').prop("disabled", false);
                    $('#material_ref').val('');
                    $('#material_type').empty();
                    $('#quantity').val('');
                    $('#description').val('');
                    $("#material_ref").empty();
                    $("#description").val('');
                    $("#unit").val('');
                    $("#price").val('');
                    $("#serial_no").val('');
                    $("#manufacturer_id").val('');
                    $("#supplier_id").val('');
                    $("#material_name").val('');

           

                    

                  },
                    success: function(data) { 
                      $("#btnns").load('{{ trans_url("/admin/work_order/adminmateriallistdetails/table") }}'+'/'+'{{$work_order->getRouteKey()}}');
                      $('#btn_adds').removeAttr("disabled");

                    },
                    error: function(xhr, status, error) {
                      toastr.error(xhr.responseJSON.message, 'Error');
                      $('#btn_adds').prop("disabled", false);
                      $('#material_ref').val('');
                      $('#material_type').empty();
                      $('#quantity').val('');
                      $('#description').val('');
                      $("#material_ref").empty();
                      $("#description").val('');
                      $("#unit").val('');
                      $("#price").val('');
                      $("#serial_no").val('');
                      $("#manufacturer_id").val('');
                      $("#supplier_id").val('');
                      $("#material_name").val('');



                      return false;
                    }
                });
             
          }); 
          
  
  </script>