563 lines
14 KiB
Vue
563 lines
14 KiB
Vue
<template>
|
||
<view class="fullHeight bgLightBlue">
|
||
<scroll-view scroll-y="true" class="pageContent">
|
||
<headers :showBack="parentSn">
|
||
<!-- <image @click="goBack" src="../../static/logo.png" class="backImg" v-show="showMapBack"></image> -->
|
||
<view class="headerName">
|
||
<!-- {{backArr.length>0?[backArr.length-1].name:'集团'}} -->
|
||
{{currentCompany.companyName}}
|
||
</view>
|
||
</headers>
|
||
<scroll-view v-if="userInfo.accountType!=5&&userInfo.accountType!=6" class="scroll-view_H" scroll-x="true">
|
||
<view class="scroll-view-item_H" :class="activeTabIndex==-1?'active':''" @click="changeLevel(-1)">
|
||
<text class="name">{{currentCompany.companyName=='集团'?currentCompany.companyName:'全部'}}</text>
|
||
</view>
|
||
<view class="scroll-view-item_H" :class="activeTabIndex==index?'active':''" v-for="(item,index) in mapData" :key="index" @click="changeLevel(index)">
|
||
<text class="name">{{item.name}}</text>
|
||
</view>
|
||
</scroll-view>
|
||
<view class="statictisBox">
|
||
<!-- <view class="currentName">
|
||
集团
|
||
</view> -->
|
||
<!-- <view class="numBox">
|
||
<view class="num">
|
||
1312
|
||
</view>
|
||
<text class="text">区域总数</text>
|
||
</view>
|
||
<view class="numBox">
|
||
<view class="num">
|
||
1312
|
||
</view>
|
||
<text class="text">城市总数</text>
|
||
</view> -->
|
||
<view class="numBox" v-if="statisticsCount.projectcount">
|
||
<view class="num">
|
||
{{statisticsCount.projectcount.projectNum}}
|
||
</view>
|
||
<text class="text">项目总数</text>
|
||
</view>
|
||
<view class="numBox" v-else>
|
||
<view class="num">
|
||
{{projectDetail.saleAcreage}}
|
||
</view>
|
||
<text class="text">建筑面积㎡</text>
|
||
</view>
|
||
<uni-icons @click="forwardFn" color="white" v-show="activeTabIndex!=-1&&!mapData[activeTabIndex].projectSn" class="forwardImg" type="arrowright" size="30"></uni-icons>
|
||
</view>
|
||
<view class="blockBox">
|
||
<view class="blockTitle">
|
||
<view class="titleName">
|
||
人员管理
|
||
</view>
|
||
</view>
|
||
<view class="blockContent">
|
||
<view class="dataBox">
|
||
<view class="dataItem">
|
||
<view class="num primaryText">
|
||
{{statisticsCount.workercount.totalPerson}}
|
||
</view>
|
||
<view class="text">
|
||
在职人数
|
||
</view>
|
||
</view>
|
||
<view class="dataItem">
|
||
<view class="num primaryText">
|
||
{{statisticsCount.workercount.totalPerson}}
|
||
</view>
|
||
<view class="text">
|
||
实名制人数
|
||
</view>
|
||
</view>
|
||
<view class="dataItem">
|
||
<view class="num primaryText2">
|
||
{{statisticsCount.workercount.lsPersonTotal}}
|
||
</view>
|
||
<view class="text">
|
||
临时工人数
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="dataBox">
|
||
<view class="dataItem">
|
||
<view class="num primaryText">
|
||
{{statisticsCount.workercount.jfGlPersonTotal}}
|
||
</view>
|
||
<view class="text">
|
||
在职甲方管理人员数
|
||
</view>
|
||
</view>
|
||
<view class="dataItem">
|
||
<view class="num primaryText">
|
||
{{statisticsCount.presencecount.jfGlPersonTotal}}
|
||
</view>
|
||
<view class="text">
|
||
在场甲方管理人员数
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="dataBox">
|
||
<view class="dataItem">
|
||
<view class="num primaryText">
|
||
{{statisticsCount.workercount.lwPersonTotal}}
|
||
</view>
|
||
<view class="text">
|
||
在职劳务人员数
|
||
</view>
|
||
</view>
|
||
<view class="dataItem">
|
||
<view class="num primaryText">
|
||
{{statisticsCount.presencecount.lwPersonTotal}}
|
||
</view>
|
||
<view class="text">
|
||
在场劳务人员数
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="blockBox">
|
||
<view class="blockTitle">
|
||
<view class="titleName">
|
||
设备数量<!-- 状态 -->
|
||
</view>
|
||
<!-- <view class="statusTips">
|
||
<view class="kuai kuai1">
|
||
|
||
</view>
|
||
<view class="text">
|
||
在线
|
||
</view>
|
||
<view class="kuai kuai2">
|
||
|
||
</view>
|
||
<view class="text">
|
||
故障
|
||
</view>
|
||
<view class="kuai kuai3">
|
||
|
||
</view>
|
||
<view class="text">
|
||
离线
|
||
</view>
|
||
</view> -->
|
||
</view>
|
||
<view class="blockContent">
|
||
<view class="dataBox">
|
||
<view class="dataItem">
|
||
<view class="num primaryText">
|
||
{{statisticsCount.devcount.ufaceDevNum}}
|
||
</view>
|
||
<!-- <view class="kuaiBox">
|
||
<view class="kuai kuai1">
|
||
{{statisticsCount.devcount.ufaceDevNum}}
|
||
</view>
|
||
<view class="kuai kuai2">
|
||
0
|
||
</view>
|
||
<view class="kuai kuai3">
|
||
0
|
||
</view>
|
||
</view> -->
|
||
<view class="text">
|
||
人脸门禁
|
||
</view>
|
||
</view>
|
||
<view class="dataItem">
|
||
<view class="num primaryText">
|
||
{{statisticsCount.devcount.videoNum}}
|
||
</view>
|
||
<!-- <view class="kuaiBox">
|
||
<view class="kuai kuai1">
|
||
{{statisticsCount.devcount.videoNum}}
|
||
</view>
|
||
<view class="kuai kuai2">
|
||
0
|
||
</view>
|
||
<view class="kuai kuai3">
|
||
0
|
||
</view>
|
||
</view> -->
|
||
<view class="text">
|
||
视频监控
|
||
</view>
|
||
</view>
|
||
<view class="dataItem">
|
||
<view class="num primaryText2">
|
||
{{statisticsCount.devcount.environmentDevNum}}
|
||
</view>
|
||
<!-- <view class="kuaiBox">
|
||
<view class="kuai kuai1">
|
||
{{statisticsCount.devcount.environmentDevNum}}
|
||
</view>
|
||
<view class="kuai kuai2">
|
||
0
|
||
</view>
|
||
<view class="kuai kuai3">
|
||
0
|
||
</view>
|
||
</view> -->
|
||
<view class="text">
|
||
环境监测
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- <view class="blockBox">
|
||
<view class="blockTitle">
|
||
<view class="titleName">
|
||
入场培训教育统计
|
||
</view>
|
||
</view>
|
||
<view class="blockContent">
|
||
<view class="dataBox">
|
||
<view class="dataItem">
|
||
<view class="num primaryText">
|
||
0
|
||
</view>
|
||
<view class="text">
|
||
已培训人数
|
||
</view>
|
||
</view>
|
||
<view class="dataItem">
|
||
<view class="num primaryText">
|
||
0.00%
|
||
</view>
|
||
<view class="text">
|
||
培训率
|
||
</view>
|
||
</view>
|
||
<view class="dataItem">
|
||
<view class="num primaryText2">
|
||
0
|
||
</view>
|
||
<view class="text">
|
||
不良人数
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view> -->
|
||
<view class="blockBox">
|
||
<view class="blockTitle">
|
||
<view class="titleName">
|
||
年龄结构
|
||
</view>
|
||
<view class="statusTips">
|
||
<view class="kuai kuai1">
|
||
|
||
</view>
|
||
<view class="text">
|
||
在职占比
|
||
</view>
|
||
<view class="kuai kuai4">
|
||
|
||
</view>
|
||
<view class="text">
|
||
在场占比
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="blockContent">
|
||
<u-charts canvas-id="ageChart" chartType="column" :opts="ageChartData" ref="ageChart"/>
|
||
<!-- :cWidth="cWidth" :cHeight="cHeight" -->
|
||
<view class="avgageBox">
|
||
<text>平均年龄</text>
|
||
<view class="">
|
||
<text class="primaryText">在职 {{statisticsCount.workercount.avgage.toFixed(0)}}岁</text>
|
||
<text class="primaryText3">在场 {{statisticsCount.presencecount.avgage.toFixed(0)}}岁</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
<footers :activeTab="'projectManage'"></footers>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import headers from '../../components/headers/headers.vue'
|
||
import footers from '../../components/footers/footers.vue'
|
||
import uCharts from '@/components/u-charts/component.vue';
|
||
import uniIcons from "@/components/uni-icons/uni-icons.vue"
|
||
export default {
|
||
components:{headers,footers,uCharts,uniIcons},
|
||
data() {
|
||
return {
|
||
userInfo:null,
|
||
// showMapBack:false,
|
||
backArr:[],
|
||
searchsn:'',
|
||
mapData:[],
|
||
statisticsCount:{"projectcount":
|
||
{"constructionStageCount14":0,"constructionStageCount13":0,"constructionStageCount15":0,
|
||
"constructionStageCount10":0,"constructionStageCount12":0,"constructionStageCount11":0,
|
||
"constructionStageCount1":0,"saleAcreageTotal":0,"constructionStageCount9":0,
|
||
"constructionStageCount8":0,"constructionStageCount7":0,"constructionStageCount6":0,
|
||
"constructionStageCount5":0,"constructionStageCount4":0,"constructionStageCount3":0,
|
||
"constructionStageCount2":0,"projectNum":0},"workercount":{"lwPersonYesterdayAdd":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},
|
||
"devcount":{"ufaceDevNum":0,"videoNum":0,"environmentDevNum":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}},
|
||
ageChartData:{
|
||
categories: [
|
||
"18及以下",
|
||
"18-25岁",
|
||
"25-35岁",
|
||
"35-45岁",
|
||
"45-59岁",
|
||
"60及以上",
|
||
],
|
||
series: []
|
||
},
|
||
activeTabIndex: -1,
|
||
parentSn:'',
|
||
currentCompany:{
|
||
companyName:'集团'
|
||
},
|
||
projectDetail:{}
|
||
};
|
||
},
|
||
// onLoad(options) {
|
||
// console.log('onLoad')
|
||
|
||
// },
|
||
onShow() {
|
||
console.log('onShow')
|
||
let routes = getCurrentPages(); // 获取当前打开过的页面路由数组
|
||
let curRoute = routes[routes.length - 1].route //获取当前页面路由
|
||
let curParam = routes[routes.length - 1].options; //获取路由参数
|
||
if(curParam.sn){
|
||
this.parentSn=curParam.sn
|
||
this.searchsn=curParam.sn
|
||
}
|
||
this.activeTabIndex=-1
|
||
this.userInfo = JSON.parse(uni.getStorageSync('userInfo'))
|
||
if(this.parentSn){
|
||
this.loadData(false);
|
||
this.loadStatictisData()
|
||
}else{
|
||
this.initData(true)
|
||
}
|
||
},
|
||
mounted() {
|
||
// console.log('mounted')
|
||
|
||
|
||
},
|
||
methods:{
|
||
changeLevel(index){
|
||
this.activeTabIndex=index
|
||
console.log('changeLevel',index)
|
||
if(this.activeTabIndex!=-1){
|
||
this.searchsn=this.mapData[index].projectSn?this.mapData[index].projectSn:this.mapData[index].companySn
|
||
// this.loadData(false);
|
||
this.loadStatictisData()
|
||
if(this.mapData[index].projectSn){
|
||
this.getProjectDetail()
|
||
}
|
||
}else{
|
||
if(this.parentSn){
|
||
this.searchsn=this.parentSn
|
||
// this.loadData(false);
|
||
this.loadStatictisData()
|
||
}else{
|
||
this.initData(true)
|
||
}
|
||
}
|
||
|
||
},
|
||
forwardFn(){
|
||
var type = 'area'
|
||
if(this.mapData[this.activeTabIndex].projectSn){
|
||
type = 'project'
|
||
}
|
||
uni.navigateTo({
|
||
url:'./projectManage?sn='+this.searchsn+'&type='+type
|
||
})
|
||
},
|
||
initData(type) {
|
||
var that = this
|
||
switch (that.userInfo.accountType) {
|
||
case 2:
|
||
this.searchsn=that.userInfo.headquartersSn
|
||
break;
|
||
case 3:
|
||
this.searchsn=that.userInfo.sn
|
||
break;
|
||
case 4:
|
||
this.searchsn=that.userInfo.sn
|
||
break;
|
||
case 5:
|
||
this.searchsn=that.userInfo.sn
|
||
break;
|
||
case 6:
|
||
this.searchsn=that.userInfo.sn
|
||
break;
|
||
case 7:
|
||
this.searchsn = that.userInfo.sn
|
||
break;
|
||
}
|
||
|
||
if(that.userInfo.accountType==5||that.userInfo.accountType==6){
|
||
this.getProjectDetail()
|
||
}else{
|
||
this.loadData(type);
|
||
}
|
||
this.loadStatictisData()
|
||
|
||
},
|
||
//获取所有企业下区域数据
|
||
loadData(type) {
|
||
//type：true代表第一调用
|
||
var that = this
|
||
this.sendRequest({
|
||
url: "xmgl/company/getComapnyStatisticsList",
|
||
data: {sn: this.searchsn},
|
||
method: "POST",
|
||
success(res){
|
||
that.mapData = res.result.companyList?res.result.companyList:res.result.projectList
|
||
if(res.result.companyInfo){
|
||
that.currentCompany=res.result.companyInfo
|
||
}
|
||
|
||
}
|
||
})
|
||
},
|
||
loadStatictisData() {
|
||
var that = this
|
||
this.sendRequest({
|
||
url: "xmgl/workerInfo/getWorkerStatisticsCount",
|
||
data: {sn: this.searchsn},
|
||
method: "POST",
|
||
success(res){
|
||
that.statisticsCount = res.result;
|
||
var json1 = that.statisticsCount.presencecount
|
||
var json2 = that.statisticsCount.workercount
|
||
var arr1 = [json1.age18,json1.age18to25,json1.age25to35,json1.age35to45,json1.age45to60,json1.age60]
|
||
var arr2 = [json2.age18,json2.age18to25,json2.age25to35,json2.age35to45,json2.age45to60,json2.age60]
|
||
that.ageChartData.series=[
|
||
{
|
||
name: "在职人数",
|
||
data: arr2
|
||
},
|
||
{
|
||
name: "在场人数",
|
||
data: arr1
|
||
},
|
||
]
|
||
// that.$refs.ageChart.changeData('ageChart',that.ageChartData)
|
||
}
|
||
})
|
||
},
|
||
//获取项目详细
|
||
getProjectDetail(){
|
||
var that = this
|
||
this.sendRequest({
|
||
url: "xmgl/project/getProjectInfoBySn",
|
||
data: {projectSn: this.searchsn},
|
||
method: "POST",
|
||
success(res){
|
||
that.projectDetail=res.result
|
||
// that.currentCompany.companyName=res.result.projectName
|
||
}
|
||
})
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.statictisBox{
|
||
width: 100%;
|
||
height: 150px;
|
||
background: url(../../static/bg1.png);
|
||
color: white;
|
||
display: flex;
|
||
align-items: center;
|
||
position: relative;
|
||
margin-top: 10px;
|
||
.numBox{
|
||
flex: 1;
|
||
text-align: center;
|
||
.num{
|
||
font-size: 30px;
|
||
line-height: 40px;
|
||
}
|
||
.text{
|
||
font-size: 12px;
|
||
|
||
}
|
||
}
|
||
}
|
||
.forwardImg{
|
||
position: absolute;
|
||
right: 10px;
|
||
top: 50%;
|
||
margin-top: -15px;
|
||
opacity: 0.8;
|
||
}
|
||
.statusTips{
|
||
position: absolute;
|
||
right: 0px;
|
||
top: 2px;
|
||
display: flex;
|
||
align-items: center;
|
||
.kuai{
|
||
width: 12px;
|
||
height: 12px;
|
||
margin-left: 8px;
|
||
}
|
||
.text{
|
||
font-size: 12px;
|
||
color: $uni-text-color;
|
||
opacity: 0.9;
|
||
margin-left: 3px;
|
||
}
|
||
}
|
||
.kuai1{
|
||
background-color: $uni-color-primary;
|
||
}
|
||
.kuai2{
|
||
background-color: $--color-primary2;
|
||
}
|
||
.kuai3{
|
||
background-color: $--color-primary6;
|
||
}
|
||
.kuai4{
|
||
background-color: $--color-primary3;
|
||
}
|
||
.kuaiBox{
|
||
display: inline-flex;
|
||
align-items: center;
|
||
margin-bottom: 3px;
|
||
.kuai{
|
||
min-width: 20px;
|
||
height: 20px;
|
||
line-height: 20px;
|
||
color: white;
|
||
font-size: 12px;
|
||
}
|
||
}
|
||
.avgageBox{
|
||
font-size: 14px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-top: 10px;
|
||
color: $uni-text-color;
|
||
.primaryText{
|
||
margin-right: 10px;
|
||
}
|
||
}
|
||
</style> |