<template>
  <div class="flexOne">
    <div class="myDocumentsNav">
      <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">{{$t('objFill.v101.administrative.wodefenx')}}</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">{{$t('objFill.v101.chat.wenjianming')}}</th>
          <th width="200">{{$t('objFill.v101.chat.daxiao')}}</th>
          <th width="200">{{$t('objFill.v101.chat.xiugairiqi')}}</th>
        </tr>
        <tr v-for="(item,index) in nextList">
          <td v-if="item.DataType==0">
            <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">
            <div @click="analyzeItemInside(item)" style="cursor: pointer; display: inline-block;">
              <div :class="['fileIcon', item.icons]"></div>
              {{item.FolderName}}
            </div>
          </td>
          <td>{{item.FileSize| FileSizeFormat(item.FileSize)}}</td>
          <td>{{item.UpdateTime}}</td>
        </tr>
      </tbody>
      <tbody v-if="!isChildFiles">
        <tr>
          <th width="300">{{$t('objFill.v101.chat.wenjianming')}}</th>
          <th width="100">{{$t('objFill.v101.administrative.wenjiands')}}</th>
          <th width="400">{{$t('salesModule.Recipient')}}</th>
          <th width="100">{{$t('objFill.v101.administrative.fenxiangzt')}}</th>
          <th width="200">{{$t('objFill.v101.administrative.fenxiangleix')}}</th>
          <th width="200">{{$t('objFill.v101.administrative.fenxiangrqi')}}</th>
          <th width="200">{{$t('system.table_operation')}}</th>
        </tr>
        <tr v-for="(item,index) in list" @mouseover="enterTr(index)" @mouseleave="leaveTr" :key="index">
          <td v-if="item.shareFileType==1">
            <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">
            <div @click="analyzeItem(item)" style="cursor: pointer;  display: inline-block;">
              <div :class="['fileIcon', item.icons]"></div>
              {{item.fileName}}
            </div>
          </td>
          <td>{{item.fileSize| FileSizeFormat(item.fileSize)}}</td>
          <td>

            <div v-if='item.shareType==1'>{{item|reciveFormat(item)}}</div>
            <div v-if='item.shareType==2'>
              {{item|reciveFormat(item)}}
            </div>
            <div v-if='item.shareType==3&&item.recive.length<=3'>
              <span v-for="i in item.recive" style="margin-right: 10px;">
                <img style="vertical-align: sub; width: 14px; height: 14px; border-radius: 7px;" v-if="!i.userPhoto"
                  src="../../assets/img/litheader.png" alt="">
                <img style="vertical-align: sub; width: 14px; height: 14px; border-radius: 7px;" v-else
                  :src="i.userPhoto" alt="" :onerror="defaultImg">
                {{i.userName}}
              </span>
            </div>
            <div v-if='item.shareType==3&&item.recive.length>3'>

              <span v-if='!item.isOpen' v-for="i in filterArr(item.recive,3)"
                style="margin:5px 10px 5px 0; display: inline-block;">
                <img style="vertical-align: sub; width: 14px; height: 14px; border-radius: 7px;" v-if="!i.userPhoto"
                  src="../../assets/img/litheader.png" alt="">
                <img style="vertical-align: sub; width: 14px; height: 14px; border-radius: 7px;" v-else
                  :src="i.userPhoto" alt="" :onerror="defaultImg">
                {{i.userName}}
              </span>

              <span v-if='item.isOpen' v-for="i in item.recive" style="margin:5px 10px 5px 0; display: inline-block;">
                <img style="vertical-align: sub; width: 14px; height: 14px; border-radius: 7px;" v-if="!i.userPhoto"
                  src="../../assets/img/litheader.png" alt="">
                <img style="vertical-align: sub; width: 14px; height: 14px; border-radius: 7px;" v-else
                  :src="i.userPhoto" alt="" :onerror="defaultImg">
                {{i.userName}}
              </span>
              <span v-if='!item.isOpen' style="color: #2AAEF2; cursor: pointer;"
                @click="item.isOpen=true">{{$t('objFill.v101.administrative.deng')}}{{item.recive.length}}{{$t('hotel.hotel_people')}}</span>
              <span v-if='item.isOpen' style="color: #2AAEF2; cursor: pointer;"
                @click="item.isOpen=!true">{{$t('fnc.shouqi')}}</span>
            </div>
          </td>
          <td>{{item.shareStatus=='1'?$t('pub.normalSel'):$t('pub.cancelBtn')}}</td>
          <td>{{shareTypeFormat(item.shareType)}}</td>
          <td>{{item.createTime}}</td>
          <td>
            <el-button-group>
              <el-tooltip class="item" effect="dark" :content="$t('objFill.xz')" placement="top-start">
                <el-button type="primary" icon="el-icon-download" @click='downloadOne(item)'></el-button>
              </el-tooltip>
              <el-tooltip class="item" effect="dark" :content="$t('objFill.v101.administrative.xiugaifenx')"
                placement="top-start">
                <el-button type="primary" icon="el-icon-share" @click='updateShareOneDialog(item)'></el-button>
              </el-tooltip>
              <el-tooltip v-if="item.shareStatus=='1'" class="item" effect="dark"
                :content="$t('objFill.v101.administrative.quxiaofenx')" placement="top-start">
                <el-button type="warning" icon='iconfont icon-quxiao1' @click='changeShareType(item)'></el-button>
              </el-tooltip>
              <el-tooltip v-if="item.shareStatus=='2'" class="item" effect="dark"
                :content="$t('objFill.v101.administrative.huifufenx')" placement="top-start">
                <el-button type="primary" icon='iconfont icon-huifu' @click='changeShareType(item)'></el-button>
              </el-tooltip>
              <el-tooltip class="item" effect="dark" :content="$t('system.table_delete')" placement="top-start">
                <el-button type="danger" icon="el-icon-delete" @click='deleteShareFile(item)'></el-button>
              </el-tooltip>
            </el-button-group>
          </td>
        </tr>
      </tbody>
    </table>

    <el-dialog custom-class='w400' :title="dialogTitle" :visible.sync="outerVisible" center
      :before-close="closeChangeMachie">
      <el-form :model="addFileMsg" :rules="rules" ref="addFileMsg" label-width="80px">
        <el-form-item :label="$t('objFill.v101.administrative.wenjianmc')" prop="FolderName">
          <el-input type="text" maxLength='50' v-model='addFileMsg.FolderName'></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <input type="button" class="hollowFixedBtn" :value="$t('pub.cancelBtn')"
          @click="outerVisible = false,addFileMsg.FolderName=''" />
        <input type="button" class="normalBtn" :value="$t('pub.sureBtn')" @click="submitForm('addFileMsg')" />
      </div>
    </el-dialog>

    <el-dialog custom-class='w400' :title="dialogTitle1" :visible.sync="outerVisible1" center>
      <el-form :model="updateFileMsg" :rules="rules1" ref="updateFileMsg" label-width="80px">
        <el-form-item :label="$t('admin.mane')" prop="FileName">
          <el-input type="text" maxLength='50' v-model='updateFileMsg.FileName'></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <input type="button" class="hollowFixedBtn" :value="$t('pub.cancelBtn')" @click="outerVisible1 = false" />
        <input type="button" class="normalBtn" :value="$t('pub.sureBtn')" @click="saveUpdateFile" />
      </div>
    </el-dialog>

    <el-dialog custom-class='w400' :title="dialogTitle2" :visible.sync="outerVisible2" 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="outerVisible2=false" />
        <input type="button" class="normalBtn" :value="$t('pub.sureBtn')" @click="saveMoveFiles" />
      </div>
    </el-dialog>

    <el-dialog custom-class='w800 shareDocumentDialog' :title="dialogTitle3" :visible.sync="outerVisible3" center>
      <div class="documentDialogNav">
        <div @click="shareGroup">
          <i class="iconfont icon-user11"></i>{{$t('objFill.v101.administrative.jituan')}}
          <div v-if='shareMsg.shareType==4' class="checkIcon"></div>
        </div>
        <div @click="shareDeparment">
          <i class="iconfont icon-user11"></i>{{$t('admin.admin_Department')}}
          <div v-if='shareMsg.shareType==1' class="checkIcon"></div>
        </div>
        <div @click="shareRole">
          <i class="iconfont icon-user11"></i>{{$t('admin.admin_Post')}}
          <div v-if='shareMsg.shareType==2' class="checkIcon"></div>
        </div>

        <div @click="shareMenber">
          <i class="iconfont icon-user11"></i>{{$t('system.table_staffs')}}
          <div v-if='shareMsg.shareType==3' class="checkIcon"></div>
        </div>
      </div>
      <div v-show='shareMsg.shareType==1' class="myDocumentShareDiv">
        <div class="myDocumentShareTree">
          <el-tree :data="departmentList" ref="treeDepartmentList" node-key="DepartmentId" :check-strictly='true'
            show-checkbox :render-after-expand="false" :props="defaultProps2" @check-change="DepartmentListNodeChange">
          </el-tree>
        </div>
        <div class="myDocumentShareObject">
          <ul>
            <li v-for="item in ckdDepartmentList">{{item.name}}
              <i @click="deleteDepartment(item.id)" class="el-icon-circle-close"></i>
            </li>
          </ul>
        </div>
      </div>
      <div v-show='shareMsg.shareType==2' class="myDocumentShareDiv">
        <div class="myDocumentShareTree">
          <el-tree :data="roleList" ref="treeRole" node-key="DepartmentId" :check-strictly='true' show-checkbox
            :render-after-expand="false" :props="defaultProps1" @check-change="roleListNodeChange">
          </el-tree>
        </div>
        <div class="myDocumentShareObject">
          <ul>
            <li v-for="item in ckdRoleList">{{item.name}}
              <i @click="deleteRole(item.id)" class="el-icon-circle-close"></i>
            </li>
          </ul>
        </div>
      </div>
      <div v-show='shareMsg.shareType==3' class="myDocumentShareDiv">
        <div class="myDocumentShareTree">
          <el-tree :data="menberList" ref="treeMenber" node-key="DepartmentId" :check-strictly='true' show-checkbox
            :render-after-expand="false" :props="defaultProps3" @check-change="MenberListNodeChange">
          </el-tree>
        </div>
        <div class="myDocumentShareObject">
          <ul>
            <li v-for="item in ckdMenberList">{{item.name}}
              <i @click="deleteMenber(item.id)" class="el-icon-circle-close"></i>
            </li>
          </ul>
        </div>
      </div>
      <div v-if="shareMsg.shareType==4" class="myDocumentShareDiv">
        <div style="height:400px;padding:20px;font-size:15px;">
          {{$t('objFill.v101.administrative.fenxdzgjt')}}
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <input type="button" class="hollowFixedBtn" :value="$t('pub.cancelBtn')" @click="outerVisible3=false" />
        <input type="button" class="normalBtn" :value="$t('pub.sureBtn')" @click="saveShareDocument" />
      </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="$t('objFill.v101.administrative.yasuoxz')" :visible.sync="yzmVisible" center>
      <p>
        <span>{{$t('objFill.yanzhengma')}} : </span>
        <el-input class='w150' type="text" :placeholder="$t('objFill.qingshuruyzm')" 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 type="button" class="normalBtn" :value="$t('pub.sureBtn')" @click="downloadTotal()" />
      </div>
    </el-dialog>

    <a target="_blank" style="display:none" id="blankLink"></a>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        code: '',
        picLyanzhengma: '',
        checkCode: '',
        yzmVisible: false,
        initialIndex: 0,
        picObj: [],
        picIsShow: false,
        audioIsShow: false,
        outerVisible4: false,
        dialogTitle4: '',
        moviePath: '',
        audioPath: '',
        picPath: '',
        audioName: '',
        leftLoadCount: 0,
        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"
        },
        NavList: [],
        isChildFiles: false,
        defaultImg: 'this.src="' + require('../../assets/img/litheader.png') + '"',
        outerVisible: false,
        dialogTitle: '',
        outerVisible1: false,
        dialogTitle1: '',
        outerVisible2: false,
        dialogTitle2: '',
        outerVisible3: false,
        dialogTitle3: '',
        isCkedAll: false,
        //请求数据
        fileList: [], //文件夹
        notFileList: [], //文件
        saveMsg: [],
        msg: {
          pageIndex: '1',
          pageSize: '9999',
          ShareName: ''
        },
        nextMsg: {
          ParentId: '0',
          FolderName: '',
        },
        addFileMsg: {
          FolderName: '',
          ParentId: '0',
          FolderId: '',
        },
        updateFileMsg: {
          FileId: '0',
          FileName: '0'
        },
        MoveMsg: {
          FolderId: '0'
        },
        shareMsg: {
          shareType: '1',
          fileIds: [],
          targetIds: '',
          folderIds: [],
          shareId: 0
        },
        //返回数据
        curIndex: -1,
        list: [],
        fileTreeList: [],
        NavigationList: [],
        WjId: [],
        WjjId: [],
        arr: [],
        departmentList: [],
        ckdDepartmentList: [],
        ckdDepartmentListId: [],
        roleList: [],
        ckdRoleList: [],
        ckdRoleListId: [],
        menberList: [],
        ckdMenberList: [],
        ckdMenberListId: [],
        nextList: [],
        crtData: {},
        shareTypes: {
          t1: this.$t('admin.admin_Department'),
          t2: this.$t('admin.admin_Post'),
          t3: this.$t('fnc.zdchengyuan'),
        },
        rules: { //表单验证
          FolderName: [{
            required: true,
            message: this.$t('objFill.v101.administrative.qingshurwjjmc'),
            trigger: 'blur'
          }]
        },
        rules1: { //表单验证
          FileName: [{
            required: true,
            message: this.$t('objFill.v101.administrative.qingsrwjmc'),
            trigger: 'blur'
          }]
        },
      }
    },
    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'
          }
        }
      },

      reciveFormat(value) {
        if (value.shareType == 1 || value.shareType == 2) {
          if (value.recive != null) {
            return value.recive.join(',')
          } else {
            return ''
          }
        }
      }
    },
    methods: {
      shareTypeFormat(value) {
        if (value == 1) {
          return this.shareTypes.t1
        }
        if (value == 2) {
          return this.shareTypes.t2
        }
        if (value == 3) {
          return this.shareTypes.t3
        }
      },
      // 图片验证码
      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 fileType = item.fileName.substring(item.fileName.lastIndexOf('.') + 1, item.fileName.length)
                    .toUpperCase()
                  if ('GIF|JPG|JPEG|PNG|BMP'.indexOf(fileType) != -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)
            break;
          default:
            this.$message.warning(this.$t('objFill.v101.administrative.gaiwjbzcylqxzxgrj'))
            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(this.$t('objFill.v101.administrative.gaiwjbzcylqxzxgrj'))
            break;
        }

      },
      filterArr(obj, length) {
        return obj.slice(0, length)
      },
      changeShareType(obj) {
        let _message = ''
        let shareId = []
        shareId.push(obj.shareId)
        if (obj.shareStatus == 1) {
          _message = this.$t('objFill.v101.administrative.shifouquxiaofenx')
        } else {
          _message = this.$t('objFill.v101.administrative.shifouhuiffx')
        }
        this.$confirm(_message, this.$t('tips.tips'), {
          confirmButtonText: this.$t('pub.sureBtn'),
          cancelButtonText: this.$t('pub.cancelBtn'),
          type: 'warning'
        }).then(() => {
          obj.shareStatus = obj.shareStatus == 1 ? 2 : 1
          this.apipost('user_cloud_update_file_share_status', {
            shareId: shareId,
            shareStatus: obj.shareStatus
          }, 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(this.$t('objFill.v101.administrative.quxiaocaozuo'));
        });
      },
      dowloadSingle() {
        let objKey = [];
        this.list.forEach(item => {
          if (item.DataType == 2) {
            for (let i = 0; i < this.notFileList.length; i++) {
              if (this.notFileList[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.FileId)
        }
        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.fileName);
        }
      },
      downloadTotal() {
        if (this.picLyanzhengma.toLocaleUpperCase() == this.checkCode) {
          this.yzmVisible = false
          this.$message.info(this.$t('objFill.v101.administrative.wenjianysqdd'))
          this.apipost('user_cloud_GetPackageFile', {
            FolderIdStr: this.fileList,
            FileIdStr: this.notFileList
          }, 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(this.$t('objFill.v101.administrative.yanzhnegmcw'))
        }
      },
      enterTr(index) {
        this.curIndex = index
      },
      leaveTr() {
        this.curIndex = -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)
          })
        }
      },
      ckeckedOne() {
        if (this.fileList.length + this.notFileList.length < this.allLength) {
          this.isCkedAll = false
        } else {
          this.isCkedAll = true
        }
      },
      openAddFilesDialog() {
        this.dialogTitle = this.$t('objFill.v101.administrative.xinjianwjj')
        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(this.$t('objFill.v101.administrative.shancwjfxzwjjbs') + '?', this.$t('tips.tips'), {
          confirmButtonText: this.$t('pub.sureBtn'),
          cancelButtonText: this.$t('pub.cancelBtn'),
          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(this.$t('objFill.quxiaoshanc'));
        });
      },
      deleteShareFile(obj) {
        this.$confirm(this.$t('objFill.v101.administrative.shifouscfx'), this.$t('tips.tips'), {
          confirmButtonText: this.$t('pub.sureBtn'),
          cancelButtonText: this.$t('pub.cancelBtn'),
          type: 'warning'
        }).then(() => {
          this.apipost('user_cloud_delete_file_share', {
            shareId: obj.shareId,
          }, 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(this.$t('objFill.quxiaoshanc'));
        });
      },
      moveFiles() {
        this.getTreeList()
        this.dialogTitle2 = this.$t('objFill.v101.administrative.yidongwenj')
        this.outerVisible2 = true
      },
      handleNodeChange(data, checked) {
        if (checked) {
          this.arr.push(data.Id)
          this.$refs.tree.setCheckedKeys([data.Id]);
          this.MoveMsg.FolderId = data.Id;
        } else {
          if (this.arr.length == 1) {
            this.arr = []
            this.MoveMsg.FolderId = '0'
          } else {
            this.arr = this.arr.slice(this.arr.length - 1)
            this.MoveMsg.FolderId = this.arr[this.arr.length - 1]
          }
        }
      },
      saveMoveFiles() {
        this.MoveMsg.FolderIdStr = this.fileList
        this.MoveMsg.FileIdStr = this.notFileList
        this.apipost('user_cloud_BatchFolderMove', 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 => {})
      },
      updateShareOneDialog(obj) {
        //				let resetArr=obj.TargetIds.split(',')
        //				this.outerVisible3 = true
        //				this.dialogTitle3 = this.$t('objFill.v101.administrative.fenxwjwjj')	
        //				this.shareMsg.shareId = obj.shareId;
        //				if(obj.shareType==1){  //文件夹
        //					this.fileList=[]
        //					this.notFileList=[]
        //					this.fileList.push(obj.Id)
        //				}
        //				if(obj.shareType==2){  //文件
        //					this.fileList=[]
        //					this.notFileList=[]
        //					this.notFileList.push(obj.Id)
        //				}
        //				if(obj.shareType==1){  //部门
        //					this.shareMsg.shareType=1
        //					//let departMentArr=resetArr
        //					this.$refs.treeDepartmentList.setCheckedKeys(resetArr);
        //				}
        //				if(obj.shareType==2){  //岗位
        //					this.shareMsg.shareType=2
        //					this.$refs.treeRole.setCheckedKeys(resetArr);
        //				}
        //				if(obj.shareType==3){  //员工
        //					this.shareMsg.shareType=3
        //					this.$refs.treeMenber.setCheckedKeys(resetArr);
        //				}
        this.getDepartment()
        this.getRole()
        this.getMenber()
        this.crtData = obj
      },
      loadRightData() {
        let obj = this.crtData
        let resetArr = obj.TargetIds.split(',')
        this.outerVisible3 = true
        this.dialogTitle3 = this.$t('objFill.v101.administrative.fenxwjwjj')
        this.shareMsg.shareId = obj.shareId;
        if (obj.shareType == 1) { //文件夹
          this.fileList = []
          this.notFileList = []
          this.fileList.push(obj.Id)
        }
        if (obj.shareType == 2) { //文件
          this.fileList = []
          this.notFileList = []
          this.notFileList.push(obj.Id)
        }
        if (obj.shareType == 1) { //部门
          this.shareMsg.shareType = 1
          //let departMentArr=resetArr
          let that = this
          this.$nextTick(() => {
            this.$refs.treeDepartmentList.setCheckedKeys(resetArr);
          });
        }
        if (obj.shareType == 2) { //岗位
          this.shareMsg.shareType = 2
          let that = this
          this.$nextTick(() => {
            this.$refs.treeRole.setCheckedKeys(resetArr);
          });
        }
        if (obj.shareType == 3) { //员工
          this.shareMsg.shareType = 3
          let that = this
          this.$nextTick(() => {
            that.$refs.treeMenber.setCheckedKeys(resetArr);
          });

        }
      },
      openShareDialog() {
        this.outerVisible3 = true
        this.dialogTitle3 = this.$t('objFill.v101.administrative.fenxwjwjj')
        this.getDepartment()
        this.getRole()
        this.getMenber()
      },
      //按照集团分享
      shareGroup() {
        this.shareMsg.shareType = 4;
      },
      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_GetCompanyDepartmentListTree', {}, res => {
          if (res.data.resultCode == 1) {

            this.departmentList = res.data.data
            return true
          } else {
            return false
          }
          this.loadRightData()
        }, 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_GetCompanyDepartMentPost', {}, res => {
          if (res.data.resultCode == 1) {
            this.roleList = res.data.data
            return true
          } else {
            return false
          }
          this.loadRightData()
        }, 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() { //员工
        let that = this
        this.apipost('WorkFlow_get_GetCompanyDepartMentEmployee', {}, res => {
          if (res.data.resultCode == 1) {
            this.menberList = res.data.data
          }
          this.loadRightData()

        }, 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() {
        let targetIds = []
        if (this.shareMsg.shareType == 1) {
          targetIds = this.ckdDepartmentListId
        } else if (this.shareMsg.shareType == 2) {
          targetIds = this.ckdRoleListId
        } else {
          targetIds = this.ckdMenberListId
        }
        this.shareMsg.targetIds = targetIds.join(",")
        if (this.shareMsg.shareType == 4) {
          let userInfo = this.getLocalStorage();
          this.shareMsg.targetIds = userInfo.RB_Group_id;
        }

        //this.shareMsg.fileIds=this.notFileList
        //this.shareMsg.folderIds=this.fileList
        this.apipost('user_cloud_update_file_share_target', this.shareMsg, res => {
          if (res.data.resultCode == 1) {
            this.outerVisible3 = false
            this.$message.success(res.data.message)
            this.getList()
          } else {
            this.$message.error(res.data.message)
          }
        }, err => {})
      },

      updateFiles(obj) {
        this.outerVisible = true;
        this.dialogTitle = this.$t('objFill.v101.administrative.xiugaiwjj')
        this.addFileMsg.FolderName = obj.FolderName;
        this.addFileMsg.FolderId = obj.FolderId;
      },
      updateOneFile(obj) {
        this.outerVisible1 = true;
        this.dialogTitle1 = this.$t('objFill.v101.administrative.xiugaiwj')
        let index = obj.FolderName.lastIndexOf('.')
        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_mye_share', this.msg, res => {
          if (res.data.resultCode == 1) {
            res.data.data.pageData.forEach(item => {
              if (item.shareFileType == 1) {
                item.icons = this.loadFileICON('')
              }
              if (item.shareFileType == 2) {
                if (item.fileName && item.fileName != '') {
                  let fileType = item.fileName.substring(item.fileName.lastIndexOf('.') + 1, item.fileName
                    .length).toLowerCase()
                  item.icons = this.loadFileICON(fileType)
                }

              }
            })

            this.list = res.data.data.pageData.map(x => {
              x['isOpen'] = false
              return x
            })
            this.NavigationList = res.data.data.Navigation
          }
        }, err => {})
      },
      getNextLevel(obj) {
        this.nextMsg.ParentId = obj.FileId
        this.getNextLevelList()
        this.NavList.push({
          name: obj.fileName,
          id: obj.FileId
        })
        this.isChildFiles = true
      },
      getNextLevelTree(obj) {
        this.nextMsg.ParentId = obj.Id
        this.getNextLevelList()
        this.NavList.push({
          name: obj.FolderName,
          id: obj.Id
        })
        this.isChildFiles = true
      },
      getNavTree(obj, index) {
        this.nextMsg.ParentId = obj.id
        this.getNextLevelList()
        this.NavList = this.NavList.slice(0, index + 1)
      },
      resGetList() {

        this.isChildFiles = false;
        this.NavList = []
        this.getlist()
      },
      getNextLevelList() {
        this.apipost('user_cloud_GetFolderList', this.nextMsg, res => {
          if (res.data.resultCode == 1) {
            this.nextList = res.data.data.data
            this.nextList.forEach(item => {
              if (item.DataType == 0) {
                item.icons = this.loadFileICON('')
              }

              if (item.DataType == 2) {
                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 = ''
      },
    },
    mounted() {
      let userInfo = this.getLocalStorage();
      this.getList()
    },
    created() {
      this.createCode()
    }

  }

</script>

<style>
  .myDocumentShareDiv {
    max-height: 400px;
    overflow: auto;
  }

  .myDocumentShareDiv::-webkit-scrollbar,
  .myDocumentShareTree::-webkit-scrollbar,
  .myDocumentShareObject::-webkit-scrollbar {
    /*滚动条整体样式*/
    width: 4px;
    /*高宽分别对应横竖滚动条的尺寸*/
    height: 1px;
  }

  .myDocumentShareDiv::-webkit-scrollbar-thumb,
  .myDocumentShareTree::-webkit-scrollbar-thumb,
  .myDocumentShareObject::-webkit-scrollbar-thumb {
    /*滚动条里面小方块*/
    border-radius: 4px;
    -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
    background: #c9c9c9;
  }

  .myDocumentShareDiv::-webkit-scrollbar-track,
  .myDocumentShareTree::-webkit-scrollbar-track,
  .myDocumentShareObject::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    background: #EDEDED;
  }

  .myDocumentShareTree {
    float: left;
    padding: 10px;
    width: 400px;
    max-height: 400px;
    overflow: auto;
    border-right: 1px solid #f9f9f9;
  }

  .myDocumentShareObject {
    padding: 10px;
    width: 380px;
    max-height: 400px;
    overflow: auto;
    float: left;
  }

  .myDocumentShareObject li {
    height: 24px;
    line-height: 24px;
    width: 100%;
  }

  .myDocumentShareObject li:hover {
    background: #f9f9f9;
  }

  .myDocumentShareObject li i {
    float: right;
    cursor: pointer;
    margin: 5px 0;
  }

  .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>
