53 lines
1020 B
Vue
53 lines
1020 B
Vue
<template>
|
|
<div class="common-layout">
|
|
<!-- title 标题和搜索栏 -->
|
|
<header class="header">
|
|
<van-nav-bar :title="$route.meta.title" left-arrow safe-area-inset-top @click-left="goBack">
|
|
<template #left>
|
|
<img src="@/assets/img/back.png" alt="" class="back-icon" />
|
|
</template>
|
|
</van-nav-bar>
|
|
</header>
|
|
<!-- content -->
|
|
<RouterView />
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { RouterView, useRouter } from 'vue-router';
|
|
import appBridge from '@/assets/js/appBridge';
|
|
const router = useRouter();
|
|
|
|
function goBack() {
|
|
if (window.history.length > 1) {
|
|
router.go(-1);
|
|
} else {
|
|
appBridge.navigateBack();
|
|
}
|
|
}
|
|
</script>
|
|
<style scoped lang="scss">
|
|
.common-layout {
|
|
background-color: white;
|
|
color: #333;
|
|
}
|
|
|
|
.header {
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 1000;
|
|
background-color: #a5d380;
|
|
|
|
.title {
|
|
display: flex;
|
|
align-items: end;
|
|
justify-content: center;
|
|
}
|
|
|
|
.back-icon {
|
|
width: 18px;
|
|
height: 18px;
|
|
}
|
|
}
|
|
</style>
|