@extends('layouts.app')

@section('content')

    <div class="d-flex justify-content-between align-items-center mb-20 content-heading">
        <h2 class="h4 font-w300 mb-0">انشاء مخزون جديد</h2>
    </div>


    <div class="block">

        {!! Form::open(['route' => ['dashboard.categories.products.stock.store', [$product->category, $product]]  ]) !!}
            
            <div class="block-header">
                <div class="btn btn-primary btn-sm btn-alt-primary btn-rounded pull-right" id="show-generate-random-string-form">
                    <i class="fa fa-plus ml-1"></i> توليد مخزون بشكل تلقائي
                </div>
            </div>

            <div class="block-content">
            
                <div class="row">

                    <div class="col-sm-12">
                        <div class="form-group">
                            
                            {!! Form::label('stock_content', 'المخزون') !!}
                            {!! Form::textarea('stock_content', null, ['id' => 'stock_content', 'class' => 'form-control']) !!}

                            <div class="text-secondary">يرجى اضافة كل مخزون في سطر جديد</div>

                            @if($errors->has('stock_content'))
                                <div class="text-danger">{{ $errors->first('stock_content') }}</div>
                            @endif

                        </div>
                    </div>

                </div>

            </div>

            <div class="block-content block-content-full block-content-sm bg-body-light font-size-sm">
                {!! Form::submit('انشاء', ['class' => 'btn btn-primary btn-alt-primary']) !!}
            </div>

        {!! Form::close() !!}

    </div>

    <div class="modal fade" id="generate-random-string" tabindex="-1" role="dialog" aria-labelledby="generate-random-string" aria-hidden="false">
        <div class="modal-dialog modal-lg modal-dialog-centered modal-dialog-popout" role="document">
            <div class="modal-content rounded">
                <div class="block block-rounded block-transparent mb-0 bg-pattern" style="background-image: url('{{ url('assets/media/various/bg-pattern-inverse.png') }}');">
                    <div class="block-header justify-content-end">
                        <div class="block-options">
                            <a class="font-w600 text-danger" href="#" data-dismiss="modal" aria-label="Close">اخفاء</a>
                        </div>
                    </div>
                    <div class="block-content block-content-full">
                        <div class="js-slider slick-dotted-inner" data-dots="true" data-arrows="false" data-infinite="false">
                            <div class="pb-50">
                                <div class="row justify-content-center text-center">
                                    <div class="col-md-10 col-lg-8">
                                            
                                        <div class="col-12">
                                            <div class="form-group">
                                                {!! Form::text('random_string_number', null, ['id' => 'random_string_number', 'class' => 'form-control col-12', 'placeholder' => 'العدد المطلوب']) !!}
                                            </div>
                                        </div>

                                        <button id="generate-random-string-btn" type="button" class="btn btn-sm btn-hero btn-noborder btn-primary mb-10">
                                            <i class="fa fa-plus ml-5"></i> توليد
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection

@section('scripts')

    <script>
        $(document).ready(function(){
            
            function generateRandomString(length) {
                var result           = '';
                var characters       = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
                var charactersLength = characters.length;
                for ( var i = 0; i < length; i++ ) {
                    result += characters.charAt(Math.floor(Math.random() * charactersLength));
                }
                return result;
            }

            $('#show-generate-random-string-form').click(function(){
                $('#random_string_number').val('');
                $('#generate-random-string').modal('show');
            });
            
            $('#generate-random-string-btn').click(function(){
                
                let randomStringNumber = parseInt($('#random_string_number').val(), 10);
                let stockContent       = '';

                for (let i = 0; i < randomStringNumber; i++) {
                    let random = generateRandomString(20) + "\n";
                    stockContent += random;
                }

                $('#stock_content').val(stockContent.replace(/\r?\n?[^\r\n]*$/, ""));

                $('#generate-random-string').modal('hide');
            });
        });
    </script>

@endsection