'v'

周少峰
Commit 73f08c6517a552224950d561d0e3c081d9ae6462 1 parent 5e317b34
Showing 1 changed file with 17 additions and 5 deletions
web/src/main/webapp/html/grass/article/editorVideoDetail.html
--- a/web/src/main/webapp/html/grass/article/editorVideoDetail.html
View file @73f08c6
+++ b/web/src/main/webapp/html/grass/article/editorVideoDetail.html
View file @73f08c6
@@ -79,18 +79,18 @@
                     <tr style="height: 155px">
                         <td style="width:100%;">
                             <span style="color:red">*</span><label style="font-size: 14px;">上传视频</label> <br>
-                            <a href="javascript:void(0);" class="btn btn-default" @click="videoAdd" style="background: #428bca; border-radius: 5px; color:#fff; text-decoration: none; padding: 6px 10px;">选择视频+</a><span style="margin-left: 20px; height: 30px; width: 30px; border-radius: 30px; line-height: 30px; text-align: center; background: #aaa; display: inline-block">{{videoUploaderInfo.progress * 100}}%</span><br>
-                            <span style="color:red"> 请上传比例为16:9横版或9:16竖版视频素材，大小不超过200M，时长不超过90s</span><br>
+                            <a href="javascript:void(0);" class="btn btn-default" @click="videoAdd" style="background: #428bca; border-radius: 5px; color:#fff; text-decoration: none; padding: 6px 10px;">选择视频+</a><span style="margin-left: 20px; height: 30px; width: 30px; border-radius: 30px; line-height: 30px; text-align: center; background: #aaa; display: inline-block">{{videoUploaderInfo.progress}}%</span><br>
+                            <span style="color:red"> 请上传比例为16:9横版或9:16竖版视频素材，大小不超过50M，时长不超过180s</span><br>
                             <input id="videoUrl" type="text" name="videoUrl"  :value="videoUploaderInfo.videoUrl"  style="padding: 0; border: 1px solid #aaa; width: 545px;height: 30px; line-height: 30px;"><a style="height: 30px; line-height: 30px; border: 1px solid #aaa; color: #000; text-decoration: none; padding: 0px 15px; display: inline-block; border-left: 0px;" href="javascript:(0);" data-clipboard-action="copy" class="copy" data-clipboard-target="#videoUrl">复制</a>
-                                <input type="file" style="display:none;" ref="videoFile" @change="videoUpload" />
+                                <input type="file" style="display:none;" ref="videoFile" id="videoFile" @change="videoUpload" />
                                 <input type="file" style="display:none;" ref="videoCoverFile" @change="videoCoverUpload" />
                         </td>
                     </tr>
                     <tr style="height: 80px">
                         <td style="width:100%;">
-                            <label style="font-size: 14px;">上传封面</label><br>
+                            <span style="color:red">*</span><label style="font-size: 14px;">上传封面</label><br>
                             <template v-if="videoUploaderInfo.coverImg">
                                 <img :src="videoUploaderInfo.coverImg" width="150"><br>
                                 <input id="imgs" name="articleImages" :value="videoUploaderInfo.coverImg" hidden="hidden"/>
@@ -953,6 +953,7 @@
         // state
         data () {
             return {
+                upload: false,
                 articleId: data ? data.articleId : 0,
                 videoUploaderInfo: {
                     progress: 0,
@@ -976,19 +977,28 @@
                 this.$refs.videoCoverFile.click()
             },
             videoUpload: function () {
+                if (this.upload) {
+                    $.messager.alert("提示","上传中！！", "info");
+                    return;
+                }
                 var self = this;
                 var mediaFile = this.$refs.videoFile.files[0];
                 if (mediaFile.type != "video/mp4") {
                     $.messager.alert("提示","仅仅 MP4 格式视频！！", "error");
+                    this.$refs.videoFile.value = "";
                     return;
                 }
                 if (mediaFile.size > 1024*1024*100) {
                     $.messager.alert("提示","视频最大支持100M！！", "error");
+                    this.$refs.videoFile.value = "";
+                    return;
                 }
+                this.upload = true;
                 var uploader = this.tcVod.upload({
                     mediaFile: mediaFile,
                 })
+                this.$refs.videoFile.value = "";
                 self.videoUploaderInfo = {
                     videoInfo: uploader.videoInfo,
                     isVideoUploadSuccess: false,
@@ -1002,7 +1012,8 @@
                     },
                 }
                 uploader.on('media_progress', function (info) {
-                    self.videoUploaderInfo.progress = Math.round(info.percent);
+                    console.log(self.videoUploaderInfo, info);
+                    self.videoUploaderInfo.progress = Math.round(info.percent*100);
                 })
                 uploader.on('media_upload', function (info) {
                     self.videoUploaderInfo.isVideoUploadSuccess = true;
@@ -1011,6 +1022,7 @@
                 uploader.done().then(function(doneResult) {
                     self.videoUploaderInfo.fileId = doneResult.fileId;
                     self.videoUploaderInfo.videoUrl = doneResult.video.url;
+                    self.upload = false
                 })
             },