122 lines
2.2 KiB
Vue
122 lines
2.2 KiB
Vue
<template>
|
|
<view class="footer_box" :class="{'footer_bg': bg}" :style="{paddingBottom: bottomBlackLineHeight + 'rpx'}">
|
|
<view class="footer_item" v-for="(item, index) of navigationList" :key="index" @click="onPageJump(item)">
|
|
<text class="footer_item_text" :class="[item.pagePath == path ? 'footer_item_text_active' : '']">{{ item.text }}</text>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import $http from '@/config/requestConfig';
|
|
import {
|
|
judgeLogin
|
|
} from '@/config/login.js';
|
|
export default {
|
|
props: {
|
|
bg: {
|
|
type: Boolean,
|
|
default: true
|
|
},
|
|
bottomBlackLineHeight: {
|
|
type: Number,
|
|
default: function(){
|
|
return 0
|
|
}
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
path: '',
|
|
navigationList: [
|
|
{
|
|
text: '首页',
|
|
pagePath: 'pages/peanut/home',
|
|
tab: true
|
|
},
|
|
{
|
|
text: '购物车',
|
|
pagePath: 'pages/peanut/shopping',
|
|
tab: true
|
|
},
|
|
{
|
|
text: '我的书架',
|
|
pagePath: 'pages/peanut/bookshelf',
|
|
tab: true
|
|
},
|
|
// {
|
|
// text: '我的订单',
|
|
// pagePath: 'pages/bookShop/orderList',
|
|
// tab: true
|
|
// },
|
|
{
|
|
text: '我的',
|
|
pagePath: 'pages/peanut/mine',
|
|
tab: true
|
|
},
|
|
]
|
|
};
|
|
},
|
|
//第一次加载
|
|
created() {
|
|
//获取所有页面
|
|
let currentPages = getCurrentPages();
|
|
let page = currentPages[currentPages.length - 1];
|
|
this.path = page.route;
|
|
},
|
|
//方法
|
|
methods: {
|
|
onPageJump(item) {
|
|
if(item.tab){
|
|
uni.switchTab({
|
|
url: "/" + item.pagePath
|
|
});
|
|
} else {
|
|
uni.reLaunch({
|
|
url: "/" + item.pagePath
|
|
});
|
|
}
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
@import '@/style/mixin.scss';
|
|
.footer_station {
|
|
height: 100rpx;
|
|
}
|
|
.footer_box {
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 750rpx;
|
|
/* #ifndef APP-NVUE */
|
|
display: flex;
|
|
/* #endif */
|
|
flex-direction: row;
|
|
z-index: 10;
|
|
}
|
|
.footer_bg {
|
|
// background-color: rgba(0,0,0,0.4);
|
|
}
|
|
.footer_item {
|
|
flex: 1;
|
|
/* #ifndef APP-NVUE */
|
|
display: flex;
|
|
/* #endif */
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 98rpx;
|
|
}
|
|
.footer_item:active {
|
|
background-color: rgba($color: #fff, $alpha: 0.1);
|
|
}
|
|
.footer_item_text {
|
|
font-size: 28rpx;
|
|
color: #ffffff;
|
|
margin-top: 6rpx;
|
|
}
|
|
.footer_item_text_active {
|
|
color: #ffffff;
|
|
}
|
|
</style>
|