odjbin/mosr-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request 'dj' (#935) from dj into master

Browse Source 
Reviewed-on: http://git.feashow.cn/clay/mosr-web/pulls/935
This commit is contained in:
odjbin
2024-12-19 14:26:36 +00:00
parent efe27b8580 7ce2d6edb7
commit e10978cadd
4 changed files with 147 additions and 119 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
public/upfiles.html
View File

@@ -42,7 +42,7 @@
</head> </head>
<body> <body>
<div id="wrap"> <div id="wrap">
<div id="topbar"><button class="addfile primary">+ 添加文件</button><button class="upall primary">全部上传</button><button class="removeall">清空列表</button></div> <div id="topbar"><button class="addfile primary">+ 添加文件</button><button class="removeall">清空列表</button></div>
<ul id="file_list"></ul> <ul id="file_list"></ul>
</div> </div>
@@ -54,7 +54,6 @@
blobInfo.blob = function(){return this.file;} blobInfo.blob = function(){return this.file;}
var upload_handler = axupimgs.images_upload_handler; var upload_handler = axupimgs.images_upload_handler;
var upload_base_path = axupimgs.images_upload_base_path; var upload_base_path = axupimgs.images_upload_base_path;
//为列表添加排序 //为列表添加排序
function reSort(){ function reSort(){
document.querySelectorAll('#file_list li').forEach((el,i)=>{ document.querySelectorAll('#file_list li').forEach((el,i)=>{
@@ -74,8 +73,17 @@
li.setAttribute('data-time',file.lastModified); li.setAttribute('data-time',file.lastModified);
li.innerHTML='<div class="picbox"><img src="'+blobUrl+'"></div><div class="namebox"><span>'+file.name+'</span></div><div class="tools"><a class="remove"></a></div>'; li.innerHTML='<div class="picbox"><img src="'+blobUrl+'"></div><div class="namebox"><span>'+file.name+'</span></div><div class="tools"><a class="remove"></a></div>';
vDom.appendChild(li); vDom.appendChild(li);
} }
document.querySelector('#file_list').appendChild(vDom); 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(); //reSort();
} }
@@ -134,7 +142,7 @@
file_i = n; file_i = n;
if(len == n){ if(len == n){
file_i=0; file_i=0;
document.querySelector('#topbar .upall').innerText='全部上传'; // document.querySelector('#topbar .upall').innerText='全部上传';
return true; return true;
} }
if( axupimgs.res[n].url!='' ){ if( axupimgs.res[n].url!='' ){
@@ -142,9 +150,8 @@
upAllFiles(n) upAllFiles(n)
}else{ }else{
blobInfo.file=axupimgs.res[n].file; 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){
if(upload_base_path.slice(-1)=='/' && url.substr(0,1)=='/' ){ if(upload_base_path.slice(-1)=='/' && url.substr(0,1)=='/' ){
url = upload_base_path + url.slice(1); url = upload_base_path + url.slice(1);
}else if(upload_base_path.slice(-1)!='/' && url.substr(0,1)!='/' ){ }else if(upload_base_path.slice(-1)!='/' && url.substr(0,1)!='/' ){
@@ -154,33 +161,34 @@
} }
} }
axupimgs.res[file_i].url = url; 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]; var li = document.querySelectorAll('#file_list li')[file_i];
li.setAttribute('class','up-over'); li.setAttribute('class','up-over');
li.querySelector('.namebox span').innerText = filename; li.querySelector('.namebox span').innerText = filename;
n++ n++
upAllFiles(n); upAllFiles(n);
},function(err){ },function(err){
document.querySelector('#topbar .upall').innerText='全部上传'; // document.querySelector('#topbar .upall').innerText='全部上传';
document.querySelectorAll('#file_list li.up-now').forEach((el,i)=>{ // document.querySelectorAll('#file_list li.up-now').forEach((el,i)=>{
el.setAttribute('class','up-no'); // el.setAttribute('class','up-no');
}); // });
alert(err); // alert(err);
}); });
} }
} }
//
document.querySelector('#topbar .upall').addEventListener('click',(e)=>{ // document.querySelector('#topbar .upall').addEventListener('click',(e)=>{
if(e.target.innerText!='全部上传'){return false;} // if(e.target.innerText!='全部上传'){return false;}
if(axupimgs.res.length>0){ // if(axupimgs.res.length>0){
document.querySelectorAll('#file_list li.up-no').forEach((el,i)=>{ // document.querySelectorAll('#file_list li.up-no').forEach((el,i)=>{
el.classList ? el.classList.add('up-now') : el.className+=' up-now'; // el.classList ? el.classList.add('up-now') : el.className+=' up-now';
}); // });
e.target.innerText='上传中...'; // e.target.innerText='上传中...';
upAllFiles(0); // upAllFiles(0);
} // }
}); // });
var observ_flist = new MutationObserver( (muList,observe)=>{ var observ_flist = new MutationObserver( (muList,observe)=>{
if(muList[0].addedNodes.length>0){ if(muList[0].addedNodes.length>0){

139
src/assets/axupimgs/plugin.js
View File

@@ -1,76 +1,77 @@
tinymce.PluginManager.add('axupimgs', function(editor, url) { tinymce.PluginManager.add('axupimgs', function (editor, url) {
var pluginName='多图片上传'; var pluginName = '多图片上传';
window.axupimgs={}; //扔外部公共变量，也可以扔一个自定义的位置 window.axupimgs = {}; //扔外部公共变量，也可以扔一个自定义的位置
const baseURL = import.meta.env.VITE_BASE_URL const baseURL = import.meta.env.VITE_BASE_URL
// var baseURL=tinymce.baseURL; // var baseURL=tinymce.baseURL;
var iframe1 = '/upfiles.html'; var iframe1 = '/upfiles.html';
axupimgs.images_upload_handler = editor.getParam('images_upload_handler', undefined, 'function'); console.log('editor',editor)
axupimgs.images_upload_base_path = editor.getParam('images_upload_base_path', '','string'); 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.axupimgs_filetype = editor.getParam('axupimgs_filetype', '.png,.gif,.jpg,.jpeg', 'string');
axupimgs.res=[]; axupimgs.res = [];
var openDialog = function() { var openDialog = function () {
return editor.windowManager.openUrl({ return editor.windowManager.openUrl({
title: pluginName, title: pluginName,
size: 'large', size: 'large',
url:iframe1, url: iframe1,
buttons: [ buttons: [
{ {
type: 'cancel', type: 'cancel',
text: 'Close' text: 'Close'
}, },
{ {
type: 'custom', type: 'custom',
text: 'Save', text: 'Save',
name: 'save', name: 'save',
primary: true primary: true
}, },
], ],
onAction: function (api, details) { onAction: function (api, details) {
switch (details.name) { switch (details.name) {
case 'save': case 'save':
var html = ''; var html = '';
var imgs = axupimgs.res; var imgs = axupimgs.res;
var len = imgs.length; var len = imgs.length;
for(let i=0;i<len;i++){ for (let i = 0; i < len; i++) {
if( imgs[i].url ){ if (imgs[i].url) {
html += '<img src="'+imgs[i].url+'" />'; html += '<img src="' + imgs[i].url + '" />';
} }
} }
editor.insertContent(html); editor.insertContent(html);
axupimgs.res=[]; axupimgs.res = [];
api.close(); api.close();
break; break;
default: default:
break; break;
} }
} }
}); });
}; };
editor.ui.registry.getAll().icons.axupimgs || editor.ui.registry.addIcon('axupimgs','<svg viewBox="0 0 1280 1024" xmlns="http://www.w3.org/2000/svg" width="24" height="24"><path d="M1126.2,779.8V87.6c0-24-22.6-86.9-83.5-86.9H83.5C14.7,0.7,0,63.7,0,87.7v692c0,36.2,29.2,89.7,83.5,89.7l959.3-1.3c51.7,0,83.5-42.5,83.5-88.3zm-1044,4V86.3h961.6V783.7H82.2v0.1z" fill="#53565A"/><path d="M603,461.6L521.1,366.3,313,629.8,227.2,546.8,102.4,716.8H972.8v-170L768.2,235.2,603.1,461.6zM284.6,358.4a105.4,105.4,0,0,0,73.5-30c19.5-19.1,30.3-45,30.2-71.8,0-56.8-45.9-103-102.4-103-56.6,0-102.4,46.1-102.4,103C183.4,313.5,228,358.4,284.6,358.4z" fill="#9598A0"/><path d="M1197.7,153.6l-0.3,669.3s13.5,113.9-67.4,113.9H153.6c0,24.1,23.9,87.2,83.5,87.2h959.3c58.3,0,83.6-49.5,83.6-89.9V240.8c-0.1-41.8-44.9-87.2-82.3-87.2z" fill="#53565A"/></svg>'); editor.ui.registry.getAll().icons.axupimgs || editor.ui.registry.addIcon('axupimgs', '<svg viewBox="0 0 1280 1024" xmlns="http://www.w3.org/2000/svg" width="24" height="24"><path d="M1126.2,779.8V87.6c0-24-22.6-86.9-83.5-86.9H83.5C14.7,0.7,0,63.7,0,87.7v692c0,36.2,29.2,89.7,83.5,89.7l959.3-1.3c51.7,0,83.5-42.5,83.5-88.3zm-1044,4V86.3h961.6V783.7H82.2v0.1z" fill="#53565A"/><path d="M603,461.6L521.1,366.3,313,629.8,227.2,546.8,102.4,716.8H972.8v-170L768.2,235.2,603.1,461.6zM284.6,358.4a105.4,105.4,0,0,0,73.5-30c19.5-19.1,30.3-45,30.2-71.8,0-56.8-45.9-103-102.4-103-56.6,0-102.4,46.1-102.4,103C183.4,313.5,228,358.4,284.6,358.4z" fill="#9598A0"/><path d="M1197.7,153.6l-0.3,669.3s13.5,113.9-67.4,113.9H153.6c0,24.1,23.9,87.2,83.5,87.2h959.3c58.3,0,83.6-49.5,83.6-89.9V240.8c-0.1-41.8-44.9-87.2-82.3-87.2z" fill="#53565A"/></svg>');
editor.ui.registry.addButton('axupimgs', { editor.ui.registry.addButton('axupimgs', {
icon: 'axupimgs', icon: 'axupimgs',
tooltip: pluginName, tooltip: pluginName,
onAction: function() { onAction: function () {
openDialog(); openDialog();
} }
}); });
editor.ui.registry.addMenuItem('axupimgs', { editor.ui.registry.addMenuItem('axupimgs', {
icon: 'axupimgs', icon: 'axupimgs',
text: '图片批量上传...', text: '图片批量上传...',
onAction: function() { onAction: function () {
openDialog(); openDialog();
} }
}); });
return { return {
getMetadata: function() { getMetadata: function () {
return { return {
name: pluginName, name: pluginName,
url: "http://tinymce.ax-z.cn/more-plugins/axupimgs.php", url: "http://tinymce.ax-z.cn/more-plugins/axupimgs.php",
}; };
} }
}; };
}); });

73
src/components/Tinymce.vue
View File

@@ -70,11 +70,11 @@ const props = defineProps({
type: [String, Array], 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;" 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, type: String,
default: 'auto' default: 'auto'
}, },
height:{ height: {
type: Number, type: Number,
default: 500 default: 500
} }
@@ -90,7 +90,7 @@ const init = reactive({
placeholder: "在这里输入文字", //textarea中的提示信息 placeholder: "在这里输入文字", //textarea中的提示信息
min_width: 300, min_width: 300,
min_height: 200, min_height: 200,
width:props.width, width: props.width,
height: props.height, //注：引入autoresize插件时，此属性失效 height: props.height, //注：引入autoresize插件时，此属性失效
resize: "both", //编辑器宽高是否可变，false-否,true-高可变，'both'-宽高均可，注意引号 resize: "both", //编辑器宽高是否可变，false-否,true-高可变，'both'-宽高均可，注意引号
promotion: false, promotion: false,
@@ -117,9 +117,15 @@ const init = reactive({
let formData = new FormData() let formData = new FormData()
formData.append('file', blobInfo.blob()) 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) => { file_picker_callback: (callback, value, meta) => {
// 使用案例http://tinymce.ax-z.cn/general/upload-images.php // 使用案例http://tinymce.ax-z.cn/general/upload-images.php
// meta.filetype //根据这个判断点击的是什么file image media // meta.filetype //根据这个判断点击的是什么file image media
@@ -141,34 +147,34 @@ const init = reactive({
let xhr, formData; let xhr, formData;
xhr = new XMLHttpRequest(); xhr = new XMLHttpRequest();
xhr.withCredentials = false; 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( xhr.setRequestHeader(
'Authorization',getToken() 'Authorization', getToken()
) )
let loading= ElLoading.service({ let loading = ElLoading.service({
lock: true, lock: true,
text: '文件上传中...', text: '文件上传中...',
background: 'rgba(0, 0, 0, 0.7)', background: 'rgba(0, 0, 0, 0.7)',
}) })
xhr.onload = function() { xhr.onload = function () {
let res; let res;
// if (xhr.status != 200) { // if (xhr.status != 200) {
// failure('HTTP Error: ' + xhr.status); // failure('HTTP Error: ' + xhr.status);
// return; // return;
// } // }
res = JSON.parse(xhr.responseText); res = JSON.parse(xhr.responseText);
ElNotification({ ElNotification({
title: '提示', title: '提示',
message: res.code === 1000 ? '上传成功' : '上传失败', message: res.code === 1000 ? '上传成功' : '上传失败',
type: res.code === 1000 ? 'success' : 'error' type: res.code === 1000 ? 'success' : 'error'
}) })
loading.close() loading.close()
const fileUrl = res.data.url; const fileUrl = res.data.url;
// '?fileId='+res.data.id+ // '?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 = new FormData();
formData.append('file', file, file.name ); formData.append('file', file, file.name);
xhr.send(formData); xhr.send(formData);
// //
// let reader = new FileReader(); // let reader = new FileReader();
@@ -192,12 +198,16 @@ const init = reactive({
watch(() => { watch(() => {
emit("update:value", content.value); emit("update:value", content.value);
}); });
const uploadFile = (formData, url,success) => { const uploadFile = (formData, url, success, isLoading) => {
let loading= ElLoading.service({ let loading = null
lock: true, if (isLoading) {
text: '图片上传中...', loading = ElLoading.service({
background: 'rgba(0, 0, 0, 0.7)', lock: true,
}) text: '图片上传中...',
background: 'rgba(0, 0, 0, 0.7)',
})
}
axios.post( axios.post(
import.meta.env.VITE_BASE_URL + url, import.meta.env.VITE_BASE_URL + url,
formData, formData,
@@ -214,16 +224,24 @@ const uploadFile = (formData, url,success) => {
let data = res.data let data = res.data
if (data.code !== 1000) { if (data.code !== 1000) {
ElMessage.error(data.msg) ElMessage.error(data.msg)
loading.close() if (loading) {
}else { loading.close()
success(data.data.url) }
loading.close() } else {
if (isLoading) {
success(data.data.url)
} else {
success(data.data.url, data.data.originalFilename)
}
if (loading) {
loading.close()
}
} }
}) })
} }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.tox-sidebar-wrap{ .tox-sidebar-wrap {
&::-webkit-scrollbar { &::-webkit-scrollbar {
width: 6px; width: 6px;
} }
@@ -240,13 +258,14 @@ const uploadFile = (formData, url,success) => {
border-radius: 10px; border-radius: 10px;
} }
} }
.tinymce-boxz > textarea { .tinymce-boxz > textarea {
display: none; display: none;
} }
</style> </style>
<style lang="scss"> <style lang="scss">
/* 隐藏apikey没有绑定当前域名的提示 */ /* 隐藏apikey没有绑定当前域名的提示 */
.tox-notifications-container .tox-notification--warning { .tox-notifications-container .tox-notification--warning {
display: none !important; display: none !important;

2
src/views/system/user/index.vue
View File

@@ -57,7 +57,7 @@
</div> </div>
<paging :current-page="pageInfo.pageNum" :page-size="pageInfo.pageSize" :page-sizes="[10, 20, 30, 40,50]" <paging :current-page="pageInfo.pageNum" :page-size="pageInfo.pageSize" :page-sizes="[10, 20, 30, 40,50]"
:total="total" @changeSize="handleSizeChange" @goPage="handleCurrentChange"/> :total="total" @changeSize="handleSizeChange" @goPage="handleCurrentChange"/>
<user-picker :multiple="true" ref="userPicker" title="请选择研发人员" v-model:value="userList" @ok="selected"/> <user-picker :multiple="true" ref="userPicker" title="请选择次账号" v-model:value="userList" @ok="selected"/>
</template> </template>
<script setup lang="jsx"> <script setup lang="jsx">