提交 54637ac0 authored 作者: 钟是志's avatar 钟是志

文件上传服务修改

上级 f8ad0292
import { queryApiActionPath } from '@/webPublic/one_stop_public/utils/queryConfig';
export default function getOneStopUploadUrl(){
return queryApiActionPath() + '/upload';
}
import React from "react"; import React from 'react';
import {queryApiActionPath} from "@/webPublic/one_stop_public/utils/queryConfig"; import { queryApiActionPath } from '@/webPublic/one_stop_public/utils/queryConfig';
import {getToken} from "@/webPublic/one_stop_public/utils/token"; import { getToken } from '@/webPublic/one_stop_public/utils/token';
import { isFromIframe } from '@/webPublic/one_stop_public/utils/utils'; import { isFromIframe } from '@/webPublic/one_stop_public/utils/utils';
import getOneStopUploadUrl from '@/webPublic/one_stop_public/Base16/getOneStopUploadUrl';
const oneSetItemP = { const oneSetItemP = {
marginBottom: 0, marginBottom: 0,
...@@ -10,7 +11,13 @@ const oneSetItemP = { ...@@ -10,7 +11,13 @@ const oneSetItemP = {
let startX = 0; let startX = 0;
let startY = 0; let startY = 0;
const ShowItem = ({ basicUrl, type, x, y, ...otherInfo }) => { const ShowItem = ({
basicUrl,
type,
x,
y,
...otherInfo
}) => {
switch (type) { switch (type) {
case 'image': case 'image':
return ( return (
...@@ -53,14 +60,14 @@ const ShowItem = ({ basicUrl, type, x, y, ...otherInfo }) => { ...@@ -53,14 +60,14 @@ const ShowItem = ({ basicUrl, type, x, y, ...otherInfo }) => {
export const dragEventList = (setOtherProps, otherProps) => { export const dragEventList = (setOtherProps, otherProps) => {
let draggedRef = null; let draggedRef = null;
let documentThis = isFromIframe() ? window?.parent?.document : document; let documentThis = isFromIframe() ? window?.parent?.document : document;
documentThis.onmousedown = function(evt){ documentThis.onmousedown = function (evt) {
startX = evt.offsetX; startX = evt.offsetX;
startY = evt.offsetY; startY = evt.offsetY;
} };
documentThis.addEventListener( documentThis.addEventListener(
'dragstart', 'dragstart',
function(event) { function (event) {
// 保存拖动元素的引用(ref.) // 保存拖动元素的引用(ref.)
draggedRef = event.target; draggedRef = event.target;
event.target.style.opacity = 0.2; event.target.style.opacity = 0.2;
...@@ -91,13 +98,14 @@ export const dragEventList = (setOtherProps, otherProps) => { ...@@ -91,13 +98,14 @@ export const dragEventList = (setOtherProps, otherProps) => {
// 阻止默认动作(如打开一些元素的链接) // 阻止默认动作(如打开一些元素的链接)
event.preventDefault(); event.preventDefault();
// 将拖动的元素到所选择的放置目标节点中 // 将拖动的元素到所选择的放置目标节点中
let infoClientRect = documentThis.getElementById('dropZone').getBoundingClientRect(); let infoClientRect = documentThis.getElementById('dropZone')
.getBoundingClientRect();
// console.log(startX, typeof startX, startY); // console.log(startX, typeof startX, startY);
// return ; // return ;
let leftNew = Math.ceil(event.clientX - infoClientRect.left) - startX; let leftNew = Math.ceil(event.clientX - infoClientRect.left) - startX;
let topNew = Math.ceil(event.clientY - infoClientRect.top) - startY; let topNew = Math.ceil(event.clientY - infoClientRect.top) - startY;
// console.log(leftNew, topNew); // console.log(leftNew, topNew);
if(leftNew < 0 || leftNew > infoClientRect.width || topNew < 0 || topNew > infoClientRect.height){ if (leftNew < 0 || leftNew > infoClientRect.width || topNew < 0 || topNew > infoClientRect.height) {
console.log('拖拽到了图片区域外部,不能进行拖拽'); console.log('拖拽到了图片区域外部,不能进行拖拽');
return false; return false;
} }
...@@ -106,7 +114,7 @@ export const dragEventList = (setOtherProps, otherProps) => { ...@@ -106,7 +114,7 @@ export const dragEventList = (setOtherProps, otherProps) => {
let item = otherProps.signConfig.find((g) => { let item = otherProps.signConfig.find((g) => {
return g.key === key; return g.key === key;
}); });
if(!item){ if (!item) {
return false; return false;
} }
item.x = leftNew; item.x = leftNew;
...@@ -114,23 +122,25 @@ export const dragEventList = (setOtherProps, otherProps) => { ...@@ -114,23 +122,25 @@ export const dragEventList = (setOtherProps, otherProps) => {
setOtherProps({ setOtherProps({
...otherProps, ...otherProps,
signConfig: otherProps.signConfig, signConfig: otherProps.signConfig,
}) });
draggedRef.style.left = leftNew; // `${left}px`; draggedRef.style.left = leftNew; // `${left}px`;
draggedRef.style.top = topNew; // `${top}px`; draggedRef.style.top = topNew; // `${top}px`;
return true; return true;
}, },
false, false,
); );
} };
export const uploadFile = (file) => { export const uploadFile = (file) => {
let url = queryApiActionPath() + '/upload?token=' + getToken(); let url = getOneStopUploadUrl();
const formData = new FormData(); const formData = new FormData();
formData.append('file', file); formData.append('file', file);
formData.append('token', getToken());
return fetch(url, { return fetch(url, {
method: 'POST', method: 'POST',
headers: { headers: {
Accept: '*/*', Accept: '*/*',
Authorization: `bearer ${getToken()}`,
}, },
body: formData, body: formData,
}) })
...@@ -139,8 +149,8 @@ export const uploadFile = (file) => { ...@@ -139,8 +149,8 @@ export const uploadFile = (file) => {
}) })
.then((res) => { .then((res) => {
return res; return res;
}) });
} };
// 将图片宽度确定 高度按比例调整后返回一张新的图片 // 将图片宽度确定 高度按比例调整后返回一张新的图片
...@@ -148,14 +158,14 @@ export const zipImage = (path, fileName, limitWidth = 1200) => { ...@@ -148,14 +158,14 @@ export const zipImage = (path, fileName, limitWidth = 1200) => {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
let image = new Image(); //新建一个img标签(还没嵌入DOM节点) let image = new Image(); //新建一个img标签(还没嵌入DOM节点)
let imageUrl = queryApiActionPath() + path; let imageUrl = queryApiActionPath() + path;
image.setAttribute("crossOrigin",'Anonymous'); image.setAttribute('crossOrigin', 'Anonymous');
image.src = imageUrl; image.src = imageUrl;
image.onload = () => { image.onload = () => {
const canvas = document.createElement('canvas'); const canvas = document.createElement('canvas');
const context = canvas.getContext('2d'); const context = canvas.getContext('2d');
const imageWidth = limitWidth; const imageWidth = limitWidth;
const ratio = image.width / limitWidth; // 按宽度固定 压缩图片 const ratio = image.width / limitWidth; // 按宽度固定 压缩图片
if(ratio === 1 || isNaN(ratio)){ if (ratio === 1 || isNaN(ratio)) {
resolve(path); resolve(path);
return true; return true;
} }
...@@ -179,10 +189,11 @@ export const zipImage = (path, fileName, limitWidth = 1200) => { ...@@ -179,10 +189,11 @@ export const zipImage = (path, fileName, limitWidth = 1200) => {
return new File([u8arr], filename, { type: mime }); return new File([u8arr], filename, { type: mime });
}; };
let file = dataURLtoFile(data, fileName); let file = dataURLtoFile(data, fileName);
uploadFile(file).then((res) => { uploadFile(file)
if(res){ .then((res) => {
if (res) {
resolve(res); resolve(res);
}else{ } else {
resolve(path); resolve(path);
} }
}); });
...@@ -194,4 +205,4 @@ export const zipImage = (path, fileName, limitWidth = 1200) => { ...@@ -194,4 +205,4 @@ export const zipImage = (path, fileName, limitWidth = 1200) => {
}; };
export default ShowItem export default ShowItem;
...@@ -128,6 +128,8 @@ const loginUmiRequest = extend({ ...@@ -128,6 +128,8 @@ const loginUmiRequest = extend({
const getUrl = url => (url.startsWith('/') ? url : '/' + url); const getUrl = url => (url.startsWith('/') ? url : '/' + url);
export const request = (url, data, options = {}) => { export const request = (url, data, options = {}) => {
return giveBase16EnCode(data, url) return giveBase16EnCode(data, url)
.then((newData) => { .then((newData) => {
if(typeof newData === 'object' && newData.url && newData.datas){ if(typeof newData === 'object' && newData.url && newData.datas){
......
import request from '@/utils/request'; import request from '@/utils/request';
import config from '@/config/config'; import config, { getUploadUrl } from '@/config/config';
import { getToken } from '@/utils/authority';
const uploadUrl = config.uploadUrl.split('?')[0]; const uploadUrl = getUploadUrl();
export default function uploadFile(params) { export default function uploadFile(params) {
return request(uploadUrl, { return request(uploadUrl, {
method: 'POST', method: 'POST',
headers: {
Authorization: `bearer ${getToken()}`,
},
body: params, body: params,
}); });
} }
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论