Bilibili-Evolved/registry/lib/components/style/custom-navbar/logo/NavbarLogo.vue
2021-10-26 13:19:37 +08:00

66 lines
1.3 KiB
Vue

<template>
<VIcon v-if="!seasonLogoUrl" icon="logo" class="custom-navbar-logo"></VIcon>
<img
v-else
height="38"
class="custom-navbar-logo season"
:src="seasonLogoUrl"
/>
</template>
<script lang="ts">
import { addComponentListener } from '@/core/settings'
import { getJson } from '@/core/ajax'
import { VIcon } from '@/ui'
export default Vue.extend({
name: 'NavbarLogo',
components: {
VIcon,
},
data() {
return {
seasonLogoUrl: '',
}
},
async created() {
addComponentListener(
'customNavbar.seasonLogo',
async (value: boolean) => {
if (!value) {
this.seasonLogoUrl = ''
return
}
const json = await getJson(
'https://api.bilibili.com/x/web-show/res/locs?pf=0&ids=142',
)
if (json.code !== 0) {
this.seasonLogoUrl = ''
return
}
this.seasonLogoUrl = lodash.get(json, 'data[142][0].litpic', '').replace(
'http:',
'https:',
)
},
true,
)
},
})
</script>
<style lang="scss" scoped>
.custom-navbar-logo {
width: auto;
margin: 0 4px;
.custom-navbar:not(.fill) & {
&:not(.season) {
color: var(--theme-color);
}
}
&.season {
transform: scale(1.15);
}
}
</style>