mes_mobile/pages/person/person.vue

187 lines
5.6 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="person_page ">
<view class="person_top">
<view class="person_data">
<!-- <view class="person_logo"> -->
<!-- <button class="avatar-wrapper" open-type="chooseAvatar" bind:chooseavatar="onChooseAvatar"> -->
<image class="person_logo" :src="avatarUrl"></image>
<!-- </button> -->
<!-- </view> -->
<view class="person_name">
<view class="name">
<text class="font15">肖银奎</text>
<image src="http://dm-auto.oss-cn-shanghai.aliyuncs.com/mes_wechat/chaojihuiyuan.png" mode=""></image>
</view>
<view class="account font12">
登录账号ykxiao
</view>
</view>
</view>
</view>
<view class="person_content">
<view class="con_backlog">
<view class="font14">
待办事项
</view>
<view class="backlog_data">
<view class="backlog_module">
<view class="t-icon t-icon-shengchangongdan backlogicon"></view>
<view class="backlogname">工单审批</view>
</view>
<view class="backlog_module">
<view class="t-icon t-icon-shengchangongdan backlogicon"></view>
<view class="backlogname">流程审批</view>
</view>
<view class="backlog_module" @click="toAlarm">
<view class="t-icon t-icon-shengchangongdan backlogicon"></view>
<view class="backlogname">设备报警</view>
</view>
<view class="backlog_module">
<view class="t-icon t-icon-shengchangongdan backlogicon"></view>
<view class="backlogname">权限审批</view>
</view>
<view class="backlog_module" @click="toSafetyAccidents()">
<view class="t-icon t-icon-shengchangongdan backlogicon"></view>
<view class="backlogname">安全事故</view>
</view>
</view>
</view>
<view class="con_account" @click="toAccountCenter()">
<view class="t-icon t-icon-zhanghaozhongxin personicon"></view>
<view class="font14">账户中心</view>
</view>
<view class="con_data">
<view class="con_module" @click="toMessage">
<view class="t-icon t-icon-xiaoxitongzhi-gerenzhongxin personicon"></view>
<view class="font13">消息管理</view>
<view class=""></view>
</view>
<!-- <view class="con_module">
<view class="t-icon t-icon-shenpizhida personicon"></view>
<view class="font13">审批直达</view>
<view class=""></view>
</view> -->
<view class="con_module" @click="toMyAuthority()">
<view class="t-icon t-icon-wodequanxian personicon"></view>
<view class="font13">我的权限</view>
<view class=""></view>
</view>
<view class="con_module noborbot" @click="toFaceAuthentication()">
<view class="t-icon t-icon-renlianrenzheng personicon"></view>
<view class="font13">人脸认证</view>
<view class=""></view>
</view>
</view>
<view class="con_set">
<view class="t-icon t-icon-xitongshezhi-gerenzhongxin personicon"></view>
<view class="font13">系统设置</view>
</view>
</view>
<tab-bar :current-page="2"></tab-bar>
</view>
</template>
<script>
import tabBar from "@/components/customTabBar/index";
const defaultAvatarUrl = 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0';
export default {
components:{
tabBar
},
data() {
return {
avatarUrl:defaultAvatarUrl,
}
},
methods: {
//跳转设备报警
toAlarm(){
uni.navigateTo({
url:'/pages/person/alarm'
})
},
toSafetyAccidents(){
uni.navigateTo({
url:'/pages/person/safetyAccidents'
})
},
//跳转账户中心页
toAccountCenter(){
uni.navigateTo({
url: '/pages/person/accountCenter'
})
},
//跳转人脸认证页
toFaceAuthentication(){
uni.navigateTo({
url:'/pages/person/faceAuthentication'
})
},
toMyAuthority(){
uni.navigateTo({
url:'/pages/person/myAuthority'
})
},
//跳转消息页
toMessage(){
uni.navigateTo({
url: '/pages/index/message'
})
},
}
}
</script>
<style scoped lang="scss">
.person_page{ padding: 14px;
.person_top{margin-bottom:33px ;
.person_data{display: flex;align-items: center;
.person_logo{border-radius: 50%;width: 54px;height: 54px;margin:0 6px 0 4px;}
.person_name{
.name{display: flex;align-items: center;margin-bottom: 2px;
image{width: 50px;height: 16px;margin-left: 4px;}
}
.account{margin-top: 2px;}
}
}
}
.person_content{
.con_backlog{padding: 14px 10px 14px 15px;background: #1C2755;border-radius: 8px;margin-bottom: 12px;
.backlog_data{display: flex; flex-wrap: wrap;margin-top: 7px;
.backlog_module{width: 93px;height: 76px;display: flex;justify-content: center;flex-direction: column;align-items: center;border-radius: 8px;
background: #6576B7;margin: 5px 6px;}
.backlogicon{width: 32px;height: 32px;}
.backlogname{
font-size: $uni-font-size-sm;
padding-top: 5px;}
}
}
.con_account{
border-radius: 8px;
background: #1C2755;
display: flex;
height: 52px;
align-items: center;
padding: 0 14px;
margin-bottom: 10px;
}
.personicon{width: 24px;height: 24px;margin-right: 15px;}
.con_data{border-radius: 8px;
background: #1C2755;
padding: 0 14px;
margin-bottom: 12px;
.con_module{display: flex;height: 49px;align-items: center;border-bottom: 1px solid #2D3A6F;}
}
.con_set{border-radius: 8px;
background: #1C2755;
display: flex;
height: 48px;
align-items: center;
padding: 0 14px;
}
}
}
</style>