视频主页增加对应参数

public/react/src/modules/user/usersInfo/video/InfosVideo.css

@@ -20,7 +20,7 @@
 }
 .videoItem img.cover {
     width: 100%;
-    border-radius: 6px 6px 0px 0px;
+    border-radius: 12px 12px 0px 0px;
     height: 158px;
 }
 .nItem.videoItem:hover .mask {
@@ -34,12 +34,12 @@
     display: inline-block;
 }
 .nItem .mask {
-    border-radius: 6px 6px 0px 0px;
+    border-radius: 12px 12px 0px 0px;
     display: none;
     text-align: center;
     position: absolute;
-    background: #000;
-    opacity: 0.5;
+    background:rgba(0,0,0,0.39);
+    /*opacity: 0.5;*/
 }
 .videoItem .playWrap {
     display: none;
@@ -49,6 +49,7 @@
     position: absolute;
     top: 0px;
     left: 0px;
+    cursor: pointer;
 }
 .videoItem img.play {
     margin-top: 20%;
@@ -59,7 +60,7 @@
     padding: 9px 8px;
 
     background: #fff;
-    border-radius: 0px 0px 6px 6px;
+    border-radius: 0px 0px 12px 12px;
 }
 .videoItem .square-main .title{
     max-width: 256px;
@@ -71,7 +72,11 @@
     background: #EAEAEA;
 }
 .videoItem .time {
-    color: #A0A0A0;
+    color: #C0C4CC;
+}
+.videoItem .square-main .buttonRow .dianjilianicon{
+   color: #606266 !important;
+   font-size: 14px !important;
 }
 
 .videoItem .square-main .buttonRow {
@@ -80,8 +85,8 @@
 }
 
 .nItem.videoItem:hover .square-main {
-    color: #fff;
-    background: #333;
+    /*color: #fff;*/
+    background: #fff;
 }
 
 /* 预览弹框 */
@@ -118,3 +123,22 @@
     height: 48px;
     margin-right: 20px;
 }
+
+.play_duration{
+    width: 100%;
+    height:30px;
+    background:rgba(0,0,0,0.39);
+    /*opacity:0.39;*/
+    color:#fff;
+    font-size:12px;
+    line-height:30px;
+    text-align: right;
+    padding-right: 10px;
+}
+.mp23{
+    margin-bottom: 23px;
+}
+
+.videoItem:hover{
+    box-shadow:0px 4px 10px 0px rgba(3,7,45,0.1);
+}

public/react/src/modules/user/usersInfo/video/VideoInReviewItem.js

@@ -20,7 +20,7 @@ const clipboardMap = {}
 function VideoInReviewItem (props) {
     const theme = useContext(ThemeContext);
     const { history, file_url, cover_url, title, created_at, published_at, isReview, id
-        , onEditVideo, onMaskClick, getCopyText, showNotification } = props;
+        , onEditVideo, onMaskClick, getCopyText, showNotification,vv,play_duration} = props;
     useEffect(()=> {
         if (!isReview) {
             _clipboard = new ClipboardJS(`.copybtn_item_${id}`);
@@ -53,16 +53,25 @@ function VideoInReviewItem (props) {
             </div>}
             {!isReview &&
             <div className="playWrap" onClick={() => onMaskClick(props)}>
-                <img className="play" src={playIcon}></img>
+                <img className="play mp23" src={playIcon}></img>
+                {play_duration===0?"":<div className={"play_duration"}>累计学习时长：{play_duration} h</div>}
             </div>
             }
             <div className="square-main">
                 <div className="title overflowHidden1"
                     title={title && title.length > 20 ? title : ''}
                 >{title}</div>
+                <div className="df buttonRow mb10">
+
+                    <span className="time">{moment(published_at || created_at).format('YYYY-MM-DD HH:mm:ss')}</span>
+                </div>
                 <div className="df buttonRow">
                     {/* 2019-09-01 10:00:22 */}
-                    <span className="time">{moment(published_at || created_at).format('YYYY-MM-DD HH:mm:ss')}</span>
+                    {vv===0?"":<span className={"dianjilianicon"}>
+                         <Tooltip title="播放次数" placement="bottom">
+                             <i className={`icon-dianjiliang iconfont dianjilianicon`}></i>
+                         </Tooltip>  {vv}
+                    </span>}
                     { isReview != true && <div>
                         <Tooltip title="编辑" placement="bottom">
                             <i className="icon-bianji1 iconfont" onClick={() => onEditVideo(props)}