zhengpengju 3 years ago
commit ff47820383

@ -3,222 +3,200 @@ import { useEffect, useState } from 'react';
import { Button, Card, Col, Layout, List, Menu, Progress, Row, Typography } from 'antd'; import { Button, Card, Col, Layout, List, Menu, Progress, Row, Typography } from 'antd';
import { PageContainer } from '@ant-design/pro-layout'; import { PageContainer } from '@ant-design/pro-layout';
import { useParams, useRequest } from 'umi'; import { useParams, useRequest } from 'umi';
import { viewMyLearningSubject, listMyLearningChapterCourse } from './service'; import { viewMyLearningSubject, getCourseExaminationProgressList } from './service';
import type { CardListItemDataType } from './data.d'; import type { CardListItemDataType } from './data.d';
import styles from './style.less'; import styles from './style.less';
import SubMenu from 'antd/lib/menu/SubMenu'; import SubMenu from 'antd/lib/menu/SubMenu';
console.log('course/list')
const { Paragraph } = Typography; const { Paragraph } = Typography;
import cookie from 'react-cookies'; import cookie from 'react-cookies';
// const getList = async (subject_id,chapter_id ) => { import { history } from "@@/core/history";
// // const hide = message.loading('正在配置');
// try {
// const a=await listMyLearningChapterCourse({
// identity_id:cookie.load('identity_id'),
// person_id:cookie.load('person_id'),
// subject_id:subject_id,
// chapter_id:chapter_id,
// });
// // message.success('配置成功');
// return a;
// } catch (error) {
// // message.error('配置失败请重试!');
// return false;
// }
// };
let chapterCourse=[];
let total_process=0;
const CardList = () => { const CardList = () => {
const params = useParams(); const params = useParams();
console.log('params', params);
// const ids = params.msg.split(',');
const [currentCourse, SetCurrentCourse] = useState() const [currentCourse, SetCurrentCourse] = useState()
/** 获取主题下课程 */ /** 获取主题下课程 */
const { data } = useRequest(() => { const { data } = useRequest(() => {
return viewMyLearningSubject({ return viewMyLearningSubject({
identity_id: cookie.load('identity_id'), identity_id: cookie.load('identity_id'),
person_id: cookie.load('person_id'), person_id: cookie.load('person_id'),
data_id: params.data_id, data_id: params?.data_id,
data_type: params.data_type, data_type: params?.data_type,
subject_id: params.subject_id subject_id: params?.subject_id
});
}); });
});
const list = data?.list || []; // const list = data?.list||[];
const subject_data = data ? data.subject : []; const subject_data = data ? data.subject : [];
const last_data = data ? data.last_learning_course : []; const last_data = data ? data.last_learning_course : [];
const chapter_list = data ? data.chapter_list : []; const chapter_list = data ? data.chapter_list : [];
//console.log('currentCourse', currentCourse)
/** 获取课程详情 */ /** 获取课程详情 */
const { data: chapterCourse, run, loading } = useRequest((params: { subject_id: number, chapter_id: number }) => { const { chapterCourseData, run, loading } = useRequest((params: { subject_id: number, chapter_id: number }) => {
return listMyLearningChapterCourse({ return getCourseExaminationProgressList({
identity_id: cookie.load('identity_id'), identity_id: cookie.load('identity_id'),
person_id: cookie.load('person_id'), person_id: cookie.load('person_id'),
subject_id: params?.subject_id,//chapter_list[0].subject_id subject_id: params?.subject_id,
chapter_id: params?.chapter_id,//chapter_list[0].chapter_id chapter_id: params?.chapter_id,
});
});
/** 首次页面 当data 变化 执行run chapterCourse 变化 进行currentCourse赋值 */
useEffect(() => {
console.log('chapterCourse...', chapterCourse)
if (data !== undefined && data !== null) {
run({ subject_id: data?.chapter_list[0]?.subject_id, chapter_id: data?.chapter_list[0]?.chapter_id })
SetCurrentCourse(chapterCourse)
}
}, [data]); // r_list[0].chapter_id
});
},{
formatResult: (result) => {
if(result.list.length!==0){
let total_finish_count=0;
let total_question_count=0;
result.list.forEach((item)=>{
total_finish_count+=item.finish_count;
total_question_count+=item.question_count;
if(item.finish_count!==0){
let num=0;
num=result.finish_count/result.question_count;
item.process=num.toFixed(4)
}else {
item.process=0;
}
});
if(total_finish_count!==0){
let total_num=total_finish_count/total_question_count;
total_process=total_num.toFixed(4)
/** run后 chapterCourse 变化 进行currentCourse赋值 */ }else {
useEffect(() => { total_process=0;
console.log('chapterCourse...', chapterCourse)
if (data !== undefined) {
console.log('data', data)
SetCurrentCourse(chapterCourse)
} }
}
}, [chapterCourse]); chapterCourse=result.list;
}
const content = ( });
<div className={styles.pageHeaderContent}>
<Card /** 首次页面 当data 变化 执行run chapterCourse 变化 进行currentCourse赋值 */
title={<a>{subject_data ? subject_data.subject_name : '--'}</a>} useEffect(() => {
hoverable={false} // console.log('chapterCourse首次页面...', chapterCourse)
className={styles.card} if (data !== undefined && data !== null && chapter_list.length !== 0) {
actions={[]} run({ subject_id: data?.chapter_list[0]?.subject_id, chapter_id: data?.chapter_list[0]?.chapter_id })
extra={<><span style={{ padding: 10 }}>: {subject_data ? subject_data.learning_start_time : '--'}</span><span style={{ padding: 10 }}>{subject_data ? subject_data.distance_end_time : '--'}</span><span style={{ padding: 10 }}>{subject_data ? subject_data.total_course_hours : '--'}</span></>} SetCurrentCourse(chapterCourse)
> }
<Card.Meta //setSelectedCourse({})
avatar={<img alt="" className={styles.cardAvatar} src={'https://gw.alipayobjects.com/zos/rmsportal/uMfMFlvUuceEyPpotzlq.png'} style={{ width: '270px', height: '150px', borderRadius: '10px' }} />} }, [data]);
title={false}
description={ /** run后 chapterCourse 变化 进行currentCourse赋值 */
<> useEffect(() => {
<Card.Grid hoverable={false} style={{ width: '100%', padding: 0, boxShadow: 'none' }}> // console.log('chapterCourse变化...', chapterCourse)
<Paragraph className={styles.item} ellipsis={{ rows: 4 }} style={{ paddingLeft: 10 }}> if (data !== undefined) {
{subject_data ? subject_data.subject_describe : '--'} SetCurrentCourse(chapterCourse)
</Paragraph> }
<Row> //setSelectedCourse({})
<Col span={16} style={{ display: 'inline-block', padding: 10 }}><span></span><span style={{ display: 'inline-block', width: '80%' }}><Progress percent={subject_data ? subject_data.subject_learning_progress * 100 : 0} /></span></Col> }, [chapterCourse]);
</Row>
<Row>
<Col span={10} style={{ padding: 10 }}><span></span><span>{last_data ? last_data.course_name : '--'}</span></Col> <Col span={10} style={{ padding: 10 }}><span>{last_data ? last_data.lecture_teacher : '--'}</span></Col> <Col span={4} style={{ padding: 10 }}><Button type="primary">::</Button></Col> const content = (
</Row> <div className={styles.pageHeaderContent}>
</Card.Grid> <Card
</> title={<a>{subject_data ? subject_data.subject_name : '--'}</a>}
} hoverable={false}
/> className={styles.card}
</Card> actions={[]}
</div> >
); <Card.Meta
avatar={<img alt="" className={styles.cardAvatar} src={'https://gw.alipayobjects.com/zos/rmsportal/uMfMFlvUuceEyPpotzlq.png'} style={{ width: '270px', height: '150px', borderRadius: '10px' }} />}
title={false}
console.log('iddddddd', chapter_list.length !== 0 ? chapter_list[0].chapter_id.toString() : '') description={
const nullData: Partial<CardListItemDataType> = {}; <>
return ( <Card.Grid hoverable={false} style={{ width: '100%', padding: 0, boxShadow: 'none' }}>
<PageContainer content={content} extraContent={false}> <Paragraph className={styles.item} ellipsis={{ rows: 4 }} style={{ paddingLeft: 10 }}>
<Row> {subject_data ? subject_data.subject_describe : '--'}
<Col span={6} style={{ paddingRight: 24 }}> </Paragraph>
<Menu <Row>
mode="inline" <Col span={16} style={{ display: 'inline-block', padding: 10 }}><span></span><span style={{ display: 'inline-block', width: '80%' }}><Progress percent={total_process * 100 } /></span></Col>
selectedKeys={[chapter_list.length !== 0 ? chapter_list[0].chapter_id.toString() : '']} </Row>
defaultOpenKeys={['sub1']} <Row>
style={{ height: '100%', width: '100%' }} <Col span={4} style={{ padding: 10 }}>
> <Button type="primary"
<SubMenu key="sub1" icon={<AlignLeftOutlined />} title="章节目录"> onClick={() => {
{ console.log('last_data',last_data)
chapter_list.length !== 0 ?
chapter_list.map((item) => { }}
return ( ></Button>
<Menu.Item </Col>
key={item.chapter_id} </Row>
onClick={() => { </Card.Grid>
run({ subject_id: item.subject_id, chapter_id: item.chapter_id }) </>
}} }
>{item.chapter_name}</Menu.Item> />
) </Card>
</div>
}) : '' );
}
const nullData: Partial<CardListItemDataType> = {};
</SubMenu> return (
</Menu> <PageContainer content={content} extraContent={false}>
</Col> <Row>
<Col span={18} style={{ background: '#ffffff', padding: 24 }}> <Col span={6} style={{ paddingRight: 24 }}>
{console.log('chapterCourse', chapterCourse)} <Menu
{ mode="inline"
chapterCourse !== undefined ? selectedKeys={[chapter_list.length !== 0 ? chapter_list[0].chapter_id.toString() : '']}
<> defaultOpenKeys={['sub1']}
<>{chapterCourse[0]?.course_name}</> style={{ height: '100%', width: '100%' }}
<>{chapterCourse[0]?.lecture_teacher}</> >
</> <SubMenu key="sub1" icon={<AlignLeftOutlined />} title="章节目录">
: <></> {
} chapter_list.length !== 0 ?
chapter_list.map((item) => {
return (
<List<Partial<CardListItemDataType>> <Menu.Item
rowKey="id" key={item.chapter_id}
// loading={loading} onClick={() => {
grid={{ run({ subject_id: item.subject_id, chapter_id: item.chapter_id })
gutter: 1,
xs: 1,
sm: 2,
md: 1,
lg: 1,
xl: 1,
xxl: 1,
}} }}
dataSource={[nullData, ...chapterCourse]} >{item.chapter_name}</Menu.Item>
renderItem={(item) => { )
if (item && item.id) {
return ( }) : ''
<List.Item key={item.id}> }
<Card
hoverable={false} </SubMenu>
className={styles.card} </Menu>
actions={[]} </Col>
style={{ background: '#f0f0f0' }} <Col span={18} style={{ background: '#ffffff', padding: 24, minHeight: '20rem' }}>
> {
<Card.Meta chapterCourse !== undefined && chapterCourse !== '' ?
avatar={false} chapterCourse.map((item, index) => {
title={<a>{item.title}</a>} return (
description={ <div key={'chapterCourse' + index} >
<Row> <div style={{ marginBottom: '2rem', }}>
<Col span={4} style={{ padding: 10 }}> <div style={{ paddingRight: '1rem', width: '10%', display: 'inline-block' }}>{index+1}</div>
1 <div title={item?.course_name} style={{ paddingRight: '1rem', width: '30%', display: 'inline-block', verticalAlign: 'middle', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>{item?.course_name}</div>
</Col> <div style={{ paddingRight: '1rem', width: '10%', display: 'inline-block' }}>{item?.finish_count}/{item?.question_count}</div>
<Col span={8} style={{ padding: 10 }}> <div style={{ paddingRight: '1rem', width: '30%', display: 'inline-block' }}>
<Paragraph className={styles.item} ellipsis={{ rows: 3 }}> <Progress percent={item?.progress * 100} />
{item.description} </div>
</Paragraph> <div style={{ paddingRight: '1rem', width: '20%', display: 'inline-block', textAlign: 'right' }}>
</Col> <Button type="primary" onClick={() => {
<Col span={4} style={{ padding: 10, textAlign: 'center' }}> const info = item.chapter_id + ',' + item.course_id + ',' + item.subject_id;
23 // window.open('/#/course/detail/' + info)
</Col> // history.push( '/course/detail/'+info);
<Col span={4} style={{ padding: 10, textAlign: 'center' }}> }}></Button>
<Progress percent={30} /> </div>
</Col> </div>
<Col span={4} style={{ padding: 10, textAlign: 'center' }}>
<Button type="primary"></Button>
</Col> </div>
</Row> )
} })
/>
</Card> : <></>
</List.Item> }
); </Col>
} </Row>
}}
/> </PageContainer>
</Col> );
</Row>
</PageContainer>
);
}; };
export default CardList; export default CardList;

@ -4,8 +4,8 @@ import type { CardListItemDataType } from './data.d';
/** /**
* 6.5 * 6.5
* /dsideal_yy/ypt/careerTraining/learning/listMyLearningSubject * /dsideal_yy/ypt/careerTraining/learning/listMyLearningSubject
* @param params * @param params
* @returns * @returns
*/ */
export async function listMyLearningSubject(params: { export async function listMyLearningSubject(params: {
page_size: number; page_size: number;
@ -18,8 +18,8 @@ export async function listMyLearningSubject(params: {
/** /**
* 6.5 * 6.5
* /dsideal_yy/ypt/careerTraining/learning/listMyLearningSubject * /dsideal_yy/ypt/careerTraining/learning/listMyLearningSubject
* @param params * @param params
* @returns * @returns
*/ */
export async function getRulesList(params: { export async function getRulesList(params: {
page_size: number; page_size: number;
@ -32,8 +32,8 @@ export async function getRulesList(params: {
/** /**
* 05 * 05
* /dsideal_yy/zygh/training/rules/getRulesPaper * /dsideal_yy/zygh/training/rules/getRulesPaper
* @param params * @param params
* @returns * @returns
*/ */
export async function getRulesPaper(params: { export async function getRulesPaper(params: {
page_size: number; page_size: number;
@ -46,8 +46,8 @@ export async function getRulesPaper(params: {
/** /**
* 06 * 06
* /dsideal_yy/zygh/training/rules/getPaperQuestionList * /dsideal_yy/zygh/training/rules/getPaperQuestionList
* @param params * @param params
* @returns * @returns
*/ */
export async function getPaperQuestionList(params: { export async function getPaperQuestionList(params: {
page_size: number; page_size: number;
@ -79,4 +79,15 @@ export async function listMyLearningChapterCourse(params: {
return request(' /dsideal_yy/ypt/careerTraining/learning/listMyLearningChapterCourse', { return request(' /dsideal_yy/ypt/careerTraining/learning/listMyLearningChapterCourse', {
params, params,
}); });
} }
export async function getCourseExaminationProgressList(params: {
chapter_id: number;
identity_id: number;
person_id: number;
subject_id: number
}){
return request('/dsideal_yy/zygh/training/mock/getCourseExaminationProgressList', {
params,
});
}

Loading…
Cancel
Save