[修改]修改侧边栏以及更正上传下载

src/app/is-login.service.ts

@@ -17,7 +17,7 @@ export class IsLoginService {
   //下载
   download (e) {
     this.isDownloading = true //开启下载进度条
-    let file = e
+    let file = e //传递过来的文件元数据
     let fileSize = file.fileLength //下载文件的总大小
     let shardSize = 10 * 1024 * 1024 //文件大小是否大于10MB
 
@@ -31,6 +31,7 @@ export class IsLoginService {
         link.href = url;
         link.setAttribute("download", e.fileName);
         document.body.appendChild(link);
+        
         link.click();
         this.isDownloading = false //关闭下载进度条
         this.downloadProgress = 0 //初始化进度条
@@ -43,7 +44,7 @@ export class IsLoginService {
 
   //分段下载并合并
   async blockingDownload (e) {
-    let file = e
+    let file = e //传递过来的文件元数据
     let fileSize = file.fileLength //下载文件的总大小
     let shardSize = 3 * 1024 * 1024 //3MB一个分片
     let allSlice = Math.ceil(fileSize / shardSize) //总文件/3MB===共分多少段
@@ -54,11 +55,11 @@ export class IsLoginService {
       let end = Math.min(fileSize, start + shardSize-1); //每次下载文件结束为止
 
       let result =  await new Promise ((result,reject)=>{
-      this.http.get(`/api/Objects/drives/${file.objectName}`,{headers:{'range':`bytes= ${start}-${end}`},responseType:'blob'}).subscribe(data=>{
-        result(data) }) 
+        this.http.get(`/api/Objects/drives/${file.objectName}`,{headers:{'range':`bytes= ${start}-${end}`},responseType:'blob'}).subscribe(data=>{
+          result(data) }) 
       })
       allFile.push(result)
-      this.downloadProgress = Number((i/allSlice).toFixed(2))*100
+      this.downloadProgress = Number((i/allSlice).toFixed(2))*100 //文件进度数
 
       if (allFile.length === allSlice) { //合并文件输出给浏览器
         let url = window.URL.createObjectURL(new Blob(allFile)); //createObjectURL创建一个下载Blob的url地址
@@ -67,12 +68,13 @@ export class IsLoginService {
         link.href = url;
         link.setAttribute("download", e.fileName);
         document.body.appendChild(link);
+
         link.click();
         this.isDownloading = false //关闭下载进度条
         this.downloadProgress = 0 //初始化进度条
       }
 
-    } //for循环
+    } //for循环结束
 
   }
 

src/app/navigation/navigation.component.html

@@ -11,7 +11,7 @@
             <div class="openSystem">
                 <a href="ax2://startup?" style="color: white">战术学习</a>
             </div>
-            <div class="addBankBtn" (click)="addDataBank()" *ngIf="islogin.isLogin">
+            <!-- <div class="addBankBtn" (click)="addDataBank()" *ngIf="islogin.isLogin">
                 <mat-icon>note_add</mat-icon> <span>新增资料库</span>
             </div>
             <ul>
@@ -28,7 +28,35 @@
                         <span><mat-icon class="deleteicon" (click)="deleteDataBank($event,item)" style="color: #e02626;">delete</mat-icon></span>
                     </h4>    
                 </li>
-            </ul>
+            </ul> -->
+            <mat-accordion multi="true">
+
+                <mat-expansion-panel>
+                    <mat-expansion-panel-header>
+                       支队级
+                    </mat-expansion-panel-header>
+                    <ul>
+                        <li *ngFor="let item of detachmentMenus" (click)="clickLi(item)" [ngClass]="{'selectedLi': item.id === selectedDataBank}" >{{item.name}}</li>
+                    </ul>
+                </mat-expansion-panel>
+              
+                <mat-expansion-panel>
+                    <mat-expansion-panel-header>
+                       大队级
+                    </mat-expansion-panel-header>
+                    <ul>
+                        <li  *ngFor="let item of brigadeMenus" (click)="clickLi(item)" [ngClass]="{'selectedLi': item.id === selectedDataBank}" >{{item.name}}</li>
+                    </ul>
+                </mat-expansion-panel>
+                <mat-expansion-panel>
+                    <mat-expansion-panel-header>
+                        消防救援站
+                    </mat-expansion-panel-header>
+                    <ul>
+                        <li *ngFor="let item of rescueStationMenus" (click)="clickLi(item)" [ngClass]="{'selectedLi': item.id === selectedDataBank}" >{{item.name}}</li>
+                    </ul>
+                </mat-expansion-panel>
+              </mat-accordion>
         </div>
     </mat-sidenav>
 

src/app/navigation/navigation.component.scss

@@ -28,7 +28,7 @@ mat-sidenav{
             cursor: pointer;
             color: white;
             width: 194px;
-            text-align: center;
+            // text-align: center;
             overflow: hidden;
             text-overflow:ellipsis;
             white-space: nowrap;
@@ -83,6 +83,7 @@ mat-sidenav{
    }
    .navbox{
         position: absolute;
+        overflow: hidden;
         left: 0px;
         top: 149px;
         right: -18px;
@@ -116,7 +117,8 @@ mat-sidenav{
             width: 194px;
             height: 46px;
             line-height: 46px;
-            text-align: center;
+            // text-align: center;
+            padding-left: 46px;
             background-color: #3c4252;
         }
         .selectedLi{
@@ -188,11 +190,20 @@ mat-sidenav{
        margin-right: 6px;
    }
     mat-expansion-panel{
-        background-color: #3c4252;
-        mat-panel-title{
+        background-color: #4699f6;
+        mat-expansion-panel-header{
+            padding-left: 46px;
             color: white;
-            
         }
+        ul{
+            li{
+                text-align: left;
+                padding-left: 46px;
+            }
+        }
+        // mat-panel-title{
+        //     color: white;
+        // }
     }
 
     .mat-expansion-indicator::after {

src/app/navigation/navigation.component.ts

@@ -21,13 +21,50 @@ export class NavigationComponent implements OnInit {
   selectedDataBank:any //当前选中的资料库
   hoverDataBank:any //当前鼠标移入的资料库
   isOneClick:boolean //是否第一次进入网页
+
+  //支队级菜单
+  detachmentMenus:any = [
+    { id:"支队级-主官", name:"主官" },
+    { id:"支队级-副官", name:"副官" },
+    { id:"支队级-灭火救援指挥岗位", name:"灭火救援指挥岗位" },
+    { id:"支队级-政工岗位", name:"政工岗位" },
+    { id:"支队级-后勤与保障岗位", name:"后勤与保障岗位" },
+    { id:"支队级-防火监督岗位", name:"防火监督岗位" },
+    { id:"支队级-指挥岗位", name:"指挥岗位" },
+    { id:"支队级-安全员", name:"安全员" },
+  ]
+  //大队级菜单
+  brigadeMenus:any = [
+    { id:"大队级-主官", name:"主官" },
+    { id:"大队级-副官", name:"副官" },
+    { id:"大队级-灭火救援指挥岗位", name:"灭火救援指挥岗位" },
+    { id:"大队级-政工岗位", name:"政工岗位" },
+    { id:"大队级-后勤与保障岗位", name:"后勤与保障岗位" },
+    { id:"大队级-防火监督岗位", name:"防火监督岗位" },
+    { id:"大队级-安全员", name:"安全员" },
+  ]
+  //消防救援站菜单
+  rescueStationMenus:any = [
+    { id:"消防救援站-消防站指挥员", name:"消防站指挥员" },
+    { id:"消防救援站-站长助理", name:"站长助理" },
+    { id:"消防救援站-战斗员", name:"战斗员" },
+    { id:"消防救援站-供水源", name:"供水源" },
+    { id:"消防救援站-训导员", name:"训导员" },
+    { id:"消防救援站-通信员", name:"通信员" },
+    { id:"消防救援站-无人机飞手", name:"无人机飞手" },
+    { id:"消防救援站-消防车驾驶员", name:"消防车驾驶员" },
+    { id:"消防救援站-装备技师", name:"装备技师" }
+  ]
+
+
+  
   ngOnInit() {
-    this.http.get('/api/DataBanks').subscribe((data:any) => {
-      if(data && data.length != 0){
-        this.selectedDataBank = data[0].id
-      }
-    })
-    this.getAllDataBank()
+    // this.http.get('/api/DataBanks').subscribe((data:any) => {
+    //   if(data && data.length != 0){
+    //     this.selectedDataBank = data[0].id
+    //   }
+    // })
+    // this.getAllDataBank()
   }
 
 
@@ -45,58 +82,62 @@ export class NavigationComponent implements OnInit {
 
 
   //新增资料库
-  addDataBank(){
-    const dialogRef = this.dialog.open(AddDataBank, {//调用open方法打开对话框并且携带参数过去
-      width: '260px',
-      data: {}
-    });
-    dialogRef.afterClosed().subscribe(
-      (data:any)=>{
-        if(data){
-          let headers = new HttpHeaders({
-            'Content-Type': 'text/json'
-          });
-          let options = {
-            headers
-          };
-          let body = JSON.stringify(data.name);
-          this.http.post('/api/DataBanks',body,options).subscribe(data => {
-            this.getAllDataBank()
-            const config = new MatSnackBarConfig();
-            config.verticalPosition = 'top';
-            config.duration = 3000
-            this.snackBar.open('创建资料库成功','确定',config);
-          },
-          err => {
-            const config = new MatSnackBarConfig();
-            config.verticalPosition = 'top';
-            config.duration = 3000
-            this.snackBar.open(err,'确定',config);
-          })
-        }  
-      }
-    );
-  }
+  // addDataBank(){
+  //   const dialogRef = this.dialog.open(AddDataBank, {//调用open方法打开对话框并且携带参数过去
+  //     width: '260px',
+  //     data: {}
+  //   });
+  //   dialogRef.afterClosed().subscribe(
+  //     (data:any)=>{
+  //       if(data){
+  //         let headers = new HttpHeaders({
+  //           'Content-Type': 'text/json'
+  //         });
+  //         let options = {
+  //           headers
+  //         };
+  //         let body = JSON.stringify(data.name);
+  //         this.http.post('/api/DataBanks',body,options).subscribe(data => {
+  //           this.getAllDataBank()
+  //           const config = new MatSnackBarConfig();
+  //           config.verticalPosition = 'top';
+  //           config.duration = 3000
+  //           this.snackBar.open('创建资料库成功','确定',config);
+  //         },
+  //         err => {
+  //           const config = new MatSnackBarConfig();
+  //           config.verticalPosition = 'top';
+  //           config.duration = 3000
+  //           this.snackBar.open(err,'确定',config);
+  //         })
+  //       }  
+  //     }
+  //   );
+  // }
 
 
   //获得所有资料库
-  getAllDataBank(){
-    this.http.get('/api/DataBanks').subscribe(data => {
-      this.allDataBank = data
-      // console.log(123,data)
-    }
-    ,
-    err=>{
-      // console.log(456,err)
-    })
-  }
+  // getAllDataBank(){
+  //   this.http.get('/api/DataBanks').subscribe(data => {
+  //     this.allDataBank = data
+  //     // console.log(123,data)
+  //   }
+  //   ,
+  //   err=>{
+  //     // console.log(456,err)
+  //   })
+  // }
+
+
   //点击资料库
   clickLi(item){
     this.selectedDataBank = item.id
     //触发子组件的方法
-    this.child.getALLFileList(item.name);
+    this.child.getALLFileList(item.id);
     this.child.selection.clear();
   }
+
+
   //鼠标移入资料库
   liEnter(item){
     this.hoverDataBank = item.id
@@ -124,7 +165,7 @@ export class NavigationComponent implements OnInit {
             };
             let body = JSON.stringify(data.name);
             this.http.put(`/api/DataBanks/${item.id}`,body,options).subscribe(data => {
-              this.getAllDataBank()
+              // this.getAllDataBank()
               const config = new MatSnackBarConfig();
               config.verticalPosition = 'top';
               config.duration = 3000
@@ -141,7 +182,7 @@ export class NavigationComponent implements OnInit {
     var r = confirm(`您确定要删除 ${item.name} 资料库吗？`);
     if (r == true) {
       this.http.delete(`/api/DataBanks/${item.id}`).subscribe(data => {
-        this.getAllDataBank()
+        // this.getAllDataBank()
         let config = new MatSnackBarConfig();
         config.verticalPosition = 'top';
         config.duration = 3000

src/app/ui/all-file/all-file.component.html

@@ -2,7 +2,7 @@
 <div class="topbox">
     <div class="leftbox">
         <div class="upload" (mouseenter)="uploadBtnEnter()" (mouseleave)="uploadBtnLeave()">
-            <div class="btn" style="width: 88px;height: 33px;" *ngIf="downloadFile.isLogin">
+            <div class="btn" style="width: 88px;height: 33px;">
                 <mat-icon>backup</mat-icon><span> 上传</span>
                 <input type="file" (change)='selectFile($event)'>
             </div>
@@ -17,13 +17,15 @@
                 </div>
             </div>
         </div>
-        <div class="newFile" (click)="createFolder()" *ngIf="downloadFile.isLogin"> 
+        <div class="newFile" (click)="createFolder()"> 
             <mat-icon>create_new_folder</mat-icon> <span>新建文件夹</span>
         </div>
+
         <div class="newFile" style="width: 88px;" (click)='downLoadFile()'> 
             <mat-icon>save_alt</mat-icon> <span>下载</span>
         </div>
-        <div class="newFile" style="width: 88px;" *ngIf="isDelete && downloadFile.isLogin" (click)="deleteFiles()"> 
+
+        <div class="newFile" style="width: 88px;" *ngIf="isDelete" (click)="deleteFiles()"> 
             <mat-icon>delete</mat-icon> <span>删除</span>
         </div>
 
@@ -46,13 +48,13 @@
             <mat-progress-bar mode="determinate" [value]="downloadFile.downloadProgress" class="progress" style="left: 52px;top: 13px;"></mat-progress-bar>
         </div>
     </div>
-    <!-- <div class="rightbox">
+    <div class="rightbox">
         <div class="inputbox">
             <input type="text" [(ngModel)]="searchData" (focus)="searchfocus($event)" (blur)="searchblur($event)">
             <span class="cancel" *ngIf="isCancel" (click)="cancelbtn()"><mat-icon style="font-size: 16px;">cancel</mat-icon></span>
             <span class="search" (click)="search()"><mat-icon>search</mat-icon></span>
         </div>
-    </div> -->
+    </div>
 </div>
 <div class="titlebox">
     <div class="titleleft">
@@ -109,7 +111,7 @@
 
 
               <img *ngIf="element.type == 'gaopenche' || element.type == 'denggao'" src="../../../assets/images/gaopenche.gif" alt="">
-              <img *ngIf="element.type == 'miehuo' || element.type == 'kongqi'" src="../../../assets/images/shebei.jpg" alt="">
+              <img *ngIf="element.type == 'jiqiren' || element.type == 'konghuqi'" src="../../../assets/images/shebei.jpg" alt="">
               <img *ngIf="element.type == 'waifu' || element.type == 'neifu' || element.type == 'gong' || element.type == 'qiu'" src="../../../assets/images/sheshi.jpg" alt="">
 
               <span *ngIf="element.isDir == false" class="filename" (click)="clickName($event,element)">
@@ -118,7 +120,7 @@
               <span *ngIf="element.isDir == true" class="filename" (click)="clickName($event,element)">
                 {{element.key | name2}} 
               </span>
-              <span class="font3d" *ngIf="element.type == 'waifu' || element.type == 'neifu' || element.type == 'gong' || element.type == 'qiu' || element.type == 'gaopenche' || element.type == 'denggao'">
+              <span class="font3d" *ngIf="element.type == 'waifu' || element.type == 'neifu' || element.type == 'gong' || element.type == 'qiu' || element.type == 'gaopenche' || element.type == 'denggao' || element.type == 'jiqiren' || element.type == 'konghuqi'">
                  &nbsp; 3D &nbsp;
               </span>
         </td>

src/app/ui/all-file/all-file.component.ts

@@ -82,16 +82,14 @@ export class AllFileComponent {
     
     this.selectedDataBank = name
     let paramsdata = {
-      prefix : this.selectedDataBank + "/",
+      prefix : "allFiles/" + this.selectedDataBank + "/",
       delimiter : "/"
     }
     this.http.get(`/api/Objects/drives`,{
       params:paramsdata
-
     }).subscribe((data:any) => {
-      // console.log(data)
+      console.log(456,data)
       this.selection.clear()
-      
       data.contents.forEach((item)=>{
         let typeArr = item.key.split('.')
         item.type =  typeArr[typeArr.length - 1]
@@ -112,21 +110,21 @@ export class AllFileComponent {
             isDir: false,
             type: "denggao"
           }
-          // ,
-          // { key: "装备车辆/灭火侦查机器人",
-          //   lastModified: null,
-          //   eTag: null,
-          //   size: 0,
-          //   isDir: false,
-          //   type: "miehuo"
-          // },
-          // { key: "装备车辆/空气呼吸器",
-          //   lastModified: null,
-          //   eTag: null,
-          //   size: 0,
-          //   isDir: false,
-          //   type: "kongqi"
-          // }
+          ,
+          { 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 == "设备设施"){
@@ -211,13 +209,15 @@ export class AllFileComponent {
   }
   //点击搜索
   search(){
+    console.log(13,this.searchData)
     if(this.searchData != "搜索您的文件"){
       this.http.get("/api/Objects/drives",{
         params:{
-          prefix : this.searchData
+          prefix : this.searchData,
+          delimiter : "/"
         }
       }).subscribe(data=>{
-        // console.log(data)
+        console.log(data)
       },
       err=>{
         
@@ -238,7 +238,7 @@ export class AllFileComponent {
       });
 
     }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',
@@ -258,7 +258,7 @@ export class AllFileComponent {
        
       );
     }else if(item.type == "pdf"){ 
-
+      // console.log(item)
       window.open("/api/Objects/drives/" + item.key)
       
     }else if(item.type == "gaopenche"){ 
@@ -269,6 +269,14 @@ export class AllFileComponent {
 
       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")
@@ -286,9 +294,8 @@ export class AllFileComponent {
       window.open("qiuguan")
       
     }else if (item.isDir) {
-
-      this.selectedDataBank = item.key.substring(0, item.key.length - 1)
-      // console.log(this.selectedDataBank)
+      //将allFiles后面的内容截取出来
+      this.selectedDataBank = item.key.substring(9, item.key.length - 1)
       this.getALLFileList(this.selectedDataBank)
     }else{
       const config = new MatSnackBarConfig();
@@ -408,7 +415,7 @@ export class AllFileComponent {
 
       let formData = new FormData()
       formData.append("file",file)
-      this.http.post(`/api/Objects/drives/${selectedDataBank2}`,formData).subscribe((data:any)=>{
+      this.http.post(`/api/Objects/drives/allFiles/${selectedDataBank2}`,formData).subscribe((data:any)=>{
         this.objectName2 = data.objectName
         this.filesTag2.push("data")
 
@@ -434,10 +441,10 @@ export class AllFileComponent {
         }
       })
     } else if (file && fileSize>shardSize) { //上传文件>5MB时,分块上传
-      let data = {filename: file.name}
+      let data = {fileName: file.name}
       this.uploadisLoading2 = true
 
-      this.http.post(`/api/NewMultipartUpload/drives/${selectedDataBank}`,{},{params:data}).subscribe((data:any)=>{ //初始化分段上传
+      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)
@@ -548,7 +555,7 @@ export class AllFileComponent {
     dialogRef.afterClosed().subscribe((data)=>{
       if(data){
         //创建空文件夹
-        this.http.post(`/api/Objects/drives/${this.selectedDataBank}/${data.name}/`,{}).subscribe(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';
@@ -589,7 +596,7 @@ export class AllFileComponent {
     if (file && fileSize<=shardSize) { //上传文件<=5MB时
       let formData = new FormData()
       formData.append("file",file)
-      this.http.post(`/api/Objects/drives/${this.selectedDataBank}`,formData).subscribe((data:any)=>{
+      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();
@@ -598,11 +605,13 @@ export class AllFileComponent {
         this.snackBar.open('上传成功','确定',config)
       })
     } else if (file && fileSize>shardSize) { //上传文件>5MB时,分块上传
-      let data = {filename: file.name}
+      let data = {fileName: file.name}
       this.uploadisLoading = true
-      this.http.post(`/api/NewMultipartUpload/drives/${this.selectedDataBank}`,{},{params:data}).subscribe((data:any)=>{ //初始化分段上传
+      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()
       })
     }
@@ -631,6 +640,7 @@ export class AllFileComponent {
                 "partNumber":data.partNumber || null,
                 "eTag": data.eTag || null}
               resolve(msg) // 调用 promise 内置方法处理成功
+              console.log(2)
           })
         });
         this.PartNumberETag.push(result)
@@ -648,6 +658,7 @@ export class AllFileComponent {
     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;
@@ -688,7 +699,7 @@ export class AllFileComponent {
                 prefix : element.key,
                 recursive : true
               }
-              this.http.delete(`/api/Objects/drives`,{
+              this.http.delete(`/api/Objects/drives/allFiles`,{
                 params:paramsdata
               }).subscribe(data=>{
                 arr.push("删除成功了")
@@ -705,7 +716,7 @@ export class AllFileComponent {
                 
               })
             }else{
-              this.http.delete(`/api/Objects/drives/${element.key}`).subscribe(data=>{
+              this.http.delete(`/api/Objects/drives/allFiles/${element.key}`).subscribe(data=>{
                 arr.push("删除成功了")
                 if (arr.length == this.selection.selected.length) {
                   this.getALLFileList(this.selectedDataBank)
@@ -805,8 +816,8 @@ export class AllFileComponent {
         config.duration = 3000
         this.snackBar.open('文件夹不支持下载','确定',config)
       }else{
-        this.http.get('/api/ObjectMetadata/drives/' + this.selectDownloadFile.key).subscribe(data=>{
-          // console.log(data)
+        this.http.get('/api/ObjectMetadata/drives/allFiles/' + this.selectDownloadFile.key).subscribe(data=>{
+          console.log(123,data)
           this.download = data
           this.downloadFile.download(this.download)
         })