26 lines
702 B
Vue
26 lines
702 B
Vue
<script setup lang="ts">
|
|
const props = defineProps(['active_note', 'notes'])
|
|
</script>
|
|
|
|
<template>
|
|
<aside class="w-[256px] min-h-screen bg-gray-800">
|
|
<div class="p-4">
|
|
<button class="button w-full" @click="$emit('new-note')">
|
|
New Note
|
|
</button>
|
|
</div>
|
|
<ul>
|
|
<li
|
|
v-for="note in props.notes"
|
|
:key="note.id"
|
|
@click="$emit('set-active-note', note.id)"
|
|
class="p-4 border-b border-gray-700 hover:bg-gray-600 cursor-pointer flex justify-between items-center gap-4">
|
|
<span>{{ note.title }}</span>
|
|
<button
|
|
class="text-red-500 cursor-pointer"
|
|
@click="evt => $emit('delete-note', {id: note.id, evt})"
|
|
>Delete</button>
|
|
</li>
|
|
</ul>
|
|
</aside>
|
|
</template> |