diff --git a/src/hooks/useAddSlidesOrElements.ts b/src/hooks/useAddSlidesOrElements.ts index 1e7fcd65..8a385a41 100644 --- a/src/hooks/useAddSlidesOrElements.ts +++ b/src/hooks/useAddSlidesOrElements.ts @@ -9,7 +9,7 @@ import useHistorySnapshot from '@/hooks/useHistorySnapshot' export default () => { const mainStore = useMainStore() const slidesStore = useSlidesStore() - const { currentSlide, slides } = storeToRefs(slidesStore) + const { currentSlide } = storeToRefs(slidesStore) const { addHistorySnapshot } = useHistorySnapshot() @@ -100,15 +100,8 @@ export default () => { addHistorySnapshot() } - const isEmptySlide = computed(() => { - if (slides.value.length > 1) return false - if (slides.value[0].elements.length > 0) return false - return true - }) - return { addElementsFromData, addSlidesFromData, - isEmptySlide, } } \ No newline at end of file diff --git a/src/hooks/useImport.ts b/src/hooks/useImport.ts index 39f9d4f8..8538a354 100644 --- a/src/hooks/useImport.ts +++ b/src/hooks/useImport.ts @@ -7,6 +7,7 @@ import { decrypt } from '@/utils/crypto' import { type ShapePoolItem, SHAPE_LIST, SHAPE_PATH_FORMULAS } from '@/configs/shapes' import { VIEWPORT_SIZE } from '@/configs/canvas' import useAddSlidesOrElements from '@/hooks/useAddSlidesOrElements' +import useSlideHandler from '@/hooks/useSlideHandler' import message from '@/utils/message' import type { Slide, @@ -25,7 +26,8 @@ export default () => { const slidesStore = useSlidesStore() const { theme } = storeToRefs(useSlidesStore()) - const { addSlidesFromData, isEmptySlide } = useAddSlidesOrElements() + const { addSlidesFromData } = useAddSlidesOrElements() + const { isEmptySlide } = useSlideHandler() const exporting = ref(false) diff --git a/src/hooks/useSectionHandler.ts b/src/hooks/useSectionHandler.ts new file mode 100644 index 00000000..a3ab526c --- /dev/null +++ b/src/hooks/useSectionHandler.ts @@ -0,0 +1,92 @@ +import { storeToRefs } from 'pinia' +import { nanoid } from 'nanoid' +import { useSlidesStore } from '@/store' +import useHistorySnapshot from '@/hooks/useHistorySnapshot' +import useSlideHandler from '@/hooks/useSlideHandler' + +export default () => { + const slidesStore = useSlidesStore() + const { slides } = storeToRefs(slidesStore) + + const { addHistorySnapshot } = useHistorySnapshot() + const { deleteSlide } = useSlideHandler() + + const createSection = () => { + slidesStore.updateSlide({ + sectionTag: { + id: nanoid(6), + }, + }) + addHistorySnapshot() + } + + const removeSection = (sectionId: string) => { + if (!sectionId) return + + const slide = slides.value.find(slide => slide.sectionTag?.id === sectionId)! + slidesStore.removeSlideProps({ + id: slide.id, + propName: 'sectionTag', + }) + addHistorySnapshot() + } + + const removeAllSection = () => { + const _slides = slides.value.map(slide => { + if (slide.sectionTag) delete slide.sectionTag + return slide + }) + slidesStore.setSlides(_slides) + addHistorySnapshot() + } + + const removeSectionSlides = (sectionId: string) => { + let startIndex = 0 + if (sectionId) { + startIndex = slides.value.findIndex(slide => slide.sectionTag?.id === sectionId) + } + const ids: string[] = [] + + for (let i = startIndex; i < slides.value.length; i++) { + const slide = slides.value[i] + if(i !== startIndex && slide.sectionTag) break + + ids.push(slide.id) + } + + deleteSlide(ids) + } + + const updateSectionTitle = (sectionId: string, title: string) => { + if (!title) return + + if (sectionId === 'default') { + slidesStore.updateSlide({ + sectionTag: { + id: nanoid(6), + title, + }, + }, slides.value[0].id) + } + else { + const slide = slides.value.find(slide => slide.sectionTag?.id === sectionId) + if (!slide) return + + slidesStore.updateSlide({ + sectionTag: { + ...slide.sectionTag!, + title, + }, + }, slide.id) + } + addHistorySnapshot() + } + + return { + createSection, + removeSection, + removeAllSection, + removeSectionSlides, + updateSectionTitle, + } +} \ No newline at end of file diff --git a/src/hooks/useSlideHandler.ts b/src/hooks/useSlideHandler.ts index 762c6258..b1d7fd52 100644 --- a/src/hooks/useSlideHandler.ts +++ b/src/hooks/useSlideHandler.ts @@ -168,76 +168,11 @@ export default () => { slidesStore.updateSlideIndex(newIndex) } - const createSection = () => { - slidesStore.updateSlide({ - sectionTag: { - id: nanoid(6), - }, - }) - addHistorySnapshot() - } - - const removeSection = (sectionId: string) => { - if (!sectionId) return - - const slide = slides.value.find(slide => slide.sectionTag?.id === sectionId)! - slidesStore.removeSlideProps({ - id: slide.id, - propName: 'sectionTag', - }) - addHistorySnapshot() - } - - const removeAllSection = () => { - const _slides = slides.value.map(slide => { - if (slide.sectionTag) delete slide.sectionTag - return slide - }) - slidesStore.setSlides(_slides) - addHistorySnapshot() - } - - const removeSectionSlides = (sectionId: string) => { - let startIndex = 0 - if (sectionId) { - startIndex = slides.value.findIndex(slide => slide.sectionTag?.id === sectionId) - } - const ids: string[] = [] - - for (let i = startIndex; i < slides.value.length; i++) { - const slide = slides.value[i] - if(i !== startIndex && slide.sectionTag) break - - ids.push(slide.id) - } - - deleteSlide(ids) - } - - const updateSectionTitle = (sectionId: string, title: string) => { - if (!title) return - - if (sectionId === 'default') { - slidesStore.updateSlide({ - sectionTag: { - id: nanoid(6), - title, - }, - }, slides.value[0].id) - } - else { - const slide = slides.value.find(slide => slide.sectionTag?.id === sectionId) - if (!slide) return - - slidesStore.updateSlide({ - sectionTag: { - ...slide.sectionTag!, - title, - }, - }, slide.id) - } - addHistorySnapshot() - } + const isEmptySlide = computed(() => { + if (slides.value.length > 1) return false + if (slides.value[0].elements.length > 0) return false + return true + }) return { resetSlides, @@ -251,10 +186,6 @@ export default () => { cutSlide, selectAllSlide, sortSlides, - createSection, - removeSection, - removeAllSection, - removeSectionSlides, - updateSectionTitle, + isEmptySlide, } } \ No newline at end of file diff --git a/src/views/Editor/Thumbnails/index.vue b/src/views/Editor/Thumbnails/index.vue index 9d5e8b14..834f75c3 100644 --- a/src/views/Editor/Thumbnails/index.vue +++ b/src/views/Editor/Thumbnails/index.vue @@ -74,6 +74,7 @@ import { fillDigit } from '@/utils/common' import { isElementInViewport } from '@/utils/element' import type { ContextmenuItem } from '@/components/Contextmenu/types' import useSlideHandler from '@/hooks/useSlideHandler' +import useSectionHandler from '@/hooks/useSectionHandler' import useScreening from '@/hooks/useScreening' import useLoadSlides from '@/hooks/useLoadSlides' @@ -109,12 +110,15 @@ const { cutSlide, selectAllSlide, sortSlides, +} = useSlideHandler() + +const { createSection, removeSection, removeAllSection, removeSectionSlides, updateSectionTitle, -} = useSlideHandler() +} = useSectionHandler() // 页面被切换时 const thumbnailsRef = ref>()