湖里大屏(劳务管理):在场统计页面更改
This commit is contained in:
parent
e15b186806
commit
aa984fc814
@ -2,7 +2,7 @@
|
|||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="leftBox">
|
<div class="leftBox">
|
||||||
<div class="leftTop">
|
<div class="leftTop">
|
||||||
<leftTop title="人员类别" />
|
<leftTop title="在场统计" />
|
||||||
</div>
|
</div>
|
||||||
<div class="leftCenter">
|
<div class="leftCenter">
|
||||||
<leftCenter title="人员概况"></leftCenter>
|
<leftCenter title="人员概况"></leftCenter>
|
||||||
|
|||||||
@ -2,12 +2,11 @@
|
|||||||
<!-- 人员类别 -->
|
<!-- 人员类别 -->
|
||||||
<div class="containerBox">
|
<div class="containerBox">
|
||||||
<div class="titleTxt">{{ title }}</div>
|
<div class="titleTxt">{{ title }}</div>
|
||||||
<div class="personCount">
|
<!-- <div class="personCount">
|
||||||
<div class="countItem">
|
<div class="countItem">
|
||||||
<img src="@/assets/images/projectImg/labor_green.png" />
|
<img src="@/assets/images/projectImg/labor_green.png" />
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<div class="num1">{{ 62590 }}</div>
|
<div class="num1">{{ 62590 }}</div>
|
||||||
<!-- 实名制人数 -->
|
|
||||||
<div class="label label1">{{ '在场总人数' }}</div>
|
<div class="label label1">{{ '在场总人数' }}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -15,22 +14,98 @@
|
|||||||
<img src="@/assets/images/projectImg/labor_yellow.png" />
|
<img src="@/assets/images/projectImg/labor_yellow.png" />
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<div class="num2">{{ 62590 }}</div>
|
<div class="num2">{{ 62590 }}</div>
|
||||||
<!-- 在场人数 -->
|
|
||||||
<div class="label">{{ '在场劳务人数' }}</div>
|
<div class="label">{{ '在场劳务人数' }}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>-->
|
||||||
|
<div class="statisticsHead">
|
||||||
|
<div class="statisticsHead_item">
|
||||||
|
<span style="color:#5181F6">{{statisticsCount.workercount.totalPerson}}</span>
|
||||||
|
<p>
|
||||||
|
<!-- 在册人数 -->
|
||||||
|
{{$t('message.dataBoard.numberOfPresent')}}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="statisticsHead_item">
|
||||||
|
<span style="color: #F67F51;">{{statisticsCount.workercount.totalPerson}}</span>
|
||||||
|
<p>
|
||||||
|
<!-- 实名制人数 -->
|
||||||
|
{{$t('message.dataBoard.realnameSystem')}}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="statisticsHead_item">
|
||||||
|
<span style="color: #5CE2F6;">{{ statisticsCount.presencecount.lsPersonTotal}}</span>
|
||||||
|
<span>/</span>
|
||||||
|
<span>{{statisticsCount.workercount.lsPersonTotal}}</span>
|
||||||
|
<p>
|
||||||
|
<!-- 临时工人数 -->
|
||||||
|
{{$t('message.dataBoard.numberOfTemporaryWorkers')}}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="persontype">
|
<div class="persontype">
|
||||||
<span>项目管理人员</span>
|
<p class="person">679</p>
|
||||||
<p class="person">679</p>
|
<p class="person">679</p>
|
||||||
<span>特种作业人员</span>
|
|
||||||
<p class="person">679</p>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="persontype">
|
<div class="persontype">
|
||||||
<span>一般作业人员</span>
|
<span>在册甲方管理人员数</span>
|
||||||
<p class="person">679</p>
|
<span>在场甲方管理人员数</span>
|
||||||
<span>临时作业人员</span>
|
</div>
|
||||||
<p class="person">679</p>
|
<div class="persontype">
|
||||||
|
<p class="person">679</p>
|
||||||
|
<p class="person">679</p>
|
||||||
|
</div>
|
||||||
|
<div class="persontype">
|
||||||
|
<span>在册劳务人员数</span>
|
||||||
|
<span>在场劳务人员数</span>
|
||||||
|
</div>
|
||||||
|
<div class="minTit">
|
||||||
|
<div class="point"></div>
|
||||||
|
{{$t('message.dataBoard.managementPersonnelStatistics')}}
|
||||||
|
</div>
|
||||||
|
<div class="management">
|
||||||
|
<div class="management_item">
|
||||||
|
<div class="item_content">
|
||||||
|
<span style="color: #5CE2F6;">{{statisticsCount.presencecount.jlGlPersonTotal}}</span>
|
||||||
|
<span>/</span>
|
||||||
|
<span>{{statisticsCount.workercount.jlGlPersonTotal}}</span>
|
||||||
|
<p>
|
||||||
|
<!-- 监理人员 -->
|
||||||
|
{{$t('message.dataBoard.supervisoryStaff')}}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="itemImgBox" style="border: 1px solid #F67F51;">
|
||||||
|
<img src="@/assets/images/dataBoard/jl.png" alt />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="management_item">
|
||||||
|
<div class="item_content">
|
||||||
|
<span style="color: #5CE2F6;">{{statisticsCount.presencecount.jfGlPersonTotal}}</span>
|
||||||
|
<span>/</span>
|
||||||
|
<span>{{statisticsCount.workercount.jfGlPersonTotal}}</span>
|
||||||
|
<p>
|
||||||
|
<!-- 甲方人员 -->
|
||||||
|
{{$t('message.dataBoard.PartyAPersonnel')}}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="itemImgBox" style="border: 1px solid #5181F6;">
|
||||||
|
<img src="@/assets/images/dataBoard/jf.png" alt />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="management_item">
|
||||||
|
<div class="item_content">
|
||||||
|
<span style="color: #5CE2F6;">{{statisticsCount.presencecount.yfGlPersonTotal}}</span>
|
||||||
|
<span>/</span>
|
||||||
|
<span>{{statisticsCount.workercount.yfGlPersonTotal}}</span>
|
||||||
|
<p>
|
||||||
|
<!-- 乙方人员 -->
|
||||||
|
{{$t('message.dataBoard.PartyBPersonnel')}}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="itemImgBox" style="border: 1px solid #7851F6;">
|
||||||
|
<img src="@/assets/images/dataBoard/yf.png" alt />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -44,7 +119,51 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {};
|
return {
|
||||||
|
statisticsCount: {
|
||||||
|
attendancePersonNum: 0,
|
||||||
|
educationPersonNum: 0,
|
||||||
|
workercount: {
|
||||||
|
lwPersonYesterdayAdd: 0,
|
||||||
|
eduPersonTotal: 0,
|
||||||
|
jfGlPersonTotal: 0,
|
||||||
|
age18: 0,
|
||||||
|
age18to25: 0,
|
||||||
|
womanPersonTotal: 0,
|
||||||
|
lsPersonTotal: 0,
|
||||||
|
jlGlPersonTotal: 0,
|
||||||
|
age45to60: 0,
|
||||||
|
lwPersonTotal: 0,
|
||||||
|
manPersonTotal: 0,
|
||||||
|
totalPerson: 0,
|
||||||
|
age25to35: 0,
|
||||||
|
glPersonTotal: 0,
|
||||||
|
yfGlPersonTotal: 0,
|
||||||
|
avgage: 0,
|
||||||
|
age35to45: 0,
|
||||||
|
glPersonYesterdayAdd: 0,
|
||||||
|
age60: 0
|
||||||
|
},
|
||||||
|
presencecount: {
|
||||||
|
jfGlPersonTotal: 0,
|
||||||
|
age18: 0,
|
||||||
|
age18to25: 0,
|
||||||
|
womanPersonTotal: 0,
|
||||||
|
lsPersonTotal: 0,
|
||||||
|
jlGlPersonTotal: 0,
|
||||||
|
age45to60: 0,
|
||||||
|
lwPersonTotal: 0,
|
||||||
|
manPersonTotal: 0,
|
||||||
|
totalPerson: 0,
|
||||||
|
age25to35: 0,
|
||||||
|
glPersonTotal: 0,
|
||||||
|
yfGlPersonTotal: 0,
|
||||||
|
avgage: 0,
|
||||||
|
age35to45: 0,
|
||||||
|
age60: 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@ -55,61 +174,127 @@ export default {
|
|||||||
height: 100%;
|
height: 100%;
|
||||||
border: 1px solid #0081c3;
|
border: 1px solid #0081c3;
|
||||||
|
|
||||||
|
.statisticsHead {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
margin: 20px 0px;
|
||||||
|
background-image: linear-gradient(
|
||||||
|
to right,
|
||||||
|
rgba(92, 226, 246, 0),
|
||||||
|
rgba(92, 226, 246, 0.2),
|
||||||
|
rgba(92, 226, 246, 0)
|
||||||
|
);
|
||||||
|
.statisticsHead_item {
|
||||||
|
box-sizing: border-box;
|
||||||
|
width: 113px;
|
||||||
|
height: 50px;
|
||||||
|
font-size: 16px;
|
||||||
|
text-align: center;
|
||||||
|
padding-top: 5px;
|
||||||
|
span {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.titleTxt {
|
.titleTxt {
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
color: #6ee4f0;
|
color: #6ee4f0;
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
}
|
}
|
||||||
.personCount {
|
// .personCount {
|
||||||
display: flex;
|
// display: flex;
|
||||||
margin-top: 30px;
|
// margin-top: 30px;
|
||||||
margin-left: 30px;
|
// margin-left: 30px;
|
||||||
margin-bottom: 30px;
|
// margin-bottom: 30px;
|
||||||
.countItem {
|
// .countItem {
|
||||||
flex: 1;
|
// flex: 1;
|
||||||
height: 35%;
|
// height: 35%;
|
||||||
display: flex;
|
// display: flex;
|
||||||
img {
|
// img {
|
||||||
margin-right: 8px;
|
// margin-right: 8px;
|
||||||
width:50px;
|
// width: 50px;
|
||||||
height:50px;
|
// height: 50px;
|
||||||
}
|
// }
|
||||||
.info {
|
// .info {
|
||||||
margin-top: 5px;
|
// margin-top: 5px;
|
||||||
.num1 {
|
// .num1 {
|
||||||
color: #309b8a;
|
// color: #309b8a;
|
||||||
}
|
// }
|
||||||
.num2 {
|
// .num2 {
|
||||||
color: #f7d400;
|
// color: #f7d400;
|
||||||
}
|
// }
|
||||||
.label {
|
// .label {
|
||||||
font-size: 12px;
|
// font-size: 12px;
|
||||||
}
|
// }
|
||||||
.label1 {
|
// .label1 {
|
||||||
width: 68px;
|
// width: 68px;
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
.persontype {
|
.persontype {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
height: 38px;
|
height: 23px;
|
||||||
line-height: 30px;
|
line-height: 23px;
|
||||||
margin-bottom: 20px;
|
// margin-bottom: 10px;
|
||||||
span{
|
span {
|
||||||
font-size: 12px;
|
width: 168px;
|
||||||
|
text-align: left;
|
||||||
|
font-size: 16px;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
.person {
|
.person {
|
||||||
width: 15%;
|
width: 25%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin-right: 30px;
|
margin-right: 60px;
|
||||||
color: #47b1c4;
|
color: #47b1c4;
|
||||||
background-image: url(~@/assets/images/projectImg/numBgc.png);
|
// background-image: url(~@/assets/images/projectImg/numBgc.png);
|
||||||
background-size:100%;
|
// background-size:100%;
|
||||||
background-repeat: no-repeat;
|
// background-repeat: no-repeat;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.minTit {
|
||||||
|
color: #ffffff;
|
||||||
|
margin-top: 20px;
|
||||||
|
.point {
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
margin-left: 20px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: #5be1f5;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.management {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
position: absolute;
|
||||||
|
margin-top: 20px;
|
||||||
|
// top: 2%;
|
||||||
|
left: 5%;
|
||||||
|
.management_item {
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: relative;
|
||||||
|
width: 120px;
|
||||||
|
text-align: start;
|
||||||
|
margin-right: 15px;
|
||||||
|
.item_content {
|
||||||
|
position: absolute;
|
||||||
|
left: 50px;
|
||||||
|
}
|
||||||
|
.itemImgBox {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 50%;
|
||||||
|
img {
|
||||||
|
margin-top: 8px;
|
||||||
|
margin-left: 8px;
|
||||||
|
width: 23px;
|
||||||
|
height: 23px;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user