|
@@ -14,6 +14,7 @@ import IconAvator from '@/common/images/icon_teacher.png'
|
|
import request from '@/helpers/request'
|
|
import request from '@/helpers/request'
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
import { state as userInfo } from '@/state'
|
|
import { state as userInfo } from '@/state'
|
|
|
|
+import { useRect } from '@vant/use'
|
|
|
|
|
|
interface IMusicItem {
|
|
interface IMusicItem {
|
|
loaded: boolean
|
|
loaded: boolean
|
|
@@ -107,6 +108,7 @@ export default defineComponent({
|
|
}
|
|
}
|
|
})
|
|
})
|
|
const imgRef = ref()
|
|
const imgRef = ref()
|
|
|
|
+ const userRef = ref()
|
|
return () => (
|
|
return () => (
|
|
<div class={styles.leaderboard}>
|
|
<div class={styles.leaderboard}>
|
|
<div class={styles.container}>
|
|
<div class={styles.container}>
|
|
@@ -117,8 +119,11 @@ export default defineComponent({
|
|
src={img.value}
|
|
src={img.value}
|
|
onLoad={img => {
|
|
onLoad={img => {
|
|
nextTick(() => {
|
|
nextTick(() => {
|
|
|
|
+ const {height: height1} = useRect(imgRef)
|
|
|
|
+ const {height: height2} = useRect(userRef)
|
|
|
|
+ // console.log(height1, height2)
|
|
imgShow.value = true
|
|
imgShow.value = true
|
|
- imgHeight.value = imgRef.value?.offsetHeight || 100
|
|
|
|
|
|
+ imgHeight.value = height1 + height2 || 100
|
|
})
|
|
})
|
|
}}
|
|
}}
|
|
onError={err => {
|
|
onError={err => {
|
|
@@ -144,7 +149,7 @@ export default defineComponent({
|
|
styles.tabContent,
|
|
styles.tabContent,
|
|
state.isSignup && !user.value.join
|
|
state.isSignup && !user.value.join
|
|
? null
|
|
? null
|
|
- : styles.hasUser
|
|
|
|
|
|
+ : null//styles.hasUser
|
|
]}
|
|
]}
|
|
style={{ height: `calc(100vh - ${imgHeight.value}px)` }}
|
|
style={{ height: `calc(100vh - ${imgHeight.value}px)` }}
|
|
>
|
|
>
|
|
@@ -202,7 +207,7 @@ export default defineComponent({
|
|
</Tabs>
|
|
</Tabs>
|
|
)}
|
|
)}
|
|
{!state.isSignup ? (
|
|
{!state.isSignup ? (
|
|
- <div class={[styles.activeUser, 'van-safe-area-bottom']}>
|
|
|
|
|
|
+ <div ref={userRef} class={[styles.activeUser, 'van-safe-area-bottom']}>
|
|
<Cell
|
|
<Cell
|
|
center
|
|
center
|
|
title={user.value.username}
|
|
title={user.value.username}
|
|
@@ -220,7 +225,7 @@ export default defineComponent({
|
|
/>
|
|
/>
|
|
</div>
|
|
</div>
|
|
) : !state.isChallenge ? (
|
|
) : !state.isChallenge ? (
|
|
- <div class={[styles.activeUser, 'van-safe-area-bottom']}>
|
|
|
|
|
|
+ <div ref={userRef} class={[styles.activeUser, 'van-safe-area-bottom']}>
|
|
<Cell
|
|
<Cell
|
|
center
|
|
center
|
|
title={user.value.username}
|
|
title={user.value.username}
|
|
@@ -238,7 +243,7 @@ export default defineComponent({
|
|
/>
|
|
/>
|
|
</div>
|
|
</div>
|
|
) : user.value.join ? (
|
|
) : user.value.join ? (
|
|
- <div class={[styles.activeUser, 'van-safe-area-bottom']}>
|
|
|
|
|
|
+ <div ref={userRef} class={[styles.activeUser, 'van-safe-area-bottom']}>
|
|
<Cell
|
|
<Cell
|
|
center
|
|
center
|
|
title={user.value.username}
|
|
title={user.value.username}
|