Campeonato Brasileiro 2018

Tabela.Vue

<script>
import api from '@/api'
import { log } from 'util'
import axios from 'axios'
import { isEmpty } from 'lodash'

export default {

  name: 'tabela',
  data () {
      return {
          loading: false,
          tabelas: {},
          model: {},
          timedacasa: '',
          timedefora: '',
          rodada:''
        }
      },
  methods: {
    async carregarTabela() {
      this.tabelas = await api.getTabelas()
      log(this.tabelas.rodada)
    },
    gravar() {
      this.timedacasa
      this.timedefora
      console.log(this.timedefora)
      // if (this.timedacasa > this.timedefora) {
      //   console.log('timedacasa venceu!!!')
      // }
      // else if (this.timedacasa < this.timedefora) {
      //   console.log('timedefora venceu!!!')
      // }
      // else {
      //   console.log('EMPATOU!!!')
      // }
    }
  },
  computed: {
    isValid () {
      return !isEmpty(this.timefora)
    }
  },
}
</script>

<template>
  <div class="container-fluid mt-4">

    <b-container>
      <b-row>
        <b-col></b-col>
        <b-col>
          <b-btn type="submit" variant="success" @click="carregarTabela">Carregar Jogos</b-btn>
        </b-col>
        <b-col></b-col>
      </b-row>
      <b-jumbotron>

        <b-row>
          <b-col></b-col>
          <b-col>
            <h3>{{ rodada }}ª Rodada</h3>
          </b-col>
          <b-col></b-col>
        </b-row>
        <hr/>
        <b-row v-for="tabela in this.tabelas" :key="tabela.id">
          <img :src="tabela.timedacasa" style="height: 30px; width: 30px;">
          <b-col sm="2"><label>{{ tabela.timedacasa }}</label></b-col>
          <b-col sm="2"><b-form-input v-model="timedacasa"  type="text"></b-form-input></b-col>
          <span>X</span>
          <b-col sm="2"><b-form-input v-model="timedefora" type="text"></b-form-input></b-col>
          <b-col sm="2"><label>{{ tabela.timedefora }}</label></b-col>
          <img :src="tabela.timedefora" style="height: 30px; width: 30px;">
          <b-col sm="2">
            <b-btn type="submit" variant="success" @click="gravar">Gravar</b-btn>
            <!-- <b-btn type="submit" variant="success" @click="gravar" :disabled="!isValid">Gravar</b-btn> -->
          </b-col>
          <hr />
        </b-row>
        <hr />


      </b-jumbotron>
    </b-container>

  </div>
</template>