<!-- 文件列表组件 -->
<template>
  <div>
    <ul :class="fileListFlag==='1'?'st-filelist-ul fileList-padding':'st-filelist-ul'" style="padding-bottom: 0;"
        v-if="fileListData  && fileListData.length>0">
      <li v-for="(item, indexs) in fileListData" :key="indexs">
        <template
          v-if="typeList.indexOf(item.annex_type)>= 0">
          <div class="st-filelist-text st-ellipsis">
            <a @click="showPDF(item[path_name], item[file_name])">{{ item[file_name] }}</a>
          </div>
        </template>
        <template v-else>
          <div class="st-filelist-text st-ellipsis">
            <a target="_blank" :href="$store.state.fileBaseUrl + item[path_name]">{{ item[file_name] }}</a>
          </div>
        </template>
        <template v-if="item.is_image === '1'">
          <div class="st-filelist-icon-img" @click="showImg(item[path_name])">
            <img :src="$store.state.imgBaseUrl + item[path_name]" alt="暂无" class="ivu-table-ellipsis"
                 style="max-height: 100%; max-width: 100%;">
          </div>
          <a v-if="isDownFile" class="st-icons st-icons-download st-filelist-icon-download" @click="downFile(item[path_name],item[file_name])"></a>
        </template>
        <template
          v-else-if="typeList.indexOf(item.annex_type) >= 0 && !isDownFile">
          <span class="st-icons st-icons-file st-filelist-icon-file" @click="showPDF(item[path_name], item[file_name])"></span>
          <a class="st-icons st-icons-download st-filelist-icon-download" @click="downFile(item[path_name],item[file_name])"></a>
        </template>
        <template v-else>
          <span class="st-icons st-icons-file st-filelist-icon-file"></span>
          <a class="st-icons st-icons-download st-filelist-icon-download" @click="downFile(item[path_name],item[file_name])"></a>
        </template>
      </li>
    </ul>
    <!-- 显示图片Modal -->
    <el-dialog visible.sync="imgModal" width="800" :show-close="false">
      <div slot="header" style="display:none;"></div>
      <div style="padding: 12px; text-align: center;">
        <img v-if="imgModalObj.path" :src="$store.state.imgBaseUrl + imgModalObj.path" :title="imgModalObj.name"
             style="max-width: 100%;">
      </div>
      <div slot="footer" style="display:none;"></div>
    </el-dialog>
    <div id="hiddenDivId001" class="oa-fileList-hiddendiv"></div>
    <a style="display: none;" id="downFile"><span id="downdown">下载</span></a>
  </div>
</template>
<script>
// isDownFile: 控制是否显示下载按钮
import {ctx} from '@/config/config.js';
export default {
  // isDown 判断是否点击了下载
  props: ['fileListData', 'fileName', 'pathName', 'fileListFlag', 'isDownFile', 'isDown'],
  data () {
    return {
      path_name: this.pathName ? this.pathName : 'save_path',
      file_name: this.fileName ? this.fileName : 'annex_name',
      typeList: '.doc,.xls,.ppt,.docx,.xlsx,.pptx,.pdf',
      imgModal: false,
      imgModalObj: {
        path: '',
        name: ''
      }
    }
  },

  computed: {
    isDownStatus: function () {
      return this.isDown;
    }
  },

  methods: {
    showImg (path, name) {
      this.imgModalObj.path = path;
      this.imgModalObj.name = name;
      this.imgModal = true;
    },
    downFile (data, data2) {
      let _this = this;
      $('#downFile').attr('href', _this.$store.state.fileDownloadUrl + '?fid=' + data + '&oglName=' + data2);
      console.log(_this.isDownStatus);
      if (_this.isDownStatus) {
        _this.$emit('downloadFile');
        _this.isDownStatus = false;
      }
      $('#downdown').click();
    },
    showPDF (data, fn) {
      let sFileName = '&fn=';
      if (fn && fn.length > 0) {
        sFileName += encodeURIComponent(fn);
      }
      let _this = this;
      if (!(data.indexOf('.pdf') > 0)) {
        $('#hiddenDivId001').show();
        _this.axios.post('/FileInfoService/toPdfWeb',
          [
            {
              'save_path': data
            }
          ]
        ).then(function (response) {
          // 获得数据
          if (response) {
            window.open(ctx + '/static/lib/pdf/web/viewer.html?file=' + window.btoa(window.encodeURIComponent(response.data.msgInfo)) + sFileName);
          }
          $('#hiddenDivId001').hide();
        }).catch(function (response) {
          $('#hiddenDivId001').hide();
        });
      } else {
        window.open(ctx + '/static/lib/pdf/web/viewer.html?file=' + window.btoa(window.encodeURIComponent(_this.$store.state.imgBaseUrl + data)) + sFileName);
      }
    }
  }
}
</script>
<style scoped>
  .fileList-padding {
    padding: 20px 0 0 0;
    overflow: hidden;
  }

  .oa-fileList-hiddendiv {
    height: 100%;
    width: 100%;
    z-index: 20001;
    position: absolute;
    top: 0px;
    right: 0px;
    display: none;
  }
</style>
