视频详情页播放样式优化

src/views/videoManage/videoLibraryList/detail.vue

@@ -71,12 +71,12 @@
       <Paginate />
     </div>
   </div>
-  <Dialog v-model="playVisible" title="视频" destroy-on-close height="100%">
+  <el-dialog draggable v-model="playVisible" align-center append-to-body width="500px" center :show-close="false"
+    style="background: none;box-shadow: none;" destroy-on-close>
     <video id="my-player" class="video-js" controls autoplay preload="auto" ref="myVideo">
       <source :src="current.public_video_url" type="video/mp4">
     </video>
-  </Dialog>
-
+  </el-dialog>
   <Dialog v-model="linkVisible" title="创建推广链接" destroy-on-close>
     <el-form :model="formDataForm" label-width="120px" ref="form" v-loading="loading" class="pr-4">
       <el-form-item label="推广名称" prop="name" :rules="[{ required: true, message: '推广名称必须填写' }]">
@@ -162,8 +162,8 @@ onMounted(() => {
 <style lang="scss" scoped>
 //播放器样式
 video#my-player.video-js {
-  width: 80%;
-  height: 500px;
+  width: 500px;
+  height: auto;
   background-color: #000;
 }
 

src/views/videoManage/videoLibraryList/index.vue

@@ -151,9 +151,13 @@
     <Dialog v-model="uploadVisible" width="50%" title="上传视频" destroy-on-close>
       <uploadVideo @close="closeType('uploadVisible')" :primary="uploadData"></uploadVideo>
     </Dialog>
-    <Dialog v-action="'video.video.list'" v-model="videoDetailVisible" width="50%" title="短剧详情" destroy-on-close>
+    <el-dialog draggable v-action="'video.video.list'" align-center append-to-body v-model="videoDetailVisible" width="50%" title="短剧详情"
+      destroy-on-close>
       <videoDetail @close="closeType('videoDetailVisible')" :primary="videoDetailData"></videoDetail>
-    </Dialog>
+    </el-dialog>
+    <!-- <Dialog v-action="'video.video.list'" v-model="videoDetailVisible" width="50%" title="短剧详情" destroy-on-close>
+      <videoDetail @close="closeType('videoDetailVisible')" :primary="videoDetailData"></videoDetail>
+    </Dialog> -->
   </div>
 </template>