UNPKG

z-drag

Version:
1 lines 9.49 kB
(function(t,e){"object"===typeof exports&&"object"===typeof module?module.exports=e():"function"===typeof define&&define.amd?define([],e):"object"===typeof exports?exports["z-drag"]=e():t["z-drag"]=e()})("undefined"!==typeof self?self:this,(function(){return function(t){var e={};function r(n){if(e[n])return e[n].exports;var a=e[n]={i:n,l:!1,exports:{}};return t[n].call(a.exports,a,a.exports,r),a.l=!0,a.exports}return r.m=t,r.c=e,r.d=function(t,e,n){r.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},r.r=function(t){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},r.t=function(t,e){if(1&e&&(t=r(t)),8&e)return t;if(4&e&&"object"===typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var a in t)r.d(n,a,function(e){return t[e]}.bind(null,a));return n},r.n=function(t){var e=t&&t.__esModule?function(){return t["default"]}:function(){return t};return r.d(e,"a",e),e},r.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},r.p="",r(r.s="fb15")}({"24fb":function(t,e,r){"use strict";function n(t,e){var r=t[1]||"",n=t[3];if(!n)return r;if(e&&"function"===typeof btoa){var i=a(n),o=n.sources.map((function(t){return"/*# sourceURL=".concat(n.sourceRoot).concat(t," */")}));return[r].concat(o).concat([i]).join("\n")}return[r].join("\n")}function a(t){var e=btoa(unescape(encodeURIComponent(JSON.stringify(t)))),r="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(e);return"/*# ".concat(r," */")}t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var r=n(e,t);return e[2]?"@media ".concat(e[2]," {").concat(r,"}"):r})).join("")},e.i=function(t,r){"string"===typeof t&&(t=[[null,t,""]]);for(var n=0;n<t.length;n++){var a=[].concat(t[n]);r&&(a[2]?a[2]="".concat(r," and ").concat(a[2]):a[2]=r),e.push(a)}},e}},"345a":function(t,e,r){var n=r("24fb");e=n(!1),e.push([t.i,".flip-move[data-v-39e76127]{-webkit-transition:-webkit-transform .2s;transition:-webkit-transform .2s;transition:transform .2s;transition:transform .2s,-webkit-transform .2s}.z-drag-item[data-v-39e76127]{width:100%;padding:10px;border:1px solid #ccc;border-radius:4px}.z-drag-item__ghost[data-v-39e76127],.z-drag-item__over[data-v-39e76127]{background-color:#ecf8ff}.z-drag-item__disabled[data-v-39e76127]{cursor:no-drop;background-color:#f5f6f7}",""]),t.exports=e},"499e":function(t,e,r){"use strict";function n(t,e){for(var r=[],n={},a=0;a<e.length;a++){var i=e[a],o=i[0],s=i[1],d=i[2],u=i[3],c={id:t+":"+a,css:s,media:d,sourceMap:u};n[o]?n[o].parts.push(c):r.push(n[o]={id:o,parts:[c]})}return r}r.r(e),r.d(e,"default",(function(){return g}));var a="undefined"!==typeof document;if("undefined"!==typeof DEBUG&&DEBUG&&!a)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var i={},o=a&&(document.head||document.getElementsByTagName("head")[0]),s=null,d=0,u=!1,c=function(){},l=null,f="data-vue-ssr-id",p="undefined"!==typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());function g(t,e,r,a){u=r,l=a||{};var o=n(t,e);return h(o),function(e){for(var r=[],a=0;a<o.length;a++){var s=o[a],d=i[s.id];d.refs--,r.push(d)}e?(o=n(t,e),h(o)):o=[];for(a=0;a<r.length;a++){d=r[a];if(0===d.refs){for(var u=0;u<d.parts.length;u++)d.parts[u]();delete i[d.id]}}}}function h(t){for(var e=0;e<t.length;e++){var r=t[e],n=i[r.id];if(n){n.refs++;for(var a=0;a<n.parts.length;a++)n.parts[a](r.parts[a]);for(;a<r.parts.length;a++)n.parts.push(m(r.parts[a]));n.parts.length>r.parts.length&&(n.parts.length=r.parts.length)}else{var o=[];for(a=0;a<r.parts.length;a++)o.push(m(r.parts[a]));i[r.id]={id:r.id,refs:1,parts:o}}}}function v(){var t=document.createElement("style");return t.type="text/css",o.appendChild(t),t}function m(t){var e,r,n=document.querySelector("style["+f+'~="'+t.id+'"]');if(n){if(u)return c;n.parentNode.removeChild(n)}if(p){var a=d++;n=s||(s=v()),e=b.bind(null,n,a,!1),r=b.bind(null,n,a,!0)}else n=v(),e=S.bind(null,n),r=function(){n.parentNode.removeChild(n)};return e(t),function(n){if(n){if(n.css===t.css&&n.media===t.media&&n.sourceMap===t.sourceMap)return;e(t=n)}else r()}}var y=function(){var t=[];return function(e,r){return t[e]=r,t.filter(Boolean).join("\n")}}();function b(t,e,r,n){var a=r?"":n.css;if(t.styleSheet)t.styleSheet.cssText=y(e,a);else{var i=document.createTextNode(a),o=t.childNodes;o[e]&&t.removeChild(o[e]),o.length?t.insertBefore(i,o[e]):t.appendChild(i)}}function S(t,e){var r=e.css,n=e.media,a=e.sourceMap;if(n&&t.setAttribute("media",n),l.ssrId&&t.setAttribute(f,e.id),a&&(r+="\n/*# sourceURL="+a.sources[0]+" */",r+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(a))))+" */"),t.styleSheet)t.styleSheet.cssText=r;else{while(t.firstChild)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(r))}}},"735a":function(t,e,r){var n=r("345a");"string"===typeof n&&(n=[[t.i,n,""]]),n.locals&&(t.exports=n.locals);var a=r("499e").default;a("a693a930",n,!0,{sourceMap:!1,shadowMode:!1})},f6fd:function(t,e){(function(t){var e="currentScript",r=t.getElementsByTagName("script");e in t||Object.defineProperty(t,e,{get:function(){try{throw new Error}catch(n){var t,e=(/.*at [^\(]*\((.*):.+:.+\)$/gi.exec(n.stack)||[!1])[1];for(t in r)if(r[t].src==e||"interactive"==r[t].readyState)return r[t];return null}}})})(document)},fb15:function(t,e,r){"use strict";var n;(r.r(e),"undefined"!==typeof window)&&(r("f6fd"),(n=window.document.currentScript)&&(n=n.src.match(/(.+\/)[^/]+\.js(\?.*)?$/))&&(r.p=n[1]));var a=function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("div",{staticClass:"z-drag"},[r("transition-group",{attrs:{name:"flip",tag:"div"}},t._l(t.list,(function(e){return r("div",{key:e[t.sortId],class:[t.itemClass,t.immediate&&t.src[t.sortId]===e[t.sortId]&&t.draging?t.ghostClass:"",e.disabled?t.disabledClass:""],style:Object.assign({},t.itemStyle,t.src[t.sortId]===e[t.sortId]&&t.draging?t.ghostStyle:{}),attrs:{draggable:""},on:{dragstart:function(r){return t.onDragStart(r,e)},dragover:function(r){return t.onDragOver(r,e)},dragleave:t.onDragLeave,dragend:t.onDragEnd,drop:function(r){return t.onDrop(r,e)}}},[t._t("default",null,{data:e})],2)})),0)],1)},i=[];const o=(t,e,r)=>{let n=0,a=null;const i=function(e,r){t.apply(e,r)};return function(){const t=Date.now();n||!1!==r||(n=t);const o=e-(t-n);a&&clearTimeout(a),o<=0?(n=t,i(this,arguments)):a=setTimeout(i,o,this,arguments)}};var s={props:{value:{type:Array,default:()=>[]},sortId:{type:String,required:!0},isSort:{type:Boolean,default:!0},immediate:{type:Boolean,default:!0},itemClass:{type:String,default:"z-drag-item"},itemStyle:{type:Object,default:()=>{}},ghostClass:{type:String,default:"z-drag-item__ghost"},ghostStyle:{type:Object,default:()=>{}},dragOverClass:{type:String,default:"z-drag-item__over"},disabledClass:{type:String,default:"z-drag-item__disabled"}},data(){return{currentEl:null,src:{},target:{},list:[...this.value],draging:!1}},watch:{value(t){this.list=[...t]}},created(){this.onChange=o(this.dataChange,210,!1)},methods:{toggleTargetElStyle(t,e){e?t.classList.add(this.dragOverClass):t.classList.remove(this.dragOverClass)},onDragStart(t,e){e.disabled?t.preventDefault():(this.currentEl=t.currentTarget,this.src={...e},this.draging=!0)},onDragEnd(){this.draging=!1,JSON.stringify(this.list)!==JSON.stringify(this.value)&&(this.$emit("input",this.list),this.$emit("change",this.list))},replaceHandler(t,e){const r=[...this.list];return r[t]=this.target,r[e]=this.src,r},sortHanlder(t,e){const r=[...this.list],n=r.splice(t,1);return r.splice(e,0,...n),r},dataChange(t,e){if(!t.currentTarget)return;this.target={...e};const r=this.list.findIndex(t=>t[this.sortId]===this.src[this.sortId]),n=this.list.findIndex(t=>t[this.sortId]===this.target[this.sortId]);this.list=this.isSort?this.sortHanlder(r,n):this.replaceHandler(r,n)},onDragOver(t,e){t.preventDefault(),t.currentTarget&&t.currentTarget!==this.currentEl&&(this.immediate?this.onChange(t,e):this.toggleTargetElStyle(t.currentTarget,!0))},onDragLeave(t){!this.immediate&&t.currentTarget&&t.currentTarget!==this.currentEl&&this.toggleTargetElStyle(t.currentTarget,!1)},onDrop(t,e){t.preventDefault(),this.dataChange(t,e),this.toggleTargetElStyle(t.currentTarget,!1)}}},d=s;r("ff53");function u(t,e,r,n,a,i,o,s){var d,u="function"===typeof t?t.options:t;if(e&&(u.render=e,u.staticRenderFns=r,u._compiled=!0),n&&(u.functional=!0),i&&(u._scopeId="data-v-"+i),o?(d=function(t){t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,t||"undefined"===typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),a&&a.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(o)},u._ssrRegister=d):a&&(d=s?function(){a.call(this,this.$root.$options.shadowRoot)}:a),d)if(u.functional){u._injectStyles=d;var c=u.render;u.render=function(t,e){return d.call(e),c(t,e)}}else{var l=u.beforeCreate;u.beforeCreate=l?[].concat(l,d):[d]}return{exports:t,options:u}}var c=u(d,a,i,!1,null,"39e76127",null),l=c.exports;const f=l,p={install:function(t){t.component("ZDrag",l)}};var g=p;r.d(e,"ZDrag",(function(){return f}));e["default"]=g},ff53:function(t,e,r){"use strict";var n=r("735a"),a=r.n(n);a.a}})}));