优化过滤选项，简化组件结构，添加评分滑块功能

src/views/discover/BangumiView.vue

@@ -46,7 +46,7 @@ watch([filterParams], () => {
       <div class="mr-5">
         <VLabel>类别</VLabel>
       </div>
-      <VChipGroup column v-model="filterParams.cat">
+      <VChipGroup v-model="filterParams.cat">
         <VChip
           :color="filterParams.cat == key ? 'primary' : ''"
           filter
@@ -63,7 +63,7 @@ watch([filterParams], () => {
       <div class="mr-5">
         <VLabel>排序</VLabel>
       </div>
-      <VChipGroup column v-model="filterParams.sort">
+      <VChipGroup v-model="filterParams.sort">
         <VChip
           :color="filterParams.sort == key ? 'primary' : ''"
           filter

src/views/discover/DoubanView.vue

@@ -72,7 +72,7 @@ const zoneDict = {
 }
 
 // 年代字典
-const yearDict = {
+const yearDict: Record<string, string> = {
   '2020年代': '2020年代',
   '2010年代': '2010年代',
   '2000年代': '2000年代',
@@ -82,6 +82,12 @@ const yearDict = {
   '60年代': '60年代',
 }
 
+// 往年代字典中追加当前年份及往前5年的字典
+const currentYear = new Date().getFullYear()
+for (let i = 0; i < 6; i++) {
+  yearDict[`${currentYear - i}`] = `${currentYear - i}`
+}
+
 // 豆瓣过滤参数
 const doubanSortDict = {
   'U': '综合排序',
@@ -113,7 +119,7 @@ watch([type, filterParams], () => {
       <div class="mr-5">
         <VLabel>类型</VLabel>
       </div>
-      <VChipGroup column v-model="type">
+      <VChipGroup v-model="type">
         <VChip :color="type == 'movies' ? 'primary' : ''" filter tile value="movies">电影</VChip>
         <VChip :color="type == 'tvs' ? 'primary' : ''" filter tile value="tvs">电视剧</VChip>
       </VChipGroup>
@@ -122,7 +128,7 @@ watch([type, filterParams], () => {
       <div class="mr-5">
         <VLabel>排序</VLabel>
       </div>
-      <VChipGroup column v-model="filterParams.sort">
+      <VChipGroup v-model="filterParams.sort">
         <VChip
           :color="filterParams.sort == key ? 'primary' : ''"
           filter
@@ -139,7 +145,7 @@ watch([type, filterParams], () => {
       <div class="mr-5">
         <VLabel>风格</VLabel>
       </div>
-      <VChipGroup column v-model="doubanCategory">
+      <VChipGroup v-model="doubanCategory">
         <VChip
           :color="doubanCategory == key ? 'primary' : ''"
           filter
@@ -156,7 +162,7 @@ watch([type, filterParams], () => {
       <div class="mr-5">
         <VLabel>地区</VLabel>
       </div>
-      <VChipGroup column v-model="doubanZone">
+      <VChipGroup v-model="doubanZone">
         <VChip
           :color="doubanZone == key ? 'primary' : ''"
           filter
@@ -173,7 +179,7 @@ watch([type, filterParams], () => {
       <div class="mr-5">
         <VLabel>年代</VLabel>
       </div>
-      <VChipGroup column v-model="doubanYear">
+      <VChipGroup v-model="doubanYear">
         <VChip
           :color="doubanYear == key ? 'primary' : ''"
           filter

src/views/discover/TheMovieDbView.vue

@@ -12,7 +12,7 @@ const filterParams = reactive({
   with_keywords: '',
   with_watch_providers: '',
   vote_average: 0,
-  vote_count: 0,
+  vote_count: 10,
   release_date: '',
 })
 
@@ -87,7 +87,7 @@ watch([type, filterParams], () => {
       <div class="mr-5">
         <VLabel>类型</VLabel>
       </div>
-      <VChipGroup column v-model="type">
+      <VChipGroup v-model="type">
         <VChip :color="type == 'movies' ? 'primary' : ''" filter tile value="movies">电影</VChip>
         <VChip :color="type == 'tvs' ? 'primary' : ''" filter tile value="tvs">电视剧</VChip>
       </VChipGroup>
@@ -96,7 +96,7 @@ watch([type, filterParams], () => {
       <div class="mr-5">
         <VLabel>排序</VLabel>
       </div>
-      <VChipGroup column v-model="filterParams.sort_by">
+      <VChipGroup v-model="filterParams.sort_by">
         <VChip
           :color="filterParams.sort_by == key ? 'primary' : ''"
           filter
@@ -113,7 +113,7 @@ watch([type, filterParams], () => {
       <div class="mr-5">
         <VLabel>风格</VLabel>
       </div>
-      <VChipGroup column v-model="filterParams.with_genres">
+      <VChipGroup v-model="filterParams.with_genres">
         <VChip
           :color="filterParams.with_genres == key ? 'primary' : ''"
           filter
@@ -130,7 +130,7 @@ watch([type, filterParams], () => {
       <div class="mr-5">
         <VLabel>语言</VLabel>
       </div>
-      <VChipGroup column v-model="filterParams.with_original_language">
+      <VChipGroup v-model="filterParams.with_original_language">
         <VChip
           :color="filterParams.with_original_language == key ? 'primary' : ''"
           filter
@@ -143,6 +143,23 @@ watch([type, filterParams], () => {
         </VChip>
       </VChipGroup>
     </div>
+    <div class="flex justify-start align-center">
+      <div class="mr-5">
+        <VLabel>评分</VLabel>
+      </div>
+      <VSlider v-model="filterParams.vote_average" thumb-label max="10" min="0" class="align-center" hide-details>
+        <template v-slot:append>
+          <VTextField
+            width="5rem"
+            v-model="filterParams.vote_count"
+            density="compact"
+            type="number"
+            hide-details
+            single-line
+          />
+        </template>
+      </VSlider>
+    </div>
   </div>
 
   <div>