<template>
|
<view>
|
<!-- :style="{height:($DeviceInformation.screenHeight/12)+'rpx'}" -->
|
<view class="headClass">新凯迪云制造</view>
|
<u-navbar :title="title" :fixed='false' :safeAreaInsetTop="false" titleStyle='color:#fff;letter-spacing: 2rpx;'
|
bgColor='#0066FF '>
|
<view class="u-nav-slot" slot="left">
|
<u-icon name="arrow-left" @click="leftClick" size="32" color='#fff !important'></u-icon>
|
</view>
|
|
<view class="u-nav-slot" slot="right" @click="dotClick" style="display: flex;margin-right: 10rpx;">
|
<u-icon name="list-dot" size="40" color='#fff'></u-icon>
|
<view class="box" style="position: absolute;margin-left: 20rpx;z-index: 2;margin-top: -10rpx;">
|
<u-badge max="9" :value="topRightMessageCount"></u-badge>
|
</view>
|
</view>
|
</u-navbar>
|
|
|
<!-- :style="{marginTop:rightTopShowMarginTopValue+'rpx'}" -->
|
<view class="rightFlex" v-show="rightTopShow">
|
<view class="triangle"></view>
|
<!-- <view class="rightFlexItem" v-show='isShowMessageMenu' @click="goToMessageList">
|
<view>
|
<u-icon name="chat" size="44"></u-icon>
|
<view class="box" style="position: absolute;margin-left: 22rpx;z-index: 2;margin-top: -52rpx;">
|
<u-badge max="9" :value="topRightMessageCount"></u-badge>
|
</view>
|
</view>
|
<view class="rightFlexItemTitle">我的消息</view>
|
</view>
|
<view class="rightFlexItem">
|
<view>
|
<u-icon name="file-text" size="44"></u-icon>
|
</view>
|
<view class="rightFlexItemTitle">操作指导书</view>
|
</view>
|
<view class="rightFlexItem">
|
<view>
|
<u-icon name="tags" size="44"></u-icon>
|
</view>
|
<view class="rightFlexItemTitle">成品追溯</view>
|
</view> -->
|
<view class="rightFlexItem" @click="goBackToLogin" style="border-bottom:0;">
|
<view>
|
<u-icon name="play-left" size="44"></u-icon>
|
</view>
|
<view class="rightFlexItemTitle">退出登录</view>
|
</view>
|
|
</view>
|
|
<!-- <u-gap height="10" bgColor="#fff"></u-gap> -->
|
|
<u-overlay :show="show" @click="overlayClick" zIndex='11' opacity='0.2'></u-overlay>
|
|
</view>
|
</template>
|
|
<script>
|
import {
|
LoginOut
|
} from '../../config/api.js';
|
|
export default {
|
props: {
|
title: {
|
type: String,
|
default: ''
|
},
|
topRightMessageCount: {
|
type: Number,
|
default: 0
|
}
|
|
},
|
data() {
|
return {
|
// DeviceInformation: JSON.parse(uni.getStorageSync('DeviceInformation')), //设备信息
|
image: '',
|
indexList: [],
|
// rightTopShowMarginTopValue: 0,
|
rightTopShow: false, //右上角是否显示出来
|
show: false,
|
isShowMessageMenu: getCurrentPages()[getCurrentPages().length - 1].$page.fullPath !== "/pages/other/xxlb"
|
}
|
},
|
onLoad() {},
|
created() {
|
|
},
|
onResize() {
|
|
},
|
mounted() {},
|
methods: {
|
// 跳转到消息列表
|
goToMessageList() {
|
uni.navigateTo({
|
url: '../other/xxlb'
|
})
|
},
|
// 点击遮罩层
|
overlayClick() {
|
this.show = false
|
this.rightTopShow = false
|
},
|
// 右上角三条横线处点击
|
dotClick() {
|
this.rightTopShow = true
|
this.show = true
|
},
|
// 左上角左箭头点击事件
|
leftClick() {
|
uni.navigateBack()
|
|
|
//如果是入厂检验的第一个页面 不能采用uni.navigateBack() 需要采用 uni.navigateTo({})
|
// let url = getCurrentPages()[getCurrentPages().length - 1].$page.fullPath
|
// if (url.split('?')[0] === '/pages/zlgl/rcjy') {
|
// uni.navigateTo({
|
// url: '/pages/xtsy/index'
|
// })
|
// } else {
|
// uni.navigateBack()
|
// }
|
|
|
//获取上一页的页面路由
|
// let flag = getCurrentPages()[getCurrentPages().length - 2].$page.fullPath === "/pages/xtsy/index"
|
// console.log(flag, 6)
|
// if (flag) { //如果是返回到工作台页面
|
// uni.navigateTo({
|
// url: getCurrentPages()[getCurrentPages().length - 2].$page.fullPath + '?isGetList=true'
|
// })
|
// } else {
|
// uni.navigateBack()
|
// uni.navigateTo({
|
// // 方式一:此方式传参,刷新页面参数不丢失,参数在url上显示
|
// // 如果是对象或者数组参数可使用 JSON.stringfy(),将参数转化成字符串,然后获取时,通过 JSON.parse() 转化成对象
|
// url: getCurrentPages()[getCurrentPages().length - 2].$page.fullPath,
|
// // url: '/pages/page1/page1?id=1&name=橙子',
|
|
// // 方式二:通过eventChannel向被打开页面传送数据,此方式传参,刷新页面参数会丢失
|
// // 此方式只是适合 uni.navigateTo() 方法
|
// // success: function(res) {
|
// // res.eventChannel.emit('argParams', {
|
// // id: '100',
|
// // name: '菠萝'
|
// // })
|
// // }
|
// })
|
// }
|
|
|
},
|
// 点击退出登录按钮按钮返回登录页
|
goBackToLogin() {
|
uni.showModal({
|
title: '提示',
|
content: '是否确定退出!',
|
success: function(res) {
|
if (res.confirm) {
|
LoginOut().then(res2 => {
|
if (res2.code === '200') {
|
this.show = false
|
this.rightTopShow = false
|
// uni.setStorageSync('topRightMessageCount', 0)
|
}
|
})
|
|
uni.redirectTo({
|
//关闭当前页面,跳转到应用内的某个页面。
|
url: '../login/index'
|
});
|
} else if (res.cancel) {
|
console.log('用户点击取消');
|
this.show = false
|
this.rightTopShow = false
|
}
|
}
|
});
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.headClass {
|
display: flex;
|
justify-content: center;
|
align-items: flex-end;
|
width: 100%;
|
height: 120rpx;
|
// line-height: 100rpx;
|
color: #fff;
|
font-weight: bolder;
|
letter-spacing: 2rpx;
|
font-family: serif;
|
padding: 20rpx 0;
|
background-color: #0659ff;
|
}
|
|
.rightFlex {
|
width: 220rpx;
|
background-color: #DDDDDD;
|
right: 20rpx;
|
position: absolute;
|
z-index: 12;
|
border-radius: 20rpx;
|
|
.triangle {
|
width: 0px;
|
height: 0px;
|
border: 10rpx solid transparent;
|
/*以下四个样式对应四种三角形,任选其一即可实现*/
|
/* border-top-color:lightseagreen; */
|
/* border-left-color:lightseagreen; */
|
/* border-right-color:lightseagreen; */
|
border-bottom-color: #DDDDDD;
|
// border-bottom-color: #fff;
|
position: absolute;
|
right: 28rpx;
|
top: -18rpx;
|
}
|
|
.rightFlexItem {
|
// width: 100%;
|
height: 78rpx;
|
display: flex;
|
// justify-content: space-between;
|
align-items: center;
|
padding-left: 10rpx;
|
border-bottom: 1rpx solid #eee;
|
}
|
|
.rightFlexItemTitle {
|
margin-left: 10rpx;
|
font-size: 30rpx
|
}
|
|
::v-deep .u-icon__icon {
|
color: #444444 !important;
|
}
|
|
.u-button--info {
|
border: none;
|
display: flex;
|
justify-content: flex-start;
|
background-color: #eee;
|
color: #444444 !important;
|
}
|
|
::v-deep .u-icon__icon--info {
|
font-size: 28rpx !important;
|
}
|
}
|
|
::v-deep .uicon-arrow-left>span {
|
display: none;
|
}
|
</style>
|