You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

96 lines
2.9 KiB

<template>
<div class="footer_nav">
<van-tabbar class="footer-bar" v-model="data.footerActive" :route="true" safe-area-inset-bottom @change="onTabChange">
<van-tabbar-item name="Home" replace icon="wap-home" to="/enterprise/enterpriseHome">{{
$t("common.lang_home")
}}</van-tabbar-item>
<!-- <van-tabbar-item name="Classify" replace icon="bell" to="/enterprise/lawQuery">
法律查询
</van-tabbar-item> -->
<van-tabbar-item name="Classify" replace icon="notes-o" to="">
法律查询
</van-tabbar-item>
<van-tabbar-item name="Classify" push to="/enterprise/nos">
<template #icon>
<img src="@/assets/images/nos/off_site_bottom_icon.png" class="nos-icon" alt="" />
</template>
<template #icon-active>
<img src="@/assets/images/nos/off_site_bottom_icon.png" class="nos-icon nos-icon-active" alt="" />
</template>
</van-tabbar-item>
<van-tabbar-item name="Classify" replace icon="bell" to="/enterprise/messageCenter" :badge="useCommon.unreadMessageCount > 0 ? useCommon.unreadMessageCount : undefined">
消息
</van-tabbar-item>
<van-tabbar-item name="My" replace icon="manager" to="/enterprise/myPage">
我的
</van-tabbar-item>
<!-- <van-tabbar-item name="My" replace icon="manager-o" to="">{{
$t("common.lang_my")
}}</van-tabbar-item> -->
</van-tabbar>
</div>
</template>
<script setup name="footerNav">
import { getMessageUnreadCount } from '@/api/enterprise';
const { useCommon } = $globalStore
let data = reactive({
footerActive: "Home",
dot: false,
});
// ========== tabbar切换时调用消息数量接口 ==========
const onTabChange = (name) => {
fetchMessageUnreadCount();
};
// ========== 获取消息未读数量 ==========
const fetchMessageUnreadCount = () => {
getMessageUnreadCount({ enterpriseNumber: useCommon.enterpriseNumber}, (res) => {
if (res && res.code === 200 && res.data) {
const totalCount = Number(res.data.totalCount) || 0;
useCommon.SET_UNREAD_MESSAGE_COUNT(totalCount);
}
}, () => {
// 接口调用失败不处理
});
};
</script>
<style lang="less" scoped>
.footer_body{
// height: 1.5rem;
}
.footer_nav{
background: url(~@/assets/images/nos/tab_bar_bg.png) no-repeat center top;
background-size: 100% auto;
height: 86px;
.footer-bar{
position: absolute;
bottom: 0.2rem;
}
}
.van-hairline--top-bottom:after, .van-hairline-unset--top-bottom:after {
border: 0;
}
:deep(.van-tabbar-item) {
color: #bbb;
}
:deep(.van-tabbar-item--active) {
color: #1989fa;
}
.nos-icon {
width: 86px;
height: 86px;
}
.nos-icon-active {
opacity: 1;
}
</style>