@extends('fragments.fullTemplate')

@section('titulo')
Correo electrónico
@endsection

@php
    $id_usuario = session('id_usuario');
    if (! session('id_usuario')) {
        header('location: /');
        die();
    }

    $tabActivo = $tab ?? 'cuentas';
@endphp

@section('contenido')
    <div class="ui big breadcrumb">
        <div class="section">Sistema</div>
        <i class="right chevron icon divider"></i>
        <div class="active section">Correo electrónico</div>
    </div>

    <div class="ui divider"></div>

    <div data-module-notifications-anchor></div>
    <div class="content">
        <div class="col-lg-12 col-md-12 col-sm-12">
            @if(session()->has('success'))
                <div class="alert alert-success text-center alert-dismissible" role="alert">
                    <strong>{{ session()->get('success') }}</strong>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Cerrar"><span aria-hidden="true">&times;</span></button>
                </div>
            @endif
            @if(session()->has('warning'))
                <div class="alert alert-warning text-center alert-dismissible" role="alert">
                    <strong>{{ session()->get('warning') }}</strong>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Cerrar"><span aria-hidden="true">&times;</span></button>
                </div>
            @endif
            @if(session()->has('error'))
                <div class="alert alert-danger text-center alert-dismissible" role="alert">
                    <strong>{{ session()->get('error') }}</strong>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Cerrar"><span aria-hidden="true">&times;</span></button>
                </div>
            @endif
            @if (count($errors) > 0)
                <div class="alert alert-danger alert-dismissible" role="alert">
                    <strong>¡Error!</strong> Revise los campos obligatorios.<br><br>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Cerrar"><span aria-hidden="true">&times;</span></button>
                    <ul>
                        @foreach ($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
            @endif
        </div>
    </div>

    @include('Requisicion_compra.Notificacion.notificacion_requisicion_modal')
    @include('Control_documentos.Notificacion.notificacion_documento_version')
    @include('Modificaciones.notificacion_modificacion')
    @include('Modificaciones.Notificacion.notificacion_modificacion_firma_modal')

    <ul class="nav nav-tabs mb-3" role="tablist">
        <li class="nav-item">
            <a class="nav-link {{ $tabActivo === 'cuentas' ? 'active' : '' }}" data-toggle="tab" href="#tab-cuentas" role="tab">
                Cuentas de correo
            </a>
        </li>
        <li class="nav-item">
            <a class="nav-link {{ $tabActivo === 'contenidos' ? 'active' : '' }}" data-toggle="tab" href="#tab-contenidos" role="tab">
                Administrador de contenido
            </a>
        </li>
    </ul>

    <div class="tab-content">
        <div class="tab-pane fade {{ $tabActivo === 'cuentas' ? 'show active' : '' }}" id="tab-cuentas" role="tabpanel">
            <div class="ui segment">
                <form class="ui form" action="{{ url('cuentas_correo_electronico') }}" method="get">
                    <input type="hidden" name="tab" value="cuentas">
                    <div class="inline fields sx-remove-margin">
                        <div class="twelve wide field">
                            <input type="search" name="search" id="search" placeholder="Correo electrónico..." value="{{ $search ?? '' }}">
                        </div>
                        <div class="four wide field">
                            <button class="ui button" type="submit">
                                <i class="search icon"></i> Buscar cuenta
                            </button>
                        </div>
                    </div>
                </form>
            </div>

            @if ($permisos->crear == 1)
                <button class="ui button fluid primary create_modal_tecnico">
                    <i class="pencil alternate icon"></i> Nueva cuenta de correo electrónico
                </button>
            @endif

            <div class="ui divider"></div>

            <div class="sx-autorender">
                <div class="sx-scroll-x">
                    <p class="text-center">{{ $cuentas_correos->count() }} resultados en esta página</p>
                    <table class="ui celled table unstackable structured">
                        <thead class="text-center">
                            <tr>
                                <th>Correo electrónico</th>
                                <th class="collapsing">Estatus</th>
                                <th class="collapsing">Acciones</th>
                            </tr>
                        </thead>
                        <tbody>
                            @if($cuentas_correos->count())
                                @foreach ($cuentas_correos as $dato_correo)
                                    <tr>
                                        <td>{{ $dato_correo->correo }}</td>
                                        <td class="text-center">
                                            @if ($dato_correo->activo == 1)
                                                <span class="btn btn-success">Activa</span>
                                            @else
                                                <span class="btn btn-danger">Desactivada</span>
                                            @endif
                                        </td>
                                        <td class="text-center">
                                            <div class="ui tiny icon buttons">
                                                @if ($permisos->actualizar == 1)
                                                    <a class="ui button green edit_cuenta_correo"
                                                        title="Modificar"
                                                        id="usuario{{ $dato_correo->id_cuenta_correo_electronico }}"
                                                        data-id_cuenta_correo_electronico="{{ $dato_correo->id_cuenta_correo_electronico }}">
                                                        <i class="pencil alternate icon"></i>
                                                    </a>
                                                @endif
                                                @if ($permisos->eliminar == 1)
                                                    <button class="ui button red eliminarCuentaCorreo"
                                                        data-id_cuenta_correo_electronico="{{ $dato_correo->id_cuenta_correo_electronico }}"
                                                        data-correo_electronico="{{ $dato_correo->correo }}">
                                                        <i class="trash alternate icon"></i>
                                                    </button>
                                                @endif
                                            </div>
                                        </td>
                                    </tr>
                                @endforeach
                            @else
                                <tr>
                                    <td colspan="3">No se encontraron registros</td>
                                </tr>
                            @endif
                        </tbody>
                    </table>
                    {{ $cuentas_correos->links("pagination::bootstrap-4") }}
                </div>
            </div>
        </div>

        <div class="tab-pane fade {{ $tabActivo === 'contenidos' ? 'show active' : '' }}" id="tab-contenidos" role="tabpanel">
            <div class="ui segment">
                <form class="ui form" action="{{ url('cuentas_correo_electronico') }}" method="get">
                    <input type="hidden" name="tab" value="contenidos">
                    <div class="inline fields sx-remove-margin">
                        <div class="twelve wide field">
                            <input type="search" name="contenido_search" id="contenido_search" placeholder="Módulo, tipo, versión o asunto..." value="{{ $contenido_search ?? '' }}">
                        </div>
                        <div class="four wide field">
                            <button class="ui button" type="submit">
                                <i class="search icon"></i> Buscar contenido
                            </button>
                        </div>
                    </div>
                </form>
            </div>

            @if ($permisos->crear == 1)
                <button class="ui button fluid primary create_correo_contenido">
                    <i class="plus circle icon"></i> Nuevo contenido de correo
                </button>
            @endif

            <div class="ui divider"></div>

            <div class="sx-autorender">
                <div class="sx-scroll-x">
                    <p class="text-center">{{ $contenidos->count() }} resultados en esta página</p>
                    <table class="ui celled table unstackable structured">
                        <thead class="text-center">
                            <tr>
                                <th>Módulo</th>
                                <th>Tipo de correo</th>
                                <th>Versión</th>
                                <th>Predeterminado</th>
                                <th>Remitente</th>
                                <th>C.C.</th>
                                <th>Asunto del correo</th>
                                <th>Estatus</th>
                                <th>Última actualización</th>
                                <th class="collapsing">Acciones</th>
                            </tr>
                        </thead>
                        <tbody>
                            @if($contenidos->count())
                                @foreach ($contenidosAgrupados as $versionesGrupo)
                                    @php
                                        $contenidoGrupo = $versionesGrupo->first();
                                    @endphp
                                    <tr class="active">
                                        <td colspan="10">
                                            <strong>{{ $contenidoGrupo->modulo }}</strong>
                                            <span class="text-muted">/ {{ $contenidoGrupo->tipo_correo }}</span>
                                            <span class="badge badge-light">{{ $versionesGrupo->count() }} versión(es)</span>
                                        </td>
                                    </tr>
                                    @foreach ($versionesGrupo as $contenido)
                                    @php
                                        $cc = json_decode($contenido->cc_json, true) ?: [];
                                    @endphp
                                    <tr>
                                        <td>{{ $contenido->modulo }}</td>
                                        <td>{{ $contenido->tipo_correo }}</td>
                                        <td><strong>{{ $contenido->nombre_version }}</strong></td>
                                        <td class="text-center">
                                            @if ($contenido->predeterminado)
                                                <span class="btn btn-success btn-sm">Sí</span>
                                            @else
                                                <span class="btn btn-secondary btn-sm">No</span>
                                            @endif
                                        </td>
                                        <td class="text-center">
                                            @if ($contenido->usar_correo_usuario_conectado)
                                                Usuario conectado
                                            @else
                                                {{ optional($contenido->cuentaCorreo)->correo ?? 'Sin cuenta' }}
                                            @endif
                                        </td>
                                        <td class="text-center">
                                            @forelse ($cc as $correoCc)
                                                <span class="badge badge-light">{{ $correoCc }}</span>
                                            @empty
                                                <span class="text-muted">Sin C.C.</span>
                                            @endforelse
                                        </td>
                                        <td>{{ $contenido->asunto }}</td>
                                        <td>
                                            @if ($contenido->activo)
                                                <span class="btn btn-success btn-sm">Activo</span>
                                            @else
                                                <span class="btn btn-danger btn-sm">Inactivo</span>
                                            @endif
                                        </td>
                                        <td>{{ optional($contenido->updated_at)->format('d/m/Y H:i') }}</td>
                                        <td>
                                            <div class="ui tiny icon buttons">
                                                @if ($permisos->actualizar == 1)
                                                    <button type="button" class="ui button green edit_correo_contenido" title="Editar" data-id="{{ $contenido->id_correo_contenido }}">
                                                        <i class="pencil alternate icon"></i>
                                                    </button>
                                                    <button type="button" class="ui button blue nueva_version_correo_contenido" title="Agregar nueva versión" data-id="{{ $contenido->id_correo_contenido }}">
                                                        <i class="copy icon"></i>
                                                    </button>
                                                @endif
                                                <form action="{{ route('correo_contenidos.predeterminado') }}" method="post" class="d-inline">
                                                    {{ csrf_field() }}
                                                    <input type="hidden" name="id_correo_contenido" value="{{ $contenido->id_correo_contenido }}">
                                                    <button type="submit" class="ui button teal" title="Marcar predeterminado" onclick="showLoader();">
                                                        <i class="star icon"></i>
                                                    </button>
                                                </form>
                                                <form action="{{ route('correo_contenidos.toggle') }}" method="post" class="d-inline">
                                                    {{ csrf_field() }}
                                                    <input type="hidden" name="id_correo_contenido" value="{{ $contenido->id_correo_contenido }}">
                                                    <button type="submit" class="ui button {{ $contenido->activo ? 'orange' : 'green' }}" title="{{ $contenido->activo ? 'Inactivar' : 'Activar' }}" onclick="showLoader();">
                                                        <i class="{{ $contenido->activo ? 'ban' : 'check' }} icon"></i>
                                                    </button>
                                                </form>
                                                @if ($permisos->eliminar == 1)
                                                    <form action="{{ route('correo_contenidos.delete') }}" method="post" class="d-inline correo_contenido_delete_form">
                                                        {{ csrf_field() }}
                                                        <input type="hidden" name="id_correo_contenido" value="{{ $contenido->id_correo_contenido }}">
                                                        <button type="button" class="ui button red confirmar_delete_correo_contenido" title="Eliminar">
                                                            <i class="trash alternate icon"></i>
                                                        </button>
                                                    </form>
                                                @endif
                                            </div>
                                        </td>
                                    </tr>
                                    @endforeach
                                @endforeach
                            @else
                                <tr>
                                    <td colspan="10">No se encontraron contenidos registrados</td>
                                </tr>
                            @endif
                        </tbody>
                    </table>
                    {{ $contenidos->links("pagination::bootstrap-4") }}
                </div>
            </div>
        </div>
    </div>

    @include('Cuentas_Correo_Electronico.create_modal')
    @include('Cuentas_Correo_Electronico.modify_modal')
    @include('Cuentas_Correo_Electronico.delete_modal')
    @include('Cuentas_Correo_Electronico.delete_firma_modal')
    @include('Cuentas_Correo_Electronico.correo_contenido_modal')

    <script>
        var resultData = {};

        $(document).on('click', '.create_modal_tecnico', function(){
            $('#create_modal').modal('show');
        });

        $(document).ready(function(){
            $('a.edit_cuenta_correo').on('click', function(){
                showLoader();
                var idCuentaCorreo = $(this).attr('id');
                var idCuentaCorreoElectronico = $('#'+idCuentaCorreo).data('id_cuenta_correo_electronico');
                $('#id_cuenta_correo_electronico_edit').val(idCuentaCorreoElectronico);

                $.ajax({
                    url: "show_cuenta_correo_electronico",
                    method: "POST",
                    data: {
                        'id_cuenta_correo_electronico': idCuentaCorreoElectronico,
                        '_token': $('input[name="_token"]').val()
                    },
                    success:function(response){
                        var result = typeof response === 'string' ? JSON.parse(response) : response;
                        resultData = result.data;
                        hideLoader();
                        $('#modify_cuenta_correo_modal').modal('show');
                    },
                    error: function () {
                        hideLoader();
                    }
                });
            });
        });

        $('#modify_cuenta_correo_modal').on('show.bs.modal', function () {
            $("#modal-form-modify :input").each(function(){
                var input = $(this).attr('id');
                if (input !== 'firma_correo_electronico' && resultData && input in resultData) {
                    $('#modal-form-modify #'+input).val(resultData[input]);
                    $('#modal-form-modify #'+input).selectpicker('val', resultData[input]);
                }
            });

            if (resultData['firma_correo_electronico'] !== null) {
                $('#div_input_firma_correo').attr("hidden", true);
                var firma = "";
                firma += "<table class='ui celled table unstackable'>";
                firma += "<thead><tr><th class='collapsing'>Imagen</th><th>Nombre</th><th class='collapsing'>Acciones</th></tr></thead>";
                firma += "<tbody><tr>";
                firma += "<td><img class='img-thumbnail' style='max-width:260px;height:auto;' src='{{ asset('storage/firma_correo_electronico/') }}/"+resultData['firma_correo_electronico']+"' alt='Firma de correo'></td>";
                firma += "<td>"+resultData['firma_correo_electronico']+"</td>";
                firma += "<td><div class='ui tiny icon buttons'>";
                firma += "<a class='ui button red eliminarFirmaCorreo' id='"+resultData['id_cuenta_correo_electronico']+"' data-nombre_firma='"+resultData['firma_correo_electronico']+"'>";
                firma += "<i class='trash alternate icon'></i></a></div></td>";
                firma += "</tr></tbody></table>";
                $('#tabla_firma_correo_electronico').html(firma);
            } else {
                $('#tabla_firma_correo_electronico').html('');
                $('#div_input_firma_correo').attr("hidden", false);
            }
        });

        $(document).on('click','.eliminarCuentaCorreo',function(){
            $('#id_cuenta_correo_electronico_delete').val($(this).attr('data-id_cuenta_correo_electronico'));
            $('#correo_electronico_delete').html($(this).attr('data-correo_electronico'));
            $('#delete_cuenta_correo_modal').modal('show');
        });

        $(document).on('click','.eliminarFirmaCorreo',function(){
            $('#id_cuenta_correo_delete').val($(this).attr('id'));
            $('#nombre_firma_delete').html($(this).data('nombre_firma'));
            $('#delete_firma_modal').modal('show');
        });

        $(document).on('click', '.confirmar_delete_correo_contenido', function(event){
            event.preventDefault();

            var form = $(this).closest('form');

            showConfirmModal(
                '¿Está seguro de que desea eliminar esta plantilla? Al eliminarla, la plantilla será desactivada automáticamente.',
                'Confirmación',
                'Eliminar'
            ).then(function(confirmado) {
                if (!confirmado || !form.length) {
                    return;
                }

                showLoader();
                form[0].submit();
            });
        });

        $(".custom-file-input").on("change", function() {
            var fileName = $(this).val().split("\\").pop();
            $(this).siblings(".custom-file-label").addClass("selected").html(fileName);
        });
    </script>
@endsection