refactor: search

src/components/CoverRow.vue

@@ -15,7 +15,7 @@
             }}
           </span>
         </div>
-        <div class="title">
+        <div class="title" :style="{ fontSize: subTextFontSize }">
           <span class="explicit-symbol" v-if="isExplicit(item)"
             ><ExplicitSymbol
           /></span>
@@ -46,6 +46,7 @@ export default {
     items: { type: Array, required: true },
     type: { type: String, required: true },
     subText: { type: String, default: "null" },
+    subTextFontSize: { type: String, default: "16px" },
     showPlayCount: { type: Boolean, default: false },
     columnNumber: { type: Number, default: 5 },
     gap: { type: String, default: "44px 24px" },

src/components/Navbar.vue

@@ -38,8 +38,7 @@
               ref="searchInput"
               :placeholder="inputFocus ? '' : $t('nav.search')"
               v-model="keywords"
-              @keydown.enter="goToSearchPage"
-              @focus="inputFocus = true"
+              @focus="focusSearchBox"
               @blur="inputFocus = false"
             />
           </div>
@@ -61,29 +60,33 @@ export default {
   data() {
     return {
       inputFocus: false,
-      keywords: "",
       langs: ["zh-CN", "en"],
     };
   },
   computed: {
-    ...mapState(["settings"]),
+    ...mapState(["settings", "search"]),
+    keywords: {
+      get() {
+        return this.search.keywords;
+      },
+      set(value) {
+        this.$store.commit("updateSearch", { key: "keywords", value });
+      },
+    },
   },
   methods: {
     go(where) {
       if (where === "back") this.$router.go(-1);
       else this.$router.go(1);
     },
-    goToSearchPage() {
-      if (!this.keywords) return;
-      if (
-        this.$route.name === "search" &&
-        this.$route.query.keywords === this.keywords
-      )
-        return;
-      this.$router.push({
-        name: "search",
-        query: { keywords: this.keywords },
-      });
+    focusSearchBox() {
+      this.inputFocus = true;
+      if (this.$route.name !== "search") {
+        this.$router.push({
+          name: "search",
+          params: { keywords: this.keywords },
+        });
+      }
     },
   },
 };

src/components/TrackList.vue

@@ -144,6 +144,14 @@ export default {
         this.playTrackOnListByID(trackID);
       } else if (this.dbclickTrackFunc === "playPlaylistByID") {
         this.$store.state.player.playPlaylistByID(this.id, trackID);
+      } else if (this.dbclickTrackFunc === "playAList") {
+        let trackIDs = this.tracks.map((t) => t.id);
+        this.$store.state.player.replacePlaylist(
+          trackIDs,
+          this.id,
+          "artist",
+          trackID
+        );
       }
     },
     playThisListDefault(trackID) {