diff options
Diffstat (limited to 'src/components')
-rw-r--r-- | src/components/ContentTemplate.vue | 128 | ||||
-rw-r--r-- | src/components/feed-display/FeedItemRow.vue | 6 | ||||
-rw-r--r-- | src/components/routes/All.vue | 6 | ||||
-rw-r--r-- | src/components/routes/Feed.vue | 6 | ||||
-rw-r--r-- | src/components/routes/Folder.vue | 6 | ||||
-rw-r--r-- | src/components/routes/Starred.vue | 6 | ||||
-rw-r--r-- | src/components/routes/Unread.vue | 8 |
7 files changed, 75 insertions, 91 deletions
diff --git a/src/components/ContentTemplate.vue b/src/components/ContentTemplate.vue index 8971fcdf6..412f074c3 100644 --- a/src/components/ContentTemplate.vue +++ b/src/components/ContentTemplate.vue @@ -1,82 +1,78 @@ <template> - <NcAppContent - :show-details="showDetails" - @update:showDetails="unselectItem()" - > - <template #list> - <NcAppContentList> - <div class="header"> - <slot name="header"></slot> - </div> - - <FeedItemDisplayList - :items="items" - :fetch-key="fetchKey" - :config="config" - @load-more="emit('load-more')" - /> - </NcAppContentList> - </template> - - <NcAppContentDetails class="content-details-container"> - <FeedItemDisplay v-if="selectedFeedItem" :item="selectedFeedItem" /> - </NcAppContentDetails> - </NcAppContent> + <NcAppContent :show-details="showDetails" + @update:showDetails="unselectItem()"> + <template #list> + <NcAppContentList> + <div class="header"> + <slot name="header" /> + </div> + + <FeedItemDisplayList :items="items" + :fetch-key="fetchKey" + :config="config" + @load-more="emit('load-more')" /> + </NcAppContentList> + </template> + + <NcAppContentDetails class="content-details-container"> + <FeedItemDisplay v-if="selectedFeedItem" :item="selectedFeedItem" /> + </NcAppContentDetails> + </NcAppContent> </template> <script setup lang="ts"> - import { PropType, computed, ref, watch } from 'vue'; +import { PropType, computed, ref, watch } from 'vue' - import itemStore from '../store/item'; +import itemStore from '../store/item' - import NcAppContent from '@nextcloud/vue/dist/Components/NcAppContent'; - import NcAppContentList from '@nextcloud/vue/dist/Components/NcAppContentList'; - import NcAppContentDetails from '@nextcloud/vue/dist/Components/NcAppContentDetails'; +import NcAppContent from '@nextcloud/vue/dist/Components/NcAppContent' +import NcAppContentList from '@nextcloud/vue/dist/Components/NcAppContentList' +import NcAppContentDetails from '@nextcloud/vue/dist/Components/NcAppContentDetails' - import {FeedItem} from '../types/FeedItem'; +import { FeedItem } from '../types/FeedItem' - import FeedItemDisplayList from './feed-display/FeedItemDisplayList.vue'; - import FeedItemDisplay from './feed-display/FeedItemDisplay.vue'; +import FeedItemDisplayList from './feed-display/FeedItemDisplayList.vue' +import FeedItemDisplay from './feed-display/FeedItemDisplay.vue' - defineProps({ - items: { - type: Array as PropType<Array<FeedItem>>, - required: true - }, - fetchKey: { - type: String, - required: true - }, - config: { - type: Object - } - }) +defineProps({ + items: { + type: Array as PropType<Array<FeedItem>>, + required: true, + }, + fetchKey: { + type: String, + required: true, + }, + config: { + type: Object, + }, +}) - const emit = defineEmits<{ +const emit = defineEmits<{ (event: 'load-more'): void - }>(); - - const showDetails = ref(false); - - const selectedFeedItem = computed(() => { - return itemStore.getters.selected(itemStore.state); - }) - - watch(selectedFeedItem, (newSelectedFeedItem) => { - if (newSelectedFeedItem) { - showDetails.value = true; - } else { - showDetails.value = false; - } - }) - - function unselectItem() { - itemStore.mutations.SET_SELECTED_ITEM( - itemStore.state, - {id: undefined} - ); + }>() + +const showDetails = ref(false) + +const selectedFeedItem = computed(() => { + return itemStore.getters.selected(itemStore.state) +}) + +watch(selectedFeedItem, (newSelectedFeedItem) => { + if (newSelectedFeedItem) { + showDetails.value = true + } else { + showDetails.value = false } +}) + +function unselectItem() { + itemStore.mutations.SET_SELECTED_ITEM( + itemStore.state, + { id: undefined }, + ) +} </script> diff --git a/src/components/feed-display/FeedItemRow.vue b/src/components/feed-display/FeedItemRow.vue index b4b51bc73..b2cde973d 100644 --- a/src/components/feed-display/FeedItemRow.vue +++ b/src/components/feed-display/FeedItemRow.vue @@ -8,11 +8,9 @@ :href="item.url" :title="t('news', 'Open website')" @click="markRead(item); $event.stopPropagation();"> - <span - v-if="getFeed(item.feedId).faviconLink" + <span v-if="getFeed(item.feedId).faviconLink" class="favicon" - :style="{ 'backgroundImage': 'url(' + getFeed(item.feedId).faviconLink + ')' }" - /> + :style="{ 'backgroundImage': 'url(' + getFeed(item.feedId).faviconLink + ')' }" /> <RssIcon v-else /> </a> </div> diff --git a/src/components/routes/All.vue b/src/components/routes/All.vue index fda92d593..6f7b93d0d 100644 --- a/src/components/routes/All.vue +++ b/src/components/routes/All.vue @@ -1,9 +1,7 @@ <template> - <ContentTemplate - :items="allItems" + <ContentTemplate :items="allItems" :fetch-key="'all'" - @load-more="fetchMore()" - > + @load-more="fetchMore()"> <template #header> {{ t('news', 'All Articles') }} </template> diff --git a/src/components/routes/Feed.vue b/src/components/routes/Feed.vue index 389b38da6..57adb32e0 100644 --- a/src/components/routes/Feed.vue +++ b/src/components/routes/Feed.vue @@ -1,9 +1,7 @@ <template> - <ContentTemplate - :items="items" + <ContentTemplate :items="items" :fetch-key="'feed-' + feedId" - @load-more="fetchMore()" - > + @load-more="fetchMore()"> <template #header> {{ feed ? feed.title : '' }} <NcCounterBubble v-if="feed" class="counter-bubble"> diff --git a/src/components/routes/Folder.vue b/src/components/routes/Folder.vue index 1a537a6c6..cf078c5fa 100644 --- a/src/components/routes/Folder.vue +++ b/src/components/routes/Folder.vue @@ -1,9 +1,7 @@ <template> - <ContentTemplate - :items="items" + <ContentTemplate :items="items" :fetch-key="'folder-' + folderId" - @load-more="fetchMore()" - > + @load-more="fetchMore()"> <template #header> {{ folder ? folder.name : '' }} <NcCounterBubble v-if="folder" class="counter-bubble"> diff --git a/src/components/routes/Starred.vue b/src/components/routes/Starred.vue index 538804ad8..10cd5d2a7 100644 --- a/src/components/routes/Starred.vue +++ b/src/components/routes/Starred.vue @@ -1,10 +1,8 @@ <template> - <ContentTemplate - :items="starred" + <ContentTemplate :items="starred" :fetch-key="'starred'" :config="{ starFilter: false }" - @load-more="fetchMore()" - > + @load-more="fetchMore()"> <template #header> {{ t('news', 'Starred') }} <NcCounterBubble class="counter-bubble"> diff --git a/src/components/routes/Unread.vue b/src/components/routes/Unread.vue index a62f28d13..254acfd6f 100644 --- a/src/components/routes/Unread.vue +++ b/src/components/routes/Unread.vue @@ -1,10 +1,8 @@ <template> - <ContentTemplate - :items="unread()" + <ContentTemplate :items="unread()" :fetch-key="'unread'" :config="{ unreadFilter: false }" - @load-more="fetchMore()" - > + @load-more="fetchMore()"> <template #header> {{ t('news', 'Unread Articles') }} <NcCounterBubble class="counter-bubble"> @@ -33,7 +31,7 @@ type UnreadItemState = { export default Vue.extend({ components: { ContentTemplate, - NcCounterBubble + NcCounterBubble, }, data() { return { |