@extends('layouts.app')

@section('page-title')
    <div class="row bg-title">
        <!-- .page title -->
        <div class="col-lg-3 col-md-4 col-sm-4 col-xs-12 bg-title-left">
            <h4 class="page-title"><i class="fa fa-cubes"></i> Stock Vendor </h4>
        </div>
        <!-- /.page title -->
        <!-- .breadcrumb -->
        
        <div class="col-lg-9 col-sm-8 col-md-8 col-xs-12 text-right bg-title-right">
            <ol class="breadcrumb">
                <li><a href="{{ route('admin.dashboard') }}">@lang('app.menu.home')</a></li>
                <li class="active">{{ __($pageTitle) }}</li>
            </ol>
        </div>
        
        <!-- /.breadcrumb -->
    </div>
@endsection

@push('head-script')
<link rel="stylesheet" href="{{ asset('plugins/bower_components/bootstrap-select/bootstrap-select.min.css') }}">
<link rel="stylesheet" href="{{ asset('plugins/bower_components/custom-select/custom-select.css') }}">
    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.13/css/dataTables.bootstrap.min.css">
    <link rel="stylesheet" href="https://cdn.datatables.net/responsive/2.1.1/css/responsive.bootstrap.min.css">
    <link rel="stylesheet" href="//cdn.datatables.net/buttons/1.2.2/css/buttons.dataTables.min.css">
    <link rel="stylesheet" href="//cdn.datatables.net/buttons/1.2.2/css/buttons.dataTables.min.css">
@endpush

@section('content')

    <div class="row">
        
        <div class="col-xs-12">

            <section>
                <div class="sttabs tabs-style-line">

                    <div class="white-box">
                        <nav>
                            <ul class="showClientTabs">
                                <li ><a href="{{ route('admin.stockvendor.index') }}"  style="box-shadow: inset 0 -2px #686868;"><i class="fa fa-cube"></i> <span>Hoja de Pedidos</span></a>
                                </li>
                                <li class="clientProjects"><a href="{{ route('admin.stockvendor.depurate') }}"><i class="fa fa-clipboard"></i> <span>Hoja de Depuración</span></a>
                                </li>
                                <li class="clientInvoices"><a href="{{ route('admin.stockvendor.accounting') }}"><i class="fa fa-calculator"></i> <span>Contabilidad</span></a>
                                </li>
                            </ul>
                        </nav>
                    </div>
                    <div class="row p-r-20">
                        @php
                            foreach ($markets as $key => $market) {
                                $exist = false;
                                foreach ($stores as $key => $store) {
                                    if($market->store == $store){
                                        $exist = true;
                                    }
                                }
                                if(!$exist){
                                    array_push($stores, $market->store);
                                }
                            }
                        @endphp
                        {!! Form::open(['id'=>'importExcel','class'=>'ajax-form','method'=>'POST']) !!}
                            <div class="col-xs-2">
                                <h4 class="m-l-30"><b>Hoja de Pedido</b></h4>
                            </div>  
                            <div class="col-xs-5"></div>
                            <div class="col-xs-1 form-group">
                                <label>Market Place</label>
                                <select class="select2 form-control"  id="marketp" name="marketp">
                                    <option value ="0">--</option>
                                    @foreach($stores as $store)
                                        <option value="{{ $store }}">{{$store}}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-xs-1 form-group">
                                <label>Tipologia</label>
                                <select class="select2 form-control"  id="marketp2" name="marketp2">
                                        <option value="0">--</option>
                                </select>
                            </div>
                            <div class="col-xs-1 form-group">
                                <label>Cuenta</label>
                                <select class="select2 form-control"  id="marketp3" name="marketp3">
                                        <option value="0">--</option>
                                </select>
                            </div>
                            <div class="col-xs-1 form-group m-t-20 text-right">
                                <span class="btn btn-info btn-file btn-sm" >
                                    <span class="fileinput-new"><i class="fa fa-upload" aria-hidden="true"></i> Subir Fichero</span>
                                    <input type="file" id="upload" name="upload" accept=".xlsx, .xls"> 
                                </span>
                            </div>
                            <div class="col-xs-1 form-group m-t-20">
                                <span class="btn btn-info btn-file btn-sm" >
                                    <span class="fileinput-new"><a href="{{ route('admin.stockvendor.export') }}" style="text-decoration: none; color: white;"><i class="fa fa-download" aria-hidden="true"></i> Exportar</a></span>
                                </span>
                            </div>
                        {!! Form::close() !!}
                        <div class="col-xs-12 m-l-30 m-r-40">
                            <section id="section-line-1" class="show p-r-40">
                                <div class="table-responsive  p-r-40" style="overflow-x: scroll;">
                                    <div style="width: 250%;">
                                        {!! $dataTable->table(['class' => 'table table-bordered table-hover toggle-circle default footable-loaded footable']) !!}
                                    </div>
                                </div>
                            </section>
                        </div>
                    </div>
                </div><!-- /tabs -->
            </section>
        </div>
    </div>
    <!-- .row -->
    {{--Ajax Modal--}}
    <div class="modal fade bs-modal-md in" id="stockProviderModal" role="dialog" aria-labelledby="myModalLabel"
         aria-hidden="true">
        <div class="modal-dialog modal-md" id="modal-data-application">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                    <span class="caption-subject font-red-sunglo bold uppercase" id="modelHeading"></span>
                </div>
                <div class="modal-body">
                    Cargando...
                </div>
                <div class="modal-footer">
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
    {{--Ajax Modal Ends--}}

@endsection

@push('footer-script')
<script src="{{ asset('plugins/bower_components/custom-select/custom-select.min.js') }}"></script>
<script src="{{ asset('plugins/bower_components/bootstrap-select/bootstrap-select.min.js') }}"></script>
    <script src="{{ asset('plugins/bower_components/datatables/jquery.dataTables.min.js') }}"></script>
    <script src="https://cdn.datatables.net/1.10.13/js/dataTables.bootstrap.min.js"></script>
    <script src="https://cdn.datatables.net/responsive/2.1.1/js/dataTables.responsive.min.js"></script>
    <script src="https://cdn.datatables.net/responsive/2.1.1/js/responsive.bootstrap.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.0.3/js/dataTables.buttons.min.js"></script>
    <script src="{{ asset('js/datatables/buttons.server-side.js') }}"></script>

    {!! $dataTable->scripts() !!}
    <script>
        $("#upload").on('change',function(){
            $.easyAjax({
                url: '{{route('admin.stockvendor.import')}}',
                container: '#importExcel',
                type: "POST",
                redirect: true,
                file: (document.getElementById("upload").files.length == 0) ? false : true
            })
            $(this).val('');

        });
        function modalCall(id) {
          var url = '{{ route('admin.stockvendor.providers')}}/'+id;
            $('#modelHeading').html('...');
            $.ajaxModal('#stockProviderModal', url);
        }
        //selects
        $('#marketp').change(function (e) {
        var id = $(this).val();
            if(id == 1){
                var options = [];
                options.push('<option value ="0">--</option>');
                $('#marketp2').html(options);
                $('#marketp2').selectpicker('refresh');

                var options2 = [];
                options2.push('<option value ="0">--</option>');
                $('#marketp3').html(options2);
                $('#marketp3').selectpicker('refresh');
            }else{
                getType(id);
            }
        });
        function getType(id){
            var url = "{{route('admin.stockvendor.getmarkettype')}}";
            var token = "{{ csrf_token() }}";
            $.easyAjax({
                url: url,
                type: "POST",
                data: {'_token': token, store: id},
                success: function (data) {
                    var options = [];
                    var rData = [];
                    rData = data.types;
                    options.push('<option value ="0">--</option>');
                    $.each(rData, function( index, value ) {
                        var selectData = '';
                        selectData = '<option value="'+value.id+'">'+value.type+'</option>';
                        options.push(selectData);
                    });
                    $('#marketp2').html(options);
                    $('#marketp2').selectpicker('refresh');

                    var options2 = [];
                    options2.push('<option value ="0">--</option>');
                    $('#marketp3').html(options2);
                    $('#marketp3').selectpicker('refresh');
                }
            })
        }

        $('#marketp2').change(function (e) {
        var id = $(this).val();
            if(id == 1){

                var options2 = [];
                options2.push('<option value ="0">--</option>');
                $('#marketp3').html(options2);
                $('#marketp3').selectpicker('refresh');

            }else{
                getType2(id);
            }

        });
        function getType2(id){
            var url = "{{route('admin.stockvendor.getmarketaccount')}}";
            var token = "{{ csrf_token() }}";
            $.easyAjax({
                url: url,
                type: "POST",
                data: {'_token': token, id: id},
                success: function (data) {
                    var options = [];
                    var rData = [];
                    rData = data.accounts;
                    options.push('<option value ="0">--</option>');
                    $.each(rData, function( index, value ) {
                        var selectData = '';
                        selectData = '<option value="'+value.id+'">'+value.account+'</option>';
                        options.push(selectData);
                    });
                    $('#marketp3').html(options);
                    $('#marketp3').selectpicker('refresh');

                }
            })
        }
        
    </script>
@endpush