快捷键补充

This commit is contained in:
pipipi-pikachu 2021-01-30 17:01:59 +08:00
parent 2393630318
commit d9948164fc
3 changed files with 31 additions and 5 deletions

View File

@ -51,7 +51,7 @@ export default defineComponent({
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
$menuWidth: 160px; $menuWidth: 165px;
$menuHeight: 30px; $menuHeight: 30px;
$subMenuWidth: 120px; $subMenuWidth: 120px;

View File

@ -27,7 +27,7 @@ import { ContextmenuItem, Axis } from './types'
import MenuContent from './MenuContent.vue' import MenuContent from './MenuContent.vue'
const MENU_WIDTH = 160 const MENU_WIDTH = 165
const MENU_HEIGHT = 30 const MENU_HEIGHT = 30
const DIVIDER_HEIGHT = 11 const DIVIDER_HEIGHT = 11
const SUB_MENU_WIDTH = 120 const SUB_MENU_WIDTH = 120

View File

@ -3,6 +3,7 @@
class="thumbnails" class="thumbnails"
@mousedown="() => setThumbnailsFocus(true)" @mousedown="() => setThumbnailsFocus(true)"
v-click-outside="() => setThumbnailsFocus(false)" v-click-outside="() => setThumbnailsFocus(false)"
v-contextmenu="contextmenusThumbnails"
> >
<div class="add-slide" @click="createSlide()"><IconPlus /> 添加幻灯片</div> <div class="add-slide" @click="createSlide()"><IconPlus /> 添加幻灯片</div>
<Draggable <Draggable
@ -19,7 +20,7 @@
class="thumbnail-wrapper" class="thumbnail-wrapper"
:class="{ 'active': slideIndex === index }" :class="{ 'active': slideIndex === index }"
@mousedown="changSlideIndex(index)" @mousedown="changSlideIndex(index)"
v-contextmenu="contextmenus" v-contextmenu="contextmenusThumbnailItem"
> >
<div class="slide-index">{{ fillDigit(index + 1, 2) }}</div> <div class="slide-index">{{ fillDigit(index + 1, 2) }}</div>
<div class="thumbnail"> <div class="thumbnail">
@ -37,6 +38,7 @@ import { MutationTypes, useStore } from '@/store'
import { fillDigit } from '@/utils/common' import { fillDigit } from '@/utils/common'
import { ContextmenuItem } from '@/components/Contextmenu/types' import { ContextmenuItem } from '@/components/Contextmenu/types'
import useSlideHandler from '@/hooks/useSlideHandler' import useSlideHandler from '@/hooks/useSlideHandler'
import useScreening from '@/hooks/useScreening'
import Draggable from 'vuedraggable' import Draggable from 'vuedraggable'
import ThumbnailSlide from '@/views/components/ThumbnailSlide/index.vue' import ThumbnailSlide from '@/views/components/ThumbnailSlide/index.vue'
@ -87,7 +89,24 @@ export default defineComponent({
store.commit(MutationTypes.UPDATE_SLIDE_INDEX, newIndex) store.commit(MutationTypes.UPDATE_SLIDE_INDEX, newIndex)
} }
const contextmenus = (): ContextmenuItem[] => { const { enterScreening } = useScreening()
const contextmenusThumbnails = (): ContextmenuItem[] => {
return [
{
text: '粘贴',
subText: 'Ctrl + V',
handler: pasteSlide,
},
{
text: '新建页面',
subText: 'Enter',
handler: createSlide,
},
]
}
const contextmenusThumbnailItem = (): ContextmenuItem[] => {
return [ return [
{ {
text: '剪切', text: '剪切',
@ -119,6 +138,12 @@ export default defineComponent({
subText: 'Delete', subText: 'Delete',
handler: deleteSlide, handler: deleteSlide,
}, },
{ divider: true },
{
text: '从本页演示',
subText: 'Ctrl+F5',
handler: enterScreening,
},
] ]
} }
@ -128,7 +153,8 @@ export default defineComponent({
slideIndex, slideIndex,
createSlide, createSlide,
changSlideIndex, changSlideIndex,
contextmenus, contextmenusThumbnails,
contextmenusThumbnailItem,
fillDigit, fillDigit,
handleDragEnd, handleDragEnd,
} }