cnhis-design-vue 3.3.1-beta.9 → 3.3.1-release.5

package/es/components/fabric-chart/src/hooks/useCumputedPoint.js

@@ -1 +1,151 @@
-import{format as e}from"date-fns";import{getTime as n,getRoundNumber as t,getFloorNumber as l}from"../utils/index.js";import{last as i}from"lodash-es";function u(l){const{xScaleList:u,xCellWidth:r,yCellHeight:c,left:o,vitalSignsOriginY:a,painOriginY:d,canvasWidth:s}=l;function f(e){let n=0;const t=o.yScaleValue.find((n=>n.type===e)),l=(null==t?void 0:t.list)||[];return l.length?(n=c/((l[1]-l[0])/t.spaceGridNumber),{yScaleCell:n,list:l}):{yScaleCell:n,list:l}}return{computedX:function(e,t=!1){const l=n(e),[r]=u,c=i(u);if(l<r.start)return 0;if(l>c.end)return s;const o=u.findIndex((e=>e.end>=l));if(o>-1){return u[o].center}},computedY:function(e,n){const{yScaleCell:t,list:l}=f(e),i=+n-Math.min(...l);return("pain"===e?d.endY:a.endY)-t*i},getXValue:function(n){const t=u.findIndex((e=>e.left+r>=n));if(t>-1){const l=u[t],i=n-l.left,r=l.scaleCell*i,c=l.start+r;return e(new Date(c),"yyyy-MM-dd HH:mm")}},getYValue:function(e,n){const{yScaleCell:l,list:i}=f(e),u=i.length?Math.min(...i):0,r="pain"===e?d.endY:a.endY;return t((r-n)/l+u,"temperature"===e?10:1)}}}function r(t){const{xAxis:i,originX:u,originY:r,xCellWidth:c,endY:o,timeXCell:a,startTime:d,scaleValues:s}=t;return{computedX:function(e){return(n(e)-d)/a+u},computedY:function(e,n,l){const[i]=n;return o-(+l-i)*t[`${e}YCell`]},getXValue:function(n){return e(new Date((n-u)*a+d),"yyyy-MM-dd HH:mm")},getYValue:function(e,n){const i=s.find((n=>[n.key,n.type||""].includes(e))),[u]=(null==i?void 0:i.range)||[0],r=(o-n)/t[`${e}YCell`]+u;return l(r)}}}function c(e){const{config:n,xCellWidth:t,yCellHeight:i}=e,{hz:u,mainXCellValue:r,valueUnit:c,mainYCellValue:o}=n;return{computedX:function(e){return e/u/r*t},computedY:function(e){return("uv"===c?.001*e:"v"===c?1e3*e:e)/o*i},getXValue:function(e){return l(r/t*e)},getYValue:function(e){return l(o/i*e)}}}export{r as useBirthProcessCumputedPoint,u as useCumputedPoint,c as useElectrocardiogramCumputedPoint};
+import { format } from 'date-fns';
+import { getTime, getRoundNumber, getFloorNumber } from '../utils/index.js';
+import { last } from 'lodash-es';
+
+function useCumputedPoint(propItems) {
+  const {
+    xScaleList,
+    xCellWidth,
+    yCellHeight,
+    left,
+    vitalSignsOriginY,
+    painOriginY,
+    canvasWidth
+  } = propItems;
+  function computedYCell(type) {
+    let yScaleCell = 0;
+    const item = left.yScaleValue.find((v) => v.type === type);
+    const list = (item == null ? void 0 : item.list) || [];
+    if (!list.length)
+      return {
+        yScaleCell,
+        list
+      };
+    yScaleCell = yCellHeight / ((list[1] - list[0]) / item.spaceGridNumber);
+    return {
+      yScaleCell,
+      list
+    };
+  }
+  function computedX(value, setAllCenter = false) {
+    const time = getTime(value);
+    const [minScale] = xScaleList;
+    const maxScale = last(xScaleList);
+    if (time < minScale.start)
+      return 0;
+    if (time > maxScale.end)
+      return canvasWidth;
+    const index = xScaleList.findIndex((v) => v.end >= time);
+    if (index > -1) {
+      const item = xScaleList[index];
+      return item.center;
+    }
+  }
+  function computedY(type, value) {
+    const {
+      yScaleCell,
+      list
+    } = computedYCell(type);
+    const yCellUnit = +value - Math.min(...list);
+    const newEndY = type === "pain" ? painOriginY.endY : vitalSignsOriginY.endY;
+    return newEndY - yScaleCell * yCellUnit;
+  }
+  function getXValue(pointX) {
+    const index = xScaleList.findIndex((v) => v.left + xCellWidth >= pointX);
+    if (index > -1) {
+      const item = xScaleList[index];
+      const residueX = pointX - item.left;
+      const residueTime = item.scaleCell * residueX;
+      const time = item.start + residueTime;
+      return format(new Date(time), "yyyy-MM-dd HH:mm");
+    }
+  }
+  function getYValue(type, pointY) {
+    const {
+      yScaleCell,
+      list
+    } = computedYCell(type);
+    const minVal = list.length ? Math.min(...list) : 0;
+    const newEndY = type === "pain" ? painOriginY.endY : vitalSignsOriginY.endY;
+    const y = (newEndY - pointY) / yScaleCell + minVal;
+    const decimal = type === "temperature" ? 10 : 1;
+    return getRoundNumber(y, decimal);
+  }
+  return {
+    computedX,
+    computedY,
+    getXValue,
+    getYValue
+  };
+}
+function useBirthProcessCumputedPoint(propItems) {
+  const {
+    xAxis,
+    originX,
+    originY,
+    xCellWidth,
+    endY,
+    timeXCell,
+    startTime,
+    scaleValues
+  } = propItems;
+  function computedX(value) {
+    const time = getTime(value);
+    return (time - startTime) / timeXCell + originX;
+  }
+  function computedY(key, range, value) {
+    const [minValue] = range;
+    return endY - (+value - minValue) * propItems[`${key}YCell`];
+  }
+  function getXValue(pointX) {
+    const time = (pointX - originX) * timeXCell + startTime;
+    return format(new Date(time), "yyyy-MM-dd HH:mm");
+  }
+  function getYValue(key, pointY) {
+    const item = scaleValues.find((item2) => [item2.key, item2.type || ""].includes(key));
+    const [minValue] = (item == null ? void 0 : item.range) || [0];
+    const y = (endY - pointY) / propItems[`${key}YCell`] + minValue;
+    return getFloorNumber(y);
+  }
+  return {
+    computedX,
+    computedY,
+    getXValue,
+    getYValue
+  };
+}
+function useElectrocardiogramCumputedPoint(propItems) {
+  const {
+    config,
+    xCellWidth,
+    yCellHeight
+  } = propItems;
+  const {
+    hz,
+    mainXCellValue,
+    valueUnit,
+    mainYCellValue
+  } = config;
+  function computedX(index) {
+    const currentSecond = index / hz;
+    return currentSecond / mainXCellValue * xCellWidth;
+  }
+  function computedY(value) {
+    const currentMV = valueUnit === "uv" ? value * 1e-3 : valueUnit === "v" ? value * 1e3 : value;
+    return currentMV / mainYCellValue * yCellHeight;
+  }
+  function getXValue(pointX) {
+    return getFloorNumber(mainXCellValue / xCellWidth * pointX);
+  }
+  function getYValue(pointY) {
+    return getFloorNumber(mainYCellValue / yCellHeight * pointY);
+  }
+  return {
+    computedX,
+    computedY,
+    getXValue,
+    getYValue
+  };
+}
+
+export { useBirthProcessCumputedPoint, useCumputedPoint, useElectrocardiogramCumputedPoint };

package/es/components/fabric-chart/src/hooks/useDraw.js

@@ -1 +1,370 @@
-import{fabric as e}from"../../../../shared/utils/fabricjs/index.js";import{omit as t}from"lodash-es";const n={evented:!1,selectable:!1},r={stroke:"#000",strokeWidth:1,strokeUniform:!0,...n},i={stroke:"#000",strokeWidth:1,strokeDashArray:[0,0],strokeUniform:!0,...n},o={fill:"transparent",stroke:"#000",strokeWidth:1,originX:"center",originY:"center",objectCaching:!1,strokeUniform:!0,...n},c={fontFamily:"微软雅黑",fontSize:12,fill:"#000",centeredRotation:!0,originX:"center",originY:"center",lineHeight:1,objectCaching:!1,strokeUniform:!0,...n};function l(t,n){return new e.Line(t,{...i,...n})}function s([t,n],r){return new e.Text(String(r.value),{...c,left:t,top:n,...r})}function a([t,r,i],o,c="down"){const a=l([t,r,t,i],{strokeWidth:o.strokeWidth||1,stroke:o.fill||o.stroke}),g=s([t+.5,"up"===c?i-3:i+3],{value:"v",originX:"center",originY:"bottom",fontSize:16,angle:"up"===c?180:0,objectCaching:!1,...o});return new e.Group([a,g],{...n,originX:"center",originY:"top",objectCaching:!1})}function g(t,r,i,l=!1){const s=new e.Rect({...o,...t,...l?{}:{stroke:"transparent"}}),{value:a="标题",textAlign:g="center",verticalAlign:u="center"}=r,f=t.width/2,h=t.height/2,d=new e.Text(String(a),{...c,...r,..."left"==g||"right"==g?{originX:g,left:"left"==g?-f:f}:{},..."top"==u||"bottom"==u?{originY:u,top:"top"==u?-h:h}:{}});return new e.Group([s,d],{objectCaching:!1,...n,...i})}function u(t){return new e.Circle({objectCaching:!1,strokeWidth:t.strokeWidth||1,stroke:t.stroke||"red",radius:t.radius||5,fill:"#fff"})}function f(n="circle",r){var i;const o={originX:"center",originY:"center",hasControls:!1,hasBorders:!1,hoverCursor:"pointer",objectCaching:!1,scale:1,...r},c=r.radius?(r.radius||5)+(r.strokeWidth||1):null!=(i=r.width)?i:0;switch(n){case"rect":return new e.Rect({width:10,height:10,strokeWidth:1,fill:"#fff",...o});case"triangle":return new e.Triangle({width:20,height:20,strokeWidth:1,...o});case"circle":return new e.Circle({objectCaching:!1,strokeWidth:1,radius:5,...o});case"image":return new e.Image(r.element,o);case"yemai":{const t=()=>{const t=2*c,n={stroke:r.strokeX||"blue",strokeWidth:r.strokeWidthX||1,originX:"center",originY:"center"},i=new e.Line([0,c,t,c],n),o=new e.Line([c,0,c,t],n);return new e.Group([i,o])};return new e.Group([u(r),t()],o)}case"koumai":{const t=new e.Circle({objectCaching:!1,radius:r.radiusCircle||2,fill:r.fillCircle||"#000",originX:"center",originY:"center",left:c-.5,top:c-.5});return new e.Group([u(r),t],o)}case"circleAndText":{const t=new e.Text(String(r.text),{fontFamily:"微软雅黑",fontSize:o.fontSize||12,originX:"center",originY:"center",fill:r.textFill||r.stroke,left:c-.5,top:c-1,fontWeight:r.fontWeight||500,objectCaching:!1});return new e.Group([u(r),t],o)}case"circleAndCircle":return f("koumai",r);case"cg":{const{left:t,radius:n,top:i,stroke:c="#000"}=r,l=new e.Line([0,n,2*n,n],{stroke:c,objectCaching:!1}),s=n+1,a=Math.round(n/2),g=new e.Polyline([{x:s,y:a},{x:2*n,y:n},{x:s,y:n+a}],{stroke:c,fill:"transparent",objectCaching:!1});return new e.Group([u(r),l,g],{...o,left:Math.round(t),top:Math.round(i)})}case"qgcg":{const{radius:t,stroke:n="#000"}=r,i=new e.Line([0,t,4*t,t],{stroke:n,objectCaching:!1,left:-t});return new e.Group([u(r),i],o)}case"zrhz":{const{radius:t,stroke:n="#000"}=r,i=t/3*2,c=new e.Circle({objectCaching:!1,radius:i,fill:"#fff",left:t-i,top:t-i,stroke:n}),l=new e.Line([0,t,4*t,t],{stroke:n,objectCaching:!1,left:-t});return new e.Group([u(r),c,l],o)}case"jxtq":{const{width:n=14,height:i=8}=r;return new e.Polyline([{x:0,y:i},{x:n/5,y:0},{x:n/5*2,y:i},{x:n/5*3,y:0},{x:n/5*4,y:i},{x:n/5*5,y:0}],{fill:"transparent",...t(o,["width","height"])})}case"plus":{const n=t(o,["big","small"]),{big:i,small:c}=r,l=f(i.type,{fill:"#fff",...n,...i.style}),s=f(c.type,{...n,...c.style});return new e.Group([l,s],n)}default:return r&&Reflect.deleteProperty(r,"stroke"),new e.Text(String(n),{fontFamily:"微软雅黑",scale:1,fontSize:14,fill:"#000",...o})}}function h(t,r,i,o="horizontal"){const c=new e.Text(String(t),{...n,objectCaching:!1,...r.titleStyle||{},originX:"left",originY:"bottom",lineHeight:1,fontSize:12,...i.text}),{top:l,topY:s,left:a,leftX:g}=i.icon,u=null!=l?l:"horizontal"===o?s-(c.height||30)/2-1:s+c.height+3,h=null!=a?a:g+c.width+5;return{text:c,icon:f(r.type,{...r.pointAttr,originY:"center",originX:"left",originLeft:h,originTop:u,...i.icon,origin:{title:r.title,unit:r.unit,type:r.bigType,dataIndex:r.dataIndex,key:r.key,isMenu:!0,...i.icon.origin},left:h,top:u})}}export{r as defaultBorderStyle,i as defaultLineStyle,o as defaultRectStyle,n as defaultStyle,c as defaultTextStyle,a as drawArrow,l as drawLine,f as drawPoint,s as drawText,h as drawTextAndIconGroup,g as drawTextGroup};
+import { fabric } from '../../../../shared/utils/fabricjs/index.js';
+import { omit } from 'lodash-es';
+
+const defaultStyle = {
+  evented: false,
+  selectable: false
+};
+const defaultBorderStyle = {
+  stroke: "#000",
+  strokeWidth: 1,
+  strokeUniform: true,
+  ...defaultStyle
+};
+const defaultLineStyle = {
+  stroke: "#000",
+  strokeWidth: 1,
+  strokeDashArray: [0, 0],
+  strokeUniform: true,
+  ...defaultStyle
+};
+const defaultRectStyle = {
+  fill: "transparent",
+  stroke: "#000",
+  strokeWidth: 1,
+  originX: "center",
+  originY: "center",
+  objectCaching: false,
+  strokeUniform: true,
+  ...defaultStyle
+};
+const defaultTextStyle = {
+  fontFamily: "\u5FAE\u8F6F\u96C5\u9ED1",
+  fontSize: 12,
+  fill: "#000",
+  centeredRotation: true,
+  originX: "center",
+  originY: "center",
+  lineHeight: 1,
+  objectCaching: false,
+  strokeUniform: true,
+  ...defaultStyle
+};
+function drawLine(points, style) {
+  return new fabric.Line(points, {
+    ...defaultLineStyle,
+    ...style
+  });
+}
+function drawText([x, y], style) {
+  const text = new fabric.Text(String(style.value), {
+    ...defaultTextStyle,
+    left: x,
+    top: y,
+    ...style
+  });
+  return text;
+}
+function drawArrow([x, y1, y2], style, type = "down") {
+  const arrowLine = drawLine([x, y1, x, y2], {
+    strokeWidth: style.strokeWidth || 1,
+    stroke: style.fill || style.stroke
+  });
+  const arrow = drawText([x + 0.5, type === "up" ? y2 - 3 : y2 + 3], {
+    value: "v",
+    originX: "center",
+    originY: "bottom",
+    fontSize: 16,
+    angle: type === "up" ? 180 : 0,
+    objectCaching: false,
+    ...style
+  });
+  const arrowGroup = new fabric.Group([arrowLine, arrow], {
+    ...defaultStyle,
+    originX: "center",
+    originY: "top",
+    objectCaching: false
+  });
+  return arrowGroup;
+}
+function drawTextGroup(rectStyle, fontStyle, groupStyle, showRect = false) {
+  const rect = new fabric.Rect({
+    ...defaultRectStyle,
+    ...rectStyle,
+    ...!showRect ? {
+      stroke: "transparent"
+    } : {}
+  });
+  const {
+    value = "\u6807\u9898",
+    textAlign = "center",
+    verticalAlign = "center"
+  } = fontStyle;
+  const textLeft = rectStyle.width / 2;
+  const textTop = rectStyle.height / 2;
+  const texts = new fabric.Text(String(value), {
+    ...defaultTextStyle,
+    ...fontStyle,
+    ...textAlign == "left" || textAlign == "right" ? {
+      originX: textAlign,
+      left: textAlign == "left" ? -textLeft : textLeft
+    } : {},
+    ...verticalAlign == "top" || verticalAlign == "bottom" ? {
+      originY: verticalAlign,
+      top: verticalAlign == "top" ? -textTop : textTop
+    } : {}
+  });
+  return new fabric.Group([rect, texts], {
+    objectCaching: false,
+    ...defaultStyle,
+    ...groupStyle
+  });
+}
+function createCircleBorder(style) {
+  return new fabric.Circle({
+    objectCaching: false,
+    strokeWidth: style.strokeWidth || 1,
+    stroke: style.stroke || "red",
+    radius: style.radius || 5,
+    fill: "#fff"
+  });
+}
+function drawPoint(type = "circle", style) {
+  var _a;
+  const newStyle = {
+    originX: "center",
+    originY: "center",
+    hasControls: false,
+    hasBorders: false,
+    hoverCursor: "pointer",
+    objectCaching: false,
+    scale: 1,
+    ...style
+  };
+  const halfWidth = style.radius ? (style.radius || 5) + (style.strokeWidth || 1) : (_a = style.width) != null ? _a : 0;
+  switch (type) {
+    case "rect":
+      return new fabric.Rect({
+        width: 10,
+        height: 10,
+        strokeWidth: 1,
+        fill: "#fff",
+        ...newStyle
+      });
+    case "triangle":
+      return new fabric.Triangle({
+        width: 20,
+        height: 20,
+        strokeWidth: 1,
+        ...newStyle
+      });
+    case "circle":
+      return new fabric.Circle({
+        objectCaching: false,
+        strokeWidth: 1,
+        radius: 5,
+        ...newStyle
+      });
+    case "image":
+      return new fabric.Image(style.element, newStyle);
+    case "yemai": {
+      const createAdd = () => {
+        const width = halfWidth * 2;
+        const subLineStyle = {
+          stroke: style.strokeX || "blue",
+          strokeWidth: style.strokeWidthX || 1,
+          originX: "center",
+          originY: "center"
+        };
+        const line1 = new fabric.Line([0, halfWidth, width, halfWidth], subLineStyle);
+        const line2 = new fabric.Line([halfWidth, 0, halfWidth, width], subLineStyle);
+        return new fabric.Group([line1, line2]);
+      };
+      return new fabric.Group([createCircleBorder(style), createAdd()], newStyle);
+    }
+    case "koumai": {
+      const circle = new fabric.Circle({
+        objectCaching: false,
+        radius: style.radiusCircle || 2,
+        fill: style.fillCircle || "#000",
+        originX: "center",
+        originY: "center",
+        left: halfWidth - 0.5,
+        top: halfWidth - 0.5
+      });
+      return new fabric.Group([createCircleBorder(style), circle], newStyle);
+    }
+    case "circleAndText": {
+      const text = new fabric.Text(String(style.text), {
+        fontFamily: "\u5FAE\u8F6F\u96C5\u9ED1",
+        fontSize: newStyle.fontSize || 12,
+        originX: "center",
+        originY: "center",
+        fill: style.textFill || style.stroke,
+        left: halfWidth - 0.5,
+        top: halfWidth - 1,
+        fontWeight: style.fontWeight || 500,
+        objectCaching: false
+      });
+      return new fabric.Group([createCircleBorder(style), text], newStyle);
+    }
+    case "circleAndCircle": {
+      return drawPoint("koumai", style);
+    }
+    case "cg": {
+      const {
+        left,
+        radius,
+        top,
+        stroke = "#000"
+      } = style;
+      const line = new fabric.Line([0, radius, radius * 2, radius], {
+        stroke,
+        objectCaching: false
+      });
+      const x = radius + 1;
+      const radiusHalf = Math.round(radius / 2);
+      const arrow = new fabric.Polyline([{
+        x,
+        y: radiusHalf
+      }, {
+        x: radius * 2,
+        y: radius
+      }, {
+        x,
+        y: radius + radiusHalf
+      }], {
+        stroke,
+        fill: "transparent",
+        objectCaching: false
+      });
+      return new fabric.Group([createCircleBorder(style), line, arrow], {
+        ...newStyle,
+        left: Math.round(left),
+        top: Math.round(top)
+      });
+    }
+    case "qgcg": {
+      const {
+        radius,
+        stroke = "#000"
+      } = style;
+      const line = new fabric.Line([0, radius, radius * 4, radius], {
+        stroke,
+        objectCaching: false,
+        left: -radius
+      });
+      return new fabric.Group([createCircleBorder(style), line], newStyle);
+    }
+    case "zrhz": {
+      const {
+        radius,
+        stroke = "#000"
+      } = style;
+      const smallRadius = radius / 3 * 2;
+      const circle = new fabric.Circle({
+        objectCaching: false,
+        radius: smallRadius,
+        fill: "#fff",
+        left: radius - smallRadius,
+        top: radius - smallRadius,
+        stroke
+      });
+      const line = new fabric.Line([0, radius, radius * 4, radius], {
+        stroke,
+        objectCaching: false,
+        left: -radius
+      });
+      return new fabric.Group([createCircleBorder(style), circle, line], newStyle);
+    }
+    case "jxtq": {
+      const {
+        width = 14,
+        height = 8
+      } = style;
+      return new fabric.Polyline([{
+        x: 0,
+        y: height
+      }, {
+        x: width / 5,
+        y: 0
+      }, {
+        x: width / 5 * 2,
+        y: height
+      }, {
+        x: width / 5 * 3,
+        y: 0
+      }, {
+        x: width / 5 * 4,
+        y: height
+      }, {
+        x: width / 5 * 5,
+        y: 0
+      }], {
+        fill: "transparent",
+        ...omit(newStyle, ["width", "height"])
+      });
+    }
+    case "plus": {
+      const _newStyle = omit(newStyle, ["big", "small"]);
+      const {
+        big,
+        small
+      } = style;
+      const bigIcon = drawPoint(big.type, {
+        fill: "#fff",
+        ..._newStyle,
+        ...big.style
+      });
+      const smallIcon = drawPoint(small.type, {
+        ..._newStyle,
+        ...small.style
+      });
+      return new fabric.Group([bigIcon, smallIcon], _newStyle);
+    }
+    default:
+      style && Reflect.deleteProperty(style, "stroke");
+      return new fabric.Text(String(type), {
+        fontFamily: "\u5FAE\u8F6F\u96C5\u9ED1",
+        scale: 1,
+        fontSize: 14,
+        fill: "#000",
+        ...newStyle
+      });
+  }
+}
+function drawTextAndIconGroup(title, item, option, direction = "horizontal") {
+  const text = new fabric.Text(String(title), {
+    ...defaultStyle,
+    objectCaching: false,
+    ...item.titleStyle || {},
+    originX: "left",
+    originY: "bottom",
+    lineHeight: 1,
+    fontSize: 12,
+    ...option.text
+  });
+  const {
+    top,
+    topY,
+    left,
+    leftX
+  } = option.icon;
+  const newTop = top != null ? top : direction === "horizontal" ? topY - (text.height || 30) / 2 - 1 : topY + text.height + 3;
+  const newLeft = left != null ? left : leftX + text.width + 5;
+  const icon = drawPoint(item.type, {
+    ...item.pointAttr,
+    originY: "center",
+    originX: "left",
+    originLeft: newLeft,
+    originTop: newTop,
+    ...option.icon,
+    origin: {
+      title: item.title,
+      unit: item.unit,
+      type: item.bigType,
+      dataIndex: item.dataIndex,
+      key: item.key,
+      isMenu: true,
+      ...option.icon.origin
+    },
+    left: newLeft,
+    top: newTop
+  });
+  return {
+    text,
+    icon
+  };
+}
+
+export { defaultBorderStyle, defaultLineStyle, defaultRectStyle, defaultStyle, defaultTextStyle, drawArrow, drawLine, drawPoint, drawText, drawTextAndIconGroup, drawTextGroup };

package/es/components/fabric-chart/src/hooks/useEvent.js

@@ -1 +1,134 @@
-import{fabric as e}from"../../../../shared/utils/fabricjs/index.js";import{useEventBus as t}from"@vueuse/core";const n=t("selection");function o(t,n,o){const{originY:l,originX:i,endX:s,endY:r,iconsWidth:d,selectionStyle:h,topList:c}=n;function u(n,o){const{left:l,top:i,width:s,height:r}=n,d=new e.Rect({key:o,left:null!=l?l:0,top:null!=i?i:0,width:s,height:r,stroke:"transparent",fill:"transparent",lockMovementX:!0,lockMovementY:!0,transparentCorners:!1,hasControls:!1,...h,strokeWidth:0});return t.value.add(d),d}let f=[];function a(e){k();p(null==f?void 0:f.find((t=>t.key===e)))}function k(){f.forEach((e=>{e.set("strokeWidth",0),e.key.endsWith("All")&&e.sendToBack()}))}function p(e){var n;t.value.discardActiveObject(),!(null==e?void 0:e.key.includes("grid"))&&(null==e||e.bringToFront()),null==e||e.set("strokeWidth",null!=(n=h.strokeWidth)?n:2)}return("boolean"!=typeof(null==h?void 0:h.evented)||(null==h?void 0:h.evented))&&(f=function(){const e=[];e.push(u({left:d,top:l+1,width:i-d,height:r-l-3},"left"));let t=0;return c.forEach(((o,l)=>{l>0&&(t+=n[`${c[l-1].key}Height`]);const r={top:t+1,height:n[`${o.key}Height`]-1};e.push(u({left:d,width:s-d,...r},o.key+"All")),e.push(u({left:d,width:i-d,...r},o.key+"Title")),e.push(u({left:i,width:s-i,...r},o.key))})),e.push(u({left:i,top:l+1,width:s-i,height:r-l-3},"grid")),e.forEach((e=>{e.key.endsWith("All")?(e.sendToBack(),e.on("mouseup",(t=>{const{button:n,pointer:l}=t;if(1==n){const t=e.key.replace("All",""),n=(null==l?void 0:l.x)&&(null==l?void 0:l.x)<=i?t+"Title":t;e.sendToBack(),a(n),o("select",n)}}))):e.on("mousedown",(()=>{k(),p(e),o("select",e.key)}))})),e}()),{select:a}}export{n as bus,o as useCanvasEvent};
+import { fabric } from '../../../../shared/utils/fabricjs/index.js';
+import { useEventBus } from '@vueuse/core';
+
+const bus = useEventBus("selection");
+function useCanvasEvent(canvas, propItems, emits) {
+  const {
+    originY,
+    originX,
+    endX,
+    endY,
+    iconsWidth,
+    selectionStyle,
+    topList
+  } = propItems;
+  function drawRect(options, key) {
+    const {
+      left,
+      top,
+      width,
+      height
+    } = options;
+    const rect = new fabric.Rect({
+      key,
+      left: left != null ? left : 0,
+      top: top != null ? top : 0,
+      width,
+      height,
+      stroke: "transparent",
+      fill: "transparent",
+      lockMovementX: true,
+      lockMovementY: true,
+      transparentCorners: false,
+      hasControls: false,
+      ...selectionStyle,
+      strokeWidth: 0
+    });
+    canvas.value.add(rect);
+    return rect;
+  }
+  let selections = [];
+  function initSelection() {
+    const selections2 = [];
+    selections2.push(drawRect({
+      left: iconsWidth,
+      top: originY + 1,
+      width: originX - iconsWidth,
+      height: endY - originY - 3
+    }, "left"));
+    let topY = 0;
+    topList.forEach((item, index) => {
+      if (index > 0) {
+        topY += propItems[`${topList[index - 1].key}Height`];
+      }
+      const commonOptions = {
+        top: topY + 1,
+        height: propItems[`${item.key}Height`] - 1
+      };
+      selections2.push(drawRect({
+        left: iconsWidth,
+        width: endX - iconsWidth,
+        ...commonOptions
+      }, item.key + "All"));
+      selections2.push(drawRect({
+        left: iconsWidth,
+        width: originX - iconsWidth,
+        ...commonOptions
+      }, item.key + "Title"));
+      selections2.push(drawRect({
+        left: originX,
+        width: endX - originX,
+        ...commonOptions
+      }, item.key));
+    });
+    selections2.push(drawRect({
+      left: originX,
+      top: originY + 1,
+      width: endX - originX,
+      height: endY - originY - 3
+    }, "grid"));
+    selections2.forEach((obj) => {
+      if (obj.key.endsWith("All")) {
+        obj.sendToBack();
+        obj.on("mouseup", (event) => {
+          const {
+            button,
+            pointer
+          } = event;
+          if (button == 1) {
+            const _key = obj.key.replace("All", "");
+            const key = (pointer == null ? void 0 : pointer.x) && (pointer == null ? void 0 : pointer.x) <= originX ? _key + "Title" : _key;
+            obj.sendToBack();
+            select(key);
+            emits("select", key);
+          }
+        });
+      } else {
+        obj.on("mousedown", () => {
+          resetStrokeWidth();
+          setActiveObj(obj);
+          emits("select", obj.key);
+        });
+      }
+    });
+    return selections2;
+  }
+  function select(key) {
+    resetStrokeWidth();
+    const obj = selections == null ? void 0 : selections.find((obj2) => obj2.key === key);
+    setActiveObj(obj);
+  }
+  function init() {
+    if (typeof (selectionStyle == null ? void 0 : selectionStyle.evented) === "boolean" && !(selectionStyle == null ? void 0 : selectionStyle.evented))
+      return;
+    selections = initSelection();
+  }
+  function resetStrokeWidth() {
+    selections.forEach((obj) => {
+      obj.set("strokeWidth", 0);
+      obj.key.endsWith("All") && obj.sendToBack();
+    });
+  }
+  function setActiveObj(obj) {
+    var _a;
+    canvas.value.discardActiveObject();
+    !(obj == null ? void 0 : obj.key.includes("grid")) && (obj == null ? void 0 : obj.bringToFront());
+    obj == null ? void 0 : obj.set("strokeWidth", (_a = selectionStyle.strokeWidth) != null ? _a : 2);
+  }
+  init();
+  return {
+    select
+  };
+}
+
+export { bus, useCanvasEvent };