epic-designer
Version:
基于vue3的设计器,可视化开发页面表单
2 lines (1 loc) • 1.66 kB
JavaScript
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("vue"),s=require("@vueuse/core"),i=require("../store/index.cjs");function y(){const t=f.ref(!1),e=f.ref(!1),r=f.ref(!1);return s.onKeyDown(" ",()=>{t.value=!0}),s.onKeyUp(" ",()=>{t.value=!1}),s.onKeyDown("Shift",n=>{n.preventDefault(),e.value=!0}),s.onKeyUp("Shift",()=>{e.value=!1}),s.onKeyDown("Control",n=>{n.preventDefault(),r.value=!0}),s.onKeyUp("Control",()=>{r.value=!1}),{pressCtrl:r,pressShift:e,pressSpace:t}}function v(t){const{pressSpace:e}=i.useStore(),r=new Image(1,1);r.src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNk+M9QDwADhgGAWjR9awAAAABJRU5ErkJggg==";let n=0,a=0;function l(u,c=!1){var o;c&&(n=u.x,a=u.y,typeof document<"u"&&((o=u.dataTransfer)==null||o.setDragImage(document.createElement("div"),0,0)))}function A(u,c=!1){if(u.preventDefault(),!u.x||!u.y||!c)return;const o=u.x-n,d=u.y-a;n=u.x,a=u.y,t.value&&(t.value.scrollTop-=d,t.value.scrollLeft-=o)}function m(){e.value=!1}return{handleElementDrag:A,handleElementDragEnd:m,handleElementDragStart:l}}function g(t){const{canvasScale:e,disabledZoom:r}=i.useStore();function n(a){if(!a.ctrlKey||r.value)return;let l=0;l=a.deltaY<0?e.value+.05:e.value-.05,!(l>150||l<.5)&&(e.value=l)}return f.watch(()=>e.value,a=>{t.value&&!r.value&&(t.value.style.transform=`scale(${a})`)}),{canvasScale:e,handleZoom:n}}function p(t,e=16.66){let r;function n(){a(),r=window.setInterval(t,e)}function a(){window.clearInterval(r)}return{startTimedQuery:n,stopTimedQuery:a}}exports.useElementDrag=v;exports.useElementZoom=g;exports.useKeyPress=y;exports.useTimedQuery=p;