解决弹窗运行时出错

main
king 2 years ago
parent 586a1ba696
commit c14a20b394
  1. 15
      src/components/custom-page-container/custom-page-container.tsx
  2. 21
      src/components/showModel/showModel.module.scss
  3. 2
      src/components/showModel/showModel.tsx
  4. 2
      src/components/video/video.tsx
  5. 2
      src/components/videoCover/videoCover.tsx
  6. 4
      src/pages/business/videoInfo/components/catalogue.tsx
  7. 13
      src/pages/business/videoInfo/videoInfo.tsx

@ -5,13 +5,23 @@ import Taro from "@tarojs/taro";
const PageContainerInner: FC<PageContainerProps> = (props) => { const PageContainerInner: FC<PageContainerProps> = (props) => {
const [visible, setVisible] = useState(props.show) const [visible, setVisible] = useState(props.show)
const [playing, setPlaying] = useState(false)
useEffect(() => { useEffect(() => {
if (visible !== props) { if (visible !== props) {
if (props.show) { if (props.show) {
setVisible(props.show) if (playing) {
setTimeout(() => {
setVisible(props.show)
},300)
} else {
setVisible(props.show)
}
} else { } else {
setPlaying(true)
setTimeout(() => { setTimeout(() => {
setPlaying(false)
setVisible(props.show) setVisible(props.show)
}, 300) }, 300)
} }
@ -78,6 +88,9 @@ const PageContainerInner: FC<PageContainerProps> = (props) => {
} }
const CustomPageContainer: FC<PageContainerProps> = (props) => { const CustomPageContainer: FC<PageContainerProps> = (props) => {
if (props.position === 'center') {
return <PageContainerInner {...props} />
}
if (process.env.TARO_ENV !== 'h5') { if (process.env.TARO_ENV !== 'h5') {
return (<PageContainer {...props} />) return (<PageContainer {...props} />)
} }

@ -4,16 +4,17 @@
width: 100%; width: 100%;
border-top: 1px solid #eee; border-top: 1px solid #eee;
& > * { }
padding: 20px 0;
flex: 1; .cancel {
width: 50%; padding: 30px 0;
text-align: center; flex: 1;
color: #45D4A8; width: 50%;
text-align: center;
color: #45D4A8;
&:first-child { &:first-child {
color: #000; color: #000;
border-right: 1px solid #ddd; border-right: 1px solid #ddd;
}
} }
} }

@ -19,7 +19,7 @@ const ShowModel: FC<Props> = (pros) => {
{pros.children} {pros.children}
<View className={styles.operation}> <View className={styles.operation}>
<View className={styles.cancel} onClick={pros.onClickOverlay}></View> <View className={styles.cancel} onClick={pros.onClickOverlay}></View>
<View onClick={pros.onOk}>{pros.okText || '确定'}</View> <View className={styles.cancel} onClick={pros.onOk}>{pros.okText || '确定'}</View>
</View> </View>
</CustomPageContainer> </CustomPageContainer>
) )

@ -52,7 +52,7 @@ const HVideo: FC<HVideoOptions> = (opt: HVideoOptions) => {
} }
} }
Taro.useUnload(() => { Taro.useDidHide(() => {
video?.stop() video?.stop()
unique_ident.put(Number(currentTime.toFixed(2)), Date.now()) unique_ident.put(Number(currentTime.toFixed(2)), Date.now())
}) })

@ -28,7 +28,7 @@ const VideoCover: FC<VideoCoverProps> = (opt: VideoCoverProps) => {
<View className='videoBox'> <View className='videoBox'>
<View className='video' onClick={jump}> <View className='video' onClick={jump}>
<View className='upper'> <View className='upper'>
<Image src={opt.thumb} mode='aspectFit'/> <Image src={opt.thumb} mode='scaleToFill'/>
{opt.content && <View className='content'>{opt.content}</View>} {opt.content && <View className='content'>{opt.content}</View>}
{opt.marker && <View className='marker'>{opt.marker}</View>} {opt.marker && <View className='marker'>{opt.marker}</View>}
</View> </View>

@ -76,7 +76,8 @@ const Catalogue: FC<Props> = ({data, setHors, id, playId}) => {
function learning() { function learning() {
const flats: Hour[] = Object.values(data?.hours || {}).flat(Infinity) as Hour[] const flats: Hour[] = Object.values(data?.hours || {}).flat(Infinity) as Hour[]
if (data?.learn_record?.finished_count === data?.learn_record?.hour_count && flats.length) {
if ((data?.learn_hour_records?.length || undefined) == data?.learn_record?.hour_count && flats.length) {
setHors(true, flats[0].id) setHors(true, flats[0].id)
return return
} }
@ -97,7 +98,6 @@ const Catalogue: FC<Props> = ({data, setHors, id, playId}) => {
} }
return ( return (
<> <>
<View className='catalogue'> <View className='catalogue'>

@ -12,9 +12,10 @@ const VideoInfo: FC = () => {
const [data, setData] = useState<CourseDepData | null>(null) const [data, setData] = useState<CourseDepData | null>(null)
const [playId, setPlayId] = useState<number | null>(null) const [playId, setPlayId] = useState<number | null>(null)
const [preview, setPreview] = useState(false) const [preview, setPreview] = useState(false)
const [playing, setPlaying] = useState(false)
const getData = async () => { const getData = useCallback(async () => {
const res = await curriculum.courseDep(id, depId) const res = await curriculum.courseDep(id, depId)
if (res) { if (res) {
setData(res) setData(res)
@ -22,9 +23,15 @@ const VideoInfo: FC = () => {
if (playId) { // 用于自动播放 判断当前课程是否完成 if (playId) { // 用于自动播放 判断当前课程是否完成
currentVideo(res) currentVideo(res)
} }
}, [playing])
function curEnd() {
setPlaying(false)
getData().then()
} }
function setHors(is_complete: boolean, play_id: number) { function setHors(is_complete: boolean, play_id: number) {
setPlaying(true)
setPreview(is_complete) setPreview(is_complete)
setPlayId(play_id) setPlayId(play_id)
} }
@ -86,14 +93,12 @@ const VideoInfo: FC = () => {
data && getData() data && getData()
}) })
return ( return (
<> <>
<View className='content'> <View className='content'>
<View className='content-video'> <View className='content-video'>
{playId ? {playId ?
<Course id={playId} courseId={id} curEnd={getData} preview={preview}/> <Course id={playId} courseId={id} curEnd={curEnd} preview={preview}/>
: <Image src={data?.course.thumb || ''} className='image' mode='scaleToFill'/>} : <Image src={data?.course.thumb || ''} className='image' mode='scaleToFill'/>}
</View> </View>

Loading…
Cancel
Save