@extends('forms.ti.base_form')

@section('title')
    <div class="sec-title">
        <div class="title"><img src="{{ URL::asset('images/corebusiness_1200x300.png') }}" width="130" height="30"
                class="d-inline-block align-top m-1" alt=""></div>
        <h2 style="color: rgb(43, 43, 43);">Desativar login Core <i class="bi bi-x-circle-fill"
                style="margin-left:20px; color:green;"></i></h2>
    </div>
@endsection
@section('form')
    <form action="{{ route('chamados.store') }}" method="post" id="contact-form">
        {{ csrf_field() }}
        <div class="row clearfix">
            <div class="flex-row w-100" style="display: flex; flex-wrap: wrap" id="table_input">
                <div class="form-group col-md-6"><input type="text" id="name1" required placeholder="Usuário / Core">
                </div>
            </div>

            <div class="form-group col-md-12">

                <a class="add_field" id="add" data-value="1">
                    <h5>Adicionar campo</h5><i class="bi bi-plus-circle"></i>
                </a>
            </div>


            <div class="form-group col-md-5 col-sm-6 co-xs-12 mt-4">
                <label for="filial" class="col-form-label sans text-muted">Filial
                </label>

                <select class="form-control" name="filial" required>
                    <option value="">... </option>
                    @foreach ($filiais as $f)
                        <option value="{{ $f['id'] }}">{{ $f['comment'] }}</option>
                    @endforeach

                </select>
            </div>

            <div class="form-group col-md-5 offset-2 col-sm-6 co-xs-12 mt-4">
                <label for="setor" class="col-form-label sans text-muted">Setor</label>
                <select class="form-control" name="setor" required="">
                    <option value="">...</option>
                    <@foreach ($setores as $c)
                        <option value="{{ $c['id'] }}">{{ $c['name'] }}</option>
                        @endforeach

                </select>
            </div>

            <div class="form-group col-md-12 col-sm-12 co-xs-12 mt-4">
                <button type="submit" class="theme-btn btn-style-one">Enviar</button>
            </div>

        </div>
        <textarea class="hidden" name="msg" id="msg"></textarea>
        <input type="hidden" id="tipo_chamado" name="tipo_chamado" value="5">
        <input type="hidden" id="categoria" name="categoria" value="13">
                <input type="hidden" id="user_recipient" name="user_recipient" value="56">
                 <input type="hidden" id="form_type" name="form_type" value="user">

    </form>
@endsection
@section('info')
    <li><i class="bi bi-exclamation-diamond ml-1" style="color: rgb(211, 175, 14);"></i>
        <p class="mb-3">Esse formulário é designado apenas para DESATIVAÇÃO de login Core
        </p>
    </li>
    <li><i class="bi bi-exclamation-diamond ml-1" style="color: rgb(211, 175, 14);"></i>
        <p class="mb-3">Adicione quantos campos forem necessários.</p>
    </li>

    <li><i class="bi bi-exclamation-diamond ml-1" style="color: rgb(211, 175, 14);"></i>
        <p class="mb-3">Apenas UM usuário por campo adicionado.</p>
    </li>
    <li><i class="bi bi-exclamation-diamond ml-1" style="color: rgb(211, 175, 14);"></i>
        <p class="mb-3">Ligar para o suporte em caso de erros ou dúvidas</p>
    </li>
@endsection
@section('scripts')
    <script>
        $(document).ready(function() {
            $('.add_field').on('click', function() {
                var n = parseInt($(this).attr('data-value'));
                $(this).attr('data-value', n + 1); // Incrementa o valor de 'n'
                $('#table_input').append(
                    `<div class="form-group col-md-6" id="group${n + 1}">
                    <input type="text" id="name${n + 1}" required placeholder="Usuário / Core">
                    <a data-value="${n + 1}" class="close absolute-top-right">
                        <i class="bi bi-x"></i>
                    </a>
                </div>`
                );
            });

            // Delegação de evento para capturar cliques nos botões '.close'
            $('#table_input').on('click', '.close', function() {
                var i = $(this).attr('data-value');
                $('#group' + i).remove();
            });

            $('#contact-form').on('submit', function(event) {
                event.preventDefault();

                var list = $('#table_input input[type="text"]');
                var msgContent = 'Usuários para desativar:\n\n';

                list.each(function() {
                    msgContent += ' (  ' + $(this).val() + '  ) ';
                });

                $('#msg').val(msgContent);
                this.submit();
            });
        });
    </script>
@endsection