|
@@ -1,149 +0,0 @@
|
|
|
-<!-- 底部导航组件 -->
|
|
|
-<template>
|
|
|
- <view class="tabBar" :style="{'padding-bottom': paddingBottomHeight + 'rpx'}">
|
|
|
- <view class="tab-bar-box">
|
|
|
- <view class="null-box"></view>
|
|
|
- <view class="tba-bar-min-box" @click="tabBarGoPage(1)">
|
|
|
- <img src="@/images/basicsModules/btn_sy_xz.png" v-if="currentRoute == 'pages/home'">
|
|
|
- <img src="@/images/basicsModules/btn_sy_zc.png" v-else>
|
|
|
- <view :class="currentRoute == 'pages/home'?'primary':''">首页</view>
|
|
|
- </view>
|
|
|
- <view class="null-box"></view>
|
|
|
- <view class="tba-bar-min-box" @click="tabBarGoPage(2)">
|
|
|
- <img src="@/images/basicsModules/btn_xx_xz.png" v-if="currentRoute == 'pages/information/information'">
|
|
|
- <img src="@/images/basicsModules/btn_xx_zc.png" v-else>
|
|
|
- <view class="tip" v-if="totalCount!=0">{{totalCount}}</view>
|
|
|
- <view :class="currentRoute == 'pages/information/information'?'primary':''">消息</view>
|
|
|
- </view>
|
|
|
- <view class="null-box"></view>
|
|
|
- <view class="tba-bar-min-box" @click="tabBarGoPage(3)">
|
|
|
- <img src="@/images/basicsModules/btn_wd_xz.png" v-if="currentRoute == 'pages/mine'">
|
|
|
- <img src="@/images/basicsModules/btn_wd_zc.png" v-else>
|
|
|
- <view :class="currentRoute == 'pages/mine'?'primary':''">我的</view>
|
|
|
- </view>
|
|
|
- <view class="null-box"></view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
- import { infoTotalCount } from '@/api/apiDemo/index.js'
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- paddingBottomHeight: 0, //苹果X以上手机底部适配高度
|
|
|
- currentRoute:"",
|
|
|
- userType:"",
|
|
|
- totalCount:0,
|
|
|
- }
|
|
|
- },
|
|
|
- created() {
|
|
|
- let that = this;
|
|
|
- uni.getSystemInfo({
|
|
|
- success: function (res) {
|
|
|
- let model = ['X', 'XR', 'XS', '11', '12', '13', '14', '15'];
|
|
|
- model.forEach(item => {
|
|
|
- //适配iphoneX以上的底部,给tabbar一定高度的padding-bottom
|
|
|
- if(res.model.indexOf(item) != -1 && res.model.indexOf('iPhone') != -1) {
|
|
|
- that.paddingBottomHeight = 40;
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
-
|
|
|
- onShow(){
|
|
|
- this.getTotalList();
|
|
|
- },
|
|
|
- mounted(){
|
|
|
-
|
|
|
- this.getTotalList();
|
|
|
- this.totalCount=uni.getStorageSync('totalCount')
|
|
|
- // 获取当前路由
|
|
|
- let pages = getCurrentPages();
|
|
|
- let page = pages[pages.length - 1];
|
|
|
- this.currentRoute = page.route;
|
|
|
- // 获取当前角色
|
|
|
- this.userType = uni.getStorageSync('userType');
|
|
|
- },
|
|
|
- methods: {
|
|
|
- //获取消息总数接口
|
|
|
- async getTotalList(){
|
|
|
- const {data} = await infoTotalCount();
|
|
|
- if(data.code==200){
|
|
|
- this.totalCount=data.data.totalCount
|
|
|
- }
|
|
|
-
|
|
|
- },
|
|
|
- tabBarGoPage(type){
|
|
|
- if(type === 1){
|
|
|
- if (this.currentRoute !== 'pages/home/home') {
|
|
|
- uni.redirectTo({
|
|
|
- url: '/pages/home/home',
|
|
|
- });
|
|
|
- }
|
|
|
- }else if(type === 2){
|
|
|
- if (this.currentRoute !== 'pages/information/information') {
|
|
|
- uni.redirectTo({
|
|
|
- url: '/pages/information/information',
|
|
|
- });
|
|
|
- }
|
|
|
- }else if(type === 3){
|
|
|
- if (this.currentRoute !== 'pages/mine/mine') {
|
|
|
- uni.redirectTo({
|
|
|
- url: '/pages/mine/mine',
|
|
|
- });
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- },
|
|
|
- }
|
|
|
- }
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="stylus" scoped>
|
|
|
- .tabBar{
|
|
|
- z-index:9999;
|
|
|
- width:100%;
|
|
|
- height:98rpx;
|
|
|
- background:#ffffff;
|
|
|
- position fixed
|
|
|
- bottom:0;
|
|
|
- left:0;
|
|
|
- box-shadow: 0 -3rpx 13rpx 0 rgba(0, 0, 0, 0.1);
|
|
|
- .tab-bar-box{
|
|
|
- display flex;
|
|
|
- .null-box{
|
|
|
- flex:1;
|
|
|
- }
|
|
|
- .tba-bar-min-box{
|
|
|
- width:64rpx;
|
|
|
- position :relative;
|
|
|
- img{
|
|
|
- width:44rpx;
|
|
|
- height:44rpx;
|
|
|
- margin:14rpx auto 0;
|
|
|
- }
|
|
|
- view{
|
|
|
- line-height:37rpx;
|
|
|
- font-size:19rpx;
|
|
|
- text-align center;
|
|
|
- color:#666666;
|
|
|
- }
|
|
|
- .tip{
|
|
|
- display inline-block;
|
|
|
- background :#EF0909;
|
|
|
- border-radius 50%;
|
|
|
- position :absolute;
|
|
|
- font-size 24rpx;
|
|
|
- line-height 24rpx;
|
|
|
- color #fff;
|
|
|
- top :10rpx;
|
|
|
- left :44rpx;
|
|
|
- padding:6rpx 10rpx;
|
|
|
- box-sizing border-box;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</style>
|