(window.webpackJsonp=window.webpackJsonp||[]).push([[7],{412:function(t,n,i){},464:function(t,n,i){"use strict";var e=i(1),r=i(67).findIndex,o=i(125),a=!0;"findIndex"in[]&&Array(1).findIndex((function(){a=!1})),e({target:"Array",proto:!0,forced:a},{findIndex:function(t){return r(this,t,arguments.length>1?arguments[1]:void 0)}}),o("findIndex")},465:function(t,n,i){"use strict";i(412)},488:function(t,n,i){"use strict";i.r(n);i(464),i(43),i(10),i(130);var e=i(371),r={x:null,y:null},o={x:null,y:null,w:1,h:1,i:null},a={components:{GridLayout:e.GridLayout,GridItem:e.GridItem},data:function(){return{layout:[{x:0,y:0,w:2,h:2,i:"0"},{x:2,y:0,w:2,h:4,i:"1"},{x:4,y:0,w:2,h:5,i:"2"},{x:6,y:0,w:2,h:3,i:"3"},{x:8,y:0,w:2,h:3,i:"4"},{x:10,y:0,w:2,h:3,i:"5"},{x:0,y:5,w:2,h:5,i:"6"},{x:2,y:5,w:2,h:5,i:"7"},{x:4,y:5,w:2,h:5,i:"8"},{x:5,y:10,w:4,h:3,i:"9"}]}},mounted:function(){document.addEventListener("dragover",(function(t){r.x=t.clientX,r.y=t.clientY}),!1)},beforeDestroy:function(){},methods:{drag:function(t){var n=document.getElementById("content").getBoundingClientRect(),i=!1;r.x>n.left&&r.x<n.right&&r.y>n.top&&r.y<n.bottom&&(i=!0),!0===i&&-1===this.layout.findIndex((function(t){return"drop"===t.i}))&&this.layout.push({x:2*this.layout.length%(this.colNum||12),y:this.layout.length+(this.colNum||12),w:1,h:1,i:"drop"});var e=this.layout.findIndex((function(t){return"drop"===t.i}));if(-1!==e){try{this.$refs.gridlayout.$children[this.layout.length].$refs.item.style.display="none"}catch(t){}var a=this.$refs.gridlayout.$children[e];a.dragging={top:r.y-n.top,left:r.x-n.left};var l=a.calcXY(r.y-n.top,r.x-n.left);!0===i&&(this.$refs.gridlayout.dragEvent("dragstart","drop",l.x,l.y,1,1),o.i=String(e),o.x=this.layout[e].x,o.y=this.layout[e].y),!1===i&&(this.$refs.gridlayout.dragEvent("dragend","drop",l.x,l.y,1,1),this.layout=this.layout.filter((function(t){return"drop"!==t.i})))}},dragend:function(t){var n=document.getElementById("content").getBoundingClientRect(),i=!1;r.x>n.left&&r.x<n.right&&r.y>n.top&&r.y<n.bottom&&(i=!0),!0===i&&(alert("Dropped element props:\n".concat(JSON.stringify(o,["x","y","w","h"],2))),this.$refs.gridlayout.dragEvent("dragend","drop",o.x,o.y,1,1),this.layout=this.layout.filter((function(t){return"drop"!==t.i})))}}},l=(i(465),i(34)),d=Object(l.a)(a,(function(){var t=this,n=t._self._c;return n("div",[n("div",[n("div",{staticClass:"layoutJSON"},[t._v("\n            Displayed as "),n("code",[t._v("[x, y, w, h]")]),t._v(":\n            "),n("div",{staticClass:"columns"},t._l(t.layout,(function(i){return n("div",{staticClass:"layoutItem"},[n("b",[t._v(t._s(i.i))]),t._v(": ["+t._s(i.x)+", "+t._s(i.y)+", "+t._s(i.w)+", "+t._s(i.h)+"]\n                ")])})),0)])]),t._v(" "),n("br"),t._v(" "),n("div",{staticClass:"droppable-element",attrs:{draggable:"true",unselectable:"on"},on:{drag:t.drag,dragend:t.dragend}},[t._v("Droppable Element (Drag me!)")]),t._v(" "),n("div",{attrs:{id:"content"}},[n("grid-layout",{ref:"gridlayout",attrs:{layout:t.layout,"col-num":12,"row-height":30,"is-draggable":!0,"is-resizable":!0,"vertical-compact":!0,"use-css-transforms":!0},on:{"update:layout":function(n){t.layout=n}}},t._l(t.layout,(function(i){return n("grid-item",{key:i.i,attrs:{x:i.x,y:i.y,w:i.w,h:i.h,i:i.i}},[n("span",{staticClass:"text"},[t._v(t._s(i.i))])])})),1)],1)])}),[],!1,null,"4287a6e0",null);n.default=d.exports}}]);