diff --git a/public/upfiles.html b/public/upfiles.html
index 7f8f62c..b9b9e9e 100644
--- a/public/upfiles.html
+++ b/public/upfiles.html
@@ -42,7 +42,7 @@
-
+
'+file.name+'
';
vDom.appendChild(li);
+
}
+
document.querySelector('#file_list').appendChild(vDom);
+ if(axupimgs.res.length>0){
+ document.querySelectorAll('#file_list li.up-no').forEach((el,i)=>{
+ el.classList ? el.classList.add('up-now') : el.className+=' up-now';
+ });
+ upAllFiles(0);
+ }
+
//reSort();
}
@@ -134,7 +142,7 @@
file_i = n;
if(len == n){
file_i=0;
- document.querySelector('#topbar .upall').innerText='全部上传';
+ // document.querySelector('#topbar .upall').innerText='全部上传';
return true;
}
if( axupimgs.res[n].url!='' ){
@@ -142,9 +150,8 @@
upAllFiles(n)
}else{
blobInfo.file=axupimgs.res[n].file;
- upload_handler(blobInfo,function(url){
+ upload_handler(blobInfo,function(url,name){
if(upload_base_path){
-
if(upload_base_path.slice(-1)=='/' && url.substr(0,1)=='/' ){
url = upload_base_path + url.slice(1);
}else if(upload_base_path.slice(-1)!='/' && url.substr(0,1)!='/' ){
@@ -154,33 +161,34 @@
}
}
axupimgs.res[file_i].url = url;
- filename = url.split('/').pop();
+ // filename = url.split('/').pop();
+ filename = name
var li = document.querySelectorAll('#file_list li')[file_i];
li.setAttribute('class','up-over');
li.querySelector('.namebox span').innerText = filename;
n++
upAllFiles(n);
},function(err){
- document.querySelector('#topbar .upall').innerText='全部上传';
- document.querySelectorAll('#file_list li.up-now').forEach((el,i)=>{
- el.setAttribute('class','up-no');
- });
- alert(err);
+ // document.querySelector('#topbar .upall').innerText='全部上传';
+ // document.querySelectorAll('#file_list li.up-now').forEach((el,i)=>{
+ // el.setAttribute('class','up-no');
+ // });
+ // alert(err);
});
}
}
-
- document.querySelector('#topbar .upall').addEventListener('click',(e)=>{
- if(e.target.innerText!='全部上传'){return false;}
- if(axupimgs.res.length>0){
- document.querySelectorAll('#file_list li.up-no').forEach((el,i)=>{
- el.classList ? el.classList.add('up-now') : el.className+=' up-now';
- });
- e.target.innerText='上传中...';
- upAllFiles(0);
- }
- });
+ //
+ // document.querySelector('#topbar .upall').addEventListener('click',(e)=>{
+ // if(e.target.innerText!='全部上传'){return false;}
+ // if(axupimgs.res.length>0){
+ // document.querySelectorAll('#file_list li.up-no').forEach((el,i)=>{
+ // el.classList ? el.classList.add('up-now') : el.className+=' up-now';
+ // });
+ // e.target.innerText='上传中...';
+ // upAllFiles(0);
+ // }
+ // });
var observ_flist = new MutationObserver( (muList,observe)=>{
if(muList[0].addedNodes.length>0){
diff --git a/src/assets/axupimgs/plugin.js b/src/assets/axupimgs/plugin.js
index 5eab499..cd9ee75 100644
--- a/src/assets/axupimgs/plugin.js
+++ b/src/assets/axupimgs/plugin.js
@@ -1,76 +1,77 @@
-tinymce.PluginManager.add('axupimgs', function(editor, url) {
- var pluginName='多图片上传';
- window.axupimgs={}; //扔外部公共变量，也可以扔一个自定义的位置
- const baseURL = import.meta.env.VITE_BASE_URL
+tinymce.PluginManager.add('axupimgs', function (editor, url) {
+ var pluginName = '多图片上传';
+ window.axupimgs = {}; //扔外部公共变量，也可以扔一个自定义的位置
+ const baseURL = import.meta.env.VITE_BASE_URL
- // var baseURL=tinymce.baseURL;
- var iframe1 = '/upfiles.html';
- axupimgs.images_upload_handler = editor.getParam('images_upload_handler', undefined, 'function');
- axupimgs.images_upload_base_path = editor.getParam('images_upload_base_path', '','string');
+ // var baseURL=tinymce.baseURL;
+ var iframe1 = '/upfiles.html';
+ console.log('editor',editor)
+ axupimgs.images_upload_handler = editor.getParam('images_upload_handler_not_loading', undefined, 'function');
+ axupimgs.images_upload_base_path = editor.getParam('images_upload_base_path', '', 'string');
axupimgs.axupimgs_filetype = editor.getParam('axupimgs_filetype', '.png,.gif,.jpg,.jpeg', 'string');
- axupimgs.res=[];
- var openDialog = function() {
- return editor.windowManager.openUrl({
- title: pluginName,
- size: 'large',
- url:iframe1,
- buttons: [
- {
- type: 'cancel',
- text: 'Close'
- },
- {
- type: 'custom',
- text: 'Save',
- name: 'save',
- primary: true
- },
- ],
- onAction: function (api, details) {
- switch (details.name) {
- case 'save':
- var html = '';
- var imgs = axupimgs.res;
- var len = imgs.length;
- for(let i=0;i';
- }
- }
- editor.insertContent(html);
- axupimgs.res=[];
- api.close();
- break;
- default:
- break;
- }
+ axupimgs.res = [];
+ var openDialog = function () {
+ return editor.windowManager.openUrl({
+ title: pluginName,
+ size: 'large',
+ url: iframe1,
+ buttons: [
+ {
+ type: 'cancel',
+ text: 'Close'
+ },
+ {
+ type: 'custom',
+ text: 'Save',
+ name: 'save',
+ primary: true
+ },
+ ],
+ onAction: function (api, details) {
+ switch (details.name) {
+ case 'save':
+ var html = '';
+ var imgs = axupimgs.res;
+ var len = imgs.length;
+ for (let i = 0; i < len; i++) {
+ if (imgs[i].url) {
+ html += '
';
+ }
+ }
+ editor.insertContent(html);
+ axupimgs.res = [];
+ api.close();
+ break;
+ default:
+ break;
+ }
- }
- });
- };
+ }
+ });
+ };
- editor.ui.registry.getAll().icons.axupimgs || editor.ui.registry.addIcon('axupimgs','');
+ editor.ui.registry.getAll().icons.axupimgs || editor.ui.registry.addIcon('axupimgs', '');
- editor.ui.registry.addButton('axupimgs', {
- icon: 'axupimgs',
+ editor.ui.registry.addButton('axupimgs', {
+ icon: 'axupimgs',
tooltip: pluginName,
- onAction: function() {
- openDialog();
- }
- });
- editor.ui.registry.addMenuItem('axupimgs', {
- icon: 'axupimgs',
- text: '图片批量上传...',
- onAction: function() {
- openDialog();
- }
- });
- return {
- getMetadata: function() {
- return {
- name: pluginName,
- url: "http://tinymce.ax-z.cn/more-plugins/axupimgs.php",
- };
- }
- };
+ onAction: function () {
+ openDialog();
+ }
+ });
+ editor.ui.registry.addMenuItem('axupimgs', {
+ icon: 'axupimgs',
+ text: '图片批量上传...',
+ onAction: function () {
+ openDialog();
+ }
+ });
+ return {
+ getMetadata: function () {
+ return {
+ name: pluginName,
+ url: "http://tinymce.ax-z.cn/more-plugins/axupimgs.php",
+ };
+ }
+ };
});
diff --git a/src/components/Tinymce.vue b/src/components/Tinymce.vue
index f2b612a..f9fa88d 100644
--- a/src/components/Tinymce.vue
+++ b/src/components/Tinymce.vue
@@ -70,11 +70,11 @@ const props = defineProps({
type: [String, Array],
default: "微软雅黑=Microsoft YaHei,Helvetica Neue,PingFang SC,sans-serif;苹果苹方=PingFang SC,Microsoft YaHei,sans-serif;宋体=simsun,serif;仿宋体=FangSong,serif;黑体=SimHei,sans-serif;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Book Antiqua=book antiqua,palatino;"
},
- width:{
+ width: {
type: String,
default: 'auto'
},
- height:{
+ height: {
type: Number,
default: 500
}
@@ -90,7 +90,7 @@ const init = reactive({
placeholder: "在这里输入文字", //textarea中的提示信息
min_width: 300,
min_height: 200,
- width:props.width,
+ width: props.width,
height: props.height, //注：引入autoresize插件时，此属性失效
resize: "both", //编辑器宽高是否可变，false-否,true-高可变，'both'-宽高均可，注意引号
promotion: false,
@@ -117,9 +117,15 @@ const init = reactive({
let formData = new FormData()
formData.append('file', blobInfo.blob())
//上传图片接口 上传成功后返回图片地址，用于显示在富文本中
- uploadFile(formData, props.imageUrl, success)
+ uploadFile(formData, props.imageUrl, success, true)
// }),
},
+ images_upload_handler_not_loading: (blobInfo, success) => {
+ let formData = new FormData()
+ formData.append('file', blobInfo.blob())
+ //上传图片接口
+ uploadFile(formData, props.imageUrl, success, false)
+ },
file_picker_callback: (callback, value, meta) => {
// 使用案例http://tinymce.ax-z.cn/general/upload-images.php
// meta.filetype //根据这个判断点击的是什么file image media
@@ -141,34 +147,34 @@ const init = reactive({
let xhr, formData;
xhr = new XMLHttpRequest();
xhr.withCredentials = false;
- xhr.open('POST', import.meta.env.VITE_BASE_URL+props.imageUrl);
+ xhr.open('POST', import.meta.env.VITE_BASE_URL + props.imageUrl);
xhr.setRequestHeader(
- 'Authorization',getToken()
+ 'Authorization', getToken()
)
- let loading= ElLoading.service({
+ let loading = ElLoading.service({
lock: true,
text: '文件上传中...',
background: 'rgba(0, 0, 0, 0.7)',
})
- xhr.onload = function() {
+ xhr.onload = function () {
let res;
// if (xhr.status != 200) {
// failure('HTTP Error: ' + xhr.status);
// return;
// }
res = JSON.parse(xhr.responseText);
- ElNotification({
- title: '提示',
- message: res.code === 1000 ? '上传成功' : '上传失败',
- type: res.code === 1000 ? 'success' : 'error'
- })
+ ElNotification({
+ title: '提示',
+ message: res.code === 1000 ? '上传成功' : '上传失败',
+ type: res.code === 1000 ? 'success' : 'error'
+ })
loading.close()
const fileUrl = res.data.url;
// '?fileId='+res.data.id+
- callback(fileUrl+'?fileName='+res.data.originalFilename, {text:file.name ,title: file.name });
+ callback(fileUrl + '?fileName=' + res.data.originalFilename, {text: file.name, title: file.name});
};
formData = new FormData();
- formData.append('file', file, file.name );
+ formData.append('file', file, file.name);
xhr.send(formData);
//
// let reader = new FileReader();
@@ -192,12 +198,16 @@ const init = reactive({
watch(() => {
emit("update:value", content.value);
});
-const uploadFile = (formData, url,success) => {
- let loading= ElLoading.service({
- lock: true,
- text: '图片上传中...',
- background: 'rgba(0, 0, 0, 0.7)',
- })
+const uploadFile = (formData, url, success, isLoading) => {
+ let loading = null
+ if (isLoading) {
+ loading = ElLoading.service({
+ lock: true,
+ text: '图片上传中...',
+ background: 'rgba(0, 0, 0, 0.7)',
+ })
+ }
+
axios.post(
import.meta.env.VITE_BASE_URL + url,
formData,
@@ -214,16 +224,24 @@ const uploadFile = (formData, url,success) => {
let data = res.data
if (data.code !== 1000) {
ElMessage.error(data.msg)
- loading.close()
- }else {
- success(data.data.url)
- loading.close()
+ if (loading) {
+ loading.close()
+ }
+ } else {
+ if (isLoading) {
+ success(data.data.url)
+ } else {
+ success(data.data.url, data.data.originalFilename)
+ }
+ if (loading) {
+ loading.close()
+ }
}
})
}
-