<?php $__env->startSection('css'); ?>
<?php echo Minify::stylesheet('/css/study.css')->withFullUrl(); ?>

<?php echo Minify::stylesheet('/css/studyStarred.css')->withFullUrl(); ?>

<?php $__env->stopSection(); ?>

<?php $__env->startSection('title'); ?>
<?php echo e(Lang::get('studies.oferta formativa de radio ecca')); ?>

<?php $__env->stopSection(); ?>
<?php $__env->startSection('description'); ?>
<?php echo e(Lang::get('studies.graduado escolar a distancia')); ?>

<?php $__env->stopSection(); ?>

<?php $__env->startSection('content'); ?>
<?php echo Breadcrumbs::render('study'); ?>



<div class="container">
    <div class="titulo_categoria">
        <span><?php echo e(Lang::get('studies.oferta formativa ecca')); ?></span>
    </div>
    <div class="col-md-12">
        <div class="titulo">
            <?php echo e(Lang::get('studies.oferta completa')); ?>

        </div>
    </div>
    <div id="vueCatalogo" idioma=<?php echo e($codIdioma); ?> url=<?php echo e($url); ?> class="row">
        <div class="col-md-8">
            <div class="col-md-12">
                <div class="subtitulo">
                    <?php echo e(Lang::get('studies.titulaciones oficiales')); ?>

                </div>
                <div v-for="c in getCursosOficiales" :key="c.idTitulacion">
                    <div class="image-substitute-wrapper">
                        <h3>
                            <a href="#" v-on:click="goto_route(c)">
                                {{c.nombreTitulacion}}
                            </a>
                        </h3>
                    </div>
                    <div class="caption">
                    <p v-html="c.descripcion" class="text-justify"></p>
                    </div>
                </div>
                <div class="subtitulo">
                    <?php echo e(Lang::get('studies.titulaciones propias')); ?>

                </div>
                <div v-for="c in getCursosPropios" :key="c.idTitulacion">
                    <div class="image-substitute-wrapper">
                        <h3>
                            <a href="#" v-on:click="goto_route(c)">
                                {{c.nombreTitulacion}}
                            </a>
                        </h3>
                    </div>
                    <div class="caption">
                        <p v-html="c.descripcion" class="text-justify"></p>
                    </div>
                </div>
            </div>
            
        </div>
        <div class="col-md-4 important">
            <br>
            <div class="col-xs-12">
                <img class="img-responsive" src="<?php echo e(asset('img/study-photo.jpg')); ?>">
            </div>
            <br>
            <div class="col-xs-12 wrapper-important">
                <a href="<?php echo e(route('study-aa-starred')); ?>"><?php echo e(Lang::get('studies.cursos destacados')); ?></a>
            </div>
            <div class="col-xs-12 wrapper-important2">
                <a href="<?php echo e(route('study-methodology')); ?>"><?php echo e(Lang::get('studies.metodologia')); ?></a>
            </div>
            <div class="col-xs-12 wrapper-important2">
                <a href="<?php echo e(route('study-advantages')); ?>"><?php echo e(Lang::get('studies.ventajas')); ?></a>
            </div>
        </div>
    </div>
</div>

<div class="spacer"></div>
<div class="image-viewer hide">
    <img id="load-image" class="img-responsive">
</div>

<!-- 
    Componente Vue para cargar los datos
-->
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script type="text/javascript">
    new Vue({
        el: '#vueCatalogo',
        props:{
        },
        
        data: { 
            cursosOficiales: [],
            cursosPropios: [],
            codIdioma:null
            
        },
        created: function() {},
        computed: {
            getCursosOficiales: function() {
                return this.cursosOficiales
            },
            getCursosPropios: function() {
                return this.cursosPropios
            },
        },
        mounted () {
            this.codIdioma = this.$el.attributes.idioma.value
            
            var params = { params: { codIdioma: this.codIdioma } } //Settear el idioma que tiene la pagina en ese momento
           axios
            .get(this.$el.attributes.url.value + '/getTitulacionesOficialesAbiertas', params)
            .then(
                response => (
                    this.cursosOficiales = response.data
                ))
                axios
            .get(this.$el.attributes.url.value + '/getTitulacionesNoOficialesAndLibresAbiertas', params)
            .then(
                response => (
                    this.cursosPropios = response.data
                ))
            
            
        },
    
        methods: {
            goto_route: function(curso) {
                if (curso.idTitulacion !== null) {
                    route = "<?php echo e(route('study-estructurados', ['id' => '?id?', 'nombre' => '?nombre?'])); ?>"
                    route = route.replace('?id?', curso.idTitulacion)
                    let nombreTitulacion = curso.nombreTitulacion.replace('/','-')
                    route = route.replace('?nombre?', nombreTitulacion)
                    location.href = route
                } else { 
                    route = "<?php echo e(route('study-aa')); ?>"
                    location.href = route
                }
            },
        },
        

    });

           
</script>
<?php $__env->stopSection(); ?>

<?php $__env->startSection('js-code-post'); ?>
<?php echo Minify::javascript('/js/custom.js')->withFullUrl(); ?>


<script>
   $(".image-item").click(function (event) {
       event.preventDefault();
       var href = $(this).attr("href");
       $(".image-viewer").removeClass("hide");
       $("#load-image").attr("src", href);
   });
   $(".image-viewer").click(function () {
       $(this).addClass("hide");
   });
</script>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.base', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>