富文本编辑器,无法上传多个图片 #7076

pull/7199/head
JEECG 2024-08-29 20:26:01 +08:00
parent 4d48f9b500
commit 2b773d6e6b
2 changed files with 28 additions and 21 deletions

View File

@ -314,11 +314,12 @@
setValue(editor, content); setValue(editor, content);
} }
function handleDone(name: string, url: string) { async function handleDone(name: string, url: string) {
const editor = unref(editorRef); const editor = unref(editorRef);
if (!editor) { if (!editor) {
return; return;
} }
await handleImageUploading(name);
const content = editor?.getContent() ?? ''; const content = editor?.getContent() ?? '';
const val = content?.replace(getUploadingImgName(name), `<img src="${url}"/>`) ?? ''; const val = content?.replace(getUploadingImgName(name), `<img src="${url}"/>`) ?? '';
setValue(editor, val); setValue(editor, val);

View File

@ -17,13 +17,12 @@
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, computed } from 'vue'; import { defineComponent, computed, ref } from 'vue';
import { Upload } from 'ant-design-vue'; import { Upload } from 'ant-design-vue';
import { useDesign } from '/@/hooks/web/useDesign'; import { useDesign } from '/@/hooks/web/useDesign';
import { useGlobSetting } from '/@/hooks/setting'; import { useGlobSetting } from '/@/hooks/setting';
import { useI18n } from '/@/hooks/web/useI18n'; import { useI18n } from '/@/hooks/web/useI18n';
import { getToken } from '/@/utils/auth';
import { getFileAccessHttpUrl, getHeaders } from '/@/utils/common/compUtils'; import { getFileAccessHttpUrl, getHeaders } from '/@/utils/common/compUtils';
export default defineComponent({ export default defineComponent({
@ -55,6 +54,8 @@
} }
const { domainUrl } = useGlobSetting(); const { domainUrl } = useGlobSetting();
const uploadUrl = domainUrl + '/sys/common/upload'; const uploadUrl = domainUrl + '/sys/common/upload';
//
let uploadFileList = ref<any[]>([]);
//update-end-author:taoyan date:2022-5-13 for: //update-end-author:taoyan date:2022-5-13 for:
const { t } = useI18n(); const { t } = useI18n();
const { prefixCls } = useDesign('tinymce-img-upload'); const { prefixCls } = useDesign('tinymce-img-upload');
@ -66,27 +67,31 @@
}; };
}); });
function handleChange(info: Recordable) { function handleChange({ file, fileList }) {
const file = info.file; if (file.status === 'error') {
const status = file?.status;
//const url = file?.response?.url;
const name = file?.name;
if (status === 'uploading') {
if (!uploading) {
emit('uploading', name);
uploading = true;
}
} else if (status === 'done') {
//update-begin-author:taoyan date:2022-5-13 for:
let realUrl = getFileAccessHttpUrl(file.response.message);
emit('done', name, realUrl);
//update-end-author:taoyan date:2022-5-13 for:
uploading = false;
} else if (status === 'error') {
emit('error'); emit('error');
uploading = false; uploading = false;
} }
let files = [] as any;
let noUploadingFileCount = 0;
if (file.status != 'uploading') {
fileList.forEach((file) => {
if (file.status === 'done' && file.response.success) {
files.push(file);
}
if (file.status != 'uploading') {
noUploadingFileCount++;
}
});
}
if (noUploadingFileCount == fileList.length) {
fileList.forEach((file) => {
const name = file?.name;
let realUrl = getFileAccessHttpUrl(file.response.message);
emit('done', name, realUrl);
});
}
} }
return { return {
@ -97,6 +102,7 @@
getBizData, getBizData,
t, t,
getButtonProps, getButtonProps,
uploadFileList
}; };
}, },
}); });