feat(songitem): 外语歌曲显示中文译名/别名

网易 API 的 tns/alia 字段已随 formatSong 展开保留在歌曲对象上，
SongResult 补类型声明，5 个歌曲条目变体在歌名后以灰色小字显示译名。

Closes #629

src/renderer/components/common/songItemCom/CompactSongItem.vue

@@ -41,6 +41,11 @@
               :class="{ 'text-green-500': isPlaying }"
             >
               {{ item.name }}
+              <span
+                v-if="item.tns?.length || item.alia?.length"
+                class="text-neutral-400 dark:text-neutral-500"
+                >（{{ item.tns?.[0] || item.alia?.[0] }}）</span
+              >
             </n-ellipsis>
           </div>
           <div class="song-item-content-compact-artist">

src/renderer/components/common/songItemCom/HomeSongItem.vue

@@ -33,6 +33,11 @@
         :class="{ 'text-green-500': isPlaying }"
       >
         {{ item.name }}
+        <span
+          v-if="item.tns?.length || item.alia?.length"
+          class="text-neutral-400 dark:text-neutral-500 font-normal"
+          >（{{ item.tns?.[0] || item.alia?.[0] }}）</span
+        >
       </n-ellipsis>
       <n-ellipsis
         class="artist-name text-xs md:text-sm text-neutral-500 dark:text-neutral-400 mt-0.5"

src/renderer/components/common/songItemCom/ListSongItem.vue

@@ -43,6 +43,11 @@
             :class="{ 'text-green-500': isPlaying }"
           >
             {{ item.name }}
+            <span
+              v-if="item.tns?.length || item.alia?.length"
+              class="text-neutral-400 dark:text-neutral-500"
+              >（{{ item.tns?.[0] || item.alia?.[0] }}）</span
+            >
           </n-ellipsis>
           <div class="song-item-content-divider">-</div>
           <n-ellipsis class="song-item-content-name text-ellipsis" line-clamp="1">

src/renderer/components/common/songItemCom/MiniSongItem.vue

@@ -39,6 +39,11 @@
         <div class="song-item-content-title">
           <n-ellipsis class="text-ellipsis" line-clamp="1" :class="{ 'text-green-500': isPlaying }">
             {{ item.name }}
+            <span
+              v-if="item.tns?.length || item.alia?.length"
+              class="text-neutral-400 dark:text-neutral-500"
+              >（{{ item.tns?.[0] || item.alia?.[0] }}）</span
+            >
           </n-ellipsis>
         </div>
         <div class="song-item-content-name">

src/renderer/components/common/songItemCom/StandardSongItem.vue

@@ -37,11 +37,13 @@
     <template #content>
       <div class="song-item-content">
         <div class="song-item-content-title">
-          <n-ellipsis
-            class="text-ellipsis"
-            line-clamp="1"
-            :class="{ 'text-green-500': isPlaying }"
-            >{{ item.name }}</n-ellipsis
+          <n-ellipsis class="text-ellipsis" line-clamp="1" :class="{ 'text-green-500': isPlaying }"
+            >{{ item.name }}
+            <span
+              v-if="item.tns?.length || item.alia?.length"
+              class="text-neutral-400 dark:text-neutral-500"
+              >（{{ item.tns?.[0] || item.alia?.[0] }}）</span
+            ></n-ellipsis
           >
         </div>
         <div class="song-item-content-name">

src/renderer/types/music.ts

@@ -57,6 +57,10 @@ export interface SongResult {
   artists?: Artist[];
   al: Album;
   album?: Album;
+  /** 翻译名（外语歌曲的中文译名等，来自网易 API） */
+  tns?: string[];
+  /** 别名 */
+  alia?: string[];
   count: number;
   playMusicUrl?: string;
   playLoading?: boolean;