music(player): 收藏功能 — title 旁 ★/☆，收藏的曲目置顶

apps/music/frontend/src/views/PlayerView.vue

@@ -95,7 +95,15 @@
 
         <template v-else>
           <header class="now-playing">
-            <h2>{{ selected.title }}</h2>
+            <h2>
+              <button
+                class="fav-btn"
+                :class="{ on: selected.favorite }"
+                :title="selected.favorite ? '取消收藏' : '收藏'"
+                @click="toggleFavorite"
+              >{{ selected.favorite ? '★' : '☆' }}</button>
+              {{ selected.title }}
+            </h2>
             <div class="np-sub">
               <span v-if="selected.artist">{{ selected.artist }}</span>
               <span v-if="selected.category">· {{ selected.category }}</span>
@@ -921,6 +929,22 @@ function setTab(k) {
   activeTab.value = k
 }
 
+async function toggleFavorite() {
+  if (!selectedId.value || !selected.value) return
+  const next = !selected.value.favorite
+  selected.value.favorite = next  // optimistic
+  const inList = pieces.value.find(p => p.id === selectedId.value)
+  if (inList) inList.favorite = next
+  try {
+    await patchPiece(selectedId.value, { favorite: next })
+  } catch (e) {
+    // 回滚
+    selected.value.favorite = !next
+    if (inList) inList.favorite = !next
+    alert(e.message || String(e))
+  }
+}
+
 // notes auto-save
 function onNotesInput() {
   if (!selectedId.value) return
@@ -1445,7 +1469,23 @@ onBeforeUnmount(() => {
   font-size: 22px;
   color: var(--accent);
   margin-bottom: 4px;
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
 }
+.fav-btn {
+  font-size: 22px;
+  line-height: 1;
+  color: var(--text-mute);
+  background: none;
+  border: none;
+  cursor: pointer;
+  padding: 0 4px;
+  transition: color 0.15s, transform 0.05s;
+}
+.fav-btn:hover { color: #f5b800; }
+.fav-btn.on { color: #f5b800; }
+.fav-btn:active { transform: scale(0.85); }
 .np-sub {
   color: var(--text-dim);
   font-size: 13px;