@extends('adminlayout.admin')
@section('content')
<style >
    .cursor{
    cursor: pointer;
    }
    .nk-content-fluid{
    margin-top: 65px;
    position: relative;
    }
</style>

<div class="content-wrapper">
<section class="content-header" style="float:right;">
    @if(Auth::user()->hasRole('super_admin'))
	<!--<a href="{{route('add_raw_material')}}" class="dropdown-toggle btn btn-lg btn-info" ><i class="fa fa-fw fa-plus"></i>Add </a>-->
   
	@endif
        
  </section>
  <BR><BR>
 
<section class="content">     
  
  <div class="box box-info collapsed-box">
    <div class="box-header with-border">
      <h3 class="box-title">
        Assemble Product</h3>
       
      </div>
      
      <form method="post" action="" enctype="multipart/form-data">
        @csrf
        <div class="container">

         <div class="col-sm-3">
          <div class="form-group ">
            <label for="item_color">Model </label>                           
            <select name="color" class="form-control">
              <option  value="Activa">Activa</option>             			  
            </select>
            <span class="text-danger">@if ($errors->has('item_color')){{ $errors->first('item_color') }}@endif</span>
          </div>
        </div>   

      <div class="col-sm-9">
        
		@foreach($raw_materials as $data)
			<div class="col-sm-3">
				<div class="form-group">
					<label>
						<input type="checkbox"> {{ $data->name }}
					</label>
					<select name="attributes[{{ $data->id }}][]" class="form-control">
						<option value="">...</option>
						@foreach($data->getAttributes() as $column => $value)
							@if($column !== 'id' && $column !== 'name' && $column !== 'created_at' && $column !== 'updated_at')
								@if($column == 'attributes')
									@php
								        $attributes = json_decode($value)
								    @endphp
								@foreach($attributes as $attribute )	
								<option value="{{ $attribute->value }}">{{ ucfirst($attribute->key) }}: {{ $attribute->value }}</option>
								@endforeach
							    @else
									<option value="{{ $value }}">{{ ucfirst($column) }}: {{ $value }}</option>
							    @endif	
							@endif
						@endforeach
					</select>
				</div>
			</div>
		@endforeach

             
      </div>  
		

			<div class="col-12 col-sm-12">
			  <div class="form-group margin-top" style="margin-top: 20px;text-align: center;">
			   <button type="submit" class="btn btn-primary margin-top">Submit</button>
			 </div>
		   </div>
           
           </div>
        
       </form>
       
     </div>   
  
    
</section>
</div>

    <div class="modal fade" id="manage_stock_model" tabindex="-1" role="dialog" aria-labelledby="add_productLabel" aria-hidden="true">
        <form id="manage-stock-form" class="form-horizontal" action="#" method="post" enctype="multipart/form-data" onsubmit="return updateQty()">
         @csrf
         <div class="modal-dialog" role="document">
              <div class="modal-content">
                <div class="modal-header">
                  <h5 class="modal-title" id="add_productLabel">Manage Qty</h5>
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                  </button>
                </div>
                <div class="modal-body">
                  <input type="hidden" value="" name="part_id" id="part_id">
                   <div class="row">
                    <div class=" col-sm-6 col-md-6 ">
                    <label for="cat_name" class="control-label">
                    Available Qty <i class="required">*</i>
                    </label>
                    <input type="number" class="form-control" id="qty" name="qty" autocomplete="off" placeholder="Available Qty" required readonly>
                    <span class="text-danger"></span>
                  </div>
                  <div class=" col-sm-6 col-md-6 ">
                    <label for="pan" class="control-label">
                     New Qty<i class="required">*</i>
                    </label>
                    <input type="number" class="form-control" id="new_qty" name="new_qty" autocomplete="off" placeholder="New Qty" required>
                     <span class="text-danger"></span>
                   </div>                     
                 </div>               
                </div>
				<p style="text-align: center;" class="qtyerror"></p>
                <div class="modal-footer" style="text-align: center;">
                  <button class="btn btn-lg btn-info submitbtn" id="submitbtn" name="submit" data-loading-text="Processing...">
                    <i class="fa fa-fw fa-save"></i>
                      Submit        </button>
                </div>
              </div>
            </div>
        </form>
        
    </div>
	
<script>
function manageQty(part_id, qty)
{	
	$('#part_id').val(part_id);
	$('#qty').val(qty);	
}

function updateQty()
{
	$('.submitbtn').attr('disabled',true);
	$('.submitbtn').html('<i class="fa fa-circle-o-notch fa-spin"></i> loading...');
	
	
	var part_id = $('#part_id').val();
	$.ajax({
        method: 'POST',
        url: "{{ route('update_raw_qty') }}",
        dataType: 'json',
		data: $('#manage-stock-form').serialize(),
        success: function(response) {
			$('.submitbtn').attr('disabled',false);
			$('.submitbtn').html('<i class="fa fa-fw fa-save"></i>Submit');
			
			
            if (response && response.status) {
                    $('#partqty'+part_id).html(response.totalqty); 
					$('#new_qty').val(0);
                    $('#manage_stock_model').modal('hide');					
            } else {
				   console.error('Invalid response format:', response);
				   var msg = '<span style="color:red">'+response.msg+'</span>';
				   $('.qtyerror').html(msg);
				   
                   setTimeout(function(){
					  $('.qtyerror').html(''); 
				   },4000);				   
            }
        },
        error: function(xhr, status, error) {
            console.log('Error fetching vehicle details:', error);
        }
    });
	
	return false;
	
}

 
</script>	
@endsection