hengmei-one/components/foot-tab.vue

189 lines
6.1 KiB
Vue
Raw Permalink Normal View History

2021-10-21 09:21:59 +00:00
<template>
<view>
<!-- 方案一 -->
<!-- <view class="foot-box">
<view @tap="choosefoot(index)" v-for="(item,index) in tabArr" :key="index" style="display: flex;justify-content: center;flex-direction: column;align-items: center;">
<image class="moImg" v-if="newcurrent==index" :src="item.selectedIconPath"></image>
<image class="moImg" v-else :src="item.iconPath"></image>
<view :class="newcurrent==index?'footactive':'footmo'" style="margin-top: 8rpx;">{{item.text}}</view>
</view>
</view> -->
<!-- 方案二 -->
<view class="foot-boxtwo">
<!-- 图片列表 -->
<view class="item-box">
<view v-for="(itemi,index) in imgList" :key="index" @tap="choosefoot(index)" :class="index==2 ? 'centerBox':''">
2021-11-06 08:32:54 +00:00
<view v-if="index!=3" class="posir" :class="index==2 ? 'centerBox-item':''">
2021-10-21 09:21:59 +00:00
<image :class="index==2 ? 'centerImg':'moImg'" v-if="newcurrent==index" :src="itemi.selectedIconPath"></image>
<image :class="index==2 ? 'centerImg':'moImg'" v-else :src="itemi.iconPath"></image>
<button v-if="index==2 && isKef" class="fon24 posia" style="opacity: 0;top: 0;left: 0;right: 0;bottom: 0;" open-type="contact"></button>
</view>
</view>
</view>
<!-- 标题列表 -->
<view class="item-box">
<view @tap="choosefoot(index)" :class="newcurrent==index ? 'footactive':'footmo'"
2021-11-06 08:32:54 +00:00
v-for="(itemt,index) in titleList" :key="index"><span v-if="index!=3">{{itemt}}</span></view>
2021-10-21 09:21:59 +00:00
</view>
</view>
<!-- 弹框 -->
<pu-po :isShowT="isShowT" :comfrimVal="'好的'" :contentVal="'暂未开放此功能,请耐心等候'"
:isCenter="true" @comfirmev="comfirmev"></pu-po>
<!-- 弹框授权 -->
<empower :vision="vision" @cancleEv="cancleEv"></empower>
</view>
</template>
<script>
import empower from '@/components/empower.vue';
export default {
components:{
empower
},
name:'footTab',
props:{
newcurrent:{
type:Number,
default:0
},
titleList:{
type:Array,
default:function(){
return uni.getStorageSync('footTitle')
// return ['首页','分类','客服','商城','我的']
}
},
imgList:{
type:Array,
default:function(){
return uni.getStorageSync('imgList')
// return [
// {
// iconPath: '/static/tabbar/homem.png',//默认icon
// selectedIconPath: '/static/tabbar/homeAc.png',//选中icon
// },
// {
// iconPath: '/static/tabbar/catem.png',//默认icon
// selectedIconPath: '/static/tabbar/cates.png',//选中icon
// },
// {
// iconPath: '/static/tabbar/customerm.png',//默认icon
// selectedIconPath: '/static/tabbar/customerm.png',//选中icon
// },
// {
// iconPath: '/static/tabbar/shopm.png',//默认icon
// selectedIconPath: '/static/tabbar/shopa.png',//选中icon
// },
// {
// iconPath: '/static/tabbar/mym.png',//默认icon
// selectedIconPath: '/static/tabbar/mya.png',//选中icon
// }
// ]
}
}
},
data() {
return {
vision:false,
isShowT:false,
isKef:true,
jieDuan:false
};
},
mounted() {
if(uni.getStorageSync('is_active')==0) this.isKef = false
},
methods:{
cancleEv(e){
if(e==0) this.vision = false
},
choosefoot(index){
// this.current = index
switch (index){
case 0:
// console.log(this.imgList[index].selectedIcoPath);
uni.reLaunch({url:'/pages/tabbar/pagehome/pagehome'})
break;
case 1:
if(!this.jieDuan){
let isAuth = this.$toolAll.tools.returnAuth()
if(!isAuth){
uni.reLaunch({url:'/pages/tabbar/cate/cate'})
} else this.jieDuan = true
}
break;
case 2:
if(!this.jieDuan){
let isAuth = this.$toolAll.tools.returnAuth()
if(!isAuth){
2021-10-25 01:49:51 +00:00
this.$requst.post('user/rand-bind-service').then(res=>{})
2021-10-21 09:21:59 +00:00
this.$toolAll.tools.closeTimer()//清空埋点倒计时
// uni.navigateTo({url:'/pages/tabbar/pagehome/pagehome'})
this.$requst.post('user/record',{type:'other',action:'ask',id:0}).then(res=>{},error=>{})
let maiOjb = {
e:5,//内容咨询
t:new Date().getTime()//当前时间戳
}
this.$toolAll.tools.maiDian(maiOjb)
} else this.jieDuan = true
}
break;
case 3:
2021-11-06 08:32:54 +00:00
// if(!this.jieDuan){
// let isAuth = this.$toolAll.tools.returnAuth()
// if(!isAuth){
// // uni.reLaunch({url:'/pages/tabbar/shop/shop'})
// this.isShowT = true
// } else this.jieDuan = true
// }
2021-10-21 09:21:59 +00:00
break;
case 4:
if(!this.jieDuan){
let isAuth = this.$toolAll.tools.returnAuth()
if(!isAuth){
uni.reLaunch({url:'/pages/tabbar/my/my'})
} else this.jieDuan = true
}
break;
}
},
comfirmev(){
this.isShowT = false
}
}
}
</script>
<style>
/* 方案一 */
/* .foot-box{
height: 140rpx;
font-size: 24rpx;
border-top: 1rpx solid #FFFFFF;
background-color: #FFFFFF;
position: fixed;bottom: 0;left: 0;right: 0;
display: flex;justify-content: space-around;align-items: center;
}*/
/* 方案二 */
.foot-boxtwo{
height: 140rpx;
font-size: 24rpx;
border-top: 1rpx solid #FFFFFF;
background-color: #FFFFFF;
position: fixed;bottom: 0;left: 0;right: 0;z-index: 10;
display: flex;flex-direction: column;justify-content: center;
}
.item-box{display: flex;justify-content: space-around;align-items: center;}
.item-box>view{width: 25%;text-align: center;}
.centerBox{display: flex;justify-content: center;align-items: center;}
/* .centerBox-item{width: 124rpx;height: 124rpx;background-color: rgba(244, 244, 244, 1);margin-top: -100rpx;border-radius: 100%;display: flex;justify-content: center;align-items: center;} */
.centerBox-item{width: 124rpx;height: 124rpx;margin-top: -100rpx;border-radius: 100%;display: flex;justify-content: center;align-items: center;}
.centerImg{width: 112rpx;height: 112rpx;}
/* 公共 */
.moImg{width: 64rpx;height: 64rpx;}
.footactive{color: #000000;}
.footmo{color: #999999;}
</style>