Hugging Face's logo

Spaces:
CatPtain
/
web_ppt
Running

App Files Community
web_ppt
File size: 2,195 Bytes 
89ce340
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
 
import { computed, type Ref } from 'vue'
import { OperateResizeHandlers, OperateBorderLines } from '@/types/edit'

export default (width: Ref<number>, height: Ref<number>) => {
  // 元素缩放点
  const resizeHandlers = computed(() => {
    return [
      { direction: OperateResizeHandlers.LEFT_TOP, style: {} },
      { direction: OperateResizeHandlers.TOP, style: {left: width.value / 2 + 'px'} },
      { direction: OperateResizeHandlers.RIGHT_TOP, style: {left: width.value + 'px'} },
      { direction: OperateResizeHandlers.LEFT, style: {top: height.value / 2 + 'px'} },
      { direction: OperateResizeHandlers.RIGHT, style: {left: width.value + 'px', top: height.value / 2 + 'px'} },
      { direction: OperateResizeHandlers.LEFT_BOTTOM, style: {top: height.value + 'px'} },
      { direction: OperateResizeHandlers.BOTTOM, style: {left: width.value / 2 + 'px', top: height.value + 'px'} },
      { direction: OperateResizeHandlers.RIGHT_BOTTOM, style: {left: width.value + 'px', top: height.value + 'px'} },
    ]
  })

  // 文本元素缩放点
  const textElementResizeHandlers = computed(() => {
    return [
      { direction: OperateResizeHandlers.LEFT, style: {top: height.value / 2 + 'px'} },
      { direction: OperateResizeHandlers.RIGHT, style: {left: width.value + 'px', top: height.value / 2 + 'px'} },
    ]
  })
  const verticalTextElementResizeHandlers = computed(() => {
    return [
      { direction: OperateResizeHandlers.TOP, style: {left: width.value / 2 + 'px'} },
      { direction: OperateResizeHandlers.BOTTOM, style: {left: width.value / 2 + 'px', top: height.value + 'px'} },
    ]
  })

  // 元素选中边框线
  const borderLines = computed(() => {
    return [
      { type: OperateBorderLines.T, style: {width: width.value + 'px'} },
      { type: OperateBorderLines.B, style: {top: height.value + 'px', width: width.value + 'px'} },
      { type: OperateBorderLines.L, style: {height: height.value + 'px'} },
      { type: OperateBorderLines.R, style: {left: width.value + 'px', height: height.value + 'px'} },
    ]
  })

  return {
    resizeHandlers,
    textElementResizeHandlers,
    verticalTextElementResizeHandlers,
    borderLines,
  }
}