hubert/SimpleNotes
1
0
Fork 0
Code Projects Releases Activity

Update notes components and page, notes are coming from /notes

Browse Source
This commit is contained in:
Hubert Van De Walle
2020-04-23 16:00:17 +02:00
parent 7f88f5371d
commit 20daa71d51
3 changed files with 52 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/pages/notes.vue
+17 -72
View File
@@ -7,15 +7,18 @@
<v-col
v-for="(note, index) in notes"
:key="index"
cols="12" md="6" xl="3"
cols="12" sm="6" md="4" xl="3"
class="viewer">
<Note
class="item"
:title="note.title"
:tags="note.tags"
>
{{ note.content }}
</Note>
<v-hover v-slot:default="{ hover }">
<Note
:hover="hover"
:title="note.title"
:tags="note.tags"
:updated-at="note.updatedAt"
>
{{ note.content }}
</Note>
</v-hover>
</v-col>
</v-row>
@@ -38,69 +41,11 @@
Note,
},
data: () => ({
selector: ".viewer",
options: {
columnWidth: "200",
percentPosition: true,
gutter: 0,
itemSelector: ".item"
},
notes: [
{
title: "Elec analogique",
tags: ["Ephec"],
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab est in rerum."
},
{
title: "Portfolio",
tags: ["Ephec", "Dev"],
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt doloremque harum iste itaque laboriosam modi placeat quia sequi. Accusamus consectetur dolor doloribus eaque et incidunt ipsa iste, iure magnam maxime minus, modi nam odit possimus quam recusandae reprehenderit sit totam?"
},
{
title: "Melvin fait du ski",
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab est in rerum."
},
{
title: "Daniel étudie elec",
tags: ["Ephec", "Ephec", "Ephec", "Ephec", "Ephec", "Ephec"],
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab est in rerum."
},
{
title: "Portfolio",
tags: ["Ephec", "Dev"],
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt doloremque harum iste itaque laboriosam modi placeat quia sequi. Accusamus consectetur dolor doloribus eaque et incidunt ipsa iste, iure magnam maxime minus, modi nam odit possimus quam recusandae reprehenderit sit totam?"
},
{
title: "Portfolio",
tags: ["Ephec", "Dev"],
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt doloremque harum iste itaque laboriosam modi placeat quia sequi. Accusamus consectetur dolor doloribus eaque et incidunt ipsa iste, iure magnam maxime minus, modi nam odit possimus quam recusandae reprehenderit sit totam?"
},
{
title: "Portfolio",
tags: ["Ephec", "Dev"],
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt doloremque harum iste itaque laboriosam modi placeat quia sequi. Accusamus consectetur dolor doloribus eaque et incidunt ipsa iste, iure magnam maxime minus, modi nam odit possimus quam recusandae reprehenderit sit totam?"
},
{
title: "Daniel étudie elec",
tags: ["Ephec", "Ephec", "Ephec", "Ephec", "Ephec", "Ephec"],
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab est in rerum."
},
{
title: "Portfolio",
tags: ["Ephec", "Dev"],
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt doloremque harum iste itaque laboriosam modi placeat quia sequi. Accusamus consectetur dolor doloribus eaque et incidunt ipsa iste, iure magnam maxime minus, modi nam odit possimus quam recusandae reprehenderit sit totam?"
},
{
title: "Portfolio",
tags: ["Ephec", "Dev"],
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt doloremque harum iste itaque laboriosam modi placeat quia sequi. Accusamus consectetur dolor doloribus eaque et incidunt ipsa iste, iure magnam maxime minus, modi nam odit possimus quam recusandae reprehenderit sit totam?"
},
{
title: "Portfolio",
tags: ["Ephec", "Dev"],
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt doloremque harum iste itaque laboriosam modi placeat quia sequi. Accusamus consectetur dolor doloribus eaque et incidunt ipsa iste, iure magnam maxime minus, modi nam odit possimus quam recusandae reprehenderit sit totam?"
},
]
})
notes: []
}),
mounted() {
this.$axios.get('/notes')
.then(e => this.notes = e.data)
}
}
</script>