|
|
@@ -66,7 +66,8 @@ export default {
|
|
|
zh: 'zh_CN',
|
|
|
es: 'es_MX',
|
|
|
ja: 'ja'
|
|
|
- }
|
|
|
+ },
|
|
|
+ thisImg: ''
|
|
|
};
|
|
|
},
|
|
|
computed: {
|
|
|
@@ -122,33 +123,45 @@ export default {
|
|
|
});
|
|
|
},
|
|
|
onPaste(event) {
|
|
|
+ const items = (event.clipboardData || window.clipboardData).items;
|
|
|
+ if (items[0].type.indexOf('image') !== -1) {
|
|
|
+ const file = items[0].getAsFile();
|
|
|
+ const formData = new FormData();
|
|
|
+ formData.append('file', file);
|
|
|
+ // 上传图片
|
|
|
+ this.$http.post('/sc-community/upload/uploadFile', formData).then((res) => {
|
|
|
+ if (res.status == 0) {
|
|
|
+ let content = window.tinymce.get(this.tinymceId).getContent();
|
|
|
+ let newContent = content.replace(/<img *src="data.*?\/>/g, `<img src='${res.data}' />`);
|
|
|
+ window.tinymce.get(this.tinymceId).setContent(newContent);
|
|
|
+ resolve && resolve();
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.msg);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$message({type:'warning',message:'只能复制纯文本或图片',duration:3000});
|
|
|
+ }
|
|
|
+
|
|
|
+ return;
|
|
|
new Promise((resolve) => {
|
|
|
const items = (event.clipboardData || window.clipboardData).items;
|
|
|
if (items[0].type.indexOf('image') !== -1) {
|
|
|
- console.log('粘贴的是图片类型');
|
|
|
const file = items[0].getAsFile();
|
|
|
const formData = new FormData();
|
|
|
formData.append('file', file);
|
|
|
- console.log('formData======', formData);
|
|
|
// 上传图片
|
|
|
- this.$http.post('/sc-community-web/upload/uploadFile', formData).then((res) => {
|
|
|
- console.log('onPaste', res);
|
|
|
+ this.$http.post('/sc-community/upload/uploadFile', formData).then((res) => {
|
|
|
if (res.status === 0) {
|
|
|
- // 放到内容当中
|
|
|
let img = `<img class="wscnph" src="${res.data}" />`;
|
|
|
- // let img = `<div class="wscnph" id="${res.data}" >[图片]</div>`;
|
|
|
window.tinymce.get(this.tinymceId).insertContent(img);
|
|
|
- // window.tinymce.get(this.tinymceId).insertContent(`<img class="wscnph" src="${res.data}" />`);
|
|
|
- // let content = window.tinymce.get(this.tinymceId).getContent();
|
|
|
- // let newContent = content.replace(/<img \s*class="wscnph"\s*src="[\s\S]*"\/>/g, '2');
|
|
|
- // window.tinymce.get(this.tinymceId).setContent(newContent);
|
|
|
resolve && resolve();
|
|
|
} else {
|
|
|
this.$message.error(res.msg);
|
|
|
}
|
|
|
});
|
|
|
} else {
|
|
|
- console.log('粘贴的不是图片，不能上传');
|
|
|
+ this.$message.error('只能复制文字图片，样式无法复制请手动排版');
|
|
|
}
|
|
|
}).then(() => {
|
|
|
let content = window.tinymce.get(this.tinymceId).getContent();
|
|
|
@@ -172,13 +185,13 @@ export default {
|
|
|
toolbar: this.toolbar.length > 0 ? this.toolbar : toolbar,
|
|
|
menubar: false,
|
|
|
plugins: plugins,
|
|
|
+ //只保留img标签
|
|
|
+ valid_elements: 'img[src]',
|
|
|
+ extended_valid_elements: 'img[src]',
|
|
|
end_container_on_empty_block: true,
|
|
|
powerpaste_word_import: 'clean',
|
|
|
code_dialog_height: 450,
|
|
|
code_dialog_width: '100%',
|
|
|
- // advlist_bullet_styles: 'square',
|
|
|
- // advlist_number_styles: 'default',
|
|
|
- // imagetools_cors_hosts: ['www.tinymce.com', 'codepen.io'],
|
|
|
default_link_target: '_blank',
|
|
|
link_title: false,
|
|
|
init_instance_callback: (editor) => {
|
|
|
@@ -193,7 +206,6 @@ export default {
|
|
|
this.$emit('input', editor.getContent());
|
|
|
});
|
|
|
editor.on('paste', (evt) => {
|
|
|
- console.log('粘贴paste');
|
|
|
// 监听粘贴事件
|
|
|
this.onPaste(evt);
|
|
|
});
|
|
|
@@ -203,62 +215,9 @@ export default {
|
|
|
_this.fullscreen = e.state;
|
|
|
});
|
|
|
},
|
|
|
- // it will try to keep these URLs intact
|
|
|
- // https://www.tiny.cloud/docs-3x/reference/configuration/Configuration3x@convert_urls/
|
|
|
- // https://stackoverflow.com/questions/5196205/disable-tinymce-absolute-to-relative-url-conversions
|
|
|
convert_urls: false,
|
|
|
paste_data_images: false // 粘贴的同时能把内容里的图片自动上传
|
|
|
- // 整合七牛上传
|
|
|
- // images_dataimg_filter(img) {
|
|
|
- // setTimeout(() => {
|
|
|
- // const $image = $(img);
|
|
|
- // $image.removeAttr('width');
|
|
|
- // $image.removeAttr('height');
|
|
|
- // if ($image[0].height && $image[0].width) {
|
|
|
- // $image.attr('data-wscntype', 'image');
|
|
|
- // $image.attr('data-wscnh', $image[0].height);
|
|
|
- // $image.attr('data-wscnw', $image[0].width);
|
|
|
- // $image.addClass('wscnph');
|
|
|
- // }
|
|
|
- // }, 0);
|
|
|
- // console.log(' images_dataimg_filter', img);
|
|
|
- // return img;
|
|
|
- // }
|
|
|
// images_upload_handler(blobInfo, success, failure, progress) {
|
|
|
- // // progress(0);
|
|
|
- // // console.log('images_upload_handler========', blobInfo, success, failure, progress);
|
|
|
- // // const formData = new FormData();
|
|
|
- // // formData = formData.append('file', blobInfo.blob(), blobInfo.filename());
|
|
|
- // // this.$http
|
|
|
- // // .post('/sc-community-web/upload/uploadFile', formData)
|
|
|
- // // .then((res) => {
|
|
|
- // // success(url);
|
|
|
- // // progress(100);
|
|
|
- // // console.log('====================================');
|
|
|
- // // console.log('res', res);
|
|
|
- // // console.log('====================================');
|
|
|
- // // })
|
|
|
- // // .catch((err) => {
|
|
|
- // // failure('出现未知问题，刷新页面，或者联系程序员');
|
|
|
- // // console.log(err);
|
|
|
- // // });
|
|
|
- // // const token = _this.$store.getters.token;
|
|
|
- // // getToken(token)
|
|
|
- // // .then((response) => {
|
|
|
- // // const url = '/sc-community-web/upload/uploadFile';
|
|
|
- // // const formData = new FormData();
|
|
|
- // // formData.append('token', response.data.qiniu_token);
|
|
|
- // // formData.append('key', response.data.qiniu_key);
|
|
|
- // // formData.append('file', blobInfo.blob(), url);
|
|
|
- // // upload(formData).then(() => {
|
|
|
- // // success(url);
|
|
|
- // // progress(100);
|
|
|
- // // });
|
|
|
- // // })
|
|
|
- // // .catch((err) => {
|
|
|
- // // failure('出现未知问题，刷新页面，或者联系程序员');
|
|
|
- // // console.log(err);
|
|
|
- // // });
|
|
|
// }
|
|
|
});
|
|
|
},
|
Shannon_mu