@extends('admin.layout')
@section('content')
<style type="text/css">
    .required-mark {
        color: red;
    }
    hr {
        margin-left: 15px;
        margin-bottom:-3px;
    }
    .hr-primary {
        border: 1px solid #3c8dbc;
    }
    .bootstrap-select.btn-group .dropdown-menu li {
        border-bottom: 1px solid #6c6c6cde;
    }
    .my-current {
        color: #00c0ef;
    }
    th
    {
        text-align: center;
    }
    .slot
    {
        padding: 0px 2px 0px 2px;text-align: center;
    }
    #watermarked::before {
    position: fixed;
    top: -75%;
    left: -75%;
    display: block;
    width: 300%;
    height: 300%;
    transform: rotate(-45deg);
    content: attr(data-watermark);
    font-size: 30px;
    opacity: 0.15;
    line-height: 4em;
    letter-spacing: 2px;
    color: #ff0523;
    z-index:0;
    }
	.content-wrapper, .right-side{
        background: #FFF;
    }
    .box {
        background: transparent;
        z-index: 1; 
    }
</style>
<div class="search-list">
    <div class="content-wrapper search-result-list">    
  <section class="content-header">
    <h1> {{ trans('Edit IPQC Report') }} <small></small> </h1>
    <ol class="breadcrumb">
      <li><a href="{{ URL::to('admin/dashboard/this_month')}}"><i class="fa fa-dashboard"></i> {{ trans('labels.breadcrumb_dashboard') }}</a></li>
      <li class="active">{{ trans('Edit IPQC Report') }}</li>
    </ol>
  </section>
  <section class="content"> 
    @php
        $getUserRoleData = userRoleData();
        $LeadSources        = explode(",",$getUserRoleData->LeadSources);
    @endphp

    <div class="row">
      <div class="col-md-12">
        <div class="box box-info"> 
          <div class="box-body">
            <div class="row">
              <div class="col-xs-12">
                    <!-- <div class="form-control"> -->
                        <div class="row">
                            @if(session()->has('message'))
                                <div class="alert alert-success alert-dismissible">
                                   <button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button>
                                   <h4><i class="icon fa fa-check"></i> {{ trans('labels.Successlabel') }}</h4>
                                    {{ session()->get('message') }}
                                </div>
                            @endif
                            @if(session()->has('error'))
                                <div class="alert alert-warning alert-dismissible">
                                   <button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button>
                                   <h4><i class="icon fa fa-warning"></i> {{ trans('labels.WarningLabel') }}</h4>
                                    {{ session()->get('error') }}
                                </div>
                            @endif
                        </div>
                         <div class="box-body">                 
                            {!! Form::open(array('url' => route('ipqc-report.update', [$result['data']['id']]), 'method'=>'post', 'class' => 'form-horizontal', 'id' => 'updateNewIPQC', 'enctype'=>'multipart/form-data')) !!}
                            @method('put')
                                <div class="row">
                                    <div class="col-md-12">
                                        <button type="submit" class="btn btn-primary">{{ trans('Submit') }}</button>
                                        <a href="{{URL('admin/ipqc-report')}}" type="button" class="btn btn-primary">{{ trans('labels.back') }}</a>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-3">
                                        <div class="form-group">
                                            <div class="col-sm-12 col-md-12">
                                                <label for="company_id" class="control-label">{{ trans('Company Name') }}  <span class="required-mark">*</span></label>
                                            </div>
                                            <div class="col-sm-10 col-md-12">
                                                 {!! Form::select('company_id', $result['Company_info'], $result['data']->company_id, array('class'=>'form-control company_id', 'multiple'=>'', 'id'=>'company_id', 'required'=>'required')) !!}
                                            </div>
                                        </div>
                                    </div>                  
                                    <div class="col-md-3">
                                        <div class="form-group">
                                            <div class="col-sm-12 col-md-12">
                                                <label for="format_no" class="control-label">{{ trans('Format No.') }}  <span class="required-mark">*</span></label>
                                            </div>
                                            <div class="col-sm-10 col-md-12">
                                                {!! Form::text('format_no',  $result['data']->format_no, array('class'=>'form-control', 'id'=>'format_no', 'required'=>'required', 'readonly'=>'readonly')) !!}
                                            </div>
                                        </div>
                                    </div>               
                                    <div class="col-md-3">
                                        <div class="form-group">
                                            <div class="col-sm-12 col-md-12">
                                                <label for="rev_number" class="control-label">{{ trans('Rev. No') }}  <span class="required-mark">*</span></label>
                                            </div>
                                            <div class="col-sm-10 col-md-12">
                                                {!! Form::text('rev_number',  $result['data']->rev_number, array('class'=>'form-control', 'id'=>'rev_number', 'required'=>'required', 'readonly'=>'readonly')) !!}
                                            </div>
                                        </div>
                                    </div>      
                                    <div class="col-md-3">
                                        <div class="form-group">
                                            <div class="col-sm-12 col-md-12">
                                                <label for="date" class="control-label">{{ trans('Date') }} <span class="required-mark">*</span></label>
                                            </div>
                                            <div class="col-sm-10 col-md-12">
                                                {!! Form::text('date',  $result['data']->date, array('class'=>'form-control', 'id'=>'date', 'required'=>'required', 'readonly'=>'readonly')) !!}
                                            </div>
                                        </div>
                                    </div>    
                                    <div class="clearfix"></div>
                                    <div class="col-md-3">
                                        <div class="form-group">
                                            <div class="col-sm-12 col-md-12">
                                                <label for="ipqc_date" class="control-label">{{ trans('IPQC Date') }} <span class="required-mark">*</span></label>
                                            </div>
                                            <div class="col-sm-10 col-md-12">
                                                {!! Form::text('ipqc_date', $result['data']->ipqc_date, array('class'=>'form-control', 'id'=>'ipqc_date', 'readonly'=>'readonly', 'required'=>'required')) !!}
                                            </div>
                                        </div>
                                    </div> 
                                    <div class="col-md-3">
                                        <div class="form-group">
                                            <div class="col-sm-12 col-md-12">
                                                <label for="shift" class="control-label">{{ trans('Shift') }} <span class="required-mark">*</span></label>
                                            </div>
                                            <div class="col-sm-10 col-md-12">
                                                {!! Form::text('shift', $result['data']->shift, array('class'=>'form-control space', 'id'=>'shift', 'required'=>'required')) !!}
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-2">
                                        <div class="form-group">
                                            <div class="col-sm-12 col-md-12">
                                                <label for="client_code" class="control-label">{{ trans('Client Name/Code') }} <span class="required-mark">*</span></label>
                                            </div>
                                            <div class="col-sm-10 col-md-12">
                                                {!! Form::text('client_code', $result['data']->client_code, array('class'=>'form-control space', 'id'=>'client_code', 'required'=>'required')) !!}
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="form-group">
                                            <div class="col-sm-12 col-md-12">
                                                <label for="mask_type_id" class="control-label">{{ trans('Mask Type') }} <span class="required-mark">*</span></label>
                                            </div>
                                            <div class="col-sm-10 col-md-12">
                                                <select name="mask_type_id" id="mask_type_id" class="form-control mask_type_id" onchange="get_model(this);" required multiple>
                                                   <option value="">Select Mask Type</option> 
                                                   @foreach($result['Mask_types'] as $mask)
                                                        <option value="{{$mask->id}}" selected model="{{$mask->modal_no}}">({{$mask->modal_no}}) {{$mask->name}}</option>
                                                   @endforeach    
                                                </select>
                                            </div>
                                        </div>
                                    </div> 
                                    <div class="clearfix"></div>
                                    <div class="col-md-3">
                                        <div class="form-group">
                                            <div class="col-sm-12 col-md-12">
                                                <label for="batch_no" class="control-label">{{ trans('Batch No.') }} <span class="required-mark">*</span></label>
                                            </div>
                                            <div class="col-sm-10 col-md-12">
                                                {!! Form::text('batch_no', $result['data']->batch_no, array('class'=>'form-control space', 'id'=>'batch_no', 'required'=>'required')) !!}
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-3">
                                        <div class="form-group">
                                            <div class="col-sm-12 col-md-12">
                                                <label for="model_no" class="control-label">{{ trans('Mask Model No') }} <span class="required-mark">*</span></label>
                                            </div>
                                            <div class="col-sm-10 col-md-12">
                                                {!! Form::text('model_no', $result['data']->model_no, array('class'=>'form-control', 'id'=>'model_no', 'required'=>'required', 'readonly'=>'readonly')) !!}
                                            </div>
                                        </div>
                                    </div>
                                    <div class="clearfix"></div>
                                    <div class="col-md-12">
                                        <div class="form-group">
                                            <div class="col-sm-12 col-md-12">
                                                <label for="instructions" class="control-label">{{ trans('Instructions') }} <span class="required-mark">*</span></label>
                                            </div>
                                            <div class="col-sm-10 col-md-12">
                                                {!! Form::textarea('instructions', $result['data']->instructions, array('class'=>'form-control instructions space1', 'id'=>'instructions', 'required'=>'required', 'rows'=>'2')) !!}
                                            </div>
                                        </div>
                                    </div>     
                                    <div class="clearfix"></div>
                                    <ul id="ipqc-sorting2">
                                        <li>
                                            <span class="blanckArea"></span>
                                            <table class="table table-bordered table-striped">
                                                <tbody>
                                                     <tr>
                                                        <th rowspan="2" width="3%">S.N.</th>
                                                        <th rowspan="2" width="10%">Description</th>
                                                        <th rowspan="2" width="8%">Criteria</th>
                                                        <th rowspan="2" width="10%">Requirement</th>
                                                        <th rowspan="2" width="8">Test Method</th>
                                                        <th colspan="8" width="40%" style="text-align: center;">Sampling-Time</th>
                                                        <th rowspan="2" width="9%">Result</th>
                                                        <th rowspan="2" width="12%">Remarks</th>
                                                    </tr>
                                                    <tr>
                                                        <th>1</th>
                                                        <th>2</th>
                                                        <th>3</th>
                                                        <th>4</th>
                                                        <th>5</th>
                                                        <th>6</th>
                                                        <th>7</th>
                                                        <th>8</th>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </li>
                                    </ul>
                                    <ul id="ipqc-sorting">
                                                                            </ul>
                                    <div class="clearfix"></div>
                                    <div class="col-md-12">
                                        <div class="box-footer text-center">
                                            <button type="submit" id="sub" class="btn btn-primary">{{ trans('Submit') }}</button>
                                            <a href="{{URL('admin/ipqc-report')}}" type="button" class="btn btn-primary">{{ trans('labels.back') }}</a>
                                        </div>
                                    </div>
                                </div>
                            {!! Form::close() !!}   
                      </div>
                  <!-- </div> -->
              </div>
            </div>
          </div>
        </div>

        <div id="watermarked" data-watermark="{{ auth()->guard('admin')->user()->first_name }} {{ auth()->guard('admin')->user()->last_name }}" class="row listing">        
        </div>

      </div>
    </div>
  </section>
</div>
</div>
@endsection 
@section('scripts')
<script src="{!! asset('assets/admin/plugins/validate/jquery.validate.js') !!}"></script>
<script src="{!! asset('assets/admin/plugins/validate/additional-methods.js') !!}"></script>
<script src="{!! asset('assets/admin/dist/js/datetimepicker/jquery.datetimepicker.full.min.js') !!}"></script>
<link href="{!! asset('assets/admin/dist/js/datetimepicker/jquery.datetimepicker.min.css') !!}" rel="stylesheet" />
<!--Sorting start-->
<script src="{!! asset('assets/admin/js/jquery-ui.min.js') !!}"></script>
<link href="{!! asset('assets/admin/dist/css/jquery-ui.min.css') !!}" rel="stylesheet" />
<script>
    $(document).ready(function(){
        var lastScrollPosition = 0; //variables defined in upper scope
        var tempScrollPosition = 0;
        window.onscroll = function () { // Up to you requirement you may change it to another elemnet e.g $("#YourPanel").onscroll
            clearTimeout($.data(this, 'scrollTimer'));
            $.data(this, 'scrollTimer', setTimeout(function () {
                tempScrollPosition = lastScrollPosition; // Scrolls don't change from position a to b. They cover some numbers between a and b during the change to create a smooth sliding visual. That's why we pick the previous scroll position with a timer of 250ms.
            }, 250));

            lastScrollPosition = $(document).scrollTop(); // Up to you requirement you may change it to another elemnet e.g $("#YourPanel").onscroll
        };
        $('#ipqc-sorting').sortable({
            connectWith: "#ipqc-sorting",
            cursor: "move",
            axis: 'y',
            handle: ".sort",            
            scroll: true,
            scrollSensitivity: 80,
            scrollSpeed: 3,
            sort: function(event, ui) {
                var currentScrollTop = $(window).scrollTop(),
                    topHelper = ui.position.top,
                    delta = topHelper - currentScrollTop;
                setTimeout(function() {
                    $(window).scrollTop(currentScrollTop + delta);
                }, 500);
            },
            stop: function (event, ui) {
                
                $('#ipqc-sorting > li').each(function(i, e){
                    $(this).find('.serialNumber').text(i+1);
                })
            },
        });
    })
</script>
<style>
    ul#ipqc-sorting li, ul#ipqc-sorting2 li {
        list-style: none;
        display: flex;
        align-items: center;
    }
    ul#ipqc-sorting, ul#ipqc-sorting2 {
        padding: 0;
    }
    ul#ipqc-sorting li .sort {
        width: 50px;
        text-align: center;
        line-height: 1;
        font-size: 22px;
        color: #666;
        cursor: move;
    }
    .blanckArea{
        width: 50px;
    }
</style>
<!--Sorting end-->
<script type="text/javascript">
    function get_model(e)
    {
        if(e.options[e.selectedIndex])
        {
            var model = e.options[e.selectedIndex].getAttribute("model");
            $("#model_no").val(model);
        }
        else
        {
            $("#model_no").val('');
        }
    }

    var role_id = {{ auth()->guard('admin')->user()->role_id }};
    if(role_id > 2) {
        var currentDate = "{{ date('Y-m-d') }}";
        var twoDaysPastDate = "{{ date('Y-m-d', strtotime(' - 7 day', strtotime(date('Y-m-d')))) }}";
    } else {
        var twoDaysPastDate = "1970-01-01";
        var currentDate = "2080-01-01";
    }
    $('#ipqc_date').datetimepicker({
        format:'Y-m-d',
        closeOnDateSelect:true,
        minDate:twoDaysPastDate,
        maxDate:currentDate,
        timepicker:false
    });

    $(function () { 
        $(".company_id, #mask_type_id").select2({
            placeholder: "--- Choose ---",
            maximumSelectionLength: 1,
            formatSelectionTooBig: function (limit) {
                return 'Too many selected items';
            },
        }).on("select2:select", function (e) {
           
        }).on('select2:unselect', function (e) {
            
        });
    });
    $(".space1").keypress(function(e) {
                 if (e.which === 32 && !this.value.length) {
               e.preventDefault();
           }
           var inputValue = e.charCode;
    });

    $(".space").keypress(function(e) {
            if (e.which === 32 && !this.value.length) {
               e.preventDefault();
           }
           var inputValue = e.charCode;
           if(! (   (inputValue >= 65 && inputValue <= 90) || //A-Z
                    (inputValue >= 95 && inputValue <= 122) || //a-z
                    (inputValue >= 45 && inputValue <= 57) || //0-9
                    (inputValue == 13) )  //Enter
                    && (inputValue != 32 && inputValue != 0)
                )
           {
               e.preventDefault();
           }     
    });
    const tx = document.getElementsByTagName('textarea');
    for (let i = 0; i < tx.length; i++) {
      tx[i].setAttribute('style', 'height:' + (tx[i].scrollHeight) + 'px;overflow-y:hidden;');
      tx[i].addEventListener("input", OnInput, false);
    }
    function OnInput() {
      this.style.height = 'auto';
      this.style.height = (this.scrollHeight) + 'px';
    }
    
    $( "#updateNewIPQC" ).validate({
            errorElement: "em",
            errorPlacement: function ( error, element ) {
                // Add the `help-block` class to the error element
                error.addClass( "help-block" );
                // Add `has-feedback` class to the parent div.form-group
                // in order to add icons to inputs
                element.parents( ".col-sm-5" ).addClass( "has-feedback" );
                if ( element.prop( "type" ) === "checkbox" ) {
                    error.insertAfter( element.parent( "label" ) );
                } else {
                    error.insertAfter( element );
                }
                // Add the span element, if doesn't exists, and apply the icon classes to it.
                if ( !element.next( "span" )[ 0 ] ) {
                    $( "<span class='glyphicon glyphicon-remove form-control-feedback'></span>" ).insertAfter( element );
                }
            },
            success: function ( label, element ) {
                // Add the span element, if doesn't exists, and apply the icon classes to it.
                if ( !$( element ).next( "span" )[ 0 ] ) {
                    $( "<span class='glyphicon glyphicon-ok form-control-feedback'></span>" ).insertAfter( $( element ) );
                }
            },
            highlight: function ( element, errorClass, validClass ) {
                $( element ).parents( ".col-sm-5" ).addClass( "has-error" ).removeClass( "has-success" );
                $( element ).next( "span" ).addClass( "glyphicon-remove" ).removeClass( "glyphicon-ok" );
            },
            unhighlight: function ( element, errorClass, validClass ) {
                $( element ).parents( ".col-sm-5" ).addClass( "has-success" ).removeClass( "has-error" );
                $( element ).next( "span" ).addClass( "glyphicon-ok" ).removeClass( "glyphicon-remove" );
            }
    }); 

</script>
<script>
	document.querySelectorAll('#watermarked').forEach(function(el) {
			  el.dataset.watermark = (el.dataset.watermark + ' ').repeat(500);
		  });
  </script>
@endsection