CustomTabbar.vue 2.34 KB
   1
   2
   3
   4
   5
   6
   7
   8
   9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  38
  39
  40
  41
  42
  43
  44
  45
  46
  47
  48
  49
  50
  51
  52
  53
  54
  55
  56
  57
  58
  59
  60
  61
  62
  63
  64
  65
  66
  67
  68
  69
  70
  71
  72
  73
  74
  75
  76
  77
  78
  79
  80
  81
  82
  83
  84
  85
  86
  87
  88
  89
  90
  91
  92
  93
  94
  95
  96
  97
  98
  99
 100
 101
 102
 103
 104
 105
 106
 107
 108
 109
 110
 111
 112
 113
 114
 115
<template>
<view class="custom-tabbar">
<view @click="redirectToPage('/pages/home/index')">
<view class="view-item" >
<image :src="activeTab === 'home'?'/static/shouye.png' : '/static/shouye1.png'" alt="" />
<span :class="{active: activeTab === 'home'}">首页</span>
</view>
</view>
<u-toast ref="uToast1"></u-toast>
<img @click="setimgBtn" class="img" src="/static/jiahao.png" alt="" />
<view @click="redirectToPage('/pages/lnformation/index')">
<view class="view-item" >
<image :src="activeTab === 'information' ? '/static/my1.png' : '/static/my.png'" />
<span :class="{active: activeTab === 'information'}">我的</span>
</view>
</view>
</view>
</template>

<script>
import store from '@/store';
import {request} from '@/request/request.js'
export default {
data(){
return{
patientForm:{}
}
},
mounted() {
this.getPatient()
},
computed:{
activeTab() {
return store.state.activeTab;
}
},
methods: {
async getPatient (){

},
async setimgBtn(){
const res = await request({url:'/patient'})
if(res){
uni.navigateTo({
url:'/PagesA/cardscanning/index'
})
} else {
this.$refs.uToast1.show({message: '当前没有发布急救任务请发布',type: 'error',});
}
},
redirectToPage(url) {
if(url === '/pages/home/index' ){
store.commit('setActiveTab', 'home');
} else {
store.commit('setActiveTab', 'information');
}
setTimeout(() => {
uni.redirectTo({
url: url,
success: () => {
uni.hideLoading();
}
});
}, 0); // 模拟1秒的缓冲效果
}
}
}
</script>

<style scoped lang="scss">
.active {
color: #5581FF !important;
}
.custom-tabbar {
position: fixed;
bottom: 0;
left: 0;
width: 100vw;
height: 130rpx;
background-color: #fff;
display: flex;
justify-content: space-around;
align-items: center;
.img{
position: absolute;
width: 150rpx;
height: 150rpx;
top: -50rpx;
}
}

.view-item {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
image {
height: 50rpx;
width: 50rpx;
}
span{
font-family: SourceHanSansSC, SourceHanSansSC;
font-weight: 400;
font-size: 24rpx;
color: #939CBF;
line-height: 36rpx;
text-align: left;
font-style: normal;
text-transform: none;
}
}
</style>