screen-shot-forvue/src/module/split-methods/CalculateToolLocation.ts

web端自定义截屏插件(Vue3版)，一个基于vue-web-screen-shot二开的插件

import { positionInfoType } from "@/module/type/ComponentType";

/**
 * 计算截图工具栏位置
 * @param position 裁剪框位置信息
 * @param toolWidth 截图工具栏宽度
 */
export function calculateToolLocation(
  position: positionInfoType,
  toolWidth: number,
  boxdom: any
) {
  // 工具栏X轴坐标 = (裁剪框的宽度 - 工具栏的宽度) / 2 + 裁剪框距离左侧的距离
  const mouseX = (position.width - toolWidth) / 2 + position.startX;
  // 工具栏Y轴坐标
  let mouseY = position.startY + position.height + 10;
  if (position.width < 0 && position.height < 0) {
    // 从右下角拖动时，工具条y轴的位置应该为position.startY + 10
    mouseY = position.startY + 10;
  }
  if (mouseY + 144 >= boxdom.value.clientHeight) {
    mouseY -= position.height + 100;
  }
  // if (mouseY < 0) {
  mouseY = position.startY;
  // }
  // console.log(boxdom.value.clientHeight, boxdom);
  return {
    mouseX,
    mouseY
  };
}