feat: 🎸 更新了很多信息

src/components/CoursesVideoPlayer/index.css

@@ -3,13 +3,10 @@
   height: 798px;
   position: relative;
 
-  .lock {
-    position: absolute;
-    top: 110px;
-    left: 50%;
-    transform: translateX(-50%);
-    width: 433px;
-    height: 384px;
+  .video-lock-wrapper {
+    width: 100%;
+    height: 100%;
+    position: relative;
   }
 
   .courses-video-player {
@@ -189,6 +186,7 @@
       .teacher-introduce {
         width: 100%;
         height: 84px;
+        overflow: hidden;
       }
       .courses-video-player-teacher-introduce {
         width: 100%;

src/components/CoursesVideoPlayer/index.jsx

@@ -1,17 +1,18 @@
-import { useState } from "react";
 import { Avatar } from "@arco-design/web-react";
-import LOCKICON from "@/assets/images/Common/lock_bg.png";
+import Locked from "@/components/Locked";
 import "./index.css";
 
-export default ({ className = "" }) => {
-  const [isLock, setIsLock] = useState(false);
-
+export default ({ className = "", isLock = false }) => {
   return (
     <div className={`${className} courses-video-player-wrapper`}>
       {/* 直播板块 */}
       <div className="courses-video-player">
         {isLock ? (
-          <img className="lock" src={LOCKICON} alt="lock" />
+          <Locked
+            className="video-lock-wrapper"
+            text="该板块将于「垂直能力提升」阶段启动后开放届时，请留意教务系统通知，您可在该板块进行线上
+        1V1 求职策略定制"
+          />
         ) : (
           <>
             <div className="courses-video-player-header">
@@ -27,7 +28,6 @@ export default ({ className = "" }) => {
           </>
         )}
       </div>
-      {/* 直播信息板块 */}
       <div className="courses-video-player-info">
         {/* 直播观众信息 */}
         <div className="courses-video-player-audience-info">