otb-module
Version:
otb-module是基于现有的element-ui库进行的二次封装，简化组件的各自用法，将所有基础组件归纳于一个表单中， 集成表单组件，另还有增删改查的CRUD组件、预览图片/PDF的preview组件、上传文件的upload组件、分页组件与导出组件等等。 引入组件后以数据驱动组件从而加载Dom，让开发变得更简单，让代码更易维护。
491 lines (447 loc) • 12.2 kB
JavaScript
// OTB 的工具
import {linkList} from "otb-module/src/utils/config"
// 计算文件大小
export const fileSize = (value) => {
let {b, kb, mb, gb, tb} = {b: parseInt(value), kb: 0, mb: 0, gb: 0, tb: 0};
if (b >= 1024) kb = b / 1024;
if (kb >= 1024) mb = kb / 1024;
if (mb >= 1024) gb = mb / 1024;
if (gb >= 1024) tb = gb / 1024;
const name = tb ? "Tb" : gb ? "Gb" : mb ? "Mb" : kb ? "Kb" : "字节";
const size = tb || (gb || (mb || (kb || b)));
return value < 1024 ? `${size}字节` : `${size.toFixed(2).toLocaleString() + name}`;
};
// 数据校验
export const regular = {
link: /^(https?:|mailto:|tel:)/,
number: /[^\d]/g,
decimals: /[^\\d.]/g,
phone: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
bank: /^([1-9]{1})(\d{15}|\d{16}|\d{18})$/,
idCard: /^\d{6}(18|19|20)?\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}(\d|X)$/i
};
// 排除校验
export const checkout = (value, type) => {
let reg = regular[type];
if (!reg) return "不存在此校验类型";
return value.replace(reg, "");
};
// 校验身份证
export const idCardVerify = (code) => {
let city = {
11: "北京",
12: "天津",
13: "河北",
14: "山西",
15: "内蒙古",
21: "辽宁",
22: "吉林",
23: "黑龙江 ",
31: "上海",
32: "江苏",
33: "浙江",
34: "安徽",
35: "福建",
36: "江西",
37: "山东",
41: "河南",
42: "湖北 ",
43: "湖南",
44: "广东",
45: "广西",
46: "海南",
50: "重庆",
51: "四川",
52: "贵州",
53: "云南",
54: "西藏 ",
61: "陕西",
62: "甘肃",
63: "青海",
64: "宁夏",
65: "新疆",
71: "台湾",
81: "香港",
82: "澳门",
91: "国外 ",
};
if (type(code) !== "String") return `身份证来源类型 ${type(code)} 不是 String 类型`;
if (!code || !regular["idCard"].test(code)) return "身份证号格式错误";
if (!city[code.substr(0, 2)]) return "身份证输入错误";
// 18位身份证需要验证最后一位校验位
if (code.length === 18) {
code = code.split("");
// ∑(ai×Wi)(mod 11)
// 加权因子
let factor = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
// 校验位
let parity = ["1", "0", "X", "9", "8", "7", "6", "5", "4", "3", "2"];
let sum = 0;
let ai = 0;
let wi = 0;
for (let i = 0; i < 17; i++) {
ai = code[i];
wi = factor[i];
sum += ai * wi;
}
if (parity[sum % 11] !== code[17]) return "身份证输入错误";
}
return true;
};
// 判断校验
export const validator = (value, type) => {
let reg = regular[type];
if (!reg) return "不存在此校验类型";
if (type === "idCard") return idCardVerify(value);
return reg.test(value);
};
// 递归获取所需对象
export const getObject = (target = [], id = 0, props = {}) => {
if (!props) props = {
id: "id",
children: "children"
}
let resultObj = {};
const setObj = (obj) => {
if (obj[props.id] === id && type(obj) === "Object") {
resultObj = obj;
return;
}
if (obj[props.children] && type(obj[props.children]) === "Array") {
for (const child of obj[props.children]) {
setObj(child);
}
}
};
if (type(target) === "Array") {
for (const child of target) {
setObj(child);
}
} else if (type(target) === "Object") {
setObj(target);
} else {
return "目标既不是数组也不是对象";
}
return resultObj;
};
// 获取顶级节点
export const getTopNode = (
target = [],
id,
parentId,
idField = "id",
parentIdField = "parentId",
children = "children"
) => {
if (!(["number", "string"].includes(typeof id))) {
return "主键既不是数字也不是字符串";
}
const resultArr = [];
const setObj = (obj) => {
if (obj && obj instanceof Object) {
resultArr.push(obj);
}
if (obj[children] && obj[children] instanceof Array) {
for (const child of obj[children]) {
setObj(child);
}
}
};
if (target instanceof Array) {
for (const child of target) {
setObj(child);
}
} else if (target instanceof Object) {
setObj(target);
} else {
return "目标既不是数组也不是对象";
}
let resultNode = {};
let nowId = id;
const getNode = () => {
resultArr.forEach(item => {
if (item[idField] === nowId) {
if (item[parentIdField] === parentId) {
resultNode = item;
} else {
nowId = item[parentIdField];
getNode();
}
}
});
};
getNode();
return resultNode;
};
// tree按某个字段排序
export const treeSort = (target = [], rank = "asc", field = "sort", children = "children") => {
const setObj = (obj) => {
if (obj[children] && obj[children] instanceof Array) {
sort(obj[children], rank, field);
for (const child of obj[children]) {
setObj(child);
}
}
};
if (target instanceof Array) {
sort(target, rank, field);
target.forEach(item => {
if (item[children] && item[children] instanceof Array) {
setObj(item);
}
});
} else if (target instanceof Object && target[children]) {
setObj(target);
} else {
return "目标既不是数组也不是对象";
}
return target;
};
// 路由跳转
export const go = (code, params) => {
if (regular.link.test(code)) {
window.open(code);
return;
}
if (code === "BACK") {
history.go(-1);
return;
}
if (code.startsWith("/")) {
window.location.hash = code;
return;
}
if (linkList.length > 0) {
window.location.hash = linkList.filter(item => item.code === code)[0].url;
if (params) sessionStorage.setItem(code, params);
}
};
// 判断类型
export const type = (value) => {
let result = Object.prototype.toString.call(value);
if (result === "[object Array]") return "Array";
if (result === "[object Object]") return "Object";
if (result === "[object String]") return "String";
if (result === "[object Number]") return "Number";
if (result === "[object Undefined]") return "Undefined";
if (result === "[object Boolean]") return "Boolean";
if (result === "[object Function]") return "Function";
if (result === "[object Date]") return "Date";
};
// 浏览器信息
export const browserInfo = () => {
const userAgent = navigator.userAgent;
let name, version = null;
if (userAgent.indexOf('Chrome') !== -1 && userAgent.indexOf('Safari') !== -1) {
name = "Chrome";
version = userAgent.match(/Chrome\/([\d.]+)/)[1];
}
if (userAgent.indexOf('Firefox') !== -1) {
name = "Firefox";
version = userAgent.match(/Firefox\/([\d.]+)/)[1];
}
if (userAgent.indexOf('Safari') !== -1 && userAgent.indexOf('Chrome') === -1) {
name = "Safari";
version = userAgent.match(/Safari\/([\d.]+)/)[1];
}
if (userAgent.indexOf('Opera') !== -1) {
name = "Opera";
version = userAgent.match(/OPR\/([\d.]+)/)[1];
}
if (userAgent.indexOf('Edge') !== -1) {
name = "Edge";
version = userAgent.match(/Edge\/([\d.]+)/)[1];
}
if (userAgent.indexOf('MSIE') !== -1) {
name = "MSIE";
version = userAgent.match(/MSIE ([\d.]+)/)[1];
}
return {name, version, major: version ? Number(version.split(".")[0]) : 0};
};
// 排序 数字数组 对象数组 字母数组
export const sort = (target = [], rank = "asc", field) => {
let compare;
let typeStr = type(target[0]);
if (rank === "asc") {
if (typeStr === "Number") {
compare = (val1, val2) => {
return val1 - val2;
};
} else if (typeStr === "Object") {
compare = (key) => {
return (obj1, obj2) => {
const val1 = obj1[key];
const val2 = obj2[key];
return val1 - val2;
};
};
} else if (typeStr === "String") {
compare = (val1, val2) => {
const v1 = val1.toUpperCase();
const v2 = val2.toUpperCase();
if (v1 < v2) {
return -1;
} else if (v1 > v2) {
return 1;
} else {
return 0;
}
};
}
} else if (rank === "desc") {
if (typeStr === "Number") {
compare = (val1, val2) => {
return val2 - val1;
};
} else if (typeStr === "Object") {
compare = (key) => {
return (obj1, obj2) => {
const val1 = obj1[key];
const val2 = obj2[key];
return val2 - val1;
};
};
} else if (typeStr === "String") {
compare = (val2, val1) => {
const v1 = val1.toUpperCase();
const v2 = val2.toUpperCase();
if (v1 < v2) {
return -1;
} else if (v1 > v2) {
return 1;
} else {
return 0;
}
};
}
}
if (field) {
return target.sort(compare(field));
} else {
return target.sort(compare);
}
};
// 判断文件链接文件类型
export const fileLinkFileType = (link) => {
return link.split(".").at(-1).toLowerCase();
};
// 文件链接文件名称
export const fileLinkFileName = (link) => {
return link.split("/").at(-1)
}
// Promise resolve
export const resolve = (params) => {
return new Promise((resolve) => resolve(params));
};
// Promise reject
export const reject = (params) => {
return new Promise((resolve, reject) => reject(params));
};
// 加法
Number.prototype.hAdd = function (arg) {
let r1, r2, m
try {
r1 = this.toString().split('.')[1].length
} catch (e) {
r1 = 0
}
try {
r2 = arg.toString().split('.')[1].length
} catch (e) {
r2 = 0
}
m = Math.pow(10, Math.max(r1, r2))
return (this * m + arg * m) / m
}
// 减法
Number.prototype.hSub = function (arg) {
let r1, r2, m, n
try {
r1 = this.toString().split('.')[1].length
} catch (e) {
r1 = 0
}
try {
r2 = arg.toString().split('.')[1].length
} catch (e) {
r2 = 0
}
m = Math.pow(10, Math.max(r1, r2))
// 动态控制精度长度
n = (r1 >= r2) ? r1 : r2
return Number(((this * m - arg * m) / m).toFixed(n))
}
// 乘法
Number.prototype.hMul = function (arg) {
let m = 0, s1 = this.toString(), s2 = arg.toString()
try {
m += s1.split('.')[1].length
} catch (e) {
console.log(e);
}
try {
m += s2.split('.')[1].length
} catch (e) {
console.log(e);
}
return Number(s1.replace('.', '')) * Number(s2.replace('.', '')) / Math.pow(10, m)
}
// 除法
Number.prototype.hDiv = function (arg) {
let t1 = 0, t2 = 0, r1, r2
try {
t1 = this.toString().split('.')[1].length
} catch (e) {
console.log(e);
}
try {
t2 = arg.toString().split('.')[1].length
} catch (e) {
console.log(e);
}
r1 = Number(this.toString().replace('.', ''))
r2 = Number(arg.toString().replace('.', ''))
return (r1 / r2) * Math.pow(10, t2 - t1)
}
// 三位分节法（千分位加逗号）
Number.prototype.toThousandsString = function () {
let str = this.toString()
let reg = str.indexOf('.') ? /(\d)(?=(\d{3})+\.)/g : /(\d)(?=(?:\d{3})+$)/g
return str.replace(reg, '$1,')
}
// 将一个数组分割成多个小数组
export const getSliceArray = (array, subArrayLength) => {
let index = 0;
let newArray = [];
while (index < array.length) {
newArray.push(array.slice(index, index += subArrayLength));
}
return newArray;
};
// uuid
export const uuid = () => {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {
let r = Math.random() * 16 | 0;
let v = c == 'x' ? r : (r & 0x3 | 0x8);
return v.toString(16);
});
};
// 改变element-ui的loading图标
export const elementUiLoadingSvgToIcon = (icon = "el-icon-loading", text = "Loading") => {
setTimeout(() => {
let elLoadingSvgList = document.getElementsByClassName("circular");
if (elLoadingSvgList.length > 0) {
let i = document.createElement('i');
let p = document.createElement('p');
i.className = icon;
p.className = "el-loading-text";
p.innerText = text;
for (let svg of elLoadingSvgList) {
let svgParent = svg.parentNode;
svgParent.innerHTML = "";
svgParent.appendChild(i)
svgParent.appendChild(p)
}
}
});
};