|
|
import { Component, OnInit,ViewChild ,Inject,NgZone } from '@angular/core'; |
|
|
import { SelectionModel } from '@angular/cdk/collections'; |
|
|
import {MatSort} from '@angular/material/sort'; |
|
|
import {MatTableDataSource} from '@angular/material/table'; |
|
|
import { HttpClient,HttpHeaders } from '@angular/common/http'; |
|
|
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar'; |
|
|
import { IsLoginService } from '../../is-login.service' |
|
|
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; |
|
|
import {UploadFilesComponent} from '../upload-files/upload-files.component' |
|
|
@Component({ |
|
|
selector: 'app-all-file', |
|
|
templateUrl: './all-file.component.html', |
|
|
styleUrls: ['./all-file.component.scss'], |
|
|
}) |
|
|
export class AllFileComponent { |
|
|
displayedColumns: string[] = ['select', 'name', 'weight', 'time']; |
|
|
dataSource:any = new MatTableDataSource; |
|
|
|
|
|
constructor(private http: HttpClient,public snackBar: MatSnackBar,public downloadFile:IsLoginService,public dialog: MatDialog,private zone: NgZone) { } |
|
|
isCancel:boolean = false //搜索框的X是否显示 |
|
|
searchData:any = "搜索您的文件" //搜索框内容 |
|
|
isClickFile:boolean = false //是否点击过文件 |
|
|
isOpenUpload:boolean = false //是否移入上传按钮 |
|
|
isDelete:boolean = false //是否删除按钮 |
|
|
isNoFileTitle:boolean = false //无文件时提示 |
|
|
|
|
|
|
|
|
|
|
|
selectedDataBank:string = '' //当前需要显示的资料库 |
|
|
fileNum:any = 0 //当前资料库文件数量 |
|
|
|
|
|
selection = new SelectionModel(true, []); |
|
|
@ViewChild(MatSort) sort: MatSort; |
|
|
@ViewChild( 'child',{static: false} ) child:UploadFilesComponent //上传文件夹子组件 |
|
|
|
|
|
oldDataSource:any; //原始表格数据 |
|
|
//表头排序 |
|
|
sortData (e) { |
|
|
let data = this.oldDataSource.concat(); |
|
|
// console.log(123,data) |
|
|
data.forEach(element => { |
|
|
if(element.key.indexOf(".") != -1){ |
|
|
let typeArr = element.key.split('.') |
|
|
element.type = typeArr[typeArr.length - 1] |
|
|
element.newTime = new Date(element.lastModified).getTime() |
|
|
} |
|
|
|
|
|
}); |
|
|
// console.log(666,e) |
|
|
if( e.direction=='asc' ) { //从小到大排序 |
|
|
data.sort( function(a,b) { |
|
|
return a.newTime - b.newTime |
|
|
} ) |
|
|
this.dataSource = new MatTableDataSource(data); |
|
|
} else if ( e.direction=='desc' ) {//从大到小排序 |
|
|
data.sort( function(a,b) { |
|
|
return b.newTime - a.newTime |
|
|
} ) |
|
|
this.dataSource = new MatTableDataSource(data); |
|
|
} else { //原始数据 |
|
|
this.dataSource = new MatTableDataSource(this.oldDataSource); |
|
|
} |
|
|
} |
|
|
|
|
|
ngOnInit(): void { |
|
|
this.dataSource.sort = this.sort; |
|
|
// this.getAllDataBank() |
|
|
this.getALLFileList("支队级-主官") |
|
|
} |
|
|
|
|
|
//获得所有资料库，默认显示第一个资料库的文件 |
|
|
getAllDataBank(){ |
|
|
this.http.get('/api/DataBanks').subscribe((data:any) => { |
|
|
if(data.length != 0){ |
|
|
this.selectedDataBank = data[0].name |
|
|
this.getALLFileList(data[0].name) |
|
|
} |
|
|
}) |
|
|
} |
|
|
|
|
|
//获得当前资料库的文件列表 |
|
|
getALLFileList(name){ |
|
|
|
|
|
this.selectedDataBank = name |
|
|
let paramsdata = { |
|
|
prefix : "allFiles/" + this.selectedDataBank + "/", |
|
|
delimiter : "/" |
|
|
} |
|
|
this.http.get(`/api/Objects/drives`,{ |
|
|
params:paramsdata |
|
|
}).subscribe((data:any) => { |
|
|
console.log(456,data) |
|
|
this.selection.clear() |
|
|
data.contents.forEach((item)=>{ |
|
|
let typeArr = item.key.split('.') |
|
|
item.type = typeArr[typeArr.length - 1] |
|
|
}) |
|
|
if(this.selectedDataBank == "装备车辆"){ |
|
|
data.contents.unshift( |
|
|
{ key: "装备车辆/高喷车", |
|
|
lastModified: null, |
|
|
eTag: null, |
|
|
size: 0, |
|
|
isDir: false, |
|
|
type: "gaopenche" |
|
|
}, |
|
|
{ key: "装备车辆/登高平台车", |
|
|
lastModified: null, |
|
|
eTag: null, |
|
|
size: 0, |
|
|
isDir: false, |
|
|
type: "denggao" |
|
|
} |
|
|
, |
|
|
{ key: "装备车辆/机器人", |
|
|
lastModified: null, |
|
|
eTag: null, |
|
|
size: 0, |
|
|
isDir: false, |
|
|
type: "jiqiren" |
|
|
}, |
|
|
{ key: "装备车辆/空气呼吸器", |
|
|
lastModified: null, |
|
|
eTag: null, |
|
|
size: 0, |
|
|
isDir: false, |
|
|
type: "konghuqi" |
|
|
} |
|
|
) |
|
|
} |
|
|
if(this.selectedDataBank == "设备设施"){ |
|
|
data.contents.unshift( |
|
|
{ key: "设备设施/外浮顶罐", |
|
|
lastModified: null, |
|
|
eTag: null, |
|
|
size: 0, |
|
|
isDir: false, |
|
|
type: "waifu" |
|
|
}, |
|
|
{ key: "设备设施/内浮顶罐", |
|
|
lastModified: null, |
|
|
eTag: null, |
|
|
size: 0, |
|
|
isDir: false, |
|
|
type: "neifu" |
|
|
}, |
|
|
{ key: "设备设施/拱顶罐", |
|
|
lastModified: null, |
|
|
eTag: null, |
|
|
size: 0, |
|
|
isDir: false, |
|
|
type: "gong" |
|
|
}, |
|
|
{ key: "设备设施/球罐", |
|
|
lastModified: null, |
|
|
eTag: null, |
|
|
size: 0, |
|
|
isDir: false, |
|
|
type: "qiu" |
|
|
} |
|
|
) |
|
|
} |
|
|
this.oldDataSource = data.contents //保存表格数据 |
|
|
|
|
|
this.dataSource = new MatTableDataSource(data.contents); |
|
|
|
|
|
this.fileNum = data.contents.length |
|
|
if(data.contents.length == 0){ |
|
|
this.isNoFileTitle = true |
|
|
}else{ |
|
|
this.isNoFileTitle = false |
|
|
} |
|
|
}) |
|
|
} |
|
|
|
|
|
//判断是否全部选中 |
|
|
isAllSelected() { |
|
|
const numSelected = this.selection.selected.length; |
|
|
const numRows = this.dataSource.data.length; |
|
|
return numSelected === numRows; |
|
|
} |
|
|
|
|
|
//控制全选按钮 |
|
|
masterToggle() { |
|
|
this.isAllSelected() ? this.selection.clear() : this.dataSource.data.forEach(row => this.selection.select(row)); |
|
|
this.isAllSelected() ? this.isDelete = true : this.isDelete = false; |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
//搜索框获得焦点事件 |
|
|
searchfocus(e){ |
|
|
this.isCancel = true |
|
|
if(e.target.value == "搜索您的文件"){ |
|
|
e.target.value = "" |
|
|
} |
|
|
} |
|
|
//搜索框失去焦点事件 |
|
|
searchblur(e){ |
|
|
if(e.target.value == ""){ |
|
|
e.target.value = "搜索您的文件" |
|
|
this.isCancel = false |
|
|
} |
|
|
} |
|
|
//搜索框点击X事件 |
|
|
cancelbtn(){ |
|
|
this.getALLFileList(this.selectedDataBank) |
|
|
this.searchData = "搜索您的文件" |
|
|
this.isCancel = false |
|
|
} |
|
|
//点击搜索 |
|
|
search(){ |
|
|
console.log(13,this.searchData) |
|
|
if(this.searchData != "搜索您的文件"){ |
|
|
this.http.get("/api/Objects/drives",{ |
|
|
params:{ |
|
|
prefix : this.searchData, |
|
|
delimiter : "/" |
|
|
} |
|
|
}).subscribe(data=>{ |
|
|
console.log(data) |
|
|
}, |
|
|
err=>{ |
|
|
|
|
|
}) |
|
|
} |
|
|
} |
|
|
|
|
|
goback:any //记录上一级目录 |
|
|
//点击列表每一条的名字 |
|
|
clickName(e,item){ |
|
|
// console.log(item) |
|
|
e.stopPropagation() |
|
|
|
|
|
if(item.type == "jpg" || item.type == "png" || item.type == "bmp"|| item.type == "gif" || item.type == "jpeg"&& !item.isDir){ |
|
|
const dialogRef = this.dialog.open(ViewDetails, {//调用open方法打开对话框并且携带参数过去 |
|
|
|
|
|
data: {url:item.key,type:"img"} |
|
|
}); |
|
|
|
|
|
}else if(item.type == "mp4" || item.type == "MP4" && !item.isDir){ |
|
|
console.log(666,item.key) |
|
|
const dialogRef = this.dialog.open(ViewDetails, {//调用open方法打开对话框并且携带参数过去 |
|
|
width: '1400px', |
|
|
height:'800px', |
|
|
data: {url:item.key,type:"video"} |
|
|
}); |
|
|
dialogRef.afterClosed().subscribe( |
|
|
|
|
|
); |
|
|
}else if(item.type == "mp3" || item.type == "MP3"&& !item.isDir){ |
|
|
|
|
|
const dialogRef = this.dialog.open(ViewDetails, {//调用open方法打开对话框并且携带参数过去 |
|
|
width: '400px', |
|
|
height:'108px', |
|
|
data: {url:item.key,type:"mp3"} |
|
|
}); |
|
|
dialogRef.afterClosed().subscribe( |
|
|
|
|
|
); |
|
|
}else if(item.type == "pdf"){ |
|
|
// console.log(item) |
|
|
window.open("/api/Objects/drives/" + item.key) |
|
|
|
|
|
}else if(item.type == "gaopenche"){ |
|
|
|
|
|
window.open("GaoPenChe") |
|
|
|
|
|
}else if(item.type == "denggao"){ |
|
|
|
|
|
window.open("denggaoche") |
|
|
|
|
|
}else if(item.type == "jiqiren"){ |
|
|
|
|
|
window.open("jiqiren") |
|
|
|
|
|
}else if(item.type == "konghuqi"){ |
|
|
|
|
|
window.open("konghuqi") |
|
|
|
|
|
}else if(item.type == "waifu"){ |
|
|
|
|
|
window.open("waifudingguan") |
|
|
|
|
|
}else if(item.type == "neifu"){ |
|
|
|
|
|
window.open("neifudingguan") |
|
|
|
|
|
}else if(item.type == "gong"){ |
|
|
|
|
|
window.open("gongdingguan") |
|
|
|
|
|
}else if(item.type == "qiu"){ |
|
|
|
|
|
window.open("qiuguan") |
|
|
|
|
|
}else if (item.isDir) { |
|
|
//将allFiles后面的内容截取出来 |
|
|
this.selectedDataBank = item.key.substring(9, item.key.length - 1) |
|
|
this.getALLFileList(this.selectedDataBank) |
|
|
}else{ |
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000 |
|
|
this.snackBar.open('该文件类型暂不支持在线查看，请下载查看','确定',config) |
|
|
} |
|
|
} |
|
|
//返回上一级目录 |
|
|
backTominTop(){ |
|
|
let topnum = this.gettoplist(this.selectedDataBank) |
|
|
this.getALLFileList(topnum) |
|
|
} |
|
|
|
|
|
//上级目录产生函数 |
|
|
gettoplist(item){ |
|
|
let list = item |
|
|
let listArr = list.split("/") |
|
|
let listresult = "" |
|
|
for(let i = 0;i < listArr.length - 1;i++){ |
|
|
listresult += listArr[i] + "/" |
|
|
} |
|
|
let listresult2 = listresult.substring(0, listresult.length - 1) |
|
|
return listresult2 |
|
|
} |
|
|
|
|
|
|
|
|
//上传按钮鼠标移入 |
|
|
uploadBtnEnter(){ |
|
|
this.isOpenUpload = true |
|
|
} |
|
|
//上传按钮鼠标移出 |
|
|
uploadBtnLeave(){ |
|
|
this.isOpenUpload = false |
|
|
} |
|
|
//点击每条的checkbox |
|
|
clickCheckBox(e){ |
|
|
e.stopPropagation(); |
|
|
setTimeout(() => { |
|
|
if(this.selection.selected.length != 0){ |
|
|
this.isDelete = true |
|
|
} else{ |
|
|
this.isDelete = false |
|
|
} |
|
|
}, 0); |
|
|
} |
|
|
//点击每条的li |
|
|
clickCheckBoxLi(e,row){ |
|
|
this.selection.toggle(row) |
|
|
setTimeout(() => { |
|
|
if(this.selection.selected.length != 0){ |
|
|
this.isDelete = true |
|
|
} else{ |
|
|
this.isDelete = false |
|
|
} |
|
|
}, 0); |
|
|
} |
|
|
file:any //需要上传的文件 |
|
|
|
|
|
//input file 选择文件 |
|
|
selectFile (e) { |
|
|
this.file = e.target.files[0] || null //上传的文件 |
|
|
this.http.get(`/api/ObjectMetadata/drives/${this.selectedDataBank}/${this.file.name}`).subscribe( |
|
|
data=>{ |
|
|
var r = confirm(`已有同名文件，继续将替换该文件，是否替换？`); |
|
|
if (r == true) { |
|
|
this.startUploading() |
|
|
} |
|
|
}, |
|
|
err => { |
|
|
this.startUploading() |
|
|
}) |
|
|
} |
|
|
|
|
|
|
|
|
fileArr:any |
|
|
//上传文件夹 |
|
|
async selectFiles (e) { |
|
|
|
|
|
this.fileArr = e.target.files || null //上传的文件 |
|
|
this.uploadisLoading2 = true |
|
|
this.child.handleData() //子组件处理数据格式 |
|
|
|
|
|
let _this = this |
|
|
for (var i = 0;i < this.fileArr.length; i++) { |
|
|
let f = this.fileArr[i]; |
|
|
let lastIndex = f.webkitRelativePath.lastIndexOf("/") |
|
|
let url = f.webkitRelativePath.substring(0, lastIndex) |
|
|
let adddress = this.selectedDataBank + "/" + url |
|
|
let filesnum = _this.fileArr.length |
|
|
|
|
|
let result = await new Promise ((result,reject)=>{ |
|
|
this.startUploading2(f,adddress,result,reject,filesnum,this.selectedDataBank) |
|
|
}) |
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
//上传文件 |
|
|
objectName2:any //上传对象名 |
|
|
uploadisLoading2:boolean = false //上传进度条显示 |
|
|
uploadProgress2:any |
|
|
uploadId2:any; //上传分块上传事件编号 |
|
|
filesTag2:any = [] //每上传成功一个文件就往里面加一个标识 |
|
|
//e是上传的文件 selectedDataBank是需要上传的地址 包括 XXX资料库 + 文件夹路径 |
|
|
startUploading2 (e,selectedDataBank,result,reject,filesnum,selectedDataBank2) { |
|
|
let file = e || null //获取上传的文件 |
|
|
let fileSize = file.size || null //上传文件的总大小 |
|
|
let shardSize = 5 * 1024 * 1024 //5MB一个分片 |
|
|
this.uploadisLoading2 = true |
|
|
this.uploadProgress2 = 0 + "/" + filesnum |
|
|
this.child.uploading(file) //子组件 当前文件正在上传 |
|
|
|
|
|
if (file && fileSize<=shardSize) { //上传文件<=5MB时 |
|
|
|
|
|
let formData = new FormData() |
|
|
formData.append("file",file) |
|
|
this.http.post(`/api/Objects/drives/allFiles/${selectedDataBank2}`,formData).subscribe((data:any)=>{ |
|
|
this.objectName2 = data.objectName |
|
|
this.filesTag2.push("data") |
|
|
|
|
|
this.zone.run(() => { |
|
|
setTimeout(() => this.uploadProgress2 = this.filesTag2.length + "/" + filesnum, 0); |
|
|
}); |
|
|
|
|
|
result("成功了") |
|
|
this.child.endUpload(file) //子组件 当前文件上传成功 |
|
|
|
|
|
if(this.filesTag2.length == filesnum){ |
|
|
this.filesTag2 = [] //清空计数文件夹 |
|
|
this.uploadProgress2 = filesnum + "/" + filesnum |
|
|
this.uploadisLoading2 = false |
|
|
this.child.delete() //清空上传文件夹子组件数据 |
|
|
|
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000 |
|
|
this.snackBar.open('文件夹全部上传完毕','确定',config) |
|
|
// 当全部循环完毕重新加载列表 |
|
|
this.getALLFileList(selectedDataBank2) |
|
|
} |
|
|
}) |
|
|
} else if (file && fileSize>shardSize) { //上传文件>5MB时,分块上传 |
|
|
let data = {fileName: file.name} |
|
|
this.uploadisLoading2 = true |
|
|
|
|
|
this.http.post(`/api/NewMultipartUpload/drives/allFiles/${selectedDataBank}`,{},{params:data}).subscribe((data:any)=>{ //初始化分段上传 |
|
|
this.objectName2 = data.objectName |
|
|
this.uploadId2 = data.uploadId |
|
|
this.subsectionUploading2(e,result,reject,filesnum,selectedDataBank2) |
|
|
}) |
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
PartNumberETag2:any=[]; //每次返回需要保存的信息 |
|
|
//开始分段上传 |
|
|
async subsectionUploading2 (e,result,reject,filesnum,selectedDataBank2) { |
|
|
let file = e || null //获取上传的文件 |
|
|
let fileSize = file.size || null //上传文件的总大小 |
|
|
let shardSize = 5 * 1024 * 1024 //5MB一个分片 |
|
|
let allSlice = Math.ceil(fileSize / shardSize) //总文件/5MB===共分多少段 |
|
|
let _result = result |
|
|
for (let i = 0;i < allSlice;i++) { //循环分段上传 |
|
|
let start = i * shardSize //切割文件开始位置 |
|
|
let end = Math.min(fileSize, start + shardSize); //切割文件结束位置 |
|
|
let formData = new FormData() |
|
|
formData.append("file",file.slice(start, end)) |
|
|
|
|
|
//同步写法实现异步调用 |
|
|
let result = await new Promise((resolve, reject) => { |
|
|
// await 需要后面返回一个 promise 对象 |
|
|
this.http.post(`/api/MultipartUpload/drives/${this.objectName2}?uploadId=${this.uploadId2}&partNumber=${i+1}`,formData).subscribe((data:any)=>{ |
|
|
let msg = { |
|
|
"partNumber":data.partNumber || null, |
|
|
"eTag": data.eTag || null} |
|
|
resolve(msg) // 调用 promise 内置方法处理成功 |
|
|
}) |
|
|
}); |
|
|
this.PartNumberETag2.push(result) |
|
|
if (this.PartNumberETag2.length === allSlice) { |
|
|
this.endUploading2(e,_result,reject,filesnum,selectedDataBank2) |
|
|
} |
|
|
}//for循环 |
|
|
} |
|
|
|
|
|
//完成分块上传 |
|
|
endUploading2 (e,result,reject,filesnum,selectedDataBank2) { |
|
|
let data = this.PartNumberETag2 |
|
|
let paramsData = {uploadId:this.uploadId2} |
|
|
|
|
|
this.http.post(`/api/CompleteMultipartUpload/drives/${this.objectName2}`,data,{params:paramsData}).subscribe(data=>{ |
|
|
|
|
|
this.filesTag2.push("data") |
|
|
this.zone.run(() => { |
|
|
setTimeout(() => this.uploadProgress2 = this.filesTag2.length + "/" + filesnum, 0); |
|
|
}); |
|
|
|
|
|
result("成功了") |
|
|
this.child.endUpload(e) //子组件 当前文件上传成功 |
|
|
|
|
|
if(this.filesTag2.length == filesnum){ |
|
|
|
|
|
this.uploadProgress2 = filesnum + "/" + filesnum |
|
|
this.uploadisLoading2 = false |
|
|
|
|
|
this.filesTag2 = [] //清空计数文件夹 |
|
|
this.child.delete() //清空上传文件夹子组件数据 |
|
|
this.getALLFileList(selectedDataBank2) |
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000 |
|
|
this.snackBar.open('文件夹全部上传完毕','确定',config) |
|
|
|
|
|
} |
|
|
|
|
|
this.PartNumberETag2 =[] //清空保存返回的信息 |
|
|
}) |
|
|
} |
|
|
//取消分块上传 |
|
|
cancel2 () { |
|
|
this.http.delete(`/api/MultipartUpload/drives/${this.objectName2}?uploadId=${this.uploadId2}`).subscribe(data=>{ |
|
|
this.uploadisLoading2= false |
|
|
this.fileArr = {} |
|
|
this.PartNumberETag2 =[] //清空保存返回的信息 |
|
|
this.filesTag2 = [] //清空计数文件夹 |
|
|
this.child.delete() //清空上传文件夹子组件数据 |
|
|
this.getALLFileList(this.selectedDataBank) |
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000 |
|
|
this.snackBar.open('取消上传成功!','确定',config); |
|
|
}) |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//新建文件夹 |
|
|
createFolder(){ |
|
|
const dialogRef = this.dialog.open(FolderDialog); |
|
|
dialogRef.afterClosed().subscribe((data)=>{ |
|
|
if(data){ |
|
|
//创建空文件夹 |
|
|
this.http.post(`/api/Objects/drives/allFiles/${this.selectedDataBank}/${data.name}/`,{}).subscribe(data=>{ |
|
|
this.getALLFileList(this.selectedDataBank) |
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000 |
|
|
this.snackBar.open('新建文件夹成功','确定',config) |
|
|
}) |
|
|
} |
|
|
}); |
|
|
} |
|
|
|
|
|
//返回顶级目录 |
|
|
backToTop () { |
|
|
if (this.selectedDataBank.includes('/')) { |
|
|
let arr = this.selectedDataBank.split('/') |
|
|
this.selectedDataBank = arr[0] |
|
|
this.getALLFileList(arr[0]) |
|
|
} else { |
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000 |
|
|
this.snackBar.open('目前已是一级目录','确定',config) |
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
//上传文件 |
|
|
objectName:any //上传对象名 |
|
|
uploadisLoading:boolean = false //上传进度条显示 |
|
|
uploadProgress:any = 0 |
|
|
uploadId:any; //上传分块上传事件编号 |
|
|
startUploading () { |
|
|
let file = this.file || null //获取上传的文件 |
|
|
let fileSize = file.size || null //上传文件的总大小 |
|
|
let shardSize = 5 * 1024 * 1024 //5MB一个分片 |
|
|
|
|
|
if (file && fileSize<=shardSize) { //上传文件<=5MB时 |
|
|
let formData = new FormData() |
|
|
formData.append("file",file) |
|
|
this.http.post(`/api/Objects/drives/allFiles/${this.selectedDataBank}`,formData).subscribe((data:any)=>{ |
|
|
this.objectName = data.objectName |
|
|
this.getALLFileList(this.selectedDataBank) |
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000 |
|
|
this.snackBar.open('上传成功','确定',config) |
|
|
}) |
|
|
} else if (file && fileSize>shardSize) { //上传文件>5MB时,分块上传 |
|
|
let data = {fileName: file.name} |
|
|
this.uploadisLoading = true |
|
|
this.http.post(`/api/NewMultipartUpload/drives/allFiles/${this.selectedDataBank}`,{},{params:data}).subscribe((data:any)=>{ //初始化分段上传 |
|
|
|
|
|
this.objectName = data.objectName |
|
|
this.uploadId = data.uploadId |
|
|
console.log(1) |
|
|
this.subsectionUploading() |
|
|
}) |
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
PartNumberETag:any=[]; //每次返回需要保存的信息 |
|
|
//开始分段上传 |
|
|
async subsectionUploading () { |
|
|
let file = this.file || null //获取上传的文件 |
|
|
let fileSize = file.size || null //上传文件的总大小 |
|
|
let shardSize = 5 * 1024 * 1024 //5MB一个分片 |
|
|
let allSlice = Math.ceil(fileSize / shardSize) //总文件/5MB===共分多少段 |
|
|
|
|
|
for (let i = 0;i < allSlice;i++) { //循环分段上传 |
|
|
let start = i * shardSize //切割文件开始位置 |
|
|
let end = Math.min(fileSize, start + shardSize); //切割文件结束位置 |
|
|
let formData = new FormData() |
|
|
formData.append("file",file.slice(start, end)) |
|
|
|
|
|
//同步写法实现异步调用 |
|
|
let result = await new Promise((resolve, reject) => { |
|
|
// await 需要后面返回一个 promise 对象 |
|
|
this.http.post(`/api/MultipartUpload/drives/${this.objectName}?uploadId=${this.uploadId}&partNumber=${i+1}`,formData).subscribe((data:any)=>{ |
|
|
let msg = { |
|
|
"partNumber":data.partNumber || null, |
|
|
"eTag": data.eTag || null} |
|
|
resolve(msg) // 调用 promise 内置方法处理成功 |
|
|
console.log(2) |
|
|
}) |
|
|
}); |
|
|
this.PartNumberETag.push(result) |
|
|
this.uploadProgress = Number((i/allSlice).toFixed(2))*100 |
|
|
|
|
|
if (this.PartNumberETag.length === allSlice) { |
|
|
this.uploadProgress = 100 |
|
|
this.endUploading()} |
|
|
}//for循环 |
|
|
|
|
|
} |
|
|
|
|
|
//完成分块上传 |
|
|
endUploading () { |
|
|
let data = this.PartNumberETag; |
|
|
let paramsData = {uploadId:this.uploadId}; |
|
|
this.http.post(`/api/CompleteMultipartUpload/drives/${this.objectName}`,data,{params:paramsData}).subscribe(data=>{ |
|
|
console.log(3) |
|
|
this.getALLFileList(this.selectedDataBank); |
|
|
this.uploadProgress = 0; |
|
|
this.uploadisLoading = false; |
|
|
this.PartNumberETag =[]; //清空保存返回的信息 |
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000; |
|
|
this.snackBar.open('上传成功','确定',config); |
|
|
}) |
|
|
} |
|
|
|
|
|
//取消分块上传 |
|
|
cancel () { |
|
|
this.http.delete(`/api/MultipartUpload/drives/${this.objectName}?uploadId=${this.uploadId}`).subscribe(data=>{ |
|
|
this.uploadProgress = 0; |
|
|
this.uploadisLoading = false; |
|
|
this.PartNumberETag = []; //清空保存返回的信息 |
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000; |
|
|
this.snackBar.open('取消上传成功!','确定',config); |
|
|
}) |
|
|
} |
|
|
|
|
|
// 删除文件 |
|
|
deleteFiles(){ |
|
|
if (this.selection.selected.length != 0) { |
|
|
let isDelete = confirm('您确定要删除选中文件吗') |
|
|
let arr = [] |
|
|
if (isDelete) { |
|
|
this.selection.selected.forEach( async (element,index) => { |
|
|
|
|
|
let result = await new Promise((result,reject)=>{ |
|
|
if(element.isDir){ //如果是文件夹 |
|
|
// let lastIndex = element.key.lastIndexOf("/") |
|
|
// let prefix = element.key.substring(0,lastIndex) |
|
|
let paramsdata:any = { |
|
|
prefix : element.key, |
|
|
recursive : true |
|
|
} |
|
|
this.http.delete(`/api/Objects/drives`,{ |
|
|
params:paramsdata |
|
|
}).subscribe(data=>{ |
|
|
arr.push("删除成功了") |
|
|
if (arr.length == this.selection.selected.length) { |
|
|
this.getALLFileList(this.selectedDataBank) |
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000 |
|
|
this.snackBar.open('删除文件成功','确定',config); |
|
|
this.selection.clear() |
|
|
this.isDelete = false |
|
|
} |
|
|
result(data) |
|
|
|
|
|
}) |
|
|
}else{ |
|
|
this.http.delete(`/api/Objects/drives/${element.key}`).subscribe(data=>{ |
|
|
arr.push("删除成功了") |
|
|
if (arr.length == this.selection.selected.length) { |
|
|
this.getALLFileList(this.selectedDataBank) |
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000 |
|
|
this.snackBar.open('删除文件成功','确定',config); |
|
|
this.selection.clear() |
|
|
this.isDelete = false |
|
|
} |
|
|
result(data) |
|
|
}) |
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
}); |
|
|
} |
|
|
} else { |
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000 |
|
|
this.snackBar.open('请选择要删除的文件','确定',config); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// deleteFiles(){ |
|
|
// if (this.selection.selected.length == 1) { |
|
|
// let isDelete = confirm('您确定要删除吗') |
|
|
// let arr = [] |
|
|
// if (isDelete) { |
|
|
// let item = this.selection.selected[0] |
|
|
// if(item.isDir){//如果是文件夹 |
|
|
// let paramsdata:any = { |
|
|
// prefix : item.key, |
|
|
// recursive : true |
|
|
// } |
|
|
// this.http.delete(`/api/Objects/drives`,{ |
|
|
// params:paramsdata |
|
|
// }).subscribe(data=>{ |
|
|
// this.getALLFileList(this.selectedDataBank) |
|
|
// const config = new MatSnackBarConfig(); |
|
|
// config.verticalPosition = 'top'; |
|
|
// config.duration = 3000 |
|
|
// this.snackBar.open('删除文件夹成功','确定',config); |
|
|
// this.selection.clear() |
|
|
// this.isDelete = false |
|
|
// }) |
|
|
// } |
|
|
// else{ |
|
|
// this.http.delete(`/api/Objects/drives/${item.key}`).subscribe(data=>{ |
|
|
// this.getALLFileList(this.selectedDataBank) |
|
|
// const config = new MatSnackBarConfig(); |
|
|
// config.verticalPosition = 'top'; |
|
|
// config.duration = 3000 |
|
|
// this.snackBar.open('删除文件成功','确定',config); |
|
|
// this.selection.clear() |
|
|
// this.isDelete = false |
|
|
// }) |
|
|
// } |
|
|
|
|
|
|
|
|
|
|
|
// } |
|
|
// } |
|
|
// if (this.selection.selected.length == 0) { |
|
|
// const config = new MatSnackBarConfig(); |
|
|
// config.verticalPosition = 'top'; |
|
|
// config.duration = 3000 |
|
|
// this.snackBar.open('请选择要删除的文件','确定',config); |
|
|
// } |
|
|
// if (this.selection.selected.length > 1) { |
|
|
// const config = new MatSnackBarConfig(); |
|
|
// config.verticalPosition = 'top'; |
|
|
// config.duration = 3000 |
|
|
// this.snackBar.open('暂不支持批量删除','确定',config); |
|
|
// } |
|
|
// } |
|
|
|
|
|
|
|
|
//下载文件 |
|
|
//下载↓ |
|
|
selectDownloadFile:any; //选择下载的文件 |
|
|
download:any; //下载文件元数据 |
|
|
downloadisLoading:boolean = false; //进度条loading加载 |
|
|
downloadProgress:number = 0; //进度条进度 |
|
|
downLoadFile(){ |
|
|
if (this.selection.selected.length === 1) { |
|
|
this.selectDownloadFile = this.selection.selected[0] |
|
|
if(this.selectDownloadFile.isDir){ |
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000 |
|
|
this.snackBar.open('文件夹不支持下载','确定',config) |
|
|
}else{ |
|
|
this.http.get('/api/ObjectMetadata/drives/' + this.selectDownloadFile.key).subscribe(data=>{ |
|
|
console.log(123,data) |
|
|
this.download = data |
|
|
this.downloadFile.download(this.download) |
|
|
}) |
|
|
} |
|
|
|
|
|
} else if (this.selection.selected.length>1) { |
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000 |
|
|
this.snackBar.open('暂时不支持批量下载','确定',config) |
|
|
} else if (this.selection.selected.length == 0) { |
|
|
const config = new MatSnackBarConfig(); |
|
|
config.verticalPosition = 'top'; |
|
|
config.duration = 3000 |
|
|
this.snackBar.open('请选择要下载的文件','确定',config) |
|
|
} |
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
//查看图片大图和视频 |
|
|
@Component({ |
|
|
selector: 'viewdetails', |
|
|
templateUrl: './viewdetails.html', |
|
|
styleUrls: ['./all-file.component.scss'] |
|
|
}) |
|
|
export class ViewDetails { |
|
|
// myControl = new FormControl(); |
|
|
//注入MatDialogRef，可以用来关闭对话框 |
|
|
//要访问对话框组件中的数据，必须使用MAT_DIALOG_DATA注入令牌 |
|
|
constructor(private http: HttpClient,public dialogRef: MatDialogRef<ViewDetails>,@Inject(MAT_DIALOG_DATA) public data) {} |
|
|
Url:string |
|
|
onNoClick(): void { |
|
|
this.dialogRef.close(); |
|
|
} |
|
|
ngOnInit(): void { |
|
|
this.Url = "/api/Objects/drives/" + this.data.url |
|
|
} |
|
|
closeDialog(){ |
|
|
this.dialogRef.close(); |
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
@Component({ |
|
|
selector: 'folderdalog', |
|
|
templateUrl: './folderdalog.html', |
|
|
styleUrls: ['./all-file.component.scss'] |
|
|
}) |
|
|
export class FolderDialog { |
|
|
|
|
|
constructor(private http: HttpClient,public dialogRef: MatDialogRef<FolderDialog>,@Inject(MAT_DIALOG_DATA) public data) {} |
|
|
|
|
|
newFolderName:string |
|
|
|
|
|
onNoClick(): void { |
|
|
this.dialogRef.close(); |
|
|
} |
|
|
|
|
|
ngOnInit(): void { |
|
|
var myDate = new Date(); |
|
|
var year = myDate.getFullYear(); |
|
|
var month = myDate.getMonth(); |
|
|
var day = myDate.getDate(); |
|
|
var hour = myDate.getHours(); //获取当前小时数(0-23) |
|
|
var minutes = myDate.getMinutes(); //获取当前分钟数(0-59) |
|
|
var seconds = myDate.getSeconds(); //获取当前秒数(0-59) |
|
|
var data = year + '' + month + day + hour + minutes + seconds |
|
|
this.newFolderName = "新建文件夹_" + data; |
|
|
} |
|
|
|
|
|
onSubmit(value){ |
|
|
this.dialogRef.close(value); |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
} |
