视频播放页添加提交视频错误功能

src/views/home/VideoPage.vue

@@ -63,7 +63,7 @@
                 type="danger"
                 size="mini"
                 icon="el-icon-help"
-                @click="displayErrorDialog(video.videoId)"
+                @click="displayErrorReportDialog"
               >
                 <span>报错</span>
               </el-button>
@@ -136,6 +136,32 @@
         </el-row>
       </el-row>
     </el-col>
+
+    <!-- 视频报错对话框 -->
+    <el-dialog
+      append-to-body
+      :visible.sync="showErrorReportDialog"
+      width="30%"
+      center
+    >
+      <el-card class="box-card">
+        <div slot="header" class="clearfix">
+          <span>视频报错</span>
+          <el-button style="float: right; padding: 3px 0" type="text" @click="submitErrorReport">提交错误</el-button>
+        </div>
+        <div class="text item">
+          <el-form ref="form" :model="errorReportForm" label-width="80px">
+            <el-form-item label="错误类型">
+              <el-select v-model="errorReportForm.error" placeholder="选择视频错误类型">
+                <el-option label="视频无封面" value="1" />
+                <el-option label="视频无声音" value="2" />
+                <el-option label="视频无画面" value="3" />
+              </el-select>
+            </el-form-item>
+          </el-form>
+        </div>
+      </el-card>
+    </el-dialog>
   </el-row>
 </template>
 
@@ -145,7 +171,7 @@ import Comment from 'components/comment/Comment'
 import VideoCard from 'components/card/VideoCard'
 import UserAvatarCard from '@/components/card/UserAvatarCard'
 
-import {similarVideo, videoInfo, getVideoComment, downloadVideo} from '@/api/video'
+import {similarVideo, videoInfo, videoErrorReport, downloadVideo} from '@/api/video'
 import { collectVideo } from "@/api/collect";
 import {getUserInfo} from "@/api/user";
 
@@ -174,11 +200,15 @@ export default {
         name: '王小虎1',
         address: '05-02 22:10'
       }],
-      showSubmitErrorDialog: false,
       showUpdateDialog: false,
       videoUpdate: {
       },
       showPlaylist: false,
+      showErrorReportDialog: false,
+      errorReportForm: {
+        videoId: null,
+        error: null
+      }
     }
   },
   watch: {
@@ -369,12 +399,23 @@ export default {
         })
       })
     },
-    displayErrorDialog() {
-      this.showSubmitErrorDialog = true
+    displayErrorReportDialog() {
+      this.errorReportForm.videoId = this.video.videoId
+      this.showErrorReportDialog = true
     },
-    submitErrorInfo(videoId) {
-      console.log('提交视频错误')
-      this.showSubmitErrorDialog = false
+    submitErrorReport() {
+      this.showErrorReportDialog = false
+      videoErrorReport(this.errorReportForm).then(res => {
+        if (res.code === 0) {
+        }
+      }).catch(error => {
+        this.$notify({
+          title: '提示',
+          message: error.message,
+          type: 'warning',
+          duration: 3000
+        })
+      })
     },
     displayUpdateDialog() {
       this.showUpdateDialog = true