mirror of
https://github.com/the1812/Bilibili-Evolved.git
synced 2025-11-04 21:22:45 +08:00
Add categories
This commit is contained in:
parent
c6e1eecc42
commit
e5ba3f3a80
@ -0,0 +1,91 @@
|
||||
<template>
|
||||
<div class="fresh-home-categories">
|
||||
<div class="fresh-home-header">
|
||||
<div class="fresh-home-header-title">
|
||||
分区
|
||||
</div>
|
||||
<div class="fresh-home-header-center-area">
|
||||
<div class="fresh-home-header-tabs">
|
||||
<div class="default-tabs">
|
||||
<div
|
||||
v-for="t of tabs"
|
||||
:key="t.name"
|
||||
class="default-tab"
|
||||
:class="{ selected: t === selectedTab }"
|
||||
@click="selectTab(t)"
|
||||
>
|
||||
<div class="default-tab-name">
|
||||
{{ t.displayName }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fresh-home-header-pagination">
|
||||
<VButton icon title="排序">
|
||||
<VIcon icon="mdi-swap-horizontal" :size="18" />
|
||||
</VButton>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fresh-home-categories-content">
|
||||
content
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { categories } from '@/components/utils/categories/data'
|
||||
import { ArrayContent } from '@/core/common-types'
|
||||
import { VButton, VIcon } from '@/ui'
|
||||
|
||||
const tabs = Object.entries(categories).map(([name, category]) => ({
|
||||
id: category.code as number,
|
||||
name,
|
||||
displayName: name,
|
||||
category,
|
||||
href: category.link,
|
||||
}))
|
||||
type TabType = ArrayContent<typeof tabs>
|
||||
export default Vue.extend({
|
||||
components: {
|
||||
VButton,
|
||||
VIcon,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tabs,
|
||||
selectedTab: tabs[0],
|
||||
loading: true,
|
||||
videos: [],
|
||||
rankVideos: [],
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.reload()
|
||||
},
|
||||
methods: {
|
||||
selectTab(tab: TabType) {
|
||||
if (this.selectedTab === tab) {
|
||||
window.open(tab.href, '_blank')
|
||||
return
|
||||
}
|
||||
this.selectedTab = tab
|
||||
this.reload()
|
||||
},
|
||||
async reload() {
|
||||
this.loading = true
|
||||
this.videos = []
|
||||
this.videos = await this.selectedTab.api().finally(() => { this.loading = false })
|
||||
},
|
||||
},
|
||||
})
|
||||
</script>
|
||||
<style lang="scss">
|
||||
@import "common";
|
||||
|
||||
.fresh-home-categories {
|
||||
@include v-stretch();
|
||||
&-content {
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,7 @@
|
||||
import { FreshLayoutItem } from '../fresh-layout-item'
|
||||
|
||||
export const categories: FreshLayoutItem = {
|
||||
name: 'categories',
|
||||
displayName: '分区',
|
||||
component: () => import('./Categories.vue').then(m => m.default),
|
||||
}
|
||||
@ -64,6 +64,7 @@
|
||||
<script lang="ts">
|
||||
import { getVideoFeeds } from '@/components/feeds/api'
|
||||
import { VideoCard } from '@/components/feeds/video-card'
|
||||
import { ArrayContent } from '@/core/common-types'
|
||||
import { VButton, VIcon } from '@/ui'
|
||||
import VideoList from '../../VideoList.vue'
|
||||
|
||||
@ -82,7 +83,6 @@ const tabs = [
|
||||
href: 'https://t.bilibili.com/?tab=512',
|
||||
},
|
||||
]
|
||||
type ArrayContent<T> = T extends Array<infer R> ? R : T
|
||||
type TabType = ArrayContent<typeof tabs>
|
||||
export default Vue.extend({
|
||||
components: {
|
||||
|
||||
@ -6,6 +6,7 @@ export type ExecutableWithParameter<Parameters extends any[] = never[], ReturnTy
|
||||
) => ReturnType | Promise<ReturnType>
|
||||
|
||||
export type TestPattern = (string | RegExp)[]
|
||||
export type ArrayContent<T> = T extends Array<infer R> ? R : T
|
||||
export type VueModule = VueConstructor | { default: VueConstructor }
|
||||
export type I18nDescription = string | { 'zh-CN': string; [key: string]: string }
|
||||
export type WithName = {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user