feat:资料云盘和课程管理选择文件增加默认图

src/bu-components/ChooseMembersModal.jsx

@@ -10,6 +10,8 @@ import Service from '@/common/js/service';
 // import _ from 'underscore';
 // import _ from 'underscore';
 import './ChooseMembersModal.less';
 import './ChooseMembersModal.less';
 import User from '@/common/js/user'
 import User from '@/common/js/user'
+import { XMTable } from '@/components';
+import college from '@/common/lottie/college';
 
 
 const { Search } = Input;
 const { Search } = Input;
 
 
@@ -293,7 +295,11 @@ class ChooseMembersModal extends React.Component {
                   enterButton={<span className="icon iconfont">&#xe832;</span>}
                   enterButton={<span className="icon iconfont">&#xe832;</span>}
                 />
                 />
                 <div className='container-left-body-table'>
                 <div className='container-left-body-table'>
-                  <Table 
+                  <XMTable 
+                    renderEmpty={{
+                      image: college,
+                      description: '暂无数据'
+                    }}
                     rowKey={(record) => record.userId}
                     rowKey={(record) => record.userId}
                     dataSource={allUserList}
                     dataSource={allUserList}
                     columns={this.selectedColumnsLeft()}               
                     columns={this.selectedColumnsLeft()}               
@@ -326,7 +332,11 @@ class ChooseMembersModal extends React.Component {
                 <span className={ (selectUserList.length > 0) ? 'span-right-l' : null }>清空</span>
                 <span className={ (selectUserList.length > 0) ? 'span-right-l' : null }>清空</span>
               </div>
               </div>
               <div className='container-right-body'>
               <div className='container-right-body'>
-                <Table 
+                <XMTable 
+                  renderEmpty={{
+                    image: college,
+                    description: '暂无数据'
+                  }}
                   rowKey={(record) => record.userId}
                   rowKey={(record) => record.userId}
                   dataSource={selectUserList}
                   dataSource={selectUserList}
                   columns={this.selectedColumnsRight()}
                   columns={this.selectedColumnsRight()}

src/bu-components/ChooseMembersModal.less

@@ -45,6 +45,14 @@
         .ant-empty-normal {
         .ant-empty-normal {
           margin: 100px 0 !important;
           margin: 100px 0 !important;
         }
         }
+
+        .ant-empty {
+          margin-top: 60px; 
+        }
+        .ant-empty-description {
+          color: #999;
+        }
+
         .avatar{
         .avatar{
           display: flex;
           display: flex;
           align-items: center;
           align-items: center;
@@ -119,6 +127,13 @@
         margin: 144px 0 !important;
         margin: 144px 0 !important;
       }
       }
 
 
+      .ant-empty {
+        margin-top: 60px; 
+      }
+      .ant-empty-description {
+        color: #999;
+      }
+
       .avatar{
       .avatar{
         display: flex;
         display: flex;
         align-items: center;
         align-items: center;

src/bu-components/CopyFileModal.jsx

@@ -8,7 +8,7 @@ import React from 'react';
 import { Modal, Button, Breadcrumb, Radio, message  } from 'antd';
 import { Modal, Button, Breadcrumb, Radio, message  } from 'antd';
 import Service from '@/common/js/service';
 import Service from '@/common/js/service';
 import { FILE_TYPE_ICON_MAP, DEFAULT_SIZE_UNIT } from "@/domains/resource-disk/constants";
 import { FILE_TYPE_ICON_MAP, DEFAULT_SIZE_UNIT } from "@/domains/resource-disk/constants";
-import { LottieIcon } from 'xiaomai-b-components';
+import LottieIcon from '@/components/LottieIcon';
 import _ from 'underscore';
 import _ from 'underscore';
 import { getEllipsText } from "@/domains/basic-domain/utils";
 import { getEllipsText } from "@/domains/basic-domain/utils";
 import * as lodash from 'lodash';
 import * as lodash from 'lodash';
@@ -334,6 +334,8 @@ class CopyFileModal extends React.Component {
           <div className="lottie-box">
           <div className="lottie-box">
             <LottieIcon
             <LottieIcon
               title={<span className="desc">这个文件夹是空的</span>}
               title={<span className="desc">这个文件夹是空的</span>}
+              type="college"
+              size={150}
             />
             />
           </div>
           </div>
         }
         }

src/bu-components/CopyFileModal.less

@@ -57,12 +57,17 @@
   }
   }
   
   
 }
 }
-.lottie-box {
-  border:1px solid #E8E8E8;
-  border-radius:4px;
-  height: 320px;
+.copy-body {
+  .lottie-box {
+    border:1px solid #E8E8E8;
+    border-radius:4px;
+    height: 320px;
+  }
+  
+  .lottie-icon{
+    margin: 70px 0 !important;
+    .lottie-icon__title {
+      color: #999;
+    }
+  }
 }
 }
-
-.lottie-icon{
-  margin: 100px 0;
-}
\ No newline at end of file

src/bu-components/SelectPrepareFileModal.jsx

@@ -10,7 +10,7 @@ import React from 'react';
 import { Modal, Button, Radio, Checkbox, message, Tooltip } from 'antd';
 import { Modal, Button, Radio, Checkbox, message, Tooltip } from 'antd';
 import _ from 'underscore';
 import _ from 'underscore';
 import * as lodash from 'lodash';
 import * as lodash from 'lodash';
-import { LottieIcon } from 'xiaomai-b-components';
+import LottieIcon from '@/components/LottieIcon';
 
 
 import Service from '@/common/js/service';
 import Service from '@/common/js/service';
 import { getEllipsText } from "@/domains/basic-domain/utils";
 import { getEllipsText } from "@/domains/basic-domain/utils";
@@ -647,6 +647,8 @@ class SelectPrepareFileModal extends React.Component {
           <Otherwise>
           <Otherwise>
             <LottieIcon
             <LottieIcon
               title={<span className="desc">这个文件夹是空的</span>}
               title={<span className="desc">这个文件夹是空的</span>}
+              type="college"
+              size={150}
             />
             />
           </Otherwise>
           </Otherwise>
         </Choose>
         </Choose>

src/bu-components/SelectPrepareFileModal.less

@@ -4,10 +4,10 @@
   }
   }
   
   
   .lottie-icon {
   .lottie-icon {
-    margin: 12px 0 0 0;
+    margin: 0;
     border: 1px solid #E8E8E8;
     border: 1px solid #E8E8E8;
     border-radius: 4px;
     border-radius: 4px;
-    padding: 100px 0;
+    padding: 69px 0 59px 0;
     
     
     .desc {
     .desc {
       color: #999;
       color: #999;

src/components/LottieIcon.less

+
+.lottie-icon{
+  text-align: center;
+  margin-top: 200px;
+  margin-bottom: 50px;
+  
+  &__title{
+    font-size:14px;
+    font-family:PingFangSC-Regular;
+    font-weight:400;
+    color:#999;
+    line-height:20px;
+    margin-top: 20px;
+  }
+}
\ No newline at end of file

src/components/LottieIcon.tsx

+/*
+ * @Author: wufan
+ * @Date: 2021-06-15 13:48:35
+ * @LastEditors: wufan
+ * @LastEditTime: 2021-06-15 14:24:57
+ * @Description: Description
+ */
+import React from 'react';
+import Lottie from 'react-lottie';
+
+import student from '@/common/lottie/student.json';
+import activity from '@/common/lottie/activity.json';
+import teacher from '@/common/lottie/teacher.json';
+import college from '@/common/lottie/college.json';
+
+import './LottieIcon.less';
+
+interface LottieIconInterface {
+  size: number,
+  type: string,
+  title: string,
+  isStopped: boolean,
+  isPaused: boolean,
+}
+
+const ANIMATION_DATA_MAP: {
+  [key: string]: any,
+} = {
+  student,
+  activity,
+  teacher,
+  college
+}
+
+function LottieIcon(props: LottieIconInterface) {
+  const {
+    title,
+    size = 90,
+    type = 'student',
+    isPaused = true,
+    isStopped = true,
+    
+  } = props;
+
+  const options = {
+    loop: true,
+    autoplay: true,
+    animationData: ANIMATION_DATA_MAP[type],
+    rendererSettings: {
+      preserveAspectRatio: 'xMidYMid slice'
+    }
+  }
+
+  return (
+    <div className="lottie-icon">
+      <Lottie
+        options={options}
+        width={size}
+        height={size}
+        isPaused={isPaused}
+        isStopped={isStopped}
+      />
+
+      <div className="lottie-icon__title">{title}</div>
+    </div>
+  )
+}
+
+export default LottieIcon;
\ No newline at end of file

src/modules/prepare-lesson/modal/SelectPrepareFileModal.jsx

@@ -7,23 +7,20 @@
  */
  */
 
 
 import React from 'react';
 import React from 'react';
-import { Modal, Button, Radio, Checkbox, Spin, Upload, message, Tooltip } from 'antd';
-import InfiniteScroll from 'react-infinite-scroller';
-
+import { Modal, Button, Radio, Checkbox, message, Tooltip } from 'antd';
 import User from '@/common/js/user';
 import User from '@/common/js/user';
 import { getEllipsText } from "@/core/util";
 import { getEllipsText } from "@/core/util";
-import DefaultIcon from '@/modules/common/DefaultIcon';
 import UploadProgressModal from './UploadProgressModal';
 import UploadProgressModal from './UploadProgressModal';
 import NonCompliantFileModal from './NonCompliantFileModal';
 import NonCompliantFileModal from './NonCompliantFileModal';
 import Service from '@/common/js/service';
 import Service from '@/common/js/service';
 import _ from 'underscore';
 import _ from 'underscore';
 import {
 import {
-  DEFAULT_SIZE_UNIT, FileTypeIcon, NonCompliantFileMap,
-  DISK_LIST, SupportFileType, LocalFileType,FileVerifyMap
+  DEFAULT_SIZE_UNIT, FileTypeIcon,
+   SupportFileType, FileVerifyMap
 } from "@/common/constants/academic/lessonEnum";
 } from "@/common/constants/academic/lessonEnum";
 
 
 import { getFileTypeByName } from '../components/FolderManage';
 import { getFileTypeByName } from '../components/FolderManage';
-
+import LottieIcon from '@/components/LottieIcon';
 import './SelectPrepareFileModal.less';
 import './SelectPrepareFileModal.less';
 
 
 const defaultQuery = {
 const defaultQuery = {
@@ -660,9 +657,10 @@ class SelectPrepareFileModal extends React.Component {
               }
               }
             </div>
             </div>
           </div> :
           </div> :
-          <DefaultIcon
-            type='student'
+            <LottieIcon
             title={<span className="desc">这个文件夹是空的</span>}
             title={<span className="desc">这个文件夹是空的</span>}
+            type="college"
+            size={150}
           />
           />
         }
         }