cnhis-design-vue 3.3.1-beta.4 → 3.3.1-beta.48

package/es/components/fabric-chart/src/hooks/birthProcess/useBirthProcess.js

@@ -1 +1,914 @@
-import{fabric as e}from"../../../../../shared/utils/fabricjs/index.js";import{drawLine as t,drawArrow as o,drawPoint as i,defaultStyle as n,drawText as r,defaultTextStyle as l,drawTextAndIconGroup as s,defaultRectStyle as a}from"../useDraw.js";import{useGrid as c}from"../useGrid.js";import{useBirthProcessCumputedPoint as u}from"../useCumputedPoint.js";import"../useEvent.js";import"../useShadow.js";import{getScaleInfo as d,drawScaleNumber as h,drawScaleLine as f}from"../useScaleColumn.js";import{useCommon as p}from"../useCommon.js";import"vue";import{getIndex as g,isEffectiveNode as v,getTime as m,getScaleNumberList as y}from"../../utils/index.js";import{cloneDeep as b,isString as j,last as k,range as w}from"lodash-es";import"../../constants/index.js";import"@vueuse/shared";import{format as x}from"date-fns";import"naive-ui";import"../surgicalAnesthesia/useTop.js";import"@vueuse/core";import"../surgicalAnesthesia/useOther.js";import"../../../../../shared/utils/index.js";function S(S,C,O,Y,A){const{computedX:E,computedY:P,getXValue:X,getYValue:L}=u(C),{getEqualXTypes:M,handleAddPrevent:I,isGridLimit:T,setPrevAndNextPoint:H,getPointEventProps:D}=p(S,O,C),{xAxis:B,grid:G,originX:N,originY:W,xCellWidth:V,endY:F,startTime:R,leftAddAreaWidth:$,leftScales:_,rightScales:q,yCellHeight:z,endX:J,scaleValues:K,canvasWidth:Q,borderStyle:U,rightAddAreaWidth:Z,event:ee,originYCervix:te,other:oe,canvasHeight:ie,scalebarBorder:ne,padding:re}=C,le=b(K),se=new Set;function ae(){le.filter((({showData:e=!0})=>e)).forEach(((e,s)=>{var a;const c=[],u=[],d=[],{pointAttr:h={},lineAttr:f={},title:p="",key:g,type:v="circle",childbirthStyle:m={}}=e;function y(r,l,s,a){if(l[s]){const{type:c="circle",style:u={},arrowStyle:h={}}=e[s+"Style"],p=E(l[s]),g=t([...r,p,r[1]],{...f,strokeDashArray:[4,2],...n}),v="dystocia"===s&&r[1]-W>=z?r[1]-z:r[1],m=i(c,{left:p,top:v,...u,...n}),y=v+m.height/2,b="dystocia"===s?o([p,y+z,y],f,"up"):null;g&&(d.push(g),a[s+"Line"]={obj:g,type:"line",left:p-r[0]}),m&&(d.push(m),a[s]={obj:m,left:p-r[0]}),b&&(d.push(b),a[s+"Arrow"]={obj:b,left:p-r[0],moveHide:!0})}}null==(a=e.data)||a.forEach(((a,b)=>{!function(a,b,k){let w,C;const A=e.data[k+1],E=fe(A,e);if(a&&E&&!b.breakpoint)C=t([...a,...E],{...f});else if(a&&!E&&!b.breakpoint){const o=fe(A,e);C=o?t([...a,...o],{...f}):null}const P={};if(["fetalPresentation","cervix"].includes(g)){let e,t;if(b.childbirth){const{type:s="arrow",style:c={},textStyle:u={}}=m;if("arrow"===s){const t=a[1]+z;e=o([a[0],a[1],t],c),e._bottomY=t}else e=i(s,{left:a[0],top:a[1],...c,...n,hoverCursor:"default"}),e._bottomY=a[1]+e.height/2;t=j(b.childbirth)?r([a[0]+V/2,a[1]+z/2],{value:String(b.childbirth),...l,originX:"left",originY:"center",...u}):null,e&&(d.push(e),Object.assign(P,{childbirthIcon:{obj:e,type:s}})),t&&(d.push(t),Object.assign(P,{childbirthText:{obj:t,left:V/2,top:z/2}}))}}if(b.mark){const{type:e="triangle",style:t={}}=b.markStyle||{},o=P.childbirthIcon?P.childbirthIcon.obj._bottomY+5:a[1]+10,s=j(b.mark)?r([a[0],o],{value:String(b.mark),...l,...t,originY:"top"}):i(e,{left:a[0],top:o,...t,...n,originY:"top",hoverCursor:"default"});d.push(s),Object.assign(P,{markObj:{obj:s,top:o-a[1]}})}"fetalPresentation"===g&&(y(a,b,"surgicalDelivery",P),y(a,b,"dystocia",P));const M=u[k-1],I={origin:{data:b,title:p,key:g||"",dataIndex:s,index:k},leftLine:M,rightLine:C,otherObj:P,...h,...D()};a&&(M||(I.leftLine=null),w=i(v,{left:a[0],top:a[1],...I}));C&&u.push(C),w&&(!function(e){ee.hovered&&(e.on("mouseover",(()=>{he(e,"hover")})),e.on("mouseout",(()=>{Y.show=!1})));if(e.lockMovementX&&e.lockMovementY)return;e.on("moving",(()=>{de(e),function(e){var t,o;null==(t=e.leftLine)||t.setCoords().set({x2:e.left,y2:e.top}),null==(o=e.rightLine)||o.setCoords().set({x1:e.left,y1:e.top}),Object.values(e.otherObj).forEach((t=>{const{obj:o,top:i=0,left:n=0,type:r="",moveHide:l}=t||{};o&&("line"===r?o.setCoords().set({x1:e.left,y1:e.top,x2:e.left+n,y2:e.top}):o.setCoords().set({left:e.left+n,top:e.top+i}),l&&(S.value.remove(o),delete e.otherObj.obj))}))}(e),ee.hovered&&he(e)})),e.on("mouseup",(t=>{if(Y.show=!1,1===t.button){const{key:t}=e.origin,o={...e.origin,data:{...e.origin.data,time:X(e.left),value:L(t,e.top)}};["surgicalDelivery","dystocia"].some((t=>{var i;(null==(i=e.otherObj[t])?void 0:i.obj)&&(o.data[t]=x(new Date(X(e.left+e.otherObj[t].left)),"yyyy-MM-dd HH:mm"))})),S.value.discardActiveObject(),O("change",o),ce(o,"change")}}))}(w),c.push(w),se.add(w))}(fe(a,e),a,b)})),H(c),S.value.add(...u,...d,...c),c.forEach((e=>{null==e||e.bringToFront();const{childbirthIcon:t}=e.otherObj||{};(null==t?void 0:t.obj)&&"arrow"!==(null==t?void 0:t.type)&&t.obj.bringToFront()}))}))}function ce(e,t="add"){const{dataIndex:o,data:i,index:n,key:r}=e,l=le.find((e=>e.key===r));switch(t){case"remove":l.data.splice(n,1);break;case"change":l.data[n]=i;break;default:{const e=g(i.time,l.data);l.data.splice(e,0,i);break}}ue()}function ue(){var e;se.size&&(null==(e=S.value)||e.remove(...function(e){const t=[];return e.forEach((e=>{e&&t.push(e),(null==e?void 0:e.leftLine)&&t.push(null==e?void 0:e.leftLine),(null==e?void 0:e.rightLine)&&t.push(null==e?void 0:e.rightLine),Object.values((null==e?void 0:e.otherObj)||{}).forEach((e=>{(null==e?void 0:e.obj)&&t.push(null==e?void 0:e.obj)}))})),t}([...se]))),se.clear(),ae()}function de(e){const t=e.prevPoint?e.prevPoint.left:N,o=e.nextPoint?e.nextPoint.left:J;e.setCoords(),["cervix","fetalPresentation"].includes(e.origin.key)&&e.top<te&&e.set("top",te),e.top<W&&e.set("top",W),e.top>F&&e.set("top",F),e.left<t&&e.set("left",t),e.left>o&&e.set("left",o)}function he(e,t="moving"){const{title:o,key:i,data:n}=e.origin;Y.point={x:e.left,y:e.top},Y.list=[`${o} ${"hover"===t?n.value:L(i,e.top)}`,`时间 ${X(e.left).slice(-5)}`],Y.show=!0}function fe(e,t){if(v(e)&&function(e){const t=R+864e5,o=m(e);return o>=R&&o<=t}(e.time)){const o=E(e.time),i=P(t.key,t.range,e.value);return[o,i<W?W:i>F?F:i]}}function pe(e,t){return e+1>t[1]?t[0]:e+1}return c(S,C),function(){const t=ne?{width:Q-$-Z-1,left:$}:{width:J-N-(q.length?0:1),left:N},o=new e.Rect({...U,height:F-re[0]-1,top:re[0],fill:"transparent",...t});S.value.add(o)}(),function(){function t(t,o="left"){let i="left"===o?$:J;t.forEach(((t,o)=>{const{range:s,spaceValue:c,width:u,title:p,titleStyle:g,key:v,position:m="center",spaceGridNumber:b=1,showNumber:j=!0,showMaxMinNumber:k=!0,showName:w=!0}=t,x=[],C=[],O=i+u/2,Y=y(s,c),A=Y.length,{lineXMain:E,lineXSub:P,textLeft:X}=d(m,i,u);Y.forEach(((e,o)=>{const i=F-o*z*b,n=0===o?F-8:o!==Y.length-1||!re[0]||te&&"FHR"!==v?i:W+8;!j||(0===o||o===A-1)&&!k||x.push(h(String(e),t,X,n)),C.push(...f(t,o,E,P,i,z,W,A,1))}));const L=[],M=ne?new e.Rect({...a,strokeWidth:.5,width:u,height:F-re[0],left:O,top:re[0]+(F-re[0])/2}):null;if(M&&L.push(M),w){const e=r([O,W-re[0]>0?W-z/2:z/2],{value:String(p),...l,...g});e&&L.push(e)}const I=new e.Group([...C,...x,...L],{objectCaching:!1,...n});S.value.add(I),I.sendToBack(),i+=u}))}t(_),t(q,"right")}(),function(){const{show:t,startTime:o,range:i=[0,23],position:s="top",style:a}=B.time,{show:c,range:u=[0,23],position:d,style:h={}}=B.processTime;if(t||c){const f=[],p=w(u[0],u[1]+1),g=[],v=[],m=z/2;for(let e=0;e<G.mainXCell;e++){if(t){const{textAlign:t="center"}=a,n=N+("center"===t?V/2:0),c=0===e&&"center"!==t?n+5:n,u=0===e?+o.slice(11,13):pe(k(f),i);f.push(u);const d="top"===s?W-m:F+m;g.push(r([c+e*V,d],{value:String(u),...l,...a})),e===G.mainXCell-1&&"center"!==t&&g.push(r([J-1,d],{value:String(pe(k(f),i)),...l,...a,originX:"center"!==t?"right":"center"}))}if(c&&e<=p.length){const{textAlign:t="center"}=h,o=N+("center"===t?V/2:0),i=0===e&&"center"!==t?o+5:o,n="top"===d?m:ie-m;v.push(r([i+e*V,n],{value:String(p[e]),...l,...h})),e===G.mainXCell-1&&"center"!==t&&v.push(r([J-1,n],{value:String(k(p)),...l,...a,originX:"center"!==t?"right":"center"}))}}const y=new e.Group([...g,...v],{objectCaching:!1,...n});S.value.add(y),S.value.sendToBack(y)}}(),function(){var e;const o=Object.values(oe),i=[],n={},r=le.find((e=>"cervix"===e.key&&e.show)),l=null==(e=null==r?void 0:r.data)?void 0:e.find((e=>3==+e.value));function s(e,t){const{key:o,range:i}=r||{},n=P(o,i,10),l=[0,t],s=[-t/e,0],a=[(F-n-t)/e,F-n],c=[J-N,e*(J-N)+t];let u=[],d=[];function h([o,i]){return Math.abs(i-e*o-t)<=1}function f([e,t]){const[o,i]=[...p([e,t])];return o>=N&&o<=J&&i>=n&&i<=F}function p([e,t]){return[N+e,F-t]}return h(l)&&f(l)&&(u=p(l)),h(s)&&f(s)&&(u=p(s)),h(a)&&f(a)&&(d=p(a)),h(c)&&f(c)&&(d=p(c)),[...u,...d]}o.forEach((e=>{if(!e.show)return;const{key:o}=e;switch(o){case"fetalPresentation":{const{range:n,show:r}=le.find((e=>e.key===o));if(r){const r=P(o,n,0);i.push(t([N,r,J,r],{...e}))}break}case"alert":if(l){const{key:o,range:a}=r||{},c=216e5,u={time:x(new Date(m(l.time)+c),"yyyy-MM-dd HH:mm"),value:10},[d,h]=[E(l.time)-N,F-P(o,a,l.value)],[f,p]=[E(u.time)-N,F-P(o,a,u.value)],g=(p-h)/(f-d),v=h-d*g,y=s(g,v);y.length>0&&(i.push(t(y,{...e})),Object.assign(n,{k:g,b:v}))}break;case"handling":if(l){const{k:o,b:r}=n,a=144e5,c=s(o,r-(E(x(new Date(m(l.time)+a),"yyyy-MM-dd HH:mm"))-E(l.time))*o);c.length>0&&i.push(t(c,{...e}))}}})),S.value.add(...i)}(),ae(),function(){function e(e,t){const o=le.findIndex((t=>t.key===e.key));return{renderItem:()=>e.title,origin:{title:e.title,unit:e.unit,dataIndex:o,key:e.key},pointer:t}}C.event.evented&&S.value.on("mouse:up",(t=>{var o,i;if(3===t.button){const{x:n=0,y:r=0}=t.pointer||{};n>=N&&n<=J&&r>=W&&r<=F&&(A.point={x:n,y:r},A.show=!0,t.target?(A.target=t.target,A.list=[(null==(i=window.getLanguageByCode)?void 0:i.call(window,"10010.1.220"))||"删除节点"],[...se].forEach((e=>{e.origin&&e.left===t.target.left&&e.top===t.target.top&&A.list.push({renderItem:()=>e.origin.title,origin:{...e.origin},mode:"remove",pointer:t.pointer})}))):(A.target=null,A.list=[(null==(o=window.getLanguageByCode)?void 0:o.call(window,"10010.1.219"))||"新增节点"],le.filter((e=>e.show)).forEach((o=>{if(!M([...se],n,"key").includes(o.key)){if(["cervix","fetalPresentation"].includes(o.key)&&r<te)return;A.list.push(e(o,t.pointer))}})),1===A.list.length&&(A.show=!1,I("repeat"),console.log("当前时间段内无可新增节点"))))}}))}(),function(){const e=Q-Z/2;function t(e,t){if(!e.length)return;let i=W;const n=[];e.forEach((e=>{const o=(e.alias||e.title).split("").join("\n"),a=K.findIndex((t=>t.key===e.key));if(e.alias){const s=r([t,i],{value:o,...l,originY:"top",...e.titleStyle});o&&(i+=s.height+15,n.push(s))}else{const{text:r,icon:l}=s(o,e,{text:{originX:"center",originY:"top",left:t,top:i},icon:{left:t,topY:i,originX:"center",originY:"top",origin:{type:e.type,dataIndex:a},...C.event}},"vertical");i+=r.height+l.height+15,(c=l).on("moving",(()=>{c.set("originY","center"),T(c)?(de(c),he(c)):Y.show=!1})),c.on("mouseup:before",(e=>{if(Y.show=!1,0===e.e.button&&T(c))if(M([...se],c.left,"key").includes(c.origin.key))I("repeat");else{const e={data:{time:X(c.left),value:L(c.origin.key,c.top)},...c.origin};O("add",e),ce(e)}!function(e){e.setCoords().set({originY:"top",left:e.originLeft,top:e.originTop})}(c)})),n.push(r,l)}var c})),o(n),S.value.add(...n)}function o(e){const t=k(e),o=(F-W)/2,i=(t.height+t.top-W)/2;e.forEach((e=>{const t=e.top+o-i;e.set({top:t,originTop:t})}))}t(_,$/2),t(q,e)}(),{clickMenu:function({item:e,target:t}){const o={...e.origin};"remove"===e.mode?(O("remove",o),ce(o,"remove")):(Object.assign(o,{data:{time:X(e.pointer.x),value:L(e.origin.key,e.pointer.y)}}),O("add",o),ce(o))},redrawPoints:ue}}export{S as useBirthProcess};
+import { fabric } from '../../../../../shared/utils/fabricjs/index.js';
+import { drawLine, drawArrow, drawPoint, defaultStyle, drawText, defaultTextStyle, drawTextAndIconGroup, defaultRectStyle } from '../useDraw.js';
+import { useGrid } from '../useGrid.js';
+import { useBirthProcessCumputedPoint } from '../useCumputedPoint.js';
+import '../useEvent.js';
+import '../useShadow.js';
+import { getScaleInfo, drawScaleNumber, drawScaleLine } from '../useScaleColumn.js';
+import { useCommon } from '../useCommon.js';
+import 'vue';
+import { getIndex, isEffectiveNode, getTime, getScaleNumberList } from '../../utils/index.js';
+import { cloneDeep, isString, last, range } from 'lodash-es';
+import '../../constants/index.js';
+import '@vueuse/shared';
+import { format } from 'date-fns';
+import 'naive-ui';
+import '../surgicalAnesthesia/useTop.js';
+import '@vueuse/core';
+import '../surgicalAnesthesia/useOther.js';
+import '../../../../../shared/utils/index.js';
+
+function useBirthProcess(canvas, propItems, emits, pointTipProps, pointMenuProps) {
+  const {
+    computedX,
+    computedY,
+    getXValue,
+    getYValue
+  } = useBirthProcessCumputedPoint(propItems);
+  const {
+    getEqualXTypes,
+    handleAddPrevent,
+    isGridLimit,
+    setPrevAndNextPoint,
+    getPointEventProps
+  } = useCommon(canvas, emits, propItems);
+  const {
+    xAxis,
+    grid,
+    originX,
+    originY,
+    xCellWidth,
+    endY,
+    startTime,
+    leftAddAreaWidth,
+    leftScales,
+    rightScales,
+    yCellHeight,
+    endX,
+    scaleValues,
+    canvasWidth,
+    borderStyle,
+    rightAddAreaWidth,
+    event,
+    originYCervix,
+    other,
+    canvasHeight,
+    scalebarBorder,
+    padding
+  } = propItems;
+  const yScaleValue = cloneDeep(scaleValues);
+  const gridPoints = /* @__PURE__ */ new Set();
+  useGrid(canvas, propItems);
+  init();
+  function init() {
+    drawBorder();
+    drawYScale();
+    drawXScale();
+    drawOther();
+    drawPolyLine();
+    setCanvasEvent();
+    drawIcons();
+  }
+  function drawPolyLine() {
+    yScaleValue.filter(({
+      showData = true
+    }) => showData).forEach((item, dataIndex) => {
+      var _a;
+      const pointList = [];
+      const lineList = [];
+      const otherList = [];
+      const {
+        pointAttr = {},
+        lineAttr = {},
+        title = "",
+        key,
+        type: pointType = "circle",
+        childbirthStyle = {}
+      } = item;
+      (_a = item.data) == null ? void 0 : _a.forEach((v, index) => {
+        const points = getPointer(v, item);
+        drawPointLine(points, v, index);
+      });
+      setPrevAndNextPoint(pointList);
+      canvas.value.add(...lineList, ...otherList, ...pointList);
+      pointList.forEach((point) => {
+        point == null ? void 0 : point.bringToFront();
+        const {
+          childbirthIcon
+        } = point.otherObj || {};
+        if ((childbirthIcon == null ? void 0 : childbirthIcon.obj) && (childbirthIcon == null ? void 0 : childbirthIcon.type) !== "arrow") {
+          childbirthIcon.obj.bringToFront();
+        }
+      });
+      function drawPointLine(points, v, index) {
+        let point;
+        let line;
+        const nextV = item.data[index + 1];
+        const nextPoint = getPointer(nextV, item);
+        if (points && nextPoint && !v.breakpoint) {
+          line = drawLine([...points, ...nextPoint], {
+            ...lineAttr
+          });
+        } else if (points && !nextPoint && !v.breakpoint) {
+          const nextLinePoint = getPointer(nextV, item);
+          line = nextLinePoint ? drawLine([...points, ...nextLinePoint], {
+            ...lineAttr
+          }) : null;
+        }
+        const otherObj = {};
+        if (["fetalPresentation", "cervix"].includes(key)) {
+          let childbirthIcon;
+          let childbirthText;
+          if (v.childbirth) {
+            const {
+              type = "arrow",
+              style = {},
+              textStyle = {}
+            } = childbirthStyle;
+            if (type === "arrow") {
+              const top = points[1] + yCellHeight;
+              childbirthIcon = drawArrow([points[0], points[1], top], style);
+              childbirthIcon._bottomY = top;
+            } else {
+              childbirthIcon = drawPoint(type, {
+                left: points[0],
+                top: points[1],
+                ...style,
+                ...defaultStyle,
+                hoverCursor: "default"
+              });
+              childbirthIcon._bottomY = points[1] + childbirthIcon.height / 2;
+            }
+            childbirthText = isString(v.childbirth) ? drawText([points[0] + xCellWidth / 2, points[1] + yCellHeight / 2], {
+              value: String(v.childbirth),
+              ...defaultTextStyle,
+              ...{
+                originX: "left",
+                originY: "center"
+              },
+              ...textStyle
+            }) : null;
+            if (childbirthIcon) {
+              otherList.push(childbirthIcon);
+              Object.assign(otherObj, {
+                childbirthIcon: {
+                  obj: childbirthIcon,
+                  type
+                }
+              });
+            }
+            if (childbirthText) {
+              otherList.push(childbirthText);
+              Object.assign(otherObj, {
+                childbirthText: {
+                  obj: childbirthText,
+                  left: xCellWidth / 2,
+                  top: yCellHeight / 2
+                }
+              });
+            }
+          }
+        }
+        if (v.mark) {
+          const {
+            type = "triangle",
+            style = {}
+          } = v.markStyle || {};
+          const y = otherObj.childbirthIcon ? otherObj.childbirthIcon.obj._bottomY + 5 : points[1] + 10;
+          const markObj = isString(v.mark) ? drawText([points[0], y], {
+            value: String(v.mark),
+            ...defaultTextStyle,
+            ...style,
+            originY: "top"
+          }) : drawPoint(type, {
+            left: points[0],
+            top: y,
+            ...style,
+            ...defaultStyle,
+            originY: "top",
+            hoverCursor: "default"
+          });
+          otherList.push(markObj);
+          Object.assign(otherObj, {
+            markObj: {
+              obj: markObj,
+              top: y - points[1]
+            }
+          });
+        }
+        if (key === "fetalPresentation") {
+          drawFetalPresentationOther(points, v, "surgicalDelivery", otherObj);
+          drawFetalPresentationOther(points, v, "dystocia", otherObj);
+        }
+        const previousLine = lineList[index - 1];
+        const pointAttrNew = {
+          origin: {
+            data: v,
+            title,
+            key: key || "",
+            dataIndex,
+            index
+          },
+          leftLine: previousLine,
+          rightLine: line,
+          otherObj,
+          ...pointAttr,
+          ...getPointEventProps()
+        };
+        if (points) {
+          if (!previousLine) {
+            pointAttrNew.leftLine = null;
+          }
+          point = drawPoint(pointType, {
+            left: points[0],
+            top: points[1],
+            ...pointAttrNew
+          });
+        }
+        line && lineList.push(line);
+        if (point) {
+          setPointEvent(point);
+          pointList.push(point);
+          gridPoints.add(point);
+        }
+      }
+      function drawFetalPresentationOther(points, v, k, otherObj) {
+        if (v[k]) {
+          const {
+            type = "circle",
+            style = {},
+            arrowStyle = {}
+          } = item[k + "Style"];
+          const x = computedX(v[k]);
+          const line = drawLine([...points, x, points[1]], {
+            ...lineAttr,
+            strokeDashArray: [4, 2],
+            ...defaultStyle
+          });
+          const y = k === "dystocia" && points[1] - originY >= yCellHeight ? points[1] - yCellHeight : points[1];
+          const pointer = drawPoint(type, {
+            left: x,
+            top: y,
+            ...style,
+            ...defaultStyle
+          });
+          const arrY = y + pointer.height / 2;
+          const arrow = k === "dystocia" ? drawArrow([x, arrY + yCellHeight, arrY], lineAttr, "up") : null;
+          if (line) {
+            otherList.push(line);
+            otherObj[k + "Line"] = {
+              obj: line,
+              type: "line",
+              left: x - points[0]
+            };
+          }
+          if (pointer) {
+            otherList.push(pointer);
+            otherObj[k] = {
+              obj: pointer,
+              left: x - points[0]
+            };
+          }
+          if (arrow) {
+            otherList.push(arrow);
+            otherObj[k + "Arrow"] = {
+              obj: arrow,
+              left: x - points[0],
+              moveHide: true
+            };
+          }
+        }
+      }
+    });
+  }
+  function setPointEvent(point) {
+    if (event.hovered) {
+      point.on("mouseover", () => {
+        setPopup(point, "hover");
+      });
+      point.on("mouseout", () => {
+        pointTipProps.show = false;
+      });
+    }
+    if (point.lockMovementX && point.lockMovementY)
+      return;
+    point.on("moving", () => {
+      moveLimit(point);
+      updateLine(point);
+      event.hovered && setPopup(point);
+    });
+    point.on("mouseup", (event2) => {
+      pointTipProps.show = false;
+      if (event2.button === 1) {
+        const {
+          key
+        } = point.origin;
+        const params = {
+          ...point.origin,
+          data: {
+            ...point.origin.data,
+            time: getXValue(point.left),
+            value: getYValue(key, point.top)
+          }
+        };
+        ["surgicalDelivery", "dystocia"].some((k) => {
+          var _a;
+          if ((_a = point.otherObj[k]) == null ? void 0 : _a.obj) {
+            params.data[k] = format(new Date(getXValue(point.left + point.otherObj[k].left)), "yyyy-MM-dd HH:mm");
+          }
+        });
+        canvas.value.discardActiveObject();
+        emits("change", params);
+        updateData(params, "change");
+      }
+    });
+  }
+  function updateData(params, mode = "add") {
+    const {
+      dataIndex,
+      data,
+      index,
+      key
+    } = params;
+    const item = yScaleValue.find((v) => v.key === key);
+    switch (mode) {
+      case "remove":
+        item.data.splice(index, 1);
+        break;
+      case "change":
+        item.data[index] = data;
+        break;
+      default: {
+        const index2 = getIndex(data.time, item.data);
+        item.data.splice(index2, 0, data);
+        break;
+      }
+    }
+    redrawPoints();
+  }
+  function doRemovePoints(points) {
+    const removePoints = [];
+    points.forEach((point) => {
+      point && removePoints.push(point);
+      (point == null ? void 0 : point.leftLine) && removePoints.push(point == null ? void 0 : point.leftLine);
+      (point == null ? void 0 : point.rightLine) && removePoints.push(point == null ? void 0 : point.rightLine);
+      Object.values((point == null ? void 0 : point.otherObj) || {}).forEach((o) => {
+        (o == null ? void 0 : o.obj) && removePoints.push(o == null ? void 0 : o.obj);
+      });
+    });
+    return removePoints;
+  }
+  function redrawPoints() {
+    var _a;
+    gridPoints.size && ((_a = canvas.value) == null ? void 0 : _a.remove(...doRemovePoints([...gridPoints])));
+    gridPoints.clear();
+    drawPolyLine();
+  }
+  function updateLine(point) {
+    var _a, _b;
+    (_a = point.leftLine) == null ? void 0 : _a.setCoords().set({
+      x2: point.left,
+      y2: point.top
+    });
+    (_b = point.rightLine) == null ? void 0 : _b.setCoords().set({
+      x1: point.left,
+      y1: point.top
+    });
+    Object.values(point.otherObj).forEach((o) => {
+      const {
+        obj,
+        top = 0,
+        left = 0,
+        type = "",
+        moveHide
+      } = o || {};
+      if (obj) {
+        if (type === "line") {
+          obj.setCoords().set({
+            x1: point.left,
+            y1: point.top,
+            x2: point.left + left,
+            y2: point.top
+          });
+        } else {
+          obj.setCoords().set({
+            left: point.left + left,
+            top: point.top + top
+          });
+        }
+        if (moveHide) {
+          canvas.value.remove(obj);
+          delete point.otherObj.obj;
+        }
+      }
+    });
+  }
+  function moveLimit(point) {
+    const limitLeft = point.prevPoint ? point.prevPoint.left : originX;
+    const limitRight = point.nextPoint ? point.nextPoint.left : endX;
+    point.setCoords();
+    ["cervix", "fetalPresentation"].includes(point.origin.key) && point.top < originYCervix && point.set("top", originYCervix);
+    point.top < originY && point.set("top", originY);
+    point.top > endY && point.set("top", endY);
+    point.left < limitLeft && point.set("left", limitLeft);
+    point.left > limitRight && point.set("left", limitRight);
+  }
+  function setPopup(point, status = "moving") {
+    const {
+      title,
+      key,
+      data
+    } = point.origin;
+    pointTipProps.point = {
+      x: point.left,
+      y: point.top
+    };
+    pointTipProps.list = [`${title} ${status === "hover" ? data.value : getYValue(key, point.top)}`, `\u65F6\u95F4 ${getXValue(point.left).slice(-5)}`];
+    pointTipProps.show = true;
+  }
+  function getPointer(v, item) {
+    if (isEffectiveNode(v) && isLimit(v.time)) {
+      const x = computedX(v.time);
+      const y = computedY(item.key, item.range, v.value);
+      return [x, y < originY ? originY : y > endY ? endY : y];
+    }
+  }
+  function isLimit(time) {
+    const maxTime = startTime + 24 * 60 * 60 * 1e3;
+    const _time = getTime(time);
+    return _time >= startTime && _time <= maxTime;
+  }
+  function setCanvasEvent() {
+    if (!propItems.event.evented)
+      return;
+    canvas.value.on("mouse:up", (event2) => {
+      var _a, _b;
+      if (event2.button === 3) {
+        const {
+          x = 0,
+          y = 0
+        } = event2.pointer || {};
+        if (x >= originX && x <= endX && y >= originY && y <= endY) {
+          pointMenuProps.point = {
+            x,
+            y
+          };
+          pointMenuProps.show = true;
+          if (!event2.target) {
+            pointMenuProps.target = null;
+            pointMenuProps.list = [((_a = window.getLanguageByCode) == null ? void 0 : _a.call(window, "10010.1.219")) || "\u65B0\u589E\u8282\u70B9"];
+            yScaleValue.filter((item) => item.show).forEach((item) => {
+              if (!getEqualXTypes([...gridPoints], x, "key").includes(item.key)) {
+                if (["cervix", "fetalPresentation"].includes(item.key) && y < originYCervix)
+                  return;
+                pointMenuProps.list.push(getPointMenuList(item, event2.pointer));
+              }
+            });
+            if (pointMenuProps.list.length === 1) {
+              pointMenuProps.show = false;
+              handleAddPrevent("repeat");
+              console.log("\u5F53\u524D\u65F6\u95F4\u6BB5\u5185\u65E0\u53EF\u65B0\u589E\u8282\u70B9");
+            }
+          } else {
+            pointMenuProps.target = event2.target;
+            pointMenuProps.list = [((_b = window.getLanguageByCode) == null ? void 0 : _b.call(window, "10010.1.220")) || "\u5220\u9664\u8282\u70B9"];
+            [...gridPoints].forEach((obj) => {
+              if (obj.origin && obj.left === event2.target.left && obj.top === event2.target.top) {
+                pointMenuProps.list.push({
+                  renderItem: () => obj.origin.title,
+                  origin: {
+                    ...obj.origin
+                  },
+                  mode: "remove",
+                  pointer: event2.pointer
+                });
+              }
+            });
+          }
+        }
+      }
+    });
+    function getPointMenuList(item, pointer) {
+      const dataIndex = yScaleValue.findIndex((_item) => _item.key === item.key);
+      return {
+        renderItem: () => item.title,
+        origin: {
+          title: item.title,
+          unit: item.unit,
+          dataIndex,
+          key: item.key
+        },
+        pointer
+      };
+    }
+  }
+  function clickMenu({
+    item,
+    target
+  }) {
+    const params = {
+      ...item.origin
+    };
+    if (item.mode === "remove") {
+      emits("remove", params);
+      updateData(params, "remove");
+    } else {
+      Object.assign(params, {
+        data: {
+          time: getXValue(item.pointer.x),
+          value: getYValue(item.origin.key, item.pointer.y)
+        }
+      });
+      emits("add", params);
+      updateData(params);
+    }
+  }
+  function drawOther() {
+    var _a;
+    const lineData = Object.values(other);
+    const lines = [];
+    const alertData = {};
+    const alertItem = yScaleValue.find((item) => item.key === "cervix" && item.show);
+    const alertStartPoint = (_a = alertItem == null ? void 0 : alertItem.data) == null ? void 0 : _a.find((_data) => +_data.value === 3);
+    lineData.forEach((line) => {
+      if (!line.show)
+        return;
+      const {
+        key
+      } = line;
+      switch (key) {
+        case "fetalPresentation": {
+          const {
+            range: range2,
+            show
+          } = yScaleValue.find((item) => item.key === key);
+          if (show) {
+            const y = computedY(key, range2, 0);
+            lines.push(drawLine([originX, y, endX, y], {
+              ...line
+            }));
+          }
+          break;
+        }
+        case "alert": {
+          if (alertStartPoint) {
+            const {
+              key: key2,
+              range: range2
+            } = alertItem || {};
+            const _time = 6 * 60 * 60 * 1e3;
+            const endPoint = {
+              time: format(new Date(getTime(alertStartPoint.time) + _time), "yyyy-MM-dd HH:mm"),
+              value: 10
+            };
+            const [x1, y1] = [computedX(alertStartPoint.time) - originX, endY - computedY(key2, range2, alertStartPoint.value)];
+            const [x2, y2] = [computedX(endPoint.time) - originX, endY - computedY(key2, range2, endPoint.value)];
+            const k = (y2 - y1) / (x2 - x1);
+            const b = y1 - x1 * k;
+            const pointer = computePointer(k, b);
+            if (pointer.length > 0) {
+              lines.push(drawLine(pointer, {
+                ...line
+              }));
+              Object.assign(alertData, {
+                k,
+                b
+              });
+            }
+          }
+          break;
+        }
+        case "handling": {
+          if (alertStartPoint) {
+            const {
+              k,
+              b
+            } = alertData;
+            const _time = 4 * 60 * 60 * 1e3;
+            const endTime = computedX(format(new Date(getTime(alertStartPoint.time) + _time), "yyyy-MM-dd HH:mm"));
+            const a = endTime - computedX(alertStartPoint.time);
+            const _b = b - a * k;
+            const pointer = computePointer(k, _b);
+            if (pointer.length > 0) {
+              lines.push(drawLine(pointer, {
+                ...line
+              }));
+            }
+          }
+          break;
+        }
+      }
+    });
+    function computePointer(k, b) {
+      const {
+        key,
+        range: range2
+      } = alertItem || {};
+      const _originY = computedY(key, range2, 10);
+      const startPointer1 = [0, b];
+      const startPointer2 = [-(b / k), 0];
+      const endPointer1 = [(endY - _originY - b) / k, endY - _originY];
+      const endPointer2 = [endX - originX, k * (endX - originX) + b];
+      let startPointer = [];
+      let endPointer = [];
+      if (isLinePointer(startPointer1) && isLimit2(startPointer1)) {
+        startPointer = getActualValue(startPointer1);
+      }
+      if (isLinePointer(startPointer2) && isLimit2(startPointer2)) {
+        startPointer = getActualValue(startPointer2);
+      }
+      if (isLinePointer(endPointer1) && isLimit2(endPointer1)) {
+        endPointer = getActualValue(endPointer1);
+      }
+      if (isLinePointer(endPointer2) && isLimit2(endPointer2)) {
+        endPointer = getActualValue(endPointer2);
+      }
+      function isLinePointer([x, y]) {
+        return Math.abs(y - k * x - b) <= 1;
+      }
+      function isLimit2([x, y]) {
+        const [_x, _y] = [...getActualValue([x, y])];
+        return _x >= originX && _x <= endX && _y >= _originY && _y <= endY;
+      }
+      function getActualValue([x, y]) {
+        return [originX + x, endY - y];
+      }
+      return [...startPointer, ...endPointer];
+    }
+    canvas.value.add(...lines);
+  }
+  function drawIcons() {
+    const leftX = leftAddAreaWidth / 2;
+    const rightX = canvasWidth - rightAddAreaWidth / 2;
+    _drawIcons(leftScales, leftX);
+    _drawIcons(rightScales, rightX);
+    function _drawIcons(scales, left) {
+      if (!scales.length)
+        return;
+      let topY = originY;
+      const objs = [];
+      scales.forEach((item) => {
+        const title = (item.alias || item.title).split("").join("\n");
+        const dataIndex = scaleValues.findIndex((_item) => _item.key === item.key);
+        if (!item.alias) {
+          const {
+            text,
+            icon
+          } = drawTextAndIconGroup(title, item, {
+            text: {
+              originX: "center",
+              originY: "top",
+              left,
+              top: topY
+            },
+            icon: {
+              left,
+              topY,
+              originX: "center",
+              originY: "top",
+              origin: {
+                type: item.type,
+                dataIndex
+              },
+              ...propItems.event
+            }
+          }, "vertical");
+          topY += text.height + icon.height + 15;
+          setIconEvent(icon);
+          objs.push(text, icon);
+        } else {
+          const text = drawText([left, topY], {
+            value: title,
+            ...defaultTextStyle,
+            originY: "top",
+            ...item.titleStyle
+          });
+          if (title) {
+            topY += text.height + 15;
+            objs.push(text);
+          }
+        }
+      });
+      setVerticalCenter(objs);
+      canvas.value.add(...objs);
+    }
+    function setVerticalCenter(objs) {
+      const lastobj = last(objs);
+      const wrapHalf = (endY - originY) / 2;
+      const contentHalf = (lastobj.height + lastobj.top - originY) / 2;
+      objs.forEach((obj) => {
+        const top = obj.top + wrapHalf - contentHalf;
+        obj.set({
+          top,
+          originTop: top
+        });
+      });
+    }
+  }
+  function setIconEvent(point) {
+    point.on("moving", () => {
+      point.set("originY", "center");
+      if (isGridLimit(point)) {
+        moveLimit(point);
+        setPopup(point);
+      } else {
+        pointTipProps.show = false;
+      }
+    });
+    point.on("mouseup:before", (event2) => {
+      pointTipProps.show = false;
+      if (event2.e.button === 0) {
+        if (isGridLimit(point)) {
+          const isRepeat = getEqualXTypes([...gridPoints], point.left, "key").includes(point.origin.key);
+          if (isRepeat) {
+            handleAddPrevent("repeat");
+          } else {
+            const params = {
+              data: {
+                time: getXValue(point.left),
+                value: getYValue(point.origin.key, point.top)
+              },
+              ...point.origin
+            };
+            emits("add", params);
+            updateData(params);
+          }
+        }
+      }
+      setRestore(point);
+    });
+  }
+  function setRestore(point) {
+    point.setCoords().set({
+      originY: "top",
+      left: point.originLeft,
+      top: point.originTop
+    });
+  }
+  function drawXScale() {
+    const {
+      show,
+      startTime: startTime2,
+      range: timeRange = [0, 23],
+      position = "top",
+      style
+    } = xAxis.time;
+    const {
+      show: processTimeShow,
+      range: processTimeRange = [0, 23],
+      position: processPosition,
+      style: processTimeStyle = {}
+    } = xAxis.processTime;
+    if (show || processTimeShow) {
+      const timeList = [];
+      const processTimeList = range(processTimeRange[0], processTimeRange[1] + 1);
+      const timeTextList = [];
+      const processTimeTextList = [];
+      const halfYCellHeight = yCellHeight / 2;
+      for (let i = 0; i < grid.mainXCell; i++) {
+        if (show) {
+          const {
+            textAlign = "center"
+          } = style;
+          const baseLeft = originX + (textAlign === "center" ? xCellWidth / 2 : 0);
+          const left = i === 0 && textAlign !== "center" ? baseLeft + 5 : baseLeft;
+          const currentTime = i === 0 ? +startTime2.slice(11, 13) : getCurrentTime(last(timeList), timeRange);
+          timeList.push(currentTime);
+          const top = position === "top" ? originY - halfYCellHeight : endY + halfYCellHeight;
+          timeTextList.push(drawText([left + i * xCellWidth, top], {
+            value: String(currentTime),
+            ...defaultTextStyle,
+            ...style
+          }));
+          if (i === grid.mainXCell - 1 && textAlign !== "center") {
+            timeTextList.push(drawText([endX - 1, top], {
+              value: String(getCurrentTime(last(timeList), timeRange)),
+              ...defaultTextStyle,
+              ...style,
+              originX: textAlign !== "center" ? "right" : "center"
+            }));
+          }
+        }
+        if (processTimeShow && i <= processTimeList.length) {
+          const {
+            textAlign = "center"
+          } = processTimeStyle;
+          const baseLeft = originX + (textAlign === "center" ? xCellWidth / 2 : 0);
+          const left = i === 0 && textAlign !== "center" ? baseLeft + 5 : baseLeft;
+          const top = processPosition === "top" ? halfYCellHeight : canvasHeight - halfYCellHeight;
+          processTimeTextList.push(drawText([left + i * xCellWidth, top], {
+            value: String(processTimeList[i]),
+            ...defaultTextStyle,
+            ...processTimeStyle
+          }));
+          if (i === grid.mainXCell - 1 && textAlign !== "center") {
+            processTimeTextList.push(drawText([endX - 1, top], {
+              value: String(last(processTimeList)),
+              ...defaultTextStyle,
+              ...style,
+              originX: textAlign !== "center" ? "right" : "center"
+            }));
+          }
+        }
+      }
+      const group = new fabric.Group([...timeTextList, ...processTimeTextList], {
+        objectCaching: false,
+        ...defaultStyle
+      });
+      canvas.value.add(group);
+      canvas.value.sendToBack(group);
+    }
+  }
+  function getCurrentTime(lastTime, range2) {
+    return lastTime + 1 > range2[1] ? range2[0] : lastTime + 1;
+  }
+  function drawYScale() {
+    drawColumn(leftScales);
+    drawColumn(rightScales, "right");
+    function drawColumn(scales, layout = "left") {
+      let baseLeft = layout === "left" ? leftAddAreaWidth : endX;
+      scales.forEach((item, index) => {
+        const {
+          range: range2,
+          spaceValue,
+          width,
+          title,
+          titleStyle,
+          key,
+          position = "center",
+          spaceGridNumber = 1,
+          showNumber = true,
+          showMaxMinNumber = true,
+          showName = true
+        } = item;
+        const textList = [];
+        const lineList = [];
+        const left = baseLeft + width / 2;
+        const list = getScaleNumberList(range2, spaceValue);
+        const listLen = list.length;
+        const {
+          lineXMain,
+          lineXSub,
+          textLeft
+        } = getScaleInfo(position, baseLeft, width);
+        list.forEach((num, i) => {
+          const baseTop = endY - i * yCellHeight * spaceGridNumber;
+          const top = i === 0 ? endY - 8 : i === list.length - 1 && padding[0] && (!originYCervix || key === "FHR") ? originY + 8 : baseTop;
+          const isMaxMinNumber = i === 0 || i === listLen - 1;
+          if (showNumber && (!isMaxMinNumber || showMaxMinNumber)) {
+            textList.push(drawScaleNumber(String(num), item, textLeft, top));
+          }
+          lineList.push(...drawScaleLine(item, i, lineXMain, lineXSub, baseTop, yCellHeight, originY, listLen, 1));
+        });
+        const borderAndTitle = [];
+        const border = scalebarBorder ? new fabric.Rect({
+          ...defaultRectStyle,
+          strokeWidth: 0.5,
+          width,
+          height: endY - padding[0],
+          left,
+          top: padding[0] + (endY - padding[0]) / 2
+        }) : null;
+        border && borderAndTitle.push(border);
+        if (showName) {
+          const titleText = drawText([left, originY - padding[0] > 0 ? originY - yCellHeight / 2 : yCellHeight / 2], {
+            value: String(title),
+            ...defaultTextStyle,
+            ...titleStyle
+          });
+          titleText && borderAndTitle.push(titleText);
+        }
+        const group = new fabric.Group([...lineList, ...textList, ...borderAndTitle], {
+          objectCaching: false,
+          ...defaultStyle
+        });
+        canvas.value.add(group);
+        group.sendToBack();
+        baseLeft += width;
+      });
+    }
+  }
+  function drawBorder() {
+    const props = scalebarBorder ? {
+      width: canvasWidth - leftAddAreaWidth - rightAddAreaWidth - 1,
+      left: leftAddAreaWidth
+    } : {
+      width: endX - originX - (rightScales.length ? 0 : 1),
+      left: originX
+    };
+    const border = new fabric.Rect({
+      ...borderStyle,
+      height: endY - padding[0] - 1,
+      top: padding[0],
+      fill: "transparent",
+      ...props
+    });
+    canvas.value.add(border);
+  }
+  return {
+    clickMenu,
+    redrawPoints
+  };
+}
+
+export { useBirthProcess };