https://www.mykcm.com/assets/CanvasTableElement.vue-BR6SkURr.js

1import{gD as se,gF as de,gG as Z,gH as J,gE as ce,gI as l,gJ as ue,gK as q,gL as fe,gM as ge,gN as me,gO as he,gP as ee,gQ as Ee}from"./index-B9Tnya_p.js";import{k as Te,Q as Ae,G,K as E,s as z,x as _e,M as te,l as D,F as S,E as K,H as pe,y as Ce,j as Re,d as H}from"./vendor-B4gcsg9q.js";function Le(){const{resolveColor:N,isBrandColor:b}=se();function O(c){if(!c||!c.trim())return[{text:"",isBold:!1,isItalic:!1,isUnderline:!1}];const a=document.createElement("textarea");a.innerHTML=Z(c);const f=a.value,T=document.createElement("div");T.innerHTML=Z(f);const A=[];function v(i,F=!1,w=!1,B=!1){if(i.nodeType===Node.TEXT_NODE){const _=i.textContent||"";_&&A.push({text:_,isBold:F,isItalic:w,isUnderline:B})}else if(i.nodeType===Node.ELEMENT_NODE){const _=i,h=_.tagName.toLowerCase(),p=F||h==="b"||h==="strong",C=w||h==="i"||h==="em",P=B||h==="u";Array.from(_.childNodes).forEach(U=>{v(U,p,C,P)})}}return Array.from(T.childNodes).forEach(i=>{v(i)}),A.length===0?[{text:c.replace(/<[^>]*>/g,""),isBold:!1,isItalic:!1,isUnderline:!1}]:A}function e(c){const a=O(c),f=a.map(i=>i.text).join(""),T=a.length>0&&a.every(i=>i.isBold),A=a.length>0&&a.every(i=>i.isItalic),v=a.length>0&&a.every(i=>i.isUnderline);return{text:f,isBold:T,isItalic:A,isUnderline:v}}function I(c,a=1){if(!c)return"transparent";const f=(b(c),N(c));if(a>=1)return f;try{return de(f).alpha(a).css()}catch{return f}}return{parseHTMLText:e,parseHTMLToSegments:O,resolveColorWithAlpha:I}}const ve={dashed:J.DASHED_PATTERN,dotted:J.DOTTED_PATTERN};function xe(N){return ve[N]}const De=Te({__name:"CanvasTableElement",props:{element:{},isSelected:{type:Boolean},isDraggable:{type:Boolean,default:!0}},emits:["update","select","edit-cell"],setup(N,{expose:b,emit:O}){const e=N,I=O,{parseHTMLToSegments:c,resolveColorWithAlpha:a}=Le(),f=Re(),{currentPosition:T,handleClick:A,handleDragMove:v,handleDragEnd:i,selectionConfig:F,getKonvaNode:w}=ce({element:()=>e.element,elementRef:f,emit:I,selectionOverride:{x:()=>-2,y:()=>-2,rotation:()=>0,fill:l.TRANSPARENT}});Ae(()=>{const o=f.value?.getNode?.();o&&(o.on("click",A),o.on("dragmove",v),o.on("dragend",i))}),b({getKonvaNode:w});const B=H(()=>({x:T.value.x,y:T.value.y,rotation:e.element.rotation||0,draggable:e.isDraggable})),_=H(()=>({x:0,y:0,width:e.element.size.width,height:e.element.size.height,fill:l.TRANSPARENT,listening:!0})),h=H(()=>{if(e.element.options?.firstColumnAsHeader??l.FIRST_COLUMN_AS_HEADER){const o=["",...e.element.data.headers],d=e.element.data.firstColumnLabels||[],t=e.element.data.rows.map((n,u)=>[d[u]||Ee(u),...n]);return[o,...t]}return[e.element.data.headers,...e.element.data.rows]}),p=H(()=>{const o=e.element.options?.firstColumnAsHeader??l.FIRST_COLUMN_AS_HEADER?e.element.columns+1:e.element.columns;return e.element.size.width/o}),C=H(()=>e.element.size.height/e.element.rows);function P(o,d){const t=e.element.options||{},n=t.firstColumnAsHeader??l.FIRST_COLUMN_AS_HEADER;return ee(o,d,n)?a(t.headerBackgroundColor,t.headerBackgroundAlpha??1):t.enableAlternatingRows&&o%2===0?a(t.alternateRowColor,t.alternateRowAlpha??1):a(t.cellBackgroun

1dColor,t.cellBackgroundAlpha??1)}function U(o,d){const t=e.element.options||{},n=t.borderStyle||l.BORDER_STYLE,u=n!=="none"&&(t.showCellBorders??l.SHOW_CELL_BORDERS),r={x:d*p.value,y:o*C.value,width:p.value,height:C.value,fill:P(o,d),stroke:u?a(t.borderColor||l.BORDER_COLOR,t.borderAlpha??1):l.TRANSPARENT,strokeWidth:u?t.borderWidth??l.BORDER_WIDTH:0,listening:!1},s=xe(n);return s&&u&&(r.dash=s),r}function ne(o,d,t){const n=e.element.options||{},u=n.firstColumnAsHeader??l.FIRST_COLUMN_AS_HEADER,r=ee(o,d,u),s=ue.replace(q(t)),R=c(s),m=r?n.headerFontFamily??l.HEADER_FONT_FAMILY:n.cellFontFamily??l.CELL_FONT_FAMILY,L=r?n.headerFontSize??l.HEADER_FONT_SIZE:n.cellFontSize??l.CELL_FONT_SIZE,$=r?n.headerFontWeight??l.HEADER_FONT_WEIGHT:n.cellFontWeight??l.CELL_FONT_WEIGHT,oe=r?a(n.headerTextColor||l.HEADER_TEXT_COLOR,n.headerTextAlpha??1):a(n.cellTextColor||l.CELL_TEXT_COLOR,n.cellTextAlpha??1),X=r?n.headerTextAlign??l.HEADER_TEXT_ALIGN:n.cellTextAlign??l.CELL_TEXT_ALIGN,M=r?n.headerPadding??l.HEADER_PADDING:n.cellPadding??l.CELL_PADDING,ae=d*p.value+M,re=o*C.value+M,ie=C.value-M*2,V=p.value-M*2,Y=R.map(g=>{const x=fe($,g.isBold,g.isItalic),k=new ge.Text({text:g.text,fontSize:L,fontFamily:m,fontStyle:x,textDecoration:g.isUnderline?"underline":""}),W=k.width();return k.destroy(),{segment:g,fontStyle:x,width:W}}),j=Y.reduce((g,x)=>g+x.width,0);let y=0;X==="center"?y=(V-j)/2:X==="right"&&(y=V-j),y=Math.max(0,y);let Q=y;return Y.map(({segment:g,fontStyle:x,width:k})=>{const W={x:ae+Q,y:re,text:g.text,fontSize:L,fontFamily:m,fontStyle:x,fill:oe,height:ie,verticalAlign:l.CELL_VERTICAL_ALIGN,textDecoration:g.isUnderline?"underline":"",listening:!1,wrap:"none"};return Q+=k,W})}function le(o){const d=o.target.getStage();if(!d)return;const t=d.getPointerPosition();if(!t)return;const{x:n,y:u}=me(t,d,e.element.position),r=Math.floor(n/p.value),s=Math.floor(u/C.value),R=e.element.options?.firstColumnAsHeader??l.FIRST_COLUMN_AS_HEADER,m=R?e.element.columns+1:e.element.columns;if(r<0||r>=m||s<0||s>=e.element.rows||R&&r===0&&s===0)return;const L=he(s,r,e.element.data,h.value,R);L!==void 0&&I("edit-cell",{rowIndex:s,colIndex:r,value:q(L),position:{x:t.x,y:t.y}})}return(o,d)=>

1{const t=G("v-rect"),n=G("v-text"),u=G("v-group");return E(),z(u,{ref_key:"tableRef",ref:f,config:B.value},{default:_e(()=>[te(t,{config:_.value,onDblclick:le},null,8,["config"]),(E(!0),D(S,null,K(h.value,(r,s)=>(E(),D(S,{key:`row-${s}`},[(E(!0),D(S,null,K(r,(R,m)=>(E(),D(S,{key:`cell-${s}-${m}`},[te(t,{config:U(s,m)},null,8,["config"]),(E(!0),D(S,null,K(ne(s,m,R),(L,$)=>(E(),z(n,{key:`segment-${s}-${m}-${$}`,config:L},null,8,["config"]))),128))],64))),128))],64))),128)),o.isSelected?(E(),z(t,{key:0,config:pe(F)},null,8,["config"])):Ce("",!0)]),_:1},8,["config"])}}});export{De as default};