湖里大屏(劳务管理):人员类别模块
This commit is contained in:
parent
1c432ff8b1
commit
10e5928528
@ -1,14 +1,42 @@
|
|||||||
<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">{{ 62590 }}</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>
|
||||||
|
<div class="persontype">
|
||||||
|
<span>项目管理人员</span>
|
||||||
|
<p class="person">679</p>
|
||||||
|
<span>特种作业人员</span>
|
||||||
|
<p class="person">679</p>
|
||||||
|
</div>
|
||||||
|
<div class="persontype">
|
||||||
|
<span>一般作业人员</span>
|
||||||
|
<p class="person">679</p>
|
||||||
|
<span>临时作业人员</span>
|
||||||
|
<p class="person">679</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
title: {
|
title: {
|
||||||
type: String,
|
type: String,
|
||||||
@ -16,17 +44,13 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {};
|
||||||
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
};
|
||||||
</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 +61,55 @@ export default {
|
|||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
}
|
}
|
||||||
|
.personCount {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 30px;
|
||||||
|
margin-left: 30px;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
.countItem {
|
||||||
|
flex: 1;
|
||||||
|
height: 35%;
|
||||||
|
display: flex;
|
||||||
|
img {
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
.info {
|
||||||
|
margin-top: 5px;
|
||||||
|
.num1 {
|
||||||
|
color: #309b8a;
|
||||||
|
}
|
||||||
|
.num2 {
|
||||||
|
color: #f7d400;
|
||||||
|
}
|
||||||
|
.label {
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
.label1 {
|
||||||
|
width: 68px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.persontype {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
height: 38px;
|
||||||
|
line-height: 30px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
span{
|
||||||
|
font-size: 12px;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.person {
|
||||||
|
width: 15%;
|
||||||
|
text-align: center;
|
||||||
|
margin-right: 30px;
|
||||||
|
color: #47b1c4;
|
||||||
|
background-image: url(~@/assets/images/projectImg/numBgc.png);
|
||||||
|
background-size:100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user