fix(mobile): back navigation issue on mobile
This commit is contained in:
@@ -1,7 +1,8 @@
|
||||
<template>
|
||||
<div class="flex flex-col flex-1 min-h-0">
|
||||
<div class="flex flex-col flex-1 min-h-0 relative">
|
||||
<img v-if="bgmURL" :src="bgmURL" class="absolute fixed top-0 left-0 w-full h-full z-0 dark:opacity-20" />
|
||||
<!-- 页面容器 -->
|
||||
<div class="flex w-full items-start flex-col flex-1 min-h-0">
|
||||
<div class="flex w-full items-start flex-col flex-1 min-h-0 z-1">
|
||||
<div class="w-full">
|
||||
<slot name="header"></slot>
|
||||
</div>
|
||||
@@ -11,16 +12,17 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<slot name="footer"></slot>
|
||||
<slot v-if="showFooter" name="footer" class="z-1"></slot>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
const props = defineProps({
|
||||
showFooter: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
import bgImg from '@/assets/mobile/chat-home/background.webp'
|
||||
|
||||
const { showFooter = true, background = true } = defineProps<{ showFooter?: boolean; background?: string | boolean }>()
|
||||
|
||||
const bgmURL = computed(() => {
|
||||
return typeof background === 'boolean' && background ? bgImg : background
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
@@ -63,6 +63,7 @@ const formattedMsgCount = computed(() => {
|
||||
})
|
||||
|
||||
const handleBack = async () => {
|
||||
console.log(router)
|
||||
router.back()
|
||||
}
|
||||
|
||||
|
||||
@@ -11,10 +11,6 @@
|
||||
|
||||
<template #container>
|
||||
<div class="flex flex-col overflow-auto h-full">
|
||||
<img
|
||||
src="@/assets/mobile/chat-home/background.webp"
|
||||
class="absolute fixed top-0 left-0 w-100vw h-100vh z-0 dark:opacity-20" />
|
||||
|
||||
<!-- 页面全部内容 -->
|
||||
<div class="flex flex-col flex-1 items-center p-15px z-2 my-15">
|
||||
<n-card class="flex flex-col rounded-15px py-10">
|
||||
|
||||
@@ -9,10 +9,7 @@
|
||||
</template>
|
||||
|
||||
<template #container>
|
||||
<div class="flex flex-col overflow-auto h-full relative">
|
||||
<img
|
||||
src="@/assets/mobile/chat-home/background.webp"
|
||||
class="absolute fixed top-0 left-0 w-full h-full z-0 dark:opacity-20" />
|
||||
<div class="flex flex-col overflow-auto h-full">
|
||||
<div class="flex flex-col gap-15px py-15px px-20px flex-1 min-h-0 z-1">
|
||||
<n-card size="small" embedded class="rounded-10px p-0" content-class="p-0!">
|
||||
<div class="flex py-10px rounded-10px w-full items-center gap-10px" @click="clickInfo">
|
||||
|
||||
@@ -1,14 +1,11 @@
|
||||
<template>
|
||||
<AutoFixHeightPage :show-footer="false">
|
||||
<template #header>
|
||||
<HeaderBar :isOfficial="false" class="bg-white" border :hidden-right="true" room-name="公告详情" />
|
||||
<HeaderBar :isOfficial="false" border :hidden-right="true" room-name="公告详情" />
|
||||
</template>
|
||||
|
||||
<template #container>
|
||||
<div class="flex flex-col overflow-auto h-full relative">
|
||||
<img
|
||||
src="@/assets/mobile/chat-home/background.webp"
|
||||
class="absolute t-0 l-0 w-full h-full z-0 dark:opacity-20" />
|
||||
<div class="flex flex-col flex-1 gap-15px py-15px px-20px">
|
||||
<div v-if="loading" class="flex justify-center items-center h-200px">
|
||||
<n-spin size="large" />
|
||||
|
||||
@@ -1,14 +1,11 @@
|
||||
<template>
|
||||
<AutoFixHeightPage :show-footer="false">
|
||||
<template #header>
|
||||
<HeaderBar :isOfficial="false" class="bg-white" border :hidden-right="true" room-name="群公告" />
|
||||
<HeaderBar :isOfficial="false" border :hidden-right="true" room-name="群公告" />
|
||||
</template>
|
||||
|
||||
<template #container>
|
||||
<div class="flex flex-col overflow-auto h-full relative">
|
||||
<img
|
||||
src="@/assets/mobile/chat-home/background.webp"
|
||||
class="absolute fixed top-0 left-0 w-full h-full z-0 dark:opacity-20" />
|
||||
<div class="flex flex-col overflow-auto h-full">
|
||||
<div class="flex flex-col flex-1 gap-15px py-15px px-20px">
|
||||
<RecycleScroller :items="announList" :item-size="15" key-field="id" class="flex flex-col gap-15px">
|
||||
<template #default="{ item }">
|
||||
|
||||
@@ -1,9 +1,5 @@
|
||||
<template>
|
||||
<div class="flex flex-col overflow-auto h-full relative">
|
||||
<img
|
||||
src="@/assets/mobile/chat-home/background.webp"
|
||||
class="absolute fixed top-0 left-0 w-full h-full z-0 dark:opacity-20" />
|
||||
|
||||
<div class="flex flex-col overflow-auto h-full">
|
||||
<AutoFixHeightPage :show-footer="false">
|
||||
<template #header>
|
||||
<HeaderBar
|
||||
|
||||
@@ -1,9 +1,5 @@
|
||||
<template>
|
||||
<div class="flex flex-col overflow-auto h-full relative">
|
||||
<img
|
||||
src="@/assets/mobile/chat-home/background.webp"
|
||||
class="absolute fixed top-0 left-0 w-full h-full z-0 dark:opacity-20" />
|
||||
|
||||
<div class="flex flex-col overflow-auto h-full">
|
||||
<AutoFixHeightPage :show-footer="false">
|
||||
<template #header>
|
||||
<HeaderBar
|
||||
|
||||
@@ -10,11 +10,7 @@
|
||||
</template>
|
||||
|
||||
<template #container>
|
||||
<div class="flex flex-col overflow-auto h-full relative">
|
||||
<img
|
||||
src="@/assets/mobile/chat-home/background.webp"
|
||||
class="absolute fixed top-0 left-0 w-full h-full z-0 dark:opacity-20" />
|
||||
|
||||
<div class="flex flex-col overflow-auto h-full">
|
||||
<PersonalInfo :is-my-page="isMyPage" :is-show="isShow"></PersonalInfo>
|
||||
|
||||
<div class="top-0 flex-1 flex w-full border-#13987F border-1">
|
||||
|
||||
@@ -5,10 +5,7 @@
|
||||
</template>
|
||||
|
||||
<template #container>
|
||||
<div class="flex flex-col overflow-auto h-full relative">
|
||||
<img
|
||||
src="@/assets/mobile/chat-home/background.webp"
|
||||
class="absolute fixed top-0 left-0 w-full h-full z-0 dark:opacity-20" />
|
||||
<div class="flex flex-col overflow-auto h-full">
|
||||
<div class="flex flex-col flex-1 gap-20px py-15px px-20px">
|
||||
<n-form class="rounded-15px p-10px shadow" label-placement="left" label-width="100px">
|
||||
<n-form-item>
|
||||
|
||||
@@ -5,11 +5,7 @@
|
||||
</template>
|
||||
|
||||
<template #container>
|
||||
<div class="flex flex-col overflow-auto h-full relative">
|
||||
<img
|
||||
src="@/assets/mobile/chat-home/background.webp"
|
||||
class="absolute fixed top-0 left-0 w-full h-full z-0 dark:opacity-20" />
|
||||
|
||||
<div class="flex flex-col overflow-auto h-full">
|
||||
<div class="flex flex-col flex-1 gap-20px py-15px px-20px">
|
||||
<n-date-picker panel type="date" block class="m-auto rounded-16px" />
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<AutoFixHeightPage :show-footer="false" class="z-1">
|
||||
<AutoFixHeightPage :show-footer="false">
|
||||
<template #header>
|
||||
<HeaderBar
|
||||
:isOfficial="false"
|
||||
@@ -9,10 +9,7 @@
|
||||
:room-name="t('mobile_edit_profile.title')" />
|
||||
</template>
|
||||
<template #container>
|
||||
<div class="flex flex-col overflow-auto h-full relative">
|
||||
<img
|
||||
src="@/assets/mobile/chat-home/background.webp"
|
||||
class="absolute fixed top-0 left-0 w-full h-full z-0 dark:opacity-20" />
|
||||
<div class="flex flex-col overflow-auto h-full">
|
||||
<div class="p-20px">
|
||||
<!-- 头像 -->
|
||||
<div class="flex justify-center mb-50px">
|
||||
|
||||
@@ -6,9 +6,6 @@
|
||||
|
||||
<template #container>
|
||||
<div class="flex flex-col overflow-auto h-full">
|
||||
<img
|
||||
src="@/assets/mobile/chat-home/background.webp"
|
||||
class="absolute fixed top-0 left-0 w-100vw h-100vh z-0 dark:opacity-20" />
|
||||
<div class="flex flex-col p-20px gap-20px">
|
||||
<!-- 设置项 -->
|
||||
<div
|
||||
|
||||
@@ -1,9 +1,5 @@
|
||||
<template>
|
||||
<div class="flex flex-col overflow-auto h-full">
|
||||
<img
|
||||
src="@/assets/mobile/chat-home/background.webp"
|
||||
class="absolute fixed top-0 left-0 w-100vw h-100vh z-0 dark:opacity-20" />
|
||||
|
||||
<AutoFixHeightPage :show-footer="false" class="z-1">
|
||||
<template #container>
|
||||
<div class="z-2 flex flex-col gap-1 overflow-auto h-full">
|
||||
|
||||
@@ -1,8 +1,5 @@
|
||||
<template>
|
||||
<div class="flex flex-col overflow-auto h-full relative">
|
||||
<img
|
||||
src="@/assets/mobile/chat-home/background.webp"
|
||||
class="absolute fixed top-0 left-0 w-full h-full z-0 dark:opacity-20" />
|
||||
<div class="flex flex-col overflow-auto h-full">
|
||||
<!-- 设置区 -->
|
||||
<Settings />
|
||||
|
||||
|
||||
Reference in New Issue
Block a user