dev_aliyun2
caicai8 5 years ago committed by harry
parent 6c67b05784
commit 3796a79fe0

@ -94,7 +94,7 @@ class Video extends Component {
let videoId = { let videoId = {
videoId: item.id, videoId: item.id,
title: item.title, title: item.title,
file_url: item.file_url, file_url: (item.play_url || item.file_url),
cover_url: item.cover_url cover_url: item.cover_url
} }
this.setState({ this.setState({

@ -1,5 +1,5 @@
import React, { useState, useEffect, useContext, memo } from 'react'; import React, { useState, useEffect, useContext, memo } from 'react';
import { Progress, Input, Tooltip } from 'antd' import { Progress, Input, Tooltip , Spin } from 'antd'
import { getUrl2, isDev, CBreadcrumb, ActionBtn, ThemeContext } from 'educoder' import { getUrl2, isDev, CBreadcrumb, ActionBtn, ThemeContext } from 'educoder'
import axios from 'axios' import axios from 'axios'
import moment from 'moment' import moment from 'moment'
@ -20,7 +20,7 @@ let _clipboard = null;
const clipboardMap = {} const clipboardMap = {}
function VideoInReviewItem (props) { function VideoInReviewItem (props) {
const theme = useContext(ThemeContext); const theme = useContext(ThemeContext);
const { history, file_url, cover_url, title, created_at, published_at, isReview, id const { history, file_url , play_url , cover_url , transcoded , title, created_at, published_at, isReview, id
, onEditVideo, onMaskClick, getCopyText, showNotification,vv,play_duration,operation , deleteVideo , moveVideo ,link} = props; , onEditVideo, onMaskClick, getCopyText, showNotification,vv,play_duration,operation , deleteVideo , moveVideo ,link} = props;
useEffect(()=> { useEffect(()=> {
if (!isReview) { if (!isReview) {
@ -44,10 +44,11 @@ function VideoInReviewItem (props) {
function toUpload() { function toUpload() {
history.push(`/users/${username}/videos/upload`) history.push(`/users/${username}/videos/upload`)
} }
const imgUrl = (!transcoded && !link) ? defaultImg : (cover_url || defaultImg);
return ( return (
<div className={`${isReview ? 'videoInReviewItem' : 'nItem'} videoItem`}> <div className={`${isReview ? 'videoInReviewItem' : 'nItem'} videoItem`}>
<Spin tip="正在转码,请稍等..." spinning={!transcoded && !link}>
<img className="cover" src={cover_url || defaultImg} alt=""></img> <img className="cover" src={imgUrl} alt=""></img>
{ link ? { link ?
<a href={link} target='_blank' className="otherLinkPanel"> <a href={link} target='_blank' className="otherLinkPanel">
<span className="otherLink">外链</span> <span className="otherLink">外链</span>
@ -56,12 +57,13 @@ function VideoInReviewItem (props) {
} }
{!isReview && <div className="mask" onClick={() => onMaskClick(props)}></div>} {!isReview && <div className="mask" onClick={() => onMaskClick(props)}></div>}
{!isReview && !link && {!isReview && !link && transcoded &&
<div className="playWrap" onClick={() => onMaskClick(props)}> <div className="playWrap" onClick={() => onMaskClick(props)}>
<img className="play mp23" src={playIcon}></img> <img className="play mp23" src={playIcon}></img>
{play_duration===0?"":<div className={"play_duration"}>累计学习时长{play_duration} h</div>} {play_duration===0?"":<div className={"play_duration"}>累计学习时长{play_duration} h</div>}
</div> </div>
} }
</Spin>
<div className="square-main"> <div className="square-main">
<div className="title overflowHidden1" <div className="title overflowHidden1"
title={title && title.length > 20 ? title : ''} title={title && title.length > 20 ? title : ''}
@ -106,7 +108,7 @@ function VideoInReviewItem (props) {
{ {
!link ? !link ?
<Tooltip title="复制视频地址" placement="bottom"> <Tooltip title="复制视频地址" placement="bottom">
<i className={`icon-fuzhi iconfont copybtn_item_${id}`} data-clipboard-text={getCopyText(file_url, cover_url)}></i> <i className={`icon-fuzhi iconfont copybtn_item_${id}`} data-clipboard-text={getCopyText((play_url || file_url), cover_url)}></i>
</Tooltip>:"" </Tooltip>:""
} }

@ -57,9 +57,12 @@ function VideoUploadList (props) {
} }
function onUploadChange (e) { function onUploadChange (e) {
var file = e.target.files[0] var file = e.target.files[0];
setLoading(true);
if (!file) { if (!file) {
// alert("请先选择需要上传的文件!") // alert("请先选择需要上传的文件!")
setLoading(false);
return return
} }
// avi、flv、f4v、m4v、mov、mp4、rmvb、swf、webm // avi、flv、f4v、m4v、mov、mp4、rmvb、swf、webm
@ -71,6 +74,7 @@ function VideoUploadList (props) {
&& file.name.indexOf('.webm') == -1 && file.name.indexOf('.webm') == -1
) { ) {
showNotification(`不支持的视频格式`) showNotification(`不支持的视频格式`)
setLoading(false);
clearInput() clearInput()
return; return;
} }
@ -79,7 +83,8 @@ function VideoUploadList (props) {
}else if (file.size >(parseInt(MAX_FILE_SIZE) * 1024 * 1024)) { }else if (file.size >(parseInt(MAX_FILE_SIZE) * 1024 * 1024)) {
// 超过500m TODO // 超过500m TODO
clearInput() clearInput();
setLoading(false);
showNotification(`视频大小超过${MAX_FILE_SIZE}M`) showNotification(`视频大小超过${MAX_FILE_SIZE}M`)
return; return;
} }
@ -91,7 +96,8 @@ function VideoUploadList (props) {
} }
}) })
if (gotTheSameFileName) { if (gotTheSameFileName) {
clearInput() clearInput();
setLoading(false);
showNotification(`你不能上传同一个视频文件名称,请重新选择。`) showNotification(`你不能上传同一个视频文件名称,请重新选择。`)
return; return;
} }
@ -106,7 +112,6 @@ function VideoUploadList (props) {
// 重新创建 才会用最新的 dispatch // 重新创建 才会用最新的 dispatch
create: !uploader, create: !uploader,
addFileSuccess: (uploadInfo) => { addFileSuccess: (uploadInfo) => {
setLoading(true);
const file = uploadInfo.file; const file = uploadInfo.file;
console.log('addFileSuccess', uploadInfo) console.log('addFileSuccess', uploadInfo)
// const newvideos = [...videos, { // const newvideos = [...videos, {
@ -435,9 +440,10 @@ function VideoUploadList (props) {
>继续添加</ActionBtn>} >继续添加</ActionBtn>}
<div className={`description ${noUploads ? 'noUploads' : ''}`}> <div className={`description ${noUploads ? 'noUploads' : ''}`}>
<div className="">视频大小不支持断点续传单个视频文件最大500M单次最多支持3个视频文件上传 </div> <div class="description ">
<div className="">视频规格aviflvf4vm4vmovmp4rmvbswfwebm </div> <div>上传说明目前不支持断点续传单个视频文件最大限制500M单次最多支持3个视频文件上传 </div>
<div className="">温馨提示请勿上传违法视频平台将为每一个视频分配一个地址您可以通过引用该地址将视频使用在实训项目等模块</div> <div>视频规格aviflvf4vm4vmovmp4rmvbswfwebm </div>
<div>温馨提示<span class="color-orange-tip">为了更好播放的体验建议您优先上传MP4格式如果您是自己录制视频建议您保存的时候将视频编码设置为AVC(H264)</span></div></div>
</div> </div>
{!noUploads && <React.Fragment> {!noUploads && <React.Fragment>

Loading…
Cancel
Save