Commit 6da0b9d5 authored by qzhxx's avatar qzhxx

merge

parents 1a838397 adfc992a
<template>
<form enctype="multipart/form-data">
选择多文件:
<input type="file" name="files" multiple="multiple" @change="getFiles($event)"/>
<br />选择文件夹,遍历该文件夹下所有文件
<input @change="getFiles($event)" type="file" name="files" webkitdirectory mozdirectory />
<el-form enctype="multipart/form-data">
选择多文件:
<input type="file" name="files" multiple="multiple" @change="getFiles($event)" />
<br />选择文件夹:
<input @change="getFiles($event)" type="file" name="files" webkitdirectory mozdirectory />
<br />
<a @click.stop="upload">上传</a>
</form>
<ul class="el-upload-list el-upload-list--text">
<li class="el-upload-list__item is-ready" v-for="(item, i) in files" :label="item.name" :value="item.name" :key="i">
{{item.name}}
<span>
<el-button size="mini" type="text">
<i @click="remove(item)" class="el-icon-close"></i>
</el-button>
</span>
</li>
</ul>
<!-- <div>
{{files}}
选择多个文件:
<input @change="getFiles($event)" type="file" multiple="multiple" />
<br />选择文件夹,遍历该文件夹下所有文件:
<input @change="getFiles($event)" type="file" webkitdirectory mozdirectory />
<br />
<button @click.stop="upload">上传</button>
</div> -->
<el-button size="medium" type="success" @click.stop="upload">上传到服务器</el-button>
</el-form>
</template>
<script>
import axios from "axios";
export default {
name: "UploadFileVue",
props:{
fileList:{
type:Array,
default:[]
},
},
data() {
return {
files: []
fullscreenLoading: false,
files: [
]
};
},
watch: {
fileList(newName, oldName) {
console.log(newName)
this.files = newName
// ...
}
},
computed: {
headers() {
return {
......@@ -35,23 +52,34 @@ export default {
};
}
},
methods: {
remove(data) {
const children = this.files;
const index = children.findIndex(d => d.name === data.name);
children.splice(index, 1);
},
getFiles: function(event) {
console.log(event)
console.log(event);
var files = event.target.files;
for (var i = 0; i < files.length; i++) {
this.files.push(files[i]);
}
console.log(this.files,'--')
console.log(this.files, "--");
},
upload: function() {
const loading = this.$loading({
lock: true,
text: '上传中,请稍候。。。',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
console.log(this.files);
// alert("111")
var formData = new FormData();
for (var i = 0; i < this.files.length; i++) {
formData.append("file", this.files[i]);
}
console.log(formData)
console.log(formData);
let _this = this;
_this
.$https(
......@@ -63,19 +91,18 @@ export default {
formData
)
.then(res => {
loading.close();
let resData = res.data;
console.log(res);
// this.loading = false
if (resData.resultCode == "200") {
_this.$message.success("上传成功!");
// const data = resData.data.fileList;
// let newArray = data.map((item) => item.id);
// let editArray =[]
// if(this.fileList.length){
// editArray = this.fileList.map(item=>item.id)
// }
// this.$emit("videoList", [...newArray,...editArray]);
const data = resData.data.fileList;
let newArray = data.map((item) => item.id);
let editArray =[]
if(this.files.length){
editArray = this.files.map(item=>item.id)
}
this.$emit("videoList", [...newArray,...editArray]);
} else {
_this.$message.error(resData.msg || resData.message);
}
......@@ -84,32 +111,6 @@ export default {
console.log(err);
_this.$message.error(err.msg || err.message);
});
// axios({
// method: "post",
// url: "http://111.203.232.175:8088/mall/file/video/content/upload",
// data: {
// formData
// },
// headers: {
// Authorization: localStorage.getItem("backToken") || ""
// },
// responseType: "blob"
// }).then(res => {
// console.log(res);
// alert('文件夹上传成功!')
// });
// this.$axios.post("http://111.203.232.175:8088/mall/file/video/content/upload", formData, {
// headers: {
// // 'Content-Type': 'multipart/form-data',
// Authorization: localStorage.getItem("backToken") || "",
// }
// }).then(function(response) {
// console.log(respose)
// // 请求成功
// }, function(err) {
// })
}
}
};
......
......@@ -16,12 +16,7 @@
:inline="true"
label-position="top"
>
<!-- <el-form-item label="多文件上传测试" >
<div style="color:red;">
(可支持word、PDF、ppt、视频类型文件及图片上传)
</div>
<upload-folder ></upload-folder>
</el-form-item> -->
<el-form-item label="视频名称" prop="name" class="w100">
<el-input oninput="value = value.trim()" v-model="ruleForm.name"></el-input>
</el-form-item>
......@@ -77,10 +72,17 @@
<el-form-item label="视频缩略图" required>
<upload-img :fileList="ruleForm.imageList" @imgUrl="imgUrl"></upload-img>
</el-form-item>
<el-form-item label="上传视频" required>
<!-- <el-form-item label="上传视频" required>
<p style="color:red">(支持上传多个视频及视频文件夹,视频语言支持汉语、蒙语、藏语、维吾尔语、英语,视频命名规定:视频名称+语言)</p>
<upload-file :fileList="ruleForm.videoList" @videoList="videoList"></upload-file>
</el-form-item>
</el-form-item> -->
<el-form-item label="上传视频" required >
<div style="color:red;">
(支持上传多个视频及视频文件夹,视频语言支持汉语、蒙语、藏语、维吾尔语、英语,视频命名规定:视频名称+语言)
</div>
<upload-folder :fileList="ruleForm.videoList" @videoList="videoList" ></upload-folder>
</el-form-item>
</el-form>
<!--新增弹框-->
<el-dialog
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment