dingcong
/
everlight.eap


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275
							<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="IE=Edge，chrome=1" />

    <meta http-equiv="pragma" content="no-cache" />
    <meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
    <meta http-equiv="expires" content="0" />

    <title>机台状态展示</title>

    <link rel="stylesheet" href="../css/macstatus.css?v=" + Date.now() />
    <link rel="stylesheet" href="../lib/owl-carousel/css/owl.carousel.css" />
    <link rel="stylesheet" href="../lib/owl-carousel/css/owl.theme.css" />
    <link rel="stylesheet" href="../lib/layer/theme/default/layer.css" />
    <link rel="stylesheet" href="../css/liMarquee.css?v=" + Date.now() />
    <link rel="stylesheet" href="../css/mac-color.css?v=" + Date.now() />
    <link rel="stylesheet" href="../css/ofilm/nav_sytle.css?v=" + Date.now() />

    <script src="../js/server-config.js?v=" + Date.now()></script>
    <script src="../lib/oidc-client.js"></script>
    <script type="text/javascript" src="../js/jquery-1.8.3.min.js"></script>
    <script src="../lib/layer/layer.js"></script>
    <script type="text/javascript" src="./../lib/signalr.js"></script>
    <script src="../lib/vue.min.js"></script>
    <script src="../lib/jquery.liMarquee.js"></script>
    <script src="../lib/owl-carousel/js/owl.carousel.js"></script>
    <script src="../lib/echarts.min.js"></script>
    <script src="../lib/html2canvas.js"></script>
    <script src="../js/nav.js"></script>
    <script src="../js/dataHelper.js"></script>
    <script src="../lib/axios.js"></script>

    <style>
      #clock {
        font-family: "Share Tech Mono", monospace;
        text-align: center;
        vertical-align: middle;
        color: #00fbfe;
        font-weight: bold;
        text-shadow: 0 0 20px #0aafe6, 0 0 20px rgba(10, 175, 230, 0);
      }
      #clock .date-time {
        letter-spacing: 0.05em;
        font-size: 2rem;
      }
      #clock .weekday {
        letter-spacing: 0.05em;
        font-size: 1.15rem;
        padding-bottom: 5px;
      }
      #clock .date {
        letter-spacing: 0.1em;
        font-size: 1.15rem;
        padding-bottom: 5px;
      }

      .export-btn {
        color: #fff;
        border: 1px solid #fff;
        width: 6.2rem;
        font-weight: bold;
        float: right;
        margin-right: 30px;
        margin-top: 0.43rem;
        height: 2rem;
        line-height: 2rem;
        background-color: rgb(64, 158, 255);
        border-radius: 5px;
      }
      .export-btn:hover {
        cursor: pointer;
      }
    </style>
  </head>

  <body>
    <div class="canvas-box">
      <canvas id="canvas">你的浏览器不支持canvas</canvas>
    </div>
    <div id="content">
      <div class="top">
        <div class="logo">
          <!-- <img src="../images/logo1.png" width="100%" alt="欧菲光" /> -->
        </div>
        <div class="header">
          <div class="summary">
            <div class="rate-chart">
              <div
                id="rateChart"
                style="
                  width: 26.4rem;
                  height: 7.69rem;
                  margin: 0 auto;
                  margin-top: -0.8rem;
                  visibility: hidden;
                "
              ></div>
            </div>

            <div class="count-chart">
              <table
                class="count"
                border="1"
                cellspacing="0"
                id="tb_count"
              ></table>
            </div>
            <div class="clock" id="clock">
              <p class="date">{{ date }}</p>
              <p class="weekday">{{ weekday }}</p>
              <p class="date-time">{{ time }}</p>
            </div>
          </div>
        </div>
      </div>
      <div id="table-content" class="container">
        <div class="table">
          <ul class="table-header flex">
            <li class="content-td num">线体</li>
            <!-- <li class="content-td recipe">机种</li>
                    <li class="content-td runrate">稼动率</li> -->
            <li class="content-td equipment">
              <span id="li_factory"></span>
              <span class="export-btn" onclick="exportImage();">导出图片</span>
            </li>
          </ul>
          <div id="auto-scroll" style="height: 300px"></div>
        </div>
      </div>
    </div>
    <div class="widget">
      <img
        src="../images/right-menu.png"
        width="100%"
        height="100%"
        alt="查询菜单"
      />
    </div>
    <div class="bgDiv"></div>
    <div class="rightNav">
      <iframe
        id="rightFrame"
        src="../pages/macstatus-right-nav.html"
        width="100%"
        height="100%"
        border="0"
      ></iframe>
    </div>

    <!-- 背景流星动画 -->
    <script>
      var WINDOW_WIDTH = document.body.offsetWidth;
      var WINDOW_HEIGHT = document.body.offsetHeight;
      var canvas, context;
      var num = 500;
      var stars = [];
      var mouseX = WINDOW_WIDTH / 2;
      var mouseY = WINDOW_HEIGHT / 2;
      var rnd;

      window.onload = function () {
        canvas = document.getElementById("canvas");
        canvas.width = WINDOW_WIDTH;
        canvas.height = WINDOW_HEIGHT;

        context = canvas.getContext("2d");

        addStar();
        setInterval(render, 33);
        liuxing();

        // render();
        document.body.addEventListener("mousemove", mouseMove);
      };

      function liuxing() {
        var time = Math.round(Math.random() * 3000 + 33);
        setTimeout(function () {
          rnd = Math.ceil(Math.random() * stars.length);
          liuxing();
        }, time);
      }

      function mouseMove(e) {
        //因为是整屏背景，这里不做坐标转换
        mouseX = e.clientX;
        mouseY = e.clientY;
      }

      function render() {
        context.fillStyle = "rgba(0,0,0,0.1)";
        context.fillRect(0, 0, WINDOW_WIDTH, WINDOW_HEIGHT);
        // context.clearRect(0,0,WINDOW_WIDTH,WINDOW_HEIGHT)
        for (var i = 0; i < num; i++) {
          var star = stars[i];
          if (i == rnd) {
            star.vx = -5;
            star.vy = 20;
            context.beginPath();
            context.strokeStyle = "rgba(255,255,255," + star.alpha + ")";
            context.lineWidth = star.r;
            context.moveTo(star.x, star.y);
            context.lineTo(star.x + star.vx, star.y + star.vy);
            context.stroke();
            context.closePath();
          }
          star.alpha += star.ra;
          if (star.alpha <= 0) {
            star.alpha = 0;
            star.ra = -star.ra;
            star.vx = Math.random() * 0.2 - 0.1;
            star.vy = Math.random() * 0.2 - 0.1;
          } else if (star.alpha > 1) {
            star.alpha = 1;
            star.ra = -star.ra;
          }
          star.x += star.vx;
          if (star.x >= WINDOW_WIDTH) {
            star.x = 0;
          } else if (star.x < 0) {
            star.x = WINDOW_WIDTH;
            star.vx = Math.random() * 0.2 - 0.1;
            star.vy = Math.random() * 0.2 - 0.1;
          }
          star.y += star.vy;
          if (star.y >= WINDOW_HEIGHT) {
            star.y = 0;
            star.vy = Math.random() * 0.2 - 0.1;
            star.vx = Math.random() * 0.2 - 0.1;
          } else if (star.y < 0) {
            star.y = WINDOW_HEIGHT;
          }
          context.beginPath();
          var bg = context.createRadialGradient(
            star.x,
            star.y,
            0,
            star.x,
            star.y,
            star.r
          );
          bg.addColorStop(0, "rgba(255,255,255," + star.alpha + ")");
          bg.addColorStop(1, "rgba(255,255,255,0)");
          context.fillStyle = bg;
          context.arc(star.x, star.y, star.r, 0, Math.PI * 2, true);
          context.fill();
          context.closePath();
        }
      }

      function addStar() {
        for (var i = 0; i < num; i++) {
          var aStar = {
            x: Math.round(Math.random() * WINDOW_WIDTH),
            y: Math.round(Math.random() * WINDOW_HEIGHT),
            r: Math.random() * 3,
            ra: Math.random() * 0.05,
            alpha: Math.random(),
            vx: Math.random() * 0.2 - 0.1,
            vy: Math.random() * 0.2 - 0.1,
          };
          stars.push(aStar);
        }
      }
    </script>
    <!--End-->
    <script src="../js/macstatus/oauth-client-config.js"></script>
    <script src="../js/macstatus/auth.js"></script>
    <script src="../js/request.js"></script>
    <script src="../js/macstatus/log.js"></script>
    <script src="../js/macstatus/macstatus.js?v=" + Date.now()></script>
  </body>
</html>