医学道
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
video/src/pages/business/videoInfo/components/hours.tsx

80 lines
2.2 KiB

import {FC} from "react";
import '../videoInfo.scss'
import {Image, View} from "@tarojs/components";
import playOk from "@/static/img/play-ok.png";
import play from "@/static/img/play.png";
import {formatMinute} from "@/utils/time";
import Taro from "@tarojs/taro";
import {curriculum} from "@/api";
interface Props {
data?: Hour[] | null
learn_hour_records?: LearnHourRecords[]
click: (is_complete: boolean, id: number) => void
}
async function jumTest(hour: Hour) {
const {hour_test} = await curriculum.hourPlay(hour.course_id, hour.id)
Taro.navigateTo({
url: `/pages/business/test/test?testId=${hour_test?.id}`
})
}
const Hours: FC<Props> = ({data, click, learn_hour_records}) => {
const complete = (id: number): number | undefined => {
const find = learn_hour_records?.find(d => d.id === id)
if (find) {
return find.courseHourRecordsFinish
} else {
return undefined
}
}
function onClick(id: number, is_complete: number | undefined, hour: Hour, upId?: number,) {
if (is_complete === 0) {
Taro.showModal({
title: '考卷未完成,是否前往',
content: '考卷未完成不能播放下一个视频',
confirmText: '前往考试',
cancelText: '观看视频',
success({confirm}) {
if (confirm) {
jumTest(hour)
} else {
click(true, id)
}
}
})
return;
} else if (is_complete === 1) {
click(true, id)
return;
}
if (upId && complete(upId) !== 1) {
Taro.showModal({title: '请完成上一个视频'})
return
}
click(!!is_complete, id)
}
return (
<>
{
data?.map((d, index) =>
<View className={'hor' + ` ${complete(d.id) ? 'complete' : null}`}
onClick={() => onClick(d.id, complete(d.id), d, data?.[index - 1]?.id,)}>
<Image src={complete(d.id) ? playOk : play} mode='aspectFit'/>
<View>
<View>{index + 1}.{d.title}</View>
<View className='font-26'>{formatMinute(d.duration)}</View>
{complete(d.id) === 0 && <View className='font-26 text-danger'></View>}
</View>
</View>)
}
</>
)
}
export default Hours