129 lines
3.4 KiB
Vue
129 lines
3.4 KiB
Vue
<template>
|
|
<view class="content">
|
|
<view class="index">
|
|
<u-tabbar :value="valuebbar" @change="name => value = name" :placeholder="false"
|
|
activeColor="#66666" :safeAreaInsetBottom="false"
|
|
inactiveColor="#333333">
|
|
<u-tabbar-item v-for="(item,index) in bottomnavigations.list" :key="index" :text="item.name"
|
|
:hidden="item.hidden" :badge="item.badge" :dot="item.dot" @click="click1(item,index)">
|
|
<image v-if="valuebbar == item.tabbarindex" class="u-page__item__slot-icon" slot="active-icon"
|
|
style="width: 40rpx;height: 40rpx;" :src="item.iconPath">
|
|
</image>
|
|
<image v-else class="u-page__item__slot-icon" slot="inactive-icon"
|
|
style="width: 40rpx;height: 40rpx;" :src="item.selectedIconPath"></image>
|
|
</u-tabbar-item>
|
|
</u-tabbar>
|
|
</view>
|
|
<view class="" :style="'height:' + (100 + HeighT.bottompadding) +'rpx'">
|
|
|
|
</view>
|
|
</view>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
value: this.valuebbar,
|
|
}
|
|
},
|
|
props: {
|
|
// list:{
|
|
// return[{
|
|
// name: '首页',
|
|
// iconPath: 'https://ointmentweapp.oss-cn-beijing.aliyuncs.com/icon/iconPath.png',
|
|
// selectedIconPath: 'https://ointmentweapp.oss-cn-beijing.aliyuncs.com/icon/selectedIconPath.png',
|
|
// badge: '0', //显示几条消息
|
|
// dot: false, //是否有红点
|
|
// hidden: true,
|
|
// url: uni.cache.get('store_id') ? '/pages/index/indexInfo' : '/pages/index/index'
|
|
|
|
// },
|
|
// {
|
|
// name: '作品',
|
|
// iconPath: 'https://ointmentweapp.oss-cn-beijing.aliyuncs.com/icon/iconPath1.png',
|
|
// selectedIconPath: 'https://ointmentweapp.oss-cn-beijing.aliyuncs.com/icon/selectedIconPath1.png',
|
|
// badge: '0', //显示几条消息
|
|
// dot: false, //是否有红点
|
|
// url: '/pages/task/index',
|
|
// hidden: uni.cache.get('store_id') ? true : false
|
|
// },
|
|
// {
|
|
// name: '订单',
|
|
// iconPath: 'https://ointmentweapp.oss-cn-beijing.aliyuncs.com/icon/iconPath2.png',
|
|
// selectedIconPath: 'https://ointmentweapp.oss-cn-beijing.aliyuncs.com/icon/selectedIconPath2.png',
|
|
// badge: '0', //显示几条消息
|
|
// dot: false, //是否有红点
|
|
// url: '/pages/my/order/index?e=0',
|
|
// hidden: true
|
|
|
|
// }, {
|
|
// name: '我的',
|
|
// iconPath: 'https://ointmentweapp.oss-cn-beijing.aliyuncs.com/icon/iconPath3.png',
|
|
// selectedIconPath: 'https://ointmentweapp.oss-cn-beijing.aliyuncs.com/icon/selectedIconPath3.png',
|
|
// badge: '0', //显示几条消息
|
|
// dot: false, //是否有红点
|
|
// url: '/pages/my/index',
|
|
// hidden: true
|
|
// }]
|
|
// }
|
|
// },
|
|
valuebbar: {
|
|
type: Number,
|
|
default: 0
|
|
},
|
|
|
|
},
|
|
computed: {
|
|
HeighT() {
|
|
return this.$store.getters.is_BarHeight
|
|
},
|
|
bottomnavigations() {
|
|
return this.$store.getters.bottomnavigation
|
|
},
|
|
HeighTs() {
|
|
let data = {
|
|
"padding-bottom": this.$store.getters.is_BarHeight.bottompadding + 'rpx'
|
|
}
|
|
return data
|
|
},
|
|
},
|
|
methods: {
|
|
click1(a, e) {
|
|
this.value = e
|
|
switch (a.type) {
|
|
case 'reLaunch':
|
|
uni.reLaunch({
|
|
url: a.url
|
|
});
|
|
break;
|
|
case 'navigateTo':
|
|
uni.navigateTo({
|
|
url: a.url
|
|
});
|
|
break;
|
|
case 'redirectTo':
|
|
uni.redirectTo({
|
|
url: a.url
|
|
});
|
|
break;
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.content {
|
|
.index {
|
|
z-index: 998;
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 100%;
|
|
|
|
.u-page__item__slot-icon {}
|
|
}
|
|
}
|
|
</style> |