@extends('layouts.master')
@section('style')
@endsection

@section('content')
    <style>
        .label-text{font-size: 13px; padding-top: 10px; padding-bottom: 10px;}
        .label-text strong{font-size: 14px; display: block; line-height:1}

        ._selectProList {
            width: 100%;
            overflow-y: auto;
            display: flex;
            flex-direction: column;
            overflow: hidden;
            border-left: solid 1px #e4e4e4;
            padding-bottom: 20px
        }
        .total-corton{font-size: 14px; padding-top: 0px; padding-bottom: 10px}
        .total-corton span {
            font-family: 'Rationale', sans-serif;
            font-size: 20px !important; font-weight: normal;
            margin-top: -2px; float: right; line-height: 1
        }
        .action-btn{ padding: 20px; border-top: solid 1px #e4e4e4; text-align: right}
        .form-group .form-control{height: 35px}
    </style>

    <div class="row mt-2 mb-3">
        <div class="col-lg-6 col-md-6 col-sm-6">
            <h2 class="_head01">Targets <span> Management</span></h2>
        </div>

        <div class="col-lg-6 col-md-6 col-sm-6">
            <ol class="breadcrumb">
                <li><a href="#"><span>Target</span></a></li>
                <li><span>Set</span></li>
            </ol>
        </div>
    </div>


    <div class="row">
        <div class="col-md-12">
            <div class="card" id="floating-label">
            @php
            $pro = 0;
                foreach($data as $d){
                    if($d->unit_id == 0)
                        $pro = $d->target_qty;
                }
            @endphp
                <div class="header PT-15 PB-15">
                    <div class="row">
                        <div class="col"><h2>Target <span>Set</span></h2></div>
                        <div class="col text-center font14"><strong>Employee: </strong> {{$employee[0]->employee_first_name}} {{$employee[0]->employee_last_name}}</div>
                        <div class="col text-right font14"><strong>Month: </strong> {{$month_name}}, {{Date('Y')}}</div>
                    </div>
                </div>
                <form method="post" action="/update-secondary-target">
                    @CSRF
                    <div class="row m-0">

                    <div class="col-md-3 PT-5">
                        <label class="font12 mb-0">Productivity %</label>
                        <div class="form-group h-auto">
                            <input type="text" class="form-control" name="productivity" id="productivity" oninput="checkNegativeValue('productivity', this.value)" value="{{($pro)? $pro:''}}" placeholder="e.g 10">
                        </div>
                    </div>

                    <div class="col-12 p-0 PB-10">
                        <div class="header addPR-head">
                            <h2>Unit <span>Target</span></h2>
                        </div>
                    </div>

                    @foreach($data as $d)
                        @if($d->unit_id !=0)
                        <input type="hidden" name="id_{{$d->unit_id}}" value="{{$d->id}}">
                        <div class="col-md-4">
                            <div class="row">
                                <div class="col-md-12">
                                    <label class="font12 mb-0">{{$d->unit_name}}</label>
                                    <div class="form-group h-auto">
                                        <input type="text" class="form-control" oninput="checkNegativeValue('target_{{$d->unit_id}}', this.value)" name="target_{{$d->unit_id}}" id="target_{{$d->unit_id}}" value="{{$d->target_qty}}" placeholder="">
                                    </div>
                                </div>
                                <div class="col-md-12 total-corton">Cartons <span>{{number_format($d->in_carton,2)}} <small>CTNS</small></span> </div>
                            </div>
                        </div>
                        @else
                                <input type="hidden" name="id_{{$d->unit_id}}" value="{{$d->id}}">
                        @endif
                    @endforeach

                    <div class="col-md-12 action-btn">
                        <button type="submit" class="btn btn-primary mr-2">Save</button>
                        <button id="pl-close" type="submit" class="btn btn-cancel">Cancel</button>
                    </div>
                </div>
                </form>
            </div>
        </div>
    </div>

@endsection

@section('scripts')
    <script>
        function checkNegativeValue(id, value){
            if(value<0) {
                self.notification('error', 'Enter Value Greater Then Zero.');
                $('#'+id).val('');
            }
        }

        function notification(type, message) {
            var bgColor = (type == 'error') ? 'red' : 'green';
            var el = $('#notifDiv');
            el.fadeIn();
            el.css('background', bgColor);
            el.text(message);
            setTimeout(() => {
                el.fadeOut();
            }, 3000);
        }


    </script>


@endsection