@extends('layouts.backend')
@section('mainContentArea')
<div class="card card-default">
    <div class="card-header">
        <h4>
            Manage Metal
            {!! $addBtn !!}
            {!! $viewdraft !!}
        </h4>
    </div>
    <div class="card-body">
        <table class="table table-bordered data-table">
            <thead>
                <tr>
                    <th>S.No.</th>
                    <th>BASE METAL </th>
                    <th>POLISH  </th>
                    <th>COMPOSITION </th>                    
                    {{-- <th>CONSTRUCTION</th>
                    <th>BLEND</th>
                    <th>WEAVE</th>
                    <th>GSM</th>
                    <th>WIDTH  GREIGE</th>
                    <th>WIDTH FINISHED</th> --}}
                    <th width="100px">Action</th>
                </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
    </div>
</div>
<!-- The Modal -->
<div class="modal" id="metalModal">
  <div class="modal-dialog">
    <div class="modal-content">

      <!-- Modal Header -->
      <div class="modal-header">
        <h4 class="modal-title"></h4>
        <button type="button" class="close" data-dismiss="modal">&times;</button>
      </div>

      <!-- Modal body -->
      <div class="modal-body">
          <form action="{{ route('metals.draftstore') }}" method="post" name="metalFrm">
              @csrf
              <input type="hidden" name="fabricid" id="fabricid" value="0">
              <div class="row">
                <div class="col-md-12">
                    <div class="form-group"><label for="hsnname">BASE METAL</label><input class="form-control" name="name" id="fabricName" required value="" placeholder="Enter Fabric name"/></div>
                    <div class="form-group"><label for="hsnname">POLISH</label><input class="form-control" name="quality" id="quality" required value="" placeholder="Enter Fabric quality"/></div>                   
                    <div class="form-group"><label for="hsnname">COMPOSITION</label><input class="form-control" name="composition" id="composition" required value="" placeholder="Enter Fabric composition"/></div>
                     <div class="form-group" style=" display:none;"><label for="hsnname">CONSTRUCTION</label><input class="form-control" name="construction" id="construction"  value="" placeholder="Enter Fabric Construction"/></div>
                    <div class="form-group" style=" display:none;"><label for="hsnname">BLEND</label><input class="form-control" name="blend" id="blend"  value="" placeholder="Enter Fabric Blend"/></div>
                    <div class="form-group" style=" display:none;"><label for="hsncode">WEAVE</label><input class="form-control" name="weave" id="weave"  value="" placeholder="Enter Fabric Weave"/></div>
                    <div class="form-group" style=" display:none;"><label for="hsncode">GSM</label><input class="form-control" name="gsm" id="gsm"  value="" placeholder="Enter Fabric GSM"/></div>
                    <div class="form-group" style=" display:none;"><label for="hsncode">WIDTH  GREIGE</label><input class="form-control" name="width_greige" id="width_greige"  value="" placeholder="Enter Fabric Width Greige"/></div>
                    <div class="form-group" style=" display:none;"><label for="hsncode">WIDTH FINISHED</label><input class="form-control" name="width_finished" id="width_finished"  value="" placeholder="Enter Fabric Width Finished"/></div>                 
                    <div class="form-group"><button class="btn btn-block btn-primary">Save Metal</button></div> 
                </div>
              </div>
          </form>
      </div>

      <!-- Modal footer -->
      <div class="modal-footer">
        <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
      </div>

    </div>
  </div>
</div>
@endsection

@section('extraJs')
<script type="text/javascript">
    $(function () {
      
      var table = $('.data-table').DataTable({
          processing: true,
          serverSide: true,
          stateSave: true,
          ajax: "{{ route('metal.index') }}",
          columns: [
              {data: 'DT_RowIndex', name: 'DT_RowIndex'},
              {data: 'name', name: 'name'},
              {data: 'quality', name: 'quality'},
              {data: 'composition', name: 'composition'},              
              // {data: 'construction', name: 'construction'},
              // {data: 'blend', name: 'blend'},
              // {data: 'weave', name: 'weave'},
              // {data: 'gsm', name: 'gsm'},
              // {data: 'width_greige', name: 'width_greige'},
              // {data: 'width_finished', name: 'width_finished'},
              {data: 'action', name: 'action', orderable: false, searchable: false},
          ]
      });
      
    });

    function setFabric(pos,status){
    
    var _token   = $('meta[name="csrf-token"]').attr('content'); 
    $.ajax({
        type: "get",
        url: "{{ route('fabric-status-update') }}",
        data: {
        pos: pos,            
        status:status,              
        _token: _token
        },
        dataType: "json",                       
        success: function(response) { 
            var reason = JSON.stringify(response);  
            var parsed = JSON.parse(reason);            
            console.log(parsed);
            if (parsed.status == false) {
            toastr.error(parsed.info);
            $('.submitBtn').removeAttr("disabled");
            } else {
            toastr.success(parsed.info);
            console.log(parsed.svalue,pos); 
            window.location.reload('true');               
            
            }
        }
    });
   
}

  </script>
@endsection