78 lines
2.1 KiB
Vue
78 lines
2.1 KiB
Vue
|
<script setup>
|
||
|
|
const tabbar = ref('index')
|
||
|
|
onLoad(() => {
|
||
|
|
const currentPage = getCurrentPages()[getCurrentPages().length - 1].route
|
||
|
|
const pageName = currentPage.split('/').pop()
|
||
|
|
|
||
|
|
tabbar.value = pageName
|
||
|
|
})
|
||
|
|
|
||
|
|
const menu = reactive([{ title: '首页', icon: 'home', name: 'index' }, { title: 'AI律师', icon: 'chat', name: 'ai' }, { title: '我的', icon: 'user', name: 'me' }])
|
||
|
|
|
||
|
|
function tabChange({ value }) {
|
||
|
|
uni.reLaunch({
|
||
|
|
url: `/pages/${value}`,
|
||
|
|
})
|
||
|
|
}
|
||
|
|
const safeAreaTop = ref(0)
|
||
|
|
|
||
|
|
onMounted(() => {
|
||
|
|
uni.getSystemInfo({
|
||
|
|
success: (res) => {
|
||
|
|
if (res.safeArea) {
|
||
|
|
safeAreaTop.value = res.safeArea.top
|
||
|
|
}
|
||
|
|
},
|
||
|
|
})
|
||
|
|
|
||
|
|
const currentPage = getCurrentPages()[getCurrentPages().length - 1].route
|
||
|
|
const pageName = currentPage.split('/').pop()
|
||
|
|
tabbar.value = pageName
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
options: {
|
||
|
|
styleIsolation: 'shared',
|
||
|
|
},
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<view class="h-11 flex items-center bg-white" :style="{ paddingTop: `${safeAreaTop}px` }">
|
||
|
|
<image
|
||
|
|
class="h-8 w-8 pl-4 pr-3"
|
||
|
|
src="/static/image/logo.png"
|
||
|
|
mode="scaleToFill"
|
||
|
|
/>
|
||
|
|
<view class="pr-1 text-xl font-bold">
|
||
|
|
全能查
|
||
|
|
</view>
|
||
|
|
<!-- <view class="rounded-2xl bg-blue-500 px-2 text-white">
|
||
|
|
专业防风险
|
||
|
|
</view> -->
|
||
|
|
</view>
|
||
|
|
<view class="box-border min-h-full from-[#cfe0fa] to-[#F4F8FF] bg-gradient-to-b pb-12">
|
||
|
|
<view>
|
||
|
|
<slot />
|
||
|
|
</view>
|
||
|
|
<view>
|
||
|
|
<wd-tabbar v-model="tabbar" custom-class="qnc-tabbar max-w-lg" shape="round" safe-area-inset-bottom fixed @change="tabChange">
|
||
|
|
<wd-tabbar-item v-for="(item, index) in menu" :key="index" :name="item.name" :title="item.title" :icon="item.icon" />
|
||
|
|
</wd-tabbar>
|
||
|
|
</view>
|
||
|
|
<view class="fixed bottom-24 right-4 z-1000 flex items-center rounded-3xl from-red-500 to-red-400 bg-gradient-to-b px-2 py-1 text-center text-white shadow-2xl">
|
||
|
|
<wd-icon name="warning" class="mr-1" size="22px" />
|
||
|
|
<view>投诉</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
:deep(.qnc-tabbar) {
|
||
|
|
margin: auto !important;
|
||
|
|
bottom: 12px !important;
|
||
|
|
}
|
||
|
|
</style>
|