视频标题超长问题解决

huaxin-web/src/components/Video/PlayVideo.vue

 <template>
   <div :class="isChoice ? 'showVideo' : 'closeVideo'">
     <div class="videoTitle">
-      <span style="margin-left: 15px; color: #334d6e">
+      <span
+        style="
+          margin-left: 15px;
+          color: #334d6e;
+          display: inline-flex;
+          align-items: center;
+          max-width: calc(100% - 120px);
+          min-width: 0;
+          overflow: hidden;
+          white-space: nowrap;
+          text-overflow: ellipsis
+        "
+        :title="videoName"
+      >
         <img
           src="@/assets/images/camera.png"
           alt="fold"
-          style="width: 18px; height: 18px"
+          style="width: 18px; height: 18px;margin-right: 4px"
         />
         {{ videoName }}
       </span>
@@ -13,10 +26,9 @@
         v-if="videoName != ''"
         type="text"
         size="medium"
-        style="margin-left: 8px"
+        style="margin-left: 8px;position: absolute"
         @click="closeVideo"
-        >关闭</el-button
-      >
+        >关闭</el-button>
       <el-dropdown
         @command="videoSetting"
         trigger="click"