vue+elementUI開發過程常用方法封裝

/*
 * Created by luoxuemei on 2019/09/02.
 */

// 拖動調整左右兩側div的寬度
// resizeName表示拖到的工具條的className
// left表示左邊的區域的className。leftWid表示左邊的最小寬度
// midName表示右邊區域的className。rightWid表示右邊的最小寬度
// boxName表示父級元素的className
import moment from 'moment'; 
export function  dragControllerDiv(resizeName='resize', leftName = 'left', midName = 'mid', boxName = 'box', leftWid = 250, rightWid = 800){
  var resize = document.getElementsByClassName(resizeName);
  var left = document.getElementsByClassName(leftName);
  var mid = document.getElementsByClassName(midName);
  var box = document.getElementsByClassName(boxName);
  for (let i = 0; i < resize.length; i++) {
    // 鼠標按下事件
    resize[i].onmousedown = function (e) {
      var startX = e.clientX;
      resize[i].left = resize[i].offsetLeft;
      // 鼠標拖動事件
      document.onmousemove = function (e) {
        var endX = e.clientX;
        var moveLen = resize[i].left + (endX - startX); // （endx-startx）=移動的距離。resize[i].left+移動的距離=左邊區域最后的寬度
        var maxT = box[i].clientWidth - resize[i].offsetWidth;  // 容器寬度 - 左邊區域的寬度 = 右邊區域的寬度

        if (moveLen < leftWid) moveLen = leftWid; // 左邊區域的最小寬度為150px
        if (moveLen > maxT - rightWid) moveLen = maxT  - rightWid;  //右邊區域最小寬度為800px

        resize[i].style.left = moveLen; // 設置左側區域的寬度

        for (let j = 0; j < left.length; j++) {
          left[j].style.width = moveLen + 'px';
          mid[j].style.width = (box[i].clientWidth - moveLen - 10) + 'px';
        }
      }
      // 鼠標松開事件
      document.onmouseup = function (evt) {
        document.onmousemove = null;
        document.onmouseup = null;
        resize[i].releaseCapture && resize[i].releaseCapture(); //當你不在需要繼續獲得鼠標消息就要應該調用ReleaseCapture()釋放掉
      }
      resize[i].setCapture && resize[i].setCapture(); //該函數在屬於當前線程的指定窗口里設置鼠標捕獲
      return false;
    }
  }
}


// 對象深拷貝
export function deepCopy(obj) {
  var result = Array.isArray(obj) ? [] : {}
  for (var key in obj) {
    if (obj.hasOwnProperty(key)) {
      if (typeof obj[key] === 'object' && obj[key] !== null) {
        result[key] = deepCopy(obj[key])
      } else {
        result[key] = obj[key]
      }
    }
  }
  return result
}

/*菜單樹下拉，禁止選擇當前項及其子項，以防止死循環*/
export function diGuiTreeEdit(item, compID) {  // 編輯情況下，禁止選擇當前節點及其子節點
  const dataSor = item
  let treeAry = []
  for (let i in dataSor) {
    const v = dataSor[i]
    let node = {}
    if (v === null || v === undefined) { }
    else {
      if (v.children && v.children.length > 0) {
        if (v.id == compID) {
          node.isDisabled = true
        } else {
          node.isDisabled = false
        }
        node.id = v.id
        node.label = v.label
        node.name = v.name
        node.children = diGuiTreeEdit(v.children, compID)
        treeAry.push(node)
      } else {
        if (v.id == compID) {
          node.isDisabled = true
        } else {
          node.isDisabled = false
        }
        node.id = v.id
        node.label = v.label
        node.name = v.name
        treeAry.push(node)
      }
    }
  }
  return treeAry
}


// 遞歸遍歷根據id,找到對應的node節點。treeAry主要是用於遞歸push的值
export function rspTreeNodeFormID(item,id,idVal, treeAry=[]) {
  const dataSor = item
  for (let v of dataSor) {
    if (v === null || v === undefined) { }
    else {
      if (v.children && v.children.length > 0) {
        if (v[id] == idVal) {
          treeAry.push(v)
          break
        } else {
          rspTreeNodeFormID(v.children, id, idVal,treeAry )
        }
      } else {
        if (v[id] == idVal) {
          treeAry.push(v)
          break
        }
      }
    }
  }
  return treeAry
}

// 遞歸遍歷根據id,找到對應的node節點下的data屬性里面的對應的值。treeAry主要是用於遞歸push的值
export function rspTreeNodeDataFormID(item,firstAttr,secAttr,idVal, treeAry=[]) {
  const dataSor = item
  for (let v of dataSor) {
    if (v === null || v === undefined) { }
    else {
      if (v.children && v.children.length > 0) {
        if (v[firstAttr] && v[firstAttr][secAttr] && v[firstAttr][secAttr] == idVal) {
          treeAry.push(v)
          break
        } else {
          rspTreeNodeDataFormID(v.children, firstAttr,secAttr, idVal,treeAry )
        }
      } else {
        if (v[firstAttr] && v[firstAttr][secAttr] && v[firstAttr][secAttr] == idVal) {
          treeAry.push(v)
          break
        }
      }
    }
  }
  return treeAry
}


// 傳入按鈕組和按鈕權限組，判斷按鈕組的按鈕是否存在權限組里面，存在則true。不存在則false
export function btnPermissFun(btnList, permissList) {
  for(let item in btnList){
    let isPermiss = false
    for(let pitem of permissList) {
      if(item == pitem.code) {
        isPermiss = true
        break
      }
    }
    btnList[item] = isPermiss
  }
  return btnList
}


// 字符串合並
export function strMergeCom(str1, str2){
  if(str1== null) {
    str1 = ''
  }
  if(str2 == null) {
    str2 = ''
  }
  return `${str1}(${str2})`
}

// 根據id，以及id的值，遍歷list對象，得出label
export function rstLabelFormID(list, id, label, idVal) {
  let rsp = ''
  for (let i = 0; i < list.length; i++) {
    if (list[i][id] === idVal) {
      rsp = list[i][label]
      break
    }
  }
  return rsp
}
// 根據id，以及id的值，遍歷list集合，得出對應的對象
export function rstListFormID(list, id, idVal) {
  let rsp = undefined
  for (let i = 0; i < list.length; i++) {
    if (list[i][id] === idVal) {
      rsp = list[i]
      break
    }
  }
  return rsp
}
// 根據id,label，以及id的值和label的值，遍歷list集合，得出對應的對象集合
// 此處是比對2個對象，過濾出包含的，類似於模糊搜索id或者名稱
export function rstListFormIDOrLabel(list, id,label, compVal) {
  let newAry = []
  for (let i = 0; i < list.length; i++) {
    if (list[i][id].includes(compVal) || list[i][label].includes(compVal)) {
      newAry.push(list[i])
    }
  }
  return newAry
}

// 遍歷obj已有的排序對象，對另一個對象進行排序
// compField表示兩個對象關聯的屬性，類似與外鍵
export function sortObjFromObj(sortObj, orgObj, compField = 'id') {
  var arr = Object.keys(sortObj);
  if(arr.length >0) { // 用於排序的不為空
    let sortOrgObj = []
    const newItemAry = []// 移除為空的項
    for(let item of orgObj) {
      sortOrgObj[(sortObj[item[compField]])-1] = item // 此處保存的數組，存在空值
    }
    for(let newItem of sortOrgObj) {
      if(newItem) {
        newItemAry.push(newItem)
      }
    }
    return newItemAry
  } else {
    return orgObj
  }
}

// 判斷數據是否為空，為空的話返回指定的數值
export function isNullORFalse(checkVal,rstVal) {
  if(checkVal == '' || checkVal == null || checkVal == undefined || typeof(checkVal) == undefined){
    if(rstVal == null || rstVal == ''){
      rstVal = "";
    }
    return rstVal;
  } else {
    return checkVal;
  }
}

// 判斷數組的每一項是否不為空，或者不為undefined。不為空的話，返回true;為空返回false
// 如果不為空，返回true
export function isNotNullObj(objAry) {
  let isNull =  false
  for(let item of objAry){
    if(item != "" && item != null && item != undefined && typeof item != 'undefined') {
      isNull = true
      break
    }
  }
  return isNull
}

// 獲取的localstrage是否為空或者不存在，則轉為空數組[]
export function getNullLocalstrageToAry(str) {
  if(str == null || typeof(str) == undefined ) {
    return [];
  } else{
    return str;
  }
}

// 根據文件url,判斷是否指定的文件類型，返回bool值
// 定義視頻和圖片的文件后綴。通過這個后綴去判斷文件類型
const VIDEO_TYPE = ['mp4', 'ogg', 'webm','mkv'];
const IMAGE_TYPE = ['jpg', 'png', 'gif', 'webp', 'jpeg',];
export function isFileType(fileUrl,fileType) {
  const fileTypeName = (fileUrl).substring(fileUrl.lastIndexOf('.') * 1 + 1 * 1);  // 獲取后綴名
  // 文件后綴和兼容的格式，統一轉為小寫比對
  const fileTypeNameLower = fileTypeName.toLowerCase();
  if (fileType == 'image') {
    let supportFormat = IMAGE_TYPE;
    let index = supportFormat.indexOf(fileTypeNameLower);
    if (index == -1) {  // 說明核實不符合
      return false;
    } else {
      return true;
    }
  } else if (fileType == 'video') {
    let supportFormat = VIDEO_TYPE;
    let index = supportFormat.indexOf(fileTypeNameLower);
    if (index == -1) {  // 說明核實不符合
      return false;
    } else {
      return true;
    }
  }
}
// 當數值過大是，超過9位數（億）轉為億單位展示
export function rspHundredMill(val, unit = 'HM') {
  if(unit == 'HM') {
    if(val>100000000) { //大於1億
      return (val/100000000).toFixed(3)+'億'
    } else {
      return  val
    }
  }
}

// 全部替換
// str表示原字符串，s表示要被替換的內容,replaceStr用於替換的內容
export function repalceAll(str, s ,replaceStr = '') {
  var reg = new RegExp(s, "g")//g,表示全部替換
  return str.replace(reg,replaceStr)
}

//計算兩個日期天數差的函數，通用,時間格式為yyyy-MM-dd格式
export function dateDiff(sDate1, sDate2) {  //sDate1和sDate2是yyyy-MM-dd格式
  let aDate, oDate1, oDate2, iDays
  aDate = sDate1.split("-")
  oDate1 = new Date(aDate[1] + '-' + aDate[2] + '-' + aDate[0])  //轉換為yyyy-MM-dd格式
  aDate = sDate2.split("-")
  oDate2 = new Date(aDate[1] + '-' + aDate[2] + '-' + aDate[0])
  iDays = parseInt(Math.abs(oDate1 - oDate2) / 1000 / 60 / 60 / 24) //把相差的毫秒數轉換為天數
  return iDays;  //返回相差天數
}

// 獲取當前時刻
// ymdhms表示返回年月日時分秒，ymd表示返回年月日，hms表示返回時分秒
export function curDateTime(type='ymdhms') {
  function getNow(s) {
    return s < 10 ? '0' + s : s
  }
  const myDate = new Date()

  const year = myDate.getFullYear() // 獲取當前年
  const month = myDate.getMonth() + 1 * 1 // 獲取當前月
  const date = myDate.getDate() // 獲取當前日

  const h = myDate.getHours() // 獲取當前小時數(0-23)
  const m = myDate.getMinutes() // 獲取當前分鍾數(0-59)
  const s = myDate.getSeconds()

  let now = year + '-' + getNow(month) + '-' + getNow(date) + ' ' + getNow(h) + ':' + getNow(m) + ':' + getNow(s)
  if(type == 'ymd') {
    now = year + '-' + getNow(month) + '-' + getNow(date)
  } else if(type == 'hms') {
    now = getNow(h) + ':' + getNow(m) + ':' + getNow(s)
  }
  return now
}

// 獲取今天星期幾
export function getWeekFun() {
  const weekDay = ['星期日','星期一','星期二','星期三','星期四','星期五','星期六']
  let week = new Date().getDay();
  return weekDay[week];
}

// 查詢最近n年，n表示前多少年的意思
// 例如查詢近5年的時間，n=4，不包括今年的的前4年
export function getLastNYear(n) {
  const myDate = new Date;
  const curYear = myDate.getFullYear();
  if(n =='' || n==undefined || n == null){
    n =0;
  }
  let rstYear = curYear*1 - n*1;
  return rstYear;
}

// 查詢最近n月，n表示前多少月的意思
export function getLastNMonth(n) {
  const myDate = new Date;
  const curYear = myDate.getFullYear();
  const curMonth = myDate.getMonth()+1; // 月份從0開始算起。需要加1
  if(n =='' || n==undefined || n == null){n =0;}
  let rstYear = '';
  let rstMonth = '';
  if(n>curMonth){ //表示去到去年的月份，年份需要去到上一年
    rstYear = curYear*1-1*1;
    rstMonth = 12-(n-curMonth)+1;
  } else {
    rstYear =curYear;
    rstMonth = curMonth -n;
  }
  rstMonth = (rstMonth)>9?rstMonth:'0'+(rstMonth);
  let rstYearMonth = rstYear + '-' + rstMonth;
  return rstYearMonth;
}

// 獲取最近n天的時間，n表示前多少天的意思。
// 例如查詢近7天的時間，n=6，不包括當天的的前6天
// fommatterb表示間隔符，例如：-，/
export function getLastNDate(n,fommatter ='-') {
  const d = new Date();
  var myDate=new Date(d.getTime()-86400000*n);  // 獲取前n天的日期
  const year = myDate.getFullYear()>9?myDate.getFullYear():'0'+myDate.getFullYear();
  const month = (myDate.getMonth() + 1)>9?myDate.getMonth() + 1:'0'+(myDate.getMonth() + 1);
  const date = myDate.getDate()>9?myDate.getDate():'0'+myDate.getDate();
  let last7Date = year + fommatter + month + fommatter + date;
  return last7Date;
}
// 獲取最近的n個小時，n表示前多少小時的意思。
export function getLastNHour(n,fommatter ='-') {
  const d = new Date();
  var myDate=new Date(d.getTime()-86400000*n);  // 獲取前n天的日期
  const year = myDate.getFullYear()>9?myDate.getFullYear():'0'+myDate.getFullYear();
  const month = (myDate.getMonth() + 1)>9?myDate.getMonth() + 1:'0'+(myDate.getMonth() + 1);
  const date = myDate.getDate()>9?myDate.getDate():'0'+myDate.getDate();
  const h = myDate.getHours()>9?myDate.getHours():'0'+myDate.getHours();       //獲取當前小時數(0-23)
  const m = myDate.getMinutes()>9?myDate.getMinutes():'0'+myDate.getMinutes();     //獲取當前分鍾數(0-59)
  const s = myDate.getSeconds()>9?myDate.getSeconds():'0'+myDate.getSeconds();
  let  nowTime = year + fommatter + month + fommatter + date + " " + h + fommatter + m + fommatter + s;
  return nowTime;
}


// 搜索時間下拉框，快捷鍵
export const pickerOptionsTimeEle = [{
  text: '今日',
  onClick(picker) {
    const end = new Date()
    end.setTime(end.getTime())
    end.setHours(end.getHours())
    end.setMinutes(end.getMinutes())
    end.setSeconds(end.getSeconds())
    const start = new Date()
    start.setTime(start.getTime())
    start.setHours(0); start.setMinutes(0); start.setSeconds(0)
    picker.$emit('pick', [start, end])
  }
},
{
  text: '近7天',
  onClick(picker) {
    const end = new Date()
    end.setHours(23); end.setMinutes(59); end.setSeconds(59)
    const start = new Date()
    start.setTime(start.getTime() - 3600 * 1000 * 24 * 6)
    start.setHours(0); start.setMinutes(0); start.setSeconds(0)
    picker.$emit('pick', [start, end])
  }
},
{
  text: '近30天',
  onClick(picker) {
    const end = new Date()
    end.setHours(23); end.setMinutes(59); end.setSeconds(59)
    const start = new Date()
    start.setHours(0); start.setMinutes(0); start.setSeconds(0)
    start.setTime(start.getTime() - 3600 * 1000 * 24 * 29)
    picker.$emit('pick', [start, end])
  }
},
{
  text: '昨天',
  onClick(picker) {
    const end = new Date()
    end.setTime(end.getTime() - 3600 * 1000 * 24 * 1)
    end.setHours(23); end.setMinutes(59); end.setSeconds(59)
    const start = new Date()
    start.setTime(start.getTime() - 3600 * 1000 * 24 * 1)
    start.setHours(0); start.setMinutes(0); start.setSeconds(0)
    picker.$emit('pick', [start, end])
  }
},
{
  text: '最近90天',
  onClick(picker) {
    const end = new Date()
    end.setHours(23); end.setMinutes(59); end.setSeconds(59)
    const start = new Date()
    start.setHours(0); start.setMinutes(0); start.setSeconds(0)
    start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
    picker.$emit('pick', [start, end])
  }
}]


export function getCurrWeekDays () {
  let date=[];
  let weekOfday = moment().format('E');//計算今天是這周第幾天
  let start = moment().subtract(weekOfday-1, 'days').format('YYYY-MM-DD');//周一日期
  let end= moment().add(7-weekOfday, 'days').format('YYYY-MM-DD');//周日日期
  date.push(start)
  date.push(end)
  return date
}
export function getCurrMonthDays(){
  let date = []
  let start = moment().startOf('month').format('YYYY-MM-DD')
  let end = moment().endOf('month').format('YYYY-MM-DD')
  date.push(start)
  date.push(end)
  return date
}
// elementUI 時間范圍選擇器，數據格式轉換
// 時間范圍選擇，中國標准時間轉為yyyy-MM-dd HH:mm:ss.
export function standardTimeToYMDHMS(timeStr) {
  if(timeStr == null || typeof(timeStr) == undefined ) {
    return '';
  } else{
    return timeStr.getFullYear() + '-' +
      ((timeStr.getMonth() + 1)>9?(timeStr.getMonth() + 1):'0'+(timeStr.getMonth() + 1)) + '-' +
      (timeStr.getDate()>9?timeStr.getDate():'0'+timeStr.getDate()) + ' ' +
      (timeStr.getHours()>9?timeStr.getHours():'0'+timeStr.getHours()) + ':' +
      (timeStr.getMinutes()>9?timeStr.getMinutes():'0'+timeStr.getMinutes()) + ':' +
      (timeStr.getSeconds()>9?timeStr.getSeconds():'0'+timeStr.getSeconds());
  }
}

// 用於數據庫管理，動態條件拼接
// 遍歷搜索條件，把時間范圍搜索的條件的參數拆分成min,max
// {fieldValue: ["2019-09-21 00:00:00", "2019-10-22 00:00:00"]}拆分成{min:'2019-09-21 00:00:00',max:'2019-10-22 00:00:00'}
// luoxm@2019-09-21
export function dataPackage(list) {
  for(let i =0; i<list.length; i++) {
    if(list[i]['javaType'] == 'datetime' && list[i]['fieldValue']) {
      if(list[i]['fieldValue'].length>0 && list[i]['fieldValue'].length == 2) {
        list[i]['min'] = list[i]['fieldValue'][0]
        list[i]['max'] = list[i]['fieldValue'][1]
        list[i]['fieldValue'] = undefined
      }
    }
  }
  return list
}
// 用於數據庫管理，動態條件拼接
// 和dataPackageshi是翻轉的一個操作
// 遍歷搜索條件，把min,max參數拼裝成時間范圍搜索的條件
// {min:'2019-09-21 00:00:00',max:'2019-10-22 00:00:00'}拼裝成{fieldValue: ["2019-09-21 00:00:00", "2019-10-22 00:00:00"]}
// luoxm@2019-09-21
export function dataPackageReverse(list) {
  for(let i =0; i<list.length; i++) {
    if(list[i]['javaType'] == 'datetime' && list[i]['min'] && list[i]['max']) {
      list[i]['fieldValue'] = []
      list[i]['fieldValue'].push(list[i]['min'])
      list[i]['fieldValue'].push(list[i]['max'])
      list[i]['min'] = undefined
      list[i]['max'] = undefined
    }
  }
  return list
}

// 把后台返回的時間默認值，賦值到搜索條件上
export function setQryParam(list) {
  for(let i =0; i<list.length; i++) {
    if(list[i]['javaType'] == 'datetime' && list[i]['min'] && list[i]['max']) {
      list[i]['fieldValue'] = []
      list[i]['fieldValue'][0] = list[i]['min']
      list[i]['fieldValue'][1] = list[i]['max']
    }
  }
  return list
}
// 過濾掉javaType=feature的對象
export function paramNotFeatureFun(obj) {
  let rspData = []
  for(let item of obj) {
    if(item.javaType != 'feature') {
      rspData.push(item)
    }
  }
  return rspData
}
// 用於數據庫管理，動態條件拼接，把閾值從【0，1】轉為【0-100】
export function similarExpand100(list) {
  for(let item of list) {
    if(item.javaType == 'feature') {
      if(item.similar) {
        item.similar = (item.similar * 100).toFixed(2)
      }
    }
  }
  return list
}
// 用於數據庫管理，動態條件拼接，把閾值從【0-100】轉為【0，1】
export function similarReduce100(list) {
  for(let item of list) {
    if(item.javaType == 'feature') {
      if(item.similar) {
        item.similar = (item.similar / 100).toFixed(4)
      }
    }
  }
  return list
}
// 用於數據庫管理，清空動態的搜索條件的filedValue字段數據
export function clearActiveQry(obj) {
  for(let item of obj) {
    if(item.javaType == 'datetime') {
      item.min = undefined
      item.max = undefined
      item.fieldValue = ""
    } else {
      item.fieldValue = ""
    }
  }
}

// 用戶數據庫管理,默認選擇左側第一個數據數據庫的菜單
export function getDBTreeItem(tree) {
  let rspNode = []
  const dataSor = tree
  for (let i in dataSor) {
    const item = dataSor[i]
    if(item.dirType == 1) { // 表示數據庫,並返回
      if(item.children && item.children.length>0) { // 有children,則遞歸找children的第一個數據庫
        rspNode = [item.children[0],item.id]
        break
      } else {
        continue// 既不是數據庫,也沒有子節點,則表示是一個目錄.不需要
      }
    }
  }
  return rspNode
}