refine upload
This commit is contained in:
@@ -5,14 +5,14 @@
|
||||
<el-dialog v-model="dialogVisible">
|
||||
<el-upload
|
||||
class="editor-slide-upload"
|
||||
action="https://upload.qbox.me"
|
||||
action="https://httpbin.org/post"
|
||||
:data="dataObj"
|
||||
:multiple="true"
|
||||
:file-list="fileList"
|
||||
:show-file-list="true"
|
||||
list-type="picture-card"
|
||||
:on-remove="handleRemove"
|
||||
:before-upload="beforeUpload">
|
||||
:on-success="handleImageScucess">
|
||||
<el-button size="small" type="primary">点击上传</el-button>
|
||||
</el-upload>
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
@@ -56,6 +56,9 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
handleImageScucess(file) {
|
||||
this.list.push({ url: file.files.file });
|
||||
},
|
||||
beforeUpload() {
|
||||
const _self = this;
|
||||
return new Promise((resolve, reject) => {
|
||||
|
@@ -100,47 +100,38 @@
|
||||
this.$emit('input', editor.getContent({ format: 'raw' }));
|
||||
});
|
||||
},
|
||||
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);
|
||||
return img
|
||||
},
|
||||
images_upload_handler(blobInfo, success, failure, progress) {
|
||||
progress(0);
|
||||
const token = _this.$store.getters.token;
|
||||
getToken(token).then(response => {
|
||||
const url = response.data.qiniu_url;
|
||||
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);
|
||||
// setTimeout(() => {
|
||||
// const doc = tinymce.activeEditor.getDoc();
|
||||
// const $$ = tinymce.dom.DomQuery;
|
||||
// const $image = $$(doc).find('img[src="' + url + '"]')
|
||||
// $image.addClass('wscnph');
|
||||
// $image.attr('data-wscntype', 'image');
|
||||
// $image.attr('data-wscnh', $image[0].height || 640);
|
||||
// $image.attr('data-wscnw', $image[0].width || 640);
|
||||
// }, 0);
|
||||
})
|
||||
}).catch(err => {
|
||||
failure('出现未知问题,刷新页面,或者联系程序员')
|
||||
console.log(err);
|
||||
});
|
||||
},
|
||||
// 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);
|
||||
// return img
|
||||
// },
|
||||
// images_upload_handler(blobInfo, success, failure, progress) {
|
||||
// progress(0);
|
||||
// const token = _this.$store.getters.token;
|
||||
// getToken(token).then(response => {
|
||||
// const url = response.data.qiniu_url;
|
||||
// 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);
|
||||
// });
|
||||
// },
|
||||
setup(editor) {
|
||||
editor.addButton('h2', {
|
||||
title: '小标题', // tooltip text seen on mouseover
|
||||
|
@@ -6,8 +6,8 @@
|
||||
drag
|
||||
:multiple="false"
|
||||
:show-file-list="false"
|
||||
action="https://upload.qbox.me"
|
||||
:before-upload="beforeUpload"
|
||||
action="https://httpbin.org/post"
|
||||
|
||||
:on-success="handleImageScucess">
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
|
||||
|
@@ -6,8 +6,8 @@
|
||||
drag
|
||||
:multiple="false"
|
||||
:show-file-list="false"
|
||||
action="https://upload.qbox.me"
|
||||
:before-upload="beforeUpload"
|
||||
action="https://httpbin.org/post"
|
||||
|
||||
:on-success="handleImageScucess">
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text">Drag或<em>点击上传</em></div>
|
||||
|
@@ -6,8 +6,8 @@
|
||||
drag
|
||||
:multiple="false"
|
||||
:show-file-list="false"
|
||||
action="https://upload.qbox.me"
|
||||
:before-upload="beforeUpload"
|
||||
action="https://httpbin.org/post"
|
||||
|
||||
:on-success="handleImageScucess">
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
|
||||
@@ -15,7 +15,7 @@
|
||||
<div class="image-preview image-app-preview">
|
||||
<div class="image-preview-wrapper" v-show="imageUrl.length>1">
|
||||
<div class='app-fake-conver'>  全球 付费节目单 最热 经济</div>
|
||||
<img :src="imageUrl+'?imageView2/1/h/180/w/320/q/100'">
|
||||
<img :src="imageUrl">
|
||||
<div class="image-preview-action">
|
||||
<i @click="rmImage" class="el-icon-delete"></i>
|
||||
</div>
|
||||
@@ -23,7 +23,7 @@
|
||||
</div>
|
||||
<div class="image-preview">
|
||||
<div class="image-preview-wrapper" v-show="imageUrl.length>1">
|
||||
<img :src="imageUrl+'?imageView2/1/w/200/h/200'">
|
||||
<img :src="imageUrl">
|
||||
<div class="image-preview-action">
|
||||
<i @click="rmImage" class="el-icon-delete"></i>
|
||||
</div>
|
||||
@@ -57,8 +57,8 @@
|
||||
emitInput(val) {
|
||||
this.$emit('input', val);
|
||||
},
|
||||
handleImageScucess() {
|
||||
this.emitInput(this.tempUrl)
|
||||
handleImageScucess(file) {
|
||||
this.emitInput(file.files.file)
|
||||
},
|
||||
beforeUpload() {
|
||||
const _self = this;
|
||||
|
Reference in New Issue
Block a user