<template>
|
<view class="home_index">
|
<view class="home_content">
|
<u-navbar
|
title="首页"
|
@rightClick="rightClick"
|
bgColor="transparent"
|
leftIconColor="transparent"
|
titleStyle="text-align:left;width:230px;color:#fff"
|
:autoBack="true">
|
<view class="u-nav-slot" slot="left">
|
<u-icon name="home" size="28" color="#fff"></u-icon>
|
</view>
|
</u-navbar>
|
<view class="home_top_bg"></view>
|
<view class="home_middle_main">
|
<view class="home_middle_header">
|
<view class="home_header_item">
|
<view class="home_header_item_text">姓名：</view>
|
<view class="home_header_item_datas" style="color:#2D81FF">{{realName}}</view>
|
</view>
|
<view class="home_header_item">
|
<view class="home_header_item_text">工种：</view>
|
<view class="home_header_item_datas">{{works.posName}}</view>
|
</view>
|
</view>
|
<view class="home_middle_img">
|
<!-- <u-image :src="`${basrUrl}/materials/steelPrint/test?num=${openId}`" width="280rpx" height="280rpx"></u-image> -->
|
<u-image :src="`https://szpipe.thhy-tj.com/${works.photo}`" width="280rpx" height="280rpx" v-if="works.phone"></u-image>
|
<u-image src="@/static/workers_icons.png" width="280rpx" height="280rpx" v-else></u-image>
|
</view>
|
<view class="home_middle_line"></view>
|
<view class="home_middle_tips">
|
<view class="home_footer_tips">安全码标识说明</view>
|
<view class="home_footer_states" v-if="works.an>=81"><span>正常</span>（可以进行安全生产操作）</view>
|
<view class="home_footer_states1" v-if="works.an<=51"><span>高风险</span>（高风险可以进行安全生产操作）</view>
|
<view class="home_footer_states2" v-if="works.an>51&&works.an<81"><span>重点监控</span>（重点监控可以进行安全生产操作）</view>
|
</view>
|
</view>
|
<view class="home_footer_menu">
|
<view class="home_menu_items" v-for="(menuItems,menuIndex) in menuLists" :key="menuIndex">
|
<u-image class="home_menu_icons" :src="`https://szpipe.thhy-tj.com/${menuItems.menuIcon}`" width="128rpx" height="128rpx" @click="menuClick(menuItems)"></u-image>
|
<view class="home_menu_text">{{menuItems.menuName}}</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import { basrUrl } from '@/api/http';
|
export default {
|
data(){
|
return{
|
basrUrl:basrUrl,
|
menuLists:uni.getStorageSync('menus'),
|
realName:uni.getStorageSync('realName'),
|
works:null,//工种
|
openId:uni.getStorageSync('openId'),
|
userType:uni.getStorageSync('userType'),
|
}
|
},
|
onLoad() {
|
this.showUserInfo()
|
},
|
methods:{
|
//展示用户信息
|
showUserInfo(){
|
this.$api.system.labourHomeInfo({openId:this.openId,userType:this.userType}).then(res=>{
|
if(res.statusMsg === 'ok'){
|
this.works = res.data
|
}else{
|
uni.$u.toast(res.statusMsg);
|
}
|
})
|
},
|
rightClick(){
|
console.log(55555)
|
},
|
//点击按钮
|
menuClick(val){
|
uni.navigateTo({
|
url: `${val.menuUrl}`
|
})
|
}
|
}
|
}
|
</script>
|
|
<style scoped lang="scss">
|
.home_index{
|
background-color: #F8F8F8;
|
height: 100vh;
|
position: relative;
|
.home_content{
|
// height: calc(100vh - 110rpx);
|
.home_top_bg{
|
background: url('https://s1.ax1x.com/2022/09/14/vvBuYq.png') no-repeat;
|
background-size: 100% 100%;
|
height: 40vh;
|
position: absolute;
|
left: 0;
|
top: 0;
|
right: 0;
|
}
|
.home_middle_main{
|
height: 45vh;
|
position: absolute;
|
top: 220rpx;
|
left: 10rpx;
|
right: 10rpx;
|
margin: 10rpx 20rpx;
|
background-color: #FFFFFF;
|
border-radius: 12rpx;
|
|
.home_middle_header{
|
height: 5vh;
|
position: absolute;
|
top: 20rpx;
|
left: 10rpx;
|
right: 10rpx;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
padding: 0rpx 10rpx;
|
|
.home_header_item{
|
display: flex;
|
.home_header_item_text{
|
color: #333333;
|
}
|
.home_header_item_datas{
|
color: #333333;
|
}
|
}
|
}
|
.home_middle_img{
|
height: calc(100% - 40vh);
|
position: absolute;
|
top: 280rpx;
|
left: 10rpx;
|
right: 10rpx;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
.home_middle_line{
|
height: 1rpx;
|
background-color: #F8F8F8;
|
position: absolute;
|
top: 230px;
|
left: 10rpx;
|
right: 10rpx;
|
margin-top: 80rpx;
|
}
|
.home_middle_tips{
|
display:flex;
|
flex-flow: column;
|
justify-content: space-around;
|
align-items: center;
|
position: absolute;
|
top: 480rpx;
|
left: 10rpx;
|
right: 10rpx;
|
.home_footer_tips{
|
margin-top: 18px;
|
color: #999999;
|
font-size: 15px;
|
position: absolute;
|
top: 40px;
|
left: 50%;
|
margin-left: -53px;
|
}
|
.home_footer_states{
|
margin-top: 22px;
|
color: #23EE7F;
|
font-size: 15px;
|
position: absolute;
|
top: 66px;
|
left: 50%;
|
margin-left: -124px;
|
span{
|
color: #FDFFFE;
|
font-size: 13px;
|
background-color: #23EE7F;
|
padding: 5rpx 25rpx;
|
border-radius: 6rpx;
|
}
|
}
|
.home_footer_states1{
|
margin-top: 22px;
|
color: #FC494B;
|
font-size: 15px;
|
position: absolute;
|
top: 66px;
|
left: 50%;
|
margin-left: -124px;
|
span{
|
color: #FDFFFE;
|
font-size: 13px;
|
background-color: #FC494B;
|
padding: 5rpx 25rpx;
|
border-radius: 6rpx;
|
}
|
}
|
.home_footer_states2{
|
margin-top: 22px;
|
color: #F38F1C;
|
font-size: 15px;
|
position: absolute;
|
top: 66px;
|
left: 50%;
|
margin-left: -124px;
|
span{
|
color: #FDFFFE;
|
font-size: 13px;
|
background-color: #F38F1C;
|
padding: 5rpx 25rpx;
|
border-radius: 6rpx;
|
}
|
}
|
}
|
}
|
.home_footer_menu{
|
height: 35vh;
|
position: absolute;
|
bottom: 30rpx;
|
left: 10rpx;
|
right: 20rpx;
|
margin: 10rpx 20rpx;
|
background-color: #FFFFFF;
|
border-radius: 12rpx;
|
display: flex;
|
flex-direction: row;
|
justify-content: space-between;
|
flex-wrap: wrap;
|
|
.home_menu_items{
|
max-width: calc(100%/3);
|
height: 80px;
|
margin: 66rpx 30rpx 5rpx;
|
.home_menu_icons{
|
}
|
.home_menu_text{
|
color: #999999;
|
}
|
}
|
}
|
}
|
}
|
</style>
|
