bvandeusen
f1860866de
Operator confirmed they have no existing ?image=N bookmarks to preserve, so the soft-compat read on initial mount + router.replace strip is dead weight. The modal is now purely a Pinia overlay — no URL involvement on open OR initial mount. Drops 33 lines plus the now-unused vue-router imports in both ArtistGalleryTab (entire onMounted gone) and GalleryView (just the ?image=N block; the post_id/tag_id filter handling stays).
82 lines
2.5 KiB
Vue
82 lines
2.5 KiB
Vue
<template>
|
|
<v-container fluid class="pt-2 pb-6">
|
|
<Teleport to="#fc-nav-actions">
|
|
<v-btn
|
|
:color="sel.isSelectMode ? 'accent' : undefined"
|
|
:variant="sel.isSelectMode ? 'flat' : 'tonal'"
|
|
size="small"
|
|
@click="sel.isSelectMode ? sel.exitSelectMode() : sel.enterSelectMode()"
|
|
>{{ sel.isSelectMode ? 'Done' : 'Select' }}</v-btn>
|
|
</Teleport>
|
|
|
|
<div class="fc-gallery-layout">
|
|
<div class="fc-gallery-layout__main">
|
|
<PostInfoHeader />
|
|
<EmptyState v-if="store.isEmpty" />
|
|
<GalleryGrid v-else @open="openImage" />
|
|
</div>
|
|
<TimelineSidebar v-if="store.images.length > 0" class="fc-gallery-layout__sidebar" />
|
|
</div>
|
|
|
|
<BulkEditorPanel />
|
|
</v-container>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { onMounted, watch } from 'vue'
|
|
import { useRoute } from 'vue-router'
|
|
import { useGalleryStore } from '../stores/gallery.js'
|
|
import { useModalStore } from '../stores/modal.js'
|
|
import GalleryGrid from '../components/gallery/GalleryGrid.vue'
|
|
import TimelineSidebar from '../components/gallery/TimelineSidebar.vue'
|
|
import EmptyState from '../components/gallery/EmptyState.vue'
|
|
import PostInfoHeader from '../components/gallery/PostInfoHeader.vue'
|
|
import BulkEditorPanel from '../components/gallery/BulkEditorPanel.vue'
|
|
import { useGallerySelectionStore } from '../stores/gallerySelection.js'
|
|
|
|
const store = useGalleryStore()
|
|
const modal = useModalStore()
|
|
const sel = useGallerySelectionStore()
|
|
const route = useRoute()
|
|
|
|
onMounted(async () => {
|
|
const postId = parseInt(route.query.post_id, 10)
|
|
const tagId = parseInt(route.query.tag_id, 10)
|
|
if (!isNaN(postId)) store.setPostFilter(postId)
|
|
else if (!isNaN(tagId)) store.setTagFilter(tagId)
|
|
await store.loadInitial()
|
|
await store.loadTimeline()
|
|
})
|
|
|
|
watch(() => route.query.tag_id, (q) => {
|
|
sel.clear() // result set changed — selected ids are no longer valid
|
|
const tagId = parseInt(q, 10)
|
|
store.setTagFilter(isNaN(tagId) ? null : tagId)
|
|
})
|
|
|
|
watch(() => route.query.post_id, (q) => {
|
|
sel.clear() // result set changed — selected ids are no longer valid
|
|
const postId = parseInt(q, 10)
|
|
store.setPostFilter(isNaN(postId) ? null : postId)
|
|
})
|
|
|
|
function openImage(id) {
|
|
modal.open(id)
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.fc-gallery-layout {
|
|
display: flex;
|
|
gap: 16px;
|
|
align-items: flex-start;
|
|
}
|
|
.fc-gallery-layout__main { flex: 1; min-width: 0; }
|
|
.fc-gallery-layout__sidebar { flex-shrink: 0; }
|
|
|
|
@media (max-width: 900px) {
|
|
.fc-gallery-layout { flex-direction: column-reverse; }
|
|
.fc-gallery-layout__sidebar { width: 100%; max-height: 200px; }
|
|
}
|
|
</style>
|