|
|
@@ -73,8 +73,8 @@
|
|
|
</el-form>
|
|
|
</div>
|
|
|
|
|
|
- <el-dialog title="插入视屏" ref="diologForm" width="500px" :visible.sync="dialogFormVisible">
|
|
|
- <el-form :model="dialogForm" :rules="rules">
|
|
|
+ <el-dialog title="插入视屏" width="500px" :visible.sync="dialogFormVisible">
|
|
|
+ <el-form :model="dialogForm" ref="diologForm" :rules="dialogFormRules">
|
|
|
<el-form-item label="封面图" label-width="90px" prop="poster">
|
|
|
<el-input v-model="dialogForm.poster" style="width: 100%;" autocomplete="off"></el-input>
|
|
|
</el-form-item>
|
|
|
@@ -84,7 +84,7 @@
|
|
|
</el-form>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
<el-button @click="dialogFormVisible = false">取 消</el-button>
|
|
|
- <el-button type="primary" @click="onVideoComfirm">确 定</el-button>
|
|
|
+ <el-button type="primary" @click="onVideoComfirm('diologForm')">确 定</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
</div>
|
|
|
@@ -195,9 +195,9 @@ export default {
|
|
|
poster: null,
|
|
|
url: null
|
|
|
},
|
|
|
- dialogRules: {
|
|
|
- poster: [{ require: true, message: '请输入封面地址', trigger: 'blur' }],
|
|
|
- url: [{ require: true, message: '请输入视屏地址', trigger: 'blur' }]
|
|
|
+ dialogFormRules: {
|
|
|
+ poster: [{ required: true, message: "请输入封面地址", trigger: "blur" }],
|
|
|
+ url: [{ required: true, message: "请输入视屏地址", trigger: "blur" }]
|
|
|
},
|
|
|
form: {
|
|
|
title: null,
|
|
|
@@ -259,30 +259,31 @@ export default {
|
|
|
};
|
|
|
this.imageSize = tempTitle[this.form.type];
|
|
|
},
|
|
|
- onVideoComfirm() {
|
|
|
- let dialogForm = this.dialogForm
|
|
|
- if(!dialogForm.url) {
|
|
|
- this.dialogFormVisible = false
|
|
|
- return
|
|
|
- }
|
|
|
-
|
|
|
- // 获取富文本组件实例
|
|
|
- let quill = this.editor;
|
|
|
- // 获取光标所在位置
|
|
|
- let length = 0
|
|
|
- if(quill.getSelection()) {
|
|
|
- length = quill.getSelection().index;
|
|
|
- }
|
|
|
- // 插入图片，res为服务器返回的图片链接地址
|
|
|
- quill.insertEmbed(length, "video", dialogForm);
|
|
|
- // 调整光标到最后
|
|
|
- quill.setSelection(length + 1);
|
|
|
-
|
|
|
- this.dialogFormVisible = false
|
|
|
- this.dialogForm = {
|
|
|
- poster: null,
|
|
|
- url: null
|
|
|
- }
|
|
|
+ onVideoComfirm(formName) {
|
|
|
+ this.$refs[formName].validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ let dialogForm = this.dialogForm
|
|
|
+ // 获取富文本组件实例
|
|
|
+ let quill = this.editor;
|
|
|
+ // 获取光标所在位置
|
|
|
+ let length = 0
|
|
|
+ if(quill.getSelection()) {
|
|
|
+ length = quill.getSelection().index;
|
|
|
+ }
|
|
|
+ // 插入图片，res为服务器返回的图片链接地址
|
|
|
+ quill.insertEmbed(length, "video", dialogForm);
|
|
|
+ // 调整光标到最后
|
|
|
+ quill.setSelection(length + 1);
|
|
|
+
|
|
|
+ this.dialogFormVisible = false
|
|
|
+ this.dialogForm = {
|
|
|
+ poster: null,
|
|
|
+ url: null
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
},
|
|
|
addQuillTitle() {
|
|
|
const oToolBar = document.querySelector(".ql-toolbar"),
|
