marco/contexted-v3
1
0
Fork 0
Code Issues 7 Pull Requests Packages Projects 1 Releases Wiki Activity

auto imports

Browse Source
This commit is contained in:
Marco Crapts
2023-05-12 23:28:02 +02:00
parent 282ff48f49
commit 3fed5ddd8d
17 changed files with 655 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/App.vue
View File

@@ -1,8 +1,4 @@
<script setup lang="ts">
import { ref } from 'vue'
import TopBar from '@/components/TopBar.vue'
import SideBar from '@/components/SideBar.vue'
import Note from '@/components/Note.vue'
import { activeNote, updateNote } from '@/composables/useNotes'
const sideBarCollapsed = ref(false)

2
src/components/Autocomplete.vue
View File

@@ -1,6 +1,4 @@
<script setup lang="ts">
import { computed, ref } from 'vue'
import SearchResult from '@/components/Search/SearchResult.vue'
import { notes, findNotesByByTitle, activeNote } from '@/composables/useNotes'
const props = defineProps<{

1
src/components/Modal.vue
View File

@@ -1,5 +1,4 @@
<script setup lang="ts">
import { ref } from 'vue'
import { onClickOutside } from '@vueuse/core'
const modalBox = ref(null)

59
src/components/Note.vue
View File

@@ -1,7 +1,4 @@
<script setup lang="ts">
import { ref, watch, computed } from 'vue'
import NoteEditor from '@/components/NoteEditor.vue'
import Modal from '@/components/Modal.vue'
import { formatDate } from '@/utils/helpers'
import { notes, activeNote } from '@/composables/useNotes'
import { notesRelations } from '@/composables/useNotes'
@@ -30,13 +27,19 @@ const references = computed<Note[]>(() => {
})
.filter((note): note is Note => note !== undefined)
})
const deleteNote = () => {
console.log('delete note')
}
const setRootNote = () => {
console.log('set root note')
}
</script>
<template>
<div class="flex flex-col">
<div class="mb-2 flex items-center">
<h1
class="mr-2 flex flex-1 items-center rounded-md text-3xl font-semibold hover:bg-gray-200"
>
<NoteToolbar @delete="deleteNote" @set-root="setRootNote">
<template #title>
<i
class="fas fa-fw fa-home mr-2 text-base text-secondary opacity-40"
v-if="props.note.isRoot"
@@ -46,46 +49,8 @@ const references = computed<Note[]>(() => {
class="flex-1 bg-transparent py-1 outline-none"
v-model="noteTitle"
/>
</h1>
<div class="btn-group flex items-center">
<Modal>
<template #activator="{ open }">
<button class="btn-sm btn" @click="open">
<i class="fas fa-fw fa-trash" />
</button>
</template>
<template #default>Are you sure you want to delete this?</template>
<template #actions="{ close }">
<button
class="btn-primary btn-sm btn mr-1"
@click="() => console.log('delete note')"
>
Delete note
</button>
<button class="btn-sm btn" @click="close">Close</button>
</template>
</Modal>
<Modal>
<template #activator="{ open }">
<button class="btn-sm btn" @click="open">
<i class="fas fa-fw fa-sitemap" />
</button>
</template>
<template #default>
Are you sure you want to set this note as root note?
</template>
<template #actions="{ close }">
<button
class="btn-primary btn-sm btn mr-1"
@click="() => console.log('set root note')"
>
Set current note as root
</button>
<button class="btn-sm btn" @click="close">Close</button>
</template>
</Modal>
</div>
</div>
</template>
</NoteToolbar>
<NoteEditor
class="h-100 flex-1 overflow-auto"
:note="activeNote"

5
src/components/NoteEditor.vue → src/components/Note/NoteEditor.vue
View File

@@ -1,5 +1,4 @@
<script setup lang="ts">
import { ref, nextTick } from 'vue'
import CKEditor from '@/ckeditor/CKEditor'
import BalloonEditor from '@ckeditor/ckeditor5-editor-balloon/src/ballooneditor'
import EssentialsPlugin from '@ckeditor/ckeditor5-essentials/src/essentials'
@@ -17,9 +16,7 @@ import { mdToHtml } from '@/utils/markdown'
import { activeNote, getNoteByTitle } from '@/composables/useNotes'
import Autocomplete from '@/components/Autocomplete.vue'
const props = defineProps<{
note: Note
}>()
const props = defineProps<{ note: Note }>()
const html = mdToHtml(props.note.content)

47
src/components/Note/NoteToolbar.vue Normal file
View File

@@ -0,0 +1,47 @@
<script setup lang="ts">
const emit = defineEmits<{
delete: []
setRoot: []
}>()
</script>
<template>
<div class="mb-2 flex items-center">
<h1
class="mr-2 flex flex-1 items-center rounded-md pr-2 text-3xl font-semibold hover:bg-gray-200"
>
<slot name="title"></slot>
</h1>
<div class="btn-group flex items-center">
<Modal>
<template #activator="{ open }">
<button class="btn-sm btn" @click="open">
<i class="fas fa-fw fa-trash" />
</button>
</template>
<template #default>Are you sure you want to delete this?</template>
<template #actions="{ close }">
<button class="btn-primary btn-sm btn mr-1" @click="emit('delete')">
Delete note
</button>
<button class="btn-sm btn" @click="close">Close</button>
</template>
</Modal>
<Modal>
<template #activator="{ open }">
<button class="btn-sm btn" @click="open">
<i class="fas fa-fw fa-sitemap" />
</button>
</template>
<template #default>
Are you sure you want to set this note as root note?
</template>
<template #actions="{ close }">
<button class="btn-primary btn-sm btn mr-1" @click="emit('setRoot')">
Set current note as root
</button>
<button class="btn-sm btn" @click="close">Close</button>
</template>
</Modal>
</div>
</div>
</template>

2
src/components/Search/SearchBar.vue
View File

@@ -1,6 +1,4 @@
<script setup lang="ts">
import { ref, watch, computed } from 'vue'
import SearchResult from '@/components/Search/SearchResult.vue'
import { notes, findNotes, activeNote } from '@/composables/useNotes'
const active = ref(false)

9
src/components/SideBar.vue
View File

@@ -1,7 +1,5 @@
<script setup lang="ts">
import { rootNote, notes, activeNote } from '@/composables/useNotes'
import SideBarMenu from '@/components/SideBar/SideBarMenu.vue'
import SideBarMenuItem from '@/components/SideBar/SideBarMenuItem.vue'
const props = defineProps<{
viewModes: ViewMode[]
@@ -20,7 +18,11 @@ const emit = defineEmits<{
<SideBarMenu>
<template #header>Root note</template>
<template #items>
<SideBarMenuItem icon="fas fa-fw fa-home" @click="activeNote = rootNote">
<SideBarMenuItem
icon="fas fa-fw fa-home"
@click="activeNote = rootNote"
:title="rootNote?.title"
>
{{ rootNote?.title }}
</SideBarMenuItem>
</template>
@@ -48,6 +50,7 @@ const emit = defineEmits<{
v-for="note in notes"
icon="far fa-file-alt fa-fw"
@click="activeNote = note"
:title="rootNote?.title"
>
{{ note.title }}
</SideBarMenuItem>

2
src/components/SideBar/SideBarMenuItem.vue
View File

@@ -6,7 +6,7 @@ const props = defineProps<{
</script>
<template>
<a
class="mt-1 block w-full cursor-pointer rounded hover:bg-gray-200 active:bg-primary active:text-primary-content"
class="mt-1 block w-full cursor-pointer overflow-x-hidden text-ellipsis whitespace-nowrap rounded hover:bg-gray-200 active:bg-primary active:text-primary-content"
:class="props.active ? 'font-bold text-primary' : 'text-secondary'"
>
<i :class="props.icon" class="mr-2" v-if="props.icon"></i>

3
src/components/TopBar.vue
View File

@@ -1,7 +1,4 @@
<script setup lang="ts">
import Hamburger from '@/components/Hamburger.vue'
import SearchBar from '@/components/Search/SearchBar.vue'
import Logo from './Logo.vue'
import { addNote, activeNote, rootNote } from '@/composables/useNotes'
const props = defineProps<{
sideBarCollapsed: boolean

1
src/composables/useNotes.ts
View File

@@ -1,4 +1,3 @@
import { ref, reactive, computed, watch } from 'vue'
import { useTitle } from '@vueuse/core'
import { mdToHtml } from '@/utils/markdown'
import { getAllMatches } from '@/utils/helpers'