增加列表中歌曲随机乱序排列，修复专辑名排序无效bug (#1440)

* Update zh-cn.json

* Update ListSortModal.vue

* Add files via upload

* Update ListSortModal.vue

修复无法按专辑名排序bug，因变量名不一致导致

* 完善&优化

* 添加更新日志

---------

Co-authored-by: lyswhut <lyswhut@qq.com>

publish/changeLog.md

@@ -1,4 +1,9 @@
+### 新增
+
+- 新增我的列表名右键菜单-排序歌曲-随机乱序功能，使用它可以对选中列表内歌曲进行随机重排（#1440）
+
 ### 修复
 
 - 修复字体设置某些字体无法应用的问题
 - 修复搜索提示功能失效的问题（#1452, @Folltoshe）
+- 修复我的列表名右键菜单-排序歌曲按专辑名排序无效的问题（#1440）

src/common/utils/common.ts

@@ -225,3 +225,23 @@ export const arrPushByPosition = <T>(list: T[], newList: T[], position: number)
   }
   return list
 }
+
+
+// https://stackoverflow.com/a/2450976
+export const arrShuffle = <T>(array: T[]) => {
+  let currentIndex = array.length
+  let randomIndex
+
+  // While there remain elements to shuffle.
+  while (currentIndex != 0) {
+    // Pick a remaining element.
+    randomIndex = Math.floor(Math.random() * currentIndex)
+    currentIndex--;
+
+    // And swap it with the current element.
+    [array[currentIndex], array[randomIndex]] = [
+      array[randomIndex], array[currentIndex]]
+  }
+
+  return array
+}

src/lang/en-us.json

@@ -125,6 +125,7 @@
   "list_sort_modal_by_down": "Descending",
   "list_sort_modal_by_field": "Sort field",
   "list_sort_modal_by_name": "Song name",
+  "list_sort_modal_by_random": "Random",
   "list_sort_modal_by_singer": "Singer name",
   "list_sort_modal_by_source": "Song source",
   "list_sort_modal_by_time": "Duration",

src/lang/zh-cn.json

@@ -125,6 +125,7 @@
   "list_sort_modal_by_down": "降序",
   "list_sort_modal_by_field": "排序字段",
   "list_sort_modal_by_name": "歌曲名",
+  "list_sort_modal_by_random": "随机乱序",
   "list_sort_modal_by_singer": "歌手名",
   "list_sort_modal_by_source": "歌曲源",
   "list_sort_modal_by_time": "时长",

src/lang/zh-tw.json

@@ -125,6 +125,7 @@
   "list_sort_modal_by_down": "降序",
   "list_sort_modal_by_field": "排序字段",
   "list_sort_modal_by_name": "歌曲名",
+  "list_sort_modal_by_random": "隨機亂序",
   "list_sort_modal_by_singer": "歌手名",
   "list_sort_modal_by_source": "歌曲源",
   "list_sort_modal_by_time": "時長",

src/renderer/views/List/MyList/components/ListSortModal.vue

@@ -10,31 +10,31 @@
           <li :class="$style.listItem">
             <base-checkbox
               id="list_sort_modal_field_name" v-model="sortField" name="list_sort_modal_field" :aria-label="$t('list_sort_modal_by_name')"
-              need="need" value="name" :label="$t('list_sort_modal_by_name')"
+              need="need" value="name" :disabled="disabledSortFislds" :label="$t('list_sort_modal_by_name')"
             />
           </li>
           <li :class="$style.listItem">
             <base-checkbox
               id="list_sort_modal_field_singer" v-model="sortField" name="list_sort_modal_field"
-              need="need" value="singer" :label="$t('list_sort_modal_by_singer')"
+              need="need" value="singer" :disabled="disabledSortFislds" :label="$t('list_sort_modal_by_singer')"
             />
           </li>
           <li :class="$style.listItem">
             <base-checkbox
               id="list_sort_modal_field_album" v-model="sortField" name="list_sort_modal_field"
-              need="need" value="album" :label="$t('list_sort_modal_by_album')"
+              need="need" value="albumName" :disabled="disabledSortFislds" :label="$t('list_sort_modal_by_album')"
             />
           </li>
           <li :class="$style.listItem">
             <base-checkbox
               id="list_sort_modal_field_time" v-model="sortField" name="list_sort_modal_field"
-              need="need" value="interval" :label="$t('list_sort_modal_by_time')"
+              need="need" value="interval" :disabled="disabledSortFislds" :label="$t('list_sort_modal_by_time')"
             />
           </li>
           <li :class="$style.listItem">
             <base-checkbox
               id="list_sort_modal_field_source" v-model="sortField" name="list_sort_modal_field"
-              need="need" value="source" :label="$t('list_sort_modal_by_source')"
+              need="need" value="source" :disabled="disabledSortFislds" :label="$t('list_sort_modal_by_source')"
             />
           </li>
         </ul>
@@ -54,6 +54,12 @@
               need="need" value="down" :label="$t('list_sort_modal_by_down')"
             />
           </li>
+          <li :class="$style.listItem">
+            <base-checkbox
+              id="list_sort_modal_type_random" v-model="sortType" name="list_sort_modal_type"
+              need="need" value="random" :label="$t('list_sort_modal_by_random')"
+            />
+          </li>
         </ul>
       </section>
       <div :class="$style.footer">
@@ -96,7 +102,7 @@ export default {
       sortType.value = ''
     }
     const verify = () => {
-      return !!sortField.value && !!sortType.value
+      return !!sortType.value && (!!sortField.value || sortType.value == 'random')
     }
     const handleSort = async() => {
       if (!verify()) return
@@ -125,9 +131,14 @@ export default {
       }
     })
 
+    const disabledSortFislds = computed(() => {
+      return sortType.value == 'random'
+    })
+
     return {
       sortField,
       sortType,
+      disabledSortFislds,
       closeModal,
       handleSort,
       handleAfterLeave,

src/renderer/worker/main/list.ts

@@ -1,6 +1,6 @@
 // import { throttle } from '@common/utils'
 
-import { filterFileName, sortInsert, similar, arrPushByPosition } from '@common/utils/common'
+import { filterFileName, sortInsert, similar, arrPushByPosition, arrShuffle } from '@common/utils/common'
 import { joinPath, saveStrToFile } from '@common/utils/nodejs'
 import { createLocalMusicInfo } from '@renderer/utils/music'
 
@@ -79,63 +79,69 @@ const getIntv = (musicInfo: LX.Music.MusicInfo) => {
  * @param localeId 排序语言
  * @returns
  */
-export const sortListMusicInfo = async(list: LX.Music.MusicInfo[], sortType: 'up' | 'down', fieldName: 'name' | 'singer' | 'albumName' | 'interval' | 'source', localeId: string) => {
+export const sortListMusicInfo = async(list: LX.Music.MusicInfo[], sortType: 'up' | 'down' | 'random', fieldName: 'name' | 'singer' | 'albumName' | 'interval' | 'source', localeId: string) => {
   // console.log(sortType, fieldName, localeId)
   // const locale = new Intl.Locale(localeId)
-  if (sortType == 'up') {
+  switch (sortType) {
-    if (fieldName == 'interval') {
+    case 'random':
-      list.sort((a, b) => {
+      arrShuffle(list)
-        if (a.interval == null) {
+      break
-          return b.interval == null ? 0 : -1
+    case 'up':
-        } else return b.interval == null ? 1 : getIntv(a) - getIntv(b)
+      if (fieldName == 'interval') {
-      })
+        list.sort((a, b) => {
-    } else {
+          if (a.interval == null) {
-      switch (fieldName) {
+            return b.interval == null ? 0 : -1
-        case 'name':
+          } else return b.interval == null ? 1 : getIntv(a) - getIntv(b)
-        case 'singer':
+        })
-        case 'source':
+      } else {
-          list.sort((a, b) => {
+        switch (fieldName) {
-            if (a[fieldName] == null) {
+          case 'name':
-              return b[fieldName] == null ? 0 : -1
+          case 'singer':
-            } else return b[fieldName] == null ? 1 : a[fieldName].localeCompare(b[fieldName], localeId)
+          case 'source':
-          })
+            list.sort((a, b) => {
-          break
+              if (a[fieldName] == null) {
-        case 'albumName':
+                return b[fieldName] == null ? 0 : -1
-          list.sort((a, b) => {
+              } else return b[fieldName] == null ? 1 : a[fieldName].localeCompare(b[fieldName], localeId)
-            if (a.meta.albumName == null) {
+            })
-              return b.meta.albumName == null ? 0 : -1
+            break
-            } else return b.meta.albumName == null ? 1 : a.meta.albumName.localeCompare(b.meta.albumName, localeId)
+          case 'albumName':
-          })
+            list.sort((a, b) => {
-          break
+              if (a.meta.albumName == null) {
+                return b.meta.albumName == null ? 0 : -1
+              } else return b.meta.albumName == null ? 1 : a.meta.albumName.localeCompare(b.meta.albumName, localeId)
+            })
+            break
+        }
       }
-    }
+      break
-  } else {
+    case 'down':
-    if (fieldName == 'interval') {
+      if (fieldName == 'interval') {
-      list.sort((a, b) => {
+        list.sort((a, b) => {
-        if (a.interval == null) {
+          if (a.interval == null) {
-          return b.interval == null ? 0 : 1
+            return b.interval == null ? 0 : 1
-        } else return b.interval == null ? -1 : getIntv(b) - getIntv(a)
+          } else return b.interval == null ? -1 : getIntv(b) - getIntv(a)
-      })
+        })
-    } else {
+      } else {
-      switch (fieldName) {
+        switch (fieldName) {
-        case 'name':
+          case 'name':
-        case 'singer':
+          case 'singer':
-        case 'source':
+          case 'source':
-          list.sort((a, b) => {
+            list.sort((a, b) => {
-            if (a[fieldName] == null) {
+              if (a[fieldName] == null) {
-              return b[fieldName] == null ? 0 : 1
+                return b[fieldName] == null ? 0 : 1
-            } else return b[fieldName] == null ? -1 : b[fieldName].localeCompare(a[fieldName], localeId)
+              } else return b[fieldName] == null ? -1 : b[fieldName].localeCompare(a[fieldName], localeId)
-          })
+            })
-          break
+            break
-        case 'albumName':
+          case 'albumName':
-          list.sort((a, b) => {
+            list.sort((a, b) => {
-            if (a.meta.albumName == null) {
+              if (a.meta.albumName == null) {
-              return b.meta.albumName == null ? 0 : 1
+                return b.meta.albumName == null ? 0 : 1
-            } else return b.meta.albumName == null ? -1 : b.meta.albumName.localeCompare(a.meta.albumName, localeId)
+              } else return b.meta.albumName == null ? -1 : b.meta.albumName.localeCompare(a.meta.albumName, localeId)
-          })
+            })
-          break
+            break
+        }
       }
-    }
+      break
   }
   return list
 }