const urlListaHorario = $('#listaHorario').val() + '.json';
new Vue({
    el: '#app',
    data: {
        agendas: [],
        classObject: {
            'red': true,
            'white-text': true,
        },
        disabled: false,
        hora: ''
    },
    methods: {
        recebeHora: function (hora) {
            this.hora = hora
        }
    },
    created: async function() {
        const response = await fetch(urlListaHorario);
        const { agendas } = await response.json();

        const all = [
            '06:00', '07:00', '08:00', '09:00',
            '10:00', '11:00', '12:00', '13:00',
            '14:00', '15:00', '16:00', '17:00',
            '18:00', '19:00', '20:00', '21:00'
        ]

        const allSalas = [
            'Sala 01',  'Sala 02',
            'Sala 03', 'Sala 04',
            'Sala 05', 'Sala 06'
        ]

        agendas.map(idSala => {

            if(idSala.horarioSala.length === 0){
                disabled = true
            }

            idSala.horarioSala = all.filter(t => !idSala.horarioSala.includes(t)).concat(idSala.horarioSala);
            idSala.horarioSala.sort();

            idSala.nomeSala = allSalas.filter(sl => !idSala.nomeSala.includes(sl)).concat(idSala.nomeSala);
            idSala.nomeSala.sort();

        });

        this.agendas = agendas
    }

});



<div class="swiper-container">
        <div  id="app" class="swiper-wrapper">
            %{--<div>--}%
            <div v-for="agenda in agendas" class="swiper-slide card grey darken-1">
                <div class="card-content white-text">
                    <span class="card-title" v-for="salinhas in agenda.nomeSala">{{ salinhas }}</span>
                    <p>
                    </p>
                    <p>
                        <button v-on:click="recebeHora(tempo)"
                                :disabled="agenda.horarioSala.lenght === 0"
                                 class="btn white black-text
                                 btnHorario waves-teal waves-effect waves-light btn-large"
                                v-for="tempo in agenda.horarioSala">{{ tempo }}</button>
                    </p>
                    <p>Quantas vezes o botão acima foi clicado: {{ hora }}</p>

                </div>
            </div>
            %{--</div>--}%
        </div>
        <!-- Add Pagination -->
    <br>
        <div class="swiper-pagination"></div>
    </div>