kara-module-file-list/src/fileAvatar.js

kara

/**
 * 文件头像组件
 */
import React from 'react';
import style from './fileAvatar.scss';

const FileAvatar = (props) => {
  const {fileType, thumb480} = props.file;
  let isImage = false;
  let avatarClass = '';
  const imageType = ['png', 'jpe', 'jpeg', 'jpg', 'bmp', 'gif'];
  const wordType = ['doc', 'docx'];
  const excelType = ['xls', 'xlsx'];
  const pptType = ['ppt', 'pptx'];
  const pdfType = ['pdf'];
  const audioType = ['mp3'];
  const videoType = ['mp4', 'flv', 'wmv', 'avi', 'rmvb'];
  const compressType = ['zip', 'tar', 'rar'];
  const textType = ['txt'];
  if (imageType.includes(fileType)) {
    isImage = true;
    avatarClass = `kmfl-iconfont kmfl-icon-image ${style.image}`;
  } else if (wordType.includes(fileType)) {
    avatarClass = `kmfl-iconfont kmfl-icon-word ${style.word}`;
  } else if (excelType.includes(fileType)) {
    avatarClass = `kmfl-iconfont kmfl-icon-excel ${style.excel}`;
  } else if (pptType.includes(fileType)) {
    avatarClass = `kmfl-iconfont kmfl-icon-ppt ${style.ppt}`;
  } else if (pdfType.includes(fileType)) {
    avatarClass = `kmfl-iconfont kmfl-icon-pdf ${style.pdf}`;
  } else if (audioType.includes(fileType)) {
    avatarClass = `kmfl-iconfont kmfl-icon-Audio ${style.audio}`;
  } else if (videoType.includes(fileType)) {
    avatarClass = `kmfl-iconfont kmfl-icon-video ${style.video}`;
  } else if (compressType.includes(fileType)) {
    avatarClass = `kmfl-iconfont kmfl-icon-zipfile ${style.zip}`;
  } else if (textType.includes(fileType)) {
    avatarClass = `kmfl-iconfont kmfl-icon-txt ${style.txt}`;
  } else {
    avatarClass = `kmfl-iconfont kmfl-icon-other ${style.other}`;
  }
  return (
      isImage ?
          <img src={thumb480} alt="" onClick={()=>{props.file.onImgView(props.file.id)}}/>
          :
          <i className={avatarClass}/>
  );
};

export default FileAvatar;