renun/BewlyBewly
1
0
Fork 0
mirror of https://github.com/BewlyBewly/BewlyBewly.git synced 2025-04-14 13:15:29 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

chore: code formatting

Browse Source
This commit is contained in:
Hakadao
2022-10-23 19:37:48 +08:00
parent 187acf8836
commit ea280e52cd
2 changed files with 37 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/components/Topbar/MomentsDropdown.vue
View File

@@ -1,8 +1,9 @@
<script lang="ts">
import { isNewArticle, isNewVideo, setLastestOffsetID } from './notify'
import { language } from '~/logic'
import { getUserID, calcTimeSince } from '~/utils'
import { MomentItem, MomentType, LanguageType } from '~/types'
import { calcTimeSince, getUserID } from '~/utils'
import type { MomentItem } from '~/types'
import { LanguageType, MomentType } from '~/types'
export default defineComponent({
data() {
@@ -38,7 +39,8 @@ export default defineComponent({
},
watch: {
selectedTab(newVal: number, oldVal: number) {
if (newVal === oldVal) return
if (newVal === oldVal)
return
this.scrollToTop(this.$refs.momentsWrap as HTMLElement, 300)
this.moments = []
@@ -73,7 +75,8 @@ export default defineComponent({
methods: {
onClickTab(tabId: number) {
// Prevent changing tab when loading, cuz it will cause a bug
if (this.isLoading) return
if (this.isLoading)
return
this.selectedTab = tabId
this.momentTabs.forEach((tab) => {
@@ -225,7 +228,8 @@ export default defineComponent({
*/
scrollToTop(element: HTMLElement, duration: number) {
// cancel if already on top
if (element.scrollTop === 0) return
if (element.scrollTop === 0)
return
const cosParameter = element.scrollTop / 2
let scrollCount = 0
@@ -235,7 +239,8 @@ export default defineComponent({
if (oldTimestamp !== 0) {
// if duration is 0 scrollCount will be Infinity
scrollCount += Math.PI * (newTimestamp - oldTimestamp) / duration
if (scrollCount >= Math.PI) return element.scrollTop = 0
if (scrollCount >= Math.PI)
return element.scrollTop = 0
element.scrollTop = cosParameter + cosParameter * Math.cos(scrollCount)
}
oldTimestamp = newTimestamp
@@ -289,10 +294,10 @@ export default defineComponent({
<!-- moments wrapper -->
<div ref="momentsWrap" h="430px" overflow="y-scroll" p="x-4">
<!-- loading -->
<loading v-if="isLoading && moments.length === 0" h="full" flex="~" items="center"></loading>
<loading v-if="isLoading && moments.length === 0" h="full" flex="~" items="center" />
<!-- empty -->
<empty v-if="!isLoading && moments.length === 0" w="full" h="full"></empty>
<empty v-if="!isLoading && moments.length === 0" w="full" h="full" />
<!-- moments -->
<transition-group name="list">
@@ -322,13 +327,13 @@ export default defineComponent({
bg="$bew-theme-color"
pos="absolute -top-10px -left-10px"
style="box-shadow: 0 0 4px var(--bew-theme-color)"
></div>
/>
<a
:href="moment.type === MomentType.Video ? 'https://space.bilibili.com/' + moment.uid : moment.url"
:href="moment.type === MomentType.Video ? `https://space.bilibili.com/${moment.uid}` : moment.url"
target="_blank"
>
<img :src="moment.face + '@60w_60h_1c'" rounded="$bew-radius" w="40px" h="40px" m="r-4" />
<img :src="`${moment.face}@60w_60h_1c`" rounded="$bew-radius" w="40px" h="40px" m="r-4">
</a>
<div flex="~" justify="between" w="full">
@@ -337,7 +342,7 @@ export default defineComponent({
<div v-if="moment.type !== MomentType.Bangumi" text="$bew-text-2 sm" m="y-2">
<!-- Videos and articles -->
<div v-if="selectedTab === 0 || selectedTab === 2">
{{ calcTimeSince(new Date(moment.ctime * 1000)) }}{{ language === LanguageType.English ? ' ' + $t('common.ago') : $t('common.ago') }}
{{ calcTimeSince(new Date(moment.ctime * 1000)) }}{{ language === LanguageType.English ? ` ${$t('common.ago')}` : $t('common.ago') }}
</div>
<!-- Live -->
<div v-else-if="selectedTab === 1" text="$bew-theme-color" font="bold" flex="~" items="center">
@@ -346,13 +351,13 @@ export default defineComponent({
</div>
</div>
<img :src="moment.cover + '@128w_72h_1c'" w="82px" h="46px" m="l-4" rounded="$bew-radius" />
<img :src="`${moment.cover}@128w_72h_1c`" w="82px" h="46px" m="l-4" rounded="$bew-radius">
</div>
</a>
</transition-group>
<!-- loading -->
<loading v-if="isLoading && moments.length !== 0" m="-t-4"></loading>
<loading v-if="isLoading && moments.length !== 0" m="-t-4" />
</div>
</div>
</template>

37
src/contentScripts/views/Home/RecommendContent.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { accessKey, language } from '~/logic/index'
import { numFormatter, calcTimeSince, calcCurrentTime } from '~/utils'
import { calcCurrentTime, calcTimeSince, numFormatter } from '~/utils'
import { LanguageType } from '~/types'
export default defineComponent({
@@ -24,7 +24,7 @@ export default defineComponent({
this.getRecommendVideos()
}, 2000)
window.onscroll = async() => {
window.onscroll = async () => {
if ((window.innerHeight + window.scrollY) >= document.body.scrollHeight) {
if (!this.isLoading)
return
@@ -162,7 +162,7 @@ export default defineComponent({
video.param,
video.mid,
video.tid,
video.tag.tag_id
video.tag.tag_id,
)"
>
{{ $t('common.undo') }}
@@ -170,27 +170,27 @@ export default defineComponent({
</div>
</template>
<template v-else>
<a :href="'/video/av' + video.uri.split('/')[3]" target="_blank">
<a :href="`/video/av${video.uri.split('/')[3]}`" target="_blank">
<div class="thumbnail">
<div class="duration">{{ calcCurrentTime(video.duration) }}</div>
<div
class="overflow-hidden w-full relative rounded-$bew-radius z-1"
style="aspect-ratio: 16/9"
>
<img class="cover" :src="video.cover.replace('http:', '') + '@672w_378h_1c'" loading="lazy" />
<img class="cover" :src="`${video.cover.replace('http:', '')}@672w_378h_1c`" loading="lazy">
</div>
<img class="cover-shadow" :src="video.cover.replace('http:', '') + '@672w_378h_1c'" loading="lazy" />
<img class="cover-shadow" :src="`${video.cover.replace('http:', '')}@672w_378h_1c`" loading="lazy">
</div>
</a>
<div class="detail">
<div class="flex">
<a class="avatar" cursor="pointer" @click="gotoChannel(video.mid)">
<img
:src="(video.face + '').replace('http:', '') + '@60w_60h_1c'"
:src="`${(`${video.face}`).replace('http:', '')}@60w_60h_1c`"
width="48"
height="48"
loading="lazy"
/>
>
</a>
</div>
<div class="meta">
@@ -223,7 +223,7 @@ export default defineComponent({
h="full"
z="30"
@click="video.openControl = false"
></div>
/>
<div
pos="absolute top-9 right-0"
@@ -265,13 +265,13 @@ export default defineComponent({
{{ video.name }}
</div>
<div class="video-info">
{{ numFormatter(video.play) }}{{ language === LanguageType.English ?
' ' + $t('common.view', video.play) :
$t('common.view', video.play) }}
{{ numFormatter(video.play) }}{{ language === LanguageType.English
? ` ${$t('common.view', video.play)}`
: $t('common.view', video.play) }}
<span class="text-xs font-light">•</span>
{{ calcTimeSince(new Date(video.ctime * 1000)) }}{{ language === LanguageType.English ?
' ' + $t('common.ago') :
$t('common.ago') }}
{{ calcTimeSince(new Date(video.ctime * 1000)) }}{{ language === LanguageType.English
? ` ${$t('common.ago')}`
: $t('common.ago') }}
</div>
</div>
</div>
@@ -280,7 +280,7 @@ export default defineComponent({
</transition-group>
</div>
<loading v-if="isLoading"></loading>
<loading v-if="isLoading" />
<div
v-if="!isLoading"
@@ -336,13 +336,12 @@ export default defineComponent({
.cover-shadow {
@apply absolute top-0 left-0 w-full h-full filter -z-1
pointer-events-none duration-600 rounded-$bew-radius
opacity-80;
pointer-events-none duration-600 rounded-$bew-radius opacity-70;
aspect-ratio: 16/9;
}
&:hover .cover-shadow {
@apply blur-lg transform;
@apply blur-2xl transform;
}
.thumbnail {