fix: 图片样式优化

src/core/Account/components/TablePack/components/FileView/index.js

 import React, { useEffect, useState } from 'react'
 import styles from './index.less'
 import { Button, Upload, message } from 'antd'
-import { accepts,getFileType } from '../../../../../../constant'
+import { accepts, getFileType } from '../../../../../../constant'
 import { uploadFileUrl, downloadFileUrl, downloadFile } from '../../../../../../apis/process'
 import {
   SnippetsOutlined,
@@ -42,9 +42,16 @@ const FileView = (props) => {
       <div className={styles.fileView}>
         <Viewer>
           {
-            fileList.map(v => {
+            fileList.map((v, i) => {
               return (
-                <img className={styles.img} src={`${window.origin}/PandaWorkFlow/WorkFlow/AccountManage/DownloadFiles?filePath=${v}`}></img>
+                <span className={styles.imgSpan} style={{ display: i == 0 ? 'inline-block' : 'none' }}>
+                  {fileList.length !== 1 ? <span className={styles.imgSub}>{fileList.length}</span> : null}
+                  <img
+                    className={styles.img}
+                    src={`${window.origin}/PandaWorkFlow/WorkFlow/AccountManage/DownloadFiles?filePath=${v}`}
+                  >
+                  </img>
+                </span>
               )
             })
           }
@@ -89,26 +96,26 @@ const FileView = (props) => {
   useEffect(() => {
     let list = []
     fileList.forEach((item, index) => {
-    if (item) { // @Tips: 直接过滤掉名字中有异常字符的文件
-      let uid = index + '_' + Math.random()
-      let _obj = {
-        uid: uid,
-        value: item,
-        name: item.split('\\').reverse()[0],
-        type: fileType === '图片' ? 'image/jpeg' : 'file',
-        status: 'done',
-        url: `${downloadFileUrl}?filePath=${item}${site ? `&_site=${site}` : ''}`,
-        sourcePath: item.url,
-        originFileObj: { "uid": uid },
-        "response": { "code": 0, "msg": "Ok", "data": item, "stackTrace": null },
-        "xhr": {},
-      };
-      // if (schema.renderTo === 'Image') _obj.thumbUrl = `${downloadFileUrl}?filePath=${item}${site ? `&_site=${site}` : ''}`;
-      list.push(_obj)
-    }
-  })
-  setShowList(JSON.stringify(list))
-  },[value])
+      if (item) { // @Tips: 直接过滤掉名字中有异常字符的文件
+        let uid = index + '_' + Math.random()
+        let _obj = {
+          uid: uid,
+          value: item,
+          name: item.split('\\').reverse()[0],
+          type: fileType === '图片' ? 'image/jpeg' : 'file',
+          status: 'done',
+          url: `${downloadFileUrl}?filePath=${item}${site ? `&_site=${site}` : ''}`,
+          sourcePath: item.url,
+          originFileObj: { "uid": uid },
+          "response": { "code": 0, "msg": "Ok", "data": item, "stackTrace": null },
+          "xhr": {},
+        };
+        // if (schema.renderTo === 'Image') _obj.thumbUrl = `${downloadFileUrl}?filePath=${item}${site ? `&_site=${site}` : ''}`;
+        list.push(_obj)
+      }
+    })
+    setShowList(JSON.stringify(list))
+  }, [value])
 
   return (
     <div className={styles.fileView}>

src/core/Account/components/TablePack/components/FileView/index.less

@@ -3,14 +3,30 @@
   display: flex;
   justify-content: center;
   align-items: center;
-  .img {
-    width: 65px;
-    margin-right: 5px;
+  .imgSpan {
+    position: relative;
     transition: all 0.2s ease-in;
     &:hover {
       cursor: pointer;
       transform: scale(1.2);
     }
+    .img {
+      width: 65px;
+    }
+    .imgSub {
+      position: absolute;
+      z-index: 99;
+      top: 0;
+      right: 0;
+      background: red;
+      color: white;
+      width: 14px;
+      height: 14px;
+      text-align: center;
+      line-height: 14px;
+      font-size: 12px;
+      border-radius: 50%;
+    }
   }
   .iconImg {
     width: 45px;