@extends('template')

@section('content')

    <div class="page-content">
        <div class="container-fluid">
            <div class="page-content-inner">
                <div class="row">
                    <div class="col-md-12">
                        <div class="portlet light">
                            <div class="col-md-12">
                                   <span class="font-blue-madison title"><i class="fa fa-ticket"></i> Tickets</span></span>
                                <a href="{{ route('admin.tickets') }}" class="right btn red"><i class="fa fa-arrow-circle-left"></i> Voltar</a>
                                <hr>
                            </div>
                            <div class="portlet-body form">
                                @if (count($errors) > 0)
                                    <div class="alert alert-danger">
                                        <strong> O Formulário está com os erros abaixo:</strong><br><br>
                                        <ul>
                                            @foreach ($errors->all() as $error)
                                                <li>{{ $error }}</li>
                                            @endforeach
                                        </ul>
                                    </div>
                                @endif
                                {!! Form::open(['route' => 'admin.tickets.create', 'method' => 'post', 'id' => 'frm_ticket','files' => true]) !!}
                                    <div class="row">
                                        <div class="form-group col-md-6">
                                            <div class="form-group form-md-line-input has-personalizado form-md-floating-label">
                                                {!! Form::label('tipo', 'Abrir Ticket para:') !!}
                                                {!! Form::select('tipo', $tipos, '', ['class'=>'form-control', 'onchange'=>'get_clientes();','id'=>'tipo']) !!}
                                            </div>
                                        </div>
                                        <div class="form-group col-md-6">
                                            <div class="form-group form-md-line-input has-personalizado form-md-floating-label">
                                                {!! Form::label('user_id', 'Cliente:') !!}
                                                {!! Form::select('user_id', $clientes, '', ['class'=>'form-control','id'=>'cliente', 'onchange'=>'getContatos(this.value);']) !!}
                                                {!! Form::text('email', '', ['class' => 'form-control', 'autocomplete' => 'off', 'id'=>'email','style'=>'display:none;', 'onkeyup'=>'IsEmail(this.value);','placeholder'=>'Digite o email do cliente']) !!}
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row contato" style='display:none;'>
                                        <div class="form-group col-md-3">
                                            <div class="form-group form-md-line-input has-personalizado form-md-floating-label">
                                                {!! Form::label('contato_id', 'Contato') !!}
                                                {!! Form::select('contato_id', [], '', ['class'=>'form-control', 'id'=>'contato_id', 'onchange'=>'getContatoInfo(this.value);']) !!}
                                            </div>
                                        </div>
                                    
                                        <div class="form-group col-md-3 nome_contato">
                                            <div class="form-group form-md-line-input has-personalizado form-md-floating-label">
                                                {!! Form::label('nome_contato', 'Nome:') !!}
                                                {!! Form::text('nome_contato', '', ['class' => 'form-control', 'autocomplete' => 'off', 'id'=>'nome_contato','placeholder'=>'Digite o nome do contato']) !!}
                                            </div>
                                        </div>

                                        <div class="form-group col-md-3">
                                            <div class="form-group form-md-line-input has-personalizado form-md-floating-label">
                                                {!! Form::label('email_contato', 'Email:') !!}
                                                {!! Form::text('email_contato', '', ['class' => 'form-control', 'autocomplete' => 'off', 'id'=>'email_contato', 'placeholder'=>'Digite o email do contato']) !!}
                                            </div>
                                        </div>
                                        <div class="form-group col-md-3">
                                            <div class="form-group form-md-line-input has-personalizado form-md-floating-label">
                                                {!! Form::label('telefone_contato', 'Telefone:') !!}
                                                {!! Form::text('telefone_contato', '', ['class' => 'form-control', 'autocomplete' => 'off', 'id'=>'telefone_contato','placeholder'=>'Digite o telefone do contato']) !!}
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="form-group col-md-6">
                                            <div class="form-group form-md-line-input has-personalizado form-md-floating-label">
                                                {!! Form::label('departamento_id', 'Categoria:', ['class' => 'control-label']) !!}
                                                {!! Form::select('departamento_id', $departamentos, '', ['class'=>'form-control', 'id'=>'departamento', 'onchange'=>'get_assunto()']) !!}
                                            </div>
                                        </div>
                                    
                                        <div class="form-group col-md-6">
                                            <div class="form-group form-md-line-input has-personalizado form-md-floating-label">
                                                {!! Form::label('titulo_id', 'Assunto:', ['class' => 'control-label']) !!}
                                                {!! Form::select('titulo_id', [''=>'::Selecione o setor::'], '', ['class'=>'form-control', 'id'=>'assunto']) !!}
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        @if(routeAcess('admin.tickets.atribuir.chamado'))
                                            <div class="form-group col-md-6">
                                                <div class="form-group form-md-line-input has-personalizado form-md-floating-label">
                                                    {!! Form::label('operador_id', 'Atribuir Chamado a:', ['class' => 'control-label']) !!}
                                                    {!! Form::select('operador_id', $atendentes, '', ['class'=>'form-control']) !!}
                                                </div>
                                            </div>
                                        @else
                                            {!! Form::hidden('operador_id', '0') !!}
                                         @endif
                                            <div>
                                                <br/>
                                                <div class="form-group">
                                                    <span class="btn default btn-file">
                                                        <span class="fileinput-new">Procurar</span>
                                                        <span class="fileinput-exists">Selecionar</span>
                                                        {!! Form::file('anexo') !!} 
                                                    </span>
                                                </div>
                                            </div>
                                        </div>
                                    
                                                                     
                                    <div class="row">
                                        <div class="form-group col-md-12">
                                            <span class="caption-subject font-blue-madison">Solicitação:</span><br/><br/>
                                            <textarea class="wysihtml5 form-control" rows="10" name="solicitacao" data-error-container="#editor1_error"></textarea>
                                            <div id="editor1_error"> </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="form-group col-md-6">
                                            <button type="submit" name="Salvar" value="Salvar" class="btn green-jungle" onclick = "block();" id="btnSalvar">
                                                <i class=" fa fa-save"></i> Salvar
                                            </button>
                                            <a href="{{route('admin.tickets')}}" class="btn red"><i class="fa fa-close"></i> Cancelar</a>
                                        </div>                          
                                    </div>
                                {!! Form::close() !!}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- END PAGE CONTENT INNER -->
        </div>
    </div>
@stop()
@section('js-abrir-chamado')
<link href="{{ asset('/assets/global/css/components.min.css') }}" rel="stylesheet" id="style_components" type="text/css" />
<script src="{{ asset('/assets/global/plugins/bootstrap/js/bootstrap.min.js') }}" type="text/javascript"></script>
<link href="{{ asset('/assets/global/plugins/bootstrap-wysihtml5/bootstrap-wysihtml5.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('/assets/global/plugins/bootstrap-markdown/css/bootstrap-markdown.min.css') }}" rel="stylesheet" type="text/css" />
<script src="{{ asset('/assets/global/plugins/bootstrap-wysihtml5/wysihtml5-0.3.0.js') }}" type="text/javascript"></script>
<script src="{{ asset('/assets/global/plugins/bootstrap-wysihtml5/bootstrap-wysihtml5.js') }}" type="text/javascript"></script>
<script src="{{ asset('/assets/pages/scripts/form-validation.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('/assets/global/plugins/jquery.blockui.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('/assets/pages/scripts/ui-blockui.min.js') }}" type="text/javascript"></script>
    <script>
        $(document).ready( function() {  
            get_assunto();
        });

        function get_assunto(){ 
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                }
            })

            var str = "";
            var departamento = $('#departamento').val();
            if(departamento==''){
                $('#assunto').html('<option value="">::Selecione o setor::</option>');
            }else{
                $.ajax({ 
                    type: "GET", 
                    url: "{{ route('suporte.search.assunto') }}", 
                    data: {departamento: departamento}, 
                    success: function(data) { 

                        $(data).each(function () {
                            str += '<option value=' + this.id + '>' + this.assunto + '</option>';
                        })

                        $('#assunto').html(str);

                    } 
                });
            }
        }

        function get_clientes(){ 

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                }
            })

            var tipo = $('#tipo').val();
            
            var nome = '{{ Auth::user()->id }}';
            if(tipo == 'fake'){
                $("#cliente").hide('slow');
                $("#email").show('slow');
                $("#btnSalvar").attr('disabled','disabled');
                $(".contato").hide('slow');
            }else{
                $("#email").hide('slow');
                $("#cliente").show('slow');
                $("#btnSalvar").removeAttr('disabled');
                $(".contato").hide('slow');
            }

            $.ajax({ 
                type: "GET", 
                url: "{{ route('admin.ticket.search.cliente') }}", 
                data: {tipo: tipo}, 
                success: function(data) { 
                    if(tipo == 'fake'){
                        str = '<option selected value="'+data.user_system_default+'"></option>';    
                    }else{
                        str = '<option value="">::Selecione um cliente::</option>';
                        $(data).each(function () {
                            selected = this.id == cliente ? 'selected':'';
                            str += '<option '+selected+' value=' + this.id + '>' + this.name + '</option>';
                        });
                    }

                    $('#cliente').html(str);

                    getDepartamento(tipo);

                } 
            });    
            
        }

        function block(){
            var cliente = $("#cliente").val();
            var assunto = $("#assunto").val();
            var departamento_id = $("#departamento_id").val();

            if(cliente != '' && assunto != '' && departamento_id != ''){
                $.blockUI({ message: "Olá {{ Auth::user()->name}}, por favor aguarde um momento enquanto processamos a sua solicitação <img src='{{ asset('/assets/global/img/loading.gif') }}'>" });
            }

        }

        get_clientes();

        function IsEmail(email){
            
            if(email==''){
                $("#btnSalvarEmail").removeAttr('disabled');
            }else{
                var exclude=/[^@\-\.\w]|^[_@\.\-]|[\._\-]{2}|[@\.]{2}|(@)[^@]*\1/;
                var check=/@[\w\-]+\./;
                var checkend=/\.[a-zA-Z]{2,3}$/;
                if(((email.search(exclude) != -1)||(email.search(check)) == -1)||(email.search(checkend) == -1)){
                    $("#btnSalvar").attr('disabled','disabled');
                }else {
                    $("#btnSalvar").removeAttr('disabled');
                }
            }
        }

        function getContatos(cliente){

            var str = '<option value="">::Selecione::</option>';

            if($('#tipo').val() == 'painel'){
                $('.contato').show('slow');
            }

            if(cliente == ''){
                $('#contato_id').html(str);
            }else{
                $.ajax({ 
                    type: "GET", 
                    url: "{{ route('admin.ticket.search.contatos') }}", 
                    data: {cliente: cliente}, 
                    success: function(data) { 
                        $(data).each(function () {                            
                            str += '<option value=' + this.id + '>' + this.name + '</option>';
                        });
                        $('#contato_id').html(str);
                    } 
                });  
            }
            getContatoInfo('');
            $('#nome_contato').show('slow');
            $('#email_contato').val('');
            $('#telefone_contato').val('');

        }

        function getContatoInfo(contato){

            if(contato == ''){
                $('.nome_contato').show('slow');
                $('#email_contato').val('');
                $('#telefone_contato').val('');
            }else{
                $.ajax({ 
                    type: "GET", 
                    url: "{{ route('admin.ticket.search.contato.info') }}", 
                    data: {contato: contato}, 
                    success: function(data) { 
                        $('.nome_contato').hide('slow');
                        $('#email_contato').val(data.email);
                        $('#telefone_contato').val(data.telefone);
                    } 
                });        
            }
            
        }

        function getDepartamento(tipo){
            $.ajax({ 
                type: "GET", 
                url: "{{ route('admin.ticket.search.departamento') }}", 
                data: {tipo: tipo}, 
                success: function(data) {
                    str = '<option value="">::Selecione um Departamento::</option>';
                    $(data).each(function () {
                        str += '<option value=' + this.id + '>' + this.name + '</option>';
                    });
                    $('#departamento').html(str);
                } 
            });
        }
        
    </script>
@stop()