1 line
6.0 KiB
JSON
1 line
6.0 KiB
JSON
{"remainingRequest":"G:\\project\\smart-power-ui\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!G:\\project\\smart-power-ui\\src\\components\\Upload\\Image.vue?vue&type=style&index=0&lang=css&","dependencies":[{"path":"G:\\project\\smart-power-ui\\src\\components\\Upload\\Image.vue","mtime":1615961090238},{"path":"G:\\project\\smart-power-ui\\node_modules\\css-loader\\dist\\cjs.js","mtime":1592876569350},{"path":"G:\\project\\smart-power-ui\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":1610504274351},{"path":"G:\\project\\smart-power-ui\\node_modules\\postcss-loader\\src\\index.js","mtime":1591751774425},{"path":"G:\\project\\smart-power-ui\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1591751767036},{"path":"G:\\project\\smart-power-ui\\node_modules\\vue-loader\\lib\\index.js","mtime":1610504274351}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:CgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKLmF2YXRhci11cGxvYWRlciAuZWwtdXBsb2FkIHsKICAgIGJvcmRlcjogMXB4IGRhc2hlZCAjZDlkOWQ5OwogICAgYm9yZGVyLXJhZGl1czogNnB4OwogICAgY3Vyc29yOiBwb2ludGVyOwogICAgcG9zaXRpb246IHJlbGF0aXZlOwogICAgb3ZlcmZsb3c6IGhpZGRlbjsKCXdpZHRoOiAxMDAlOwoJaGVpZ2h0OiAxMDAlOwoJanVzdGlmeS1jb250ZW50OiBjZW50ZXI7CiAgICBhbGlnbi1pdGVtczogY2VudGVyOwoJZGlzcGxheTogZmxleDsKICB9CiAgLmF2YXRhci11cGxvYWRlciAuZWwtdXBsb2FkOmhvdmVyIHsKICAgIGJvcmRlci1jb2xvcjogIzQwOUVGRjsKICB9CiAgLmF2YXRhci11cGxvYWRlci1pY29uIHsKICAgIGZvbnQtc2l6ZTogMjhweDsKICAgIGNvbG9yOiAjOGM5MzlkOwogICAgd2lkdGg6IDE0OHB4OwogICAgaGVpZ2h0OiAxNDhweDsKICAgIGxpbmUtaGVpZ2h0OiAxNDhweDsKICAgIHRleHQtYWxpZ246IGNlbnRlcjsKICB9CiAgLmF2YXRhciB7CiAgICB3aWR0aDogMTQ4cHg7CiAgICBoZWlnaHQ6IDE0OHB4OwogICAgZGlzcGxheTogYmxvY2s7CiAgfQogIC5kZWxldGUtaSB7CgkJZm9udC1zaXplOiAxOHB4OwogICAgcG9zaXRpb246IGFic29sdXRlOwogICAgdG9wOiAwcHg7CiAgICBsZWZ0OiAwcHg7CiAgICBkaXNwbGF5OiBmbGV4OwogICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7CiAgICBhbGlnbi1pdGVtczogY2VudGVyOwogICAgaGVpZ2h0OiAxMDAlOwogICAgd2lkdGg6IDEwMCU7CiAgICBjb2xvcjogYWxpY2VibHVlOwoJCWJhY2tncm91bmQtY29sb3I6IHJnYig0MiA0MiA0MiAvIDAuNik7CiAgfQo="},{"version":3,"sources":["Image.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6FA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"Image.vue","sourceRoot":"src/components/Upload","sourcesContent":["<template>\n<div>\n\t<el-upload\n\t\tclass=\"avatar-uploader\"\n\t\t:style=\"compStyle\"\n\t\taction=\"\"\n\t\t:http-request=\"uploud\"\n\t\t:show-file-list=\"false\"\n\t\t:before-upload=\"beforeAvatarUpload\">\n\t\t<img v-if=\"imageUrl \" :style=\"imgStrle\" @mouseleave=\"() => {image_shwo = false}\" @mouseover=\"() => {image_shwo = true}\" :src=\"getIotFileUrl(imageUrl)\" class=\"avatar\">\n\t\t<i v-else class=\"el-icon-plus avatar-uploader-icon\" :style=\"imgStrle\" ></i>\n\t\t<div v-show=\"imageUrl && image_shwo\" :style=\"compStyle\" @mouseleave=\"() => {image_shwo = false}\" @mouseover=\"() => {image_shwo = true}\" class=\"delete-i\">\n\t\t\t<i @click.stop=\"handlePictureCardPreview()\" style=\"margin-right: 25px;\" class=\"el-icon-plus el-icon-zoom-in\" />\n\t\t\t<i @click.stop=\"deleteFile()\" class=\"el-icon-plus el-icon-delete\"/>\n\t\t</div>\n\t\t</el-upload>\n\t\t<el-dialog :visible.sync=\"dialogVisible\">\n\t\t\t<img width=\"100%\" :src=\"getIotFileUrl(dialogImageUrl)\" alt=\"\">\n\t\t</el-dialog>\n</div>\n</template>\n<script>\nimport { uploadFile } from \"@/api/file\";\nimport { getIotFileUrl } from \"@/utils/hciot\"\nexport default {\n\tname: 'uploadImg',\n\tprops: {\n\t\timageUrl: {\n\t\t\ttype: String,\n\t\t\tdefault: ''\n\t\t},\n\t\tfileType: {\n\t\t\ttype: Array,\n\t\t\tfactory() { return ['image/jpeg']}\n\t\t},\n\t\tfileSize: {\n\t\t\ttype: Number,\n\t\t\tdefault: 2097152 //字节 1m\n\t\t},\n\t\tcompStyle: {\n\t\t\ttype: [String,Object],\n\t\t\tdefault: ''\n\t\t},\n\t\timgStrle: {\n\t\t\ttype: [String,Object],\n\t\t\tdefault: ''\n\t\t}\n\t},\n\tdata() {\n\t\treturn {\n\t\t\timage_shwo: false,\n\t\t\tdialogVisible: false,\n\t\t\tdialogImageUrl: ''\n\t\t}\n\t},\n\tmethods: {\n\t\tgetIotFileUrl,\n\t\tuploud(file) {\n\t\t\tlet formData = new FormData();\n\t\t\tformData.append(\"file\", file.file);\n\t\t\tuploadFile(formData).then(response => {\n\t\t\t\tif (response.code === 200) {\n\t\t\t\t\tthis.$emit('eventUrl', response.url)\n\t\t\t\t}\n\t\t\t}).catch(e => {\n\t\t\t\tconsole.log(e)\n\t\t\t})\n\t\t},\n\t\thandlePictureCardPreview(url) {\n\t\t\tthis.dialogImageUrl = this.imageUrl;\n\t\t\tthis.dialogVisible = true;\n\t\t},\n\t\tbeforeAvatarUpload(file) {\n\t\t\tconsole.log(file.type)\n\t\t\tconst isJPG = this.fileType.indexOf(file.type) >= 0;\n\t\t\tconst isLt2M = file.size < this.fileSize;\n\n\t\t\tif (!isJPG) {\n\t\t\t\tthis.$message.error('上传头像图片只能是 JPG 格式!');\n\t\t\t}\n\t\t\tif (!isLt2M) {\n\t\t\t\tthis.$message.error('上传头像图片大小不能超过 2MB!');\n\t\t\t}\n\t\t\treturn isJPG && isLt2M;\n\t\t},\n\t\tdeleteFile() {\n\t\t\t// this.imageUrl = ''\n\t\t\tthis.$emit('eventUrl', '')\n\t\t}\n\t}\n}\n</script>\n<style>\n.avatar-uploader .el-upload {\n border: 1px dashed #d9d9d9;\n border-radius: 6px;\n cursor: pointer;\n position: relative;\n overflow: hidden;\n\twidth: 100%;\n\theight: 100%;\n\tjustify-content: center;\n align-items: center;\n\tdisplay: flex;\n }\n .avatar-uploader .el-upload:hover {\n border-color: #409EFF;\n }\n .avatar-uploader-icon {\n font-size: 28px;\n color: #8c939d;\n width: 148px;\n height: 148px;\n line-height: 148px;\n text-align: center;\n }\n .avatar {\n width: 148px;\n height: 148px;\n display: block;\n }\n .delete-i {\n\t\tfont-size: 18px;\n position: absolute;\n top: 0px;\n left: 0px;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n width: 100%;\n color: aliceblue;\n\t\tbackground-color: rgb(42 42 42 / 0.6);\n }\n</style>\n"]}]} |