You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
302 lines
6.5 KiB
302 lines
6.5 KiB
<template>
|
|
<view id="warp">
|
|
<view class="top_info">
|
|
<image class="top_bg" lazy-load fade-show src="/static/images/common/bg.png"></image>
|
|
<view class="top_user" @tap="setUserInfo">
|
|
<view class="user_lef">
|
|
<image :src="userInfo.avatarUrl"></image>
|
|
<view class="user_lef_name">
|
|
<view>
|
|
{{ userInfo.userName || '用户名称' }}
|
|
<text>{{userInfo.roleName}}</text>
|
|
</view>
|
|
<view>{{ userInfo.companyName || '公司名称' }}</view>
|
|
</view>
|
|
</view>
|
|
<image class="rig_icon" src="/static/images/my/right_icon.png"></image>
|
|
</view>
|
|
</view>
|
|
<view class="cen_my_function">
|
|
<view class="c_m_fun_text">我的功能</view>
|
|
<scroll-view scroll-x="true" class="c_m_fun_list">
|
|
<view class="fun_list" v-for="(item) in myFun" :key="item.id" @tap="myHandleFun(item.router)">
|
|
<view class="zwf" v-if="iszwf"></view>
|
|
<image v-else lazy-load fade-show :src="'/static/images/my/'+item.icon"></image>
|
|
<view>{{item.name}}</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
<view class="bot_list">
|
|
<view class="cell_list" v-for="(item) in myNavList" :key="item.id" @tap="handleCell(item.router)">
|
|
<view class="cell_lef">
|
|
<view class="zwf2" v-if="iszwf"></view>
|
|
<image v-else lazy-load fade-show :src="'/static/images/my/'+item.icon"></image>
|
|
<view>{{item.name}}</view>
|
|
</view>
|
|
<view class="cell_lef">
|
|
<uni-badge v-if="item.code == 'message'" size="normal" style="margin-right: 20rpx;" :text="overspeedCount"></uni-badge>
|
|
<image class="cell_icon" src="/static/images/my/right_icon.png"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
const {urlList,https} = require('@/static/api');
|
|
export default {
|
|
data() {
|
|
return {
|
|
overspeedCount:0,
|
|
userInfo: null,
|
|
iszwf:true,
|
|
myFun: [{
|
|
name: '回单查询',
|
|
icon: 'myFun/hui.png'
|
|
},
|
|
{
|
|
name: '任务统计',
|
|
icon: 'myFun/hui.png'
|
|
},
|
|
{
|
|
name: '车辆管理',
|
|
icon: 'myFun/hui.png'
|
|
},
|
|
{
|
|
name: '工程管理',
|
|
icon: 'myFun/hui.png'
|
|
},
|
|
{
|
|
name: '人员管理',
|
|
icon: 'myFun/hui.png'
|
|
},
|
|
{
|
|
name: '油耗管理',
|
|
icon: 'myFun/hui.png'
|
|
},
|
|
],
|
|
myNavList: [{
|
|
name: '消息通知',
|
|
icon: 'myFun/hui.png'
|
|
},
|
|
{
|
|
name: '车场位置',
|
|
icon: 'myFun/hui.png'
|
|
},
|
|
{
|
|
name: '公司信息',
|
|
icon: 'myFun/hui.png'
|
|
},
|
|
{
|
|
name: '系统设置',
|
|
icon: 'myFun/hui.png'
|
|
},
|
|
{
|
|
name: '关于我们',
|
|
icon: 'myFun/hui.png'
|
|
},
|
|
],
|
|
};
|
|
},
|
|
onLoad() {
|
|
let menus = uni.getStorageSync('token').menus
|
|
this.myFun = menus.filter(item => {
|
|
if(item.type == 1) return item;
|
|
});
|
|
this.myNavList = menus.filter(item => {
|
|
if(item.type != 1) return item;
|
|
});
|
|
setTimeout(()=>{
|
|
this.iszwf = false
|
|
},300)
|
|
https(urlList.getUnreadCount,'GET','','').then(data => {
|
|
console.log('信息未读数',data)
|
|
this.overspeedCount = data.data.overspeedCount;
|
|
}).catch(err => {
|
|
uni.showToast({
|
|
title:err,
|
|
icon:'none',
|
|
duration:1500
|
|
});
|
|
})
|
|
},
|
|
onShow() {
|
|
this.userInfo = uni.getStorageSync('userinfo')
|
|
},
|
|
methods: {
|
|
myHandleFun(url) {
|
|
uni.navigateTo({
|
|
url
|
|
})
|
|
},
|
|
handleCell(url) {
|
|
uni.navigateTo({
|
|
url
|
|
})
|
|
},
|
|
setUserInfo() {
|
|
uni.navigateTo({
|
|
url: '/pages/myInfo/myInfo'
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.rig_icon {
|
|
width: 28rpx;
|
|
height: 28rpx;
|
|
}
|
|
#warp {
|
|
width: 100%;
|
|
height: 100%;
|
|
.top_info {
|
|
width: 100%;
|
|
height: 320rpx;
|
|
.top_bg {
|
|
height: 100%;
|
|
width: 100%;
|
|
background-color: #3476fe;
|
|
}
|
|
.top_user {
|
|
width: 90%;
|
|
height: 200rpx;
|
|
margin: 0 auto;
|
|
position: relative;
|
|
margin-top: -300rpx;
|
|
z-index: 99;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
.user_lef {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
image {
|
|
width: 126rpx;
|
|
height: 126rpx;
|
|
border-radius: 50%;
|
|
}
|
|
.user_lef_name {
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin-left: 20rpx;
|
|
font-size: 38rpx;
|
|
color: white;
|
|
view {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
text {
|
|
width: 120rpx;
|
|
height: 42rpx;
|
|
background-color: #CED8FFFF;
|
|
border-radius: 24rpx;
|
|
line-height: 42rpx;
|
|
text-align: center;
|
|
color: #3476FEFF;
|
|
font-size: 24rpx;
|
|
margin-left: 20rpx;
|
|
}
|
|
}
|
|
view:nth-child(2) {
|
|
margin-top: 10rpx;
|
|
font-size: 28rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.cen_my_function {
|
|
width: 680rpx;
|
|
margin: 0 auto;
|
|
padding: 25rpx 15rpx;
|
|
border-radius: 10rpx;
|
|
position: relative;
|
|
margin-top: -70rpx;
|
|
background-color: white;
|
|
box-shadow: 0 3px 3px 0 #d6d6d6;
|
|
z-index: 9999;
|
|
.c_m_fun_text {
|
|
margin-left: 20rpx;
|
|
font-size: 32rpx;
|
|
color: #323232;
|
|
font-weight: bold;
|
|
}
|
|
.c_m_fun_list {
|
|
margin-top: 35rpx;
|
|
width: 100%;
|
|
height: 150rpx;
|
|
white-space: nowrap; // 滚动必须加的属性
|
|
// display: flex;
|
|
// flex-direction: row;
|
|
// justify-content: space-between;
|
|
.fun_list {
|
|
width: 20%;
|
|
// display: flex;
|
|
// flex-direction: column;
|
|
// align-items: center;
|
|
display: inline-block;
|
|
image {
|
|
height: 88rpx;
|
|
width: 88rpx;
|
|
display: block;
|
|
margin: 0 auto;
|
|
}
|
|
.zwf{
|
|
height: 88rpx;
|
|
width: 88rpx;
|
|
display: block;
|
|
margin: 0 auto;
|
|
background:#f3f3f3;
|
|
}
|
|
view {
|
|
width: 100%;
|
|
text-align: center;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
margin-top: 15rpx;
|
|
font-size: 26rpx;
|
|
color: #303030;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.bot_list {
|
|
width: 100%;
|
|
margin-top: 20rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
.cell_list {
|
|
width: 93%;
|
|
height: 100rpx;
|
|
border-bottom: 1rpx solid #f4f4f4;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
.cell_lef {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
image {
|
|
height: 45rpx;
|
|
width: 45rpx;
|
|
margin-right: 20rpx;
|
|
}
|
|
.zwf2{
|
|
height: 45rpx;
|
|
width: 45rpx;
|
|
margin-right: 20rpx;
|
|
background:#f3f3f3;
|
|
}
|
|
.cell_icon {
|
|
height: 22rpx;
|
|
width: 22rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
|