mkl_power_box/projectOverviewProject.html

2160 lines
112 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://cdn.makalu.cc/css/element-ui/index.css">
<link rel="stylesheet" href="/css/largeScreenLayout.css">
<link rel="stylesheet" href="/css/largeScreenStyle.css">
<link rel="stylesheet" href="/css/amplifyModuleStyle.css">
<title>数字化集成管控平台</title>
<style>
.el-table {
background: none;
}
.el-table td {
border: none;
color: #c9d9fa;
}
.el-table th {
background: #1a3956;
}
.el-table thead {
color: #ffffff;
}
.el-table--enable-row-hover .el-table__body tr:hover > td {
background: #002d56;
}
.el-table__body-wrapper::-webkit-scrollbar {
width: 0px;
height: 0px;
}
.el-table::before {
background: none;
}
.el-carousel__container {
height: 510px;
}
</style>
</head>
<body>
<div id="app">
<!--大屏背景-->
<background-video></background-video>
<!--大屏内容-->
<div class="screen-content-max">
<screen-header :nav="1" @itemdata="onItemData"></screen-header>
<div class="screen-content">
<el-row>
<el-col :span="6">
<module-one-1-1 label="项目概况" :amplify="true" name="amplify-xmkg">
<div class="company-name-max">
<div class="company-project-introduction" @click="projectIntroduction">
<span>项目简介</span>
<img src="/images/check_icon.png">
</div>
<el-row>
<el-col :span="12">
<div class="company-name">
<div class="company-img"><img src="/images/company_13.png"></div>
<div class="company-info">
<div class="company-title">建设单位</div>
<el-tooltip class="item" effect="dark" placement="top-end">
<div slot="content" style="font-size: 20px;" v-cloak>{{buildUnit}}</div>
<div class="company-text" v-cloak>{{buildUnit}}</div>
</el-tooltip>
<div class="company-person-info" v-cloak>{{buildUnitManagerName}}
{{phone_show == 0 ? buildUnitManagerPhone : ''}}
</div>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="company-name">
<div class="company-img"><img src="/images/company_14.png"></div>
<div class="company-info">
<div class="company-title">设计单位</div>
<el-tooltip class="item" effect="dark" placement="top-end">
<div slot="content" style="font-size: 20px;" v-cloak>{{designUnit}}
</div>
<div class="company-text" v-cloak>{{designUnit}}</div>
</el-tooltip>
<div class="company-person-info" v-cloak>{{designUnitManagerName}}
{{phone_show == 0 ? designUnitManagerPhone : ''}}
</div>
</div>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="company-name">
<div class="company-img"><img src="/images/company_15.png"></div>
<div class="company-info">
<div class="company-title">总包单位</div>
<el-tooltip class="item" effect="dark" placement="top-end">
<div slot="content" style="font-size: 20px;" v-cloak>{{allUnit}}</div>
<div class="company-text" v-cloak>{{allUnit}}</div>
</el-tooltip>
<div class="company-person-info" v-cloak>{{allUnitManagerName}}
{{phone_show == 0 ? allUnitManagerPhone : ''}}
</div>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="company-name">
<div class="company-img"><img src="/images/company_11.png"></div>
<div class="company-info">
<div class="company-title">监理单位</div>
<el-tooltip class="item" effect="dark" placement="top-end">
<div slot="content" style="font-size: 20px;" v-cloak>
{{supervisorUnit}}
</div>
<div class="company-text" v-cloak>{{supervisorUnit}}</div>
</el-tooltip>
<div class="company-person-info" v-cloak>{{supervisorUnitManagerName}}
{{phone_show == 0 ? supervisorUnitManagerPhone : ''}}
</div>
</div>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="company-name">
<div class="company-img"><img src="/images/company_12.png"></div>
<div class="company-info">
<div class="company-title">检测机构</div>
<el-tooltip class="item" effect="dark" placement="top-end">
<div slot="content" style="font-size: 20px;" v-cloak>{{testingUnit}}
</div>
<div class="company-text" v-cloak>{{testingUnit}}</div>
</el-tooltip>
<div class="company-person-info" v-cloak>{{testingUnitManagerName}}
{{phone_show == 0 ? testingUnitManagerPhone : ''}}
</div>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="company-name">
<div class="company-img"><img src="/images/company_10.png"></div>
<div class="company-info">
<div class="company-title">勘察单位</div>
<el-tooltip class="item" effect="dark" placement="top-end">
<div slot="content" style="font-size: 20px;" v-cloak>{{surveyUnit}}
</div>
<div class="company-text" v-cloak>{{surveyUnit}}</div>
</el-tooltip>
<div class="company-person-info" v-cloak>{{surveyUnitManagerName}}
{{phone_show == 0 ? surveyUnitManagerPhone : ''}}
</div>
</div>
</div>
</el-col>
</el-row>
</div>
</module-one-1-1>
<module-one-1-1 label="劳务人员概况" :amplify="true" name="amplify-lwrygk">
<div class="warning-info">
<div class="warning-info-title">
<div :class="infoNav==1?'active':''" @click="onWarningInfoNav(1,'今日出勤')">今日出勤</div>
<div :class="infoNav==0?'active':''" @click="onWarningInfoNav(0,'在岗人数')">在岗人数</div>
</div>
<el-row>
<el-col :span="8">
<div class="survey_content">
<div class="survey_content_img">
<img :src="surveyUrl">
</div>
</div>
<div class="survey_content_number labour-survey_content_number">
<div class="survey_content_value"><span v-html="lwDataTotal"></span></div>
<p v-cloak>{{staffText}}</p>
</div>
</el-col>
<el-col :span="16">
<staff-survey-chart :height="220" :data="laborPersonnelData"
@personnel="clickBarPersonnel"
:width="145"></staff-survey-chart>
</el-col>
</el-row>
</div>
</module-one-1-1>
<module-one-1-1 label="设备概况" :amplify="true" name="amplify-sbgk">
<div class="survey_title">
<div class="survey_title_btn">
<div :class="overview==0?'survey_title_btn_min active':'survey_title_btn_min'"
@click="onClickoOverview(0)">设备数量
</div>
</div>
<div class="survey_title_btn">
<div :class="overview==1?'survey_title_btn_min active':'survey_title_btn_min'"
@click="onClickoOverview(1)">绑定数量
</div>
</div>
<div class="survey_title_btn">
<div :class="overview==2?'survey_title_btn_min active':'survey_title_btn_min'"
@click="onClickoOverview(2)">监测数量
</div>
</div>
</div>
<div class="survey_content">
<div class="survey_content_img">
<img :src="surveyUrlSb">
</div>
<div class="survey_content_number">
<p v-cloak>{{showOverviewLabel}}</p>
<div class="survey_content_value"><span v-cloak>{{showOverviewData.countNum}}</span></div>
</div>
</div>
<div class="survey_title">
<div class="survey_title_btn">
<div class="survey_text survey_text_zy"></div>
<div class="survey_text_value">
<p>自有</p>
<span v-cloak>{{showOverviewData.zyNum}}</span>
</div>
</div>
<div class="survey_title_btn">
<div class="survey_text survey_text_zl"></div>
<div class="survey_text_value">
<p>租赁</p>
<span v-cloak>{{showOverviewData.zlNum}}</span>
</div>
</div>
<div class="survey_title_btn">
<div class="survey_text survey_text_fb"></div>
<div class="survey_text_value">
<p>分包</p>
<span v-cloak>{{showOverviewData.fbNum}}</span>
</div>
</div>
</div>
</module-one-1-1>
</el-col>
<el-col :span="12">
<div class="modify-project-amount" @mouseout="costMouseout" @mouseover="costMouseover">
<div class="modify-btn"><img src="/images//foot_left.png" @click="modifyLeftBtn"></div>
<div class="modify-content" id="modifyContent" ref="modifyContent">
<div class="modify-content-overflow" style="width: 3360px;">
<div class="project-amount">
<div class="project-amount-bgd">
<div class="project-amount-con">
<p>计划开工日期/实际开工日期</p>
<div v-if="projectOverview.planStartTime != undefined"><span v-cloak style="font-size: 16px;">{{projectOverview.planStartTime}}/{{projectOverview.actualStartDate}}</span>
</div>
<div v-if="projectOverview.planStartTime == undefined"><span>暂无数据</span>
</div>
</div>
</div>
</div>
<!--<div class="project-amount">
<div class="project-amount-bgd">
<div class="project-amount-con">
<p>实际开工日期</p>
<div v-if="projectOverview.actualStartDate != undefined"><span v-cloak>{{projectOverview.actualStartDate}}</span>
</div>
<div v-if="projectOverview.actualStartDate == undefined"><span>暂无数据</span>
</div>
</div>
</div>
</div>-->
<div class="project-amount">
<div class="project-amount-bgd">
<div class="project-amount-con">
<p>计划竣工日期</p>
<div v-if="projectOverview.planEndDate != undefined"><span v-cloak>{{projectOverview.planEndDate}}</span>
</div>
<div v-if="projectOverview.planEndDate == undefined"><span>暂无数据</span></div>
</div>
</div>
</div>
<div class="project-amount">
<div class="project-amount-bgd">
<div class="project-amount-con">
<p>合同工期</p>
<div v-if="projectOverview.contractMoney != undefined"><span v-cloak>{{projectOverview.contractMoney}}</span>
</div>
<div v-if="projectOverview.contractMoney == undefined"><span>暂无数据</span>
</div>
</div>
</div>
</div>
<div class="project-amount">
<div class="project-amount-bgd">
<div class="project-amount-con">
<p>本月完成</p>
<div v-if="projectOverview.monthMoney != undefined"><span v-cloak>{{projectOverview.monthMoney}}</span>
万元
</div>
<div v-if="projectOverview.monthMoney == undefined"><span>暂无数据</span></div>
</div>
</div>
</div>
<div class="project-amount">
<div class="project-amount-bgd">
<div class="project-amount-con">
<p>年累完成</p>
<div v-if="projectOverview.yearMoney != undefined"><span v-cloak>{{projectOverview.yearMoney}}</span>
万元
</div>
<div v-if="projectOverview.yearMoney == undefined"><span>暂无数据</span></div>
</div>
</div>
</div>
<div class="project-amount">
<div class="project-amount-bgd">
<div class="project-amount-con">
<p>开累完成</p>
<div v-if="projectOverview.kaileiMoney != undefined"><span v-cloak>{{projectOverview.kaileiMoney}}</span>
万元
</div>
<div v-if="projectOverview.kaileiMoney == undefined"><span>暂无数据</span></div>
</div>
</div>
</div>
<div class="project-amount">
<div class="project-amount-bgd">
<div class="project-amount-con">
<p>工程造价</p>
<div v-if="projectOverview.allMoney != undefined"><span v-cloak>{{projectOverview.allMoney}} </span>
万元
</div>
<div v-if="projectOverview.allMoney == undefined"><span>暂无数据</span></div>
</div>
</div>
</div>
<div class="project-amount">
<div class="project-amount-bgd">
<div class="project-amount-con">
<p>建筑面积</p>
<div v-if="projectOverview.allArea != undefined"><span v-cloak>{{projectOverview.allArea}}</span>
平方米
</div>
<div v-if="projectOverview.allArea == undefined"><span>暂无数据</span></div>
</div>
</div>
</div>
<div class="project-amount">
<div class="project-amount-bgd">
<div class="project-amount-con">
<p>占地面积</p>
<div v-if="projectOverview.floorArea"><span v-cloak>{{projectOverview.floorArea}}</span>
平方米
</div>
<div v-if="projectOverview.floorArea == undefined"><span>暂无数据</span></div>
</div>
</div>
</div>
<!--滚动需要多余复制3组数数据-->
<div class="project-amount">
<div class="project-amount-bgd">
<div class="project-amount-con">
<p>计划开工日期/实际开工日期</p>
<div v-if="projectOverview.planStartTime != undefined"><span v-cloak style="font-size: 16px;">{{projectOverview.planStartTime}}/{{projectOverview.actualStartDate}}</span>
</div>
<div v-if="projectOverview.planStartTime == undefined"><span>暂无数据</span>
</div>
</div>
</div>
</div>
<!--<div class="project-amount">
<div class="project-amount-bgd">
<div class="project-amount-con">
<p>实际开工日期</p>
<div v-if="projectOverview.actualStartDate != undefined"><span v-cloak>{{projectOverview.actualStartDate}}</span>
</div>
<div v-if="projectOverview.actualStartDate == undefined"><span>暂无数据</span>
</div>
</div>
</div>
</div>-->
<div class="project-amount">
<div class="project-amount-bgd">
<div class="project-amount-con">
<p>计划竣工日期</p>
<div v-if="projectOverview.planEndDate != undefined"><span v-cloak>{{projectOverview.planEndDate}}</span>
</div>
<div v-if="projectOverview.planEndDate == undefined"><span>暂无数据</span></div>
</div>
</div>
</div>
<div class="project-amount">
<div class="project-amount-bgd">
<div class="project-amount-con">
<p>合同工期</p>
<div v-if="projectOverview.contractMoney != undefined"><span v-cloak>{{projectOverview.contractMoney}}</span>
</div>
<div v-if="projectOverview.contractMoney == undefined"><span>暂无数据</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modify-btn"><img src="/images/foot_right.png" @click="modifyRightBtn"></div>
</div>
<div class="aerial-view-max">
<div class="aerial-view-min">
<el-carousel trigger="click" v-if="projectOverview.newCarouselVideo.length <= 0">
<el-carousel-item v-for="item in projectOverview.newCarouselImg" :interval="5000">
<img :src="item.url" v-if="item.url&&item.url.length > 0">
</el-carousel-item>
</el-carousel>
<div v-if="projectOverview.newCarouselVideo.length > 0">
<video muted autoplay="autoplay" controls loop="loop">
<source :src="projectOverview.newCarouselVideo[0].url">
</video>
</div>
</div>
</div>
<module-one-1-2 label="项目里程碑">
<div class="dangerous-max">
<div class="dangerous-tab">
<div :class="activeNum==i?'active':''" v-if="dangerName != ''"
v-for="(item,i) in dangerName" @click="changeData(item.id,i)" v-cloak>{{item.danger_name}}
</div>
</div>
<div class="dangerous-timeline-max">
<div class="dangerous-timeline-min" :style="{width: maxWidth+'px'}">
<div class="dangerous-timeline-con" v-for="item in timeAxisData" style="font-size: 14px;">
<div class="dangerous-text" v-cloak>{{item.title}}</div>
<div class="dangerous-dot">
<div class="dangerous-dot-item"></div>
</div>
<div class="dangerous-time-max">
<div class="dangerous-time-min" v-cloak>计划:{{item.planTime}}</div>
<div class="dangerous-time-min" v-cloak>实际:{{item.actualTime ==
''?'--':item.actualTime}}
</div>
<div class="project-expect-state dangerous-time-nav"
v-if="item.state==0&&item.actualTime">正常完成
</div>
<div class="project-expect-state dangerous-time-nav active"
v-if="item.state==1&&item.actualTime" v-cloak>逾期{{item.expectDays}}天
</div>
</div>
</div>
</div>
<div class="strip-max" v-if="maxWidth > 0" :style="{width: maxWidth+'px'}">
<div class="strip-min" :style="{width:minWidth+'px'}"></div>
</div>
</div>
</div>
</module-one-1-2>
</el-col>
<el-col :span="6">
<div style="padding: 10px;">
<div class="analyse-title analyse_title_blue">
<div class="analyse-text">安全生产</div>
</div>
<div class="safe-production ">
<div style="padding-right: 10px;"></div>
<people-number :number="workSafetyNumber" unit="天"></people-number>
<div class="safe-production-time" v-cloak>{{workSafetyTime}}</div>
</div>
<div class="analyse-title analyse_title_blue">
<div class="analyse-text">环境监测</div>
</div>
</div>
<div class="weather-forecast">
<div class="weather-forecast-list">
<div class="weather-forecast-date">{{showDay(0)}}</div>
<div class="weather-forecast-img">
<img v-if="cityWeather.showapi_res_body" :src="cityWeather.showapi_res_body.f1.day_weather_pic">
</div>
<div class="weather-forecast-temp" v-cloak>
{{(cityWeather.showapi_res_body ? cityWeather.showapi_res_body.f1.night_air_temperature : 0) + ' ℃ ~ '
+ (cityWeather.showapi_res_body? cityWeather.showapi_res_body.f1.day_air_temperature : 0) + " ℃"}}
</div>
</div>
<div class="weather-forecast-list">
<div class="weather-forecast-date">{{showDay(1)}}</div>
<div class="weather-forecast-img">
<img v-if="cityWeather.showapi_res_body" :src="cityWeather.showapi_res_body.f2.day_weather_pic">
</div>
<div class="weather-forecast-temp" v-cloak>
{{(cityWeather.showapi_res_body ? cityWeather.showapi_res_body.f2.night_air_temperature : 0) + ' ℃ ~ '
+ (cityWeather.showapi_res_body ? cityWeather.showapi_res_body.f2.day_air_temperature : 0) + " ℃"}}
</div>
</div>
<div class="weather-forecast-list">
<div class="weather-forecast-date">{{showDay(2)}}</div>
<div class="weather-forecast-img">
<img v-if="cityWeather.showapi_res_body" :src="cityWeather.showapi_res_body.f3.day_weather_pic">
</div>
<div class="weather-forecast-temp" v-cloak>
{{(cityWeather.showapi_res_body ? cityWeather.showapi_res_body.f3.night_air_temperature : 0) + ' ℃ ~ '
+ (cityWeather.showapi_res_body ? cityWeather.showapi_res_body.f3.day_air_temperature : 0) + " ℃"}}
</div>
</div>
</div>
<div class="xhz-device-data" style="margin-bottom: 32px;">
<el-row>
<el-col :span="12">
<div class="xhz-device-data-min">
<div class="survey_content">
<div class="survey_content_img xhz-education_bgd">
<img src="/images/qy.png">
</div>
</div>
<div class="xhz-current-value-data">
<div>当前气压</div>
<p><span v-cloak>{{cityWeather.environment ? cityWeather.environment.hpa : 0}}</span> hPa</p>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="xhz-device-data-min">
<div class="survey_content">
<div class="survey_content_img xhz-education_bgd">
<img src="/images/hj_PM10.png">
</div>
</div>
<div class="xhz-current-value-data">
<div>当前PM10</div>
<p><span v-cloak>{{cityWeather.environment ? cityWeather.environment.pm10 : 0}}</span> ug/m³</p>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="xhz-device-data-min">
<div class="survey_content">
<div class="survey_content_img xhz-education_bgd">
<img src="/images/hj_wendu.png">
</div>
</div>
<div class="xhz-current-value-data">
<div>当前温度</div>
<p><span v-cloak>{{cityWeather.environment ? cityWeather.environment.temperature : 0}}</span></p>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="xhz-device-data-min">
<div class="survey_content">
<div class="survey_content_img xhz-education_bgd">
<img src="/images/hj_shidu.png">
</div>
</div>
<div class="xhz-current-value-data">
<div>当前湿度</div>
<p><span v-cloak>{{cityWeather.environment ? cityWeather.environment.humidity : 0}}</span> %RH</p>
</div>
</div>
</el-col>
</el-row>
</div>
<module-one-1-1 label="告警分析">
<div style="padding-top: 30px;">
<el-row>
<el-col :span="8">
<div class="time-study-value">
<p>今日告警数</p>
<!--<div class="analyse-num"><span>{{warning.warnDeviceNum}}</span> 台</div>-->
<div class="analyse-num"><span v-cloak>{{showWarnDeviceNum}}</span></div>
</div>
<div class="time-study-value">
<p>本周告警数</p>
<!--<div class="analyse-num"><span>{{warning.warnNum}}</span> 条</div>-->
<div class="analyse-num"><span v-cloak>{{showWarnNum}}</span></div>
</div>
</el-col>
<el-col :span="16">
<div class="survey-oil-title">
<div class="survey-oil-hr"></div>
<div class="survey-oil-text">告警类型</div>
</div>
<div class="analyse-number-max" id="afootOverflowType"
@mouseout="listMinMouseoutType" @mouseover="listMinMouseoverType">
<div class="glr-login-number-max analyse-num-max" v-for="item in warningType" >
<div class="glr-login-number-bgd glr-login-number-red-bgd"></div>
<div class="glr-login-number analyse-login-numbe">
<div><img src="/images//text_red_spot.png">{{item.name}}</div>
<div class="glr-rate-value glr-rate-red-value"><span>{{item.value}}</span></div>
</div>
</div>
<div class="glr-login-number-max analyse-num-max" v-for="(item,i) in warningList" @click="onOpenPopup(i,item.warningCategory)">
<div class="glr-login-number-bgd glr-login-number-red-bgd"></div>
<div class="glr-login-number analyse-login-numbe">
<div class="glr-login-number-sz"><img src="/images//text_red_spot.png" v-cloak>{{showWarningCategory(item.warningCategory)}}</div>
<div class="glr-rate-value glr-rate-red-value">
<span v-cloak>{{item.dayCount}}/{{item.weekCount}}</span></div>
</div>
</div>
</div>
</el-col>
</el-row>
</div>
</module-one-1-1>
</el-col>
<!--<el-col :span="6">
<div class="analyse-max">
<div class="analyse-map">
<div class="analyse-title">
<div class="analyse-text">正在发生</div>
</div>
<div class="afoot-content" style="padding: 15px 15px 15px 15px;">
<div class="afoot-overflow" id="afootOverflow" @mouseout="listMinMouseout"
@mouseover="listMinMouseover">
<div class="afoot-con-for" v-for="item in warningData">
<div class="afoot-machinery-nam" v-cloak>{{item.equipment}}</div>
<div class="afoot-machinery-info">
<div class="afoot-machinery-img">
<el-image
style="width: 70px; height: 70px"
:src="item.images"
:preview-src-list="[item.images]" v-if="item.images">
</el-image>
<img :src="item.warningImages" v-else="item.warningImages">
&lt;!&ndash; <img :src="item.warningImages" v-if="item.warningImages">&ndash;&gt;
</div>
<div class="afoot-machinery-data">
<div class="afoot-machinery-state" v-cloak>{{item.warningContent}} &#45;&#45; {{item.warningName}}</div>
<div class="afoot-machinery-time" v-cloak>{{item.warningTime}}</div>
</div>
</div>
<div class="afoot-machinery-project" v-cloak>项目:{{item.projectName}}</div>
<div class="afoot-machinery-project" v-if="item.warningAddress != ''" v-cloak>
地址:{{item.warningAddress}}
</div>
<machinery-baidu-map :data="item"
v-if="item.latitude !=''"></machinery-baidu-map>
</div>
</div>
</div>
</div>
<div class="analyse-min">
<div class="analyse-title">
<div class="analyse-text">报警分析</div>
</div>
<el-row>
<el-col :span="8">
<div class="time-study-value">
<p>今日报警数</p>
&lt;!&ndash;<div class="analyse-num"><span>{{warning.warnDeviceNum}}</span> 台</div>&ndash;&gt;
<div class="analyse-num"><span v-cloak>{{showWarnDeviceNum}}</span> 条</div>
</div>
<div class="time-study-value">
<p>本周报警数</p>
&lt;!&ndash;<div class="analyse-num"><span>{{warning.warnNum}}</span> 条</div>&ndash;&gt;
<div class="analyse-num"><span v-cloak>{{showWarnNum}}</span> 条</div>
</div>
</el-col>
<el-col :span="16">
<div class="survey-oil-title">
<div class="survey-oil-hr"></div>
<div class="survey-oil-text">预警类型</div>
</div>
<div class="analyse-number-max" id="afootOverflowType"
@mouseout="listMinMouseoutType" @mouseover="listMinMouseoverType">
&lt;!&ndash; <div class="glr-login-number-max analyse-num-max" v-for="item in warningType" >
<div class="glr-login-number-bgd glr-login-number-red-bgd"></div>
<div class="glr-login-number analyse-login-numbe">
<div><img src="/images//text_red_spot.png">{{item.name}}</div>
<div class="glr-rate-value glr-rate-red-value"><span>{{item.value}}</span></div>
</div>
</div> &ndash;&gt;
<div class="glr-login-number-max analyse-num-max" v-for="(item,i) in warningList" @click="onOpenPopup(i,item.warningCategory)">
<div class="glr-login-number-bgd glr-login-number-red-bgd"></div>
<div class="glr-login-number analyse-login-numbe">
<div class="glr-login-number-sz"><img src="/images//text_red_spot.png" v-cloak>{{item.warningCategory}}</div>
<div class="glr-rate-value glr-rate-red-value">
<span v-cloak>{{item.dayCount}}/{{item.weekCount}}</span></div>
</div>
</div>
</div>
</el-col>
</el-row>
</div>
</div>
</el-col>-->
</el-row>
</div>
</div>
<transition name="el-zoom-in-top">
<div class="popup-project-introduction-max" v-show="popupShow" style="display: none"
@click="closeProjectIntroductionAll">
<div class="popup-project-introduction-min">
<div class="popup-project-introduction-con">
<div class="popup-project-introduction-title">
<div>项目简介</div>
<div class="popup-project-introduction-close" @click="closeProjectIntroduction">×</div>
</div>
<div class="popup-project-introduction-details">
<div class="popup-project-introduction-info">
<div v-if="projectOverview.introduce != ''" v-html="projectOverview.introduce"></div>
</div>
</div>
</div>
</div>
</div>
</transition>
<transition name="el-zoom-in-top">
<div class="popup-project-introduction-max" v-show="personnelShow" style="display: none"
@click="closeProjectIntroductionAll">
<div class="popup-project-introduction-min">
<div class="popup-project-introduction-con">
<div class="popup-project-introduction-title">
<div v-cloak>{{labourTableTitle}}</div>
<div class="popup-project-introduction-close" @click="closeProjectIntroduction">×</div>
</div>
<div class="popup-project-introduction-details">
<div class="popup-project-introduction-info">
<el-table :data="labourTableData.data" style="width: 100%" height="500"
:row-style="rowStyle" @cell-mouse-enter="tableMouseEnter"
@cell-mouse-leave="tableMouseLeave" ref="tableRoll">
<el-table-column align="center" :label="item.label" :width="item.width"
v-for="item in labourTableData.label">
<template slot-scope="scope">
<el-image @click="imgAmplify(scope.row.userphoto)"
style="width: 50px; height: 50px" :src="scope.row.userphoto"
fit="cover" :preview-src-list="srcList"
v-if="item.data == 'userphoto'"></el-image>
<div v-if="item.data == 'idcardnum'" class="" v-cloak>
{{scope.row[item.data].replace(/^(.{6})(?:\d+)(.{4})$/,"\$1****\$2")}}
</div>
<div v-if="item.data != 'userphoto' && item.data != 'idcardnum'" class="" v-cloak>
{{scope.row[item.data]}}
</div>
</template>
</el-table-column>
</el-table>
</div>
</div>
</div>
</div>
</div>
</transition>
<transition name="el-zoom-in-top">
<div class="popup-project-introduction-max" v-show="warningShow" style="display: none"
@click="closeProjectIntroductionAll">
<div class="popup-project-introduction-min">
<div class="popup-project-introduction-con">
<div class="popup-project-introduction-title">
<div>告警列表</div>
<div class="popup-project-introduction-close" @click="closeProjectIntroduction">×</div>
</div>
<div class="popup-project-introduction-details">
<div class="sjk-chart-line-title sjk-chart-line-title-border" >
<div v-for="(item,i) in warningList" :class="warningNav==i?'active':''" @click="onWarningNavBtn(i,item.warningCategory)">{{showWarningCategory(item.warningCategory)}}</div>
</div>
<div class="warning-popup-project-introduction-info" @scroll="scrollEventFn" ref="mianscroll">
<div class="warning-popup-project-for" v-for="item in warningListData">
<el-row>
<el-col :span="16">
<div class="warning-popup-project-data">
<div class="warning-popup-project-data-left">
<el-image
style="width: 60px; height: 60px"
:src="item.images"
:preview-src-list="[item.images]" v-if="item.images">
</el-image>
<img :src="item.warningImages" v-else="item.warningImages" width="60" height="60">
<div class="warning-popup-project-data-left-value">
<div class="warning-popup-color-blue" v-html="item.equipment"></div>
<div v-html="item.warning_time"></div>
</div>
</div>
<div class="warning-popup-project-data-right">
<div v-if="item.warningValue != ''">实际值:<span class="warning-popup-color-red" v-html="item.warningValue"></span></div>
<!--<div>预警值:<span class="warning-popup-color-blue" v-html="item.warningValue"></span></div>-->
</div>
</div>
<div class="warning-popup-project-data">
<div class="warning-popup-project-data-right">
<div>告警类型:<span class="warning-popup-color-silvery" v-cloak>{{item.warningName.replaceAll("预警","告警")}}</span></div>
<div>整改时间:<span class="warning-popup-color-blue"
v-html="item.processedTime==''?item.afootTime:item.processedTime"></span></div>
</div>
<div class="warning-popup-project-data-right">
<div style="width: 200%;">告警内容:<span class="warning-popup-color-silvery" v-cloak>{{item.warningContent.replaceAll("报警","告警")}}</span></div>
<div>整改人:<span class="warning-popup-color-blue"
v-html="item.processedUser==''?item.afootUser:item.processedUser"></span></div>
</div>
</div>
<div class="warning-popup-project-data">
<div class="warning-popup-project-data-right">
<div>告警时间:<span class="warning-popup-color-silvery" v-html="item.warningTime"></span></div>
</div><div class="warning-popup-project-data-right">
<div>整改方案:<span class="warning-popup-color-blue"
v-html="item.processedUser==''?item.afootUser:item.processedUser"></span></div>
</div>
</div>
<!-- <div class="warning-popup-color">整改方案:<span class="warning-popup-color-blue" v-html="item.processedRemarks==''?item.afootRemarks:item.processedRemarks"></span></div>-->
</el-col>
<el-col :span="8">
<machinery-baidu-map :data="item" :height="180" v-if="item.latitude !=''"></machinery-baidu-map>
</el-col>
</el-row>
</div>
</div>
</div>
</div>
</div>
</div>
</transition>
</div>
</body>
<script src="https://cdn.makalu.cc/js/moment/2.24.0/moment.min.js"></script>
<script type="text/javascript" src="https://api.map.baidu.com/api?type=webgl&v=1.0&ak=5M76qMCiVjSG7bGOTcYmZdg0MQinsKve"></script>
<script src="https://cdn.makalu.cc/js/moment/2.24.0/moment.min.js"></script>
<script src="https://cdn.makalu.cc/js/vue/vue.js"></script>
<script src="https://cdn.makalu.cc/js/element-ui/index.js"></script>
<script src="/js/jquery-3.0.0.min.js"></script>
<script src="/js/echarts.js"></script>
<!--module-->
<script src="/components/module/module-one-1-1.js"></script>
<script src="/components/module/module-one-1-2.js"></script>
<!--组件-->
<script src="/components/background_video.js"></script>
<script src="/components/header.js"></script>
<script src="/components/header-btn.js"></script>
<script src="/components/staff-survey-chart.js"></script>
<script src="/components/machinery-baidu-map.js"></script>
<script src="/components/people-number.js"></script>
<!--放大组件-->
<script src="/components/amplify/xiangmugaikuang/amplify-xmkg.js"></script>
<script src="/components/amplify/xiangmugaikuang/amplify-lwrygk.js"></script>
<script src="/components/amplify/xiangmugaikuang/amplify-sbgk.js"></script>
<!-- 请求依赖 -->
<script src="https://cdn.makalu.cc/js/axios/axios.min.js"></script>
<script>
let requestUrl = "https://jzgj.crfeb.com.cn/largeScreen/digitalConstruction/";
let deptId = 131;
var vm = new Vue({
el: '#app',
data() {
return {
workSafetyTimeTimeout: undefined,
cityWeather:{},
workSafetyNumber:0,
workSafetyTime:"00时00分00秒",
//项目概况
phone_show:'',
buildUnit: '',
buildUnitManagerName: '',
buildUnitManagerPhone: '',
designUnit: '',
designUnitManagerName: '',
designUnitManagerPhone: '',
allUnit: '',
allUnitManagerName: '',
allUnitManagerPhone: '',
supervisorUnit: '',
supervisorUnitManagerName: '',
supervisorUnitManagerPhone: '',
testingUnit: '',
testingUnitManagerName: '',
testingUnitManagerPhone: '',
surveyUnit: '',
surveyUnitManagerName: '',
surveyUnitManagerPhone: '',
top: 0,
introduceInterval: undefined,
show: true,
popupShow: false,
//项目信息
projectOverview: {
introduce: '',
engineering: '',
contractMoney: '',
allArea: '',
aerialView: '',
planStartTime: '',
planEndDate: '',
actualStartDate: '',
allMoney: 0,
contractMoney: 0,
kaileiMoney: 0,
newCarouselImg: [],
newCarouselVideo: [],
},
//造价
costIndex: 0,
direction: 'right',
costInterval: undefined,
//劳务人员
infoNav: 1,
staffText: '今日出勤',
surveyUrl: '/images/survey_icon_5.png',
laborPersonnelData: [
// { text:"职工", value:52 },
// { text:"劳务派遣", value:45 },
// { text:"其他", value:20 },
],
personnelShow: false,
lwDataTotal: 0,
labourTableTitle: '',
labourTableData: {
label: [],
data: []
},
srcList: [],
tableInterval: '',
rowStyle: {
color: '#B6CFEF',
fontSize: '12px',
height: '32px'
},
//设备概况
overview: 0,
overviewInterval: '',
surveyUrlSb: '/images/survey_icon_1.png',
showOverviewLabel: '设备数量',
showOverviewData: {},
//正在发生
warningData: [],
//重大节点预期预警
maxWidth: 0,
minWidth: 0,
timeAxisData: [],
dangerName: [],
activeNum: 0,
//正在发生
warningInterval: undefined,
forIndex: 0,
//预警类型
warningType: [],
warning: {},
warningList: [],
warningTypeInterval: undefined,
warningTypeIndex: 0,
projectId: '',
projectName: '',
showWarnDeviceNum:'',
showWarnNum:'',
//模块放大
amplifyShow: false,
//预警列表弹窗
warningShow:false,
warningNav:0,
warningListData:[],
pageNo:1,
pageFlag:true,
warningTypeId:'',
flag:true,
labourTableTitle:""
}
},
// computed: {
// showWarnNum() {
// let num = 0
// for (let war of this.warningList) {
// num += war.warnNum
// }
// return num
// },
// showWarnDeviceNum() {
// let num = 0
// for (let war of this.warningList) {
// num += war.warnDeviceNum
// }
// return num
// },
// showWarningData() {
// let arr = []
// for (let war of this.warningList) {
// for (let data of war.warningData) {
// arr.push(data)
// }
// }
// return arr
// }
// },
created() {
this.init()
},
mounted() {
},
methods: {
init() {
this.getCityWeather()
chooseMenu = {
mainMenu: 0,
itemMenu: 0,
}
localStorage.setItem("chooseMenu", JSON.stringify(chooseMenu));
//项目基本信息
this.tableProject(JSON.parse(localStorage.getItem("data")).id)
//劳务人员概况
this.getLWData(this.infoNav);
// this.introduceInterval = setInterval(this.timer,50);
//设备概况
this.getOverviewData();
//设备概况点击事件定时器
this.overviewInterval = setInterval(this.overviewClick, 5000);
//重大节点预期预警
//this.getTimeAxisData(JSON.parse(localStorage.getItem("data")).id)
//项目里程碑
this.getProjectTimeAxisData(JSON.parse(localStorage.getItem("data")).id)
//报警分析
this.getProjectWarningTypeList();
this.getProjectWarningList("","");
// this.getWarnAnalysis();
// this.gainBYSWarning()
// this.gainAIWarningData()
// this.getHJWarningData()
//项目概况
this.tableProject(JSON.parse(localStorage.getItem("data")).id)
//正在发生 定时器
this.warningInterval = setInterval(this.automaticRoll, 5000);
//预警类型 定时器
this.warningTypeInterval = setInterval(this.automaticRollType, 5000);
// 造价 定时器
this.costInterval = setInterval(this.manufacturingCostRoll,5000);
//劳务人员概况弹窗 自动滚动
this.tableInterval = setInterval(this.tableScroll, 50);
let that = this
this.workSafetyTimeTimeout = setInterval(function(){
that.workSafetyTime = moment().format("HH时mm分ss秒")
},1000)
},
//项目概况
//查询项目基本信息
tableProject(projectId) {
axios({
method: 'post',
url: "/api/project/info",
data: {
"project_id": projectId
}
}).then(res => {
console.log(res)
this.projectId = projectId;
this.phone_show = res.data.data.phone_show
this.buildUnit = res.data.data.build_unit
this.buildUnitManagerName = res.data.data.build_unit_manager_name
this.buildUnitManagerPhone = res.data.data.build_unit_manager_phone
this.designUnit = res.data.data.design_unit
this.designUnitManagerName = res.data.data.design_unit_manager_name
this.designUnitManagerPhone = res.data.data.design_unit_manager_phone
this.allUnit = res.data.data.all_unit
this.allUnitManagerName = res.data.data.all_unit_manager_name
this.allUnitManagerPhone = res.data.data.all_unit_manager_phone
this.supervisorUnit = res.data.data.supervisor_unit
this.supervisorUnitManagerName = res.data.data.supervisor_unit_manager_name
this.supervisorUnitManagerPhone = res.data.data.supervisor_unit_manager_phone
this.testingUnit = res.data.data.testing_unit
this.testingUnitManagerName = res.data.data.testing_unit_manager_name
this.testingUnitManagerPhone = res.data.data.testing_unit_manager_phone
this.surveyUnit = res.data.data.survey_unit
this.surveyUnitManagerName = res.data.data.survey_unit_manager_name
this.surveyUnitManagerPhone = res.data.data.survey_unit_manager_phone
this.projectOverview.allArea = res.data.data.all_area;
this.projectOverview.allMoney = res.data.data.all_money;
this.projectOverview.contractMoney = res.data.data.contract_monery;
this.projectOverview.yearMoney = res.data.data.year_money;
this.projectOverview.monthMoney = res.data.data.month_money;
this.projectOverview.kaileiMoney = res.data.data.kailei_money;
this.projectOverview.aerialView = res.data.data.middle_img;
this.projectOverview.introduce = res.data.data.project_overview;
this.projectOverview.planStartTime = res.data.data.plan_start_date;
this.projectOverview.planEndDate = res.data.data.plan_end_date;
this.projectOverview.actualStartDate = res.data.data.actual_start_date;
this.projectOverview.floorArea = res.data.data.floorArea;
let TempNewCarouselVideo = []
let TempNewCarouselImg = []
//展示项目级轮播图
res.data.data.fileUrl.split(",").forEach(item => {
let type = item.substr(item.lastIndexOf(".") + 1)
if (type != 'jpg' && type != "png" && type != 'jpeg') {
TempNewCarouselVideo.push({url: item})
} else {
TempNewCarouselImg.push({url: item})
}
})
this.projectOverview.newCarouselImg = TempNewCarouselImg
this.projectOverview.newCarouselVideo = TempNewCarouselVideo
if(this.projectId == "196"){
this.workSafetyNumber = 475
}else{
this.workSafetyNumber = moment().diff(moment(this.projectOverview.actualStartDate), 'days')
}
}).catch(err => {
})
},
//项目介绍弹窗
projectIntroduction() {
this.popupShow = true
},
closeProjectIntroduction() {
this.popupShow = false
this.personnelShow = false
this.warningShow = false
},
closeProjectIntroductionAll(e) {
if (e.target.className == 'popup-project-introduction-max') {
this.popupShow = false
this.personnelShow = false
this.warningShow = false
}
},
//打开预警类型弹窗
onOpenPopup(index,warningTypeId){
this.warningShow = true
this.warningNav = index
this.warningTypeId = warningTypeId;
this.pageNo = 1;
this.warningListData = [];
this.getProjectWarningList(warningTypeId,1);
},
onWarningNavBtn(n,warningTypeId){
this.warningNav = n;
this.pageNo = 1;
this.warningTypeId = warningTypeId;
this.warningListData = [];
this.getProjectWarningList(warningTypeId,1);
},
//滚动分页
scrollEventFn(e){
if (e.srcElement.scrollTop + e.srcElement.clientHeight > e.srcElement.scrollHeight - 5 && this.flag ) {
console.log("倒低了");
this.flag = false;
this.pageNo = this.pageNo+1;
if(this.pageFlag){
this.getProjectWarningList(this.warningTypeId,this.pageNo);
}
}
},
//劳务人员概况
getLWData(infoNav) {
this.lwLoading = true;
axios.post("https://smz.makalu.cc/mkl/screenApi/getAllUserData?token=" + JSON.parse(localStorage.getItem("data")).smz_token + "&deptId=131&typtProjectId=" + JSON.parse(localStorage.getItem("data")).id + "&typtDeptId=" + JSON.parse(localStorage.getItem("data")).dept_id, {}).then(res => {
this.lwLoading = false;
var laborPersonnelData = [];
if (infoNav == 0) {
laborPersonnelData.push({text: "特种作业人员", value: res.data.whiteUserInfo.specialTotal, type: 2})
laborPersonnelData.push({text: "劳务人员(不含特种人员)", value: res.data.whiteUserInfo.unSpecialTotal, type: 1})
laborPersonnelData.push({text: "管理人员", value: res.data.whiteUserInfo.glrs, type: 0})
this.lwDataTotal = parseInt(res.data.whiteUserInfo.specialTotal)+parseInt(res.data.whiteUserInfo.unSpecialTotal)+parseInt(res.data.whiteUserInfo.glrs)
} else {
laborPersonnelData.push({text: "特种作业人员", value: res.data.cqUserInfo.specialTotal, type: 2})
laborPersonnelData.push({text: "劳务人员(不含特种人员)", value: res.data.cqUserInfo.unSpecialTotal, type: 1})
laborPersonnelData.push({text: "管理人员", value: res.data.cqUserInfo.glrs, type: 0})
this.lwDataTotal = res.data.rcrs
}
this.ljaqjy = res.data.jspxrs;
var safetyEducationData = [];
var safetyEducationData2 = [];
safetyEducationData.push({
text: "培训通过率",
value: (res.data.jspxrs * res.data.pxtgl / 100).toFixed(0)
});
safetyEducationData2.push({text: "接受培训率", value: res.data.jspxrs});
this.safetyEducationData = safetyEducationData;
this.safetyEducationData2 = safetyEducationData2;
this.laborPersonnelData = laborPersonnelData;
this.pxTotal = res.data.jspxrs;
}).catch(err => {
})
},
//劳务人员概况
onWarningInfoNav(n, text) {
this.infoNav = n
this.staffText = text
this.getLWData(this.infoNav);
if (n == 0) {
this.surveyUrl = '../../images/survey_icon_4.png'
} else {
this.surveyUrl = '../../images/survey_icon_5.png'
}
},
clickBarPersonnel(index) {// 2 管理人员 1 劳务人员 0 特种作业人员
this.personnelShow = true
if (this.infoNav == 0) {
if (index == 2) {
this.labourTableTitle = '管理人员'
axios.post("https://smz.makalu.cc/mkl/screenApi/getUnCqUserList?token="+JSON.parse(localStorage.getItem("data")).smz_token+"&maxDay=6&team_type=2&deptId=131&typtDeptId=" + JSON.parse(localStorage.getItem("data")).dept_id + "&typtProjectId=" + JSON.parse(localStorage.getItem("data")).id, {}).then(res => {
this.labourTableData.label = [
{
label: '照片',
width: '',
data: 'userphoto'
},
{
label: '姓名',
width: '80',
data: 'name'
},
{
label: '身份证号',
width: '',
data: 'idcardnum'
},
{
label: '年龄',
width: '80',
data: 'age'
},
{
label:'劳务公司',
width:'',
data:'enterprise_name'
},
/*{
label: '职务',
width: '',
data: 'post'
},
{
label: '职称',
width: '',
data: 'titles'
},*/
];
if (res.data.state == 'OK') {
this.labourTableData.data = res.data.data;
} else {
this.labourTableData.data = []
}
}).catch(err => {
})
} else if (index == 1) {
this.labourTableTitle = '劳务人员(不含特种人员)'
axios.post("https://smz.makalu.cc/mkl/screenApi/getUnCqUserList?token="+JSON.parse(localStorage.getItem("data")).smz_token+"&maxDay=6&special_flag=2&team_type=1&deptId=131&typtDeptId=" + JSON.parse(localStorage.getItem("data")).dept_id + "&typtProjectId=" + JSON.parse(localStorage.getItem("data")).id, {}).then(res => {
this.labourTableData.label = [
{
label: '照片',
width: '',
data: 'userphoto'
},
{
label: '姓名',
width: '80',
data: 'name'
},
{
label: '身份证号',
width: '',
data: 'idcardnum'
},
{
label: '年龄',
width: '80',
data: 'age'
},
{
label:'劳务公司',
width:'',
data:'enterprise_name'
},
{
label: '工种',
width: '',
data: 'work_type'
},
];
if (res.data.state == 'OK') {
this.labourTableData.data = res.data.data;
} else {
this.labourTableData.data = []
}
}).catch(err => {
})
} else if (index == 0) {
this.labourTableTitle = '特种作业人员'
axios.post("https://smz.makalu.cc/mkl/screenApi/getUnCqUserList?token="+JSON.parse(localStorage.getItem("data")).smz_token+"&maxDay=6&special_flag=1&team_type=1&deptId=131&typtDeptId=" + JSON.parse(localStorage.getItem("data")).dept_id + "&typtProjectId=" + JSON.parse(localStorage.getItem("data")).id, {}).then(res => {
this.labourTableData.label = [
{
label: '照片',
width: '',
data: 'userphoto'
},
{
label: '姓名',
width: '80',
data: 'name'
},
{
label: '身份证号',
width: '',
data: 'idcardnum'
},
{
label: '年龄',
width: '80',
data: 'age'
},
{
label:'劳务公司',
width:'',
data:'enterprise_name'
},
{
label: '工种',
width: '',
data: 'work_type'
},
];
if (res.data.state == 'OK') {
this.labourTableData.data = res.data.data;
} else {
this.labourTableData.data = []
}
}).catch(err => {
})
}
} else {
if (index == 2) {
this.labourTableTitle = '管理人员'
axios.post("https://smz.makalu.cc/mkl/screenApi/getCqUserInfoList?token=" + JSON.parse(localStorage.getItem("data")).smz_token + "&team_type=2&deptId=131&typtDeptId=" + JSON.parse(localStorage.getItem("data")).dept_id + "&typtProjectId=" + JSON.parse(localStorage.getItem("data")).id, {}).then(res => {
this.labourTableData.label = [
{
label: '照片',
width: '',
data: 'userphoto'
},
{
label: '姓名',
width: '80',
data: 'name'
},
{
label: '身份证号',
width: '',
data: 'idcardnum'
},
{
label: '年龄',
width: '80',
data: 'age'
},
{
label:'劳务公司',
width:'',
data:'enterprise_name'
},
/* {
label: '职务',
width: '',
data: 'post'
},
{
label: '职称',
width: '',
data: 'titles'
},*/
];
if (res.data.state == 'OK') {
this.labourTableData.data = res.data.data;
} else {
this.labourTableData.data = []
}
}).catch(err => {
})
} else if (index == 1) {
this.labourTableTitle = '劳务人员(不含特种人员)'
axios.post("https://smz.makalu.cc/mkl/screenApi/getCqUserInfoList?token=" + JSON.parse(localStorage.getItem("data")).smz_token + "&team_type=1&special_flag=2&deptId=131&typtDeptId=" + JSON.parse(localStorage.getItem("data")).dept_id + "&typtProjectId=" + JSON.parse(localStorage.getItem("data")).id, {}).then(res => {
this.labourTableData.label = [
{
label: '照片',
width: '',
data: 'userphoto'
},
{
label: '姓名',
width: '80',
data: 'name'
},
{
label: '身份证号',
width: '',
data: 'idcardnum'
},
{
label: '年龄',
width: '80',
data: 'age'
},
{
label:'劳务公司',
width:'',
data:'enterprise_name'
},
{
label: '工种',
width: '',
data: 'work_type'
},
];
if (res.data.state == 'OK') {
this.labourTableData.data = res.data.data;
} else {
this.labourTableData.data = []
}
}).catch(err => {
})
} else if (index == 0) {
this.labourTableTitle = '特种作业人员'
axios.post("https://smz.makalu.cc/mkl/screenApi/getCqUserInfoList?token=" + JSON.parse(localStorage.getItem("data")).smz_token + "&team_type=1&special_flag=1&deptId=131&typtDeptId=" + JSON.parse(localStorage.getItem("data")).dept_id + "&typtProjectId=" + JSON.parse(localStorage.getItem("data")).id, {}).then(res => {
this.labourTableData.label = [
{
label: '照片',
width: '',
data: 'userphoto'
},
{
label: '姓名',
width: '80',
data: 'name'
},
{
label: '身份证号',
width: '',
data: 'idcardnum'
},
{
label: '年龄',
width: '80',
data: 'age'
},
{
label:'劳务公司',
width:'',
data:'enterprise_name'
},
{
label: '工种',
width: '',
data: 'work_type'
},
];
if (res.data.state == 'OK') {
this.labourTableData.data = res.data.data;
} else {
this.labourTableData.data = []
}
}).catch(err => {
})
}
}
},
imgAmplify(url) {
this.srcList.push(url)
},
//设备概况数据
getOverviewData() {
axios.post(requestUrl + "getEquipmentOverview?deptId=" + deptId + "&projectId=" + JSON.parse(localStorage.getItem("data")).jzgj + "&typtProjectId=" + JSON.parse(localStorage.getItem("data")).id + "&typtDeptId=" + JSON.parse(localStorage.getItem("data")).dept_id, {}).then(res => {
this.overviewData = [res.data.data.count, res.data.data.bind, res.data.data.monitor];
this.showOverviewData = this.overviewData[0];
}).catch(err => {
})
},
//设备概况点击事件定时器方法
overviewClick() {
if (this.overview < 2) {
this.overview = this.overview + 1
} else {
this.overview = 0
}
this.showOverviewData = this.overviewData[this.overview];
if (this.overview == 0) {
this.showOverviewLabel = '设备数量'
this.surveyUrlSb = '/images/survey_icon_1.png'
} else if (this.overview == 1) {
this.showOverviewLabel = '绑定数量'
this.surveyUrlSb = '/images/survey_icon_2.png'
} else {
this.showOverviewLabel = '监测数量'
this.surveyUrlSb = '/images/survey_icon_3.png'
}
},
//设备概况点击事件
onClickoOverview(n) {
this.overview = n
this.showOverviewData = this.overviewData[this.overview];
if (this.overview == 0) {
this.showOverviewLabel = '设备数量'
this.surveyUrlSb = '/images/survey_icon_1.png'
} else if (this.overview == 1) {
this.showOverviewLabel = '绑定数量'
this.surveyUrlSb = '/images/survey_icon_2.png'
} else {
this.showOverviewLabel = '监测数量'
this.surveyUrlSb = '/images/survey_icon_3.png'
}
},
//本周时间
getWeekStartAndEnd(){
let data = new Date() //当前日期
let year = Number(data.getFullYear());//当前年
let month = Number(data.getMonth())+1;
let nowMonth =Number(data.getMonth()); //当前月
let day = Number(data.getDate()); //当天
//计算某日是本月第几周
let mydate=new Date(year,month-1,day);
let weekday=mydate.getDay(); //获取该日是星期几0代表星期日//今天本周的第几天
if(weekday == 0){
weekday = 7;
}
//本周的开始时间
let startDate = new Date(year, nowMonth, day + 1 - weekday);
let startyear = startDate.getFullYear();
let startmonth = (startDate.getMonth()+1) < 10 ? '0'+(startDate.getMonth()+1): startDate.getMonth()+1;
let startday = startDate.getDate() < 10 ? '0'+startDate.getDate() :startDate.getDate();
let startTime =startyear+'-'+startmonth+'-'+startday
//本周的结束时间
let endDate = new Date(year, nowMonth, day + 7 - weekday);
let sendyear = endDate.getFullYear();
let endmonth = (endDate.getMonth()+1) < 10 ? '0'+(endDate.getMonth()+1): endDate.getMonth()+1;
let endday = endDate.getDate() < 10 ? '0'+endDate.getDate() :endDate.getDate();
let endTime =sendyear+'-'+endmonth+'-'+endday
return {"startTime":startTime,"endTime":endTime};
},
//报警分析
getProjectWarningTypeList(){
let timeParam = this.getWeekStartAndEnd();
console.log(timeParam);
axios.get("/api/warning/getProjectWarningTypeList",
{
params: {
"deptId": 131,
"projectId": JSON.parse(localStorage.getItem("data")).id,
"startDate": timeParam.startTime,
"endDate": timeParam.endTime
}
}
).then(res => {
this.warningList = res.data.list;
this.showWarnNum = res.data.weekNum;
}).catch(err => {
})
},
getProjectWarningList(warningTypeId,pageNo){
axios.get("/api/warning/getProjectWarningList",
{
params: {
"deptId": 131,
"projectId": JSON.parse(localStorage.getItem("data")).id,
"warningType":warningTypeId,
"pageNo":pageNo ==""?null:(pageNo - 1) * 10
}
}
).then(res => {
if(warningTypeId == ""){
this.showWarnDeviceNum = res.data.length;
this.warningData = res.data;
}else{
for(let i = 0;i<res.data.length;i++){
this.warningListData.push(res.data[i]);
}
this.pageFlag = res.data.length < 10?false:true;
this.flag = res.data.length>0?true:false;
}
}).catch(err => {
})
},
getWarnAnalysis() {
//机械预警
axios.get("https://jzgj.crfeb.com.cn/largeScreen/digitalConstruction/getWarnAnalysis",
{
params: {
"deptId": 131,
"projectId": JSON.parse(localStorage.getItem("data")).jzgj,
"typtProjectId": JSON.parse(localStorage.getItem("data")).dept_id
}
}
).then(res => {
let data = res.data.data;
this.warningType = data.type;
this.warning = data.count;
data.list.map(x => {
x.images = "/images/warning_jixie.png"
})
this.warningData = data.list;
if (data.list.length > 0) {
this.warningList.push({
type: "机械预警",
warningData: data.list,
warnDeviceNum: 0,
warnNum: data.list.length
})
}
this.getDeviceWarnData();
}).catch(err => {
})
},
getDeviceWarnData() {
//安全预警
axios.get("https://aqzg.makalu.cc/api/statistics/getDeviceWarnData", {
params: {
"deptId": 131,
"projectId": JSON.parse(localStorage.getItem("data")).aqzg
}
}
).then(res => {
let objArray = [];
for (let i = 0; i < res.data.length; i++) {
let obj = {
"images": "/images/warning_jixie.png",
"address": "",
"latitude": "",
"equipment": res.data[i].towerName,
"time": res.data[i].warn_time,
"projectName": res.data[i].project_abbreviation,
"content": res.data[i].warn_context,
"longitude": ""
}
objArray.push(obj);
}
this.warning = {
warnDeviceNum: parseInt(this.warning.warnDeviceNum) + parseInt(res.data.length),
warnNum: this.warning.warnNum
};
let tmpObj = {
type: "安全预警",
warnDeviceNum: parseInt(this.warning.warnDeviceNum) + parseInt(res.data.length),
warnNum: this.warning.warnNum
}
this.getDeviceWarnWeekData(tmpObj);
for (let i = 0; i < this.warningData.length; i++) {
objArray.push(this.warningData[i]);
}
this.warningData = objArray;
/* if (res.data.length > 0) {
this.warningList.push({
type: "安全预警",
warningData: objArray,
warnDeviceNum: parseInt(this.warning.warnDeviceNum) + parseInt(res.data.length),
warnNum: this.warning.warnNum
})
}
*/
let array = this.arrCheck(res.data);
let warningType = this.warningType;
for (let i = 0; i < warningType.length; i++) {
array.push(warningType[i]);
}
this.warningType = array;
}).catch(err => {
});
},
arrCheck(arr) {
let map = {};
let dest = [];
for (let i = 0; i < arr.length; i++) {
let field = arr[i];
if (!map[field.warn_context]) {
dest.push({
name: field.warn_context,
value: 1
});
map[field.warn_context] = field;
} else {
for (let j = 0; j < dest.length; j++) {
let fieldd = dest[j];
if (fieldd.name == field.warn_context) {
fieldd.value = fieldd.value + 1;
break;
}
}
}
}
return dest;
},
/**
* 获取设备周预警,安全智管
*/
getDeviceWarnWeekData(obj) {
var now = new Date();
var nowTime = now.getTime();
var day = now.getDay();
var oneDayTime = 24 * 60 * 60 * 1000;
var MondayTime = nowTime - (day - 1) * oneDayTime;
var SundayTime = nowTime + (7 - day) * oneDayTime;
axios.get("https://aqzg.makalu.cc/api/statistics/getDeviceWarnData", {
params: {
"deptId": 131,
"projectId": JSON.parse(localStorage.getItem("data")).aqzg,
"startDate": this.format(new Date(MondayTime)),
"endDate": this.format(new Date(SundayTime))
}
}
).then(res => {
this.warning = {
warnDeviceNum: this.warning.warnDeviceNum,
warnNum: parseInt(this.warning.warnNum) + parseInt(res.data.length)
};
let tmp = {}
let devn = 0
for (let re of res.data) {
if (!tmp[re.towerName]) {
tmp[re.towerName] = true
devn++
}
}
let tmpObj = {
type: "安全预警",
warningData: res.data,
warnDeviceNum: obj.warnDeviceNum,
warnNum: res.data.length
}
this.gainPDXWarning(tmpObj)
}).catch(err => {
console.log(err);
})
},
//格式化时间
format(dat) {
//获取年月日,时间
var year = dat.getFullYear();
var mon = (dat.getMonth() + 1) < 10 ? "0" + (dat.getMonth() + 1) : dat.getMonth() + 1;
var data = dat.getDate() < 10 ? "0" + (dat.getDate()) : dat.getDate();
var hour = dat.getHours() < 10 ? "0" + (dat.getHours()) : dat.getHours();
var min = dat.getMinutes() < 10 ? "0" + (dat.getMinutes()) : dat.getMinutes();
var seon = dat.getSeconds() < 10 ? "0" + (dat.getSeconds()) : dat.getSeconds();
var newDate = year + "-" + mon + "-" + data + " " + hour + ":" + min + ":" + seon;
return newDate;
},
//造价
modifyLeftBtn() {
this.direction = 'left'
this.manufacturingCostRoll()
},
modifyRightBtn() {
this.direction = 'right'
this.manufacturingCostRoll()
},
manufacturingCostRoll() {
var width = $(".project-amount").innerWidth() * 3
if (this.direction == 'right') {
if (this.costIndex == 3) {
this.costIndex = 0
this.$refs.modifyContent.scrollLeft = 0
} else {
this.costIndex = this.costIndex + 1
}
} else {
if (this.costIndex == 0) {
this.costIndex = 3
this.$refs.modifyContent.scrollLeft = 2520
} else {
this.costIndex = this.costIndex - 1
}
}
$(this.$refs.modifyContent).animate({scrollLeft: (width * this.costIndex) + 'px'})
this.direction = 'right'
},
costMouseover() {
clearInterval(this.costInterval);
},
costMouseout() {
this.costInterval = setInterval(this.manufacturingCostRoll, 5000);
},
//head选择项目返回值
onItemData(e) {
if (e.type == 1) {
location.href = 'toIndex'
} else {
location.reload();
}
this.tableProject(e.id)
},
//项目概况
timer() {
let that = this
this.$nextTick(function () {
let height = that.$refs.introduce.offsetHeight
let content = that.$refs.content.offsetHeight
if (this.top == -height) {
this.show = false
this.top = content
} else {
this.show = true
this.top -= 1
}
})
},
TimerEnter() {//鼠标移入停止滚动
clearInterval(this.introduceInterval);
},
TimerLeave() {//鼠标离开继续滚动
this.introduceInterval = setInterval(this.timer, 50);
},
getProjectTimeAxisData(){
/*var timeAxisData = [
{
title:'项目开工',
planTime:'2022-09-01',
actualTima:'2022-09-01',
expectDays:'0',
state:0, // 0 正常完工 1 预期
},
{
title:'筏板开始施工',
planTime:'2022-11-29',
actualTima:'2022-11-29',
expectDays:'0',
state:0, // 0 正常完工 1 预期
},
{
title:'车库主体结构施工完成',
planTime:'2023-05-15',
actualTima:'',
expectDays:'0',
state:0, // 0 正常完工 1 预期
},{
title:'主楼结构施工完成',
planTime:'2023-08-31',
actualTima:'',
expectDays:'0',
state:0, // 0 正常完工 1 预期
},{
title:'1-6号楼外窗20层完成精装修完成12层',
planTime:'2023-12-31',
actualTima:'',
expectDays:'0',
state:0, // 0 正常完工 1 预期
},
{
title:'计划竣工日期',
planTime:'2024-08-21',
actualTima:'',
expectDays:'0',
state:0, // 0 正常完工 1 预期
},
]*/
let that = this
axios.post("/api/project/selectSonList",{
"projectId":JSON.parse(localStorage.getItem("data")).id
}).then(res => {
let timeAxisData = res.data.data
let index = 0
for (let i = 0; i < timeAxisData.length; i++) {
if(!timeAxisData[i].actualTime){
// index = i-1
break
}
index++;
}
that.maxWidth = timeAxisData.length * 200
if(index == timeAxisData.length || index == 0){
that.minWidth = that.minWidth + (index*200)
}else{
that.minWidth = that.minWidth + (index*200 -100)
}
that.timeAxisData = timeAxisData
})
},
//重大节点预期预警
getTimeAxisData(projectId) {
var timeAxisData = []
//请求数据
axios({
method: 'post',
url: "/api/danger/queryProjectDanger",
data: {
"project_id": projectId
}
}).then(res => {
if (res.data.code == 200) {
this.dangerName = res.data.data.danger_name
timeAxisData = res.data.data.dangerList
var index = timeAxisData.length - 1
for (let i = 0; i < timeAxisData.length; i++) {
if (timeAxisData[i].actualTima == '') {
index = i - 1
break
}
}
this.maxWidth = timeAxisData.length * 200
if (index == timeAxisData.length - 1) {
this.minWidth = this.minWidth + (index * 200 + 100)
} else {
this.minWidth = this.minWidth + (index * 200)
}
this.timeAxisData = timeAxisData
} else {
this.timeAxisData = []
}
}).catch(err => {
})
},
changeData(id, i) {
this.activeNum = i
this.timeAxisData = []
var timeAxisDataA = []
//请求数据
axios({
method: 'post',
url: "/api/danger/queryProjectId",
data: {
"project_id": JSON.parse(localStorage.getItem("data")).id,
"danger_id": id
}
}).then(res => {
if (res.data.code == 200) {
timeAxisDataA = res.data.dangerList
var index = timeAxisDataA.length - 1
for (let i = 0; i < timeAxisDataA.length; i++) {
if (timeAxisDataA[i].actualTima == '') {
index = i - 1
break
}
}
this.maxWidth = timeAxisDataA.length * 200
if (index == timeAxisDataA.length - 1) {
this.minWidth = this.minWidth + (index * 200 + 100)
} else {
this.minWidth = this.minWidth + (index * 200)
}
this.timeAxisData = timeAxisDataA
} else {
this.timeAxisData = []
}
}).catch(err => {
})
},
automaticRollType() {
var height = $(".glr-login-number-max").innerHeight()
if ($("#afootOverflowType").scrollTop() == height * this.warningType.length - $("#afootOverflowType").innerHeight()) {
this.warningTypeIndex = 0
} else {
this.warningTypeIndex = this.warningTypeIndex + 1
}
$("#afootOverflowType").animate({scrollTop: (height * this.warningTypeIndex) + 'px'})
},
listMinMouseoverType() {
clearInterval(this.warningTypeInterval);
},
listMinMouseoutType() {
this.warningTypeInterval = setInterval(this.automaticRollType, 5000);
},
automaticRoll() {
var height = $(".afoot-con-for").innerHeight()
if (this.forIndex == this.warningData.length) {
this.forIndex = 0
} else {
this.forIndex = this.forIndex + 1
}
$("#afootOverflow").animate({scrollTop: (height * this.forIndex) + 'px'})
},
listMinMouseover() {
clearInterval(this.warningInterval);
},
listMinMouseout() {
this.warningInterval = setInterval(this.automaticRoll, 10000);
},
// 人员弹窗表格滚动 方法 --------- 开始
tableScroll() {
let maxHeight = this.$refs.tableRoll.$el.querySelectorAll('.el-table__body')[0].offsetHeight;
let clientHeight = this.$refs.tableRoll.bodyWrapper.clientHeight;
if (Math.abs(this.$refs.tableRoll.bodyWrapper.scrollTop - (maxHeight - clientHeight)) < 5) { //预留5像素误差
this.$refs.tableRoll.bodyWrapper.scrollTop = 0;
} else {
this.$refs.tableRoll.bodyWrapper.scrollTop += 1;//32是每一行表格的高度每秒滚一行
}
},
tableMouseEnter() {//鼠标移入停止滚动
clearInterval(this.tableInterval);
},
tableMouseLeave() {//鼠标离开继续滚动
this.tableInterval = setInterval(this.tableScroll, 50);
},
// 人员弹窗滚动 方法 ------ 结束
/**
* 获取配电箱异常信息
*/
gainPDXWarning(obj) {
let that = this
$.post("/api/iot/power/warringList?pageNum=1&pageSize=10",
{
type: "配电箱",
startTime: moment().day(0).format("YYYY-MM-DD 23:59:59"),
endTime: moment().day(7).format("YYYY-MM-DD 23:59:59")
},
res => {
//console.log(res);
for (let row of res.rows) {
obj.warningData.push(row)
}
obj.warnDeviceNum += 0
obj.warnNum += res.total
if (obj.warnNum > 0) {
this.warningList.push(obj)
}
})
},
/**
* 获取标养室异常信息
*/
gainBYSWarning() {
let that = this
$.post(
"/api/iot/power/warringList?pageNum=1&pageSize=10",
{
type: "标养室",
startTime: moment().day(0).format("YYYY-MM-DD 23:59:59"),
endTime: moment().day(7).format("YYYY-MM-DD 23:59:59")
},
res => {
let tmp = {
type: "质量预警",
warningData: res.rows,
warnDeviceNum: 24,
warnNum: res.total
}
$.post(
"/api/iot/power/warringList?pageNum=1&pageSize=10",
{
type: "标养室",
startTime: moment().format("YYYY-MM-DD 00:00:00"),
endTime: moment().format("YYYY-MM-DD 23:59:59")
},
res => {
//console.log(res);
tmp.warnDeviceNum = res.total
that.warningList.push(tmp)
}
)
}
)
},
gainAIWarningData() {
axios.post("https://aqzg.makalu.cc/api/video/getAnalysisDetailList", {
projectId: JSON.parse(localStorage.getItem("data")).aqzg,
// dataNum:50
}).then(res => {
this.warningList.push({
type: "AI预警",
warningData: res.data,
warnDeviceNum: res.data.length,
warnNum: res.data.length
})
}).catch(err => {
})
},
getHJWarningData() {
axios.get("/mkl/api/getWaringIngBaseInfo?projectId="+JSON.parse(localStorage.getItem("data")).smz, {
}).then(res => {
if(res.data.data.length > 0 ) {
var data = res.data.data;
this.warningList.push({
type: "环境预警",
warningData: res.data.data,
warnDeviceNum: res.data.data.length,
warnNum: res.data.data.length
})
}
}).catch(err => {
})
},
getCityWeather(){
let that = this
axios.post("/api/iot/power/getCityWeather",{
id: JSON.parse(localStorage.getItem("data")).id
}).then(res => {
if(res.data.code == 0){
that.cityWeather= res.data.data
}
})
},
showDay(n){
if(n==0) {
return "今天"
} else if(n == 1) {
return "明天"
} else {
return "后天"
}
// return moment().add(n,'days').format("MM月DD日")
},
showWarningCategory(str){
let name = ""
switch (str){
case "AI预警":
name = "安全着装告警"
break
case "安全预警":
name = "监测告警"
break
case "质量预警":
name = "标养室告警"
break
}
return name
}
},
// 表格滚动调用的函数
beforeDestroy() {
clearInterval(this.tableInterval);
},
})
</script>
</html>