2019-02-14 存儲單位(MB等單位)轉(zhuǎn)換、排序插件初嘗試

問題場景: 對于主機監(jiān)控來說示损,頁面需要對存儲單位進行換算后再展示寿弱,還有主機大小(帶單位)的排序問題犯眠。

  1. 初始化插件工程
vue init webpack-simple vue-unit-convertsort
  1. 寫方法 根目錄下新建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;

  1. 發(fā)布npm
在要發(fā)布的項目中執(zhí)行
npm login
輸入用戶名、密碼鸠删、郵箱
npm publish

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末抱完,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子刃泡,更是在濱河造成了極大的恐慌巧娱,老刑警劉巖,帶你破解...
    沈念sama閱讀 223,002評論 6 519
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件烘贴,死亡現(xiàn)場離奇詭異禁添,居然都是意外死亡,警方通過查閱死者的電腦和手機桨踪,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,357評論 3 400
  • 文/潘曉璐 我一進店門老翘,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事铺峭∧够常” “怎么了?”我有些...
    開封第一講書人閱讀 169,787評論 0 365
  • 文/不壞的土叔 我叫張陵卫键,是天一觀的道長傀履。 經(jīng)常有香客問我,道長莉炉,這世上最難降的妖魔是什么钓账? 我笑而不...
    開封第一講書人閱讀 60,237評論 1 300
  • 正文 為了忘掉前任,我火速辦了婚禮呢袱,結(jié)果婚禮上官扣,老公的妹妹穿的比我還像新娘。我一直安慰自己羞福,他們只是感情好惕蹄,可當(dāng)我...
    茶點故事閱讀 69,237評論 6 398
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著治专,像睡著了一般卖陵。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上张峰,一...
    開封第一講書人閱讀 52,821評論 1 314
  • 那天泪蔫,我揣著相機與錄音,去河邊找鬼喘批。 笑死撩荣,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的饶深。 我是一名探鬼主播餐曹,決...
    沈念sama閱讀 41,236評論 3 424
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼敌厘!你這毒婦竟也來了台猴?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 40,196評論 0 277
  • 序言:老撾萬榮一對情侶失蹤俱两,失蹤者是張志新(化名)和其女友劉穎饱狂,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體宪彩,經(jīng)...
    沈念sama閱讀 46,716評論 1 320
  • 正文 獨居荒郊野嶺守林人離奇死亡休讳,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,794評論 3 343
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了尿孔。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片衍腥。...
    茶點故事閱讀 40,928評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡磺樱,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出婆咸,到底是詐尸還是另有隱情,我是刑警寧澤芜辕,帶...
    沈念sama閱讀 36,583評論 5 351
  • 正文 年R本政府宣布尚骄,位于F島的核電站,受9級特大地震影響侵续,放射性物質(zhì)發(fā)生泄漏倔丈。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 42,264評論 3 336
  • 文/蒙蒙 一状蜗、第九天 我趴在偏房一處隱蔽的房頂上張望需五。 院中可真熱鬧,春花似錦轧坎、人聲如沸宏邮。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,755評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽蜜氨。三九已至,卻和暖如春捎泻,著一層夾襖步出監(jiān)牢的瞬間飒炎,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,869評論 1 274
  • 我被黑心中介騙來泰國打工笆豁, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留郎汪,地道東北人。 一個月前我還...
    沈念sama閱讀 49,378評論 3 379
  • 正文 我出身青樓闯狱,卻偏偏與公主長得像煞赢,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子扩氢,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,937評論 2 361

推薦閱讀更多精彩內(nèi)容