| 1 |
- {"version":3,"sources":["webpack:///D:/meloinfo/sugarpark-mini-program/components/DragImage/DragImage.vue?2331","webpack:///D:/meloinfo/sugarpark-mini-program/components/DragImage/DragImage.vue?a28c","webpack:///D:/meloinfo/sugarpark-mini-program/components/DragImage/DragImage.vue?39f7","webpack:///D:/meloinfo/sugarpark-mini-program/components/DragImage/DragImage.vue?30f1","uni-app:///components/DragImage/DragImage.vue","webpack:///D:/meloinfo/sugarpark-mini-program/components/DragImage/DragImage.vue?2d67","webpack:///D:/meloinfo/sugarpark-mini-program/components/DragImage/DragImage.vue?3f05"],"names":[],"mappings":";;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAkI;AAClI;AAC6D;AACL;AACsC;;;AAG9F;AACmK;AACnK,gBAAgB,6KAAU;AAC1B,EAAE,+EAAM;AACR,EAAE,gGAAM;AACR,EAAE,yGAAe;AACjB;AACA;AACA;AACA;AACA;AACA,EAAE,oGAAU;AACZ;AACA;;AAEA;AACe,gF;;;;;;;;;;;;ACvBf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;ACAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACRA;AAAA;AAAA;AAAA;AAAsmB,CAAgB,mnBAAG,EAAC,C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACkD1nB;AACA,MADA,kBACA;AACA;AACA,qCADA;AAEA,mBAFA;AAGA,cAHA;AAIA;AACA,YADA;AAEA,YAFA,EAJA;;AAQA,kBARA;AASA,kBATA;AAUA,oBAVA;AAWA,iBAXA;AAYA,wBAZA;AAaA,qBAbA;;AAeA,GAjBA;AAkBA;AACA;AACA;AACA,iBADA;AAEA;AACA;AACA,OAJA,EAFA;;AAQA;AACA;AACA,kBADA;AAEA,gBAFA,EATA;;AAaA;AACA;AACA,kBADA;AAEA,kBAFA,EAdA;;AAkBA;AACA;AACA,kBADA;AAEA,gBAFA,EAnBA;;AAuBA;AACA;AACA,kBADA;AAEA,iBAFA,EAxBA;;AA4BA;AACA;AACA,kBADA;AAEA,kBAFA,EA7BA;;AAiCA;AACA;AACA,kBADA;AAEA,kBAFA,EAlCA;;AAsCA;AACA;AACA,mBADA;AAEA,oBAFA,EAvCA;;AA2CA;AACA,mBADA;AAEA,oBAFA,EA3CA,EAlBA;;;AAkEA;AACA,QADA,gBACA,GADA,EACA,MADA,EACA;AACA;AACA,KAHA,EAlEA;;AAuEA;AACA,cADA,wBACA;AACA;AACA;AACA,OAFA,MAEA;AACA;AACA;AACA,KAPA;AAQA,cARA,wBAQA;AACA;AACA,KAVA,EAvEA;;AAmFA,SAnFA,qBAmFA;AACA;AACA;AACA,GAtFA;AAuFA,SAvFA,qBAuFA;AACA;AACA,GAzFA;AA0FA;AACA,QADA,kBACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,6BANA;AAOA,kBAPA,aAOA;AACA;AACA,WATA;AAUA,OAVA;AAWA;AACA,KAfA;AAgBA,YAhBA,oBAgBA,CAhBA,EAgBA,IAhBA,EAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,oCADA;AAEA,wBAFA,gDAEA,GAFA;AAGA;AACA;AACA,eAFA,MAEA;AACA;AACA,eAFA,MAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mBAHA;AAIA,iBALA,EAKA,CALA;AAMA,eAjBA,EAEA;AAgBA,aAlBA;AAmBA;AACA;AACA;;AAEA;AACA;AACA,KArDA;AAsDA,UAtDA,kBAsDA,GAtDA,EAsDA,CAtDA,EAsDA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAHA;AAIA,OALA,EAKA,CALA;AAMA,KAnEA;AAoEA,cApEA,sBAoEA,IApEA,EAoEA;AACA;AACA;AACA;AACA;AACA,OAFA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OALA,EAKA,GALA;AAMA,KAnFA;AAoFA,YApFA,oBAoFA,IApFA,EAoFA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SALA;AAMA,OAPA,EAOA,CAPA;AAQA;AACA,KAtGA;AAuGA,gBAvGA,wBAuGA,KAvGA,EAuGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,oBADA;AAEA,sBAFA;AAGA,sBAHA;AAIA;AACA,SALA;AAMA;AACA;AACA,SARA;;AAUA,KA5IA;AA6IA,cA7IA,wBA6IA;;;;;;;AAOA,KApJA;AAqJA,cArJA,wBAqJA;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,KAhLA;AAiLA,aAjLA,uBAiLA;AACA;AACA;AACA,OAFA,MAEA;AACA;AACA;AACA,4BADA;AAEA,yCAFA;AAGA;AACA;AACA;AACA;AACA;AACA,WARA;;AAUA;AACA,KAjMA;AAkMA,YAlMA,oBAkMA,KAlMA,EAkMA;AACA;;AAEA,KArMA;AAsMA,YAtMA,oBAsMA,IAtMA,EAsMA,KAtMA,EAsMA;AACA,sCADA;AAEA,oBAFA,kDAEA,GAFA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAHA;AAIA,WAbA,EAEA;AAYA,SAdA;AAeA;AACA;AACA;AACA;AACA,KAzNA;AA0NA,cA1NA,sBA0NA,IA1NA,EA0NA,KA1NA,EA0NA;;AAEA;;AAEA,KA9NA;AA+NA,YA/NA,sBA+NA;AACA;AACA;AACA;AACA,OAFA;AAGA;AACA;AACA;AACA;AACA,KAxOA;AAyOA,iBAzOA,yBAyOA,IAzOA,EAyOA;AACA;AACA;AACA;AACA;AACA;AACA,8BADA;AAEA,6BAFA;AAGA,uBAHA;AAIA,YAJA;AAKA,YALA;AAMA,eANA;AAOA,eAPA;AAQA,kBARA;AASA,kBATA;AAUA,gBAVA;AAWA,iBAXA;AAYA,kBAZA;AAaA,oCAbA;AAcA,uBAdA;AAeA,qBAfA;AAgBA,iBAhBA;AAiBA,sBAjBA;AAkBA,sBAlBA;;AAoBA;AACA;AACA,KApQA;AAqQA,WArQA,qBAqQA,EArQA;AAsQA,UAtQA,kBAsQA,CAtQA,EAsQA;AACA;AACA,KAxQA;AAyQA,QAzQA,kBAyQA;AACA;AACA;AACA;AACA;AACA,KA9QA,EA1FA,E;;;;;;;;;;;;;AClDA;AAAA;AAAA;AAAA;AAAyqC,CAAgB,0nCAAG,EAAC,C;;;;;;;;;;;ACA7rC;AACA,OAAO,KAAU,EAAE,kBAKd","file":"components/DragImage/DragImage.js","sourcesContent":["import { render, staticRenderFns, recyclableRender, components } from \"./DragImage.vue?vue&type=template&id=40b3ee54&scoped=true&\"\nvar renderjs\nimport script from \"./DragImage.vue?vue&type=script&lang=js&\"\nexport * from \"./DragImage.vue?vue&type=script&lang=js&\"\nimport style0 from \"./DragImage.vue?vue&type=style&index=0&id=40b3ee54&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n script,\n render,\n staticRenderFns,\n false,\n null,\n \"40b3ee54\",\n null,\n false,\n components,\n renderjs\n)\n\ncomponent.options.__file = \"components/DragImage/DragImage.vue\"\nexport default component.exports","export * from \"-!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--16-0!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/template.js!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-uni-app-loader/page-meta.js!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./DragImage.vue?vue&type=template&id=40b3ee54&scoped=true&\"","var components\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n}\nvar recyclableRender = false\nvar staticRenderFns = []\nrender._withStripped = true\n\nexport { render, staticRenderFns, recyclableRender, components }","import mod from \"-!../../../../HBuilderX/plugins/uniapp-cli/node_modules/babel-loader/lib/index.js!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--12-1!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./DragImage.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../HBuilderX/plugins/uniapp-cli/node_modules/babel-loader/lib/index.js!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--12-1!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./DragImage.vue?vue&type=script&lang=js&\"","<template>\n <view class=\"con\">\n <movable-area class=\"area\" :style=\"{ height: areaHeight }\" @mouseenter=\"mouseenter\" @mouseleave=\"mouseleave\">\n <block v-for=\"(item, index) in imageList\" :key=\"item.id\">\n <movable-view\n class=\"view\"\n :x=\"item.x\"\n :y=\"item.y\"\n direction=\"all\"\n :damping=\"40\"\n :disabled=\"item.disable\"\n\t\t @click=\"previewImage(index)\"\n @change=\"onChange($event, item)\"\n @longpress=\"touchstart(item)\"\n @touchend=\"touchend(item)\"\n :style=\"{ width: viewWidth + 'px', height: viewWidth + 'px', 'z-index': item.zIndex, opacity: item.opacity }\"\n >\n <view class=\"area-con\" :style=\"{ width: childWidth, height: childWidth, transform: 'scale(' + item.scale + ')' }\">\n <image class=\"pre-image\" :src=\"item.src\" mode=\"aspectFill\"></image>\n <view class=\"del-con\" @click=\"delImage(item, index)\" @touchstart.stop=\"delImageMp(item, index)\" @touchend.stop=\"nothing()\" @mousedown.stop=\"nothing()\" @mouseup.stop=\"nothing()\" v-if=\"!chooseImage\">\n <view class=\"del-wrap\">\n <image\n class=\"del-image\"\n src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACEAAAAhCAYAAABX5MJvAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAhdEVYdENyZWF0aW9uIFRpbWUAMjAyMDowNzoyNSAyMTo1NDoyOU4TkJAAAADcSURBVFhH7ZfRCoMwDEXLvkjwwVf/bH/emmAyN6glTW9WBjsgwm28OeCLpj81Sil7zvlJ90UiONS/yY5VogsO6XrBg3IEQ5a/s8vRSWUAKmLqp2w5jz5BiNQEGMo3GbloDLtFXJ1IkaEuhAiiY6gEIqB4yqACSk9piIBiKQ8VUFpLviKg3C2rESKgWERCBZSWiEfgIfffYvrrsAgoISJ3Apy3zuTxcSxLQkV6ykNEPKVQkZEyiAiiZKgDIaC4upACSlcn5fM/+WuDCAHF1E/Z/N9AhkMZnPNDPI+UDjPIXgAQIGjNAAAAAElFTkSuQmCC\"\n ></image>\n </view>\n </view>\n\t\t\t<view class=\"choose\" v-if=\"item.choosed\">\n\t\t\t\t{{item.chooseIndex}}\n\t\t\t</view>\n </view>\n </movable-view>\n </block>\n <view\n class=\"add\"\n v-if=\"imageList.length < number\"\n :style=\"{ top: add.y, left: add.x, width: viewWidth + 'px', height: viewWidth + 'px' }\"\n @click=\"addImages\"\n >\n <view class=\"add-wrap\" :style=\"{ width: childWidth, height: childWidth }\">\n <image\n style=\"width: 216rpx;height: 216rpx;\"\n :src=\"`${assetsUrl}album-add.png`\" mode=\"aspectFit\"></image>\n </view>\n </view>\n </movable-area>\n </view>\n</template>\n\n<script>\nexport default {\n data() {\n return {\n\t assetsUrl:this.$util.assetsUrl,\n imageList: [],\n width: 0,\n add: {\n x: 0,\n y: 0\n },\n colsValue: 0,\n viewWidth: 0,\n tempItem: null,\n timer: null,\n changeStatus: true,\n preStatus: true,\n }\n },\n props: {\n // 返回排序后图片\n list: {\n type: Array,\n default: function() {\n return []\n }\n },\n // 选择图片数量限制\n number: {\n type: Number,\n default: 6\n },\n // 图片父容器宽度（实际显示的图片宽度为 imageWidth / 1.1 ），单位 rpx\n imageWidth: {\n type: Number,\n default: 230\n },\n // 图片列数（cols > 0 则 imageWidth 无效）\n cols: {\n type: Number,\n default: 0\n },\n // 图片周围空白填充，单位 rpx\n padding: {\n type: Number,\n default: 10\n },\n // 拖动图片时放大倍数 [0, ∞)\n scale: {\n type: Number,\n default: 1.1\n },\n // 拖动图片时不透明度\n opacity: {\n type: Number,\n default: 0.7\n },\n // 自定义添加（需配合 @aaddImage 事件使用）\n custom: {\n type: Boolean,\n default: false\n },\n\tchooseImage:{\n\t\ttype:Boolean,\n\t\tdefault:false\n\t}\n },\n watch:{\n\t list(val,oldval){\n\t\t this.init();\n\t }\n },\n computed: {\n areaHeight() {\n if (this.imageList.length < this.number) {\n return Math.ceil((this.imageList.length + 1) / this.colsValue) * this.viewWidth + 'px'\n } else {\n return Math.ceil(this.imageList.length / this.colsValue) * this.viewWidth + 'px'\n }\n },\n childWidth() {\n return this.viewWidth - this.rpx2px(this.padding) * 2 + 'px'\n },\n },\n created() {\n this.width = uni.getSystemInfoSync().windowWidth\n this.viewWidth = this.rpx2px(this.imageWidth)\n },\n mounted() {\n this.init();\n },\n methods: {\n\tinit(){\n\t\tconst query = uni.createSelectorQuery().in(this)\n\t\tquery.select('.area').boundingClientRect(data => {\n\t\t this.colsValue = Math.floor(data.width / this.viewWidth)\n\t\t if(this.cols > 0){\n\t\t this.colsValue = this.cols\n\t\t this.viewWidth = data.width / this.cols\n\t\t }\n\t\t this.imageList=[];\n\t\t for (let item of this.list) {\n\t\t this.addProperties(item)\n\t\t }\n\t\t})\n\t\tquery.exec()\n\t},\n onChange(e, item) {\n if(!item) return\n item.oldX = e.detail.x\n item.oldY = e.detail.y\n if (e.detail.source === 'touch') {\n if(item.moveEnd){\n item.offset = Math.sqrt(Math.pow(item.oldX - item.absX * this.viewWidth, 2) + Math.pow(item.oldY - item.absY * this.viewWidth, 2))\n }\n let x = Math.floor((e.detail.x + this.viewWidth / 2) / this.viewWidth)\n if(x >= this.colsValue) return\n let y = Math.floor((e.detail.y + this.viewWidth / 2) / this.viewWidth)\n let index = this.colsValue * y + x\n if (item.index != index && index < this.imageList.length) {\n this.changeStatus = false\n for (let obj of this.imageList) {\n if (item.index > index && obj.index >= index && obj.index < item.index) {\n this.change(obj, 1)\n } else if (item.index < index && obj.index <= index && obj.index > item.index) {\n this.change(obj, -1)\n } else if(obj.id != item.id) {\n obj.offset = 0\n obj.x = obj.oldX\n obj.y = obj.oldY\n setTimeout(() => {\n this.$nextTick(() => {\n obj.x = obj.absX * this.viewWidth\n obj.y = obj.absY * this.viewWidth\n })\n }, 0)\n }\n }\n item.index = index\n item.absX = x\n item.absY = y\n \n }\n }\n },\n change(obj, i){\n obj.index += i\n obj.offset = 0\n obj.x = obj.oldX\n obj.y = obj.oldY\n obj.absX = obj.index % this.colsValue\n obj.absY = Math.floor(obj.index / this.colsValue)\n setTimeout(() => {\n this.$nextTick(() => {\n obj.x = obj.absX * this.viewWidth\n obj.y = obj.absY * this.viewWidth\n })\n }, 0)\n },\n touchstart(item) {\n\t uni.vibrateShort();\n\t item.disable=false;\n this.imageList.forEach(v => {\n v.zIndex = v.index + 9\n })\n item.zIndex = 99;\n item.moveEnd = true;\n this.tempItem = item\n this.timer = setTimeout(() => {\n item.scale = this.scale\n item.opacity = this.opacity\n clearTimeout(this.timer)\n this.timer = null\n }, 200)\n },\n touchend(item) {\n this.previewImage(item)\n item.scale = 1\n item.opacity = 1\n item.x = item.oldX\n item.y = item.oldY\n item.offset = 0\n item.moveEnd = false;\n\t item.disable=true;\n setTimeout(() => {\n this.$nextTick(() => {\n item.x = item.absX * this.viewWidth\n item.y = item.absY * this.viewWidth\n this.tempItem = null\n this.changeStatus = true\n })\n }, 0)\n\t this.sortList()\n },\n previewImage(index){\n\t if(typeof index==='object'){return;}\n\t\tif(this.chooseImage){\n\t\t\tthis.imageList[index].choosed=this.imageList[index].choosed?false:true\n\t\t\tlet num=1,arr=[];\n\t\t\tfor(let i=0;i<this.imageList.length;i++){\n\t\t\t\tif(this.imageList[i].choosed){\n\t\t\t\t\tthis.imageList[i].chooseIndex=num;\n\t\t\t\t\tnum++;\n\t\t\t\t\tarr.push(this.imageList[i].mediaId)\n\t\t\t\t}\n\t\t\t}\n\t\t\tthis.$emit('chooseEvent',arr)\n\t\t\treturn;\n\t\t}\n let arr=[],obj={};\n for(let i=0;i<this.imageList.length;i++){\n\t\t\tobj={url:'',type:''};\n\t\t\tif(this.imageList[i].cate==='Img'){\n\t\t\t\tobj.type='image';\n\t\t\t}\n\t\t\tif(this.imageList[i].cate==='Vdo'){\n\t\t\t\tobj.type='video';\n\t\t\t}\n\t\t\tobj.url=this.imageList[i].src;\n\t\t\tarr.push(obj)\n\t\t}\n uni.previewMedia({\n \tsources:arr,\n \tcurrent:index,\n \tshowmenu:true,\n \tsuccess: (res) => {\n \t},\n \tfail: (err) => {\n \t\tconsole.log(err);\n \t}\n })\n },\n mouseenter(){\n //#ifdef H5\n this.imageList.forEach(v => {\n v.disable = false\n })\n //#endif\n \n },\n mouseleave(){\n //#ifdef H5\n if(this.tempItem){\n this.imageList.forEach(v => {\n v.disable = true\n v.zIndex = v.index + 9\n v.offset = 0\n v.moveEnd = false\n if(v.id == this.tempItem.id){\n if (this.timer){\n clearTimeout(this.timer)\n this.timer = null\n }\n v.scale = 1\n v.opacity = 1\n v.x = v.oldX\n v.y = v.oldY\n this.$nextTick(() => {\n v.x = v.absX * this.viewWidth\n v.y = v.absY * this.viewWidth\n this.tempItem = null\n })\n }\n })\n this.changeStatus = true\n }\n //#endif\n },\n addImages() {\n if(this.custom){\n this.$emit('addImage')\n } else {\n let checkNumber = this.number - this.imageList.length\n uni.chooseImage({\n count: checkNumber,\n sourceType: ['album', 'camera'],\n success: res => {\n let count = checkNumber <= res.tempFilePaths.length ? checkNumber : res.tempFilePaths.length\n for (let i = 0; i < count; i++) {\n this.addProperties(res.tempFilePaths[i])\n }\n }\n })\n }\n },\n addImage(image){\n\t\tthis.addProperties(image);\n\n },\n delImage(item, index){\n this.imageList.splice(index, 1)\n for (let obj of this.imageList) {\n if (obj.index > item.index) {\n obj.index -= 1\n obj.x = obj.oldX\n obj.y = obj.oldY\n obj.absX = obj.index % this.colsValue\n obj.absY = Math.floor(obj.index / this.colsValue)\n this.$nextTick(() => {\n obj.x = obj.absX * this.viewWidth\n obj.y = obj.absY * this.viewWidth\n })\n }\n }\n this.add.x = (this.imageList.length % this.colsValue) * this.viewWidth + 'px'\n this.add.y = Math.floor(this.imageList.length / this.colsValue) * this.viewWidth + 'px'\n this.sortList();\n\t this.$emit('delImage',index)\n },\n delImageMp(item, index){\n //#ifdef MP\n this.delImage(item, index)\n //#endif\n },\n sortList() {\n let list=this.imageList.slice();\n list.sort((a, b) => {\n return a.index - b.index\n })\n for (let i = 0; i < list.length; i++) {\n list[i] = list[i].mediaId;\n }\n this.$emit('sortImage', list)\n },\n addProperties(item){\n let absX = this.imageList.length % this.colsValue\n let absY = Math.floor(this.imageList.length / this.colsValue)\n let x = absX * this.viewWidth\n let y = absY * this.viewWidth\n this.imageList.push({\n src: item.urlThumbnail,\n\t\tmediaId: item.mediaId,\n\t\tcate:item.cate,\n x,\n y,\n oldX: x,\n oldY: y,\n absX,\n absY,\n scale: 1,\n zIndex: 9,\n opacity: 1,\n index: this.imageList.length,\n id: this.guid(),\n disable: true,\n offset: 0,\n moveEnd: false,\n\t\tchoosed:false\n })\n this.add.x = (this.imageList.length % this.colsValue) * this.viewWidth + 'px'\n this.add.y = Math.floor(this.imageList.length / this.colsValue) * this.viewWidth + 'px'\n },\n nothing(){},\n rpx2px(v){\n return this.width * v / 750\n },\n guid() {\n \tfunction S4() {\n \t\treturn (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);\n \t}\n \treturn (S4() + S4() + \"-\" + S4() + \"-\" + S4() + \"-\" + S4() + \"-\" + S4() + S4() + S4());\n }\n }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.con {\n .area {\n width: 100%;\n .view {\n display: flex;\n justify-content: center;\n align-items: center;\n .area-con {\n position: relative;\n .pre-image {\n width: 100%;\n height: 100%;\n\t\t border-radius: 8rpx;\n }\n .del-con {\n position: absolute;\n top: 0rpx;\n right: 0rpx;\n padding: 0 0 20rpx 20rpx;\n .del-wrap {\n width: 36rpx;\n height: 36rpx;\n background-color: rgba(0, 0, 0, 0.4);\n border-radius: 0 0 0 10rpx;\n display: flex;\n justify-content: center;\n align-items: center;\n .del-image {\n width: 20rpx;\n height: 20rpx;\n }\n }\n }\n\t\t.choose{\n\t\t\twidth: 40rpx;\n\t\t\theight: 40rpx;\n\t\t\tposition: absolute;\n\t\t\tright: 8rpx;\n\t\t\ttop: 8rpx;\n\t\t\tborder-radius: 40rpx;\n\t\t\tborder: 2rpx solid #FFFFFF;\n\t\t\tbackground: #FE3B49;\n\t\t\tcolor: #FFFFFF;\n\t\t\ttext-align: center;\n\t\t\tfont-size: 24rpx;\n\t\t\tline-height: 40rpx;\n\t\t}\n }\n }\n .add {\n position: absolute;\n display: flex;\n justify-content: center;\n align-items: center;\n .add-wrap{\n display: flex;\n justify-content: center;\n align-items: center;\n background-color: #151126;\n }\n }\n }\n}\n</style>","import mod from \"-!../../../../HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../HBuilderX/plugins/uniapp-cli/node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--8-oneOf-1-2!../../../../HBuilderX/plugins/uniapp-cli/node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-3!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js??ref--8-oneOf-1-4!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--8-oneOf-1-5!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./DragImage.vue?vue&type=style&index=0&id=40b3ee54&lang=scss&scoped=true&\"; export default mod; export * from \"-!../../../../HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../HBuilderX/plugins/uniapp-cli/node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--8-oneOf-1-2!../../../../HBuilderX/plugins/uniapp-cli/node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-3!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js??ref--8-oneOf-1-4!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--8-oneOf-1-5!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./DragImage.vue?vue&type=style&index=0&id=40b3ee54&lang=scss&scoped=true&\"","// extracted by mini-css-extract-plugin\n if(module.hot) {\n // 1663896638393\n var cssReload = require(\"D:/HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/hmr/hotModuleReplacement.js\")(module.id, {\"hmr\":true,\"publicPath\":\"../../\",\"locals\":false});\n module.hot.dispose(cssReload);\n module.hot.accept(undefined, cssReload);\n }\n "],"sourceRoot":""}
|
