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

package/es/components/fabric-chart/src/hooks/surgicalAnesthesia/useCenter.js

@@ -1 +1,919 @@
-import{fabric as e}from"../../../../../shared/utils/fabricjs/index.js";import{defaultStyle as t,drawLine as n,drawPoint as i}from"../useDraw.js";import{useGrid as o}from"../useGrid.js";import{useBirthProcessCumputedPoint as l}from"../useCumputedPoint.js";import{bus as r}from"../useEvent.js";import"../useShadow.js";import{useCommon as a}from"../useCommon.js";import"vue";import{nearlyEqual as s,getIndex as f,isEffectiveNode as u,getTime as c}from"../../utils/index.js";import{cloneDeep as d,filter as p,last as m,omit as g,flatten as v}from"lodash-es";import"date-fns";import{OTHER_MENU as y}from"../../constants/index.js";import"@vueuse/shared";import"naive-ui";import"./useTop.js";import"./useOther.js";import"../../../../../shared/utils/index.js";import{useIntervalFn as h}from"@vueuse/core";function x(x,k,L,w,b,P){const{computedX:A,computedY:C,getXValue:j,getYValue:I}=l(k),{xCellWidth:M,pointSelectionStyle:E,originX:K,endX:X,originY:V,endY:Y,event:T,scaleValues:O,xAxis:S,startTime:D,timeXCell:F,itemList:$,dialog:z,topGridOriginY:B,topGridEndY:G,extraMenuConfig:N,grid:_}=k,J=new Map,q=new Set;let R=d(O),W=[],H=null;const Q=new Set;o(x,k);const{getEqualXTypes:U,handleAddPrevent:Z,setPrevAndNextPoint:ee,getPointEventProps:te}=a(x,L,k),{pause:ne,resume:ie}=h((()=>{!function(){if(!Q.size)return;for(const e of Q)e.set("opacity",1===e.opacity?.5:1);x.value.renderAll()}()}),800);function oe(){R.forEach((e=>{const{range:t=[],spaceValue:i}=e;i&&(t[0]||t[1])&&e.dataList.forEach(((t,i)=>{t.show&&(!function(e,t){const{max:i={},min:o={}}=e.panicValue||{},{max:l={},min:r={}}=e.diffValue||{};function a({show:e=!1,value:i,name:o,lineStyle:l}){if(!e||!i)return;const r=C(t.type,t.range,i),a=n([K,r,X,r],{...l,evented:!0,lockMovementX:!0,lockMovementY:!0,hoverCursor:"pointer"});T.hovered&&o&&(a.on("mousemove",(({pointer:e})=>{w.point={...e||{x:a.left,y:a.top}},w.list=[`${o} ${i}${t.unit||""}`],w.show=!0})),a.on("mouseout",(()=>{w.show=!1}))),x.value.add(a)}a(i),a(o),a(l),a(r)}(t,e),se(t,i,e))}))}))}function le(e=[]){if(!(null==H?void 0:H.areaPos))return[];const{startPos:t,endPos:n}=H.areaPos,[i,o]=[t.x,n.x].sort(((e,t)=>e-t)),[l,r]=[t.y,n.y].sort(((e,t)=>e-t));return(e.length?e:ye()).filter((e=>e.left>=i&&e.left<=o&&e.top>=l&&e.top<=r))}function re(e){var t,n,i,o;z.warning({maskClosable:!1,closeOnEsc:!1,title:(null==(t=window.getLanguageByCode)?void 0:t.call(window,"10010.1.228"))||"警告",content:(null==(n=window.getLanguageByCode)?void 0:n.call(window,"10010.1.229"))||"确认删除当前选中的节点？",positiveText:(null==(i=window.getLanguageByCode)?void 0:i.call(window,"10010.1.27"))||"确定",negativeText:(null==(o=window.getLanguageByCode)?void 0:o.call(window,"10010.1.28"))||"取消",onPositiveClick:()=>{e(),ae()},onNegativeClick:()=>ae(),onClose:()=>ae()})}function ae(){H&&x.value.remove(H),H=null}function se(e,t,o){var l;const{type:r,unit:a,dataList:f=[]}=o,u=[];J.set(e.key,[]),function(e,t){Q.size&&[...Q].forEach((n=>{const{dataIndex:i,type:o}=n.origin;i===t&&o===e&&Q.delete(n)}))}(r,t),null==(l=e.list)||l.forEach(((l,c)=>{!function(e,l,c,d){var p;let v,y,h=d;l.key&&(h=f.find((e=>e.key===l.key)));const{pointAttr:k={},lineAttr:b={},title:P="",key:A,type:C="circle"}=h,E=ve(d.list[c+1],o);e&&E&&!l.breakpoint&&e[0]!==E[0]&&(!_.breakpoint||_.breakpoint&&E[0]-e[0]<=M)&&(y=n([...e,...E],b));const K=u[c-1],X={origin:{data:l,title:P,key:d.key,selfKey:A,unit:a,type:r,dataIndex:t,index:c,lineAttr:b},__type:"main",leftLine:K,rightLine:y,...k,...te()};e&&(K||(X.leftLine=null),v=i(C,{left:e[0],top:e[1],...X}));u.push(y),v&&(v.originLeft=v.left,v.originTop=v.top,function(e){T.hovered&&(e.on("mouseover",(()=>{me(e,"hover")})),e.on("mouseout",(()=>{w.show=!1})));if(e.lockMovementX&&e.lockMovementY)return;e.on("moving",(()=>{ge(e),function(e){var t,n;null==(t=e.leftLine)||t.setCoords().set({x2:e.left,y2:e.top}),null==(n=e.rightLine)||n.setCoords().set({x1:e.left,y1:e.top})}(e),T.hovered&&me(e),function(e){var t,n,i,o;const{originLeft:l,originTop:r,left:a,top:f,origin:u}=e,c=~~(Math.abs(a-l)/M),d=a>l;if(Math.abs(a-l)>M){if(0===W.length){let a=e.leftLine?[e.leftLine.x1,e.leftLine.y1]:[l,r];d||(a=e.rightLine?[e.rightLine.x2,e.rightLine.y2]:[l,r]),ue(e,[...a,l,r]),null==(n=null==(t=e.leftLine)?void 0:t.set)||n.call(t,"stroke","transparent"),null==(o=null==(i=e.rightLine)?void 0:i.set)||o.call(i,"stroke","transparent")}const p=M*c,m=d?l+p:l-p;if(W.every((e=>!s(e.left,m)))){const t=j(m),n=I(u.type,f);W.push({data:{time:t,value:n,...u.selfKey!==u.key?{key:u.selfKey}:{}},left:m,top:f}),ue(e,[...e.prevPointer,m,f],d)}if(W.length<c&&function(e,t,n=!0){const{originLeft:i,originTop:o,origin:l}=e;let r=1;for(;r<=t;){const t=M*r,a=n?i+t:i-t,s=W.some((e=>Math.abs(e.left-a)<=1));if(!s){let t=0;const r=W.find(((e,i)=>n?(e.left>a&&(t=i),e.left>a):(e.left<a&&(t=i),e.left<a)));if(r){const s=JSON.parse(JSON.stringify(r)),f=W[t-1]||{left:i,top:o},u=~~(Math.abs(r.left-(n?a-M:a+M))/M),c=(r.top-f.top)/u;s.top=f.top+c,s.left=a,s.data={time:j(a),value:I(l.type,s.top),...l.selfKey!==l.key?{key:l.selfKey}:{}},W.splice(t,0,s),ue(e,[f.left,f.top,s.left,s.top],n)}}r++}}(e,c,d),d&&e.nextPoint||!d&&e.prevPoint){const t=J.get(u.key);!function(e,t){const{left:n,top:i,origin:o}=t,l=M/2,r=e.findIndex((e=>Math.abs(n-e.left)<l&&Math.abs(i-e.top)<l&&o.index!==e.origin.index));r>-1?(t.set({scaleX:2.5,scaleY:2.5}),t.coincidePoint=e[r]):t.set({scaleX:t.scale,scaleY:t.scale})}(t,e),null==t||t.forEach((e=>{s(e.left,l)||u.index===e.origin.index||(d&&e.left>l&&e.left<a||!d&&e.left<l&&e.left>a?fe(e,"#999"):fe(e,e.origin.lineAttr.stroke))}))}}!function(e,t=!0){var n,i,o,l;const{left:r,originLeft:a}=e;if((null==W?void 0:W.length)>0){for(const e of q)(t&&(e.left>r||e.left<a)||!t&&(e.left<r||e.left>a))&&(e.left<r||e.left>a)&&(e.leftLine&&x.value.remove(e.leftLine),e.rightLine&&x.value.remove(e.rightLine),x.value.remove(e));if(W=W.filter((e=>t&&e.left<=r&&e.left>a||!t&&e.left>=r&&e.left<a)),0===W.length){null==(i=null==(n=e.leftLine)?void 0:n.set)||i.call(n,e.prevPoint.origin.lineAttr),null==(l=null==(o=e.rightLine)?void 0:o.set)||l.call(o,e.origin.lineAttr);for(const e of q)e.leftLine&&x.value.remove(e.leftLine),x.value.remove(e)}if(W.length>0){const t=m(W);e.prevPointer=[t.left,t.top]}}}(e,d)}(e)})),e.on("mouseup",(t=>{if(w.show=!1,1===t.button){const{type:t,selfKey:n,dataIndex:i}=e.origin,o={...e.origin,data:{...e.origin.data,time:j(e.left),value:I(t,e.top)}};if(x.value.discardActiveObject(),W.length>0){const l=R.find((e=>e.type===t));let r=-1;const a=m(W).left>e.originLeft,s=W.map((e=>e.data));if(a&&e.nextPoint||!a){if(2.5!==e.scaleX)return void de({dataIndex:i,scaleValue:l});const t=e.coincidePoint.origin,n=t.data;r=t.index;const o=s.findIndex((e=>e.time===n.time));o>-1&&s.splice(o,1),a||(s.reverse(),r=e.origin.index)}const f=l.dataList.findIndex((e=>e.key===n));L("add",{...g(o,["index","selfKey","lineAttr"]),dataIndex:f,key:n,data:s}),ce({...o,data:s,coincideIndex:r})}else L("change",{...g(o,["selfKey","lineAttr"]),key:n}),ce(o,"change")}}))}(v),null==(p=J.get(d.key))||p.push(v))}(ve(l,o),l,c,e)})),Promise.all(J.get(e.key)).then((t=>{const n=u.filter((e=>e));ee(t),x.value.add(...n,...t),function(e,t){const{max:n={},min:i={}}=t.panicValue||{},{max:o={},min:l={}}=t.diffValue||{};function r({show:t=!1,value:n,flickerable:i},o){!t&&n&&i&&e.forEach((e=>{const t=e.origin.data.value;"max"===o&&t<n||"min"===o&&t>n||Q.add(e)}))}r(n,"max"),r(i,"min"),r(o,"max"),r(l,"min")}(t,e)}))}function fe(e,t){["stroke","fill"].forEach((n=>{const i=e[n];i&&!["transparent","#fff","#ffffff","#FFFFFF"].includes(i)&&i!==t&&e.set(n,t)})),e.rightLine&&![t,"transparent"].includes(e.rightLine.stroke)&&e.rightLine.set("stroke",t)}function ue(e,t,i=!0){const[o,,l,r]=t;e.clone((a=>{a.set({left:l,top:r,scaleX:1,scaleY:1}),e.prevPointer=[l,r];const f=n(t,e.leftLine&&s(o,e.leftLine.x1)?e.prevPoint.origin.lineAttr:e.origin.lineAttr);i?a.leftLine=f:a.rightLine=f,q.add(a),x.value.add(f,a)}))}function ce(e,t="add",n=1){const{data:i,index:o,key:l,type:r,coincideIndex:a,linkKey:s}=e;let{dataIndex:u}=e;const c=R.find((e=>e.type===r)),d=c.dataList.find(((e,t)=>{u=t;const n=s||l;return e.key===n}));switch(t){case"remove":d.list.splice(o,n),d.list[o-1]&&(d.list[o-1].breakpoint=!0);break;case"change":d.list[o]=i;break;default:{const e=Array.isArray(i)?i[0].time:i.time,t=f(e,d.list,!0),n=Array.isArray(i)?i:[i];d.list.splice(t,a>-1?a-t:0,...n);break}}de({dataIndex:u,scaleValue:c})}function de(e){var t,n,i;if(q.size&&(null==(t=x.value)||t.remove(...pe([...q]))),q.clear(),W=[],e){const{dataIndex:t,scaleValue:i}=e,o=i.dataList[t];null==(n=x.value)||n.remove(...pe(J.get(o.key))),J.delete(o.key),se(o,t,i)}else R=d(O),J.size&&(null==(i=x.value)||i.remove(...pe(ye()))),J.clear(),oe()}function pe(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)})),t}function me(e,t="moving"){const{title:n,type:i,data:o,unit:l,selfKey:r}=e.origin;w.point={x:e.left,y:e.top};const a=j(e.left),s=`${"hover"===t?o.value:I(i,e.top)}`;w.list=[`${n} ${s}${l||""}`,`时间 ${a.slice(-5)}`],w.sourceData=[{type:i,title:n,unit:l,key:r,time:a,value:s}],w.isTarget=!0,w.show=!0}function ge(e,t=X){e.setCoords();const n=K;e.top<V&&e.set("top",V),e.top>Y&&e.set("top",Y),e.left<n&&e.set("left",n),e.left>t&&e.set("left",t)}function ve(e,t){if(u(e)&&function(e){const t=Date.parse(m(S.list)),n=c(e);return n>=D&&n<=t}(e.time)){const n=A(e.time),i=C(t.type,t.range,e.value);return[n,i<V?V:i>Y?Y:i]}}function ye(){return v(Array.from(J.values()))}return oe(),function(){if(!T.evented)return;let n=!1,i={x:0,y:0};x.value.on("mouse:up",(e=>{if(3===e.button&&function(e){w.show=!1;const{x:t=0,y:n=0}=e.pointer||{};if(t>=K&&t<=X&&n>=V&&n<=Y)if(e.target){if("main"!==e.target.__type)return;const t=e.target;i({x:t.left,y:t.top},e.target,[]),b.list=p(y,(e=>"edit"!==e.type)).map((e=>({...e,renderItem:()=>e.label,type:e.key||e.type,pointer:{x:t.left,y:t.top},..."add"===e.type?{}:{origin:{...t.origin}}})))}else{i(e.pointer,null,[]);const{menuList:t=[]}=N;b.list=p(y,(e=>"add"===e.type)).concat(t).map((t=>({...t,renderItem:()=>t.label,type:t.key||t.type,pointer:e.pointer})))}function i(e,t,n){Object.assign(b,{point:e,show:!0,target:t,list:n})}}(e),1===e.button&&n){n=!1;const e=le();e.length>0?re((()=>{const t=function(e){const t=e.reduce(((e,t)=>{const{key:n}=t.origin;return e[n]=e[n]?e[n].concat(t.origin):[t.origin],e}),{});return Object.keys(t).map((e=>{const n=t[e].sort(((e,t)=>Date.parse(e.data.time)-Date.parse(t.data.time)));return ce(n[0],"remove",n.length),n.map((e=>({...g(e,["selfKey","lineAttr"]),key:e.selfKey})))}))}(e);L("remove",t)})):r.emit(H)}})),x.value.on("mouse:down",(e=>{1!==e.button||e.target||(n=!0,i=e.pointer)})),x.value.on("mouse:move",(o=>{if(function(e){if(!P||b.show)return;const{target:t,pointer:n}=e,{x:i=0,y:o=0}=n;w.movable=!1,(i<K||i>X)&&(w.show=!1);if(!t&&i>=K&&i<=X){const e=o>=V&&o<=Y,l=o>=B&&o<=G;if(e||l){const l=j(i);w.sourceData=e?R.map((e=>{const{type:t,title:n,unit:i}=e;return{type:t,title:n,unit:i,time:l,value:I(t,o)}})):[{type:"tree",time:l}],w.isTarget=!!t,w.point=n,w.movable=!0}else w.show=!1}}(o),!n)return;const{x:l,y:r}=i,{x:a,y:s}=o.pointer;H&&x.value.remove(H),H=new e.Rect({...t,fill:"#CAF982",opacity:.4,...E,left:l>a?a:l,top:r>s?s:r,width:Math.abs(a-l),height:Math.abs(s-r),objectCaching:!0}),H.areaPos={startPos:i,endPos:o.pointer},x.value.add(H)}))}(),{redrawPoints:de,clickMenu:function({item:e,target:t}){var n;const{type:i,origin:o,pointer:l}=e,r={...o};o||Object.assign(r,{data:{time:j(l.x)},type:null}),p(y,(e=>"edit"!==e.type)).map((e=>e.type)).includes(i)?("remove"===i&&ce(r,"remove"),L(i,r)):null==(n=N.click)||n.call(N,i,r)},moveLimit:ge,setPopup:me,updateData:ce,getGridPoints:ye,getContainPoints:le,showDialog:re,removeCurrentSelection:ae,pauseFlickerPoint:ne}}export{x as useCenter};
+import { fabric } from '../../../../../shared/utils/fabricjs/index.js';
+import { defaultStyle, drawLine, drawPoint } from '../useDraw.js';
+import { useGrid } from '../useGrid.js';
+import { useBirthProcessCumputedPoint } from '../useCumputedPoint.js';
+import { bus } from '../useEvent.js';
+import '../useShadow.js';
+import { useCommon } from '../useCommon.js';
+import 'vue';
+import { nearlyEqual, getIndex, isEffectiveNode, getTime } from '../../utils/index.js';
+import { cloneDeep, filter, last, omit, flatten } from 'lodash-es';
+import 'date-fns';
+import { OTHER_MENU } from '../../constants/index.js';
+import '@vueuse/shared';
+import 'naive-ui';
+import './useTop.js';
+import './useOther.js';
+import '../../../../../shared/utils/index.js';
+import { useIntervalFn } from '@vueuse/core';
+
+function useCenter(canvas, propItems, emits, pointTipProps, pointMenuProps, isPopupTipRender) {
+  const {
+    computedX,
+    computedY,
+    getXValue,
+    getYValue
+  } = useBirthProcessCumputedPoint(propItems);
+  const {
+    xCellWidth,
+    pointSelectionStyle,
+    originX,
+    endX,
+    originY,
+    endY,
+    event,
+    scaleValues,
+    xAxis,
+    startTime,
+    timeXCell,
+    itemList,
+    dialog,
+    topGridOriginY,
+    topGridEndY,
+    extraMenuConfig,
+    grid
+  } = propItems;
+  const gridPointsMap = /* @__PURE__ */ new Map();
+  const batchAddPoints = /* @__PURE__ */ new Set();
+  let yScaleValue = cloneDeep(scaleValues);
+  let batchAddDatas = [], currentSelection = null;
+  const flickerablePoints = /* @__PURE__ */ new Set();
+  useGrid(canvas, propItems);
+  const {
+    getEqualXTypes,
+    handleAddPrevent,
+    setPrevAndNextPoint,
+    getPointEventProps
+  } = useCommon(canvas, emits, propItems);
+  const {
+    pause: pauseFlickerPoint,
+    resume
+  } = useIntervalFn(() => {
+    handleFlickerPoint();
+  }, 800);
+  init();
+  setCanvasEvent();
+  function init() {
+    yScaleValue.forEach((scaleValue) => {
+      const {
+        range = [],
+        spaceValue
+      } = scaleValue;
+      if (!spaceValue || !range[0] && !range[1])
+        return;
+      scaleValue.dataList.forEach((item, dataIndex) => {
+        if (!item.show)
+          return;
+        drawCordonLine(item, scaleValue);
+        drawPolyLine(item, dataIndex, scaleValue);
+      });
+    });
+  }
+  function handleFlickerPoint() {
+    if (!flickerablePoints.size)
+      return;
+    for (const point of flickerablePoints) {
+      point.set("opacity", point.opacity === 1 ? 0.5 : 1);
+    }
+    canvas.value.renderAll();
+  }
+  function setCanvasEvent() {
+    if (!event.evented)
+      return;
+    let isDrawing = false, startPos = {
+      x: 0,
+      y: 0
+    };
+    canvas.value.on("mouse:up", (event2) => {
+      if (event2.button === 3) {
+        handleRightClick(event2);
+      }
+      if (event2.button === 1) {
+        if (isDrawing) {
+          isDrawing = false;
+          const containPoints = getContainPoints();
+          if (containPoints.length > 0) {
+            showDialog(() => {
+              const params = doDeletePoints(containPoints);
+              emits("remove", params);
+            });
+          } else {
+            bus.emit(currentSelection);
+          }
+        }
+      }
+    });
+    canvas.value.on("mouse:down", (event2) => {
+      if (event2.button !== 1 || event2.target)
+        return;
+      isDrawing = true;
+      startPos = event2.pointer;
+    });
+    canvas.value.on("mouse:move", (event2) => {
+      handlePopupData(event2);
+      if (!isDrawing)
+        return;
+      const {
+        x: x1,
+        y: y1
+      } = startPos;
+      const {
+        x: x2,
+        y: y2
+      } = event2.pointer;
+      currentSelection && canvas.value.remove(currentSelection);
+      currentSelection = new fabric.Rect({
+        ...defaultStyle,
+        fill: "#CAF982",
+        opacity: 0.4,
+        ...pointSelectionStyle,
+        left: x1 > x2 ? x2 : x1,
+        top: y1 > y2 ? y2 : y1,
+        width: Math.abs(x2 - x1),
+        height: Math.abs(y2 - y1),
+        objectCaching: true
+      });
+      currentSelection.areaPos = {
+        startPos,
+        endPos: event2.pointer
+      };
+      canvas.value.add(currentSelection);
+    });
+  }
+  function handlePopupData(event2) {
+    if (!isPopupTipRender || pointMenuProps.show)
+      return;
+    const {
+      target,
+      pointer
+    } = event2;
+    const {
+      x = 0,
+      y = 0
+    } = pointer;
+    pointTipProps.movable = false;
+    if (x < originX || x > endX)
+      pointTipProps.show = false;
+    if (!target && x >= originX && x <= endX) {
+      const isMainGrid = y >= originY && y <= endY;
+      const isTopGrid = y >= topGridOriginY && y <= topGridEndY;
+      if (isMainGrid || isTopGrid) {
+        const time = getXValue(x);
+        if (isMainGrid) {
+          pointTipProps.sourceData = yScaleValue.map((scaleValue) => {
+            const {
+              type,
+              title,
+              unit
+            } = scaleValue;
+            return {
+              type,
+              title,
+              unit,
+              time,
+              value: getYValue(type, y)
+            };
+          });
+        } else {
+          pointTipProps.sourceData = [{
+            type: "tree",
+            time
+          }];
+        }
+        pointTipProps.isTarget = target ? true : false;
+        pointTipProps.point = pointer;
+        pointTipProps.movable = true;
+      } else {
+        pointTipProps.show = false;
+      }
+    }
+  }
+  function getContainPoints(gridPoints = []) {
+    if (!(currentSelection == null ? void 0 : currentSelection.areaPos))
+      return [];
+    const {
+      startPos,
+      endPos
+    } = currentSelection.areaPos;
+    const [x1, x2] = [startPos.x, endPos.x].sort((a, b) => a - b);
+    const [y1, y2] = [startPos.y, endPos.y].sort((a, b) => a - b);
+    const newGridPoints = gridPoints.length ? gridPoints : getGridPoints();
+    return newGridPoints.filter((point) => point.left >= x1 && point.left <= x2 && point.top >= y1 && point.top <= y2);
+  }
+  function showDialog(callback) {
+    var _a, _b, _c, _d;
+    dialog.warning({
+      maskClosable: false,
+      closeOnEsc: false,
+      title: ((_a = window.getLanguageByCode) == null ? void 0 : _a.call(window, "10010.1.228")) || "\u8B66\u544A",
+      content: ((_b = window.getLanguageByCode) == null ? void 0 : _b.call(window, "10010.1.229")) || "\u786E\u8BA4\u5220\u9664\u5F53\u524D\u9009\u4E2D\u7684\u8282\u70B9\uFF1F",
+      positiveText: ((_c = window.getLanguageByCode) == null ? void 0 : _c.call(window, "10010.1.27")) || "\u786E\u5B9A",
+      negativeText: ((_d = window.getLanguageByCode) == null ? void 0 : _d.call(window, "10010.1.28")) || "\u53D6\u6D88",
+      onPositiveClick: () => {
+        callback();
+        removeCurrentSelection();
+      },
+      onNegativeClick: () => removeCurrentSelection(),
+      onClose: () => removeCurrentSelection()
+    });
+  }
+  function doDeletePoints(points) {
+    const result = points.reduce((res, currentPoint) => {
+      const {
+        key
+      } = currentPoint.origin;
+      res[key] = res[key] ? res[key].concat(currentPoint.origin) : [currentPoint.origin];
+      return res;
+    }, {});
+    return Object.keys(result).map((key) => {
+      const sortData = result[key].sort((prev, next) => Date.parse(prev.data.time) - Date.parse(next.data.time));
+      updateData(sortData[0], "remove", sortData.length);
+      return sortData.map((item) => ({
+        ...omit(item, ["selfKey", "lineAttr"]),
+        key: item.selfKey
+      }));
+    });
+  }
+  function removeCurrentSelection() {
+    currentSelection && canvas.value.remove(currentSelection);
+    currentSelection = null;
+  }
+  function handleRightClick(event2) {
+    pointTipProps.show = false;
+    const {
+      x = 0,
+      y = 0
+    } = event2.pointer || {};
+    if (x >= originX && x <= endX && y >= originY && y <= endY) {
+      if (!event2.target) {
+        setPointMenuProps(event2.pointer, null, []);
+        const {
+          menuList = []
+        } = extraMenuConfig;
+        pointMenuProps.list = filter(OTHER_MENU, (o) => o.type === "add").concat(menuList).map((item) => {
+          return {
+            ...item,
+            renderItem: () => item.label,
+            type: item.key || item.type,
+            pointer: event2.pointer
+          };
+        });
+      } else {
+        if (event2.target.__type !== "main")
+          return;
+        const point = event2.target;
+        setPointMenuProps({
+          x: point.left,
+          y: point.top
+        }, event2.target, []);
+        pointMenuProps.list = filter(OTHER_MENU, (o) => o.type !== "edit").map((item) => {
+          return {
+            ...item,
+            renderItem: () => item.label,
+            type: item.key || item.type,
+            pointer: {
+              x: point.left,
+              y: point.top
+            },
+            ...item.type === "add" ? {} : {
+              origin: {
+                ...point.origin
+              }
+            }
+          };
+        });
+      }
+    }
+    function setPointMenuProps(point, target, list) {
+      Object.assign(pointMenuProps, {
+        point,
+        show: true,
+        target,
+        list
+      });
+    }
+  }
+  function clickMenu({
+    item,
+    target
+  }) {
+    var _a;
+    const {
+      type,
+      origin,
+      pointer
+    } = item;
+    const params = {
+      ...origin
+    };
+    if (!origin) {
+      Object.assign(params, {
+        data: {
+          time: getXValue(pointer.x)
+        },
+        type: null
+      });
+    }
+    if (filter(OTHER_MENU, (o) => o.type !== "edit").map((item2) => item2.type).includes(type)) {
+      if (type === "remove") {
+        updateData(params, "remove");
+      }
+      emits(type, params);
+    } else {
+      (_a = extraMenuConfig.click) == null ? void 0 : _a.call(extraMenuConfig, type, params);
+    }
+  }
+  function drawCordonLine(item, scaleValue) {
+    const {
+      max: panicMax = {},
+      min: panicMin = {}
+    } = item.panicValue || {};
+    const {
+      max: diffMax = {},
+      min: diffMin = {}
+    } = item.diffValue || {};
+    drawHorizontalLine(panicMax);
+    drawHorizontalLine(panicMin);
+    drawHorizontalLine(diffMax);
+    drawHorizontalLine(diffMin);
+    function drawHorizontalLine({
+      show = false,
+      value,
+      name,
+      lineStyle
+    }) {
+      if (!show || !value)
+        return;
+      const y = computedY(scaleValue.type, scaleValue.range, value);
+      const line = drawLine([originX, y, endX, y], {
+        ...lineStyle,
+        evented: true,
+        lockMovementX: true,
+        lockMovementY: true,
+        hoverCursor: "pointer"
+      });
+      if (event.hovered && name) {
+        line.on("mousemove", ({
+          pointer
+        }) => {
+          pointTipProps.point = {
+            ...pointer || {
+              x: line.left,
+              y: line.top
+            }
+          };
+          pointTipProps.list = [`${name} ${value}${scaleValue.unit || ""}`];
+          pointTipProps.show = true;
+        });
+        line.on("mouseout", () => {
+          pointTipProps.show = false;
+        });
+      }
+      canvas.value.add(line);
+    }
+  }
+  function initFlickerablePoints(type, dataIndex) {
+    if (!flickerablePoints.size)
+      return;
+    [...flickerablePoints].forEach((point) => {
+      const {
+        dataIndex: selfDataIndex,
+        type: selfType
+      } = point.origin;
+      if (selfDataIndex === dataIndex && selfType === type) {
+        flickerablePoints.delete(point);
+      }
+    });
+  }
+  function setFlickerablePoints(pointList, item) {
+    const {
+      max: panicMax = {},
+      min: panicMin = {}
+    } = item.panicValue || {};
+    const {
+      max: diffMax = {},
+      min: diffMin = {}
+    } = item.diffValue || {};
+    addFlickerablePoints(panicMax, "max");
+    addFlickerablePoints(panicMin, "min");
+    addFlickerablePoints(diffMax, "max");
+    addFlickerablePoints(diffMin, "min");
+    function addFlickerablePoints({
+      show = false,
+      value,
+      flickerable
+    }, type) {
+      if (show || !value || !flickerable)
+        return;
+      pointList.forEach((point) => {
+        const selfValue = point.origin.data.value;
+        if (type === "max" && selfValue < value || type === "min" && selfValue > value)
+          return;
+        flickerablePoints.add(point);
+      });
+    }
+  }
+  function drawPolyLine(item, dataIndex, scaleValue) {
+    var _a;
+    const {
+      type,
+      unit,
+      dataList = []
+    } = scaleValue;
+    const lineList = [];
+    gridPointsMap.set(item.key, []);
+    initFlickerablePoints(type, dataIndex);
+    (_a = item.list) == null ? void 0 : _a.forEach((v, index) => {
+      const points = getPointer(v, scaleValue);
+      drawPointLine(points, v, index, item);
+    });
+    Promise.all(gridPointsMap.get(item.key)).then((res) => {
+      const lineListFilter = lineList.filter((v) => v);
+      setPrevAndNextPoint(res);
+      canvas.value.add(...lineListFilter, ...res);
+      setFlickerablePoints(res, item);
+    });
+    function drawPointLine(points, v, index, item2) {
+      var _a2;
+      let point;
+      let line;
+      let currentItem = item2;
+      if (v.key) {
+        currentItem = dataList.find((item3) => item3.key === v.key);
+      }
+      const {
+        pointAttr = {},
+        lineAttr = {},
+        title = "",
+        key,
+        type: pointType = "circle"
+      } = currentItem;
+      const nextV = item2.list[index + 1];
+      const nextPoint = getPointer(nextV, scaleValue);
+      if (points && nextPoint && !v.breakpoint && points[0] !== nextPoint[0] && (!grid.breakpoint || grid.breakpoint && nextPoint[0] - points[0] <= xCellWidth)) {
+        line = drawLine([...points, ...nextPoint], lineAttr);
+      }
+      const previousLine = lineList[index - 1];
+      const pointAttrNew = {
+        origin: {
+          data: v,
+          title,
+          key: item2.key,
+          selfKey: key,
+          unit,
+          type,
+          dataIndex,
+          index,
+          lineAttr
+        },
+        __type: "main",
+        leftLine: previousLine,
+        rightLine: line,
+        ...pointAttr,
+        ...getPointEventProps()
+      };
+      if (points) {
+        if (!previousLine) {
+          pointAttrNew.leftLine = null;
+        }
+        point = drawPoint(pointType, {
+          left: points[0],
+          top: points[1],
+          ...pointAttrNew
+        });
+      }
+      lineList.push(line);
+      if (point) {
+        point.originLeft = point.left;
+        point.originTop = point.top;
+        setPointEvent(point);
+        (_a2 = gridPointsMap.get(item2.key)) == null ? void 0 : _a2.push(point);
+      }
+    }
+  }
+  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);
+      doBatchAdd(point);
+    });
+    point.on("mouseup", (event2) => {
+      pointTipProps.show = false;
+      if (event2.button === 1) {
+        const {
+          type,
+          selfKey,
+          dataIndex
+        } = point.origin;
+        const params = {
+          ...point.origin,
+          data: {
+            ...point.origin.data,
+            time: getXValue(point.left),
+            value: getYValue(type, point.top)
+          }
+        };
+        canvas.value.discardActiveObject();
+        if (batchAddDatas.length > 0) {
+          const obj = yScaleValue.find((v) => v.type === type);
+          let coincideIndex = -1;
+          const isRight = last(batchAddDatas).left > point.originLeft;
+          const data = batchAddDatas.map((item) => item.data);
+          if (isRight && point.nextPoint || !isRight) {
+            if (point.scaleX !== 2.5) {
+              redrawPoints({
+                dataIndex,
+                scaleValue: obj
+              });
+              return;
+            }
+            const lastOrigin = point.coincidePoint.origin;
+            const lastData = lastOrigin.data;
+            coincideIndex = lastOrigin.index;
+            const index = data.findIndex((item) => item.time === lastData.time);
+            if (index > -1) {
+              data.splice(index, 1);
+            }
+            if (!isRight) {
+              data.reverse();
+              coincideIndex = point.origin.index;
+            }
+          }
+          const actualDataIndex = obj.dataList.findIndex((item) => item.key === selfKey);
+          emits("add", {
+            ...omit(params, ["index", "selfKey", "lineAttr"]),
+            dataIndex: actualDataIndex,
+            key: selfKey,
+            data
+          });
+          updateData({
+            ...params,
+            data,
+            coincideIndex
+          });
+        } else {
+          emits("change", {
+            ...omit(params, ["selfKey", "lineAttr"]),
+            key: selfKey
+          });
+          updateData(params, "change");
+        }
+      }
+    });
+  }
+  function doCoincide(sameKeyPoints, point) {
+    const {
+      left,
+      top,
+      origin
+    } = point;
+    const rangeWidth = xCellWidth / 2;
+    const index = sameKeyPoints.findIndex((_point) => Math.abs(left - _point.left) < rangeWidth && Math.abs(top - _point.top) < rangeWidth && origin.index !== _point.origin.index);
+    if (index > -1) {
+      point.set({
+        scaleX: 2.5,
+        scaleY: 2.5
+      });
+      point.coincidePoint = sameKeyPoints[index];
+    } else {
+      point.set({
+        scaleX: point.scale,
+        scaleY: point.scale
+      });
+    }
+  }
+  function setPointColor(point, color) {
+    ["stroke", "fill"].forEach((attr) => {
+      const colorValue = point[attr];
+      if (colorValue && !["transparent", "#fff", "#ffffff", "#FFFFFF"].includes(colorValue) && colorValue !== color) {
+        point.set(attr, color);
+      }
+    });
+    if (point.rightLine && ![color, "transparent"].includes(point.rightLine.stroke)) {
+      point.rightLine.set("stroke", color);
+    }
+  }
+  function removeCachePoints(point, isRight = true) {
+    var _a, _b, _c, _d;
+    const {
+      left,
+      originLeft
+    } = point;
+    if ((batchAddDatas == null ? void 0 : batchAddDatas.length) > 0) {
+      for (const __point of batchAddPoints) {
+        if (isRight && (__point.left > left || __point.left < originLeft) || !isRight && (__point.left < left || __point.left > originLeft)) {
+          if (__point.left < left || __point.left > originLeft) {
+            __point.leftLine && canvas.value.remove(__point.leftLine);
+            __point.rightLine && canvas.value.remove(__point.rightLine);
+            canvas.value.remove(__point);
+          }
+        }
+      }
+      batchAddDatas = batchAddDatas.filter((item) => isRight && item.left <= left && item.left > originLeft || !isRight && item.left >= left && item.left < originLeft);
+      if (batchAddDatas.length === 0) {
+        (_b = (_a = point.leftLine) == null ? void 0 : _a.set) == null ? void 0 : _b.call(_a, point.prevPoint.origin.lineAttr);
+        (_d = (_c = point.rightLine) == null ? void 0 : _c.set) == null ? void 0 : _d.call(_c, point.origin.lineAttr);
+        for (const __point of batchAddPoints) {
+          __point.leftLine && canvas.value.remove(__point.leftLine);
+          canvas.value.remove(__point);
+        }
+      }
+      if (batchAddDatas.length > 0) {
+        const lastItem = last(batchAddDatas);
+        point.prevPointer = [lastItem.left, lastItem.top];
+      }
+    }
+  }
+  function doBatchAdd(point) {
+    var _a, _b, _c, _d;
+    const {
+      originLeft,
+      originTop,
+      left,
+      top,
+      origin
+    } = point;
+    const n = ~~(Math.abs(left - originLeft) / xCellWidth);
+    const isRight = left > originLeft;
+    if (Math.abs(left - originLeft) > xCellWidth) {
+      if (batchAddDatas.length === 0) {
+        let leftLineX1Y1 = point.leftLine ? [point.leftLine.x1, point.leftLine.y1] : [originLeft, originTop];
+        if (!isRight) {
+          leftLineX1Y1 = point.rightLine ? [point.rightLine.x2, point.rightLine.y2] : [originLeft, originTop];
+        }
+        copyPoint(point, [...leftLineX1Y1, originLeft, originTop]);
+        (_b = (_a = point.leftLine) == null ? void 0 : _a.set) == null ? void 0 : _b.call(_a, "stroke", "transparent");
+        (_d = (_c = point.rightLine) == null ? void 0 : _c.set) == null ? void 0 : _d.call(_c, "stroke", "transparent");
+      }
+      const spaceWidth = xCellWidth * n;
+      const newLeft = isRight ? originLeft + spaceWidth : originLeft - spaceWidth;
+      if (batchAddDatas.every((item) => !nearlyEqual(item.left, newLeft))) {
+        const time = getXValue(newLeft);
+        const value = getYValue(origin.type, top);
+        batchAddDatas.push({
+          data: {
+            time,
+            value,
+            ...origin.selfKey !== origin.key ? {
+              key: origin.selfKey
+            } : {}
+          },
+          left: newLeft,
+          top
+        });
+        copyPoint(point, [...point.prevPointer, newLeft, top], isRight);
+      }
+      if (batchAddDatas.length < n) {
+        patchPoint(point, n, isRight);
+      }
+      if (isRight && point.nextPoint || !isRight && point.prevPoint) {
+        const sameKeyPoints = gridPointsMap.get(origin.key);
+        doCoincide(sameKeyPoints, point);
+        sameKeyPoints == null ? void 0 : sameKeyPoints.forEach((_point) => {
+          if (nearlyEqual(_point.left, originLeft) || origin.index === _point.origin.index)
+            return;
+          if (isRight && _point.left > originLeft && _point.left < left || !isRight && _point.left < originLeft && _point.left > left) {
+            setPointColor(_point, "#999");
+          } else {
+            setPointColor(_point, _point.origin.lineAttr.stroke);
+          }
+        });
+      }
+    }
+    removeCachePoints(point, isRight);
+  }
+  function patchPoint(point, n, isRight = true) {
+    const {
+      originLeft,
+      originTop,
+      origin
+    } = point;
+    let k = 1;
+    while (k <= n) {
+      const spaceWidth = xCellWidth * k;
+      const currentLeft = isRight ? originLeft + spaceWidth : originLeft - spaceWidth;
+      const hasPoint = batchAddDatas.some((item) => Math.abs(item.left - currentLeft) <= 1);
+      if (!hasPoint) {
+        let index = 0;
+        const item = batchAddDatas.find((item2, idx) => {
+          if (isRight) {
+            if (item2.left > currentLeft)
+              index = idx;
+            return item2.left > currentLeft;
+          } else {
+            if (item2.left < currentLeft)
+              index = idx;
+            return item2.left < currentLeft;
+          }
+        });
+        if (item) {
+          const addItem = JSON.parse(JSON.stringify(item));
+          const prevPoint = batchAddDatas[index - 1] || {
+            left: originLeft,
+            top: originTop
+          };
+          const len = ~~(Math.abs(item.left - (isRight ? currentLeft - xCellWidth : currentLeft + xCellWidth)) / xCellWidth);
+          const spaceHeight = (item.top - prevPoint.top) / len;
+          addItem.top = prevPoint.top + spaceHeight;
+          addItem.left = currentLeft;
+          addItem.data = {
+            time: getXValue(currentLeft),
+            value: getYValue(origin.type, addItem.top),
+            ...origin.selfKey !== origin.key ? {
+              key: origin.selfKey
+            } : {}
+          };
+          batchAddDatas.splice(index, 0, addItem);
+          copyPoint(point, [prevPoint.left, prevPoint.top, addItem.left, addItem.top], isRight);
+        }
+      }
+      k++;
+    }
+  }
+  function copyPoint(point, linePointer, isRight = true) {
+    const [x1, , x2, y2] = linePointer;
+    point.clone((newPoint) => {
+      newPoint.set({
+        left: x2,
+        top: y2,
+        scaleX: 1,
+        scaleY: 1
+      });
+      point.prevPointer = [x2, y2];
+      const line = drawLine(linePointer, point.leftLine && nearlyEqual(x1, point.leftLine.x1) ? point.prevPoint.origin.lineAttr : point.origin.lineAttr);
+      if (isRight) {
+        newPoint.leftLine = line;
+      } else {
+        newPoint.rightLine = line;
+      }
+      batchAddPoints.add(newPoint);
+      canvas.value.add(line, newPoint);
+    });
+  }
+  function updateData(params, mode = "add", n = 1) {
+    const {
+      data,
+      index,
+      key,
+      type,
+      coincideIndex,
+      linkKey
+    } = params;
+    let {
+      dataIndex
+    } = params;
+    const obj = yScaleValue.find((v) => v.type === type);
+    const item = obj.dataList.find((v, index2) => {
+      dataIndex = index2;
+      const _key = linkKey || key;
+      return v.key === _key;
+    });
+    switch (mode) {
+      case "remove":
+        item.list.splice(index, n);
+        if (item.list[index - 1]) {
+          item.list[index - 1].breakpoint = true;
+        }
+        break;
+      case "change":
+        item.list[index] = data;
+        break;
+      default: {
+        const time = Array.isArray(data) ? data[0].time : data.time;
+        const index2 = getIndex(time, item.list, true);
+        const newData = Array.isArray(data) ? data : [data];
+        item.list.splice(index2, coincideIndex > -1 ? coincideIndex - index2 : 0, ...newData);
+        break;
+      }
+    }
+    redrawPoints({
+      dataIndex,
+      scaleValue: obj
+    });
+  }
+  function redrawPoints(ItemObj) {
+    var _a, _b, _c;
+    batchAddPoints.size && ((_a = canvas.value) == null ? void 0 : _a.remove(...doRemovePoints([...batchAddPoints])));
+    batchAddPoints.clear();
+    batchAddDatas = [];
+    if (ItemObj) {
+      const {
+        dataIndex,
+        scaleValue
+      } = ItemObj;
+      const item = scaleValue.dataList[dataIndex];
+      (_b = canvas.value) == null ? void 0 : _b.remove(...doRemovePoints(gridPointsMap.get(item.key)));
+      gridPointsMap.delete(item.key);
+      drawPolyLine(item, dataIndex, scaleValue);
+    } else {
+      yScaleValue = cloneDeep(scaleValues);
+      gridPointsMap.size && ((_c = canvas.value) == null ? void 0 : _c.remove(...doRemovePoints(getGridPoints())));
+      gridPointsMap.clear();
+      init();
+    }
+  }
+  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);
+    });
+    return removePoints;
+  }
+  function setPopup(point, status = "moving") {
+    const {
+      title,
+      type,
+      data,
+      unit,
+      selfKey
+    } = point.origin;
+    pointTipProps.point = {
+      x: point.left,
+      y: point.top
+    };
+    const time = getXValue(point.left);
+    const value = `${status === "hover" ? data.value : getYValue(type, point.top)}`;
+    pointTipProps.list = [`${title} ${value}${unit || ""}`, `\u65F6\u95F4 ${time.slice(-5)}`];
+    pointTipProps.sourceData = [{
+      type,
+      title,
+      unit,
+      key: selfKey,
+      time,
+      value
+    }];
+    pointTipProps.isTarget = true;
+    pointTipProps.show = true;
+  }
+  function moveLimit(point, limitRight = endX) {
+    point.setCoords();
+    const limitLeft = originX;
+    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 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
+    });
+  }
+  function getPointer(v, item) {
+    if (isEffectiveNode(v) && isLimit(v.time)) {
+      const x = computedX(v.time);
+      const y = computedY(item.type, item.range, v.value);
+      return [x, y < originY ? originY : y > endY ? endY : y];
+    }
+  }
+  function isLimit(time) {
+    const maxTime = Date.parse(last(xAxis.list));
+    const _time = getTime(time);
+    return _time >= startTime && _time <= maxTime;
+  }
+  function getGridPoints() {
+    return flatten(Array.from(gridPointsMap.values()));
+  }
+  return {
+    redrawPoints,
+    clickMenu,
+    moveLimit,
+    setPopup,
+    updateData,
+    getGridPoints,
+    getContainPoints,
+    showDialog,
+    removeCurrentSelection,
+    pauseFlickerPoint
+  };
+}
+
+export { useCenter };