import html2canvas from 'html2canvas';
import JsPDF from 'jspdf';
// 文件流转base64
export const getBase64 = (img, callback) => {
const reader = new FileReader();
reader.addEventListener('load', () => callback(reader.result));
reader.readAsDataURL(img);
};
// 时间戳转日期
export const stamp2Date = (timestamp) => {
let len = String(timestamp).length;
if (len < 13) {
timestamp = timestamp * 1000;
}
let date = new Date(timestamp); //时间戳为10位需*1000,时间戳为13位的话不需乘1000
let Y = date.getFullYear() + '-';
let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
let D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
let h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
let m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
let s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
return Y + M + D; //+h+m+s;
};
// 获取随机ID
export const guid = () => {
const s4 = () => {
return Math.floor((1 + Math.random()) * 0x10000)
.toString(16)
.substring(1);
};
return s4() + s4();
};
/**
* @num: 待添加千位分隔符的数字。
* @return: string 123,456,789
*/
export const thousandFormat = (num) => {
return (
num &&
num.toString().replace(/\d+/, function (s) {
return s.replace(/(\d)(?=(\d{3})+$)/g, '$1,');
})
);
};
// html转pdf
/**
* @param ele 要生成 pdf 的DOM元素(容器)
* @param padfName PDF文件生成后的文件名字
* */
export function downloadPDF(ele, pdfName) {
window.scrollTo(0, 0);
let w = ele.clientWidth; //获取屏幕宽度
let h = ele.clientHeight; //获取屏幕高度
let scale = 1;
//一页pdf显示html页面生成的canvas高度;
let canvas = document.createElement('canvas');
canvas.width = w * scale;
canvas.height = h * scale;
canvas.style.width = w * scale + 'px';
canvas.style.height = h * scale + 'px';
canvas.getContext('2d').scale(scale, scale);
let opt = {
scale: scale, //添加scale 参数
canvas: canvas, //自定义canvas
logging: false,
width: w, //canvas 宽度
hieght: h, //canvas 高度
useCORS: true, //开启跨域
};
html2canvas(ele, opt).then((canvas) => {
var pdf = new JsPDF('p', 'mm', 'a4'); //A4纸,纵向
var ctx = canvas.getContext('2d'),
a4w = 190,
a4h = 274, //A4大小,210mm x 297mm,四边各保留10mm的边距,显示区域190x277
imgHeight = Math.floor((a4h * canvas.width) / a4w), //按A4显示比例换算一页图像的像素高度
renderedHeight = 0;
while (renderedHeight < canvas.height) {
var page = document.createElement('canvas');
page.width = canvas.width;
page.height = Math.min(imgHeight, canvas.height - renderedHeight); //可能内容不足一页 //用getImageData剪裁指定区域,并画到前面创建的canvas对象中
page
.getContext('2d')
.putImageData(
ctx.getImageData(
0,
renderedHeight,
canvas.width,
Math.min(imgHeight, canvas.height - renderedHeight),
),
0,
0,
);
pdf.addImage(
page.toDataURL('image/jpeg', 1.0),
'JPEG',
10,
10,
a4w,
Math.min(a4h, (a4w * page.height) / page.width),
); //添加图像到页面,保留10mm边距
renderedHeight += imgHeight;
if (renderedHeight < canvas.height) {
pdf.addPage(); //如果后面还有内容,添加一个空页
}
}
//可动态生成
pdf.save(pdfName);
});
}
//
// 获取元素距离可视区域顶部、左部的距离
export const getOffset = (ele) => {
var top = ele.offsetTop;
var left = ele.offsetLeft;
while (ele.offsetParent) {
ele = ele.offsetParent;
if (window.navigator.userAgent.indexOf('MSTE 8') > -1) {
top += ele.offsetTop;
left += ele.offsetLeft;
} else {
top += ele.offsetTop + ele.clientTop;
left += ele.offsetLeft + ele.clientLeft;
}
}
return {
left: left,
top: top,
};
};
// 获取元素距离可视区域顶部、左部的距离
export const getOffset = (ele) => {
var top = ele.offsetTop;
var left = ele.offsetLeft;
while (ele.offsetParent) {
ele = ele.offsetParent;
if (window.navigator.userAgent.indexOf('MSTE 8') > -1) {
top += ele.offsetTop;
left += ele.offsetLeft;
} else {
top += ele.offsetTop + ele.clientTop;
left += ele.offsetLeft + ele.clientLeft;
}
}
return {
left: left,
top: top,
};
};
//
export const getSize = () => {
let windowW, windowH, contentH, contentW, scrollT;
windowH = window.innerHeight;
windowW = window.innerWidth;
scrollT = document.documentElement.scrollTop || document.body.scrollTop;
contentH =
document.documentElement.scrollHeight > document.body.scrollHeight
? document.documentElement.scrollHeight
: document.body.scrollHeight;
contentW =
document.documentElement.scrollWidth > document.body.scrollWidth
? document.documentElement.scrollWidth
: document.body.scrollWidth;
return { windowW, windowH, contentH, contentW, scrollT };
};
export const getDownload = (path) => `main/file/download?path=${path}`;
// 模拟a标签下载
export const getADownload = (url, name) => {
let a = document.createElement('a');
a.download = name;
a.href = url;
a.click();
};
// 模拟a标签下载(Blob)
export const getBlobADownload = (data, name) => {
const url = window.URL.createObjectURL(data);
getADownload(url, name);
};
//判断文件后缀名
export const FileType = (fileName) => {
let reg = /.docx|.pdf|.xls|.doc|.txt/;
return reg.test(fileName);
};
//判断图片后缀名
export const PictureType = (fileName) => {
let reg = /(?:png|jpg|jpeg|gif|svg)$/;
return reg.test(fileName);
};
// 获取文件后缀名
export const getSuffix = (fileName) => {
return fileName.substring(fileName.lastIndexOf('.') + 1);
};
// 获取url参数
export const getHashParam = (queryString, name) => {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"),
queryString = queryString.split("?")[1] || "",
result = queryString.match(reg);
return result ? decodeURIComponent(result[2]) : null;
};
// 获取url参数
export const getHashParamHref = (name) => {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"),
queryString = window.location.hash.split("?")[1] || "",
result = queryString.match(reg);
return result ? decodeURIComponent(result[2]) : null;
};
一些常用公共方法
于 2022-08-01 09:54:39 首次发布