49 lines
1.1 KiB
Vue
49 lines
1.1 KiB
Vue
<template>
|
|
<div>
|
|
<v-progress-circular
|
|
v-if="loading && notes.length === 0"
|
|
:size="100"
|
|
:width="7"
|
|
color="purple"
|
|
indeterminate
|
|
></v-progress-circular>
|
|
<v-row>
|
|
<v-col
|
|
v-for="note in notes"
|
|
:key="note.uuid"
|
|
cols="12"
|
|
md="6"
|
|
lg="4"
|
|
xl="3"
|
|
>
|
|
<NoteCard
|
|
:uuid="note.uuid"
|
|
:title="note.title"
|
|
:updated-at="note.updatedAt"
|
|
:tags="note.tags"
|
|
/>
|
|
</v-col>
|
|
</v-row>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapState } from 'vuex'
|
|
|
|
export default {
|
|
name: 'Notes',
|
|
data: () => ({
|
|
loading: true,
|
|
}),
|
|
computed: {
|
|
...mapState('notes', { notes: (state) => state.notes }),
|
|
},
|
|
mounted() {
|
|
this.$store.dispatch('notes/load').then(() => (this.loading = false))
|
|
},
|
|
head: () => ({
|
|
title: 'My notes',
|
|
}),
|
|
}
|
|
</script>
|