added anyhow, improve hamburger menu, improve dw articles
This commit is contained in:
@@ -1,11 +1,15 @@
|
||||
<script setup>
|
||||
import { ref, computed } from 'vue'
|
||||
import { RouterLink, useRouter } from 'vue-router'
|
||||
import { RouterLink, useRouter, useRoute } from 'vue-router'
|
||||
import { useFeeds } from '@/composables/useFeeds'
|
||||
import Modal from './modal/AddUrl.vue'
|
||||
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
const { sync, showModal, viewMode, toggleViewMode, layout, toggleLayout, markAllRead, feeds } = useFeeds()
|
||||
|
||||
const onFeedsPage = computed(() => route.path === '/feeds')
|
||||
|
||||
const unreadCount = computed(() => feeds.value.filter(f => !f.read).length)
|
||||
|
||||
const menuOpen = ref(false)
|
||||
@@ -78,20 +82,30 @@ function handleToggleLayout() {
|
||||
>
|
||||
<div class="app-nav__menu-panel">
|
||||
<RouterLink to="/feeds" class="app-nav__menu-item" @click="closeMenu">Feeds</RouterLink>
|
||||
<button class="app-nav__menu-item" type="button" @click="handleToggleViewMode">
|
||||
{{ viewMode === 'list' ? 'Article view' : 'List view' }}
|
||||
</button>
|
||||
<button v-if="viewMode === 'list'" class="app-nav__menu-item" type="button" @click="handleToggleLayout">
|
||||
{{ layout === 'list' ? 'Card layout' : 'List layout' }}
|
||||
</button>
|
||||
<template v-if="onFeedsPage">
|
||||
<button class="app-nav__menu-item" type="button" @click="handleToggleViewMode">
|
||||
{{ viewMode === 'list' ? 'Article view' : 'List view' }}
|
||||
</button>
|
||||
<button v-if="viewMode === 'list'" class="app-nav__menu-item" type="button" @click="handleToggleLayout">
|
||||
{{ layout === 'list' ? 'Card layout' : 'List layout' }}
|
||||
</button>
|
||||
<button class="app-nav__menu-item" type="button" @click="handleMarkAllRead">Mark all as read</button>
|
||||
</template>
|
||||
<button class="app-nav__menu-item" type="button" @click="handleSync">Sync</button>
|
||||
<button class="app-nav__menu-item" type="button" @click="handleMarkAllRead">Mark all as read</button>
|
||||
<button class="app-nav__menu-item" type="button" @click="openAddModal">Add RSS</button>
|
||||
<RouterLink to="/admin" class="app-nav__menu-item" @click="closeMenu">Admin</RouterLink>
|
||||
<button class="app-nav__menu-item app-nav__logout" type="button" @click="logout">Logout</button>
|
||||
</div>
|
||||
</nav>
|
||||
</Transition>
|
||||
|
||||
<Teleport to="body">
|
||||
<Modal :show="showModal" @close="showModal = false">
|
||||
<template #header>
|
||||
<h3>Add RSS Feed</h3>
|
||||
</template>
|
||||
</Modal>
|
||||
</Teleport>
|
||||
</header>
|
||||
</template>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user