@extends('companyuser::layouts.master')
@section('title', __(''))
@section('breadcrumb')
    <div class="row breadcrumbs-top">
        <div class="breadcrumb-wrapper col-xs-12">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a>@lang('accounting::chart_of_accounts.Accounting')</a>
                </li>
                <li class="breadcrumb-item active"><a
                        href="{{route('company.manual-journal-entries.import', $subdomain)}}">{{ __('landing_page.import_journal_entries') }}</a>
                </li>
            </ol>
        </div>
    </div>
@endsection
@section('extra-styles')
    <link href="{{asset('assets/css/uploader.css') }}" rel="stylesheet">
@endsection

@section('content')
<section>
    <form action="{{route('company.manual-journal-entries.import.store', $subdomain)}}" method="POST" id="import_journal_entries_form" autocomplete="off" enctype="multipart/form-data">
        @csrf
        <div class="container-fluid px-3">
            <div class="row text-right">
                <div class="col-md-6 headTitle">
                    <h3 class="py-half">{{ __('landing_page.import_journal_entries') }}</h3>
                </div>
                <div class="col-md-6 divBack">
                    <a href="{{route('company.manual-journal-entries.import', $subdomain)}}" class="btn btn-primary btn-min-width">{{__('Back')}}</a>
                </div>
            </div>
            @include('companyuser::errors.all')
            @include('companyuser::errors.lists')
            <div class="d-flex justify-content-center text-center bg-white">
                <div class="col-md-8 py-2">
                        <div>
                            <h3>{{ __('landing_page.import_journal_entries') }}</h3>
                        </div>
                </div>
            </div>
            <div class="card mb-0">
                <div class="card-body  in">
                    <div class="d-flex align-items-center">
                        <div class="col-md-12 text-center">
                        <br>
                            <input type="hidden" id="needed_indexes" name="needed_indexes" value="">
                            <div class="align-items-center justify-content-center">
                                <div class="col-md-10">
                                    @foreach ($neededColumnsIndexes as $neededColumnsName)
                                        <div class="col-sm-4" style="margin-bottom: 15px;">
                                            <label for="{{$neededColumnsName}}">{{ __('accounting::manual_journal_entries.needed_indexes.' . $neededColumnsName) }}</label>
                                            <input required style="height: 2.8rem;" class="form-control needed_indexes" type="number" id="{{$neededColumnsName}}">
                                        </div>
                                    @endforeach
                                </div>
                                <div class="col-md-2 ">
                                    <img src="{{ asset('assets/images/svg/upload.svg') }}" alt="download" class="" width="150">
                                    <div class="text_cont">
                                        <h4 class="main_txt">
                                            {{__('Upload the file')}}
                                        </h4>
                                    </div>
                                    <div class="col-sm-12 d-flex justify-content-center uploader">
                                        <div class="dummy_uploader">
                                            <div class="w-100 justify-content-center">
                                                <span class="col-md-12 uploader_txt" style="background-color: white"></span>
                                                <span class="choose_txt" id="uploadButton" style="cursor: pointer">{{__('Choose the file')}}</span>
                                            </div>
                                            <input type="file" name="sheet" id="uploadItem" class="cursor-pointer" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel">
                                            @error('sheet')
                                                <span class="invalid-feedback text text-danger" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                            @enderror
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 text-center my-2">
                            <button type="submit" class="btnWidth btn btn-primary mr-1 saveDraftBtn">Upload</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>
</section>
@endsection


@section('extra_scripts')
    <script>
        window.addEventListener('DOMContentLoaded', function() {
            (function($) {
               $('#import_journal_entries_form').submit(function (e) {
                   var needed_indexes = {};
                   $(".needed_indexes").each(function (key, element) {
                       if(element.value) {
                           needed_indexes[element.id] = element.value;
                       }
                   });
                   $("#needed_indexes").val(JSON.stringify(needed_indexes));
                   $('#overlay').css('display', 'flex');
               });

                $(document).ready(function () {
                    $("#uploadItem").change(function (event) {
                        readURLText(this);
                    });

                    document.getElementById('uploadButton').addEventListener('click',()=>{
                        document.getElementById('uploadItem').click();
                    });
                });
            })(jQuery);
        });

        function readURLText(input){
            if (input.files && input.files[0]) {
                var filename = $(input).val();
                filename = filename.substring(filename.lastIndexOf('\\') + 1);
                $(input).closest(".dummy_uploader").find('.uploader_txt').text(filename);
            }

        }

    </script>
@endsection