{"remainingRequest":"D:\\源码\\vue-element-admin-master\\node_modules\\babel-loader\\lib\\index.js!D:\\源码\\vue-element-admin-master\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!D:\\源码\\vue-element-admin-master\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\源码\\vue-element-admin-master\\src\\components\\DndList\\index.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\源码\\vue-element-admin-master\\src\\components\\DndList\\index.vue","mtime":1649647926000},{"path":"D:\\源码\\vue-element-admin-master\\babel.config.js","mtime":1649647926000},{"path":"D:\\源码\\vue-element-admin-master\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\源码\\vue-element-admin-master\\node_modules\\babel-loader\\lib\\index.js","mtime":315532800000},{"path":"D:\\源码\\vue-element-admin-master\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\源码\\vue-element-admin-master\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:aW1wb3J0IF9jcmVhdGVGb3JPZkl0ZXJhdG9ySGVscGVyIGZyb20gIkQ6L1x1NkU5MFx1NzgwMS92dWUtZWxlbWVudC1hZG1pbi1tYXN0ZXIvbm9kZV9tb2R1bGVzL0BiYWJlbC9ydW50aW1lL2hlbHBlcnMvZXNtL2NyZWF0ZUZvck9mSXRlcmF0b3JIZWxwZXIuanMiOwppbXBvcnQgImNvcmUtanMvbW9kdWxlcy9lcy5vYmplY3QudG8tc3RyaW5nLmpzIjsKaW1wb3J0ICJjb3JlLWpzL21vZHVsZXMvZXMuYXJyYXkuc3BsaWNlLmpzIjsKLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KaW1wb3J0IGRyYWdnYWJsZSBmcm9tICd2dWVkcmFnZ2FibGUnOwpleHBvcnQgZGVmYXVsdCB7CiAgbmFtZTogJ0RuZExpc3QnLAogIGNvbXBvbmVudHM6IHsKICAgIGRyYWdnYWJsZTogZHJhZ2dhYmxlCiAgfSwKICBwcm9wczogewogICAgbGlzdDE6IHsKICAgICAgdHlwZTogQXJyYXksCiAgICAgIGRlZmF1bHQ6IGZ1bmN0aW9uIF9kZWZhdWx0KCkgewogICAgICAgIHJldHVybiBbXTsKICAgICAgfQogICAgfSwKICAgIGxpc3QyOiB7CiAgICAgIHR5cGU6IEFycmF5LAogICAgICBkZWZhdWx0OiBmdW5jdGlvbiBfZGVmYXVsdCgpIHsKICAgICAgICByZXR1cm4gW107CiAgICAgIH0KICAgIH0sCiAgICBsaXN0MVRpdGxlOiB7CiAgICAgIHR5cGU6IFN0cmluZywKICAgICAgZGVmYXVsdDogJ2xpc3QxJwogICAgfSwKICAgIGxpc3QyVGl0bGU6IHsKICAgICAgdHlwZTogU3RyaW5nLAogICAgICBkZWZhdWx0OiAnbGlzdDInCiAgICB9LAogICAgd2lkdGgxOiB7CiAgICAgIHR5cGU6IFN0cmluZywKICAgICAgZGVmYXVsdDogJzQ4JScKICAgIH0sCiAgICB3aWR0aDI6IHsKICAgICAgdHlwZTogU3RyaW5nLAogICAgICBkZWZhdWx0OiAnNDglJwogICAgfQogIH0sCiAgbWV0aG9kczogewogICAgaXNOb3RJbkxpc3QxOiBmdW5jdGlvbiBpc05vdEluTGlzdDEodikgewogICAgICByZXR1cm4gdGhpcy5saXN0MS5ldmVyeShmdW5jdGlvbiAoaykgewogICAgICAgIHJldHVybiB2LmlkICE9PSBrLmlkOwogICAgICB9KTsKICAgIH0sCiAgICBpc05vdEluTGlzdDI6IGZ1bmN0aW9uIGlzTm90SW5MaXN0Mih2KSB7CiAgICAgIHJldHVybiB0aGlzLmxpc3QyLmV2ZXJ5KGZ1bmN0aW9uIChrKSB7CiAgICAgICAgcmV0dXJuIHYuaWQgIT09IGsuaWQ7CiAgICAgIH0pOwogICAgfSwKICAgIGRlbGV0ZUVsZTogZnVuY3Rpb24gZGVsZXRlRWxlKGVsZSkgewogICAgICB2YXIgX2l0ZXJhdG9yID0gX2NyZWF0ZUZvck9mSXRlcmF0b3JIZWxwZXIodGhpcy5saXN0MSksCiAgICAgICAgICBfc3RlcDsKCiAgICAgIHRyeSB7CiAgICAgICAgZm9yIChfaXRlcmF0b3IucygpOyAhKF9zdGVwID0gX2l0ZXJhdG9yLm4oKSkuZG9uZTspIHsKICAgICAgICAgIHZhciBpdGVtID0gX3N0ZXAudmFsdWU7CgogICAgICAgICAgaWYgKGl0ZW0uaWQgPT09IGVsZS5pZCkgewogICAgICAgICAgICB2YXIgaW5kZXggPSB0aGlzLmxpc3QxLmluZGV4T2YoaXRlbSk7CiAgICAgICAgICAgIHRoaXMubGlzdDEuc3BsaWNlKGluZGV4LCAxKTsKICAgICAgICAgICAgYnJlYWs7CiAgICAgICAgICB9CiAgICAgICAgfQogICAgICB9IGNhdGNoIChlcnIpIHsKICAgICAgICBfaXRlcmF0b3IuZShlcnIpOwogICAgICB9IGZpbmFsbHkgewogICAgICAgIF9pdGVyYXRvci5mKCk7CiAgICAgIH0KCiAgICAgIGlmICh0aGlzLmlzTm90SW5MaXN0MihlbGUpKSB7CiAgICAgICAgdGhpcy5saXN0Mi51bnNoaWZ0KGVsZSk7CiAgICAgIH0KICAgIH0sCiAgICBwdXNoRWxlOiBmdW5jdGlvbiBwdXNoRWxlKGVsZSkgewogICAgICB2YXIgX2l0ZXJhdG9yMiA9IF9jcmVhdGVGb3JPZkl0ZXJhdG9ySGVscGVyKHRoaXMubGlzdDIpLAogICAgICAgICAgX3N0ZXAyOwoKICAgICAgdHJ5IHsKICAgICAgICBmb3IgKF9pdGVyYXRvcjIucygpOyAhKF9zdGVwMiA9IF9pdGVyYXRvcjIubigpKS5kb25lOykgewogICAgICAgICAgdmFyIGl0ZW0gPSBfc3RlcDIudmFsdWU7CgogICAgICAgICAgaWYgKGl0ZW0uaWQgPT09IGVsZS5pZCkgewogICAgICAgICAgICB2YXIgaW5kZXggPSB0aGlzLmxpc3QyLmluZGV4T2YoaXRlbSk7CiAgICAgICAgICAgIHRoaXMubGlzdDIuc3BsaWNlKGluZGV4LCAxKTsKICAgICAgICAgICAgYnJlYWs7CiAgICAgICAgICB9CiAgICAgICAgfQogICAgICB9IGNhdGNoIChlcnIpIHsKICAgICAgICBfaXRlcmF0b3IyLmUoZXJyKTsKICAgICAgfSBmaW5hbGx5IHsKICAgICAgICBfaXRlcmF0b3IyLmYoKTsKICAgICAgfQoKICAgICAgaWYgKHRoaXMuaXNOb3RJbkxpc3QxKGVsZSkpIHsKICAgICAgICB0aGlzLmxpc3QxLnB1c2goZWxlKTsKICAgICAgfQogICAgfSwKICAgIHNldERhdGE6IGZ1bmN0aW9uIHNldERhdGEoZGF0YVRyYW5zZmVyKSB7CiAgICAgIC8vIHRvIGF2b2lkIEZpcmVmb3ggYnVnCiAgICAgIC8vIERldGFpbCBzZWUgOiBodHRwczovL2dpdGh1Yi5jb20vUnViYVhhL1NvcnRhYmxlL2lzc3Vlcy8xMDEyCiAgICAgIGRhdGFUcmFuc2Zlci5zZXREYXRhKCdUZXh0JywgJycpOwogICAgfQogIH0KfTs="},{"version":3,"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BA;AAEA;EACAA,eADA;EAEAC;IAAAC;EAAA,CAFA;EAGAC;IACAC;MACAC,WADA;MAEAC,OAFA,sBAEA;QACA;MACA;IAJA,CADA;IAOAC;MACAF,WADA;MAEAC,OAFA,sBAEA;QACA;MACA;IAJA,CAPA;IAaAE;MACAH,YADA;MAEAC;IAFA,CAbA;IAiBAG;MACAJ,YADA;MAEAC;IAFA,CAjBA;IAqBAI;MACAL,YADA;MAEAC;IAFA,CArBA;IAyBAK;MACAN,YADA;MAEAC;IAFA;EAzBA,CAHA;EAiCAM;IACAC,YADA,wBACAC,CADA,EACA;MACA;QAAA;MAAA;IACA,CAHA;IAIAC,YAJA,wBAIAD,CAJA,EAIA;MACA;QAAA;MAAA;IACA,CANA;IAOAE,SAPA,qBAOAC,GAPA,EAOA;MAAA,2CACA,UADA;MAAA;;MAAA;QACA;UAAA;;UACA;YACA;YACA;YACA;UACA;QACA;MAPA;QAAA;MAAA;QAAA;MAAA;;MAQA;QACA;MACA;IACA,CAlBA;IAmBAC,OAnBA,mBAmBAD,GAnBA,EAmBA;MAAA,4CACA,UADA;MAAA;;MAAA;QACA;UAAA;;UACA;YACA;YACA;YACA;UACA;QACA;MAPA;QAAA;MAAA;QAAA;MAAA;;MAQA;QACA;MACA;IACA,CA9BA;IA+BAE,OA/BA,mBA+BAC,YA/BA,EA+BA;MACA;MACA;MACAA;IACA;EAnCA;AAjCA","names":["name","components","draggable","props","list1","type","default","list2","list1Title","list2Title","width1","width2","methods","isNotInList1","v","isNotInList2","deleteEle","ele","pushEle","setData","dataTransfer"],"sourceRoot":"src/components/DndList","sources":["index.vue"],"sourcesContent":["<template>\n <div class=\"dndList\">\n <div :style=\"{width:width1}\" class=\"dndList-list\">\n <h3>{{ list1Title }}</h3>\n <draggable :set-data=\"setData\" :list=\"list1\" group=\"article\" class=\"dragArea\">\n <div v-for=\"element in list1\" :key=\"element.id\" class=\"list-complete-item\">\n <div class=\"list-complete-item-handle\">\n {{ element.id }}[{{ element.author }}] {{ element.title }}\n </div>\n <div style=\"position:absolute;right:0px;\">\n <span style=\"float: right ;margin-top: -20px;margin-right:5px;\" @click=\"deleteEle(element)\">\n <i style=\"color:#ff4949\" class=\"el-icon-delete\" />\n </span>\n </div>\n </div>\n </draggable>\n </div>\n <div :style=\"{width:width2}\" class=\"dndList-list\">\n <h3>{{ list2Title }}</h3>\n <draggable :list=\"list2\" group=\"article\" class=\"dragArea\">\n <div v-for=\"element in list2\" :key=\"element.id\" class=\"list-complete-item\">\n <div class=\"list-complete-item-handle2\" @click=\"pushEle(element)\">\n {{ element.id }} [{{ element.author }}] {{ element.title }}\n </div>\n </div>\n </draggable>\n </div>\n </div>\n</template>\n\n<script>\nimport draggable from 'vuedraggable'\n\nexport default {\n name: 'DndList',\n components: { draggable },\n props: {\n list1: {\n type: Array,\n default() {\n return []\n }\n },\n list2: {\n type: Array,\n default() {\n return []\n }\n },\n list1Title: {\n type: String,\n default: 'list1'\n },\n list2Title: {\n type: String,\n default: 'list2'\n },\n width1: {\n type: String,\n default: '48%'\n },\n width2: {\n type: String,\n default: '48%'\n }\n },\n methods: {\n isNotInList1(v) {\n return this.list1.every(k => v.id !== k.id)\n },\n isNotInList2(v) {\n return this.list2.every(k => v.id !== k.id)\n },\n deleteEle(ele) {\n for (const item of this.list1) {\n if (item.id === ele.id) {\n const index = this.list1.indexOf(item)\n this.list1.splice(index, 1)\n break\n }\n }\n if (this.isNotInList2(ele)) {\n this.list2.unshift(ele)\n }\n },\n pushEle(ele) {\n for (const item of this.list2) {\n if (item.id === ele.id) {\n const index = this.list2.indexOf(item)\n this.list2.splice(index, 1)\n break\n }\n }\n if (this.isNotInList1(ele)) {\n this.list1.push(ele)\n }\n },\n setData(dataTransfer) {\n // to avoid Firefox bug\n // Detail see : https://github.com/RubaXa/Sortable/issues/1012\n dataTransfer.setData('Text', '')\n }\n }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.dndList {\n background: #fff;\n padding-bottom: 40px;\n &:after {\n content: \"\";\n display: table;\n clear: both;\n }\n .dndList-list {\n float: left;\n padding-bottom: 30px;\n &:first-of-type {\n margin-right: 2%;\n }\n .dragArea {\n margin-top: 15px;\n min-height: 50px;\n padding-bottom: 30px;\n }\n }\n}\n\n.list-complete-item {\n cursor: pointer;\n position: relative;\n font-size: 14px;\n padding: 5px 12px;\n margin-top: 4px;\n border: 1px solid #bfcbd9;\n transition: all 1s;\n}\n\n.list-complete-item-handle {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n margin-right: 50px;\n}\n\n.list-complete-item-handle2 {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n margin-right: 20px;\n}\n\n.list-complete-item.sortable-chosen {\n background: #4AB7BD;\n}\n\n.list-complete-item.sortable-ghost {\n background: #30B08F;\n}\n\n.list-complete-enter,\n.list-complete-leave-active {\n opacity: 0;\n}\n</style>\n"]}]}
|
