Skip to content

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

fix:merge

parents e64da733 c34dccef
Showing with 201 additions and 130 deletions
src/components/XMTable.jsx
......@@ -6,8 +6,7 @@ function XMTable(props) {
const [data, setData] = useState({});
useEffect(() => {
setEmpty(props.renderEmpty)
delete props.renderEmpty;
setEmpty(props.renderEmpty || {})
setData(props);
}, [props]);
......@@ -25,7 +24,7 @@ function XMTable(props) {
};
return (
<ConfigProvider renderEmpty={customizeRenderEmpty}>
<ConfigProvider className="xm-table-component" renderEmpty={customizeRenderEmpty}>
<Table
{...data}
/>
......
src/components/XMTable.less 0 → 100644
.xm-table-component {
}
\ No newline at end of file
src/components/index.js
/*
* @Author: wufan
* @Date: 2020-11-26 14:48:57
* @Last Modified by: mikey.zhaopeng
* @Last Modified time: 2020-11-26 14:52:02
* @Last Modified by: chenshu
* @Last Modified time: 2021-06-03 15:21:09
*/
import SearchBar from './SearchBar.tsx';
......@@ -10,6 +10,7 @@ import PageControl from './PageControl.tsx';
import CheckBox from './CheckBox.tsx';
import CropperModal from './CropperModal.tsx';
import ImgCutModalNew from './ImgCutModalNew';
import XMTable from './XMTable';
export {
......@@ -17,5 +18,6 @@ export {
PageControl,
CheckBox,
CropperModal,
ImgCutModalNew
ImgCutModalNew,
XMTable,
}
\ No newline at end of file
src/modules/common/DefaultIcon.jsx
/*
* @Author: zhujian
* @Date: 2018-10-10 20:49:11
* @Last Modified by: zhujiapeng
* @Last Modified time: 2020-11-16 17:02:11
* @Last Modified by: chenshu
* @Last Modified time: 2021-06-03 16:42:22
*/
// import './s.less'
......@@ -42,6 +42,7 @@ class DefaultIcon extends React.Component {
preserveAspectRatio: 'xMidYMid slice'
}
}
console.log(defaultOptions, this.props, 777777)
return (
<div style={this.props.style} className="DefaultIcon" key="icon">
<Lottie
......
src/modules/knowledge-base/components/KnowledgeBaseList.jsx
......@@ -7,17 +7,19 @@
* @Copyright: © 2020 杭州杰竞科技有限公司 版权所有
*/
import React from "react"
import { Table, Modal, message, Tooltip, Switch, Dropdown, Button } from "antd"
import { Route, withRouter } from "react-router-dom"
import { PageControl } from "@/components"
import { LIVE_SHARE_MAP } from "@/common/constants/academic/cloudClass"
import { appId, shareUrl, LIVE_SHARE } from "@/domains/course-domain/constants"
import ScanFileModal from "../../resource-disk/modal/ScanFileModal"
import WatchData from "./WatchData"
import KnowledgeAPI from "@/data-source/knowledge/request-api"
import ENUM from "../ENUM.js"
import "./KnowledgeBaseList.less"
import React from "react";
import { Modal, message, Tooltip, Switch, Dropdown, Button } from "antd";
import { Route, withRouter } from "react-router-dom";
import Lottie from 'react-lottie';
import { PageControl, XMTable } from "@/components";
import { LIVE_SHARE_MAP } from "@/common/constants/academic/cloudClass";
import { appId, shareUrl, LIVE_SHARE } from "@/domains/course-domain/constants";
import ScanFileModal from "../../resource-disk/modal/ScanFileModal";
import WatchData from "./WatchData";
import KnowledgeAPI from "@/data-source/knowledge/request-api";
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 { confirm } = Modal
......@@ -492,9 +494,17 @@ class KnowledgeBaseList extends React.Component {
preserveSelectedRowKeys: true,
onChange: onSelectChange,
}
const defaultOptions = {
loop: true,
autoplay: true,
animationData: nodata,
rendererSettings: {
preserveAspectRatio: 'xMidYMid slice'
}
}
return (
<div className='knowledge-base-list'>
<Table
<div className="knowledge-base-list">
<XMTable
rowKey={(record) => record.id}
rowSelection={rowSelection}
size="middle"
......@@ -503,7 +513,19 @@ class KnowledgeBaseList extends React.Component {
pagination={false}
scroll={{ x: 900 }}
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'>
......
src/modules/knowledge-base/components/KnowledgeBaseOpt.less
......@@ -11,7 +11,7 @@
justify-content: space-between;
.tip{
font-size:14px;
color:#FF9D14;
color:#2966FF;
margin-right:8px;
}
.text{
......
src/modules/knowledge-base/index.jsx
......@@ -77,9 +77,9 @@ export default class KnowledgeBase extends React.Component {
onSelectChange = (selectedRowKeys) => {
if (selectedRowKeys.length > 50) {
message.warning('最多只能选择50个题目');
return null;
}
this.setState({ selectedRowKeys });
const list = _.filter(selectedRowKeys, (item, index) => index < 50);
this.setState({ selectedRowKeys: list });
};
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 @@
white-space: nowrap;
}
.ant-tree-node-content-wrapper.ant-tree-node-selected {
color: #666666;
color: #2966FF;
}
}
.ant-tree-treenode-selected:hover::before,
......
src/modules/teach-tool/examination-manager/AddExam.tsx
......@@ -362,9 +362,9 @@ function AddExam(props: any) {
style={{ width: 320 }}
showTime={{ defaultValue: [moment().add(5, 'minutes'), moment().add(5, 'minutes')] }}
ranges={{
'近七天': [moment(), moment().add(6, 'day').endOf('day')],
'近1个月': [moment(), moment().add(1, 'month').endOf('day')],
'近3个月': [moment(), moment().add(3, 'month').endOf('day')],
'近七天': [moment().add(5, 'minute'), moment().add(6, 'day').endOf('day')],
'近1个月': [moment().add(5, 'minute'), moment().add(1, 'month').endOf('day')],
'近3个月': [moment().add(5, 'minute'), moment().add(3, 'month').endOf('day')],
}}
disabledDate={disabledDate}
value={[
......
src/modules/teach-tool/examination-manager/Index.tsx
import React, { useState, useRef, useEffect, useContext } from 'react'
import { Input, Select, DatePicker, Tooltip, Button, Table, Dropdown, Menu, Modal } from 'antd';
import Lottie from 'react-lottie';
import TeacherSelect from '@/modules/common/TeacherSelect';
import { Route, withRouter } from 'react-router-dom';
import Service from "@/common/js/service";
import moment from 'moment';
import { PageControl } from "@/components";
import { PageControl, XMTable } from "@/components";
import AddExam from './AddExam';
import User from "@/common/js/user";
import { XMContext } from "@/store/context";
import ExamShareModal from './ExamShareModal'
import DataAnalysic from './DataAnalysic'
import PreviewModal from './PreviewModal'
import * as nodata from '../../lottie/nodata/data.json';
import './index.less'
const { RangePicker } = DatePicker;
const { Search } = Input;
......@@ -308,6 +310,14 @@ function ExaminationManager(props: any) {
setQuery(_query)
}
const defaultOptions = {
loop: true,
autoplay: true,
animationData: nodata,
rendererSettings: {
preserveAspectRatio: 'xMidYMid slice'
}
}
return <div className="page examination-manager">
<div className="content-header">考试</div>
<div className="box content-body">
......@@ -402,7 +412,7 @@ function ExaminationManager(props: any) {
<div className="content">
<Table
<XMTable
bordered
size="small"
columns={columns}
......@@ -411,8 +421,20 @@ function ExaminationManager(props: any) {
onChange={onChange}
pagination={false}
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 &&
<PageControl
size="small"
......
src/modules/teach-tool/paper-manage/OperatePaper.jsx
......@@ -20,7 +20,9 @@ import {
Modal,
Spin,
} from "antd";
import Lottie from 'react-lottie';
import { PlusOutlined } from "@ant-design/icons";
import { XMTable } from "@/components";
import ShowTips from "@/components/ShowTips";
import Breadcrumbs from "@/components/Breadcrumbs";
import "./OperatePaper.less";
......@@ -30,6 +32,7 @@ import User from "@/common/js/user";
import AidToolService from "@/domains/aid-tool-domain/AidToolService";
import Bus from "@/core/bus";
import { Route, withRouter } from "react-router-dom";
import * as paperEmpty from '../../lottie/paperEmpty/data.json';
import AddExam from "@/modules/teach-tool/examination-manager/AddExam";
const questionTypeEnum = {
......@@ -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) => {
const { formData } = this.state;
const _selectQuestionList = [...list];
......@@ -719,6 +709,14 @@ class OperatePaper extends Component {
totalScore,
} = formData;
const { match } = this.props;
const defaultOptions = {
loop: true,
autoplay: true,
animationData: paperEmpty,
rendererSettings: {
preserveAspectRatio: 'xMidYMid slice'
}
}
return (
<div>
<div className="page operate-paper-page">
......@@ -817,16 +815,26 @@ class OperatePaper extends Component {
</div>
)}
<ConfigProvider renderEmpty={this.customizeRenderEmpty}>
<Table
<XMTable
className="table-style"
scroll={{ y: 350 }}
columns={this.parseColumns()}
dataSource={selectQuestionList}
pagination={false}
onChange={this.sortByQuestionType}
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>
}}
/>
</ConfigProvider>
</Form>
</div>
<div className="footer">
......@@ -844,23 +852,6 @@ class OperatePaper extends Component {
{paperPreviewModal}
</div>
<Route
path={`${match.url}/exam-operate-page`}
render={() => {
return (
<AddExam
paperInfo={formData}
type={
currentOperate === "edit"
? "editPaperToAddExam"
: "newPaperToAddExam"
}
/>
);
}}
/>
</div>
);
}
}
......
src/modules/teach-tool/paper-manage/OperatePaper.less
.operate-paper-page {
.box {
margin-bottom: 52px !important;
.ant-form-item {
margin-bottom: 24px !important;
}
.table-style {
border: 1px solid #f0f0f0 !important;
}
......@@ -12,7 +15,6 @@
margin-left: 12px;
}
.choose-btn {
margin-top: 8px;
margin-bottom: 12px;
}
.paper-info-tip {
......@@ -60,6 +62,12 @@
}
}
.ant-table tbody tr {
&:nth-child(even) {
background: #fff;
}
&:nth-child(odd) {
background: #fafafa;
}
&:last-child {
td {
border-bottom: none!important;
......
src/modules/teach-tool/paper-manage/components/PaperList.jsx
......@@ -8,7 +8,6 @@
*/
import React, { Component } from "react";
import {
Table,
Dropdown,
Row,
Input,
......@@ -20,7 +19,8 @@ import {
ConfigProvider,
Empty,
} from "antd";
import { PageControl } from "@/components";
import Lottie from 'react-lottie';
import { PageControl, XMTable } from "@/components";
import "./PaperList.less";
import { Route, withRouter } from "react-router-dom";
import OperatePaper from "@/modules/teach-tool/paper-manage/OperatePaper";
......@@ -31,6 +31,7 @@ import Service from "@/common/js/service";
import _ from "underscore";
import PaperPreviewModal from "../modal/PreviewPaperModal";
import MoveModal from '../../modal/MoveModal';
import * as nodata from '../../../lottie/nodata/data.json';
import Bus from "@/core/bus";
const { Search } = Input;
......@@ -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 = () => {
const columns = [
......@@ -305,7 +293,7 @@ class PaperList extends Component {
},
},
{
title: "试卷数量",
title: "题目数量",
key: "questionCnt",
dataIndex: "questionCnt",
width: this.props.type !== "modal-select" ? "12%" : "20%",
......@@ -559,6 +547,14 @@ class PaperList extends Component {
User.getUserRole()
);
const { match } = this.props;
const defaultOptions = {
loop: true,
autoplay: true,
animationData: nodata,
rendererSettings: {
preserveAspectRatio: 'xMidYMid slice'
}
}
return (
<div className={"paper-list " + this.props.type}>
<div className="paper-list-filter">
......@@ -629,9 +625,8 @@ class PaperList extends Component {
)}
<div className="paper-list-content">
<ConfigProvider renderEmpty={this.customizeRenderEmpty}>
{this.props.type !== "modal-select" ? (
<Table
<XMTable
rowKey={(record) => record.paperId}
rowSelection={paperRowSelection}
dataSource={dataSource}
......@@ -639,9 +634,21 @@ class PaperList extends Component {
pagination={false}
bordered
loading={loading}
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
rowKey={(record) => record.paperId}
dataSource={dataSource}
size={this.props.type == "modal-select" ? "small" : "middle"}
......@@ -652,9 +659,20 @@ class PaperList extends Component {
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>
}}
/>
)}
</ConfigProvider>
{total > 0 && (
<div className="box-footer">
......
src/modules/teach-tool/paper-manage/components/PaperList.less
......@@ -13,7 +13,7 @@
justify-content: space-between;
.tip{
font-size:14px;
color:#FF9D14;
color:#2966FF;
margin-right:8px;
}
.text{
......@@ -74,7 +74,7 @@
}
.paper-list-content {
position: relative;
margin-top: 16px;
margin-top: 12px;
.empty-list-tip {
color: #2966FF;
cursor: pointer;
......
src/modules/teach-tool/question-manage/components/QuestionList.jsx
......@@ -23,10 +23,11 @@ import {
Dropdown,
DatePicker,
} from "antd";
import Lottie from 'react-lottie';
import _ from "underscore";
import { Route, withRouter } from "react-router-dom";
import { DownOutlined } from '@ant-design/icons';
import { PageControl } from "@/components";
import { PageControl, XMTable } from "@/components";
import User from "@/common/js/user";
import AidToolService from "@/domains/aid-tool-domain/AidToolService";
import PreviewQuestionModal from "../modal/PreviewQuestionModal";
......@@ -36,6 +37,7 @@ import Bus from "@/core/bus";
import moment from 'moment';
import Service from "@/common/js/service";
import MoveModal from '../../modal/MoveModal';
import * as nodata from '../../../lottie/nodata/data.json';
import "./QuestionList.less";
const { RangePicker } = DatePicker;
......@@ -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) => {
const { columnKey, order } = sorter;
......@@ -625,6 +594,14 @@ class QuestionList extends Component {
preserveSelectedRowKeys: true,
onChange: this.onSelectChange,
};
const defaultOptions = {
loop: true,
autoplay: true,
animationData: nodata,
rendererSettings: {
preserveAspectRatio: 'xMidYMid slice'
}
}
return (
<div className="question-list">
<div className="question-list-filter">
......@@ -711,7 +688,7 @@ class QuestionList extends Component {
</div>
{["CloudManager", "StoreManager"].includes(User.getUserRole()) &&
(
<Space size={16}>
<Space size={8}>
{_.isEmpty(selectedRowKeys) ?
(!!categoryId && [
<Button key="1" type="primary" onClick={this.handleCreateQuestion}>
......@@ -732,14 +709,14 @@ class QuestionList extends Component {
</div>
}
{!!categoryId ? (
<Dropdown className="ml8" overlay={this.setMoreOperationOption()}>
<Dropdown overlay={this.setMoreOperationOption()}>
<Button id="more_operate">
更多操作
<DownOutlined />
</Button>
</Dropdown>
) : (
<Space size={16}>
<Space size={8}>
<Button onClick={() => this.batchMove()}>批量移动</Button>
<Button onClick={() => this.batchDelete()}>批量删除</Button>
</Space>
......@@ -747,8 +724,7 @@ class QuestionList extends Component {
</Space>
)}
<div className="question-list-content">
<ConfigProvider renderEmpty={this.customizeRenderEmpty}>
<Table
<XMTable
rowKey={(record) => record.id}
dataSource={dataSource}
columns={this.parseColumns()}
......@@ -756,8 +732,35 @@ class QuestionList extends Component {
bordered
onChange={this.handleChangeTable}
rowSelection={rowSelection}
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>还没有题目</span>
{["CloudManager", "StoreManager"].includes(User.getUserRole()) &&
categoryId && (
<span>
，快去
<span
className="empty-list-tip"
onClick={() => {
this.handleCreateQuestion();
}}
>
新建一个
</span>
吧！
</span>
)}
</span>
}}
/>
</ConfigProvider>
{total > 0 && (
<div className="box-footer">
<PageControl
......
src/modules/teach-tool/question-manage/components/QuestionList.less
......@@ -51,7 +51,7 @@
justify-content: space-between;
.tip {
font-size: 14px;
color: #FF9D14;
color: #2966FF;
margin-right: 8px;
}
.text {
......@@ -70,7 +70,7 @@
}
.question-list-content {
position: relative;
margin-top: 16px;
margin-top: 12px;
.empty-list-tip {
color: #2966FF;
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