<template>
  <div v-if="fileProperty != undefined" class="file-div">
    <div v-if="showImage" class="file-image-div">
      <div v-if="isPhoto" class="fa fa-file-photo-o my-icon" />
      <div v-if="isZip" class="fa fa-file-zip-o my-icon" />
      <div v-if="isWord" class="fa fa-file-word-o my-icon" />
      <div v-if="isExcel" class="fa fa-file-excel-o my-icon" />
      <div v-if="isPPT" class="fa fa-file-powerpoint-o my-icon" />
      <div v-if="isText" class="fa fa-file-text-o my-icon" />
      <div v-if="isCode" class="fa fa-file-code-o my-icon" />
      <div v-if="isAudio" class="fa fa-file-audio-o my-icon" />
      <div v-if="isVideo" class="fa fa-file-video-o my-icon" />
      <div v-if="isPdf" class="fa fa-file-pdf-o my-icon" />
      <div v-if="isOther" class="fa fa-file-o my-icon" />
      <div class="clearfix" />
    </div>
    <div class="attachment-label">{{ fileProperty.fileName }}</div>
    <div
      v-if="fileProperty && fileProperty.createDate"
      class="attachment-label"
    >
      {{ fileProperty.createDate }}
    </div>
    <div class="clearfix" />
  </div>
</template>

<script>
export default {
  props: {
    fileProperty: {
      type: Object,
      default: function(){
        return null;
      },
    },
    showImage: {
      type: Boolean,
      default: null,
    },
  },

  data: function () {
    return {};
  },

  computed: {
    /**
     * 是否是图片
     * @return {Boolean} [description]
     */
    isPhoto: function () {
      var fileName = this.fileProperty.fileName;
      if (
        fileName.endsWith('.jpg') || //图片
        fileName.endsWith('.jpeg') ||
        fileName.endsWith('.bmp') ||
        fileName.endsWith('.gif') ||
        fileName.endsWith('.png')
      ) {
        return true;
      } else {
        return false;
      }
    },

    /**
     * 是否是压缩文件
     * @return {Boolean} [description]
     */
    isZip: function () {
      var fileName = this.fileProperty.fileName;
      if (
        fileName.endsWith('.rar') || //压缩包
        fileName.endsWith('.zip') ||
        fileName.endsWith('.arj') ||
        fileName.endsWith('.z') ||
        fileName.endsWith('.iso') ||
        fileName.endsWith('.jar') ||
        fileName.endsWith('.uue') ||
        fileName.endsWith('.gz') ||
        fileName.endsWith('.tar') ||
        fileName.endsWith('.ace') ||
        fileName.endsWith('.cab') ||
        fileName.endsWith('.lzh')
      ) {
        return true;
      } else {
        return false;
      }
    },

    /**
     * 是否是文档
     * @return {Boolean} [description]
     */
    isWord: function () {
      var fileName = this.fileProperty.fileName;
      if (
        fileName.endsWith('.doc') || //word文件
        fileName.endsWith('.docx') ||
        fileName.endsWith('.docm') ||
        fileName.endsWith('.dotx') ||
        fileName.endsWith('.dotm')
      ) {
        return true;
      } else {
        return false;
      }
    },

    /**
     * 是否是Excel
     * @return {Boolean} [description]
     */
    isExcel: function () {
      var fileName = this.fileProperty.fileName;
      if (
        fileName.endsWith('.xls') || //excel文件
        fileName.endsWith('.xlsx') ||
        fileName.endsWith('.xlsm') ||
        fileName.endsWith('.xltx') ||
        fileName.endsWith('.xltm') ||
        fileName.endsWith('.xlsb') ||
        fileName.endsWith('.xlam')
      ) {
        return true;
      } else {
        return false;
      }
    },

    /**
     * 是否是PPT
     * @return {Boolean} [description]
     */
    isPPT: function () {
      var fileName = this.fileProperty.fileName;
      if (
        fileName.endsWith('.ppt') || //ppt文件
        fileName.endsWith('.pptx') ||
        fileName.endsWith('.pptm') ||
        fileName.endsWith('.ppsx') ||
        fileName.endsWith('.ppsm') ||
        fileName.endsWith('.potx') ||
        fileName.endsWith('.potm') ||
        fileName.endsWith('.ppam')
      ) {
        return true;
      } else {
        return false;
      }
    },

    /**
     * 是否是TEXT文档
     * @return {Boolean} [description]
     */
    isText: function () {
      var fileName = this.fileProperty.fileName;
      if (
        fileName.endsWith('.txt') || //文本文件
        fileName.endsWith('.text')
      ) {
        return true;
      } else {
        return false;
      }
    },

    /**
     * 是否是代码
     * @return {Boolean} [description]
     */
    isCode: function () {
      var fileName = this.fileProperty.fileName;
      if (
        fileName.endsWith('.html') || //常用代码文件
        fileName.endsWith('.css') ||
        fileName.endsWith('.jsp') ||
        fileName.endsWith('.xml') ||
        fileName.endsWith('.js') ||
        fileName.endsWith('.vue').default ||
        fileName.endsWith('.java') ||
        fileName.endsWith('.class')
      ) {
        return true;
      } else {
        return false;
      }
    },

    /**
     * 是否是音频
     * @return {Boolean} [description]
     */
    isAudio: function () {
      var fileName = this.fileProperty.fileName;
      if (
        fileName.endsWith('.mp3') || //常用音乐文件
        fileName.endsWith('.wma') ||
        fileName.endsWith('.midi') ||
        fileName.endsWith('.cda') ||
        fileName.endsWith('.wav') ||
        fileName.endsWith('.mov')
      ) {
        return true;
      } else {
        return false;
      }
    },

    /**
     * 是否是Video
     * @return {Boolean} [description]
     */
    isVideo: function () {
      var fileName = this.fileProperty.fileName;
      if (
        fileName.endsWith('.avi') || //常用视频文件
        fileName.endsWith('.rmvb') ||
        fileName.endsWith('.rm') ||
        fileName.endsWith('.asf') ||
        fileName.endsWith('.divx') ||
        fileName.endsWith('.mpg') ||
        fileName.endsWith('.mpeg') ||
        fileName.endsWith('.mpe') ||
        fileName.endsWith('.wmv') ||
        fileName.endsWith('.mp4') ||
        fileName.endsWith('.mkv') ||
        fileName.endsWith('.vob')
      ) {
        return true;
      } else {
        return false;
      }
    },

    /**
     * 是否是PDF
     * @return {Boolean} [description]
     */
    isPdf: function () {
      return this.fileProperty.fileName.endsWith('.pdf');
    },

    /**
     * 是否是其他文档
     * @return {Boolean} [description]
     */
    isOther: function () {
      var fileName = this.fileProperty.fileName;
      if (
        fileName.endsWith('.jpg') || //其他情况
        fileName.endsWith('.jpeg') ||
        fileName.endsWith('.bmp') ||
        fileName.endsWith('.gif') ||
        fileName.endsWith('.png') ||
        fileName.endsWith('.rar') ||
        fileName.endsWith('.zip') ||
        fileName.endsWith('.arj') ||
        fileName.endsWith('.z') ||
        fileName.endsWith('.iso') ||
        fileName.endsWith('.jar') ||
        fileName.endsWith('.uue') ||
        fileName.endsWith('.gz') ||
        fileName.endsWith('.tar') ||
        fileName.endsWith('.ace') ||
        fileName.endsWith('.cab') ||
        fileName.endsWith('.lzh') ||
        fileName.endsWith('.doc') ||
        fileName.endsWith('.docx') ||
        fileName.endsWith('.docm') ||
        fileName.endsWith('.dotx') ||
        fileName.endsWith('.dotm') ||
        fileName.endsWith('.xls') ||
        fileName.endsWith('.xlsx') ||
        fileName.endsWith('.xlsm') ||
        fileName.endsWith('.xltx') ||
        fileName.endsWith('.xltm') ||
        fileName.endsWith('.xlsb') ||
        fileName.endsWith('.xlam') ||
        fileName.endsWith('.ppt') ||
        fileName.endsWith('.pptx') ||
        fileName.endsWith('.pptm') ||
        fileName.endsWith('.ppsx') ||
        fileName.endsWith('.ppsm') ||
        fileName.endsWith('.potx') ||
        fileName.endsWith('.potm') ||
        fileName.endsWith('.ppam') ||
        fileName.endsWith('.txt') ||
        fileName.endsWith('.text') ||
        fileName.endsWith('.html') ||
        fileName.endsWith('.css') ||
        fileName.endsWith('.jsp') ||
        fileName.endsWith('.xml') ||
        fileName.endsWith('.js') ||
        fileName.endsWith('.vue').default ||
        fileName.endsWith('.java') ||
        fileName.endsWith('.class') ||
        fileName.endsWith('.mp3') ||
        fileName.endsWith('.wma') ||
        fileName.endsWith('.midi') ||
        fileName.endsWith('.cda') ||
        fileName.endsWith('.wav') ||
        fileName.endsWith('.mov') ||
        fileName.endsWith('.avi') ||
        fileName.endsWith('.rmvb') ||
        fileName.endsWith('.rm') ||
        fileName.endsWith('.asf') ||
        fileName.endsWith('.divx') ||
        fileName.endsWith('.mpg') ||
        fileName.endsWith('.mpeg') ||
        fileName.endsWith('.mpe') ||
        fileName.endsWith('.wmv') ||
        fileName.endsWith('.mp4') ||
        fileName.endsWith('.mkv') ||
        fileName.endsWith('.vob') ||
        fileName.endsWith('.pdf')
      ) {
        return false;
      } else {
        return true;
      }
    },
  },
};
</script>

<style>
.file-div {
  width: 150px;
  text-align: center;
  margin-bottom: 0px;
  margin: 0px auto;
}

.file-image-div {
  width: 150px;
  height: 120px;
  text-align: center;
}

.my-icon {
  font-size: 100px !important;
  padding: 10px;
}

.attachment-label {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: small;
  max-width: 150px;
}
</style>