<template>
   <div class="flexOne">
     <div class="myDocumentsNav">
       <el-button-group v-if='!isChildFiles'>
         <el-button v-if='notFileList.length==1&&fileList.length<1' type="danger" icon="el-icon-download"
           @click='dowloadSingle()'>下载</el-button>
         <el-button v-if='fileList.length>0||notFileList.length>0' type="danger" icon="el-icon-download"
           @click='yzmVisible=true,createCode()'>压缩下载</el-button>
         <el-button v-if='fileList.length>0||notFileList.length>0' type="danger" @click='moveFiles'>移动到</el-button>
       </el-button-group>
       <el-button-group v-if='isChildFiles'>
         <el-button v-if='notFileListInside.length==1&&fileListInside.length<1' type="danger" icon="el-icon-download"
           @click='dowloadSingleInside()'>下载里</el-button>
         <el-button v-if='fileListInside.length>0||notFileListInside.length>0' type="danger" icon="el-icon-download"
           @click='yzmVisible=true,createCode()'>压缩下载</el-button>
         <el-button v-if='fileListInside.length>0||notFileListInside.length>0' type="danger" @click='moveFiles'>移动到里
         </el-button>
       </el-button-group>
       <div class="fr" v-if='!isChildFiles'>
         <el-input class='w200' :placeholder="$t('pub.pleaseImport')" v-model="msg.ShareName"
           prefix-icon="el-icon-search"></el-input>
         <input type="button" class="hollowFixedBtn" @click='getList()' :value="$t('pub.searchBtn')" />
       </div>
     </div>
     <div class="myDocumentsLink">
       <span @click="resGetList">分享给我的</span>
       <span v-for="(item,index) in NavList" @click="getNavTree(item,index)">{{item.name}}</span>
     </div>


     <table class="singeRowTable myDocumentsTable" border="0" cellspacing="0" cellpadding="0">
       <tbody v-if='!isChildFiles'>
         <tr>
           <th width="400"><input v-model="isCkedAll" type="checkbox" @click='checkedAll()' />文件名</th>
           <th width="200">&nbsp;</th>
           <th>大小</th>
           <th width="200">分享人</th>
           <th width="200">接收时间</th>
         </tr>
         <tr v-for="(item,index) in list" @mouseover="enterTr(index)" @mouseleave="leaveTr">
           <td v-if="item.shareFileType==1">
             <input type="checkbox" :value="item.shareId" v-model="fileList" @change="ckeckedOne">
             <div @click="getNextLevel(item)" style="cursor: pointer; display: inline-block;">
               <div :class="['fileIcon', item.icons]"></div>
               {{item.fileName}}
             </div>
           </td>
           <td v-if="item.shareFileType==2">
             <input type="checkbox" :value="item.shareId" v-model="notFileList" @change="ckeckedOne">
             <div @click="analyzeItem(item)" style="cursor: pointer; display: inline-block;">
               <div :class="['fileIcon', item.icons]"></div>
               {{item.fileName}}
             </div>
           </td>
           <td>
             <el-row v-if='curIndex==index'>
               <el-button type="primary" icon="el-icon-download" circle @click='downloadOne(item)'></el-button>
               <el-button type="primary" icon="iconfont icon-move" style='font-size: 14px;' circle
                 @click='moveOneFile(item)'></el-button>
             </el-row>
           </td>
           <td>{{item.fileSize| FileSizeFormat(item.fileSize)}}</td>
           <td>
             <img style="vertical-align: sub; width: 14px; height: 14px; border-radius: 7px;"
               v-if="!item.shareUserPhoto" src="../../assets/img/litheader.png" alt="">
             <img style="vertical-align: sub; width: 14px; height: 14px; border-radius: 7px;" v-else
               :src="item.shareUserPhoto" alt="" :onerror="defaultImg">
             {{item.shareUserName}}
           </td>
           <td>{{item.createTime}}</td>
         </tr>
       </tbody>

       <tbody v-if='isChildFiles'>
         <tr>
           <th width="400"><input v-model="isCkedAllInside" type="checkbox" @click='checkedAllInside()' />文件名</th>
           <th width="400">&nbsp;</th>
           <th width="400">大小</th>
         </tr>
         <tr v-for="(item,index) in nextList" @mouseover="enterTrInside(index)" @mouseleave="leaveTrInside">
           <td v-if="item.DataType==0">
             <input type="checkbox" :value="item.Id" v-model="fileListInside" @change="ckeckedOneInside">
             <div @click="getNextLevelTree(item)" style="cursor: pointer; display: inline-block;">
               <div :class="['fileIcon', item.icons]"></div>
               {{item.FolderName}}
             </div>
           </td>
           <td v-if="item.DataType==2">
             <input type="checkbox" :value="item.Id" v-model="notFileListInside" @change="ckeckedOneInside">
             <div @click="analyzeItemInside(item)" style="cursor: pointer; display: inline-block;">
               <div :class="['fileIcon', item.icons]"></div>
               {{item.FolderName}}
             </div>
           </td>
           <td>
             <el-row v-if='insideCurIndex==index'>
               <el-button type="primary" icon="el-icon-download" circle @click='downloadOneInside(item)'></el-button>
               <el-button type="primary" icon="iconfont icon-move" style='font-size: 14px;' circle
                 @click='moveOneFileInside(item)'></el-button>
             </el-row>
           </td>
           <td>{{item.FileSize| FileSizeFormat(item.FileSize)}}</td>
         </tr>
       </tbody>
     </table>

     <el-dialog custom-class='w400' :title="dialogTitle2" :visible.sync="outerVisible2" @close="moveCancel" center>
       <el-tree :data="fileTreeList" :props="defaultProps" :check-strictly='true' @check-change="handleNodeChange"
         node-key="Id" show-checkbox accordion ref="tree">
       </el-tree>
       <div slot="footer" class="dialog-footer">
         <input type="button" class="hollowFixedBtn" :value="$t('pub.cancelBtn')" @click="moveCancel" />
         <input type="button" v-if='!isChildFiles' class="normalBtn" :value="$t('pub.sureBtn')"
           @click="saveMoveFiles" />
         <input type="button" v-if='isChildFiles' class="normalBtn" :value="$t('pub.sureBtn')"
           @click="saveMoveFilesInside" />
       </div>
     </el-dialog>
     <el-dialog custom-class='w800' :title="dialogTitle4" :visible.sync="outerVisible4" center>
       <video :src="moviePath" controls="controls" style="width: 100%;">
         your browser does not support the video tag
       </video>
       <div slot="footer" class="dialog-footer">
         <input type="button" class="normalBtn" :value="$t('pub.closeSel')" @click="outerVisible4=false" />
       </div>
     </el-dialog>
     <div v-if='audioIsShow'
       style="position: fixed; bottom: 100px; right: 20px; z-index: 999; border:1px solid #ccc; padding: 10px; background: #eee;">
       <i class="el-icon-circle-close-outline" style="float: right; cursor: pointer;"
         @click="audioIsShow=false,audioPath=''"></i>
       <p style="font-size: 12px; margin: 0 0 10px 0;">{{audioName}}</p>
       <audio :src="audioPath" controls="controls">
         Your browser does not support the audio tag.
       </audio>
     </div>

     <div v-if='picIsShow' class="viewBigPicLayer">
       <i class="el-icon-circle-close-outline clolseViewBigPicLayer" @click="picIsShow=false,picObj=[]"></i>
       <el-carousel height="600px" :initial-index='initialIndex' :interval="5000" trigger="click">
         <el-carousel-item v-for="(item,index) in picObj" :key="index">
           <div class="inlineDiv ownScrollbarStyle"><img :src="item" /></div>
         </el-carousel-item>
       </el-carousel>
     </div>

     <el-dialog custom-class='w400' title="压缩下载" :visible.sync="yzmVisible" center>
       <p>
         <span>验证码 : </span>
         <el-input class='w150' type="text" placeholder="请输入验证码" v-model="picLyanzhengma"></el-input>
         <input type="button" @click="createCode" class="DocumentLoadVerification" v-model="checkCode" />
       </p>
       <div slot="footer" class="dialog-footer">
         <input type="button" class="hollowFixedBtn" :value="$t('pub.cancelBtn')" @click="yzmVisible=false" />
         <input v-if='!isChildFiles' type="button" class="normalBtn" :value="$t('pub.sureBtn')"
           @click="downloadTotal()" />
         <input v-if='isChildFiles' type="button" class="normalBtn" :value="$t('pub.sureBtn')"
           @click="downloadTotalInside()" />
       </div>
     </el-dialog>
    <a target="_blank" style="display:none" id="blankLink"></a>
   </div>
 </template>

 <script>
   //	let browserMD5File = require('browser-md5-file');
   export default {
     data() {
       return {
         code: '',
         picLyanzhengma: '',
         checkCode: '',
         yzmVisible: false,

         initialIndex: 0,
         picObj: [],
         picIsShow: false,
         audioIsShow: false,
         outerVisible4: false,
         dialogTitle4: '',
         moviePath: '',
         audioPath: '',
         picPath: '',
         audioName: '',
         headers: {
           'Content-Type': 'application/octet-stream'
         },
         defaultProps: {
           children: 'ChildFolderList',
           label: 'FolderName',
         },
         defaultProps1: {
           children: 'ChildList',
           label: 'DepartmentName',
           disabled: "Disabled"
         },
         defaultProps2: {
           children: 'ChildList',
           label: 'DepartmentName',
           disabled: "Disabled"
         },
         defaultProps3: {
           children: 'ChildList',
           label: 'DepartmentName',
           disabled: "Disabled"
         },
         outerVisible: false,
         dialogTitle: '',
         outerVisible1: false,
         dialogTitle1: '',
         outerVisible2: false,
         dialogTitle2: '',
         outerVisible3: false,
         dialogTitle3: '',
         isCkedAll: false,
         isCkedAllInside: false,
         //请求数据
         fileList: [], //文件夹
         notFileList: [], //文件
         fileListInside: [], //文件夹
         notFileListInside: [], //文件				
         saveMsg: [],
         msg: {
           pageIndex: '1',
           pageSize: '9999',
           ShareName: ''
         },
         nextMsg: {
           ParentId: '0',
           FolderName: '',
           EmployeeId: '0'
         },
         addFileMsg: {
           FolderName: '',
           ParentId: '0',
           FolderId: '',
         },
         updateFileMsg: {
           FileId: '0',
           FileName: '0'
         },
         MoveMsg: {
           foldId: '0',
           folderIds: [],
           fileIds: []
         },
         shareMsg: {
           shareType: '1',
           fileIds: [],
           targetIds: '',
           folderIds: []
         },
         downloadMsg: {
           FolderIdStr: [],
           FileIdStr: []
         },
         downloadMsgInside: {
           FolderIdStr: [],
           FileIdStr: []
         },
         defaultImg: 'this.src="' + require('../../assets/img/litheader.png') + '"',
         //返回数据
         NavList: [],
         nextList: [],
         isChildFiles: false,
         curIndex: -1,
         insideCurIndex: -1,
         list: [],
         fileTreeList: [],
         NavigationList: [],
         WjId: [],
         WjjId: [],
         WjIdInside: [],
         WjjIdInside: [],
         arr: [],
         departmentList: [],
         ckdDepartmentList: [],
         ckdDepartmentListId: [],
         roleList: [],
         ckdRoleList: [],
         ckdRoleListId: [],
         menberList: [],
         ckdMenberList: [],
         ckdMenberListId: [],
         allLength: 0,
         allLengthInside: 0,
         rules: { //表单验证
           FolderName: [{
             required: true,
             message: '请输入文件夹名称',
             trigger: 'blur'
           }]
         },
         rules1: { //表单验证
           FileName: [{
             required: true,
             message: '请输入文件名称',
             trigger: 'blur'
           }]
         },
         srearchKey: ""
       }

     },
     filters: {
       FileSizeFormat(value) {
         if (value == null || value == 0) {
           return '-'
         }
         if (value != null) {
           if (value / 1024 < 1) { //kb
             return value + 'KB'
           }
           if (value / 1024 > 1 && value / (1024 * 1024) < 1) { //mb
             return (value / 1024).toFixed(2) + 'M'
           }
           if (value / (1024 * 1024) > 1) { //G
             return (value / (1024 * 1024)).toFixed(2) + 'G'
           }
         }

       }
     },
     methods: {
       // 图片验证码
       createCode() {
         //先清空验证码的输入
         this.code = "";
         this.checkCode = "";
         this.picLyanzhengma = "";
         //验证码的长度  
         var codeLength = 4;
         //随机数 
         var random = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K',
           'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z');
         for (var i = 0; i < codeLength; i++) {
           //取得随机数的索引(0~35)
           var index = Math.floor(Math.random() * 36);
           //根据索引取得随机数加到code上
           this.code += random[index];
         }
         //把code值赋给验证码  
         this.checkCode = this.code;
       },
       analyzeItem(obj) {
         let typeArr = [{
             stringArr: 'GIF|JPG|JPEG|PNG|BMP',
             type: 1
           },
           {
             stringArr: 'MP3|OGG|AU|AIFF|VQF',
             type: 2
           },
           {
             stringArr: 'AVI|WMV|MPEG|MP4|MOV|MKV|FLV|F4V|M4V|RMVB|RM|3GP|DAT|TS|MTS|VOB',
             type: 3
           },
           {
             stringArr: 'DOCX|DOC|XLSX|XLS|PPT|PPTX',
             type: 4
           },
           {
             stringArr: 'PDF',
             type: 5
           },
         ]
         let fileTypeNumber; // 判断文件预览类型;  1 图片,2音频,3视频,4,office,, 5 PDF , 6 txt     default其他  
         let fileType = obj.fileUrl.substring(obj.fileUrl.lastIndexOf('.') + 1, obj.fileUrl.length).toUpperCase()
         typeArr.forEach(x => {
           if (x.stringArr.indexOf(fileType) != '-1') {
             fileTypeNumber = x.type
           }
         })
         switch (fileTypeNumber) {
           case 1:
             this.list.forEach(item => {
               if (item.shareFileType == 2) {
                 if (item.fileName && item.fileName != "") {
                   let sfileType = item.fileName.substring(item.fileName.lastIndexOf('.') + 1, item.fileName.length)
                     .toUpperCase()
                   if ('GIF|JPG|JPEG|PNG|BMP'.indexOf(sfileType) != -1) {
                     this.picObj.push(item.fileUrl)
                   }
                 }
               }
             })
             this.picObj.forEach((x, i) => {
               if (x == obj.fileUrl) {
                 this.initialIndex = i
                 return false
               }

             })
             this.picIsShow = true
             //this.picPath=obj.FilePath					
             break;
           case 2:
             this.audioIsShow = true
             this.audioName = obj.fileName
             this.audioPath = obj.fileUrl
             break;
           case 3:
             this.outerVisible4 = true
             this.dialogTitle4 = obj.fileName
             this.moviePath = obj.fileUrl
             break;
           case 4:
             window.open("https://view.officeapps.live.com/op/view.aspx?src=" + obj.fileUrl)
             break;
           case 5:
             this.previewPDF(obj.fileUrl)
           default:
             this.$message.warning('该文件格式暂不支持预览,请下载用相关软件预览!')
             break;
         }

       },
       analyzeItemInside(obj) {
         let typeArr = [{
             stringArr: 'GIF|JPG|JPEG|PNG|BMP',
             type: 1
           },
           {
             stringArr: 'MP3|OGG|AU|AIFF|VQF',
             type: 2
           },
           {
             stringArr: 'AVI|WMV|MPEG|MP4|MOV|MKV|FLV|F4V|M4V|RMVB|RM|3GP|DAT|TS|MTS|VOB',
             type: 3
           },
           {
             stringArr: 'DOCX|DOC|XLSX|XLS|PPT|PPTX',
             type: 4
           },
           {
             stringArr: 'PDF',
             type: 5
           },
         ]
         let fileTypeNumber; // 判断文件预览类型;  1 图片,2音频,3视频,4,office,, 5 PDF , 6 txt     default其他  
         let fileType = obj.FilePath.substring(obj.FilePath.lastIndexOf('.') + 1, obj.FilePath.length).toUpperCase()
         typeArr.forEach(x => {
           if (x.stringArr.indexOf(fileType) != '-1') {
             fileTypeNumber = x.type
           }
         })

         switch (fileTypeNumber) {
           case 1:
             this.nextList.forEach(item => {
               if (item.DataType == 2) {
                 let fileType = item.FolderName.substring(item.FolderName.lastIndexOf('.') + 1, item.FolderName
                   .length).toUpperCase()
                 if ('GIF|JPG|JPEG|PNG|BMP'.indexOf(fileType) != -1) {
                   this.picObj.push(item.FilePath)
                 }
               }
             })

             this.picObj.forEach((x, i) => {
               if (x == obj.FilePath) {
                 this.initialIndex = i
                 return false
               }

             })
             this.picIsShow = true
             //this.picPath=obj.FilePath					
             break;
           case 2:
             this.audioIsShow = true
             this.audioName = obj.FolderName
             this.audioPath = obj.FilePath
             break;
           case 3:
             this.outerVisible4 = true
             this.dialogTitle4 = obj.FolderName
             this.moviePath = obj.FilePath
             break;
           case 4:
             window.open("https://view.officeapps.live.com/op/view.aspx?src=" + obj.FilePath)
             break;
           case 5:
             this.previewPDF(obj.FilePath)
             break
           default:
             this.$message.warning('该文件格式暂不支持预览,请下载用相关软件预览!')
             break;
         }

       },
       resGetList() {
         this.msg.ShareName = ''
         this.isChildFiles = false;
         this.isCkedAllInside = false
         this.NavList = []
         this.fileListInside = [], //文件夹
           this.notFileListInside = [], //文件					
           this.getList()
       },
       handleExceed(file, fileList) {
         this.$message.warning('一次最多选择5个文件!')
         return

       },
       uploadFileBtn(file) { //上传
         let that = this
         let newArr = [];
         newArr.push(file.file)
         let path = "/Upload/Temporary/"

         this.UploadSelfFileT(path, newArr, x => {
           this.saveMsg = []
           this.saveMsg.push({
             Path: x.data.FilePath,
             FileName: file.file.name,
             MD5Sign: file.file.uid,
             FileSize: (file.file.size / 1024).toFixed(0),
             FolderId: this.msg.ParentId
           })
           that.apipost('user_cloud_SaveFile', this.saveMsg, res => {
             if (res.data.resultCode == 1) {
               this.$message.success(res.data.message);
               this.$refs.upload.clearFiles();
               this.getList()
             } else {
               this.$message.error(res.data.message);
               this.$refs.upload.clearFiles();
             }
           }, err => {})
         });
       },
       dowloadSingle() {
         this.list.forEach(item => {
           if (item.shareFileType == 2) {
             for (let i = 0; i < this.notFileList.length; i++) {
               if (this.notFileList[i] == item.shareId) {
                 let reg = /^http(s)?:\/\/(.*?)\//
                 this.downloadFileRename(item.fileUrl.replace(reg, ''), item.fileName);
               }
             }
           }
         })
       },
       dowloadSingleInside() {
         this.nextList.forEach(item => {
           if (item.DataType == 2) {
             for (let i = 0; i < this.notFileListInside.length; i++) {
               if (this.notFileListInside[i] == item.Id) {
                 let reg = /^http(s)?:\/\/(.*?)\//
                 this.downloadFileRename(item.FilePath.replace(reg, ''), item.FolderName);
               }
             }
           }
         })
       },
       downloadOne(obj) {
         if (obj.shareFileType == 1) {
           this.yzmVisible = true
           this.createCode()
           this.fileList = []
           this.notFileList = []
           this.fileList.push(obj.shareId)
         }
         if (obj.shareFileType == 2) {
           let reg = /^http(s)?:\/\/(.*?)\//
          let dom = document.querySelector("#blankLink")
          dom.href = obj.fileUrl
          dom.click()
          return
          this.downloadFileRename(obj.fileUrl.replace(reg, ''), obj.FolderName);
         }
       },
       downloadTotal() {
         if (this.picLyanzhengma.toLocaleUpperCase() == this.checkCode) {
           this.yzmVisible = false
           this.$message.info('文件压缩中,请等待..')
           this.list.forEach(x => {
             if (this.fileList.length > 0) {
               for (let i = 0; i < this.fileList.length; i++) {
                 if (x.shareFileType == 1 && x.shareId == this.fileList[i]) {
                   this.downloadMsg.FolderIdStr.push(x.fileId)
                 }
               }
             } else {
               this.downloadMsg.folderIds = []
             }
           })
           this.list.forEach(x => {
             if (this.notFileList.length > 0) {
               for (let i = 0; i < this.notFileList.length; i++) {
                 if (x.shareFileType == 2 && x.shareId == this.notFileList[i]) {
                   this.downloadMsg.FileIdStr.push(x.fileId)
                 }
               }
             } else {
               this.downloadMsg.fileIds = []
             }
           })
           this.apipost('user_cloud_GetPackageFile', this.downloadMsg, res => {
             if (res.data.resultCode == 1) {
               const link = document.createElement('a');
               let _loadUrl = this.domainManager().DomainUrl;
               link.href = _loadUrl + res.data.data;
               document.body.appendChild(link);
               link.click();
               this.apipost('user_cloud_DelPackageFile', {
                 Path: link.href
               }, res => {}, err => {})
             } else {
               this.$message.error(res.data.message)
             }
           }, err => {})
         } else {
           this.$message.error('验证码错误!')
         }
       },
       downloadOneInside(obj) {
         if (obj.DataType == 0) {
           this.yzmVisible = true
           this.createCode()
           this.fileListInside = []
           this.notFileListInside = []
           this.fileListInside.push(obj.Id)
         }
         if (obj.DataType == 2) {
           let reg = /^http(s)?:\/\/(.*?)\//
            let dom = document.querySelector("#blankLink")
            dom.href = obj.fileUrl
            dom.click()
            return
            this.downloadFileRename(obj.fileUrl.replace(reg, ''), obj.FolderName);
         }
       },
       downloadTotalInside() {
         if (this.picLyanzhengma.toLocaleUpperCase() == this.checkCode) {
           this.yzmVisible = false
           this.$message.info('文件压缩中,请等待..')
           this.downloadMsgInside.FolderIdStr = this.fileListInside
           this.downloadMsgInside.FileIdStr = this.notFileListInside
           this.apipost('user_cloud_GetPackageFile', this.downloadMsgInside, res => {
             if (res.data.resultCode == 1) {
               const link = document.createElement('a');
               let _loadUrl = this.domainManager().DomainUrl;
               link.href = _loadUrl + res.data.data;
               document.body.appendChild(link);
               link.click();
               this.apipost('user_cloud_DelPackageFile', {
                 Path: link.href
               }, res => {}, err => {})
             } else {
               this.$message.error(res.data.message)
             }
           }, err => {})
         } else {
           this.$message.error('验证码错误!')
         }
       },


       enterTr(index) {
         this.curIndex = index
       },
       leaveTr() {
         this.curIndex = -1;
       },
       enterTrInside(index) {
         this.insideCurIndex = index
       },
       leaveTrInside() {
         this.insideCurIndex = -1;
       },
       checkedAll() {
         if (this.isCkedAll == true) {
           this.fileList = []
           this.notFileList = []
         } else {
           this.WjjId.forEach(item => {
             this.fileList.push(item)
           })
           this.WjId.forEach(item => {
             this.notFileList.push(item)
           })
         }
       },
       checkedAllInside() {
         if (this.isCkedAllInside == true) {
           this.fileListInside = []
           this.notFileListInside = []
         } else {
           this.WjjIdInside.forEach(item => {
             this.fileListInside.push(item)
           })
           this.WjIdInside.forEach(item => {
             this.notFileListInside.push(item)
           })
         }
       },
       ckeckedOneInside() {
         if (this.fileListInside.length + this.notFileListInside.length < this.allLengthInside) {
           this.isCkedAllInside = false
         } else {
           this.isCkedAllInside = true
         }
       },
       ckeckedOne() {
         if (this.fileList.length + this.notFileList.length < this.allLength) {
           this.isCkedAll = false
         } else {
           this.isCkedAll = true
         }
       },
       openAddFilesDialog() {
         this.dialogTitle = '新建文件夹'
         this.outerVisible = true
       },
       addFiles() {
         this.apipost('user_cloud_AddFolder', this.addFileMsg, res => {
           if (res.data.resultCode == 1) {
             this.$message.success(res.data.message);
             this.getList()
             this.outerVisible = false
             this.addFileMsg.FolderName = ''

           } else {
             this.$message.error(res.data.message)
           }
         }, err => {})
       },
       deleteFiles() {
         this.$confirm('删除文件后,分享和子文件将被删除,是否删除?', '提示', {
           confirmButtonText: '确定',
           cancelButtonText: '取消',
           type: 'warning'
         }).then(() => {
           this.apipost('user_cloud_DelFolder', {
             FolderIdStr: this.fileList,
             FileIdStr: this.notFileList
           }, res => {
             if (res.data.resultCode == 1) {
               this.$message.success(res.data.message);
               this.getList()
             } else {
               this.$message.error(res.data.message)
             }
           }, err => {})
         }).catch(() => {
           this.$message.info('取消删除');
         });
       },
       deleteOne(obj) {
         let fileList = []
         let notFileList = []
         let confirmMsg = ''
         if (obj.DataType == 0) { //文件夹
           fileList.push(obj.Id)
           confirmMsg = '删除文件夹后,分享和子文件将被删除,是否删除?'

         }
         if (obj.DataType == 2) { //文件
           notFileList.push(obj.Id)
           confirmMsg = '删除文件后,分享文件将被删除,是否删除?'
         }
         this.$confirm(confirmMsg, '提示', {
           confirmButtonText: '确定',
           cancelButtonText: '取消',
           type: 'warning'
         }).then(() => {
           this.apipost('user_cloud_DelFolder', {
             FolderIdStr: fileList,
             FileIdStr: notFileList
           }, res => {
             if (res.data.resultCode == 1) {
               this.$message.success(res.data.message);
               this.getList()
             } else {
               this.$message.error(res.data.message)
             }
           }, err => {})
         }).catch(() => {
           this.$message.info('取消删除');
         });
       },
       moveFiles() {
         this.getTreeList()
         this.dialogTitle2 = '移动文件'
         this.outerVisible2 = true
       },
       moveOneFile(obj) {
         this.fileList = []
         this.notFileList = []
         if (obj.shareFileType == 1) {
           this.fileList.push(obj.shareId)
         }
         if (obj.shareFileType == 2) {
           this.notFileList.push(obj.shareId)
         }
         this.getTreeList()
         this.dialogTitle2 = '移动文件'
         this.outerVisible2 = true
       },
       moveOneFileInside(obj) {
         this.fileListInside = []
         this.notFileListInside = []
         if (obj.DataType == 0) {
           this.fileListInside.push(obj.Id)
         }
         if (obj.DataType == 2) {
           this.notFileListInside.push(obj.Id)
         }
         this.getTreeList()
         this.dialogTitle2 = '移动文件'
         this.outerVisible2 = true
       },
       handleNodeChange(data, checked) {
         if (checked) {
           this.arr.push(data.Id)
           this.$refs.tree.setCheckedKeys([data.Id]);
           this.MoveMsg.foldId = data.Id;
         } else {
           if (this.arr.length == 1) {
             this.arr = []
             this.MoveMsg.foldId = '0'
           } else {
             this.arr = this.arr.slice(this.arr.length - 1)
             this.MoveMsg.foldId = this.arr[this.arr.length - 1]
           }
         }
       },
       saveMoveFiles() {
         this.list.forEach(x => {
           if (this.fileList.length > 0) {
             for (let i = 0; i < this.fileList.length; i++) {
               if (x.shareFileType == 1 && x.shareId == this.fileList[i]) {
                 this.MoveMsg.folderIds.push(x.fileId)
               }
             }
           } else {
             this.MoveMsg.folderIds = []
           }
         })
         this.list.forEach(x => {
           if (this.notFileList.length > 0) {
             for (let i = 0; i < this.notFileList.length; i++) {
               if (x.shareFileType == 2 && x.shareId == this.notFileList[i]) {
                 this.MoveMsg.fileIds.push(x.fileId)
               }
             }
           } else {
             this.MoveMsg.fileIds = []
           }
         })
         this.apipost('user_cloud_share_file_move', this.MoveMsg, res => {
           if (res.data.resultCode == 1) {
             this.$message.success(res.data.message);
             this.outerVisible2 = false;
             this.getList()
           } else {
             this.$message.error(res.data.message)
           }
         }, err => {})
       },
       saveMoveFilesInside() {
         this.MoveMsg.folderIds = this.fileListInside
         this.MoveMsg.fileIds = this.notFileListInside
         this.apipost('user_cloud_share_file_move', this.MoveMsg, res => {
           if (res.data.resultCode == 1) {
             this.$message.success(res.data.message);
             this.outerVisible2 = false;
             this.getList()
           } else {
             this.$message.error(res.data.message)
           }
         }, err => {})
       },
       openShareOneDialog(obj) {
         if (obj.DataType == 0) {
           this.fileList = []
           this.notFileList = []
           this.fileList.push(obj.Id)
         }
         if (obj.DataType == 2) {
           this.fileList = []
           this.notFileList = []
           this.notFileList.push(obj.Id)
         }
         this.outerVisible3 = true
         this.dialogTitle3 = '分享文件/文件夹'
         this.getDepartment()
         this.getRole()
         this.getMenber()
       },
       openShareDialog() {
         this.outerVisible3 = true
         this.dialogTitle3 = '分享文件/文件夹'
         this.getDepartment()
         this.getRole()
         this.getMenber()
       },
       shareDeparment() {
         this.shareMsg.shareType = 1
         this.ckdRoleList = []
         this.ckdRoleListId = []
         this.ckdMenberList = []
         this.ckdMenberListId = []
       },
       shareRole() {
         this.shareMsg.shareType = 2
         this.ckdDepartmentList = []
         this.ckdDepartmentListId = []
         this.ckdMenberList = []
         this.ckdMenberListId = []
       },
       shareMenber() {
         this.shareMsg.shareType = 3
         this.ckdDepartmentList = []
         this.ckdDepartmentListId = []
         this.ckdRoleList = []
         this.ckdRoleListId = []
       },
       getDepartment() { //部门
         this.apipost('app_get_GetDepartmentListTree', {}, res => {
           this.departmentList = res.data.data
         }, err => {})
       },
       DepartmentListNodeChange(data, checked) {
         if (checked) {
           this.ckdDepartmentList.push({
             name: data.DepartmentName,
             id: data.DepartmentID
           })
           this.ckdDepartmentListId.push(data.DepartmentID)
         }
         if (!checked) {
           if (this.ckdDepartmentList.findIndex(item => item.id === data.DepartmentID) != -1) {
             this.ckdDepartmentList.splice(this.ckdDepartmentList.findIndex(item => item.id === data.DepartmentID), 1)
           }
           if (this.ckdDepartmentListId.findIndex(item => item === data.DepartmentID) != -1) {
             this.ckdDepartmentListId.splice(this.ckdDepartmentListId.findIndex(item => item === data.DepartmentID), 1)
           }
         }
       },
       deleteDepartment(id) {
         this.ckdDepartmentList.splice(this.ckdDepartmentList.findIndex(item => item.id === id), 1)
         this.ckdDepartmentListId.splice(this.ckdDepartmentListId.findIndex(item => item === id), 1) //删除相同id
         this.$refs.treeDepartmentList.setCheckedKeys(this.ckdDepartmentListId);
       },

       getRole() { //岗位
         this.apipost('WorkFlow_get_GetDepartMentPost', {}, res => {
           this.roleList = res.data.data
         }, err => {})
       },
       roleListNodeChange(data, checked) {
         if (data.Type == 2 && checked) {
           this.ckdRoleList.push({
             name: data.DepartmentName,
             id: data.DepartmentId
           })
           this.ckdRoleListId.push(data.DepartmentId)
         }
         if (data.Type == 2 && !checked) {
           if (this.ckdRoleList.findIndex(item => item.id === data.DepartmentId) != -1) {
             this.ckdRoleList.splice(this.ckdRoleList.findIndex(item => item.id === data.DepartmentId), 1)
           }
           if (this.ckdRoleListId.findIndex(item => item === data.DepartmentId) != -1) {
             this.ckdRoleListId.splice(this.ckdRoleListId.findIndex(item => item === data.DepartmentId), 1) //删除相同id		
           }
         }
       },
       deleteRole(id) {
         this.ckdRoleList.splice(this.ckdRoleList.findIndex(item => item.id === id), 1)
         this.ckdRoleListId.splice(this.ckdRoleListId.findIndex(item => item === id), 1)
         //删除相同id
         this.$refs.treeRole.setCheckedKeys(this.ckdRoleListId);
       },

       getMenber() { //员工
         this.apipost('WorkFlow_get_GetDepartMentEmployee', {}, res => {
           this.menberList = res.data.data
         }, err => {})
       },
       MenberListNodeChange(data, checked) {
         if (data.Type == 2 && checked) {
           this.ckdMenberList.push({
             name: data.DepartmentName,
             id: data.DepartmentId
           })
           this.ckdMenberListId.push(data.DepartmentId)
         }
         if (data.Type == 2 && !checked) {
           if (this.ckdMenberList.findIndex(item => item.id === data.DepartmentId) != -1) {
             this.ckdMenberList.splice(this.ckdMenberList.findIndex(item => item.id === data.DepartmentId), 1)
           }
           if (this.ckdMenberListId.findIndex(item => item === data.DepartmentId) != -1) {
             this.ckdMenberListId.splice(this.ckdMenberListId.findIndex(item => item === data.DepartmentId),
               1) //删除相同id	
           }
         }
       },

       deleteMenber(id) {
         this.ckdMenberList.splice(this.ckdMenberList.findIndex(item => item.id === id), 1)
         this.ckdMenberListId.splice(this.ckdMenberListId.findIndex(item => item === id), 1) //删除相同id
         this.$refs.treeMenber.setCheckedKeys(this.ckdMenberListId);
       },
       saveShareDocument() {
         if (this.shareMsg.shareType == 1) {
           this.shareMsg.targetIds = this.ckdDepartmentListId.join(',')
         } else if (this.shareMsg.shareType == 2) {
           this.shareMsg.targetIds = this.ckdRoleListId.join(',')
         } else {
           this.shareMsg.targetIds = this.ckdMenberListId.join(',')
         }
         this.shareMsg.fileIds = this.notFileList
         this.shareMsg.folderIds = this.fileList
         this.apipost('user_cloud_file_share', this.shareMsg, res => {
           if (res.data.resultCode == 1) {
             this.outerVisible3 = false
             this.$message.success(res.data.message)
           } else {
             this.$message.error(res.data.message)
           }
         }, err => {})
       },

       updateFiles(obj) {
         this.outerVisible = true;
         this.dialogTitle = '修改文件夹'
         this.addFileMsg.FolderName = obj.FolderName;
         this.addFileMsg.FolderId = obj.FolderId;
       },
       updateOneFile(obj) {
         this.outerVisible1 = true;
         this.dialogTitle1 = '修改文件'
         let index = obj.FolderName.lastIndexOf('.')
         if (obj.FolderName && obj.FolderName != "") {
           this.updateFileMsg.FileName = obj.FolderName.substring(0, index)
         }
         this.updateFileMsg.FileId = obj.Id
       },
       saveUpdateFile() {
         this.apipost('user_cloud_UpdateFile', this.updateFileMsg, res => {
           if (res.data.resultCode == 1) {
             this.$message.success(res.data.message);
             this.outerVisible = false;
             this.getList()
           } else {
             this.$message.error(res.data.message)
           }
         }, err => {})
       },
       getList() {
         this.apipost('user_cloud_get_share_tomy', this.msg, res => {
           if (res.data.resultCode == 1) {
             this.list = res.data.data.pageData
             this.isCkedAll = false
             this.fileList = []
             this.notFileList = []
             this.allLength = res.data.data.pageData.length
             this.WjjId = []
             this.WjId = []
             res.data.data.pageData.forEach(item => {
               if (item.shareFileType == 1) {
                 this.WjjId.push(item.shareId)
                 item.icons = this.loadFileICON('')
               }
               if (item.shareFileType == 2) {
                 this.WjId.push(item.shareId)
                 if (item.fileName && item.fileName != "") {
                   let fileType = item.fileName.substring(item.fileName.lastIndexOf('.') + 1, item.fileName
                     .length).toLowerCase()
                   item.icons = this.loadFileICON(fileType)
                 }
               }
             })

           }
         }, err => {})
       },
       getNextLevel(obj) {
         this.addFileMsg.ParentId = obj.fileId
         this.nextMsg.ParentId = obj.fileId
         this.nextMsg.EmployeeId = obj.ShareEmployeeId
         this.isChildFiles = true
         this.getNextLevelList()
         this.isCkedAll = false
         this.fileList = []
         this.notFileList = []
         this.NavList.push({
           name: obj.fileName,
           id: obj.fileId
         })

       },
       getNextLevelTree(obj) {
         this.nextMsg.ParentId = obj.Id
         this.getNextLevelList()
         this.NavList.push({
           name: obj.FolderName,
           id: obj.Id
         })
         this.isChildFiles = true
         this.isCkedAllInside = false
       },
       getNavTree(obj, index) {
         this.nextMsg.ParentId = obj.id
         this.isCkedAllInside = false
         this.getNextLevelList()
         this.NavList = this.NavList.slice(0, index + 1)
       },
       getNextLevelList() {
         this.apipost('user_cloud_GetFolderList', this.nextMsg, res => {
           if (res.data.resultCode == 1) {
             this.nextList = res.data.data.data
             this.allLengthInside = res.data.data.data.length
             this.fileListInside = []
             this.notFileListInside = []
             this.WjjIdInside = []
             this.WjIdInside = []
             res.data.data.data.forEach(item => {
               if (item.DataType == 0) {
                 this.WjjIdInside.push(item.Id)
                 item.icons = this.loadFileICON('')
               }
               if (item.DataType == 2) {
                 this.WjIdInside.push(item.Id);
                 if (item.FolderName && item.FolderName != "") {
                   let fileType = item.FolderName.substring(item.FolderName.lastIndexOf('.') + 1, item
                     .FolderName
                     .length).toLowerCase()
                   item.icons = this.loadFileICON(fileType)
                 }
               }
             })
           }
         }, err => {})
       },
       getTreeList() {
         this.apipost('user_cloud_GetFolderTreeList', {}, res => {
           if (res.data.resultCode == 1) {
             this.fileTreeList = res.data.data
           } else {}
         }, err => {})
       },
       submitForm(addMsg) { //提交创建、修改表单
         this.$refs[addMsg].validate((valid) => {
           if (valid) {
             this.addFiles()
           } else {
             return false;
           }
         });
       },
       closeChangeMachie(done) { //弹出框关闭初始化弹框内表单
         done();
         this.addFileMsg.FolderName = ''
       },
       doSearch() {
         this.getList();
       },
       moveCancel() {
         this.$refs.tree.setCheckedKeys([]);
         this.outerVisible2 = false;
       }
     },
     mounted() {
       let userInfo = this.getLocalStorage();
       this.getList()
     },
     created() {
       this.createCode()
     }

   }

 </script>

 <style>
   .myDocumentsNav {
     margin: 25px 0;
   }

   .myDocumentsTable td,
   .myDocumentsTable th {
     text-align: left !important;
     padding-left: 15px;
   }

   .myDocumentsLink {
     margin: 25px 0;
   }

   .myDocumentsLink>span {
     font-size: 12px;
     cursor: pointer;
     color: #E95252;
   }

   .myDocumentsLink>span:not(:last-of-type):hover {
     text-decoration: underline;
   }

   .myDocumentsLink>span:not(:last-of-type):after {
     content: '>';
     margin: 0 3px;
     color: #E95252;
     pointer-events: none;
   }

   .myDocumentsLink>span:last-child {
     color: #666;
     cursor: default;
   }

   .myDocumentUploadBtn {
     float: left;
     margin-right: 10px;
   }

   .shareDocumentDialog .el-dialog__body {
     padding: 0 !important;
   }

   .documentDialogNav {
     background: #E95252;
     height: 45px;
   }

   .documentDialogNav>div {
     display: inline-block;
     color: #fff;
     width: 90px;
     height: 26px;
     margin-left: 20px;
     position: relative;
     border-radius: 13px;
     background: rgba(0, 0, 0, .2);
     text-align: center;
     cursor: pointer;
   }

   .documentDialogNav>div .checkIcon {
     width: 0;
     height: 0;
     border-width: 0 5px 5px;
     position: absolute;
     left: 40px;
     top: 40px;
     border-style: solid;
     border-color: transparent transparent #fff;
     /*透明 透明  灰*/
   }

   .DocumentLoadVerification {
     width: 120px;
     height: 30px;
     border-radius: 4px;
     letter-spacing: 5px;
     border: none;
     background: #f56c6c;
     color: #eee;
     cursor: pointer;
   }

 </style>