|
|
@@ -23,12 +23,17 @@ import {Editor, Toolbar} from '@wangeditor/editor-for-vue'
|
|
|
export default {
|
|
|
name: "index",
|
|
|
components: {Editor, Toolbar},
|
|
|
- props: {},
|
|
|
+ props: {
|
|
|
+ isSimple: {
|
|
|
+ type: Boolean,
|
|
|
+ default: true
|
|
|
+ }
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
editor: null,
|
|
|
html: undefined,
|
|
|
- toolbarConfig: {
|
|
|
+ toolbarSimpleConfig: {
|
|
|
toolbarKeys: [
|
|
|
"bold",
|
|
|
"underline",
|
|
|
@@ -47,11 +52,75 @@ export default {
|
|
|
|
|
|
]
|
|
|
},
|
|
|
+ toolbarDefaultConfig: {
|
|
|
+ toolbarKeys: [
|
|
|
+ 'headerSelect',
|
|
|
+ "bold",
|
|
|
+ "underline",
|
|
|
+ "italic",
|
|
|
+ "through",
|
|
|
+ "color",
|
|
|
+ "bgColor",
|
|
|
+ "|",
|
|
|
+ "bulletedList",
|
|
|
+ "numberedList",
|
|
|
+ "justifyLeft",
|
|
|
+ "justifyRight",
|
|
|
+ "justifyCenter",
|
|
|
+ 'todo',
|
|
|
+ "|",
|
|
|
+ "emotion",// 表情
|
|
|
+ {
|
|
|
+ key: 'group-link',
|
|
|
+ title: '链接',
|
|
|
+ menuKeys: ['insertLink', 'editLink', 'unLink', 'viewLink']
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // key: 'group-image', // 必填,要以 group 开头
|
|
|
+ // title: '图片', // 必填
|
|
|
+ // iconSvg: '<svg></svg>',
|
|
|
+ // menuKeys: ['uploadImage',
|
|
|
+ // 'insertImage',
|
|
|
+ // 'deleteImage',
|
|
|
+ // 'editImage',
|
|
|
+ // 'viewImageLink']
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // key: 'group-video',
|
|
|
+ // title: '视频',
|
|
|
+ // iconSvg: '',
|
|
|
+ // menuKeys: ['insertVideo',
|
|
|
+ // 'uploadVideo']
|
|
|
+ // },
|
|
|
+ {
|
|
|
+ key: 'group-table',
|
|
|
+ title: '表格',
|
|
|
+ menuKeys: ['insertTable',
|
|
|
+ 'deleteTable',
|
|
|
+ 'insertTableRow',
|
|
|
+ 'deleteTableRow',
|
|
|
+ 'insertTableCol',
|
|
|
+ 'deleteTableCol',
|
|
|
+ 'tableHeader',
|
|
|
+ 'tableFullWidth']
|
|
|
+ },
|
|
|
+ 'divider',
|
|
|
+ 'emotion',
|
|
|
+ 'blockquote',
|
|
|
+ "|",
|
|
|
+ "fullScreen"
|
|
|
+
|
|
|
+ ]
|
|
|
+ },
|
|
|
editorConfig: {placeholder: '请输入内容...'},
|
|
|
mode: 'simple', // or 'simple'
|
|
|
}
|
|
|
},
|
|
|
- watch: {},
|
|
|
+ computed: {
|
|
|
+ toolbarConfig() {
|
|
|
+ return this.isSimple ? this.toolbarSimpleConfig : this.toolbarDefaultConfig
|
|
|
+ }
|
|
|
+ },
|
|
|
beforeDestroy() {
|
|
|
const editor = this.editor
|
|
|
if (editor == null) return
|