字体放大缩小

src/views/Editor/Canvas/Operate/TextElementOperate.vue

@@ -70,5 +70,4 @@ const scaleHeight = computed(() => props.elementInfo.height * canvasScale.value)
 const { textElementResizeHandlers, verticalTextElementResizeHandlers, borderLines, textElementTesizeHandlers } = useCommonOperate(scaleWidth, scaleHeight)
 const resizeHandlers = computed(() => props.elementInfo.vertical ? verticalTextElementResizeHandlers.value : textElementResizeHandlers.value)
 const tesizeHandlers = computed(() => props.elementInfo.vertical ? textElementTesizeHandlers.value : textElementTesizeHandlers.value)
-console.log(textElementTesizeHandlers.value,'---------')
 </script>
\ No newline at end of file

src/views/Editor/Canvas/Operate/TextsizeHandler.vue

+<template>
+  <div :class="['resize-handler', rotateClassName, type]"></div>
+</template>
+
+<script lang="ts" setup>
+import { computed } from 'vue'
+import type { OperateResizeHandlers } from '@/types/edit'
+
+const props = withDefaults(defineProps<{
+  type?: OperateResizeHandlers
+  rotate?: number
+}>(), {
+  rotate: 0,
+})
+
+const rotateClassName = computed(() => {
+  const prefix = 'rotate-'
+  const rotate = props.rotate
+  if (rotate > -22.5 && rotate <= 22.5) return prefix + 0
+  else if (rotate > 22.5 && rotate <= 67.5) return prefix + 45
+  else if (rotate > 67.5 && rotate <= 112.5) return prefix + 90
+  else if (rotate > 112.5 && rotate <= 157.5) return prefix + 135
+  else if (rotate > 157.5 || rotate <= -157.5) return prefix + 0
+  else if (rotate > -157.5 && rotate <= -112.5) return prefix + 45
+  else if (rotate > -112.5 && rotate <= -67.5) return prefix + 90
+  else if (rotate > -67.5 && rotate <= -22.5) return prefix + 135
+  return prefix + 0
+})
+</script>
+
+<style lang="scss" scoped>
+.resize-handler {
+  position: absolute;
+  width: 10px;
+  height: 10px;
+  left: 0;
+  top: 0;
+  margin: -5px 0 0 -5px;
+  border: 1px solid $themeColor;
+  background-color: #fff;
+  border-radius: 1px;
+  cursor: pointer;
+
+  &.left-top.rotate-0,
+  &.right-bottom.rotate-0,
+  &.left.rotate-45,
+  &.right.rotate-45,
+  &.left-bottom.rotate-90,
+  &.right-top.rotate-90,
+  &.top.rotate-135,
+  &.bottom.rotate-135 {
+    cursor: nwse-resize;
+  }
+  &.top.rotate-0,
+  &.bottom.rotate-0,
+  &.left-top.rotate-45,
+  &.right-bottom.rotate-45,
+  &.left.rotate-90,
+  &.right.rotate-90,
+  &.left-bottom.rotate-135,
+  &.right-top.rotate-135 {
+    cursor: ns-resize;
+  }
+  &.left-bottom.rotate-0,
+  &.right-top.rotate-0,
+  &.top.rotate-45,
+  &.bottom.rotate-45,
+  &.left-top.rotate-90,
+  &.right-bottom.rotate-90,
+  &.left.rotate-135,
+  &.right.rotate-135 {
+    cursor: nesw-resize;
+  }
+  &.left.rotate-0,
+  &.right.rotate-0,
+  &.left-bottom.rotate-45,
+  &.right-top.rotate-45,
+  &.top.rotate-90,
+  &.bottom.rotate-90,
+  &.left-top.rotate-135,
+  &.right-bottom.rotate-135 {
+    cursor: ew-resize;
+  }
+}
+</style>
\ No newline at end of file

src/views/Editor/Canvas/hooks/useScaleElement.ts

 import type { Ref } from 'vue'
 import { storeToRefs } from 'pinia'
-import { useMainStore, useSlidesStore, useKeyboardStore } from '@/store'
+import { useMainStore, useSlidesStore, useKeyboardStore, useFontStore } from '@/store'
 import type { PPTElement, PPTImageElement, PPTLineElement, PPTShapeElement } from '@/types/slides'
 import { OperateResizeHandlers, type AlignmentLineProps, type MultiSelectRange } from '@/types/edit'
 import { VIEWPORT_SIZE } from '@/configs/canvas'
@@ -8,6 +8,7 @@ import { MIN_SIZE } from '@/configs/element'
 import { SHAPE_PATH_FORMULAS } from '@/configs/shapes'
 import { type AlignLine, uniqAlignLines } from '@/utils/element'
 import useHistorySnapshot from '@/hooks/useHistorySnapshot'
+import emitter, { EmitterEvents } from '@/utils/emitter'
 
 interface RotateElementData {
   left: number
@@ -100,13 +101,13 @@ export default (
 ) => {
   const mainStore = useMainStore()
   const slidesStore = useSlidesStore()
-  const { activeElementIdList, activeGroupElementId } = storeToRefs(mainStore)
+  const { activeElementIdList, activeGroupElementId, richTextAttrs } = storeToRefs(mainStore)
   const { viewportRatio } = storeToRefs(slidesStore)
   const { ctrlOrShiftKeyActive } = storeToRefs(useKeyboardStore())
 
   const { addHistorySnapshot } = useHistorySnapshot()
 
-  // 缩放元素
+  // 缩放文字元素
   const scaleText = (e: MouseEvent | TouchEvent, element: Exclude<PPTElement, PPTLineElement>, command: OperateResizeHandlers) => {
     const isTouchEvent = !(e instanceof MouseEvent)
     if (isTouchEvent && (!e.changedTouches || !e.changedTouches[0])) return
@@ -139,6 +140,11 @@ export default (
     let baseTop = 0
     let horizontalLines: AlignLine[] = []
     let verticalLines: AlignLine[] = []
+    let idData =''
+    let oWidth = 0
+    let oHeight = 0
+    let nWidth = 0
+    let nHeight = 0
 
     // 旋转后的元素进行缩放时，引入基点的概念，以当前操作的缩放点相对的点为基点
     // 例如拖动右下角缩放时，左上角为基点，需要保持左上角不变然后修改其他的点的位置来达到所放的效果
@@ -424,6 +430,9 @@ export default (
             cellMinHeight: cellMinHeight < 36 ? 36 : cellMinHeight,
           }
         }
+        idData = el.id
+        oWidth = el.width
+        oHeight = el.height
         return { ...el, left, top, width, height }
       })
     }
@@ -443,10 +452,14 @@ export default (
       
       if (startPageX === currentPageX && startPageY === currentPageY) return
       
-      console.log(elementList.value,'-----')
       slidesStore.updateSlide({ elements: elementList.value })
       mainStore.setScalingState(false)
       
+      let textIdData = elementList.value.filter(x=>x.id==idData)
+      let el = textIdData[0]
+      nWidth = el.width
+      nHeight = el.height
+      console.log(textIdData[0],'-----')
       addHistorySnapshot()
     }
 

src/views/TeamCenter/Index.vue

@@ -55,7 +55,7 @@
             <span class="title">存储空间</span>
             <div class="text-small text-info q-mt-sm">会员可以使用平台全部预设模板</div>
           </div>
-          <el-button type="info" class="normal">会员尊享{{TravelDesign.CloudTotsl}}{{TravelDesign.CloudTotallnit}}空间</el-button>
+          <el-button type="info" class="normal">会员尊享{{TravelDesign.CloudTotal}}{{TravelDesign.CloudTotalUnit}}空间</el-button>
         </div>
         <div style="font-size: 14px;" class="q-mt-xl">
           <el-progress :percentage="TravelDesign.storagePercent" />

src/views/UserCenter/Index.vue

@@ -59,7 +59,7 @@
             <span class="title">存储空间</span>
             <div class="text-small text-info q-mt-sm">会员可以使用平台全部预设模板</div>
           </div>
-          <el-button type="info" class="normal">会员尊享{{TravelDesign.CloudTotsl}}{{TravelDesign.CloudTotallnit}}空间</el-button>
+          <el-button type="info" class="normal">会员尊享{{TravelDesign.CloudTotal}}{{TravelDesign.CloudTotalUnit}}空间</el-button>
         </div>
         <div style="font-size: 14px;" class="q-mt-xl">
           <el-progress :percentage="TravelDesign.storagePercent" />