@extends('layouts.main')
@section('content')
<!--begin::Card-->
<div class="card card-custom">
    <div class="card-header">
        <div class="card-title">
            <span class="card-icon">
                <i class="la la-user-plus text-primary"></i>
            </span>
            <h3 class="card-label">Edit Job</h3>
        </div>
        
    </div>
    <form class="form" id="profile_create_form" action="{{route('job.update.submit',['id'=>$job->id])}}" method="post" autocomplete="off">
        {{ csrf_field() }}
        <div class="card-body"> 
            <div class="row">
                <div class="form-group col-lg-3 col-md-3 col-sm-12">
                    <label>Job Id<span class="text-danger">*</span></label>
                    <input type="text" id="job_id" name="job_id" class="form-control" value="{{ $job->title }}" required placeholder="Enter Job Id">
                </div> 
                <div class="form-group col-lg-3 col-md-3 col-sm-12">
                    <label>Job type<span class="text-danger">*</span></label>
                    <select name="job_type" id="job_type" class="form-control" required>
                        <option {{ $job->job_type==1 ? 'selected' : '' }} value="1">Residential</option>
                        <option {{ $job->job_type==2 ? 'selected' : '' }} value="2">Commercial</option>
                        <option {{ $job->job_type==3 ? 'selected' : '' }} value="3">Junk Patrol</option>
                    </select>
                </div>       
                               
                {{-- <div class="form-group col-lg-4 col-md-4 col-sm-12">
                    <label>Job date<span class="text-danger">*</span></label>
                    <div class="input-group date">
                        <input type="text" value="{{ $common->show_formatted_date($job->job_date) }}" class="form-control datetimepicker-input" name="job_date" id="job_date" placeholder="Select job date"  data-toggle="datetimepicker" data-target="#job_date" readonly="" required="" />
                        <div class="input-group-append" data-target="#job_date" data-toggle="datetimepicker">
                            <span class="input-group-text">
                                <i class="ki ki-calendar"></i>
                            </span>
                        </div>
                    </div>
                </div>  --}}
                 
                <div class="form-group col-lg-3 col-md-3 col-sm-12">
                    <label>My credit card tip<span class="text-danger">*</span></label>
                    <input type="number" value="{{ $job->my_credit_card_tip }}" id="my_credit_card_tip" name="my_credit_card_tip" class="form-control" required placeholder="Enter my credit card tip">
                </div> 
                 
                
               
                <div class="form-group col-lg-3 col-md-3 col-sm-12">
                    <label>Payment type<span class="text-danger">*</span></label>
                    <select name="payment_type" id="payment_type" class="form-control">
                        <option value="">Select payment Type</option>
                        {{-- <option {{ $job->payment_type==1 ? 'selected' : '' }} value="1">Check</option>
                        <option {{ $job->payment_type==2 ? 'selected' : '' }} value="2">Credit Card</option>
                        <option {{ $job->payment_type==3 ? 'selected' : '' }} value="3">Cash</option> --}}
                        <option {{ $job->payment_type==4 ? 'selected' : '' }} value="4">Visa</option>
                        <option {{ $job->payment_type==5 ? 'selected' : '' }} value="5">Mastercard</option>
                        <option {{ $job->payment_type==6 ? 'selected' : '' }} value="6">American Express</option>
                        <option {{ $job->payment_type==7 ? 'selected' : '' }} value="7">Discover</option>
                        <option {{ $job->payment_type==1 ? 'selected' : '' }} value="1">Check</option>
                        <option {{ $job->payment_type==3 ? 'selected' : '' }} value="3">Cash</option>
                        <option {{ $job->payment_type==8 ? 'selected' : '' }} value="8" {{ $job->job_type==1 ? 'disabled' : '' }}>Invoice</option>
                        <option {{ $job->payment_type==9 ? 'selected' : '' }} value="9">Split Payment</option>
                    </select>
                </div> 
            </div>


            
            <div class="row">
                <div class="form-group col-lg-4 col-md-4 col-sm-12" id="cc-block" @if($job->payment_type!=2) style="display: none" @endif>
                    <label>CC type<span class="text-danger">*</span></label>
                    <select name="cc_type" id="cc_type" class="form-control">
                        <option {{ $job->cc_type=='Visa' ? 'selected' : '' }} value="Visa">Visa</option>
                        <option {{ $job->cc_type=='Mastercard' ? 'selected' : '' }} value="Mastercard">Mastercard</option>
                        <option {{ $job->cc_type=='Discover' ? 'selected' : '' }} value="Discover">Discover</option>
                        <option {{ $job->cc_type=='American Express' ? 'selected' : '' }} value="American Express">American Express</option>
                    </select>
                </div>
                <div class="form-group col-lg-4 col-md-4 col-sm-12">
                    <label>Total job revenue<span class="text-danger">*</span></label>
                    <input type="number" value="{{ $job->total_job_revenue }}"   id="total_job_revenue" name="total_job_revenue" class="form-control" required placeholder="Enter total job revenue" onchange="updateMyJobRevenue()">
                </div>
                
                <div class="form-group col-lg-4 col-md-4 col-sm-12">
                    <label>Number of team members<span class="text-danger">*</span></label>
                    <input type="number" value="{{ ($add_user == 1) ? $job->number_of_team_member+1 : $job->number_of_team_member  }}" {{($add_user == 1) ? 'readonly' : 'readonly'}} id="number_of_team_member" name="number_of_team_member" class="form-control" required placeholder="Enter number of team member">
                </div> 
                <div class="form-group col-lg-4 col-md-4 col-sm-12">
                    <label>My job revenue<span class="text-danger">*</span></label>
                    <input type="number" value="{{ ($add_user == 1) ? round($job->total_job_revenue/($job->number_of_team_member+1),2) : $job->my_job_revenue  }}" id="my_job_revenue" name="my_job_revenue" class="form-control" required placeholder="Enter my job revenue">
                </div>
                @if($add_user == 1)
                <div class="form-group col-lg-4 col-md-4 col-sm-12 additional" >
                    <label>Additional Team member<span class="text-danger">*</span></label>
                    <select name="additional_team_member" id="additional_team_member" class="form-control ">
                        @foreach ($additional_profiles as $profile)
                        <option value="{{ $profile->id }}">{{ $profile->profile_last_name }} {{ $profile->profile_first_name }} </option>
                        @endforeach
                    </select>
                    <div class="fv-plugins-message-container"></div>
                </div> 
                @endIf
                <div class="form-group col-lg-4 col-md-4 col-sm-12">
                    <label>Reason for Edit<span class="text-danger">*</span></label>
                    <textarea name="reason" id="reason" class="form-control">{{$job->reason}}</textarea>
                </div>
                <input type="hidden" id="add_user" name="add_user" value="{{$add_user}}" >

            </div>
        </div> 
        <div class="card-footer">
            <div class="row">
                <div class="col-lg-9 ml-lg-auto">
                    <button type="submit" class="btn btn-primary font-weight-bold mr-2" id="submitBtn">Save</button>
                    <button type="reset" class="btn btn-light-primary font-weight-bold">Cancel</button>
                </div>
            </div>
        </div>
    </form>
</div>
<!--end::Card-->
@endsection

@section('sub_header')
<div class="subheader py-2 py-lg-6 subheader-transparent" id="kt_subheader">
    <div class="container d-flex align-items-center justify-content-between flex-wrap flex-sm-nowrap">
        <!--begin::Info-->
        <div class="d-flex align-items-center flex-wrap mr-1">
            <!--begin::Page Heading-->
            <div class="d-flex align-items-baseline flex-wrap mr-5">
                <!--begin::Page Title-->
                <h5 class="text-dark font-weight-bold my-1 mr-5">Edit Job</h5>
                <!--end::Page Title-->
                <!--begin::Breadcrumb-->
                <ul class="breadcrumb breadcrumb-transparent breadcrumb-dot font-weight-bold p-0 my-2 font-size-sm">
                    <li class="breadcrumb-item text-muted">
                        <a href="{{route('job.list')}}" class="text-muted">Jobs</a>
                    </li>
                    <li class="breadcrumb-item text-muted">
                        <a href="#" class="text-muted">Edit</a>
                    </li>
                </ul>
                <!--end::Breadcrumb-->
            </div>
            <!--end::Page Heading-->
        </div>
        
    </div>
</div>
@endsection
@section('theam_css')
<link href="{{ $common->getTheamUrl('assets/plugins/custom/datatables/datatables.bundle.css') }}" rel="stylesheet" type="text/css" />

@endsection

@section('js_file')
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js" integrity="sha512-qTXRIMyZIFb8iQcfjXWCO8+M5Tbc38Qi5WzdPOYZHIlZpzBHG3L3by84BBBOiRGiEb7KKtAOAs5qYdUiZiQNNQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="{{ $common->getTheamUrl('assets/plugins/custom/datatables/datatables.bundle.js') }}"></script>
@endsection

@section('page_js')
    <script>
        $(document).ready(function(){

            @if(Session::has('success'))
                toastr.success("{{Session::get('success')}}");
            @endif 
            @if(Session::has('error'))
                toastr.error("{{Session::get('error')}}");
            @endif 
            $('#additional_team_member').select2();
            $('body').on('focus','#job_date',function(){
                $(this).datetimepicker({
                    format: moment_date_format
                });
            })
            
            $('body').on('change','#payment_type',function(){
                if($(this).val == 2){
                    $('#cc-block').show();
                }else if(this.value == 9){
                    $('#split-block').show();
                }else{
                    $('#cc-block').hide();
                    $('#split-block').hide();
                }
            }) 
            
            $('body').on('change','#job_type',function(){
                $('#cc-block').hide();
                let job_type = this.value;
                // if(job_type == 2){
                //     $('#payment_type').val("8"); 
                //     $('#payment_type option:not(:selected)').prop('disabled', true);
                // }else{
                //     $('#payment_type').val("1");  
                //     $('#payment_type option:not(:selected)').prop('disabled', false);
                // }
                if(job_type == 1){
                    $("#payment_type option[value='8']").prop('disabled', true);
                }else{
                    $("#payment_type option[value='8']").prop('disabled', false);
                }
            })

            
            const form = document.getElementById('profile_create_form');
            const fv = FormValidation.formValidation(
               form,
                {
                    fields: {
                        
                        job_id: {
                            validators: {
                                notEmpty: {
                                    message: 'Job Id is required'
                                },
                            }
                        },
                        
                        job_type: {
                            validators: {
                                notEmpty: {
                                    message: 'job type is required'
                                }
                            }
                        },
                        job_date: {
                            validators: {
                                notEmpty: {
                                    message: 'job date is required'
                                }
                            }
                        },
                        
                        my_credit_card_tip: {
                            validators: {
                                notEmpty: {
                                    message: 'my credit card tip is required'
                                },
                            }
                        },
                        total_job_revenue: {
                            validators: {
                                notEmpty: {
                                    message: 'total job revenue is required'
                                },
                            }
                        },
                        
                       
                       
                        number_of_team_member: {
                            validators: {
                                notEmpty: {
                                    message: 'Number of team member is required'
                                },
                            }
                        },
                        my_job_revenue: {
                            validators: {
                                notEmpty: {
                                    message: 'My job revenue is required'
                                },
                            }
                        }
                       
                       
                    },

                    plugins: { //Learn more: https://formvalidation.io/guide/plugins
                        trigger: new FormValidation.plugins.Trigger(),
                        // Bootstrap Framework Integration
                        bootstrap: new FormValidation.plugins.Bootstrap(),
                        // Validate fields when clicking the Submit button
                        submitButton: new FormValidation.plugins.SubmitButton(),
                        // Submit the form when all fields are valid
                        //defaultSubmit: new FormValidation.plugins.DefaultSubmit(),
                    }
                }
            );

            fv.on('core.form.valid', function() {
                var button = KTUtil.getById("submitBtn");
                KTUtil.btnWait(button, "spinner spinner-right spinner-white pr-15", "Submitting");
                const submitform = $('#profile_create_form');

                $.ajax({
                    url : submitform.attr('action'),
                    type : 'post',
                    dataType : "json",
                    data : submitform.serialize(),
                    success: function(response) {
                        if(response.status){
                            window.location.href= response.return_url
                            toastr.success(response.message);
                        } else {
                            if(response.message){
                                toastr.error(response.message);
                            }
                            if(response.errors){
                                Object.keys(response.errors).forEach(element_name => {
                                    var errors = response.errors[element_name];
                                    var inp=$(submitform).find('[name="'+element_name+'"]')
                                    $(inp).addClass('is-invalid')
                                    $(inp).closest('.form-group').find('.fv-plugins-message-container').html('<div data-field="'+element_name+'" data-validator="callback" class="fv-help-block">'+errors[0]+'</div>')
                                });
                            }
                        }
                        KTUtil.btnRelease(button);
                    },
                    error: function(response) {
                        KTUtil.btnRelease(button);
                    }
                });
            });
            
        });
        function updateMyJobRevenue(){
            var total_job_revenue=$("#total_job_revenue").val();
            var number_of_team_member=$("#number_of_team_member").val();

            if(total_job_revenue!="" && number_of_team_member!=""){
                var my_job=total_job_revenue/number_of_team_member
                $("#my_job_revenue").val(my_job.toFixed(2))
            }else{
                $("#my_job_revenue").val(0)
            }

        }
    </script>
@endsection