1236 lines
49 KiB
Plaintext
1236 lines
49 KiB
Plaintext
|
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="mainProject2.aspx.cs" Inherits="FineUIPro.Web.common.mainProject2" %>
|
|||
|
|
|
|||
|
|
<!DOCTYPE html>
|
|||
|
|
|
|||
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
|||
|
|
<head runat="server">
|
|||
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
|||
|
|
<title>项目级首页（新）</title>
|
|||
|
|
<script src="lib/flex.js"></script>
|
|||
|
|
<link rel="stylesheet" href="css/base.css"/>
|
|||
|
|
<link rel="stylesheet" href="css/project.css"/>
|
|||
|
|
<link rel="stylesheet" href="css/swiper-bundle.min.css" />
|
|||
|
|
<script src="lib/jquery.js"></script>
|
|||
|
|
</head>
|
|||
|
|
<style>
|
|||
|
|
.BMap_mask {
|
|||
|
|
background-color: red;
|
|||
|
|
}
|
|||
|
|
body.f-body {
|
|||
|
|
padding: 0px;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
<body>
|
|||
|
|
<form id="form1" runat="server" style="background-color:#000231">
|
|||
|
|
<f:PageManager ID="PageManager1" runat="server" />
|
|||
|
|
<div class="wrap y_image_default">
|
|||
|
|
<div class="y_body y_row">
|
|||
|
|
<div class="site y_column">
|
|||
|
|
<div class="y_box">
|
|||
|
|
<div class="y_box_label y_image_default">安全统计</div>
|
|||
|
|
<div class="y_box_main">
|
|||
|
|
<div class="y_row y_rgss">
|
|||
|
|
<div class="y_rgs y_column y_image_default">
|
|||
|
|
<p class="y_rgs_val" id="divSafeWorkTime" runat="server">0000000000</p>
|
|||
|
|
<div class="y_rgs_label">累计安全人工时</label>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="y_rgs y_column y_image_default">
|
|||
|
|
<p class="y_rgs_val" id="divSafeWorkTimeMonth" runat="server">0000000000</p>
|
|||
|
|
<div class="y_rgs_label">本月安全人工时</label>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="y_rgs y_column y_image_default">
|
|||
|
|
<p class="y_rgs_val" id="divSafePersonNum" runat="server">0</p>
|
|||
|
|
<div class="y_rgs_label">安全培训累计人员</label>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="y_aq y_row">
|
|||
|
|
<div class="y_aq_box y_image_default y_row">
|
|||
|
|
<div class="y_aq_label">安全管理人员</div>
|
|||
|
|
<div class="y_aq_value" id="divSafeManagePersonNum" runat="server">0</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="y_aq_box y_image_default y_row">
|
|||
|
|
<div class="y_aq_label">未遂事件</div>
|
|||
|
|
<div class="y_aq_value" runat="server" id="divWS">0</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="y_zg">
|
|||
|
|
<div class="y_zg_title">整改数据</div>
|
|||
|
|
<div class="y_zg_main y_row">
|
|||
|
|
<div class="y_zg_box">
|
|||
|
|
<div class="y_zg_value" style="background-color: #00b8de54;color: #00b8de;" runat="server" id="div_zgsj">0
|
|||
|
|
</div>
|
|||
|
|
<div class="y_zg_label">总数</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="y_zg_box">
|
|||
|
|
<div class="y_zg_value" style="background-color: #12cda26e;color: #12CDA2;" runat="server" id="div_zgywc">0
|
|||
|
|
</div>
|
|||
|
|
<div class="y_zg_label">已完成</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="y_zg_box">
|
|||
|
|
<div class="y_zg_value" style="background-color:#ff747452;color: #FF7474;" runat="server" id="div_zgwwc">0
|
|||
|
|
</div>
|
|||
|
|
<div class="y_zg_label">未完成</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="y_zg_box">
|
|||
|
|
<div class="y_zg_value" style="background-color: #d2b10054;color: #D2B100;" runat="server" id="div_zgwcl">0%
|
|||
|
|
</div>
|
|||
|
|
<div class="y_zg_label">完成率</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="y_box">
|
|||
|
|
<div class="y_box_label y_image_default">风险预警</div>
|
|||
|
|
<div class="y_box_main y_row">
|
|||
|
|
<div class="fxmap" id="fxmap"></div>
|
|||
|
|
<div class="fx">
|
|||
|
|
<div class="yj-box y_row" style="margin-top: .125rem;">
|
|||
|
|
<div class="yj-item zz">
|
|||
|
|
<div class="yj-label">资质预警</div>
|
|||
|
|
<div class="yj-number"><%=getEarlyWarningCounts() %></div>
|
|||
|
|
</div>
|
|||
|
|
<div class="yj-item jx">
|
|||
|
|
<div class="yj-label">机械预警</div>
|
|||
|
|
<div class="yj-number"><%=GetJxyjNum() %></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="wd-box" style="margin-top: .125rem;">
|
|||
|
|
<div class="wd-title">危大工程</div>
|
|||
|
|
<div class="wd-main" style="margin-top: .125rem;">
|
|||
|
|
<div class="wd-item">
|
|||
|
|
<div class="wd-number"><%=GetCompletedNum() %></div>
|
|||
|
|
<div class="wd-label">审批完成</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="wd-item">
|
|||
|
|
<div class="wd-number" style="color: #FEB185;"><%=GetTrainPersonNum() %></div>
|
|||
|
|
<div class="wd-label">培训人次数</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="wd-item">
|
|||
|
|
<div class="wd-number" style="color: #8E65FF;"><%=GetConstructionNum() %></div>
|
|||
|
|
<div class="wd-label">施工个数</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="wd-item">
|
|||
|
|
<div class="wd-number" style="color: #12CDA2;"><%=GetFinishedNum() %></div>
|
|||
|
|
<div class="wd-label">完工个数</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="wd-box" style="margin-top: .125rem;">
|
|||
|
|
<div class="wd-title">超危大工程</div>
|
|||
|
|
<div class="wd-main" style="margin-top: .125rem;">
|
|||
|
|
<div class="wd-item">
|
|||
|
|
<div class="wd-number"><%=GetSuperCompletedNum() %></div>
|
|||
|
|
<div class="wd-label">审批完成</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="wd-item">
|
|||
|
|
<div class="wd-number" style="color: #FEB185;"><%=GetSuperTrainPersonNum() %></div>
|
|||
|
|
<div class="wd-label">培训人次数</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="wd-item">
|
|||
|
|
<div class="wd-number" style="color: #8E65FF;"><%=GetSuperConstructionNum() %></div>
|
|||
|
|
<div class="wd-label">施工个数</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="wd-item">
|
|||
|
|
<div class="wd-number" style="color: #12CDA2;"><%=GetSuperFinishedNum() %></div>
|
|||
|
|
<div class="wd-label">完工个数</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="y_box">
|
|||
|
|
<div class="y_box_label y_image_default">作业许可</div>
|
|||
|
|
<div class="y_box_main">
|
|||
|
|
<div class="zyp">
|
|||
|
|
<div class="zyp_box">
|
|||
|
|
<div class="zyp_label">动火</div>
|
|||
|
|
<div class="zyp_number"><%=getWrokCount0() %></div>
|
|||
|
|
</div>
|
|||
|
|
<div class="zyp_box">
|
|||
|
|
<div class="zyp_label">高处</div>
|
|||
|
|
<div class="zyp_number"><%=getWrokCount1() %></div>
|
|||
|
|
</div>
|
|||
|
|
<div class="zyp_box">
|
|||
|
|
<div class="zyp_label">吊装</div>
|
|||
|
|
<div class="zyp_number"><%=getWrokCount2() %></div>
|
|||
|
|
</div>
|
|||
|
|
<div class="zyp_box">
|
|||
|
|
<div class="zyp_label">其他</div>
|
|||
|
|
<div class="zyp_number"><%=getWrokCount3() %></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="zyp-lis">
|
|||
|
|
<%=getLicenseManager() %>
|
|||
|
|
<%-- <div class="li">003-十一化建-合成氨区域-非高风险-T0001设备吊装</div>--%>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="site y_column" style="justify-content: space-between;">
|
|||
|
|
<div class="y_box" style="width: 100%;">
|
|||
|
|
<div class="y_box_label y_image_default">工程概括</div>
|
|||
|
|
<div class="y_box_main y_row" style="justify-content: space-between;padding: .1875rem .25rem;">
|
|||
|
|
<div class="gk-box" style="width: 2.75rem;">
|
|||
|
|
<div class="row"><span>工程名称：</span><%=spanProjectName %></div>
|
|||
|
|
<div class="row"><span>建设单位：</span> <%=spanOwnUnit %></div>
|
|||
|
|
<div class="row"><span>施工单位：</span> <%=spanSGUnit %></div>
|
|||
|
|
<div class="row"><span>监理单位：</span><%=spanJLUnit %></div>
|
|||
|
|
<div class="row"><span>工程概况：</span><span></span></div>
|
|||
|
|
</div>
|
|||
|
|
<div class="gk-box" style="width: 3.55rem;">
|
|||
|
|
<div class="swiper">
|
|||
|
|
<div class="swiper-wrapper">
|
|||
|
|
<div class="swiper-slide"><img src="./imags/16.png"></div>
|
|||
|
|
<div class="swiper-slide"><img src="./imags/16.png"></div>
|
|||
|
|
<div class="swiper-slide"><img src="./imags/16.png"></div>
|
|||
|
|
<div class="swiper-slide"><img src="./imags/16.png"></div>
|
|||
|
|
</div>
|
|||
|
|
<!-- 如果需要分页器 -->
|
|||
|
|
<div class="swiper-pagination"></div>
|
|||
|
|
|
|||
|
|
<!-- 如果需要导航按钮 -->
|
|||
|
|
<div class="swiper-button-prev"></div>
|
|||
|
|
<div class="swiper-button-next"></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="gk-box y_column" style="width: 2rem;justify-content: space-between;">
|
|||
|
|
<div class="gk-card y_image_default">
|
|||
|
|
<div class="gk-label">合同工期</div>
|
|||
|
|
<div class="gk-number" style="color: #00FFFF;" id="divProjectDays" runat="server">0<span style="margin-left: .125rem;color: #63CAFF;">天</span></div>
|
|||
|
|
</div>
|
|||
|
|
<div class="gk-card y_image_default">
|
|||
|
|
<div class="gk-label">合同到期时间</div>
|
|||
|
|
<div class="gk-number" style="color: #FF7474;" id="divEndDate" runat="server"></div>
|
|||
|
|
</div>
|
|||
|
|
<div class="gk-card y_image_default">
|
|||
|
|
<div class="gk-label">合同剩余</div>
|
|||
|
|
<div class="gk-number" style="color: #12CDA2;" id="divRemainingDays" runat="server">0<span style="margin-left: .125rem;color: #63CAFF;">天</span></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<div class="y_box" style="width: 100%;">
|
|||
|
|
<div class="y_box_label y_image_default">赢得值曲线
|
|||
|
|
<%--<div class="gj"><span>关键事项准点率</span><span>90%</span></div>--%>
|
|||
|
|
</div>
|
|||
|
|
<div class="y_box_main" id='left_one' style="width: 100%; height: 90%;"></div>
|
|||
|
|
<%--<div class="y_box_main" id="jdmap">
|
|||
|
|
|
|||
|
|
</div>--%>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<div class="y_box" style="width: 100%;">
|
|||
|
|
<div class="y_box_label y_image_default">质量概况</div>
|
|||
|
|
<div class="y_box_main">
|
|||
|
|
<div class="y_row" style="justify-content: space-between;padding-top: .25rem;">
|
|||
|
|
<div class="y_zlry y_row y_image_default">
|
|||
|
|
<div class="y_zlry_label">质量培训累计人员</div>
|
|||
|
|
<div class="y_zlry_value" id="divCqmsPxNum" runat="server">0</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="y_zlry y_row y_image_default">
|
|||
|
|
<div class="y_zlry_label">施工方案审批量</div>
|
|||
|
|
<div class="y_zlry_value" id="div_sgfaSpl" runat="server">0</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="y_zlmap y_row">
|
|||
|
|
<div class="zgmap" id="zlmap"></div>
|
|||
|
|
<div class="zgmap" id="ycmap"></div>
|
|||
|
|
<div class="zgmap" id="hjmap"></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="site y_column">
|
|||
|
|
<div class="y_box">
|
|||
|
|
<div class="y_box_label y_image_default">工作台面</div>
|
|||
|
|
<div class="y_box_main">
|
|||
|
|
<div class="zyp">
|
|||
|
|
<div class="zyp_box">
|
|||
|
|
<div class="zyp_label">关键事项</div>
|
|||
|
|
<div class="zyp_number" id="div_gjsx" runat="server">0</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="zyp_box">
|
|||
|
|
<div class="zyp_label">待办事项</div>
|
|||
|
|
<div class="zyp_number" id="div_dbsx" runat="server">0</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="zyp_box">
|
|||
|
|
<div class="zyp_label">个人流程</div>
|
|||
|
|
<div class="zyp_number" id="div_grlc" runat="server">0</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="zyp_box">
|
|||
|
|
<div class="zyp_label">已办任务</div>
|
|||
|
|
<div class="zyp_number" id="div_ybrw" runat="server">0</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="zyp-lis" runat="server" id="div_dbsxlist">
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<div class="y_box">
|
|||
|
|
<div class="y_box_label y_image_default">人员信息</div>
|
|||
|
|
<div class="y_box_main">
|
|||
|
|
<div class="ry">
|
|||
|
|
<div class="ry_box">
|
|||
|
|
<div class="ry_label">当前现场人数</div>
|
|||
|
|
<div class="ry_number" style="color: #E9E931;" id="div_xcrs" runat="server">0</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="ry_box">
|
|||
|
|
<div class="ry_label">作业人员总数</div>
|
|||
|
|
<div class="ry_number" style="color: #00FFFF;" runat="server" id="div_zyxcrs">0</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="ry_box">
|
|||
|
|
<div class="ry_label">管理人员总数</div>
|
|||
|
|
<div class="ry_number" style="color: #63CAFF;" runat="server" id="div_glxcrs">0</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div id='left_two' style="width: 100%; height: 80%;"></div>
|
|||
|
|
<%--<div class="ry_map" id="rymap">
|
|||
|
|
|
|||
|
|
</div>--%>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<div class="y_box">
|
|||
|
|
<div class="y_box_label y_image_default">
|
|||
|
|
材料到货
|
|||
|
|
<div class="y_tabs y_row"><span class="y_image_default y_tab-action" id="span_gdcl" onclick="clOnclick(0)" style="cursor:pointer">管道材料</span>
|
|||
|
|
<span class="y_image_default" onclick="clOnclick(1)" id="span_sbcl" style="cursor:pointer">设备材料</span></div>
|
|||
|
|
</div>
|
|||
|
|
<div class="y_box_main">
|
|||
|
|
<div class="table">
|
|||
|
|
<div class="thead" id="div_cldhHead">
|
|||
|
|
<div class="trth" style="background: rgba(33, 55, 113, .4);">
|
|||
|
|
<div class="th r-line" style="width: .7875rem;">
|
|||
|
|
<p>材料类别</p>
|
|||
|
|
</div>
|
|||
|
|
<div class="th r-line" style="width: .8375rem;">
|
|||
|
|
<p>设计量</p>
|
|||
|
|
</div>
|
|||
|
|
<div class="th r-line" style="width: 1.575rem;">
|
|||
|
|
<p class="b-line">采购量</p>
|
|||
|
|
<p><span class="r-line">采购量</span><span class="r-line">百分比</span></p>
|
|||
|
|
</div>
|
|||
|
|
<div class="th r-line" style="width: 1.575rem;">
|
|||
|
|
<p class="b-line">到货量</p>
|
|||
|
|
<p><span class="r-line">已到货</span><span class="r-line">百分比</span></p>
|
|||
|
|
</div>
|
|||
|
|
<div class="th" style="width: 1.575rem;">
|
|||
|
|
<p class="b-line">领料量</p>
|
|||
|
|
<p><span class="r-line">已领料</span><span>百分比</span></p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="tbody" id="div_cldhList">
|
|||
|
|
<%=gdclHtml %>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<input type="hidden" id="hiddenUrl" value="" runat="server" />
|
|||
|
|
|
|||
|
|
<f:Button runat="server" CssClass="bgbtntop" IconFont="Gear" OnClick="btnshowWindows" ToolTip="打开代办" Hidden="true"
|
|||
|
|
EnablePostBack="true" EnableDefaultState="true" EnableDefaultCorner="false" ID="btnShowWindows">
|
|||
|
|
</f:Button>
|
|||
|
|
|
|||
|
|
<f:Window ID="Window1" Title="代办" Hidden="true" EnableIFrame="true" EnableMaximize="true"
|
|||
|
|
Target="Parent" EnableResize="false" runat="server" IsModal="true" OnClose="Window1_Close"
|
|||
|
|
Width="1300px" Height="660px">
|
|||
|
|
</f:Window>
|
|||
|
|
|
|||
|
|
</form>
|
|||
|
|
</body>
|
|||
|
|
</html>
|
|||
|
|
<script src="lib/swiper-bundle.min.js"></script>
|
|||
|
|
<script src="lib/echarts.min.js"></script>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
function clOnclick(objval) {
|
|||
|
|
if (objval == 0) {
|
|||
|
|
$("#span_gdcl").addClass("y_tab-action")
|
|||
|
|
$("#span_sbcl").removeClass("y_tab-action")
|
|||
|
|
$("#div_cldhHead").html('<%=gdclHead%>')
|
|||
|
|
$("#div_cldhList").html('<%=gdclHtml%>')
|
|||
|
|
} else {
|
|||
|
|
$("#span_sbcl").addClass("y_tab-action")
|
|||
|
|
$("#span_gdcl").removeClass("y_tab-action")
|
|||
|
|
$("#div_cldhHead").html('<%=sbclHead%>')
|
|||
|
|
$("#div_cldhList").html('<%=sbclHtml%>')
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
function reloadGrid(param) {
|
|||
|
|
__doPostBack(null, 'ReloadGrid$' + param);
|
|||
|
|
}
|
|||
|
|
//弹框代办
|
|||
|
|
function returnWindows(objUrl) {
|
|||
|
|
document.getElementById("hiddenUrl").value = objUrl;
|
|||
|
|
$('#btnShowWindows').click();
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
<script>
|
|||
|
|
// 焊接一次合格率
|
|||
|
|
hjmap()
|
|||
|
|
function hjmap() {
|
|||
|
|
let allNumber = 70 // 总计
|
|||
|
|
let finishNumber = 360 // 完成的数量
|
|||
|
|
let zg = 72
|
|||
|
|
let AOption1 = {
|
|||
|
|
title: [
|
|||
|
|
{
|
|||
|
|
text: '焊接一次合格率',
|
|||
|
|
bottom: fontSize(30),
|
|||
|
|
left: 'center',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#63CAFF',
|
|||
|
|
fontSize: fontSize(14)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
text: '总计 ' + '{a|' + <%=hjallNumber%> + '}',
|
|||
|
|
bottom: fontSize(4),
|
|||
|
|
left: 'left',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#63CAFF',
|
|||
|
|
fontSize: fontSize(14),
|
|||
|
|
rich: {
|
|||
|
|
a: {
|
|||
|
|
color: '#00FFFF',
|
|||
|
|
fontSize: fontSize(16)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
text: '合格 ' + '{a|' + <%=hjfinishNumber%> + '}',
|
|||
|
|
bottom: fontSize(4),
|
|||
|
|
left: '50%',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#63CAFF',
|
|||
|
|
fontSize: fontSize(14),
|
|||
|
|
rich: {
|
|||
|
|
a: {
|
|||
|
|
color: '#12CDA2',
|
|||
|
|
fontSize: fontSize(16)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
text: <%=hjzgl%> + '{a|%}',
|
|||
|
|
top: fontSize(70),
|
|||
|
|
left: 'center',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#FFA602',
|
|||
|
|
fontSize: fontSize(16),
|
|||
|
|
rich: {
|
|||
|
|
a: {
|
|||
|
|
color: '#FFFFFF',
|
|||
|
|
fontWight: 1,
|
|||
|
|
fontSize: fontSize(10),
|
|||
|
|
lineHeight: fontSize(20)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
center: ['50%', fontSize(80)],
|
|||
|
|
name: '',
|
|||
|
|
type: 'pie',
|
|||
|
|
radius: ['30%', '50%'],
|
|||
|
|
avoidLabelOverlap: false,
|
|||
|
|
labelLine: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
data: [
|
|||
|
|
{ value: <%=hjzgl%>, itemStyle: { color: '#FFA602' } },
|
|||
|
|
{ value: <%=hjDataValue%>, itemStyle: { color: '#2A396A' } },
|
|||
|
|
],
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
};
|
|||
|
|
var aPassChart = echarts.init(document.getElementById('hjmap'));
|
|||
|
|
aPassChart.setOption(AOption1);
|
|||
|
|
}
|
|||
|
|
// 一次共检合格率
|
|||
|
|
ycmap()
|
|||
|
|
function ycmap() {
|
|||
|
|
let allNumber = 70 // 总计
|
|||
|
|
let finishNumber = 360 // 完成的数量
|
|||
|
|
let zg = 72
|
|||
|
|
let AOption1 = {
|
|||
|
|
title: [
|
|||
|
|
{
|
|||
|
|
text: '一次共检合格率',
|
|||
|
|
bottom: fontSize(30),
|
|||
|
|
left: 'center',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#63CAFF',
|
|||
|
|
fontSize: fontSize(14)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
text: '总计 ' + '{a|' + <%=zlgjallNumber%> + '}',
|
|||
|
|
bottom: fontSize(4),
|
|||
|
|
left: 'left',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#63CAFF',
|
|||
|
|
fontSize: fontSize(14),
|
|||
|
|
rich: {
|
|||
|
|
a: {
|
|||
|
|
color: '#00FFFF',
|
|||
|
|
fontSize: fontSize(16)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
text: '合格 ' + '{a|' + <%=zlgjfinishNumber%> + '}',
|
|||
|
|
bottom: fontSize(4),
|
|||
|
|
left: '50%',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#63CAFF',
|
|||
|
|
fontSize: fontSize(14),
|
|||
|
|
rich: {
|
|||
|
|
a: {
|
|||
|
|
color: '#12CDA2',
|
|||
|
|
fontSize: fontSize(16)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
text: <%=zlgjzgl%> + '{a|%}',
|
|||
|
|
top: fontSize(70),
|
|||
|
|
left: 'center',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#FFA602',
|
|||
|
|
fontSize: fontSize(16),
|
|||
|
|
rich: {
|
|||
|
|
a: {
|
|||
|
|
color: '#FFFFFF',
|
|||
|
|
fontWight: 1,
|
|||
|
|
fontSize: fontSize(10),
|
|||
|
|
lineHeight: fontSize(20)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
center: ['50%', fontSize(80)],
|
|||
|
|
name: '',
|
|||
|
|
type: 'pie',
|
|||
|
|
radius: ['30%', '50%'],
|
|||
|
|
avoidLabelOverlap: false,
|
|||
|
|
labelLine: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
data: [
|
|||
|
|
{ value: <%=zlgjzgl%>, itemStyle: { color: '#FFA602' } },
|
|||
|
|
{ value: <%=zggjzglDataValue%>, itemStyle: { color: '#2A396A' } },
|
|||
|
|
],
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
};
|
|||
|
|
var aPassChart = echarts.init(document.getElementById('ycmap'));
|
|||
|
|
aPassChart.setOption(AOption1);
|
|||
|
|
}
|
|||
|
|
// 质量问题整改率
|
|||
|
|
zlmap()
|
|||
|
|
function zlmap() {
|
|||
|
|
let allNumber = 70 // 总计
|
|||
|
|
let finishNumber = 36 // 完成的数量
|
|||
|
|
let zg = 72
|
|||
|
|
let AOption1 = {
|
|||
|
|
title: [
|
|||
|
|
{
|
|||
|
|
text: '质量问题整改率',
|
|||
|
|
bottom: fontSize(30),
|
|||
|
|
left: 'center',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#63CAFF',
|
|||
|
|
fontSize: fontSize(14)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
text: '总计 ' + '{a|' + <%=zlallNumber%> + '}',
|
|||
|
|
bottom: fontSize(4),
|
|||
|
|
left: 'left',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#63CAFF',
|
|||
|
|
fontSize: fontSize(14),
|
|||
|
|
rich: {
|
|||
|
|
a: {
|
|||
|
|
color: '#00FFFF',
|
|||
|
|
fontSize: fontSize(16)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
text: '合格 ' + '{a|' + <%=zlfinishNumber%> + '}',
|
|||
|
|
bottom: fontSize(4),
|
|||
|
|
left: '50%',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#63CAFF',
|
|||
|
|
fontSize: fontSize(14),
|
|||
|
|
rich: {
|
|||
|
|
a: {
|
|||
|
|
color: '#12CDA2',
|
|||
|
|
fontSize: fontSize(16)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
text: <%=zlzgl%> + '{a|%}',
|
|||
|
|
top: fontSize(70),
|
|||
|
|
left: 'center',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#FFA602',
|
|||
|
|
fontSize: fontSize(16),
|
|||
|
|
rich: {
|
|||
|
|
a: {
|
|||
|
|
color: '#FFFFFF',
|
|||
|
|
fontWight: 1,
|
|||
|
|
fontSize: fontSize(10),
|
|||
|
|
lineHeight: fontSize(20)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
center: ['50%', fontSize(80)],
|
|||
|
|
name: '',
|
|||
|
|
type: 'pie',
|
|||
|
|
radius: ['30%', '50%'],
|
|||
|
|
avoidLabelOverlap: false,
|
|||
|
|
labelLine: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
data: [
|
|||
|
|
{ value: <%=zlzgl%>, itemStyle: { color: '#FFA602' } },
|
|||
|
|
{ value: <%=zgzglDataValue%>, itemStyle: { color: '#2A396A' } },
|
|||
|
|
],
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
};
|
|||
|
|
var aPassChart = echarts.init(document.getElementById('zlmap'));
|
|||
|
|
aPassChart.setOption(AOption1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//jdmap()
|
|||
|
|
function jdmap(){
|
|||
|
|
let value = [120, 200, 150, 80]
|
|||
|
|
let value1 = [199, 100, 100, 96]
|
|||
|
|
let value2 = [146, 187, 111, 108]
|
|||
|
|
let label = ['分类1', '分类2', '分类3', '分类4']
|
|||
|
|
let opt = {
|
|||
|
|
grid: {
|
|||
|
|
top: fontSize(60),
|
|||
|
|
bottom: fontSize(30)
|
|||
|
|
},
|
|||
|
|
legend: {
|
|||
|
|
top: fontSize(10),
|
|||
|
|
left: fontSize(20),
|
|||
|
|
data: [{ name: '实物工程量', textStyle: { color: '#63CAFF' } }, { name: '进度曲线', textStyle: { color: '#12CDA2' } }, { name: '主进度线', textStyle: { color: '#C293FF' } }]
|
|||
|
|
},
|
|||
|
|
xAxis: {
|
|||
|
|
type: 'category',
|
|||
|
|
data: label,
|
|||
|
|
axisLabel: {
|
|||
|
|
|
|||
|
|
color: '#3FB0FF'
|
|||
|
|
},
|
|||
|
|
axisLine: {
|
|||
|
|
show: true,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#84D7FE'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
axisTick: {
|
|||
|
|
show: false
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
yAxis: {
|
|||
|
|
type: 'value',
|
|||
|
|
axisLabel: {
|
|||
|
|
color: '#3FB0FF'
|
|||
|
|
},
|
|||
|
|
splitLine: {
|
|||
|
|
show: true,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#1B538B',
|
|||
|
|
type: 'dashed'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
name: '实物工程量',
|
|||
|
|
data: value,
|
|||
|
|
type: 'bar',
|
|||
|
|
barWidth: fontSize(20),
|
|||
|
|
itemStyle: {
|
|||
|
|
color: '#20AFFF'
|
|||
|
|
},
|
|||
|
|
label: {
|
|||
|
|
// 柱图头部显示值
|
|||
|
|
show: true,
|
|||
|
|
position: "top",
|
|||
|
|
color: "#ffffff",
|
|||
|
|
fontSize: fontSize(10),
|
|||
|
|
formatter: (params) => {
|
|||
|
|
let str = params.value;
|
|||
|
|
console.log(params.name)
|
|||
|
|
if (params.name == '整改率') {
|
|||
|
|
str = str + '%'
|
|||
|
|
}
|
|||
|
|
return str
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '进度曲线',
|
|||
|
|
data: value1,
|
|||
|
|
type: 'line',
|
|||
|
|
barWidth: fontSize(20),
|
|||
|
|
itemStyle: {
|
|||
|
|
color: '#12D896'
|
|||
|
|
},
|
|||
|
|
showSymbol: false,
|
|||
|
|
areaStyle: {
|
|||
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|||
|
|
{
|
|||
|
|
offset: 0,
|
|||
|
|
color: 'RGBA(9, 104, 98, 1)'
|
|||
|
|
}, // %0的颜色值
|
|||
|
|
{
|
|||
|
|
offset: 1,
|
|||
|
|
color: 'RGBA(9, 104, 98, 0)'
|
|||
|
|
} // 100%的颜色值
|
|||
|
|
])
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '主进度线',
|
|||
|
|
data: value2,
|
|||
|
|
type: 'line',
|
|||
|
|
itemStyle: {
|
|||
|
|
color: '#BE94FE'
|
|||
|
|
},
|
|||
|
|
showSymbol: false,
|
|||
|
|
areaStyle: {
|
|||
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|||
|
|
{
|
|||
|
|
offset: 0,
|
|||
|
|
color: '#C293FF'
|
|||
|
|
}, // %0的颜色值
|
|||
|
|
{
|
|||
|
|
offset: 1,
|
|||
|
|
color: 'rgba(194, 147, 255, 0)'
|
|||
|
|
} // 100%的颜色值
|
|||
|
|
])
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
};
|
|||
|
|
var aPassChart = echarts.init(document.getElementById('jdmap'));
|
|||
|
|
aPassChart.setOption(opt);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
fxmap()
|
|||
|
|
function fxmap() {
|
|||
|
|
let data = [
|
|||
|
|
{ value: <%=riskData4%>, name: '重大风险', label: { color: '#FF7473' }, itemStyle: { color: '#FF7473' }, labelLine: { lineStyle: { color: '#FF7473' } } },
|
|||
|
|
{ value: <%=riskData1%>, name: '低风险', label: { color: '#5C5AFF' }, itemStyle: { color: '#5C5AFF' }, labelLine: { lineStyle: { color: '#5C5AFF' } } },
|
|||
|
|
{ value: <%=riskData3%>, name: '较大风险', label: { color: '#FFA502' }, itemStyle: { color: '#FFA502' }, labelLine: { lineStyle: { color: '#FFA502' } } },
|
|||
|
|
{ value: <%=riskData2%>, name: '一般风险', label: { color: '#E7EA2E' }, itemStyle: { color: '#E7EA2E' }, labelLine: { lineStyle: { color: '#E7EA2E' } } },
|
|||
|
|
]
|
|||
|
|
|
|||
|
|
let opt = {
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'item'
|
|||
|
|
},
|
|||
|
|
legend: {
|
|||
|
|
bottom: fontSize(14),
|
|||
|
|
left: 'center',
|
|||
|
|
icon: 'circle',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#ffffff'
|
|||
|
|
},
|
|||
|
|
data: [
|
|||
|
|
{ name: '重大风险', textStyle: { color: '#FF7473' }, },
|
|||
|
|
{ name: '低风险', textStyle: { color: '#5C5AFF' }, },
|
|||
|
|
{ name: '较大风险', textStyle: { color: '#FFA502' } },
|
|||
|
|
{ name: '一般风险', textStyle: { color: '#E7EA2E' }, },
|
|||
|
|
]
|
|||
|
|
},
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
type: 'pie',
|
|||
|
|
radius: ['10%', '40%'],
|
|||
|
|
center: ['50%', '40%'],
|
|||
|
|
label: {
|
|||
|
|
fontSize: fontSize(8),
|
|||
|
|
show: true,
|
|||
|
|
formatter: '{b}\n{c}'
|
|||
|
|
},
|
|||
|
|
data: data.sort(function (a, b) {
|
|||
|
|
return a.value - b.value;
|
|||
|
|
}),
|
|||
|
|
itemStyle: {
|
|||
|
|
normal: {
|
|||
|
|
labelLine: {
|
|||
|
|
length: fontSize(1)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
roseType: 'radius',
|
|||
|
|
|
|||
|
|
animationType: 'scale',
|
|||
|
|
animationEasing: 'elasticOut',
|
|||
|
|
animationDelay: function (idx) {
|
|||
|
|
return Math.random() * 200;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
};
|
|||
|
|
var aPassChart = echarts.init(document.getElementById('fxmap'));
|
|||
|
|
aPassChart.setOption(opt);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
// 人员信息
|
|||
|
|
//rymap()
|
|||
|
|
function rymap() {
|
|||
|
|
let value = [<%=ProjectPersonCount%>]
|
|||
|
|
let label = [<%=ProjectPersonMc%>]
|
|||
|
|
let opt = {
|
|||
|
|
grid: {
|
|||
|
|
top: fontSize(30),
|
|||
|
|
bottom: fontSize(40)
|
|||
|
|
},
|
|||
|
|
xAxis: {
|
|||
|
|
type: 'category',
|
|||
|
|
data: label,
|
|||
|
|
axisLabel: {
|
|||
|
|
|
|||
|
|
color: '#3FB0FF'
|
|||
|
|
},
|
|||
|
|
axisLine: {
|
|||
|
|
show: false,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#84D7FE'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
axisTick: {
|
|||
|
|
show: false
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
yAxis: {
|
|||
|
|
type: 'value',
|
|||
|
|
axisLabel: {
|
|||
|
|
color: '#3FB0FF'
|
|||
|
|
},
|
|||
|
|
splitLine: {
|
|||
|
|
show: true,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#1B538B',
|
|||
|
|
type: 'dashed'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
name: '',
|
|||
|
|
data: value,
|
|||
|
|
type: 'bar',
|
|||
|
|
barWidth: fontSize(20),
|
|||
|
|
itemStyle: {
|
|||
|
|
color: '#38ECC3'
|
|||
|
|
},
|
|||
|
|
label: {
|
|||
|
|
// 柱图头部显示值
|
|||
|
|
show: true,
|
|||
|
|
position: "top",
|
|||
|
|
color: "#ffffff",
|
|||
|
|
fontSize: fontSize(10),
|
|||
|
|
formatter: (params) => {
|
|||
|
|
return params.value[params.encode.x[0]];
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
};
|
|||
|
|
var aPassChart = echarts.init(document.getElementById('rymap'));
|
|||
|
|
aPassChart.setOption(opt);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
// 轮播
|
|||
|
|
var mySwiper = new Swiper('.swiper', {
|
|||
|
|
direction: 'horizontal', // 垂直切换选项
|
|||
|
|
loop: true, // 循环模式选项
|
|||
|
|
autoplay: true,
|
|||
|
|
autoplay: {
|
|||
|
|
delay: 8000,
|
|||
|
|
stopOnLastSlide: false,
|
|||
|
|
disableOnInteraction: true,
|
|||
|
|
},
|
|||
|
|
// 如果需要分页器
|
|||
|
|
pagination: {
|
|||
|
|
el: '.swiper-pagination',
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 如果需要前进后退按钮
|
|||
|
|
navigation: {
|
|||
|
|
nextEl: '.swiper-button-next',
|
|||
|
|
prevEl: '.swiper-button-prev',
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 如果需要滚动条
|
|||
|
|
scrollbar: {
|
|||
|
|
el: '.swiper-scrollbar',
|
|||
|
|
},
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
|
|||
|
|
// 全屏
|
|||
|
|
document.querySelector('.full').onclick = function () {
|
|||
|
|
const element = document.documentElement
|
|||
|
|
if (document.fullscreenElement) {
|
|||
|
|
// 退出
|
|||
|
|
// 如果浏览器有这个Function
|
|||
|
|
if (document.exitFullscreen) {
|
|||
|
|
document.exitFullscreen()
|
|||
|
|
} else if (document.webkitCancelFullScreen) {
|
|||
|
|
document.webkitCancelFullScreen()
|
|||
|
|
} else if (document.mozCancelFullScreen) {
|
|||
|
|
document.mozCancelFullScreen()
|
|||
|
|
} else if (document.msExitFullscreen) {
|
|||
|
|
document.msExitFullscreen()
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
// 全屏
|
|||
|
|
// 如果浏览器有这个Function
|
|||
|
|
if (element.requestFullscreen) {
|
|||
|
|
element.requestFullscreen()
|
|||
|
|
} else if (element.webkitRequestFullScreen) {
|
|||
|
|
element.webkitRequestFullScreen()
|
|||
|
|
} else if (element.mozRequestFullScreen) {
|
|||
|
|
element.mozRequestFullScreen()
|
|||
|
|
} else if (element.msRequestFullscreen) {
|
|||
|
|
element.msRequestFullscreen()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
</script>
|
|||
|
|
<script>
|
|||
|
|
function line(id, xArr, data) {
|
|||
|
|
// 基于准备好的dom，初始化echarts实例
|
|||
|
|
var myChart = echarts.init(document.getElementById(id))
|
|||
|
|
// 指定图表的配置项和数据
|
|||
|
|
var option = {
|
|||
|
|
title: {
|
|||
|
|
left: 'center',
|
|||
|
|
text: ' ',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#fff',
|
|||
|
|
fontSize: 12,
|
|||
|
|
fontWeight: '300'
|
|||
|
|
},
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
tooltip: {
|
|||
|
|
formatter: '{a}<br />{b}: {c}'
|
|||
|
|
},
|
|||
|
|
legend: {
|
|||
|
|
show: true,
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#fff'
|
|||
|
|
},
|
|||
|
|
left: 0
|
|||
|
|
},
|
|||
|
|
xAxis: {
|
|||
|
|
axisTick: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
axisLine: {
|
|||
|
|
lineStyle: {
|
|||
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
axisLabel: {
|
|||
|
|
show: true,
|
|||
|
|
textStyle: {
|
|||
|
|
color: 'rgba(255, 255, 255, 0.8)'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
type: 'category',
|
|||
|
|
data: xArr
|
|||
|
|
},
|
|||
|
|
yAxis: {
|
|||
|
|
axisTick: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
axisLine: {
|
|||
|
|
show: false,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
axisLabel: {
|
|||
|
|
show: true,
|
|||
|
|
textStyle: {
|
|||
|
|
color: 'rgba(255, 255, 255, 0.8)'
|
|||
|
|
},
|
|||
|
|
//formatter: '{value} %'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
series: data,
|
|||
|
|
grid: {
|
|||
|
|
top: '15%',
|
|||
|
|
left: '10',
|
|||
|
|
right: '10',
|
|||
|
|
bottom: '0%',
|
|||
|
|
containLabel: true,
|
|||
|
|
backgroundColor: 'rgba(0,162,233, 0.01)',
|
|||
|
|
// borderColor: 'rgba(0,162,233, 1)'
|
|||
|
|
},
|
|||
|
|
itemStyle: {
|
|||
|
|
//color: 'rgba(200,201,10, 1)'
|
|||
|
|
},
|
|||
|
|
backgroundColor: 'rgba(0,162,233, 0.01)',
|
|||
|
|
textStyle: {
|
|||
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 使用刚指定的配置项和数据显示图表。
|
|||
|
|
myChart.setOption(option)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
var two =<%=Two %>;
|
|||
|
|
var xArr1 = two.categories
|
|||
|
|
var data1 = [{
|
|||
|
|
name: '本月BCWS',
|
|||
|
|
type: 'bar',
|
|||
|
|
//smooth: true,
|
|||
|
|
data: two.series[0].data,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: 'rgba(200,201,10, 1)'
|
|||
|
|
}
|
|||
|
|
}, {
|
|||
|
|
name: '本月BCWP',
|
|||
|
|
type: 'bar',
|
|||
|
|
//smooth: true,
|
|||
|
|
data: two.series[2].data,
|
|||
|
|
}, {
|
|||
|
|
name: '本月ACWP',
|
|||
|
|
type: 'bar',
|
|||
|
|
//smooth: true,
|
|||
|
|
data: two.series[4].data,
|
|||
|
|
}, {
|
|||
|
|
name: '累计BCWS',
|
|||
|
|
type: 'line',
|
|||
|
|
//smooth: true,
|
|||
|
|
data: two.series[1].data,
|
|||
|
|
lineStyle: {
|
|||
|
|
//color: 'rgba(200,201,10, 1)'
|
|||
|
|
}
|
|||
|
|
}, {
|
|||
|
|
name: '累计BCWP',
|
|||
|
|
type: 'line',
|
|||
|
|
//smooth: true,
|
|||
|
|
data: two.series[3].data,
|
|||
|
|
}, {
|
|||
|
|
name: '累计ACWP',
|
|||
|
|
type: 'line',
|
|||
|
|
//smooth: true,
|
|||
|
|
data: two.series[5].data,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: 'rgba(200,201,10, 1)'
|
|||
|
|
},
|
|||
|
|
itemStyle: {
|
|||
|
|
normal: {
|
|||
|
|
color: 'rgba(200,201,10, 1)'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}]
|
|||
|
|
line('left_one', xArr1, data1)
|
|||
|
|
</script>
|
|||
|
|
<script>
|
|||
|
|
function category(id, xArr, series) {
|
|||
|
|
// 基于准备好的dom，初始化echarts实例
|
|||
|
|
var myChart = echarts.init(document.getElementById(id))
|
|||
|
|
// 指定图表的配置项和数据
|
|||
|
|
var option = {
|
|||
|
|
title: {
|
|||
|
|
// left:'center',
|
|||
|
|
text: '',
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#fff',
|
|||
|
|
fontWeight: 'normal',
|
|||
|
|
fontSize: 16
|
|||
|
|
},
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
tooltip: {},
|
|||
|
|
legend: {
|
|||
|
|
left: '3%',
|
|||
|
|
show: false,
|
|||
|
|
selectedMode: false,
|
|||
|
|
textStyle: {//图例文字的样式
|
|||
|
|
color: '#ffffff'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
xAxis: {
|
|||
|
|
axisTick: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
axisLine: {
|
|||
|
|
lineStyle: {
|
|||
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
axisLabel: {
|
|||
|
|
show: true,
|
|||
|
|
interval: 0,
|
|||
|
|
rotate: 50,
|
|||
|
|
textStyle: {
|
|||
|
|
fontSize: 8,
|
|||
|
|
color: 'rgba(255, 255, 255, 0.8)'
|
|||
|
|
},
|
|||
|
|
//formatter: function(params) {
|
|||
|
|
// var newParamsName = ''
|
|||
|
|
// var paramsNameNumber = params.length
|
|||
|
|
// var provideNumber = 6
|
|||
|
|
// var rowNumber = Math.ceil(paramsNameNumber / provideNumber)
|
|||
|
|
// for (let row = 0; row < rowNumber; row++) {
|
|||
|
|
// newParamsName +=
|
|||
|
|
// params.substring(
|
|||
|
|
// row * provideNumber,
|
|||
|
|
// (row + 1) * provideNumber
|
|||
|
|
// ) + '\n'
|
|||
|
|
// }
|
|||
|
|
// return newParamsName
|
|||
|
|
// }
|
|||
|
|
},
|
|||
|
|
type: 'category',
|
|||
|
|
data: xArr
|
|||
|
|
},
|
|||
|
|
yAxis: {
|
|||
|
|
axisTick: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
axisLine: {
|
|||
|
|
show: false,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
axisLabel: {
|
|||
|
|
show: true,
|
|||
|
|
textStyle: {
|
|||
|
|
color: 'rgba(255, 255, 255, 0.8)'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//设置网格线颜色
|
|||
|
|
splitLine: {
|
|||
|
|
show: true,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: ['#182067'],
|
|||
|
|
width: 1,
|
|||
|
|
type: 'solid'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
series: series,
|
|||
|
|
grid: {
|
|||
|
|
top: '12%',
|
|||
|
|
left: '10',
|
|||
|
|
right: '10',
|
|||
|
|
bottom: '10',
|
|||
|
|
containLabel: true,
|
|||
|
|
backgroundColor: 'rgba(0,162,233, 0.01)',
|
|||
|
|
// borderColor: 'rgba(0,162,233, 1)'
|
|||
|
|
},
|
|||
|
|
backgroundColor: 'rgba(0,162,233, 0.01)',
|
|||
|
|
textStyle: {
|
|||
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 使用刚指定的配置项和数据显示图表。
|
|||
|
|
myChart.setOption(option)
|
|||
|
|
}
|
|||
|
|
var person =<%=Person %>
|
|||
|
|
var two = {
|
|||
|
|
"title": "各工种人力情况", "xFontNum": 0, "legend": null,
|
|||
|
|
"categories": person.categories,
|
|||
|
|
//"categories": ["焊接工", "安全员", "安全协管员", "安装工", "钣金工", "保温工", "材料员", "财务管理", "操作工", "测量工", "车工", "出纳", "厨师", "测绘工程师", "电工", "电气工程师", "吊车司机", "防火工"],
|
|||
|
|
"series": [{
|
|||
|
|
"name": null, "type": null,
|
|||
|
|
"data": person.series[0].data,
|
|||
|
|
//"data": [1.0, 4.0, 0.0, 0.0, 0.0, 12.0, 0.0, 0.0, 10.0, 0.0, 20.0, 0.0, 6.0, 0.0, 0.0, 0.0, 8.0, 0.0],
|
|||
|
|
"dataString": null, "dataObject": null
|
|||
|
|
}], "series2": null
|
|||
|
|
};
|
|||
|
|
var xArr2 = two.categories
|
|||
|
|
var data = [12, 5, 28, 43, 22]
|
|||
|
|
var data1 = [21, 9, 12, 15, 8]
|
|||
|
|
var series = [{
|
|||
|
|
name: '各工种人力情况',
|
|||
|
|
type: 'bar',
|
|||
|
|
barWidth: 20,
|
|||
|
|
//barGap:10,
|
|||
|
|
data: two.series[0].data,
|
|||
|
|
label: { //柱体上显示数值
|
|||
|
|
show: true,//开启显示
|
|||
|
|
position: 'top',//在上方显示
|
|||
|
|
textStyle: {//数值样式
|
|||
|
|
fontSize: '20px',
|
|||
|
|
color: '#fff'
|
|||
|
|
},
|
|||
|
|
formatter: '{c}',
|
|||
|
|
},
|
|||
|
|
itemStyle: { normal: { color: '#0c81fe' } }
|
|||
|
|
}];
|
|||
|
|
category('left_two', xArr2, series)
|
|||
|
|
</script>
|