解决视频播放停止问题，增加删除视频功能

fhKeeper/formulahousekeeper/course-pc/src/views/coursemanagement/list.vue

@@ -153,6 +153,15 @@
                         <div slot="tip" class="el-upload__tip">只能上传单个mp4/avi文件</div>
                     </el-upload>
                     <div v-if="newCourse.courseUrl" class="video-preview">
+                        <div class="video-header">
+                            <span class="video-title">视频预览</span>
+                            <el-button 
+                                type="text" 
+                                class="delete-video-btn" 
+                                @click="deleteVideo">
+                                <i class="el-icon-delete"></i> 删除视频
+                            </el-button>
+                        </div>
                         <video 
                             controls
                             width="300"
@@ -225,19 +234,20 @@
         </el-dialog>
         
         <!-- 视频播放对话框 -->
-        <el-dialog :visible.sync="videoDialogVisible" title="视频播放" width="800px" center>
+        <el-dialog :visible.sync="videoDialogVisible" title="视频播放" width="800px" center @close="stopVideo">
             <div class="video-player-container">
                 <video 
                     v-if="currentVideoUrl"
                     controls
                     autoplay
+                    ref="videoPlayer"
                     class="video-player"
                     :src="currentVideoUrl">
                     您的浏览器不支持视频播放
                 </video>
             </div>
             <span slot="footer" class="dialog-footer">
-                <el-button @click="videoDialogVisible = false">关 闭</el-button>
+                <el-button @click="closeVideoDialog">关 闭</el-button>
             </span>
         </el-dialog>
         
@@ -428,6 +438,46 @@ export default {
             }
         },
         
+        // 停止视频播放
+        stopVideo() {
+            if (this.$refs.videoPlayer) {
+                const videoElement = this.$refs.videoPlayer;
+                videoElement.pause();
+                videoElement.currentTime = 0;
+                videoElement.src = '';
+            }
+            this.currentVideoUrl = '';
+        },
+        
+        // 关闭视频对话框
+        closeVideoDialog() {
+            this.stopVideo();
+            this.videoDialogVisible = false;
+        },
+        
+        // 删除视频
+        deleteVideo() {
+            this.$confirm('确认删除该视频?', '提示', {
+                confirmButtonText: '确定',
+                cancelButtonText: '取消',
+                type: 'warning'
+            }).then(() => {
+                // 清空视频相关数据
+                this.newCourse.courseUrl = '';
+                this.newCourse.videoFiles = [];
+                
+                this.$message({
+                    type: 'success',
+                    message: '视频已删除!'
+                });
+            }).catch(() => {
+                this.$message({
+                    type: 'info',
+                    message: '已取消删除'
+                });
+            });
+        },
+        
         // 搜索课程列表
         searchList() {
             this.page = 1;
@@ -948,7 +998,7 @@ export default {
         
         // 添加分类
         addCategory() {
-            if (!this.newCategory.label) {
+            if (!this.newCategory.label || !this.newCategory.label.trim()) {
                 this.$message({
                     type: 'warning',
                     message: '请输入分类名称!'
@@ -1378,6 +1428,33 @@ export default {
 
 .video-preview {
     margin-top: 10px;
+    border: 1px solid #ebeef5;
+    border-radius: 4px;
+    padding: 10px;
+    background-color: #f9f9f9;
+}
+
+.video-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 10px;
+    padding-bottom: 8px;
+    border-bottom: 1px solid #ebeef5;
+}
+
+.video-title {
+    font-weight: bold;
+    color: #303133;
+}
+
+.delete-video-btn {
+    color: #f56c6c;
+    padding: 0;
+}
+
+.delete-video-btn:hover {
+    color: #f78989;
 }
 
 .video-name {