drawing-board-service/src/core/components/line/index.ts

import { Pos } from "@/utils/math.ts";
import { BaseItem, generateSnapInfos, getBaseItem } from "../util.ts";
import { getMouseColors } from "@/utils/colors.ts";
import { InteractiveFix, InteractiveTo, MatResponseProps } from "../index.ts";
import { Transform } from "konva/lib/Util";
import { inRevise } from "@/utils/shared.ts";

export { default as Component } from "./line.vue";
export { default as TempComponent } from "./temp-line.vue";

export const shapeName = "线段";
export const defaultStyle = {
  stroke: '#000000',
  strokeWidth: 5,
  dash: [30, 0],
};

export const addMode = "dots";

export const getMouseStyle = (data: LineData) => {
  const strokeStatus = getMouseColors(data.stroke || defaultStyle.stroke);
  const strokeWidth = data.strokeWidth || defaultStyle.strokeWidth;

  return {
    default: { stroke: data.stroke || defaultStyle.stroke, strokeWidth },
    hover: { stroke: strokeStatus.hover },
    select: { stroke: strokeStatus.select },
    focus: { stroke: strokeStatus.hover },
    press: { stroke: strokeStatus.press },
  };
};

export const getSnapInfos = (data: LineData) =>
  generateSnapInfos(getSnapPoints(data), true, true, true);

export const getSnapPoints = (data: LineData) => {
  return data.points;
};

export type LineData = Partial<typeof defaultStyle> &
  BaseItem & {
    points: Pos[];
    attitude: number[];
  };

export const interactiveToData: InteractiveTo<"line"> = ({
  info,
  preset = {},
  ...args
}) => {
  if (info.cur) {
    return interactiveFixData({
      ...args,
      info,
      data: {
        ...defaultStyle,
        ...getBaseItem(),
        ...preset,
        points: [],
        attitude: [1, 0, 0, 1, 0, 0],
      },
    });
  }
};

export const interactiveFixData: InteractiveFix<"line"> = ({ data, info }) => {
  const nv = [...info.consumed, info.cur!];
  data.points.length = nv.length
  for (let i = 0; i < nv.length; i++) {
    if (inRevise(data.points[i], nv[i])) {
      data.points[i] = nv[i]
    }
  }

  // data.points = [...info.consumed, info.cur!];
  return data;
};



export const matResponse = ({data, mat, increment}: MatResponseProps<'line'>) => {
  let transfrom: Transform
  const attitude = new Transform(data.attitude);
  if (!increment) {
    const inverMat = attitude.copy().invert();
    transfrom = mat.copy().multiply(inverMat);
  } else {
    transfrom = mat
  }

  data.points = data.points.map((v) => transfrom.point(v));
  data.attitude = transfrom.copy().multiply(attitude).m;
  return data;
}

export const getPredefine = (key: keyof LineData) => {
  if (key === 'strokeWidth') {
    return { proportion: true }
  }
}