init: 工业互联网数据看板项目首次入库
This commit is contained in:
XingCheng3
268
right.html
Normal file
268
right.html
Normal file
@@ -0,0 +1,268 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<script src="./echarts.js"></script>
|
||||
<script src="./echarts-gl.min.js"></script>
|
||||
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
|
||||
<script type="module" src="./getPie3D.js"></script>
|
||||
<link rel="stylesheet" href="./left.css">
|
||||
<script type="module" src="./right.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- 内层左侧盒子 -->
|
||||
<div class="content content-left">
|
||||
<div class="box ">
|
||||
<div class="box-title">企业介绍</div>
|
||||
<div class="firm-introduce">
|
||||
<div class="data-firm-img"></div>
|
||||
<div class="data-firm-text">
|
||||
公司拥有磨超加工自动生产线、装配自动生产线和其它先进的生产加工设备600多台套，采用了套圈冷辗扩、保持架氮化处理等先进的工艺和技术，对套圈进行100%探伤检查。公司的计量分析、检测试验手段完备，被认定为二级计量单位。
|
||||
</div>
|
||||
</div>
|
||||
<div class="firm-name">台州市瑞达机械有限公司</div>
|
||||
</div>
|
||||
<div class="box item-introduce">
|
||||
<div class="box-title">项目介绍</div>
|
||||
<div class="item-img"></div>
|
||||
<div class="introduce-item-list">
|
||||
<div class="introduce-item">
|
||||
<div class="title">
|
||||
<div class="icon"></div>车间透明化
|
||||
</div>
|
||||
<div class="data">通过物联技术自动采集车间设备（压铸、机加）的生产数据</div>
|
||||
</div>
|
||||
<div class="introduce-item">
|
||||
<div class="title">
|
||||
<div class="icon"></div>生产可追溯
|
||||
</div>
|
||||
<div class="data">充分利用条码技术，实现从压铸-机加-装配全流程可追溯。</div>
|
||||
</div>
|
||||
<div class="introduce-item">
|
||||
<div class="title">
|
||||
<div class="icon"></div>数据可视化
|
||||
</div>
|
||||
<div class="data">提供全面的数据驾驶舱服务，包括综合驾驶舱车间驾驶舱、生产驾驶舱、质量驾驶舱等主题，并扩展支持自定义BI内容</div>
|
||||
</div>
|
||||
<div class="introduce-item">
|
||||
<div class="title">
|
||||
<div class="icon"></div>决策数据化
|
||||
</div>
|
||||
<div class="data">为企业后续管理优化、产能扩充、现场例会提供精准的数据支撑，并预留人工智能算法接口辅助决策制定</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box scene-result">
|
||||
<div class="box-title ">现场效果</div>
|
||||
<div class="img-matrix">
|
||||
<div class="scene-img-box">
|
||||
<div class="scene-img scene-img1"></div>
|
||||
</div>
|
||||
<div class="scene-img-box">
|
||||
<div class="scene-img scene-img2"></div>
|
||||
</div>
|
||||
<div class="scene-img-box">
|
||||
<div class="scene-img scene-img3"></div>
|
||||
</div>
|
||||
<div class="scene-img-box">
|
||||
<div class="scene-img scene-img4"></div>
|
||||
</div>
|
||||
<!-- <div class="scene-img-box-one"><div class="scene-img scene-img0"></div></div> -->
|
||||
<!-- <div class="scene-img-box-two">
|
||||
<div class="scene-img scene-img01"></div>
|
||||
</div>
|
||||
<div class="scene-img-box-two">
|
||||
<div class="scene-img scene-img02"></div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 内层右侧盒子 -->
|
||||
<div class="content content-right">
|
||||
<div class="box">
|
||||
<div class="box-title ">项目成效</div>
|
||||
<div class="item-effect">
|
||||
<div class="name">项目运行时间</div>
|
||||
<div class="hint"></div>
|
||||
<div class="data">100</div>
|
||||
<div class="unit">(天)</div>
|
||||
</div>
|
||||
<div class="hr"></div>
|
||||
<div class="item-effect">
|
||||
<div class="name">设备产能</div>
|
||||
<div class="hint">提升</div>
|
||||
<div class="data">40</div>
|
||||
<div class="unit">(%)</div>
|
||||
</div>
|
||||
<div class="hr"></div>
|
||||
<div class="item-effect">
|
||||
<div class="name">项目运行时间</div>
|
||||
<div class="hint">节约</div>
|
||||
<div class="data">12</div>
|
||||
<div class="unit">(%)</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box appoint-data-board">
|
||||
<div class="box-title">定制数据展板</div>
|
||||
<div class="appointBox">
|
||||
<div class="appoint-img"></div>
|
||||
<div class="appoint-data">
|
||||
<div class="title">杰克顶尖产线数字看板</div>
|
||||
<div class="text">根据杰克顶尖产线原型1:1建模，对接上数采盒子数据，实现看板上设备与现场实时同步。另外通过数采盒子，采集设备内部关键数据，实时图表展示。</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="appoint-point">
|
||||
<div class="point select"></div>
|
||||
<div class="point"></div>
|
||||
<div class="point"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 内层项目实施进度 -->
|
||||
<div class="box item-plan item-implement-plan">
|
||||
<div class="box-title">项目实施进度</div>
|
||||
<div class="item-implement-plan-box">
|
||||
<div class="plan-top">
|
||||
<div class="title">本月计划完成度</div>
|
||||
<div class="title-unit">
|
||||
<div class="left">本月</div>
|
||||
<div class="right"> / 上月</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="line">
|
||||
<div class="select"></div>
|
||||
</div>
|
||||
<div class="progress-bar">
|
||||
<div class="bar-left">
|
||||
<div class="left">32</div>
|
||||
<div class="right">/ 47</div>
|
||||
</div>
|
||||
<div class="bar-right">
|
||||
<div class="dot select"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="progress-data-list">
|
||||
<div class="item">
|
||||
<div class="year">2022</div>
|
||||
<div class="date">09/30</div>
|
||||
<div class="data">二期研发实施</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="year">2022</div>
|
||||
<div class="date">09/28</div>
|
||||
<div class="data">阶段性平台审核检查</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="year">2022</div>
|
||||
<div class="date">09/27</div>
|
||||
<div class="data">相关车间看板定制</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="year">2022</div>
|
||||
<div class="date">09/25</div>
|
||||
<div class="data">功能盒子检验</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="year">2022</div>
|
||||
<div class="date">09/23</div>
|
||||
<div class="data">平台需求修改、验收打款</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="year">2022</div>
|
||||
<div class="date">09/20</div>
|
||||
<div class="data">二期软件定制研发</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="year">2022</div>
|
||||
<div class="date">09/14</div>
|
||||
<div class="data">开发进度汇报</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="year">2022</div>
|
||||
<div class="date">09/09</div>
|
||||
<div class="data">平台需求整理</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="year">2022</div>
|
||||
<div class="date">09/03</div>
|
||||
<div class="data">界面商务详谈</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="year">2022</div>
|
||||
<div class="date">09/01</div>
|
||||
<div class="data">现场错误设备勘察</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 右上角日期时间 -->
|
||||
<div class="top-right-timeBox">
|
||||
<div class="time">12:02:30</div>
|
||||
<div class="dateBox">
|
||||
<div class="month">Sep</div>
|
||||
<div class="date">2022.09.22</div>
|
||||
</div>
|
||||
<div class="long-string"></div>
|
||||
<div class="img"></div>
|
||||
</div>
|
||||
<!-- 左上角企业logo -->
|
||||
<div class="top-left-firm-logo">瑞达机械项目</div>
|
||||
|
||||
<!-- 底部数据统计 -->
|
||||
<div class="bottom-data-count">
|
||||
<div class="count-left">
|
||||
<div class="title">稼动率趋势</div>
|
||||
<div id="trend"></div>
|
||||
</div>
|
||||
|
||||
<div class="count-center-left">
|
||||
<div class="top-data">
|
||||
<div class="top">
|
||||
<div class="icon"></div>工作
|
||||
</div>
|
||||
<div class="data">75</div>
|
||||
</div>
|
||||
<div class="top-data">
|
||||
<div class="top">
|
||||
<div class="icon orange"></div>故障
|
||||
</div>
|
||||
<div class="data">30</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="count-center">
|
||||
<div class="center-top">数据统计</div>
|
||||
<div class="center-center">
|
||||
<div class="name">设备总数</div>
|
||||
<div class="data">230</div>
|
||||
</div>
|
||||
<div id="count-circle"></div>
|
||||
</div>
|
||||
<div class="count-center-left right">
|
||||
<div class="top-data">
|
||||
<div class="top">
|
||||
<div class="icon gray"></div>离线
|
||||
</div>
|
||||
<div class="data">90</div>
|
||||
</div>
|
||||
<div class="top-data">
|
||||
<div class="top">
|
||||
<div class="icon yellow"></div>待机
|
||||
</div>
|
||||
<div class="data">35</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="count-right">
|
||||
<div class="title">用电量趋势</div>
|
||||
<div id="electricityTrend"></div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user