問題場景： 對于主機監(jiān)控來說示损，頁面需要對存儲單位進行換算后再展示寿弱，還有主機大小(帶單位)的排序問題犯眠。
- 初始化插件工程
vue init webpack-simple vue-unit-convertsort
- 寫方法 根目錄下新建convertsort.js
/**
* storageUnit對象
*/
const StorageUnit = {};
/**
* 將B、MB症革、KB等轉(zhuǎn)為字節(jié)接口
* @param {帶單位的字符串} str
*/
const convertToB = (str) => {
if (str) {
const strLenght = str.length;
const num = Number(str.substring(0, strLenght - 2));
const unit = str.substring(strLenght - 2, strLenght);
const k = 1024;
const sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
if (sizes.includes(unit.toUpperCase())) {
const i = sizes.findIndex(value => value === unit.toUpperCase());
return Math.floor(num * (k ** i));
}
return Number(str.substring(0, strLenght - 1));
// return Math.floor(Number(num) * 100);
}
return 0;
};
/**
* 將字節(jié)轉(zhuǎn)為B筐咧、MB、KB等接口(轉(zhuǎn)為最大的單位或特定單位)
* @param {字節(jié)} bytes
* @param {保留幾位小數(shù)} fixNum
*/
const convertBTo = (bytes, fixNum, unit) => {
const bytesTmp = Number(bytes);
const k = 1024;
const sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
const fixNumTmp = Number(fixNum) >= 0 ? fixNum : 2;
const result = {
num: 0,
unit: 'B',
numUnit: '0B',
};
if (bytesTmp === 0) return result;
if (unit && sizes.includes(unit.toUpperCase())) {
const i = sizes.findIndex(value => value === unit.toUpperCase());
result.num = Number((bytesTmp / (k ** i)).toFixed(fixNumTmp));
result.unit = unit.toUpperCase();
result.numUnit = `${result.num}${result.unit}`;
return result;
}
const i = Math.floor(Math.log(bytesTmp) / Math.log(k));
result.num = Number((bytesTmp / (k ** i)).toFixed(fixNumTmp));
result.unit = sizes[i];
result.numUnit = `${result.num}${result.unit}`;
return result;
};
/**
* 排序
* @param {...any} para
* 參數(shù)： 1.類型(必傳)：num噪矛、string; 2.排序(必傳)： 升序(ascending || asc)分预、降序(descending || desc)；3.排序字段(必傳); 4.按后綴字段朝刊、按MB负懦、KB帶單位(選傳)
*/
const sortArr = (...para) => {
let result = '';
result = (obj1, obj2) => {
let val1 = obj1[para[2]] ? obj1[para[2]] : '';
let val2 = obj2[para[2]] ? obj2[para[2]] : '';
if (para[3] === 'suffix') {
val1 = val1.substring(val1.lastIndexOf('.') + 1, val1.length);
val2 = val2.substring(val2.lastIndexOf('.') + 1, val2.length);
}
if (para[3] === 'unit') {
val1 = convertToB(val1);
val2 = convertToB(val2);
}
if (para[0] === 'num') {
val1 = Number(val1);
val2 = Number(val2);
return (para[1].toUpperCase() === 'ASCENDING' || para[1].toUpperCase() === 'ASC')? (val1 - val2) : (val2 - val1);
}
if (val1 < val2) {
return (para[1].toUpperCase() === 'ASCENDING' || para[1].toUpperCase() === 'ASC') ? -1 : 1;
} else if (val1 > val2) {
return (para[1].toUpperCase() === 'ASCENDING' || para[1].toUpperCase() === 'ASC') ? 1 : -1;
}
return 0;
};
return result;
};
/**
* table前端排序字段
* @param {...any} para
* 參數(shù): 1.類型(必傳)：num、string; 2.排序(必傳)： 升序(ascending || asc)雷袋、降序(descending || desc)吉殃；
* 3.排序字段(必傳)；4.排序數(shù)據(jù)(必傳); 5.后綴字段楷怒、按MB蛋勺、KB帶單位(選傳)
*/
const sortExp = (...para) => {
const result = para[3].sort(sortArr(para[0], para[1], para[2], para[4], para[5]));
return result;
};
StorageUnit.convertToB = convertToB;
StorageUnit.convertBTo = convertBTo;
StorageUnit.sortExp = sortExp;
module.exports = StorageUnit;
- 發(fā)布npm
在要發(fā)布的項目中執(zhí)行
npm login
輸入用戶名、密碼鸠删、郵箱
npm publish
