| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762 |
- <!doctype html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
- <title>MES可视化大屏</title>
- <link rel="stylesheet" href="${ctxStatic}/bootstrap/css/bootstrap.min.css">
- <link rel="stylesheet" href="${ctxStatic}/screen/style.css">
- <style>
- .devicestatus{
- position: absolute;
- z-index: 11;
- left: 150px;
- right: 150px;
- top: 120px;
- height: 30px;
- line-height: 30px;
- margin: 0;
- text-align: center;
- }
- .statuszx,.statuslx{
- padding-left: 20px;
- position: relative;
- display: inline-block;
- width: 100px;
- height: 30px;
- line-height: 30px;
- font-size: 18px;
- color: #ffffff;
- }
- .statuszx::before{
- content: '';
- background-color: #40DE78;
- width: 18px;
- height: 18px;
- position: absolute;
- z-index: 1;
- top: 6px;
- left: 0;
- }
- .statuslx::before{
- content: '';
- background-color: #F63E65;
- width: 18px;
- height: 18px;
- position: absolute;
- z-index: 1;
- top: 6px;
- left: 0;
- }
- .devicebox{
- position: absolute;
- z-index: 10;
- left: 150px;
- right: 150px;
- top: 150px;
- bottom: 80px;
- margin: 0;
- /*background-color: red;*/
- }
- .devicebox .opronbox{
- display: inline-block;
- position: relative;
- width: 180px;
- height: 170px;
- /*background-color: gold;*/
- text-align: center;
- color: #35D86E;
- font-size: 18px;
- font-family: FZChaoCuHei-M10S;
- font-weight: 400;
- float: left;
- margin: 21px 0;
- }
- .opronbox-h2 .opronbox{
- margin: 51px 0;
- }
- .devicebox .opronbox .s{
- width: 71px;
- height: 127px;
- }
- .devicebox .opronsn{
- position: absolute;
- width: 100%;
- height: 40px;
- line-height: 40px;
- top: 91px;
- left: 0;
- color: #35D86E;
- font-size: 18px;
- font-family: FZChaoCuHei-M10S;
- font-weight: 400;
- }
- .devicebox .oprontitle{
- color: #FFFFFF;
- font-size: 18px;
- font-family: FZChaoCuHei-M10S;
- font-weight: 400;
- height: 30px;
- line-height: 30px;
- overflow: hidden;
- padding: 0 10px;
- }
- .devicebox .arrow{
- position: absolute;
- width: 72px;
- height: 28px;
- z-index: 10;
- right: -36px;
- top: 70px;
- }
- .opronbox .online{
- position: absolute;
- z-index: 10;
- width: 80px;
- height: 40px;
- line-height: 40px;
- top: 70px;
- left: -80px;
- text-align: center;
- }
- .opronbox .online,.opronbox .unonline{
- position: absolute;
- z-index: 10;
- width: 80px;
- height: 40px;
- line-height: 40px;
- top: 60px;
- text-align: center;
- font-size: 24px;
- font-family: FZChaoCuHei-M10S;
- font-weight: 400;
- color: #35D86E;
- }
- .opronbox .online{
- left: -80px;
- }
- .opronbox .unonline{
- right: -80px;
- }
- </style>
- </head>
- <body>
- <div class="screenbg">
- <img class="bg1" src="${ctxStatic}/screen/imgs/bg.png" alt="">
- <img class="bg2" style="display: none;" src="${ctxStatic}/screen/imgs/bg2.png" alt="">
- </div>
- <div class="screenbox1">
- <div class="screenmain">
- <div class="screen-title">MES系统KPI数据大屏</div>
- <div class="slbox">
- <div class="slbox-header">
- <div class="slbox-td1">B007</div>
- <div class="slbox-td2"> </div>
- <div class="slbox-td3">计划</div>
- <div class="slbox-td4">实际</div>
- <div class="slbox-td5">达成率</div>
- </div>
- <!-- <div class="slbox-tr1">-->
- <!-- <div class="slbox-th slbox-td1">冷板</div>-->
- <!-- <div class="slbox-tdleft">-->
- <!-- <div class="tdcell">-->
- <!-- <div class="slbox-td2">上线</div>-->
- <!-- <div class="slbox-td3" id="xzcsxjh">0</div>-->
- <!-- <div class="slbox-td4" id="xzcsxsj">0</div>-->
- <!-- <div class="slbox-td5" id="xzcsxdcl">0%</div>-->
- <!-- </div>-->
- <!-- <div class="tdcell">-->
- <!-- <div class="slbox-td2">下线</div>-->
- <!-- <div class="slbox-td3" id="xzcxxjh">0</div>-->
- <!-- <div class="slbox-td4" id="xzcxxsj">0</div>-->
- <!-- <div class="slbox-td5" id="xzcxxdcl">0%</div>-->
- <!-- </div>-->
- <!-- </div>-->
- <!-- </div>-->
- <div class="slbox-tr1">
- <div class="slbox-th slbox-td1">框架</div>
- <div class="slbox-tdleft">
- <div class="tdcell">
- <div class="slbox-td2">上线</div>
- <div class="slbox-td3" id="op1sxjh">0</div>
- <div class="slbox-td4" id="op1sxsj">0</div>
- <div class="slbox-td5" id="op1sxdcl">0%</div>
- </div>
- <div class="tdcell">
- <div class="slbox-td2">下线</div>
- <div class="slbox-td3" id="op1xxjh">0</div>
- <div class="slbox-td4" id="op1xxsj">0</div>
- <div class="slbox-td5" id="op1xxdcl">0%</div>
- </div>
- </div>
- </div>
- <div class="slbox-tr1">
- <div class="slbox-th slbox-td1">箱体</div>
- <div class="slbox-tdleft">
- <div class="tdcell">
- <div class="slbox-td2">上线</div>
- <div class="slbox-td3" id="op2sxjh">0</div>
- <div class="slbox-td4" id="op2sxsj">0</div>
- <div class="slbox-td5" id="op2sxdcl">0%</div>
- </div>
- <div class="tdcell">
- <div class="slbox-td2">下线</div>
- <div class="slbox-td3" id="op2xxjh">0</div>
- <div class="slbox-td4" id="op2xxsj">0</div>
- <div class="slbox-td5" id="op2xxdcl">0%</div>
- </div>
- </div>
- </div>
- <div class="slbox-tr2">
- <div class="slbox-th slbox-td1">主线FTT</div>
- <div class="slbox-tdleft">
- <div class="slbox-td2">--</div>
- <div class="slbox-td3" id="ftt1">--</div>
- <div class="slbox-td4" id="ftt2">100%</div>
- <div class="slbox-td5" id="ftt3">--</div>
- </div>
- </div>
- </div>
- <div class="srbox">
- <!-- <div class="jphlist">-->
- <!-- <div class="jphcount"><span id="avgjp1">0</span>/<span id="jp1">0</span></div>-->
- <!-- <div class="jphtitle">冷板 JPH</div>-->
- <!-- </div>-->
- <div class="jphlist">
- <div class="jphcount"><span id="avgjp2">0</span>/<span id="jp2">0</span></div>
- <div class="jphtitle">框架 JPH</div>
- </div>
- <div class="jphlist">
- <div class="jphcount"><span id="avgjp3">0</span>/<span id="jp3">0</span></div>
- <div class="jphtitle">箱体 JPH</div>
- </div>
- </div>
- <!-- <div class="screen-footer" onclick="changeIndex(1)">切换冷板设备状态</div>-->
- </div>
- </div>
- <div class="screenbox2">
- <div class="screenmain">
- <div class="screen-title">MES系统冷板设备状态大屏</div>
- <div class="devicestatus">
- <div class="statuszx">在线</div>
- <div class="statuslx">离线</div>
- </div>
- <div class="devicebox opronbox-h2">
- <div class="opronbox LBOP040">
- <div class="online">上线</div>
- <img class="s" src="${ctxStatic}/screen/imgs/s2.png" alt="">
- <div class="opronsn">OP40-OP50</div>
- <div class="oprontitle">左右冷板FSW</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox LBOP060">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP60</div>
- <div class="oprontitle">左右冷板正面CNC</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox LBOP070A">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP70A</div>
- <div class="oprontitle">左右冷板反面CNC</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow2.png" alt="">
- </div>
- <div class="opronbox LBOP070B">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP70B</div>
- <div class="oprontitle">左右冷板反面CNC</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox LBOP080">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP80</div>
- <div class="oprontitle">去毛刺吹铝屑</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox LBOP090">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP90</div>
- <div class="oprontitle">超声波清洗</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox LBOP100A">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP100-OP110A</div>
- <div class="oprontitle">冷板FSW堵头焊接</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow2.png" alt="">
- </div>
- <div class="opronbox LBOP100B">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP100-OP110B</div>
- <div class="oprontitle">冷板FSW堵头焊接</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow2.png" alt="">
- </div>
- <div class="opronbox LBOP100C">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP100-OP110C</div>
- <div class="oprontitle">冷板FSW堵头焊接</div>
- <!-- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">-->
- </div>
- <div class="opronbox LBOP120">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP120</div>
- <div class="oprontitle">打磨焊道</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox LBOP130">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP130</div>
- <div class="oprontitle">水嘴自动激光焊</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox LBOP140">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP140</div>
- <div class="oprontitle">底护板支撑柱+BDU柱+线束支架焊接</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox LBOP150">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP150</div>
- <div class="oprontitle">冷板气检</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox LBOP160A">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP160A</div>
- <div class="oprontitle">冷板总成CNC正面</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow2.png" alt="">
- </div>
- <div class="opronbox LBOP160B">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP160B</div>
- <div class="oprontitle">冷板总成CNC正面</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox LBOP170A">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP170A</div>
- <div class="oprontitle">冷板总成CNC反面</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow2.png" alt="">
- </div>
- <div class="opronbox LBOP170B">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP170B</div>
- <div class="oprontitle">冷板总成CNC反面</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox LBOP180">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP180</div>
- <div class="oprontitle">去毛刺吹铝屑,清洁</div>
- <!-- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">-->
- </div>
- <div class="opronbox LBOP190">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP190</div>
- <div class="oprontitle">高压冲洗</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox LBOP200">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP200</div>
- <div class="oprontitle">M5+M6钢丝牙套安装</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox LBOP210">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP210</div>
- <div class="oprontitle">冷板气检</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox LBOP220">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP220</div>
- <div class="oprontitle">冷板氦检</div>
- <div class="unonline">下线</div>
- </div>
- </div>
- <div class="screen-footer" onclick="changeIndex(2)">切换框架设备状态</div>
- </div>
- </div>
- <div class="screenbox3">
- <div class="screenmain">
- <div class="screen-title">MES系统框架设备状态大屏</div>
- <div class="devicestatus">
- <div class="statuszx">在线</div>
- <div class="statuslx">离线</div>
- </div>
- <div class="devicebox">
- <div class="opronbox XTOP040">
- <div class="online">上线</div>
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP40</div>
- <div class="oprontitle">右边梁镭雕二维码</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP050">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP50</div>
- <div class="oprontitle">框架总成CMT焊接</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP060">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP60</div>
- <div class="oprontitle">角撑型材焊接+人工补焊</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP070">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP70</div>
- <div class="oprontitle">焊道铣削+打磨</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP080">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP80</div>
- <div class="oprontitle">焊道检查</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP090">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP90</div>
- <div class="oprontitle">边框气密</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP100A">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP100A</div>
- <div class="oprontitle">框架正面CNC</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow2.png" alt="">
- </div>
- <div class="opronbox XTOP100B">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP100B</div>
- <div class="oprontitle">框架正面CNC</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP110A">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP110A</div>
- <div class="oprontitle">框架反面CNC</div>
- </div>
- <div class="opronbox XTOP110B">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP110B</div>
- <div class="oprontitle">框架反面CNC</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP120">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP120</div>
- <div class="oprontitle">框架去毛刺吹铝屑,清洁</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP130">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP130</div>
- <div class="oprontitle">套筒涂胶压合</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP140">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP140</div>
- <div class="oprontitle">胶水固化</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP150">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP150</div>
- <div class="oprontitle">正面安装螺接螺母+M6钢丝牙套</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP160">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP160</div>
- <div class="oprontitle">正面拉铆</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP170">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP170</div>
- <div class="oprontitle">反面拉铆+安装螺接螺母</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP180">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP180</div>
- <div class="oprontitle">贴密封条+边框涂胶</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP190A">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP190A</div>
- <div class="oprontitle">FDS+安装抽芯铆钉</div>
- <!-- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">-->
- </div>
- <div class="opronbox XTOP190B">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP190B</div>
- <div class="oprontitle">FDS+安装抽芯铆钉</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow2.png" alt="">
- </div>
- <div class="opronbox XTOP200">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP200</div>
- <div class="oprontitle">正面清理溢胶,反面框架清胶,正面JH348胶水封堵</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP210">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP210</div>
- <div class="oprontitle">箱体FDS螺钉头部涂胶</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP220">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP220</div>
- <div class="oprontitle">胶水固化</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP230">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP230</div>
- <div class="oprontitle">半成品气密检测</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP240">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP240</div>
- <div class="oprontitle">泡棉装配+底护板装配</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP250">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP250</div>
- <div class="oprontitle">总成气密检测+液冷板气密检测</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP260">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP260</div>
- <div class="oprontitle">检具检测</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP270">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP270</div>
- <div class="oprontitle">箱体清洁</div>
- <!-- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">-->
- </div>
- <div class="opronbox XTOP280">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP280</div>
- <div class="oprontitle">贴四周保温泡棉</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP290">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP290</div>
- <div class="oprontitle">视觉检测</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP300">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP300</div>
- <div class="oprontitle">终检</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP310">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP310</div>
- <div class="oprontitle">GP12</div>
- <img class="arrow" src="${ctxStatic}/screen/imgs/arrow1.png" alt="">
- </div>
- <div class="opronbox XTOP320">
- <img class="s" src="${ctxStatic}/screen/imgs/s1.png" alt="">
- <div class="opronsn">OP320</div>
- <div class="oprontitle">包装</div>
- <div class="unonline">下线</div>
- </div>
- </div>
- <div class="screen-footer" onclick="changeIndex(0)">切换KPI数据</div>
- </div>
- </div>
- <script src="${ctxStatic}/jquery-1.11.3.min.js"></script>
- <script>
- let devices = [];
- let info = null;
- let curIdx = 0;
- $(window).resize(function(){
- location.reload()
- });
- $(function () {
- changeZoom();
- changeIndex(0);
- getData();
- //
- // setInterval(function () {
- // let idx = curIdx == 0?1:0;
- // changeIndex(idx)
- // },1000*80);
- //
- setInterval(function () {
- getData();
- },1000*60*2);
- });
- function changeZoom() {
- var wb = $(window).width()/1920;
- var hb = $(window).height()/1080;
- if(wb >= hb){
- $('body').css({
- 'zoom': hb,
- });
- }else{
- $('body').css({
- 'zoom': wb,
- });
- }
- }
- function changeIndex(idx) {
- curIdx = idx;
- if(idx == 1){
- $('.screenbox3').hide();
- $('.screenbox2').show();
- $('.screenbox1').hide();
- $('.bg2').show();
- $('.bg1').hide();
- }else if(idx == 2){
- $('.screenbox3').show();
- $('.screenbox2').hide();
- $('.screenbox1').hide();
- $('.bg2').show();
- $('.bg1').hide();
- }else{
- $('.screenbox1').show();
- $('.screenbox2').hide();
- $('.screenbox3').hide();
- $('.bg1').show();
- $('.bg2').hide();
- }
- }
- function getData() {
- let url = "/js/a/mes/mesProduct/screenData";
- $.post(url,function (ret) {
- console.log(ret);
- // devices = ret.data.devices;
- info = ret.data;
- console.log(info);
- console.log(devices);
- formatData();
- });
- }
- function formatData(){
- if(info){
- $("#jp1").html(info.jp1);
- $("#jp2").html(info.jp2);
- $("#jp3").html(info.jp3);
- $("#avgjp1").html(info.avgjp1);
- $("#avgjp2").html(info.avgjp2);
- $("#avgjp3").html(info.avgjp3);
- $("#ftt1").html(info.ftt1);
- $("#ftt2").html(info.ftt2);
- $("#ftt3").html(info.ftt3);
- $("#op2xxjh").html(info.op2xxjh);
- $("#op2xxsj").html(info.op2xxsj);
- $("#op2xxdcl").html(info.op2xxdcl);
- $("#op2sxjh").html(info.op2sxjh);
- $("#op2sxsj").html(info.op2sxsj);
- $("#op2sxdcl").html(info.op2sxdcl);
- $("#op1xxjh").html(info.op1xxjh);
- $("#op1xxsj").html(info.op1xxsj);
- $("#op1xxdcl").html(info.op1xxdcl);
- $("#op1sxjh").html(info.op1sxjh);
- $("#op1sxsj").html(info.op1sxsj);
- $("#op1sxdcl").html(info.op1sxdcl);
- $("#xzcxxjh").html(info.xzcxxjh);
- $("#xzcxxsj").html(info.xzcxxsj);
- $("#xzcxxdcl").html(info.xzcxxdcl);
- $("#xzcsxjh").html(info.xzcsxjh);
- $("#xzcsxsj").html(info.xzcsxsj);
- $("#xzcsxdcl").html(info.xzcsxdcl);
- }else{
- $("#jp1").html("0");
- $("#jp2").html("0");
- $("#jp3").html("0");
- $("#avgjp1").html("0");
- $("#avgjp2").html("0");
- $("#avgjp3").html("0");
- $("#ftt1").html("0");
- $("#ftt2").html("0");
- $("#ftt3").html("0");
- $("#op2xxjh").html("0");
- $("#op2xxsj").html("0");
- $("#op2xxdcl").html("0");
- $("#op2sxjh").html("0");
- $("#op2sxsj").html("0");
- $("#op2sxdcl").html("0");
- $("#op1xxjh").html("0");
- $("#op1xxsj").html("0");
- $("#op1xxdcl").html("0");
- $("#op1sxjh").html("0");
- $("#op1sxsj").html("0");
- $("#op1sxdcl").html("0");
- $("#xzcxxjh").html("0");
- $("#xzcxxsj").html("0");
- $("#xzcxxdcl").html("0");
- $("#xzcsxjh").html("0");
- $("#xzcsxsj").html("0");
- $("#xzcsxdcl").html("0");
- }
- for(let o in devices){
- $("."+devices.gw).removeClass("cur1");
- $("."+devices.gw).removeClass("cur2");
- $("."+devices.gw).removeClass("cur3");
- $("."+devices.gw).removeClass("cur4");
- if(devices.workStatus == "1"||devices.workStatus == "2"||devices.workStatus == "5"){
- $("."+devices.oprno).addClass("cur1");
- }else if(devices.workStatus == "3"||devices.workStatus == "4"||devices.workStatus == "6"){
- $("."+devices.oprno).addClass("cur3");
- }else if(devices.workStatus == "7"){
- $("."+devices.oprno).addClass("cur4");
- }else if(devices.workStatus == "8"){
- $("."+devices.oprno).addClass("cur2");
- }
- }
- }
- </script>
- </body>
- </html>
|