fix: revert some code

src/views/playlist.vue

@@ -135,22 +135,8 @@
       </h1>
     </div>
 
-    <div class="search-box">
-      <div class="container" :class="{ active: inputFocus }">
-        <svg-icon icon-class="search" />
-        <div class="input">
-          <input
-            v-model="playlistKeyword"
-            :placeholder="inputFocus ? '' : $t('playlist.search')"
-            @focus="inputFocus = true"
-            @blur="inputFocus = false"
-          />
-        </div>
-      </div>
-    </div>
-
     <TrackList
-      :tracks="filteredTracks"
+      :tracks="tracks"
       :type="'playlist'"
       :id="playlist.id"
       :extraContextMenuItem="
@@ -316,8 +302,6 @@ export default {
       tracks: [],
       loadingMore: false,
       lastLoadedTrackIndex: 9,
-      playlistKeyword: "",
-      inputFocus: false,
     };
   },
   created() {
@@ -344,22 +328,6 @@ export default {
         this.playlist.id !== this.data.likedSongPlaylistID
       );
     },
-    filteredTracks() {
-      return this.tracks.filter(
-        (song) =>
-          song.name
-            .toLowerCase()
-            .includes(this.playlistKeyword.toLowerCase()) ||
-          song.al.name
-            .toLowerCase()
-            .includes(this.playlistKeyword.toLowerCase()) ||
-          song.ar.find((artist) =>
-            artist.name
-              .toLowerCase()
-              .includes(this.playlistKeyword.toLowerCase())
-          )
-      );
-    },
   },
   methods: {
     ...mapMutations(["appendTrackToPlayerList"]),
@@ -406,11 +374,6 @@ export default {
           this.lastLoadedTrackIndex = data.playlist.tracks.length - 1;
           if (this.playlist.trackCount > this.tracks.length) {
             window.addEventListener("scroll", this.handleScroll, true);
-            window.addEventListener(
-              "input",
-              this.handleSearch,
-              this.playlistKeyword
-            );
           }
           return data;
         })
@@ -421,11 +384,11 @@ export default {
           }
         });
     },
-    loadMore(loadNum = 50) {
+    loadMore() {
       let trackIDs = this.playlist.trackIds.filter((t, index) => {
         if (
           index > this.lastLoadedTrackIndex &&
-          index <= this.lastLoadedTrackIndex + loadNum
+          index <= this.lastLoadedTrackIndex + 50
         )
           return t;
       });
@@ -452,15 +415,6 @@ export default {
         this.loadMore();
       }
     },
-    handleSearch() {
-      if (
-        this.lastLoadedTrackIndex + 1 === this.playlist.trackIds.length ||
-        this.loadingMore
-      )
-        return;
-      this.loadingMore = true;
-      this.loadMore(this.playlist.trackIds.length - this.lastLoadedTrackIndex);
-    },
     openMenu(e) {
       this.$refs.playlistMenu.openMenu(e);
     },
@@ -498,8 +452,7 @@ export default {
 <style lang="scss" scoped>
 .playlist-info {
   display: flex;
-  margin-bottom: 40px;
-  padding: var(--main-content-padding);
+  margin-bottom: 72px;
   .info {
     display: flex;
     flex-direction: column;
@@ -558,25 +511,6 @@ export default {
   }
 }
 
-@media (max-width: 600px) {
-  .playlist-info {
-    width: calc(100vw - 2 * var(--main-content-padding-x));
-    display: block;
-    .cover {
-      display: flex;
-      justify-content: center;
-      align-items: center;
-    }
-    .info {
-      margin-top: 24px;
-      margin-left: 0;
-      .title {
-        font-size: 48px;
-      }
-    }
-  }
-}
-
 .special-playlist {
   margin-top: 192px;
   margin-bottom: 128px;
@@ -645,54 +579,6 @@ export default {
   }
 }
 
-.search-box {
-  display: flex;
-  justify-content: flex-end;
-  margin-bottom: 10px;
-  -webkit-app-region: no-drag;
-  padding: var(--main-content-padding);
-
-  .container {
-    display: flex;
-    align-items: center;
-    height: 32px;
-    background: var(--color-secondary-bg-for-transparent);
-    border-radius: 8px;
-    width: 200px;
-  }
-
-  .svg-icon {
-    height: 15px;
-    width: 15px;
-    color: var(--color-text);
-    opacity: 0.28;
-    margin: {
-      left: 8px;
-      right: 4px;
-      bottom: 4px;
-    }
-  }
-
-  input {
-    font-size: 16px;
-    border: none;
-    background: transparent;
-    width: 96%;
-    font-weight: 600;
-    margin-top: -1px;
-    color: var(--color-text);
-  }
-
-  .active {
-    background: var(--color-primary-bg-for-transparent);
-    input,
-    .svg-icon {
-      opacity: 1;
-      color: var(--color-primary);
-    }
-  }
-}
-
 .gradient-test {
   background-image: linear-gradient(to left, #92fe9d 0%, #00c9ff 100%);
 }