{"remainingRequest":"D:\\code\\vue\\front\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\code\\vue\\front\\src\\components\\FileUpload.vue?vue&type=script&lang=js","dependencies":[{"path":"D:\\code\\vue\\front\\src\\components\\FileUpload.vue","mtime":1709633798000},{"path":"D:\\code\\vue\\front\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\code\\vue\\front\\node_modules\\babel-loader\\lib\\index.js","mtime":456789000000},{"path":"D:\\code\\vue\\front\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\code\\vue\\front\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:DQoJaW1wb3J0IHN0b3JhZ2UgZnJvbSAiQC9jb21tb24vc3RvcmFnZSI7DQoJaW1wb3J0IGNvbmZpZyBmcm9tICJAL2NvbmZpZy9jb25maWciOw0KCWV4cG9ydCBkZWZhdWx0IHsNCgkJZGF0YSgpIHsNCgkJCXJldHVybiB7DQoJCQkJYmFzZVVybDogY29uZmlnLmJhc2VVcmwsDQoJCQkJLy8g5p+l55yL5aSn5Zu+DQoJCQkJZGlhbG9nVmlzaWJsZTogZmFsc2UsDQoJCQkJLy8g5p+l55yL5aSn5Zu+DQoJCQkJZGlhbG9nSW1hZ2VVcmw6ICIiLA0KCQkJCS8vIOe7hOS7tua4suafk+WbvueJh+eahOaVsOe7hOWtl+aute+8jOacieeJueauiuagvOW8j+imgeaxgg0KCQkJCWZpbGVMaXN0OiBbXSwNCgkJCQlmaWxlVXJsTGlzdDogW10sDQoJCQkJbXlIZWFkZXJzOiB7fQ0KCQkJfTsNCgkJfSwNCgkJcHJvcHM6IHsNCgkJCXRpcDogew0KCQkJCXR5cGU6IFN0cmluZw0KCQkJfSwNCgkJCWFjdGlvbjogew0KCQkJCXR5cGU6IFN0cmluZw0KCQkJfSwNCgkJCS8q5Zu+54mH5aSn5bCPKi8NCgkJCWxpbWl0OiB7DQoJCQkJdHlwZTogTnVtYmVyLA0KCQkJCWRlZmF1bHQ6IDMgLy9rYg0KCQkJfSwNCgkJCW11bHRpcGxlOiB7DQoJCQkJdHlwZTogQm9vbGVhbiwNCgkJCQlkZWZhdWx0OiBmYWxzZQ0KCQkJfSwNCgkJCWZpbGVVcmxzOiB7DQoJCQkJdHlwZTogU3RyaW5nDQoJCQl9LA0KCQkJdHlwZTogew0KCQkJCXR5cGU6IE51bWJlciwNCgkJCQlkZWZhdWx0OiAxDQoJCQl9DQoJCX0sDQoJCW1vdW50ZWQoKSB7DQoJCQl0aGlzLmluaXQoKTsNCgkJCXRoaXMubXlIZWFkZXJzID0gew0KCQkJCSdUb2tlbic6IHN0b3JhZ2UuZ2V0KCJmcm9udFRva2VuIikNCgkJCX0NCgkJfSwNCgkJd2F0Y2g6IHsNCgkJCWZpbGVVcmxzOiBmdW5jdGlvbih2YWwsIG9sZFZhbCkgew0KCQkJCS8vICAgY29uc29sZS5sb2coIm5ldzogJXMsIG9sZDogJXMiLCB2YWwsIG9sZFZhbCk7DQoJCQkJdGhpcy5pbml0KCk7DQoJCQl9DQoJCX0sDQoJCWNvbXB1dGVkOiB7DQoJCQkvLyDorqHnrpflsZ7mgKfnmoQgZ2V0dGVyDQoJCQlnZXRBY3Rpb25Vcmw6IGZ1bmN0aW9uKCkgew0KCQkJCXJldHVybiB0aGlzLmJhc2VVcmwgKyB0aGlzLmFjdGlvbjsNCgkJCX0NCgkJfSwNCgkJbWV0aG9kczogew0KCQkJLy8g5Yid5aeL5YyWDQoJCQlpbml0KCkgew0KCQkJCWlmICh0aGlzLmZpbGVVcmxzKSB7DQoJCQkJCXRoaXMuZmlsZVVybExpc3QgPSB0aGlzLmZpbGVVcmxzLnNwbGl0KCIsIik7DQoJCQkJCWxldCBmaWxlQXJyYXkgPSBbXTsNCgkJCQkJdGhpcy5maWxlVXJsTGlzdC5mb3JFYWNoKGZ1bmN0aW9uKGl0ZW0sIGluZGV4KSB7DQoJCQkJCQl2YXIgdXJsID0gaXRlbTsNCgkJCQkJCXZhciBuYW1lID0gaW5kZXg7DQoJCQkJCQl2YXIgZmlsZSA9IHsNCgkJCQkJCQluYW1lOiBuYW1lLA0KCQkJCQkJCXVybDogdXJsDQoJCQkJCQl9Ow0KCQkJCQkJZmlsZUFycmF5LnB1c2goZmlsZSk7DQoJCQkJCX0pOw0KCQkJCQl0aGlzLnNldEZpbGVMaXN0KGZpbGVBcnJheSk7DQoJCQkJfQ0KCQkJfSwNCgkJCWhhbmRsZUJlZm9yZVVwbG9hZChmaWxlKSB7DQoNCgkJCX0sDQoJCQkvLyDkuIrkvKDmlofku7bmiJDlip/lkI7miafooYwNCgkJCWhhbmRsZVVwbG9hZFN1Y2Nlc3MocmVzLCBmaWxlLCBmaWxlTGlzdCkgew0KCQkJCWlmIChyZXMgJiYgcmVzLmNvZGUgPT09IDApIHsNCgkJCQkJZmlsZUxpc3RbZmlsZUxpc3QubGVuZ3RoIC0gMV1bInVybCJdID0gInVwbG9hZC8iICsgZmlsZS5yZXNwb25zZS5maWxlOw0KCQkJCQl0aGlzLnNldEZpbGVMaXN0KGZpbGVMaXN0KTsNCgkJCQkJdGhpcy4kZW1pdCgiY2hhbmdlIiwgdGhpcy5maWxlVXJsTGlzdC5qb2luKCIsIikpOw0KCQkJCX0gZWxzZSB7DQoJCQkJCXRoaXMuJG1lc3NhZ2UuZXJyb3IocmVzLm1zZyk7DQoJCQkJfQ0KCQkJfSwNCgkJCS8vIOWbvueJh+S4iuS8oOWksei0pQ0KCQkJaGFuZGxlVXBsb2FkRXJyKGVyciwgZmlsZSwgZmlsZUxpc3QpIHsNCgkJCQl0aGlzLiRtZXNzYWdlLmVycm9yKCLmlofku7bkuIrkvKDlpLHotKUiKTsNCgkJCX0sDQoJCQkvLyDnp7vpmaTlm77niYcNCgkJCWhhbmRsZVJlbW92ZShmaWxlLCBmaWxlTGlzdCkgew0KCQkJCXRoaXMuc2V0RmlsZUxpc3QoZmlsZUxpc3QpOw0KCQkJCXRoaXMuJGVtaXQoImNoYW5nZSIsIHRoaXMuZmlsZVVybExpc3Quam9pbigiLCIpKTsNCgkJCX0sDQoJCQkvLyDmn6XnnIvlpKflm74NCgkJCWhhbmRsZVVwbG9hZFByZXZpZXcoZmlsZSkgew0KCQkJCWlmKHRoaXMudHlwZT4yKXsNCgkJCQkJd2luZG93Lm9wZW4oZmlsZS51cmwpDQoJCQkJCXJldHVybiBmYWxzZQ0KCQkJCX0NCgkJCQl0aGlzLmRpYWxvZ0ltYWdlVXJsID0gZmlsZS51cmw7DQoJCQkJdGhpcy5kaWFsb2dWaXNpYmxlID0gdHJ1ZTsNCgkJCX0sDQoJCQkvLyDpmZDliLblm77niYfmlbDph48NCgkJCWhhbmRsZUV4Y2VlZChmaWxlcywgZmlsZUxpc3QpIHsNCgkJCQl0aGlzLiRtZXNzYWdlLndhcm5pbmcoYOacgOWkmuS4iuS8oCR7dGhpcy5saW1pdH3lvKDlm77niYdgKTsNCgkJCX0sDQoJCQkvLyDph43mlrDlr7lmaWxlTGlzdOi/m+ihjOi1i+WAvA0KCQkJc2V0RmlsZUxpc3QoZmlsZUxpc3QpIHsNCgkJCQl2YXIgZmlsZUFycmF5ID0gW107DQoJCQkJdmFyIGZpbGVVcmxBcnJheSA9IFtdOw0KCQkJCS8vIOacieS6m+WbvueJh+S4jeaYr+WFrOW8gOeahO+8jOaJgOS7pemcgOimgeaQuuW4pnRva2Vu5L+h5oGv5YGa5p2D6ZmQ5qCh6aqMDQoJCQkJdmFyIHRva2VuID0gc3RvcmFnZS5nZXQoImZyb250VG9rZW4iKTsNCgkJCQlsZXQgX3RoaXMgPSB0aGlzOw0KCQkJCWZpbGVMaXN0LmZvckVhY2goZnVuY3Rpb24oaXRlbSwgaW5kZXgpIHsNCgkJCQkJdmFyIHVybCA9IGl0ZW0udXJsLnNwbGl0KCI/IilbMF07DQoJCQkJCWlmICghdXJsLnN0YXJ0c1dpdGgoImh0dHAiKSkgew0KCQkJCQkJdXJsID0gX3RoaXMuYmFzZVVybCArIHVybA0KCQkJCQl9DQoJCQkJCXZhciBuYW1lID0gaXRlbS5uYW1lOw0KCQkJCQl2YXIgZmlsZSA9IHsNCgkJCQkJCW5hbWU6IG5hbWUsDQoJCQkJCQl1cmw6IHVybCArICI/dG9rZW49IiArIHRva2VuDQoJCQkJCX07DQoJCQkJCWZpbGVBcnJheS5wdXNoKGZpbGUpOw0KCQkJCQlmaWxlVXJsQXJyYXkucHVzaCh1cmwpOw0KCQkJCX0pOw0KCQkJCXRoaXMuZmlsZUxpc3QgPSBmaWxlQXJyYXk7DQoJCQkJdGhpcy5maWxlVXJsTGlzdCA9IGZpbGVVcmxBcnJheTsNCgkJCX0NCgkJfQ0KCX07DQo="},{"version":3,"sources":["FileUpload.vue"],"names":[],"mappings":";AAyBA;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;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;;AAEA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"FileUpload.vue","sourceRoot":"src/components","sourcesContent":["<template>\r\n\t<div>\r\n\t\t<!-- 上传文件组件 -->\r\n\t\t<el-upload v-if=\"type==1\" ref=\"upload\" :action=\"getActionUrl\" list-type=\"picture-card\" :multiple=\"multiple\" :limit=\"limit\"\r\n\t\t\t:headers=\"myHeaders\" :file-list=\"fileList\" :on-exceed=\"handleExceed\" :on-preview=\"handleUploadPreview\"\r\n\t\t\t:on-remove=\"handleRemove\" :on-success=\"handleUploadSuccess\" :on-error=\"handleUploadErr\"\r\n\t\t\t:before-upload=\"handleBeforeUpload\">\r\n\t\t\t<i class=\"el-icon-plus\"></i>\r\n\t\t\t<div slot=\"tip\" class=\"el-upload__tip\" style=\"color:#838fa1;\">{{tip}}</div>\r\n\t\t</el-upload>\r\n\t\t<el-upload v-else drag ref=\"upload\" :action=\"getActionUrl\" :multiple=\"multiple\" :limit=\"limit\"\r\n\t\t\t:headers=\"myHeaders\" :file-list=\"fileList\" :on-exceed=\"handleExceed\" :on-preview=\"handleUploadPreview\"\r\n\t\t\t:on-remove=\"handleRemove\" :on-success=\"handleUploadSuccess\" :on-error=\"handleUploadErr\"\r\n\t\t\t:before-upload=\"handleBeforeUpload\">\r\n\t\t\t<i class=\"el-icon-upload\"></i>\r\n\t\t\t  <div class=\"el-upload__text\">将文件拖到此处，或<em>点击上传</em></div>\r\n\t\t\t<div slot=\"tip\" class=\"el-upload__tip\" style=\"color:#838fa1;\">{{tip}}</div>\r\n\t\t</el-upload>\r\n\t\t<el-dialog :visible.sync=\"dialogVisible\" size=\"tiny\" append-to-body>\r\n\t\t\t<img width=\"100%\" v-if=\"type==1\" :src=\"dialogImageUrl\" alt>\r\n\t\t\t<video width=\"100%\" v-if=\"type==2\" :src=\"dialogImageUrl\" alt controls />\r\n\t\t</el-dialog>\r\n\t</div>\r\n</template>\r\n<script>\r\n\timport storage from \"@/common/storage\";\r\n\timport config from \"@/config/config\";\r\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\tbaseUrl: config.baseUrl,\r\n\t\t\t\t// 查看大图\r\n\t\t\t\tdialogVisible: false,\r\n\t\t\t\t// 查看大图\r\n\t\t\t\tdialogImageUrl: \"\",\r\n\t\t\t\t// 组件渲染图片的数组字段，有特殊格式要求\r\n\t\t\t\tfileList: [],\r\n\t\t\t\tfileUrlList: [],\r\n\t\t\t\tmyHeaders: {}\r\n\t\t\t};\r\n\t\t},\r\n\t\tprops: {\r\n\t\t\ttip: {\r\n\t\t\t\ttype: String\r\n\t\t\t},\r\n\t\t\taction: {\r\n\t\t\t\ttype: String\r\n\t\t\t},\r\n\t\t\t/*图片大小*/\r\n\t\t\tlimit: {\r\n\t\t\t\ttype: Number,\r\n\t\t\t\tdefault: 3 //kb\r\n\t\t\t},\r\n\t\t\tmultiple: {\r\n\t\t\t\ttype: Boolean,\r\n\t\t\t\tdefault: false\r\n\t\t\t},\r\n\t\t\tfileUrls: {\r\n\t\t\t\ttype: String\r\n\t\t\t},\r\n\t\t\ttype: {\r\n\t\t\t\ttype: Number,\r\n\t\t\t\tdefault: 1\r\n\t\t\t}\r\n\t\t},\r\n\t\tmounted() {\r\n\t\t\tthis.init();\r\n\t\t\tthis.myHeaders = {\r\n\t\t\t\t'Token': storage.get(\"frontToken\")\r\n\t\t\t}\r\n\t\t},\r\n\t\twatch: {\r\n\t\t\tfileUrls: function(val, oldVal) {\r\n\t\t\t\t//   console.log(\"new: %s, old: %s\", val, oldVal);\r\n\t\t\t\tthis.init();\r\n\t\t\t}\r\n\t\t},\r\n\t\tcomputed: {\r\n\t\t\t// 计算属性的 getter\r\n\t\t\tgetActionUrl: function() {\r\n\t\t\t\treturn this.baseUrl + this.action;\r\n\t\t\t}\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\t// 初始化\r\n\t\t\tinit() {\r\n\t\t\t\tif (this.fileUrls) {\r\n\t\t\t\t\tthis.fileUrlList = this.fileUrls.split(\",\");\r\n\t\t\t\t\tlet fileArray = [];\r\n\t\t\t\t\tthis.fileUrlList.forEach(function(item, index) {\r\n\t\t\t\t\t\tvar url = item;\r\n\t\t\t\t\t\tvar name = index;\r\n\t\t\t\t\t\tvar file = {\r\n\t\t\t\t\t\t\tname: name,\r\n\t\t\t\t\t\t\turl: url\r\n\t\t\t\t\t\t};\r\n\t\t\t\t\t\tfileArray.push(file);\r\n\t\t\t\t\t});\r\n\t\t\t\t\tthis.setFileList(fileArray);\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\thandleBeforeUpload(file) {\r\n\r\n\t\t\t},\r\n\t\t\t// 上传文件成功后执行\r\n\t\t\thandleUploadSuccess(res, file, fileList) {\r\n\t\t\t\tif (res && res.code === 0) {\r\n\t\t\t\t\tfileList[fileList.length - 1][\"url\"] = \"upload/\" + file.response.file;\r\n\t\t\t\t\tthis.setFileList(fileList);\r\n\t\t\t\t\tthis.$emit(\"change\", this.fileUrlList.join(\",\"));\r\n\t\t\t\t} else {\r\n\t\t\t\t\tthis.$message.error(res.msg);\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\t// 图片上传失败\r\n\t\t\thandleUploadErr(err, file, fileList) {\r\n\t\t\t\tthis.$message.error(\"文件上传失败\");\r\n\t\t\t},\r\n\t\t\t// 移除图片\r\n\t\t\thandleRemove(file, fileList) {\r\n\t\t\t\tthis.setFileList(fileList);\r\n\t\t\t\tthis.$emit(\"change\", this.fileUrlList.join(\",\"));\r\n\t\t\t},\r\n\t\t\t// 查看大图\r\n\t\t\thandleUploadPreview(file) {\r\n\t\t\t\tif(this.type>2){\r\n\t\t\t\t\twindow.open(file.url)\r\n\t\t\t\t\treturn false\r\n\t\t\t\t}\r\n\t\t\t\tthis.dialogImageUrl = file.url;\r\n\t\t\t\tthis.dialogVisible = true;\r\n\t\t\t},\r\n\t\t\t// 限制图片数量\r\n\t\t\thandleExceed(files, fileList) {\r\n\t\t\t\tthis.$message.warning(`最多上传${this.limit}张图片`);\r\n\t\t\t},\r\n\t\t\t// 重新对fileList进行赋值\r\n\t\t\tsetFileList(fileList) {\r\n\t\t\t\tvar fileArray = [];\r\n\t\t\t\tvar fileUrlArray = [];\r\n\t\t\t\t// 有些图片不是公开的，所以需要携带token信息做权限校验\r\n\t\t\t\tvar token = storage.get(\"frontToken\");\r\n\t\t\t\tlet _this = this;\r\n\t\t\t\tfileList.forEach(function(item, index) {\r\n\t\t\t\t\tvar url = item.url.split(\"?\")[0];\r\n\t\t\t\t\tif (!url.startsWith(\"http\")) {\r\n\t\t\t\t\t\turl = _this.baseUrl + url\r\n\t\t\t\t\t}\r\n\t\t\t\t\tvar name = item.name;\r\n\t\t\t\t\tvar file = {\r\n\t\t\t\t\t\tname: name,\r\n\t\t\t\t\t\turl: url + \"?token=\" + token\r\n\t\t\t\t\t};\r\n\t\t\t\t\tfileArray.push(file);\r\n\t\t\t\t\tfileUrlArray.push(url);\r\n\t\t\t\t});\r\n\t\t\t\tthis.fileList = fileArray;\r\n\t\t\t\tthis.fileUrlList = fileUrlArray;\r\n\t\t\t}\r\n\t\t}\r\n\t};\r\n</script>\r\n<style lang=\"scss\" scoped>\r\n</style>"]}]}