Polls.vue

<template>
  <b-container v-if="polls && polls.length" class="my-5">
    <b-row>
      <b-col>
        <b-btn>Create Poll</b-btn>
      </b-col>
    </b-row>
    <b-row class="mt-3">
      <b-col>
        <b-card-group columns>
          <b-card
            v-for="poll in polls"
            :key="`poll-${poll.id}`"
            :title="poll.title"
            :sub-title="poll.description"
          >
            <b-form-group>
              <b-form-radio-group
                :id="`poll-options-${poll.id}`"
                stacked
              >
                <b-form-radio
                  v-for="option in poll.options"
                  :key="`option-${option.id}`"
                  :value="option.id"
                >
                  {{option.name}} - {{option.votes}}
                </b-form-radio>
              </b-form-radio-group>
            </b-form-group>
          </b-card>
        </b-card-group>
      </b-col>
    </b-row>
  </b-container>
</template>

<script>
import { POLLS } from '@/gql/queries/poll.queries'

export default {
  apollo: {
    polls: {
      query: POLLS,
    }
  },
}
</script>