admin/zhgdyun
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

湖里大屏(劳务管理):人员概况模块

Browse Source
This commit is contained in:
骆乐 2022-08-04 13:33:10 +08:00
parent 10e5928528
commit 9e985aa0b3
1 changed files with 88 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

91
src/views/projectAdmin/dataBoard/projectHuScreen/laborManage/leftCenter.vue
View File

@ -1,7 +1,54 @@
<template> <template>
<!-- 人员概览 --> <!-- 人员概览 -->
<div class="container"> <div class="containerBox">
<div class="titleTxt">{{ title }}</div> <div class="titleTxt">{{ title }}</div>
<div class="personCount">
<div class="countItem">
<img src="@/assets/images/dataBoard/numImg_purple.png" />
<div class="info">
<div class="num1">
{{ '62,590' }}
</div>
<!-- 实名制人数 -->
<div class="label label1">
{{ '实名制人数' }}
</div>
</div>
</div>
<div class="countItem">
<img src="@/assets/images/dataBoard/numImg_orange.png" />
<div class="info">
<div class="num2">
{{ 62590 }}
</div>
<div class="label">
{{ '特殊工种人数' }}
</div>
</div>
</div>
<div class="countItem">
<img src="@/assets/images/dataBoard/numImg_orange.png" />
<div class="info">
<div class="num3">
{{ '89%'}}
</div>
<div class="label">
{{ '在职男女比例' }}
</div>
</div>
</div>
<div class="countItem">
<img src="@/assets/images/dataBoard/numImg_orange.png" />
<div class="info">
<div class="num4">
{{ 62590}}
</div>
<div class="label">
{{ '入场培训人数' }}
</div>
</div>
</div>
</div>
</div> </div>
</template> </template>
@ -26,7 +73,7 @@ export default {
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.container { .containerBox {
width: 100%; width: 100%;
height: 100%; height: 100%;
border: 1px solid #0081c3; border: 1px solid #0081c3;
@ -37,6 +84,44 @@ export default {
margin-top: 5px; margin-top: 5px;
margin-left: 5px; margin-left: 5px;
} }
.personCount {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-top: 20px;
margin-left: 30px;
.countItem {
flex-shrink: 0;
height: 35%;
width:48%;
margin-top: 20px;
img {
margin-right: 8px;
}
.info{
display: inline-block;
line-height: 28px;
.num1{
color:#7851f6;
}
.num2{
color:#6ee4f0;
}
.num3{
color:#3d83f3;
}
.num4{
color: #7852f7;
}
.label{
font-size: 12px;
}
.label1{
width:68px;
}
}
}
}
} }
</style> </style>