fix[Tinymce]: custom-btn bug in fullscreen

This commit is contained in:
Pan
2018-05-09 14:36:17 +08:00
parent 597df4844a
commit 6795c26d02
2 changed files with 13 additions and 3 deletions

View File

@@ -1,5 +1,5 @@
<template>
<div class="tinymce-container editor-container">
<div class="tinymce-container editor-container" :class="{fullscreen:fullscreen}">
<textarea class="tinymce-textarea" :id="tinymceId"></textarea>
<div class="editor-custom-btn-container">
<editorImage color="#1890ff" class="editor-upload-btn" @successCBK="imageSuccessCBK"></editorImage>
@@ -43,7 +43,8 @@ export default {
return {
hasChange: false,
hasInit: false,
tinymceId: this.id || 'vue-tinymce-' + +new Date()
tinymceId: this.id || 'vue-tinymce-' + +new Date(),
fullscreen: false
}
},
watch: {
@@ -91,6 +92,11 @@ export default {
this.hasChange = true
this.$emit('input', editor.getContent())
})
},
setup(editor) {
editor.on('FullscreenStateChanged', (e) => {
_this.fullscreen = e.state
})
}
// 整合七牛上传
// images_dataimg_filter(img) {
@@ -168,6 +174,10 @@ export default {
top: 4px;
/*z-index: 2005;*/
}
.fullscreen .editor-custom-btn-container {
z-index: 10000;
position: fixed;
}
.editor-upload-btn {
display: inline-block;
}