perf: 链接设置优化

This commit is contained in:
pipipi-pikachu 2022-09-04 22:48:04 +08:00
parent ad2bac7d80
commit 79d8454389
2 changed files with 22 additions and 6 deletions

View File

@ -22,7 +22,12 @@
v-if="type === 'slide'" v-if="type === 'slide'"
v-model:value="slideId" v-model:value="slideId"
> >
<SelectOption v-for="(slide, index) in slides" :key="slide.id" :value="slide.id">幻灯片 {{index + 1}}</SelectOption> <SelectOption
v-for="(slide, index) in slides"
:key="slide.id"
:value="slide.id"
:disabled="currentSlide.id === slide.id"
>幻灯片 {{index + 1}}</SelectOption>
</Select> </Select>
<div class="preview" v-if="type === 'slide' && selectedSlide"> <div class="preview" v-if="type === 'slide' && selectedSlide">
@ -57,13 +62,13 @@ const emit = defineEmits<{
}>() }>()
const { handleElement } = storeToRefs(useMainStore()) const { handleElement } = storeToRefs(useMainStore())
const { slides } = storeToRefs(useSlidesStore()) const { slides, currentSlide } = storeToRefs(useSlidesStore())
const type = ref<TypeKey>('web') const type = ref<TypeKey>('web')
const address = ref('') const address = ref('')
const slideId = ref('') const slideId = ref('')
slideId.value = slides.value[0].id slideId.value = slides.value.find(item => item.id !== currentSlide.value.id)?.id || ''
const selectedSlide = computed(() => { const selectedSlide = computed(() => {
if (!slideId.value) return null if (!slideId.value) return null

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="link-handler" :style="{ top: height * canvasScale + 10 + 'px' }"> <div class="link-handler" :style="{ top: height * canvasScale + 10 + 'px' }">
<a class="link" v-if="link.type === 'web'" :href="link.target" target="_blank">{{link.target}}</a> <a class="link" v-if="link.type === 'web'" :href="link.target" target="_blank">{{link.target}}</a>
<a class="link" v-else>幻灯片页面 {{link.target}}</a> <a class="link" v-else @click="turnTarget(link.target)">幻灯片页面 {{link.target}}</a>
<div class="btns"> <div class="btns">
<div class="btn" @click="openLinkDialog()">更换</div> <div class="btn" @click="openLinkDialog()">更换</div>
<Divider type="vertical" /> <Divider type="vertical" />
@ -13,7 +13,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import { computed, PropType } from 'vue' import { computed, PropType } from 'vue'
import { storeToRefs } from 'pinia' import { storeToRefs } from 'pinia'
import { useMainStore } from '@/store' import { useMainStore, useSlidesStore } from '@/store'
import { PPTElement, PPTElementLink } from '@/types/slides' import { PPTElement, PPTElementLink } from '@/types/slides'
import useLink from '@/hooks/useLink' import useLink from '@/hooks/useLink'
@ -32,9 +32,20 @@ const props = defineProps({
}, },
}) })
const { canvasScale } = storeToRefs(useMainStore()) const mainStore = useMainStore()
const slidesStore = useSlidesStore()
const { canvasScale } = storeToRefs(mainStore)
const { slides } = storeToRefs(slidesStore)
const { removeLink } = useLink() const { removeLink } = useLink()
const height = computed(() => props.elementInfo.type === 'line' ? 0 : props.elementInfo.height) const height = computed(() => props.elementInfo.type === 'line' ? 0 : props.elementInfo.height)
const turnTarget = (slideId: string) => {
const targetIndex = slides.value.findIndex(item => item.id === slideId)
if (targetIndex !== -1) {
mainStore.setActiveElementIdList([])
slidesStore.updateSlideIndex(targetIndex)
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>