hengmei-two/components/status-nav.vue

143 lines
4.5 KiB
Vue

<template>
<view class="status-box statusHNH">
<view :style="{height:statusBarHeight+'px',background:backgroudColor}"></view>
<view class="status-nav" :style="{background:backgroudColor}">
<!-- 返回键 -->
<view @tap="backEvent" v-if="statusBack" style="height: 33rpx;width: 120rpx;flex-shrink: 0;position: absolute;">
<image v-if="backColor==0" class="tab-back" src="/static/public/backBlackm.png"></image>
<image v-if="backColor==1" class="tab-back" src="/static/public/videoBack.png"></image>
</view>
<!-- 标题 -->
<!-- <view v-if="statusTitle" :class="statusBack ? 'tcenter' : 'tleft'" class="tab-title" :style="{color:tabcolor}">{{titleVal}}</view> -->
<view v-if="statusTitle" class="tab-title disjcac" :style="{color:tabcolor}">
<view class="clips1" style="max-width: 320rpx;">{{titleVal}}</view>
</view>
<view v-else class="tab-title tcenter" :style="{color:tabcolor}"> </view>
</view>
</view>
</template>
<script>
export default {
name:'status-nav',
props:{
statusTitle:{//是否显示标题
type:Boolean,
default:false
},
statusBack:{//是否显示返回键
type:Boolean,
default:true
},
backgroudColor:{//标题栏背景颜色
type:String,
default:'#FFFFFF'
},
tabcolor:{//标题颜色
type:String,
default:'#333333'
},
titleVal:{//标题内容
type:String,
default:''
},
whereCome:{//来自哪个页面
type:Number,
default:0
},
backColor:{//返回键颜色
type:Number,
default:0
}
},
mounted() {
// 缓存状态栏+标题栏的高度
const query = wx.createSelectorQuery().in(this)
query.select('.statusHNH').boundingClientRect((rect) => {
// console.log('状态栏+标题栏:',rect.height);
uni.setStorageSync('statusHNH',rect.height);
this.$store.commit('updateHeightEv',rect.height)
}).exec()
// 转发进入:获取页面路径
let pages = getCurrentPages(); //获取加载的页面
let currentPage = pages[pages.length - 1]; //获取当前页面的对象
// console.log(currentPage.route,'获取当前页面路径');
// console.log(currentPage.$page.fullPath,'获取当前页面完整路径带参数');
uni.setStorageSync('url',`/${currentPage.route}`);
uni.setStorageSync('paramsUrl',currentPage.$page.fullPath);
// console.log(uni.getStorageSync('paramsUrl'),66);
// console.log(uni.getStorageSync('url'),64);
if(currentPage.options.invite_code){
uni.login({
provider: 'weixin',
success: (res)=> {
if (res.code) {
var params = {
code: res.code,
invite_code: currentPage.options.invite_code || '', // 用户邀请码
source_code: currentPage.options.source_code || '', // 渠道
channel: currentPage.options.channel || ''
}
uni.request({
url: `${uni.getStorageSync('hostapi')}user/login`,
method: 'GET',
data: params,
success: res => {
this.$requst.post('user/unusual-enter',{
path:currentPage.$page.fullPath,
openid:res.data.data.openid
}).then(res=>{
if(res.code==0){
}
})
},
})
}
},
});
}
},
data() {
return {
statusBarHeight:uni.getSystemInfoSync().statusBarHeight,//获取手机状态栏高度
};
},
methods:{
backEvent(){//返回事件
if(getApp().globalData.outside){
this.whereCome = 6;
}
switch (this.whereCome){
case 0:
uni.navigateBack({delta:1})
break;
case 1:
case 6:
uni.removeStorageSync('outside');
uni.reLaunch({
url:'/pages/tabbar/pagehome/pagehome'
})
break;
case 2:
uni.reLaunch({
url:'/pages/tabbar/my/my'
})
break;
default:
break;
}
}
}
}
</script>
<style scoped>
.status-box{position: fixed;top: 0;left: 0;right: 0;z-index: 10;}
.status-nav{width: 100%;position: relative;padding: 30rpx 0;display: flex;align-items: center;}
.tab-back{width: 33rpx;height: 33rpx;flex-shrink: 0;position: absolute;left: 20rpx;}
.tab-title{font-size: 36rpx;font-weight: bold;color: #333333;width: 100%;}
.tcenter{text-align: center;}
.tleft{margin-left: 40rpx;}
</style>