2 lines
8.6 KiB
JavaScript
2 lines
8.6 KiB
JavaScript
const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["./rough.esm-DjrMDdlL.js","./package-Bop5TfAT.js","./runtime-core.esm-bundler-DO-WTVbd.js","./package-OvxnQO7z.css","./prod-B0HxyDM0.js","./chunk-K2UTITRG-BEkZoneJ.js","./chunk-SRAX5OIU-w1svEpmY.js","./chunk-ZUYEQ4TG-BzFOpW--.js","./chunk-6U3AYISY-C6-Mtja1.js","./chunk-Z3N5DIM6-D9TMVU7m.js"])))=>i.map(i=>d[i]);
|
|
import{h as e,p as t,r as n}from"./package-Bop5TfAT.js";import{D as r,X as i,Y as a,_ as o,f as s,h as c,i as l,o as u,r as d,s as f,y as p}from"./runtime-core.esm-bundler-DO-WTVbd.js";var m={class:`drawing-viewer`},h={class:`drawing-toolbar`},g={class:`drawing-title`},_={class:`drawing-actions`},v={class:`drawing-stage`},y={key:0,class:`drawing-state`},b={key:1,class:`drawing-state error`},x={class:`drawing-scroll`},S=`https://viewer.diagrams.net/js/viewer-static.min.js`,C=`http://www.w3.org/2000/svg`,w=6e3,T=e(s({__name:`DrawingViewer`,props:{data:{},type:{}},setup(e){let s=e,T=null,E=r(`loading`),D=r(``),O=r(null),k=r(1),A=d(()=>s.type.toLowerCase()),j=d(()=>A.value===`excalidraw`),M=d(()=>A.value===`dio`?`DRAWIO`:A.value.toUpperCase()),N=d(()=>j.value?{transform:`scale(${k.value})`,transformOrigin:`top center`}:{zoom:k.value}),P=e=>Math.min(3,Math.max(.5,Number(e.toFixed(2)))),F=()=>{k.value=P(k.value+.15)},I=()=>{k.value=P(k.value-.15)},L=()=>{k.value=1},R=()=>{let e=O.value;if(e)for(delete e.dataset.drawingRendered;e.firstChild;)e.removeChild(e.firstChild)},z=()=>window.GraphViewer?Promise.resolve():(T||=new Promise((e,t)=>{let n=document.querySelector(`script[src="${S}"]`);if(n){n.addEventListener(`load`,()=>e(),{once:!0}),n.addEventListener(`error`,()=>t(Error(`diagrams.net viewer 加载失败`)),{once:!0});return}let r=document.createElement(`script`);r.src=S,r.async=!0,r.onload=()=>e(),r.onerror=()=>t(Error(`diagrams.net viewer 加载失败`)),document.head.appendChild(r)}),T),B=(e,t=0)=>{let n=Number(e);return Number.isFinite(n)?n:t},V=e=>!e||e===`transparent`||e===`rgba(0, 0, 0, 0)`,H=e=>document.createElementNS(C,e),U=async(e,t,n)=>{let r;try{return await Promise.race([e,new Promise((e,i)=>{r=setTimeout(()=>i(Error(n)),t)})])}finally{r&&clearTimeout(r)}},W=(e,t)=>e.dataset.drawingRendered?!1:(e.dataset.drawingRendered=t,!0),G=(e,t,n)=>{W(e,n)&&(t.classList.add(`drawing-svg`),e.appendChild(t))},K=()=>{let e=console.error,t=(...t)=>{t.map(e=>String(e)).join(` `).includes(`Failed to use workers for subsetting`)||e(...t)};return console.error=t,()=>{console.error===t&&(console.error=e)}},q=e=>Array.isArray(e.points)&&e.points.length?e.points.map(t=>[B(e.x)+B(t[0]),B(e.y)+B(t[1])]):[[B(e.x),B(e.y)],[B(e.x)+B(e.width),B(e.y)+B(e.height)]],J=e=>{let t=q(e),n=t.map(e=>e[0]),r=t.map(e=>e[1]);return Array.isArray(e.points)||(n.push(B(e.x)+B(e.width)),r.push(B(e.y)+B(e.height))),{minX:Math.min(...n),minY:Math.min(...r),maxX:Math.max(...n),maxY:Math.max(...r)}},Y=e=>{let t=e.reduce((e,t)=>{let n=J(t);return{minX:Math.min(e.minX,n.minX),minY:Math.min(e.minY,n.minY),maxX:Math.max(e.maxX,n.maxX),maxY:Math.max(e.maxY,n.maxY)}},{minX:1/0,minY:1/0,maxX:-1/0,maxY:-1/0});return Number.isFinite(t.minX)?t:{minX:0,minY:0,maxX:800,maxY:480}},X=e=>{let t=V(e.backgroundColor)?void 0:e.backgroundColor;return{stroke:e.strokeColor||`#1e1e1e`,strokeWidth:Math.max(1,B(e.strokeWidth,1)),roughness:Math.max(0,B(e.roughness,1)),fill:t,fillStyle:e.fillStyle||`hachure`,seed:B(e.seed,1),strokeLineDash:e.strokeStyle===`dashed`?[10,8]:e.strokeStyle===`dotted`?[2,6]:void 0}},Z=(e,t,n)=>{let r=B(t.opacity,100)/100;r<1&&n.setAttribute(`opacity`,String(r)),e.appendChild(n)},Q=e=>{let t=H(`g`),n=B(e.angle);if(n){let r=B(e.x)+B(e.width)/2,i=B(e.y)+B(e.height)/2;t.setAttribute(`transform`,`rotate(${n*180/Math.PI} ${r} ${i})`)}return t},$=(e,t)=>{let n=String(t.text||``);if(!n.trim())return;let r=H(`text`),i=Math.max(8,B(t.fontSize,20)),a=i*1.25,o=n.split(/\r?\n/),s={1:`Virgil, Segoe Print, Comic Sans MS, sans-serif`,2:`Helvetica, Arial, sans-serif`,3:`Cascadia Mono, Menlo, Consolas, monospace`};r.setAttribute(`x`,String(B(t.x))),r.setAttribute(`y`,String(B(t.y)+i)),r.setAttribute(`fill`,t.strokeColor||`#1e1e1e`),r.setAttribute(`font-size`,String(i)),r.setAttribute(`font-family`,s[B(t.fontFamily,1)]||s[1]),r.setAttribute(`font-weight`,String(t.fontWeight||400)),r.setAttribute(`text-anchor`,t.textAlign===`center`?`middle`:t.textAlign===`right`?`end`:`start`),t.textAlign===`center`?r.setAttribute(`x`,String(B(t.x)+B(t.width)/2)):t.textAlign===`right`&&r.setAttribute(`x`,String(B(t.x)+B(t.width))),o.forEach((e,n)=>{let i=H(`tspan`);i.setAttribute(`x`,r.getAttribute(`x`)||String(B(t.x))),i.setAttribute(`dy`,n===0?`0`:String(a)),i.textContent=e,r.appendChild(i)}),Z(e,t,r)},ee=(e,t,n)=>{if(!(t.endArrowhead||t.startArrowhead)||n.length<2)return;let r=n[n.length-1],i=n[n.length-2],a=Math.atan2(r[1]-i[1],r[0]-i[0]),o=Math.max(10,B(t.strokeWidth,1)*7),s=[r[0]-o*Math.cos(a-Math.PI/7),r[1]-o*Math.sin(a-Math.PI/7)],c=[r[0]-o*Math.cos(a+Math.PI/7),r[1]-o*Math.sin(a+Math.PI/7)],l=H(`polygon`);l.setAttribute(`points`,`${r.join(`,`)} ${s.join(`,`)} ${c.join(`,`)}`),l.setAttribute(`fill`,t.strokeColor||`#1e1e1e`),l.setAttribute(`stroke`,t.strokeColor||`#1e1e1e`),Z(e,t,l)},te=async(e,t,r)=>{let{default:i}=await n(async()=>{let{default:e}=await import(`./rough.esm-DjrMDdlL.js`).then(e=>e.n);return{default:e}},__vite__mapDeps([0,1,2,3]),import.meta.url),a=Y(t),o=Math.max(320,a.maxX-a.minX+160),s=Math.max(220,a.maxY-a.minY+160),c=H(`svg`),l=H(`g`),u=i.svg(c);c.setAttribute(`viewBox`,`${a.minX-80} ${a.minY-80} ${o} ${s}`),c.setAttribute(`width`,String(o)),c.setAttribute(`height`,String(s)),c.setAttribute(`role`,`img`),c.setAttribute(`aria-label`,`Excalidraw rough.js preview`);let d=H(`rect`);d.setAttribute(`x`,String(a.minX-80)),d.setAttribute(`y`,String(a.minY-80)),d.setAttribute(`width`,String(o)),d.setAttribute(`height`,String(s)),d.setAttribute(`fill`,e.appState?.viewBackgroundColor||`#ffffff`),c.appendChild(d),c.appendChild(l),t.forEach(e=>{let t=Q(e),n=X(e),r=B(e.x),i=B(e.y),a=B(e.width),o=B(e.height);if(e.type===`text`)$(t,e);else if(e.type===`rectangle`)Z(t,e,u.rectangle(r,i,a,o,n));else if(e.type===`diamond`)Z(t,e,u.polygon([[r+a/2,i],[r+a,i+o/2],[r+a/2,i+o],[r,i+o/2]],n));else if(e.type===`ellipse`)Z(t,e,u.ellipse(r+a/2,i+o/2,Math.abs(a),Math.abs(o),n));else if(e.type===`line`||e.type===`arrow`||e.type===`freedraw`){let r=q(e);Z(t,e,u.linearPath(r,n)),e.type===`arrow`&&ee(t,e,r)}t.childNodes.length&&l.appendChild(t)}),G(r,c,`rough`)},ne=async(e,t,r)=>{let i=K(),a=setTimeout(i,7e3),{exportToSvg:o,restore:s}=await n(async()=>{let{exportToSvg:e,restore:t}=await import(`./prod-B0HxyDM0.js`);return{exportToSvg:e,restore:t}},__vite__mapDeps([4,1,2,3,5,6,7,8,9]),import.meta.url);try{let n=s({elements:t,appState:e.appState||{},files:e.files||{}},null,null,{repairBindings:!0,refreshDimensions:!0});G(r,await o({elements:n.elements.filter(e=>!e.isDeleted),appState:{...n.appState,exportBackground:!0,viewBackgroundColor:n.appState.viewBackgroundColor||`#ffffff`},files:n.files||{}}),`official`)}finally{clearTimeout(a),i()}},re=async e=>{let t=O.value;if(!t)return;let n=JSON.parse(e),r=Array.isArray(n.elements)?n.elements.filter(e=>!e.isDeleted):[];if(!r.length)throw Error(`Excalidraw 文件中没有可预览图元`);try{await U(ne(n,r,t),w,`Excalidraw 官方导出超时，自动切换 rough.js 兼容渲染`)}catch(e){console.warn(e),await te(n,r,t)}},ie=async e=>{let t=O.value;if(!t)return;await z(),await c();let n=document.createElement(`div`);if(n.className=`mxgraph drawing-mxgraph`,n.setAttribute(`data-mxgraph`,JSON.stringify({xml:e,toolbar:`zoom layers lightbox`,nav:!0,resize:!0,"auto-fit":!0,"auto-crop":!0,"auto-origin":!0,"allow-zoom-in":!0,"allow-zoom-out":!0,border:16,highlight:`#0f766e`})),t.appendChild(n),!window.GraphViewer)throw Error(`diagrams.net viewer 未正确初始化`);window.GraphViewer.createViewerForElement(n)};return o(async()=>{E.value=`loading`,D.value=``,k.value=1,R();try{let e=await t(s.data);j.value?await re(e):await ie(e),E.value=`ready`}catch(e){console.error(e),D.value=e instanceof Error?e.message:String(e),E.value=`error`}}),(e,t)=>(p(),f(`div`,m,[l(`div`,h,[l(`div`,g,[l(`span`,null,i(M.value),1),l(`strong`,null,i(j.value?`Excalidraw 官方 SVG 预览`:`diagrams.net 官方 Viewer 预览`),1)]),l(`div`,_,[l(`button`,{type:`button`,title:`缩小`,onClick:I},`-`),l(`span`,null,i(Math.round(k.value*100))+`%`,1),l(`button`,{type:`button`,title:`放大`,onClick:F},`+`),l(`button`,{type:`button`,title:`适合宽度`,onClick:L},`适合`)])]),l(`div`,v,[E.value===`loading`?(p(),f(`div`,y,`正在加载官方绘图预览器...`)):E.value===`error`?(p(),f(`div`,b,i(D.value),1)):u(``,!0),l(`div`,x,[l(`div`,{ref_key:`stage`,ref:O,class:`drawing-canvas`,style:a(N.value)},null,4)])])]))}}),[[`__scopeId`,`data-v-6f438c82`]]);export{T as default}; |