Skip to content

Instantly share code, notes, and snippets.

@craigwillis85
Last active March 22, 2017 13:22
Show Gist options
  • Select an option

  • Save craigwillis85/15dbcd492e060dff77b6ccdc0f1d087e to your computer and use it in GitHub Desktop.

Select an option

Save craigwillis85/15dbcd492e060dff77b6ccdc0f1d087e to your computer and use it in GitHub Desktop.
<template>
<div class="demo" v-for="(m, $index) in modifications">
<h1>{{ m.name }}</h1>
<button class="button is-primary" @click="toggleShow($index)">
Comments ({{ m.thread.messages.length }}) &nbsp;
<i class="fa fa-3 icon is-small" :class="show ? 'fa-caret-up' : 'fa-caret-down'"></i>
</button>
<ul v-show="shouldShow($index)">
<li class="list-group-item" v-for="(message, $index) in m.thread.messages">
{{ message.body }}
</li>
</ul>
</div>
</template>
<script>
import store from '~/app/vuex/store'
export default{
components: {
Navbar,
TopMenu,
Pagination,
},
data: function () {
return {
show: new Set(),
view: 'list',
modificationGroups: [],
resource: {
hasResponse: false,
hasError: false,
running: false,
serverResponse: ""
}
}
},
methods: {
toggleShow: function (index) {
if(this.shouldShow(index))
this.show.delete(index);
this.show.add(index);
},
shouldShow: function(index) {
return this.show.has(index);
},
},
beforeRouteEnter(to, from, next){
.........
vm.modifications = response.data.data;
}
}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment