@extends('admin.layouts.main')

@section('title')
Company - Payroll
@endsection

@section('content')
<main>
    <div class="two-col">

        @include("admin.common.sidebar")

        <div class="right-sec">
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="javascript:void(0)">{{ @trans('company.directory') }}</a></li>
                    <li class="breadcrumb-item active" aria-current="page">
                        <a href="{{ route('admin.companies.indexpageload', ['panel' => Session::get('panel')]) }}">{{ @trans('company.company') }}</a>
                    </li>
                    <li class="breadcrumb-item active" aria-current="page"><a href="{{ route('admin.companies.detail',['panel' => Session::get('panel'), 'id' => $id]) }}">{{ @trans('candidate.detail') }}</a> </li>
                    <li class="breadcrumb-item active" aria-current="page">{{ @trans('payroll.payroll_setup') }}</li>
                </ol>
            </nav>

            <div class="form-sec">

                @include('payroll::company_payroll.modules.store.common.form-step')

                @if(session('success'))
                <div class="alert alert-success" id="successAlert">
                    {{ session('success') }}
                </div>
                @endif

                @if(session('error'))
                <div class="alert alert-danger" id="errorAlert">
                    {{ session('error') }}
                </div>
                @endif

                <div class="container">
                    <div class="row">
                        <div class="col-xl-8 offset-xl-2 col-lg-10 offset-lg-1">
                            <div class="step-box">
                                <form method="post" action="{{ route('admin.payroll.store', ['panel' => session('panel')]) }}" id="frmPayrollAdd" autocomplete="off" enctype="multipart/form-data">
                                    @csrf
                                    @if($id)
                                    <input type="hidden" name="company_id" value="{{ $id }}" />
                                    <input type="hidden" name="id" value="@if($payrollDetails && $payrollDetails->id) {{$payrollDetails->id ?? ''}} @endif" />
                                    <input type="hidden" name="edit" value="@if(isset($edit) && $edit == true) {{$edit ?? ''}} @endif" />
                                    @endif
                                    <div class="tab">
                                        <h2 class="form-sec-title">{{ @trans('payroll.payroll_setup') }}</h2>
                                        <div class="row">
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('payroll.salary_payment_cycle') }}
                                                        <span class="required">*</span>
                                                        <!-- <img src="{{asset('img/admin/ic_info_pm_tooltip.svg')}}" class="tooltip-popover project-tooltip-popover cursor-pointer" data-content="{{ @trans('payroll.salary_payment_cycle_tooltip') }}" tabindex="0"> -->
                                                    </label>
                                                    <input type="text" id="salary_payment_cycle" name="salary_payment_cycle" class="form-control" placeholder="{{ @trans('payroll.salary_payment_cycle') }}" readonly value="Monthly">
                                                </div>
                                            </div>

                                            <div class="col-md-6">
                                                <div class="form-group date">
                                                    <label class="control-label">{{ @trans('payroll.salary_payment_schedule') }}
                                                        <span class="required">*</span>
                                                        <!-- <img src="{{asset('img/admin/ic_info_pm_tooltip.svg')}}" class="tooltip-popover project-tooltip-popover cursor-pointer" data-content="{{ @trans('payroll.salary_payment_schedule_tooltip') }}" tabindex="0">-->
                                                    </label>
                                                    <div class="input-group date">
                                                        <input type="text" class="form-control salary_payment_schedule bg-white" placeholder="{{ @trans('payroll.salary_payment_schedule') }}" id="salary_payment_schedule" name="salary_payment_schedule" value="@if($payrollDetails && $payrollDetails->payment_schedule){{$payrollDetails->payment_schedule ?? ''}}@else{{old('salary_payment_schedule')}}@endif">
                                                        <div class="input-group-addon">
                                                            <span class="material-icons">date_range</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('payroll.monthly_working_days') }}
                                                        <span class="required">*</span>
                                                        <!-- <img src="{{asset('img/admin/ic_info_pm_tooltip.svg')}}" class="tooltip-popover project-tooltip-popover cursor-pointer" data-content="{{ @trans('payroll.monthly_working_days_tooltip') }}" tabindex="0"> -->
                                                    </label>
                                                    <input type="text" id="monthly_working_days" name="monthly_working_days" class="form-control numeric-val" placeholder="{{ @trans('payroll.monthly_working_days') }}" value="@if ($payrollDetails && $payrollDetails->working_days){{$payrollDetails->working_days ?? ''}}@else{{old('monthly_working_days')}}@endif">
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group date">
                                                    <label class="control-label">{{ @trans('payroll.payroll_start_from') }}
                                                        <span class="required">*</span>
                                                        <!-- <img src="{{asset('img/admin/ic_info_pm_tooltip.svg')}}" class="tooltip-popover project-tooltip-popover cursor-pointer" data-content="{{ @trans('payroll.payroll_start_from_tooltip') }}" tabindex="0"> -->
                                                    </label>
                                                    <div class="input-group date">
                                                        <input type="text" class="form-control dateselect bg-white" placeholder="{{ @trans('payroll.payroll_start_from') }}" id="date" name="payroll_start_from" readonly value="@if ($payrollDetails && $payrollDetails->start_date) {{$payrollDetails->start_date}}@else{{old('payroll_start_from')}}@endif">
                                                        <div class="input-group-addon">
                                                            <span class="material-icons">date_range</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('payroll.retirement_year') }}
                                                        <span class="required">*</span>
                                                        <!-- <img src="{{asset('img/admin/ic_info_pm_tooltip.svg')}}" class="tooltip-popover project-tooltip-popover cursor-pointer" data-content="{{ @trans('payroll.monthly_working_days_tooltip') }}" tabindex="0"> -->
                                                    </label>
                                                    <input type="text" id="retirement_year" name="retirement_year" class="form-control age-numeric-val" placeholder="{{ @trans('payroll.retirement_year') }}" value="@if ($payrollDetails && $payrollDetails->retirement_year){{$payrollDetails->retirement_year ?? ''}}@else{{old('retirement_year')}}@endif">
                                                </div>
                                            </div>
                                            <div class="col-md-12">
                                                <div class="form-group file-upload">
                                                    <label class="control-label">{{ @trans('company.company_logo') }}
                                                        <span class="required">*</span>
                                                    </label>
                                                    <div class="custom-file">
                                                        <input type="file" class="custom-file-input fileupload" id="companyLogo" name="companyLogo">
                                                        <label class="custom-file-label" for="companyLogo"><img src="{{ asset('/img/file-upload.svg')}}" alt="upload">{{ @trans('company.upload') }}</label>
                                                    </div>
                                                </div>
                                            </div>
                                            @if($errors->has('companyLogo'))
                                            <span class="invalid-feedback" style="margin-left: 15px;">{{$errors->first('companyLogo')}}</span>
                                            @endif
                                            @if(isset($companyDetails->logo_image))
                                            <div class="col-md-12 previewDiv">
                                                <div class="thumbnail-wrapper">
                                                    <img width="100" height="100" class="preview" src="{{ config('custom.download.url') }}{{ config('custom.upload.company.logo_path') }}/{{ $companyDetails->logo_image }}">
                                                    <a href="javascript:void(0)" class="deleteLogo">
                                                        <i class="material-icons delete">close</i>
                                                    </a>
                                                </div>
                                            </div>
                                            @else
                                            <div class="col-md-12 previewDiv" style="display:none;">
                                                <div class="thumbnail-wrapper">
                                                    <img width="100" height="100" class="preview" src="">
                                                </div>
                                            </div>
                                            @endif
                                        </div>
                                        <h2 class="form-sec-title mt-3">{{ @trans('payroll.registration_numbers') }}</h2>
                                        <div class="row">
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('payroll.pension_contribution_value') }}</label>
                                                    <input type="text" id="pension_contribution_value" name="pension_contribution_value" class="form-control" placeholder="{{ @trans('payroll.pension_contribution_value') }}" value="@if ($payrollDetails && $payrollDetails->pension_contribution_percentage){{$payrollDetails->pension_contribution_percentage ?? ''}}@else{{old('pension_contribution_value')}}@endif">
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('payroll.pension_registration_number') }}</label>
                                                    <input type="text" id="pension_registration_number" name="pension_registration_number" class="form-control" placeholder="{{ @trans('payroll.pension_registration_number') }}" value="@if ($payrollDetails && $payrollDetails->pension_registration_number){{$payrollDetails->pension_registration_number ?? ''}}@else{{old('pension_registration_number')}}@endif">
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('payroll.sdl_contribution_value') }}</label>
                                                    <input type="text" id="sdl_contribution_value" name="sdl_contribution_value" class="form-control" placeholder="{{ @trans('payroll.sdl_contribution_value') }}" value="@if ($payrollDetails && $payrollDetails->sdl_contribution_percentage){{$payrollDetails->sdl_contribution_percentage ?? ''}}@else{{old('sdl_contribution_value')}}@endif">
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('payroll.sdl_registration_number') }}</label>
                                                    <input type="text" id="sdl_registration_number" name="sdl_registration_number" class="form-control" placeholder="{{ @trans('payroll.sdl_registration_number') }}" value="@if ($payrollDetails && $payrollDetails->sdl_registration_number){{$payrollDetails->sdl_registration_number ?? ''}}@else{{old('sdl_registration_number')}}@endif">
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('payroll.wcf_contribution_value') }}</label>
                                                    <input type="text" id="wcf_contribution_value" name="wcf_contribution_value" class="form-control" placeholder="{{ @trans('payroll.wcf_contribution_value') }}" value="@if ($payrollDetails && $payrollDetails->wcf_contribution_percentage){{$payrollDetails->wcf_contribution_percentage ?? ''}}@else{{old('wcf_contribution_value')}}@endif">
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('payroll.wcf_registration_number') }}</label>
                                                    <input type="text" id="wcf_registration_number" name="wcf_registration_number" class="form-control" placeholder="{{ @trans('payroll.wcf_registration_number') }}" value="@if ($payrollDetails && $payrollDetails->wcf_registration_number){{$payrollDetails->wcf_registration_number ?? ''}}@else{{old('wcf_registration_number')}}@endif">
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('payroll.student_loan_deduction_value') }}</label>
                                                    <input type="text" id="student_loan_deduction_value" name="student_loan_deduction_value" class="form-control" placeholder="{{ @trans('payroll.student_loan_deduction_value') }}" value="@if ($payrollDetails && $payrollDetails->student_loan_deduction_percentage){{$payrollDetails->student_loan_deduction_percentage ?? ''}}@else{{old('student_loan_deduction_value')}}@endif">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="tab-btn">
                                            <div style="float: left;">
                                                <a class="btn btn-cncl" href="{{ route('admin.companies.detail',['panel' => Session::get('panel'), 'id' => $id]) }}">{{ @trans('project::project.cancel') }}</a>
                                            </div>
                                            <div style="float:right;">
                                                @if (isset($edit) && $edit == true)
                                                <button type="button" id="nextBtn" class="btn step-btn submitPayrollSetupBtn">{{ @trans('project::project.save') }}</button>
                                                @else
                                                <button type="button" id="nextBtn" class="btn step-btn submitPayrollSetupBtn">{{ @trans('project::project.save_next') }}</button>
                                                @endif
                                            </div>
                                        </div>
                                    </div>

                                </form>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
</main>
@endsection

@push('pageJs')
<script src="{{ asset('js/vendor/select2.customSelectionAdapter.js') }}"></script>
<script src="{{ asset('js/vendor/jquery.alphanum.min.js')}}"></script>
{!! JsValidator::formRequest('Modules\Payroll\Http\Requests\StorePayrollSetupRequest', '#frmPayrollAdd') !!}
<script>
    $(document).ready(function() {
        $(".numeric-val").numeric({
            allowMinus: false,
            allowDecSep: false,
            maxDecimalPlaces: 2,
            allowThouSep: false,
            min: 1,
            max: 30
        })
        $(".age-numeric-val").numeric({
            allowMinus: false,
            allowDecSep: false,
            maxDecimalPlaces: 3,
            allowThouSep: false,
            min: 1,
            max: 100
        })
        $('#project_importance').numeric({
            allowMinus: false,
            allowDecSep: false,
            allowThouSep: false,
            min: 0,
            max: 10
        });
        $('#actualization').numeric({
            allowMinus: false,
            allowDecSep: false,
            allowThouSep: false,
            min: 0,
            max: 100
        });
        var myForm = $('#frmPayrollAdd');
        $.data(myForm[0], 'validator').settings.ignore = "null";

    });
    $(document).ready(function() {
        var today = new Date();
        var $date = $('.dateselect').datepicker({
            autoHide: true,
            format: 'dd-mm-yyyy',
            zIndex: 2048,
            startDate: null,
            defaultViewDate: new Date(),
        });
        $('#date').change(function() {
            $(this).valid();
        })
    });
    $(document).ready(function() {
        var today = new Date();
        var $date = $('.salary_payment_schedule').datepicker({
            autoHide: true,
            format: 'dd',
            zIndex: 2048,
            startDate: null,
            defaultViewDate: new Date(),
        });
        $('#date').change(function() {
            $(this).valid();
        })

        @if($edit)
        $('.deleteLogo').click(function() {
            var deleteLogoUrl = "{{ route('admin.company.delete_logo',['panel' => Session::get('panel')])}}";
            var id = "{{ $companyDetails->id }}";
            axios.post(deleteLogoUrl, {
                    id: id
                })
                .then(function(response) {
                    $('.previewDiv').css('display', 'none');
                })
                .catch(function(error) {

                });
        });
        @endif
    });

    $(document).on('click', '.submitPayrollSetupBtn', function() {
        if ($('#frmPayrollAdd').valid()) {
            $('.submitPayrollSetupBtn').text('Please wait...');
            $('.submitPayrollSetupBtn').attr('disabled', 'disabled');
            $('#frmPayrollAdd').submit();
        }
    });
</script>
@endpush

@push('pageCss')
<link rel="stylesheet" href="{{ asset('css/vendor/select2.customSelectionAdapter.css') }}">
<link rel="stylesheet" href="{{ asset('css/admin/project/store.css') }}">
@endpush