/* 
  中文字母数字混合按ASCCI值排序
  排序规则：数字（0->9）->大写字母（A->Z）->小写字母（a->z）->中文拼音（a->z）
*/

function searchFirstLetter(word) {  //中文首字转换成字母
  /* if(!String.prototype.localeCompare)
    return 0; */
  let temp = '';
  let letters = "*abcdefghjklmnopqrstwxyz".split('');
  let zh = "阿八嚓哒妸发旮哈讥咔垃痳拏噢妑七呥扨它穵夕丫帀".split('');
  letters.forEach((letter, i) => {
    if((!zh[i-1] || zh[i-1].localeCompare(word,"zh") <= 0) && word.localeCompare(zh[i],"zh") == -1) {
      temp = letter.toUpperCase() 
    }
  })
  return temp
}

function getChartType(char) { // 获取类型
  // 数字（0->9）->大写字母（A->Z）->小写字母（a->z）->中文拼音（a->z）
  if (/^[\u4e00-\u9fa5]$/.test(char[0])) {
    return ['zh', char]
  }else if (/^[a-zA-Z]$/.test(char[0])) {
    return ['en', char]
  }else if (/^[0-9]$/.test(char[0])) {
    return ['number', char]
  }else{
    return ['others', char]
  }
}

function filterCode(val, places){ // 转换ASCCI值
  if(val[1].length < places){
    return getEstimateNum(val[0], val[1]);
  }else{   //首字符相同, 比较第places位, 进行分组排序
    return countNum(val[1], places, val[0])
  }
}

function countNum(str, places, type){
  let i = 1, num = getEstimateNum(type, str[0]) + '.';
  do {
    num += getEstimateNum(type, str[i]); //1位格式：168， 2位格式：168.113， 3位格式：168.113102
    i++;
  }
  while (i < places);
  return Number(num);
}

function getZH(str){ //获取中文 ASCCI值
  return searchFirstLetter(str).charCodeAt() + 100; // + 100 是为了跟[a-z]的ASCCI值重复，中文首字符拼音取最大值
}

function getEN(str){ //获取英文和数字 ASCCI值
  return val.charCodeAt()
}

function getEstimateNum(type, val){ //获取对应类型最终计算用来排序的ASCCI值（不是字符原生的ASCCI值）
  return type === 'zh' ? getZH(val) : getEN(val)
}

/* 
  str1: 除最后一列，从上到下
  str2: 从下到上，除第一列
  排序次数：  总列数-1
*/
    
export function sortCNOrder(str1, str2, param) {
  let res = 0; // 排序值
  let Places = 4; // 比较前几位
  const char1 = str1[param]
  const char2 = str2[param]
  if (!char1 || !char2) { //空值处理
    res = char1 && !char2 ? -1 : 0 //空值分组
  }else {
    const value1 = getChartType(char1)
    const value2 = getChartType(char2)
    res = filterCode(value1, Places) - filterCode(value2, Places)
  }
  return res;
}

使用方法

  <el-table-column
    sortable 
    :default-sort = "{prop: 'groupFlag'}"
    :sort-method="sortDevName"></el-table-column>

  import { sortCNOrder } from "@/utils/table-order";

  sortDevName(str1, str2) {
    const param = 'groupFlag'; //字段名
    return sortCNOrder(str1, str2, param);
  },