@use('App\Services\Date')
@extends('companyuser::layouts.master')
@section('title', __('accounting::manual_journal_entries.New Manual Journal Entry'))
@section('extra-styles')
<link rel="stylesheet" href="{{asset('assets/vendors/css/pickers/daterange/daterangepicker.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('assets/vendors/css/pickers/datetime/bootstrap-datetimepicker.css')}}">
<link rel="stylesheet" href="{{asset('assets/vendors/css/pickers/pickadate/pickadate.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('assets/css/plugins/pickers/daterange/daterange.css')}}">
<link rel="stylesheet" href="{{asset('assets/css/custom.css')}}">
<link href="{{asset('assets/css/style-svgFont.css') }}" rel="stylesheet">
<script src="{{ asset('/js/app.js') }}" defer></script>
<style>
    .hide {
        display: none;
    }
</style>

@endsection
@push('generalSettings-style')
<link href="{{ url('assets/css/plugins/imageUpload/style.css') }}" rel="stylesheet">
<script src="{{ asset('/assets/js/plugins/range/range.js') }}" defer></script>
<script src="{{ asset('/assets/js/plugins/input-dropdown/input-dropdown.js') }}" defer></script>
<link href="{{ asset('/assets/css/plugins/input-dropdown/input-dropdown.css') }}" rel="stylesheet">
<script>
    window.addEventListener('DOMContentLoaded', function() {
        (function($) {
            $(document).ready(function() {
                // For A Delete Record Popup
                if (document.location.search.length) {
                    // $('#collapseExample').toggleClass("collapse in");
                }
            });
        })(jQuery);
    });
</script>
@endpush
@section('breadcrumb')
<div class="row breadcrumbs-top">
    <div class="breadcrumb-wrapper col-xs-12">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a>@lang('accounting::manual_journal_entries.Accounting')</a></li>
            <li class="breadcrumb-item active"><a href="{{url('/accounting/journal-entries')}}">@lang('accounting::manual_journal_entries.Manual Journal Entries')</a></li>
            <li class="breadcrumb-item active"><a href="#">@lang('Create')</a></li>
        </ol>
    </div>
</div>
@endsection

@section('content')
<section id="basic-form-layouts" class="form-border add-form-section filter-section-collapse">
    @if($data['journal_entries_available_limit'] > 0 || is_null($data['journal_entries_available_limit']))
    @yield('open_form_tag')
    <div class="container-fluid">
        <div class="headBtns mx-1 fixed-btns">
            <div class="btn-group pull-right">
                @yield('action-buttons')
            </div>
            <div class="mb-1 pull-left">
                @yield('back_button')
            </div>
        </div>

        <div class=" match-height">
            <div>
                @include('companyuser::errors.all')
                @include('companyuser::errors.lists')
                <div class="card ">
                    <div>
                        <div class="alert alert-warning" id="journal-data-in-the-future" style="display: none">
                            @lang('accounting::manual_journal_entries.warning_journal_date_in_the_future')
                        </div>
                        <div class="card-block">
                            <div class="alert alert-warning">
                                <p class="mb-0"><i class="fa fa-exclamation-triangle"></i> @lang('accounting::manual_journal_entries.conflicting_records_note')</p>
                            </div>

                            <div class="form-body mt-3">
                                <div class="form-group">
                                    <div class="row">
                                        <div class="col-md-2">
                                            <span class="custom-control-description">
                                                <label>@lang('accounting::manual_journal_entries.Journal Date')</label>
                                                <i class="ft-info text-bold-600" data-toggle="tooltip" data-placement="bottom" title="@lang('accounting::manual_journal_entries.journal_data_validation_message')"></i>
                                            </span>
                                        </div>
                                        <div class="col-md-4">
                                            <x-date-picker
                                                mode="single"
                                                name="journal_date"
                                                input-id="journal_date"
                                                :value="old('journal_date') ?? (array_key_exists('defaultOrderData', $data) && $data['defaultOrderData'] ? $data['defaultOrderData']['journal_date'] : '')"
                                                input-class="h-45"
                                                :is-invalid="$errors->has('journal_date')"
                                                :max-date="Date::now('date')"
                                                :defaultToday="true"
                                            />

                                            @error('journal_date')
                                            <div class="invalid-feedback text text-danger w-100 d-block" role="alert">
                                                <p>{{ $message }}</p>
                                            </div>
                                            @enderror
                                        </div>
                                        <div class="col-md-2 offset-xs-2">
                                            <label>@lang('accounting::manual_journal_entries.Journal Number')</label>
                                        </div>
                                        <div class="col-md-2">
                                            <input type="text" name="code" value="{{ $data['lastCode'] + 1 }}"  class="w-100 form-control @if($errors->has('journal_number')) is-invalid @endif">
                                            @error('journal_number')
                                            <div class="invalid-feedback text text-danger" role="alert">
                                                <p>{{ $message }}</p>
                                            </div>
                                            @enderror
                                        </div>
                                    </div>
                                </div>
                                @yield('vue_component')
                                <div class="form-group">
                                    <div class="row">
                                        <div class="col-md-8">
                                            <label>{{__('accounting::manual_journal_entries.memo')}}</label>
                                            @if(!array_key_exists('entry',$data))
                                                @php
                                                    $MemoValue = old('memo')? old('memo') : (array_key_exists('defaultOrderData', $data) && $data['defaultOrderData']? $data['defaultOrderData']['memo'] : '');
                                                @endphp
                                            @else
                                                @php
                                                    $MemoValue = old('memo') ?? $data['entry']->memo;
                                                @endphp
                                            @endif
                                            <textarea name="memo" cols="10" rows="5" class="w-100 form-control @if($errors->has('memo')) is-invalid @endif">{{ $MemoValue }}</textarea>
                                            @error('memo')
                                            <span class="invalid-feedback text text-danger" role="alert">
                                                <span>{{ $message }}</span>
                                            </span>
                                            </span>
                                            @enderror
                                        </div>
                                        <div class="col-md-4">
                                        </div>
                                    </div>
                                </div>

                                <div class="row mb-2">
                                    <div class="col-md-12">
                                        <attachments-component
                                            :translations="{{ json_encode([
                                                'attachments' => __('general.attachments'),
                                                'attachments_validation' => __('general.attachments_validation'),
                                                'attachments_max_size' => __('general.attachments_max_size'),
                                                'selected_files' => __('general.selected_files'),
                                            ]) }}"
                                            :errors="{{ json_encode($errors->get('attachments.*')) }}"
                                            :preloaded-files="{{ json_encode($data['entry']->attachments ?? []) }}"
                                        ></attachments-component>
                                    </div>
                                </div>
                                @if(($data['customFields'])->count())
                                <div class="row mb-1">
                                    <button class="btn btn-default w-100 filterbtn" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
                                        <div class="d-flex justify-content-between">
                                            <span>{{ __('accounting::manual_journal_entries.additional fields') }} </span><i class="fa fa-angle-down"></i>
                                        </div>
                                    </button>
                                    <div class="collapse filter-section-collapse" id="collapseExample">
                                        <div class="card card-body mb-0">
                                            @foreach($data['customFields'] as $key=>$field)
                                            <div class="d-flex align-items-center w-100 col-md-4 input-group en">
                                                <div class="col-md-3">
                                                    <label for="{{$field->name_en}}">
                                                        {{ $field->{'name_'.app()->getLocale()} }}
                                                    </label>
                                                </div>
                                                <div class="col-md-9">
                                                    @if($field['type']=='checkbox')
                                                    <input id="{{$field->name_en}}" type="checkbox" name="custom_fields[{{($key+1)}}][value]" @if(isset($field['value'])||isset(old('custom_fields')[$key+1]['value'])) checked @endif>
                                                    @elseif($field->type == 'date')
                                                    <x-date-picker
                                                        mode="single"
                                                        :name="'custom_fields[' . ($key + 1) . '][value]'"
                                                        :input-id="$field->name_en"
                                                        :value="old('custom_fields') ? old('custom_fields')[$key + 1]['value'] : null"
                                                        input-class="h-45"
                                                        :placeholder="$field->{'name_'.app()->getLocale()}"
                                                    />
                                                    @else
                                                    <input value="{{old('custom_fields') ? old('custom_fields')[$key+1]['value'] : null}}" class="w-100 py-1 form-control" placeholder="{{ $field->{'name_'.app()->getLocale()} }}" name="custom_fields[{{($key+1)}}][value]" type="{{ $field->type }}" id="{{$field->name_en}}">
                                                    @endif

                                                    <input type="hidden" value="{{$field->name_ar}}" name="custom_fields[{{ ($key+1) }}][name_ar]">
                                                    <input type="hidden" value="{{$field->name_en}}" name="custom_fields[{{ ($key+1) }}][name_en]">
                                                    <input type="hidden" value="{{$field->type}}" name="custom_fields[{{ ($key+1) }}][type]">
                                                    <input type="hidden" value="{{$field->module}}" name="custom_fields[{{ ($key+1) }}][module]">
                                                </div>
                                            </div>
                                            @endforeach
                                        </div>
                                    </div>
                                </div>
                                @endif
                                <div class="modal fade" id="favoritesModalForSaveAndClose" tabindex="-1" role="dialog" aria-labelledby="favoritesModalLabel">
                                    <div class="modal-dialog" role="document">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                    <span aria-hidden="true">&times;</span></button>
                                                <h4 class="modal-title" id="favoritesModalLabel">@lang('accounting::manual_journal_entries.confirmation_date')</h4>
                                            </div>
                                            <div class="modal-body">
                                                <p>
                                                    @lang('accounting::manual_journal_entries.confirmation_date_in_past')
                                                </p>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-default mx-1" data-dismiss="modal">@lang('Cancel')</button>
                                                <span class="pull-right">
                                                    <button name="action" type="submit" value="save" class="btn btn-primary">@lang('Continue')</button>
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="modal fade" id="favoritesModalForSaveAndNew" tabindex="-1" role="dialog" aria-labelledby="favoritesModalLabel">
                                    <div class="modal-dialog" role="document">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                    <span aria-hidden="true">&times;</span></button>
                                                <h4 class="modal-title" id="favoritesModalLabel">@lang('accounting::manual_journal_entries.confirmation_date')</h4>
                                            </div>
                                            <div class="modal-body">
                                                <p>
                                                    @lang('accounting::manual_journal_entries.confirmation_date_in_past')
                                                </p>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-default mx-1" data-dismiss="modal">@lang('Cancel')</button>
                                                <span class="pull-right">
                                                    <button type="submit" name="action" value="save_new" class="btn btn-primary">@lang('Continue')</button>
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                @if($data['fiscalYear'])
                                <input type="hidden" id="fiscal_year" value="{{ $data['fiscalYear']['month'].'/'.$data['fiscalYear']['day'].'/'.$data['fiscalYear']['year'] }}">
                                <input name="fiscal_year_id" type="hidden" value="{{ $data['fiscalYear']->id }}">
                                @endif

                                @if(is_null($data['maxRecords']))
                                <input name="max_records" type="hidden" value="1">
                                @else
                                <input name="max_records" type="hidden" value="{{ $data['maxRecords'] }}">
                                @endif
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </form>
    @else
        @include('info.limit_reached')
    @endif
</section>



@endsection

@section('extra_scripts')
@hasSection('revert_script')
    @yield('revert_script')
@else
    <script>
        gtag('event', 'web_accounting_manual_journal_entries_create');
        console.log('web_accounting_manual_journal_entries_create event');
    </script>
@endif
<script>
    window.addEventListener('DOMContentLoaded', function() {
        (function($) {

            $(".printClick").on("click", function() {
                $('[name=is_print]').prop('checked', true);
            })
            //adjust submit buttons
            $('.dev-account-submit').click(function() {
                //take value from clicked btn
                $('#dev-action-holder').val($(this).attr('dev-value'));
                //submit form
                $('#accountForm').submit();
                //disabled form
                $(this).prop('disabled', true);
            });

            // get the fiscal year
            let fiscal_year = $('#fiscal_year').val();

            $('#actions-when-journal-date-in-past').hide();
            $('#actions-when-journal-date-not-in-past').show();

            // get journal date when change
            $('#journal_date').on('change', function() {
                if (fiscal_year) {
                    let journal_date = $('#journal_date').val();
                    let temp = journal_date.split("-");
                    // "2015-03-25" (The International Standard)
                    journal_date = temp[2] + '-' + temp[1] + '-' + temp[0];
                    journal_date = new Date(journal_date);
                    // Short Date	"03/25/2015"
                    fiscal_year = new Date(fiscal_year);
                    if (journal_date < fiscal_year) {
                        $('#actions-when-journal-date-not-in-past').hide();
                        $('#actions-when-journal-date-in-past').show();
                    } else {
                        $('#actions-when-journal-date-in-past').hide();
                        $('#actions-when-journal-date-not-in-past').show();
                    }

                    if (journal_date > new Date()) {

                        $('#journal-data-in-the-future').show();
                    } else {
                        $('#journal-data-in-the-future').hide();
                    }
                }

            });

        })(jQuery);
    });
</script>
<script src="{{url('assets/js/vendors/js/pickers/dateTime/moment-with-locales.min.js')}}" defer></script>
<script src="{{url('assets/js/vendors/js/pickers/dateTime/bootstrap-datetimepicker.min.js')}}" defer></script>
<script src="{{url('assets/js/vendors/js/pickers/pickadate/picker.js')}}" defer></script>
<script src="{{url('assets/js/vendors/js/pickers/pickadate/picker.date.js')}}" defer></script>
<script src="{{url('assets/js/vendors/js/pickers/pickadate/picker.time.js')}}" defer></script>
<script src="{{url('assets/js/vendors/js/pickers/pickadate/legacy.js')}}" defer></script>
<script src="{{url('assets/js/vendors/js/pickers/daterange/daterangepicker.js')}}" defer></script>
<script src="{{ asset('assets/js/custom/daterangepicker.js') }}" defer></script>
<script src="{{url('assets/js/vendors/js/pickers/dateTime/picker-date-time.js')}}" defer></script>
@endsection