Skip to content

X
xiaomai-cloud-class-web
Commit 1ec27d2e by chenshu
Options

fix:merge

parents e64da733 c34dccef
Showing with 252 additions and 181 deletions
src/components/XMTable.jsx
...@@ -6,8 +6,7 @@ function XMTable(props) { ...@@ -6,8 +6,7 @@ function XMTable(props) {
const [data, setData] = useState({}); const [data, setData] = useState({});
useEffect(() => { useEffect(() => {
setEmpty(props.renderEmpty) setEmpty(props.renderEmpty || {})
delete props.renderEmpty;
setData(props); setData(props);
}, [props]); }, [props]);
...@@ -25,7 +24,7 @@ function XMTable(props) { ...@@ -25,7 +24,7 @@ function XMTable(props) {
}; };
return ( return (
<ConfigProvider renderEmpty={customizeRenderEmpty}> <ConfigProvider className="xm-table-component" renderEmpty={customizeRenderEmpty}>
<Table <Table
{...data} {...data}
/> />
......
src/components/XMTable.less 0 → 100644
.xm-table-component {
}
\ No newline at end of file
src/components/index.js
/* /*
* @Author: wufan * @Author: wufan
* @Date: 2020-11-26 14:48:57 * @Date: 2020-11-26 14:48:57
* @Last Modified by: mikey.zhaopeng * @Last Modified by: chenshu
* @Last Modified time: 2020-11-26 14:52:02 * @Last Modified time: 2021-06-03 15:21:09
*/ */
import SearchBar from './SearchBar.tsx'; import SearchBar from './SearchBar.tsx';
...@@ -10,6 +10,7 @@ import PageControl from './PageControl.tsx'; ...@@ -10,6 +10,7 @@ import PageControl from './PageControl.tsx';
import CheckBox from './CheckBox.tsx'; import CheckBox from './CheckBox.tsx';
import CropperModal from './CropperModal.tsx'; import CropperModal from './CropperModal.tsx';
import ImgCutModalNew from './ImgCutModalNew'; import ImgCutModalNew from './ImgCutModalNew';
import XMTable from './XMTable';
export { export {
...@@ -17,5 +18,6 @@ export { ...@@ -17,5 +18,6 @@ export {
PageControl, PageControl,
CheckBox, CheckBox,
CropperModal, CropperModal,
ImgCutModalNew ImgCutModalNew,
XMTable,
} }
\ No newline at end of file
src/modules/common/DefaultIcon.jsx
/* /*
* @Author: zhujian * @Author: zhujian
* @Date: 2018-10-10 20:49:11 * @Date: 2018-10-10 20:49:11
* @Last Modified by: zhujiapeng * @Last Modified by: chenshu
* @Last Modified time: 2020-11-16 17:02:11 * @Last Modified time: 2021-06-03 16:42:22
*/ */
// import './s.less' // import './s.less'
...@@ -42,6 +42,7 @@ class DefaultIcon extends React.Component { ...@@ -42,6 +42,7 @@ class DefaultIcon extends React.Component {
preserveAspectRatio: 'xMidYMid slice' preserveAspectRatio: 'xMidYMid slice'
} }
} }
console.log(defaultOptions, this.props, 777777)
return ( return (
<div style={this.props.style} className="DefaultIcon" key="icon"> <div style={this.props.style} className="DefaultIcon" key="icon">
<Lottie <Lottie
......
src/modules/knowledge-base/components/KnowledgeBaseList.jsx
...@@ -7,17 +7,19 @@ ...@@ -7,17 +7,19 @@
* @Copyright: © 2020 杭州杰竞科技有限公司 版权所有 * @Copyright: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
import React from "react" import React from "react";
import { Table, Modal, message, Tooltip, Switch, Dropdown, Button } from "antd" import { Modal, message, Tooltip, Switch, Dropdown, Button } from "antd";
import { Route, withRouter } from "react-router-dom" import { Route, withRouter } from "react-router-dom";
import { PageControl } from "@/components" import Lottie from 'react-lottie';
import { LIVE_SHARE_MAP } from "@/common/constants/academic/cloudClass" import { PageControl, XMTable } from "@/components";
import { appId, shareUrl, LIVE_SHARE } from "@/domains/course-domain/constants" import { LIVE_SHARE_MAP } from "@/common/constants/academic/cloudClass";
import ScanFileModal from "../../resource-disk/modal/ScanFileModal" import { appId, shareUrl, LIVE_SHARE } from "@/domains/course-domain/constants";
import WatchData from "./WatchData" import ScanFileModal from "../../resource-disk/modal/ScanFileModal";
import KnowledgeAPI from "@/data-source/knowledge/request-api" import WatchData from "./WatchData";
import ENUM from "../ENUM.js" import KnowledgeAPI from "@/data-source/knowledge/request-api";
import "./KnowledgeBaseList.less" import ENUM from "../ENUM.js";
import * as nodata from '../../lottie/nodata/data.json';
import "./KnowledgeBaseList.less";
const DEFAULT_SIZE_UNIT = 1000 * 1000 // 将B转换成M const DEFAULT_SIZE_UNIT = 1000 * 1000 // 将B转换成M
const { confirm } = Modal const { confirm } = Modal
...@@ -492,9 +494,17 @@ class KnowledgeBaseList extends React.Component { ...@@ -492,9 +494,17 @@ class KnowledgeBaseList extends React.Component {
preserveSelectedRowKeys: true, preserveSelectedRowKeys: true,
onChange: onSelectChange, onChange: onSelectChange,
} }
const defaultOptions = {
loop: true,
autoplay: true,
animationData: nodata,
rendererSettings: {
preserveAspectRatio: 'xMidYMid slice'
}
}
return ( return (
<div className='knowledge-base-list'> <div className="knowledge-base-list">
<Table <XMTable
rowKey={(record) => record.id} rowKey={(record) => record.id}
rowSelection={rowSelection} rowSelection={rowSelection}
size="middle" size="middle"
...@@ -503,7 +513,19 @@ class KnowledgeBaseList extends React.Component { ...@@ -503,7 +513,19 @@ class KnowledgeBaseList extends React.Component {
pagination={false} pagination={false}
scroll={{ x: 900 }} scroll={{ x: 900 }}
bordered bordered
className='knowledge-list-table' className="knowledge-list-table"
renderEmpty={{
image: <div style={{ marginTop: 24 }}>
<Lottie
options={defaultOptions}
height={150}
width={150}
isStopped={false}
isPaused={false}
/>
</div>,
description: <span style={{ display: 'block', paddingBottom: 24 }}>暂无数据</span>
}}
/> />
<div className='box-footer'> <div className='box-footer'>
......
src/modules/knowledge-base/components/KnowledgeBaseOpt.less
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
justify-content: space-between; justify-content: space-between;
.tip{ .tip{
font-size:14px; font-size:14px;
color:#FF9D14; color:#2966FF;
margin-right:8px; margin-right:8px;
} }
.text{ .text{
......
src/modules/knowledge-base/index.jsx
...@@ -77,9 +77,9 @@ export default class KnowledgeBase extends React.Component { ...@@ -77,9 +77,9 @@ export default class KnowledgeBase extends React.Component {
onSelectChange = (selectedRowKeys) => { onSelectChange = (selectedRowKeys) => {
if (selectedRowKeys.length > 50) { if (selectedRowKeys.length > 50) {
message.warning('最多只能选择50个题目'); message.warning('最多只能选择50个题目');
return null;
} }
this.setState({ selectedRowKeys }); const list = _.filter(selectedRowKeys, (item, index) => index < 50);
this.setState({ selectedRowKeys: list });
}; };
render() { render() {
......
src/modules/lottie/nodata/demo/data.html 0 → 100644
This source diff could not be displayed because it is too large. You can view the blob instead.
src/modules/lottie/paperEmpty/demo/data.html 0 → 100644
This source diff could not be displayed because it is too large. You can view the blob instead.
src/modules/teach-tool/components/CourseCategorySiderTree.less
...@@ -44,7 +44,7 @@ ...@@ -44,7 +44,7 @@
white-space: nowrap; white-space: nowrap;
} }
.ant-tree-node-content-wrapper.ant-tree-node-selected { .ant-tree-node-content-wrapper.ant-tree-node-selected {
color: #666666; color: #2966FF;
} }
} }
.ant-tree-treenode-selected:hover::before, .ant-tree-treenode-selected:hover::before,
......
src/modules/teach-tool/examination-manager/AddExam.tsx
...@@ -362,9 +362,9 @@ function AddExam(props: any) { ...@@ -362,9 +362,9 @@ function AddExam(props: any) {
style={{ width: 320 }} style={{ width: 320 }}
showTime={{ defaultValue: [moment().add(5, 'minutes'), moment().add(5, 'minutes')] }} showTime={{ defaultValue: [moment().add(5, 'minutes'), moment().add(5, 'minutes')] }}
ranges={{ ranges={{
'近七天': [moment(), moment().add(6, 'day').endOf('day')], '近七天': [moment().add(5, 'minute'), moment().add(6, 'day').endOf('day')],
'近1个月': [moment(), moment().add(1, 'month').endOf('day')], '近1个月': [moment().add(5, 'minute'), moment().add(1, 'month').endOf('day')],
'近3个月': [moment(), moment().add(3, 'month').endOf('day')], '近3个月': [moment().add(5, 'minute'), moment().add(3, 'month').endOf('day')],
}} }}
disabledDate={disabledDate} disabledDate={disabledDate}
value={[ value={[
......
src/modules/teach-tool/examination-manager/Index.tsx
import React, { useState, useRef, useEffect, useContext } from 'react' import React, { useState, useRef, useEffect, useContext } from 'react'
import { Input, Select, DatePicker, Tooltip, Button, Table, Dropdown, Menu, Modal } from 'antd'; import { Input, Select, DatePicker, Tooltip, Button, Table, Dropdown, Menu, Modal } from 'antd';
import Lottie from 'react-lottie';
import TeacherSelect from '@/modules/common/TeacherSelect'; import TeacherSelect from '@/modules/common/TeacherSelect';
import { Route, withRouter } from 'react-router-dom'; import { Route, withRouter } from 'react-router-dom';
import Service from "@/common/js/service"; import Service from "@/common/js/service";
import moment from 'moment'; import moment from 'moment';
import { PageControl } from "@/components"; import { PageControl, XMTable } from "@/components";
import AddExam from './AddExam'; import AddExam from './AddExam';
import User from "@/common/js/user"; import User from "@/common/js/user";
import { XMContext } from "@/store/context"; import { XMContext } from "@/store/context";
import ExamShareModal from './ExamShareModal' import ExamShareModal from './ExamShareModal'
import DataAnalysic from './DataAnalysic' import DataAnalysic from './DataAnalysic'
import PreviewModal from './PreviewModal' import PreviewModal from './PreviewModal'
import * as nodata from '../../lottie/nodata/data.json';
import './index.less' import './index.less'
const { RangePicker } = DatePicker; const { RangePicker } = DatePicker;
const { Search } = Input; const { Search } = Input;
...@@ -308,6 +310,14 @@ function ExaminationManager(props: any) { ...@@ -308,6 +310,14 @@ function ExaminationManager(props: any) {
setQuery(_query) setQuery(_query)
} }
const defaultOptions = {
loop: true,
autoplay: true,
animationData: nodata,
rendererSettings: {
preserveAspectRatio: 'xMidYMid slice'
}
}
return <div className="page examination-manager"> return <div className="page examination-manager">
<div className="content-header">考试</div> <div className="content-header">考试</div>
<div className="box content-body"> <div className="box content-body">
...@@ -402,7 +412,7 @@ function ExaminationManager(props: any) { ...@@ -402,7 +412,7 @@ function ExaminationManager(props: any) {
<div className="content"> <div className="content">
<Table <XMTable
bordered bordered
size="small" size="small"
columns={columns} columns={columns}
...@@ -411,8 +421,20 @@ function ExaminationManager(props: any) { ...@@ -411,8 +421,20 @@ function ExaminationManager(props: any) {
onChange={onChange} onChange={onChange}
pagination={false} pagination={false}
style={{ margin: '0px 0 16px' }} style={{ margin: '0px 0 16px' }}
renderEmpty={{
image: <div style={{ marginTop: 24 }}>
<Lottie
options={defaultOptions}
height={150}
width={150}
isStopped={false}
isPaused={false}
/>
</div>,
description: <span style={{ display: 'block', paddingBottom: 24 }}>暂无数据</span>
}}
> >
</Table> </XMTable>
{total > 0 && {total > 0 &&
<PageControl <PageControl
size="small" size="small"
......
src/modules/teach-tool/paper-manage/OperatePaper.jsx
...@@ -20,7 +20,9 @@ import { ...@@ -20,7 +20,9 @@ import {
Modal, Modal,
Spin, Spin,
} from "antd"; } from "antd";
import Lottie from 'react-lottie';
import { PlusOutlined } from "@ant-design/icons"; import { PlusOutlined } from "@ant-design/icons";
import { XMTable } from "@/components";
import ShowTips from "@/components/ShowTips"; import ShowTips from "@/components/ShowTips";
import Breadcrumbs from "@/components/Breadcrumbs"; import Breadcrumbs from "@/components/Breadcrumbs";
import "./OperatePaper.less"; import "./OperatePaper.less";
...@@ -30,6 +32,7 @@ import User from "@/common/js/user"; ...@@ -30,6 +32,7 @@ import User from "@/common/js/user";
import AidToolService from "@/domains/aid-tool-domain/AidToolService"; import AidToolService from "@/domains/aid-tool-domain/AidToolService";
import Bus from "@/core/bus"; import Bus from "@/core/bus";
import { Route, withRouter } from "react-router-dom"; import { Route, withRouter } from "react-router-dom";
import * as paperEmpty from '../../lottie/paperEmpty/data.json';
import AddExam from "@/modules/teach-tool/examination-manager/AddExam"; import AddExam from "@/modules/teach-tool/examination-manager/AddExam";
const questionTypeEnum = { const questionTypeEnum = {
...@@ -148,19 +151,6 @@ class OperatePaper extends Component { ...@@ -148,19 +151,6 @@ class OperatePaper extends Component {
); );
}; };
// 自定义表格空状态
customizeRenderEmpty = () => {
return (
<Empty
image="https://image.xiaomaiketang.com/xm/emptyTable.png"
imageStyle={{
height: 100,
}}
description={"请在左上角添加题目"}
></Empty>
);
};
setFormData = (list, sorter) => { setFormData = (list, sorter) => {
const { formData } = this.state; const { formData } = this.state;
const _selectQuestionList = [...list]; const _selectQuestionList = [...list];
...@@ -719,6 +709,14 @@ class OperatePaper extends Component { ...@@ -719,6 +709,14 @@ class OperatePaper extends Component {
totalScore, totalScore,
} = formData; } = formData;
const { match } = this.props; const { match } = this.props;
const defaultOptions = {
loop: true,
autoplay: true,
animationData: paperEmpty,
rendererSettings: {
preserveAspectRatio: 'xMidYMid slice'
}
}
return ( return (
<div> <div>
<div className="page operate-paper-page"> <div className="page operate-paper-page">
...@@ -817,48 +815,41 @@ class OperatePaper extends Component { ...@@ -817,48 +815,41 @@ class OperatePaper extends Component {
</div> </div>
)} )}
<ConfigProvider renderEmpty={this.customizeRenderEmpty}> <XMTable
<Table className="table-style"
className="table-style" scroll={{ y: 350 }}
scroll={{ y: 350 }} columns={this.parseColumns()}
columns={this.parseColumns()} dataSource={selectQuestionList}
dataSource={selectQuestionList} pagination={false}
pagination={false} onChange={this.sortByQuestionType}
onChange={this.sortByQuestionType} renderEmpty={{
/> image: <div style={{ marginTop: 24 }}>
</ConfigProvider> <Lottie
</Form> options={defaultOptions}
</div> height={150}
<div className="footer"> width={150}
<Button onClick={this.handleGoBack}>取消</Button> isStopped={false}
<Button onClick={this.previewPaper}>预览</Button> isPaused={false}
<Button onClick={() => this.savePaper("saveToAddExam")}> />
保存并组织考试 </div>,
</Button> description: <span style={{ display: 'block', paddingBottom: 24 }}>请在左上角添加题目</span>
<Button type="primary" onClick={() => this.savePaper()}> }}
保存
</Button>
</div>
</Spin>
{selectQuestionModal}
{paperPreviewModal}
</div>
<Route
path={`${match.url}/exam-operate-page`}
render={() => {
return (
<AddExam
paperInfo={formData}
type={
currentOperate === "edit"
? "editPaperToAddExam"
: "newPaperToAddExam"
}
/> />
); </Form>
}} </div>
/> <div className="footer">
<Button onClick={this.handleGoBack}>取消</Button>
<Button onClick={this.previewPaper}>预览</Button>
<Button onClick={() => this.savePaper("saveToAddExam")}>
保存并组织考试
</Button>
<Button type="primary" onClick={() => this.savePaper()}>
保存
</Button>
</div>
</Spin>
{selectQuestionModal}
{paperPreviewModal}
</div> </div>
); );
......
src/modules/teach-tool/paper-manage/OperatePaper.less
.operate-paper-page { .operate-paper-page {
.box { .box {
margin-bottom: 52px !important; margin-bottom: 52px !important;
.ant-form-item {
margin-bottom: 24px !important;
}
.table-style { .table-style {
border: 1px solid #f0f0f0 !important; border: 1px solid #f0f0f0 !important;
} }
...@@ -12,7 +15,6 @@ ...@@ -12,7 +15,6 @@
margin-left: 12px; margin-left: 12px;
} }
.choose-btn { .choose-btn {
margin-top: 8px;
margin-bottom: 12px; margin-bottom: 12px;
} }
.paper-info-tip { .paper-info-tip {
...@@ -60,6 +62,12 @@ ...@@ -60,6 +62,12 @@
} }
} }
.ant-table tbody tr { .ant-table tbody tr {
&:nth-child(even) {
background: #fff;
}
&:nth-child(odd) {
background: #fafafa;
}
&:last-child { &:last-child {
td { td {
border-bottom: none!important; border-bottom: none!important;
......
src/modules/teach-tool/paper-manage/components/PaperList.jsx
...@@ -8,7 +8,6 @@ ...@@ -8,7 +8,6 @@
*/ */
import React, { Component } from "react"; import React, { Component } from "react";
import { import {
Table,
Dropdown, Dropdown,
Row, Row,
Input, Input,
...@@ -20,7 +19,8 @@ import { ...@@ -20,7 +19,8 @@ import {
ConfigProvider, ConfigProvider,
Empty, Empty,
} from "antd"; } from "antd";
import { PageControl } from "@/components"; import Lottie from 'react-lottie';
import { PageControl, XMTable } from "@/components";
import "./PaperList.less"; import "./PaperList.less";
import { Route, withRouter } from "react-router-dom"; import { Route, withRouter } from "react-router-dom";
import OperatePaper from "@/modules/teach-tool/paper-manage/OperatePaper"; import OperatePaper from "@/modules/teach-tool/paper-manage/OperatePaper";
...@@ -31,6 +31,7 @@ import Service from "@/common/js/service"; ...@@ -31,6 +31,7 @@ import Service from "@/common/js/service";
import _ from "underscore"; import _ from "underscore";
import PaperPreviewModal from "../modal/PreviewPaperModal"; import PaperPreviewModal from "../modal/PreviewPaperModal";
import MoveModal from '../../modal/MoveModal'; import MoveModal from '../../modal/MoveModal';
import * as nodata from '../../../lottie/nodata/data.json';
import Bus from "@/core/bus"; import Bus from "@/core/bus";
const { Search } = Input; const { Search } = Input;
...@@ -249,19 +250,6 @@ class PaperList extends Component { ...@@ -249,19 +250,6 @@ class PaperList extends Component {
} }
}; };
// 自定义表格空状态
customizeRenderEmpty = () => {
return (
<Empty
image="https://image.xiaomaiketang.com/xm/emptyTable.png"
imageStyle={{
height: 100,
}}
description={"还没有试卷"}
></Empty>
);
};
// 表头设置 // 表头设置
parseColumns = () => { parseColumns = () => {
const columns = [ const columns = [
...@@ -305,7 +293,7 @@ class PaperList extends Component { ...@@ -305,7 +293,7 @@ class PaperList extends Component {
}, },
}, },
{ {
title: "试卷数量", title: "题目数量",
key: "questionCnt", key: "questionCnt",
dataIndex: "questionCnt", dataIndex: "questionCnt",
width: this.props.type !== "modal-select" ? "12%" : "20%", width: this.props.type !== "modal-select" ? "12%" : "20%",
...@@ -559,6 +547,14 @@ class PaperList extends Component { ...@@ -559,6 +547,14 @@ class PaperList extends Component {
User.getUserRole() User.getUserRole()
); );
const { match } = this.props; const { match } = this.props;
const defaultOptions = {
loop: true,
autoplay: true,
animationData: nodata,
rendererSettings: {
preserveAspectRatio: 'xMidYMid slice'
}
}
return ( return (
<div className={"paper-list " + this.props.type}> <div className={"paper-list " + this.props.type}>
<div className="paper-list-filter"> <div className="paper-list-filter">
...@@ -629,32 +625,54 @@ class PaperList extends Component { ...@@ -629,32 +625,54 @@ class PaperList extends Component {
)} )}
<div className="paper-list-content"> <div className="paper-list-content">
<ConfigProvider renderEmpty={this.customizeRenderEmpty}> {this.props.type !== "modal-select" ? (
{this.props.type !== "modal-select" ? ( <XMTable
<Table rowKey={(record) => record.paperId}
rowKey={(record) => record.paperId} rowSelection={paperRowSelection}
rowSelection={paperRowSelection} dataSource={dataSource}
dataSource={dataSource} columns={this.parseColumns()}
columns={this.parseColumns()} pagination={false}
pagination={false} bordered
bordered loading={loading}
loading={loading} renderEmpty={{
/> image: <div style={{ marginTop: 24 }}>
) : ( <Lottie
<Table options={defaultOptions}
rowKey={(record) => record.paperId} height={150}
dataSource={dataSource} width={150}
size={this.props.type == "modal-select" ? "small" : "middle"} isStopped={false}
rowKey={(item) => { isPaused={false}
return item.paperId; />
}} </div>,
rowSelection={rowSelection} description: <span style={{ display: 'block', paddingBottom: 24 }}>还没有试卷</span>
columns={this.parseColumns()} }}
pagination={false} />
bordered ) : (
/> <XMTable
)} rowKey={(record) => record.paperId}
</ConfigProvider> dataSource={dataSource}
size={this.props.type == "modal-select" ? "small" : "middle"}
rowKey={(item) => {
return item.paperId;
}}
rowSelection={rowSelection}
columns={this.parseColumns()}
pagination={false}
bordered
renderEmpty={{
image: <div style={{ marginTop: 24 }}>
<Lottie
options={defaultOptions}
height={150}
width={150}
isStopped={false}
isPaused={false}
/>
</div>,
description: <span style={{ display: 'block', paddingBottom: 24 }}>暂无数据</span>
}}
/>
)}
{total > 0 && ( {total > 0 && (
<div className="box-footer"> <div className="box-footer">
......
src/modules/teach-tool/paper-manage/components/PaperList.less
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
justify-content: space-between; justify-content: space-between;
.tip{ .tip{
font-size:14px; font-size:14px;
color:#FF9D14; color:#2966FF;
margin-right:8px; margin-right:8px;
} }
.text{ .text{
...@@ -74,7 +74,7 @@ ...@@ -74,7 +74,7 @@
} }
.paper-list-content { .paper-list-content {
position: relative; position: relative;
margin-top: 16px; margin-top: 12px;
.empty-list-tip { .empty-list-tip {
color: #2966FF; color: #2966FF;
cursor: pointer; cursor: pointer;
......
src/modules/teach-tool/question-manage/components/QuestionList.jsx
...@@ -23,10 +23,11 @@ import { ...@@ -23,10 +23,11 @@ import {
Dropdown, Dropdown,
DatePicker, DatePicker,
} from "antd"; } from "antd";
import Lottie from 'react-lottie';
import _ from "underscore"; import _ from "underscore";
import { Route, withRouter } from "react-router-dom"; import { Route, withRouter } from "react-router-dom";
import { DownOutlined } from '@ant-design/icons'; import { DownOutlined } from '@ant-design/icons';
import { PageControl } from "@/components"; import { PageControl, XMTable } from "@/components";
import User from "@/common/js/user"; import User from "@/common/js/user";
import AidToolService from "@/domains/aid-tool-domain/AidToolService"; import AidToolService from "@/domains/aid-tool-domain/AidToolService";
import PreviewQuestionModal from "../modal/PreviewQuestionModal"; import PreviewQuestionModal from "../modal/PreviewQuestionModal";
...@@ -36,6 +37,7 @@ import Bus from "@/core/bus"; ...@@ -36,6 +37,7 @@ import Bus from "@/core/bus";
import moment from 'moment'; import moment from 'moment';
import Service from "@/common/js/service"; import Service from "@/common/js/service";
import MoveModal from '../../modal/MoveModal'; import MoveModal from '../../modal/MoveModal';
import * as nodata from '../../../lottie/nodata/data.json';
import "./QuestionList.less"; import "./QuestionList.less";
const { RangePicker } = DatePicker; const { RangePicker } = DatePicker;
...@@ -193,39 +195,6 @@ class QuestionList extends Component { ...@@ -193,39 +195,6 @@ class QuestionList extends Component {
}); });
}; };
// 自定义表格空状态
customizeRenderEmpty = () => {
const { categoryId } = this.state.query;
return (
<Empty
image="https://image.xiaomaiketang.com/xm/emptyTable.png"
imageStyle={{
height: 100,
}}
description={
<span>
<span>还没有题目</span>
{["CloudManager", "StoreManager"].includes(User.getUserRole()) &&
categoryId && (
<span>
，快去
<span
className="empty-list-tip"
onClick={() => {
this.handleCreateQuestion();
}}
>
新建一个
</span>
吧！
</span>
)}
</span>
}
></Empty>
);
};
// 排序 // 排序
handleChangeTable = (pagination, filters, sorter) => { handleChangeTable = (pagination, filters, sorter) => {
const { columnKey, order } = sorter; const { columnKey, order } = sorter;
...@@ -625,6 +594,14 @@ class QuestionList extends Component { ...@@ -625,6 +594,14 @@ class QuestionList extends Component {
preserveSelectedRowKeys: true, preserveSelectedRowKeys: true,
onChange: this.onSelectChange, onChange: this.onSelectChange,
}; };
const defaultOptions = {
loop: true,
autoplay: true,
animationData: nodata,
rendererSettings: {
preserveAspectRatio: 'xMidYMid slice'
}
}
return ( return (
<div className="question-list"> <div className="question-list">
<div className="question-list-filter"> <div className="question-list-filter">
...@@ -711,7 +688,7 @@ class QuestionList extends Component { ...@@ -711,7 +688,7 @@ class QuestionList extends Component {
</div> </div>
{["CloudManager", "StoreManager"].includes(User.getUserRole()) && {["CloudManager", "StoreManager"].includes(User.getUserRole()) &&
( (
<Space size={16}> <Space size={8}>
{_.isEmpty(selectedRowKeys) ? {_.isEmpty(selectedRowKeys) ?
(!!categoryId && [ (!!categoryId && [
<Button key="1" type="primary" onClick={this.handleCreateQuestion}> <Button key="1" type="primary" onClick={this.handleCreateQuestion}>
...@@ -732,14 +709,14 @@ class QuestionList extends Component { ...@@ -732,14 +709,14 @@ class QuestionList extends Component {
</div> </div>
} }
{!!categoryId ? ( {!!categoryId ? (
<Dropdown className="ml8" overlay={this.setMoreOperationOption()}> <Dropdown overlay={this.setMoreOperationOption()}>
<Button id="more_operate"> <Button id="more_operate">
更多操作 更多操作
<DownOutlined /> <DownOutlined />
</Button> </Button>
</Dropdown> </Dropdown>
) : ( ) : (
<Space size={16}> <Space size={8}>
<Button onClick={() => this.batchMove()}>批量移动</Button> <Button onClick={() => this.batchMove()}>批量移动</Button>
<Button onClick={() => this.batchDelete()}>批量删除</Button> <Button onClick={() => this.batchDelete()}>批量删除</Button>
</Space> </Space>
...@@ -747,17 +724,43 @@ class QuestionList extends Component { ...@@ -747,17 +724,43 @@ class QuestionList extends Component {
</Space> </Space>
)} )}
<div className="question-list-content"> <div className="question-list-content">
<ConfigProvider renderEmpty={this.customizeRenderEmpty}> <XMTable
<Table rowKey={(record) => record.id}
rowKey={(record) => record.id} dataSource={dataSource}
dataSource={dataSource} columns={this.parseColumns()}
columns={this.parseColumns()} pagination={false}
pagination={false} bordered
bordered onChange={this.handleChangeTable}
onChange={this.handleChangeTable} rowSelection={rowSelection}
rowSelection={rowSelection} renderEmpty={{
/> image: <div style={{ marginTop: 24 }}>
</ConfigProvider> <Lottie
options={defaultOptions}
height={150}
width={150}
isStopped={false}
isPaused={false}
/>
</div>,
description: <span style={{ display: 'block', paddingBottom: 24 }}><span>还没有题目</span>
{["CloudManager", "StoreManager"].includes(User.getUserRole()) &&
categoryId && (
<span>
，快去
<span
className="empty-list-tip"
onClick={() => {
this.handleCreateQuestion();
}}
>
新建一个
</span>
吧！
</span>
)}
</span>
}}
/>
{total > 0 && ( {total > 0 && (
<div className="box-footer"> <div className="box-footer">
<PageControl <PageControl
......
src/modules/teach-tool/question-manage/components/QuestionList.less
...@@ -51,7 +51,7 @@ ...@@ -51,7 +51,7 @@
justify-content: space-between; justify-content: space-between;
.tip { .tip {
font-size: 14px; font-size: 14px;
color: #FF9D14; color: #2966FF;
margin-right: 8px; margin-right: 8px;
} }
.text { .text {
...@@ -70,7 +70,7 @@ ...@@ -70,7 +70,7 @@
} }
.question-list-content { .question-list-content {
position: relative; position: relative;
margin-top: 16px; margin-top: 12px;
.empty-list-tip { .empty-list-tip {
color: #2966FF; color: #2966FF;
cursor: pointer; cursor: pointer;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment