颜色列表排序

src/views/components/xiaoqu/rightData/colorList.vue

@@ -10,12 +10,12 @@
         />
         <span>
           {{ item.name }}
-          <!-- <span v-show="item.name == '户籍'"
+          <span v-show="item.name == '户籍'"
             >(空关{{ colorListL[2].house }}户)</span
           >
           <span v-show="item.name == '流动'"
             >(空关{{ colorListL[6].house }}户)</span
-          > -->
+          >
         </span>
       </div>
       <div class="item-value">
@@ -58,10 +58,26 @@ export default {
   methods: {
     async getColor() {
       let res = await getColorList(this.queryParamsXiaoqu);
+
       this.colorListL = this.resetColor(res.data);
     },
     resetColor(colorList) {
-      const nameOrder = ["HZ", "HL", "HO", "HF", "NZ", "NL", "NO", "NF"];
+      const nameOrder = [
+        "HZ",
+        "HL",
+        "HO",
+        "HF",
+        "NZ",
+        "NL",
+        "NO",
+        "NF",
+        "户籍",
+        "流动",
+        "中共党员",
+        "帮扶对象",
+        "重点人群",
+        "退伍军人",
+      ];
       colorList.map((item) => {
         let isColor = /^[a-zA-Z]+$/.test(item.name);
         if (isColor) {
@@ -74,17 +90,19 @@ export default {
           }
         }
       });
-      // 创建一个映射表，方便查找顺序
-      const orderMap = nameOrder.reduce((map, name, index) => {
-        map[name] = index;
-        return map;
-      }, {});
 
-      // 根据映射表进行排序
+      colorList.sort((a, b) => {
-      let sortedArr = colorList.sort((obj1, obj2) => {
+        const indexA = nameOrder.indexOf(a.name);
-        return orderMap[obj1.name] - orderMap[obj2.name];
+        const indexB = nameOrder.indexOf(b.name);
+
+        // 如果找不到，设置一个较大的索引以保证它排在最后
+        return (
+          (indexA === -1 ? nameOrder.length : indexA) -
+          (indexB === -1 ? nameOrder.length : indexB)
+        );
       });
-      return sortedArr;
+
+      return colorList;
     },
   },
 };