初始化提交

2024-06-14 10:15:13 +08:00 · 2024-06-14 10:15:13 +08:00 · c907c7af29
commit c907c7af29
12 changed files with 223 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,24 @@
+.DS_Store
+node_modules/
+dist/
+.history/
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+**/*.log
+
+tests/**/coverage/
+tests/e2e/reports
+selenium-debug.log
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.local
+
+package-lock.json
+yarn.lock
--- a/img/BG.jpg
+++ b/img/BG.jpg
--- a/img/GIS.png
+++ b/img/GIS.png
--- a/img/Inspection.png
+++ b/img/Inspection.png
--- a/img/SCADA.png
+++ b/img/SCADA.png
--- a/img/exam.png
+++ b/img/exam.png
--- a/img/gasBottle.png
+++ b/img/gasBottle.png
--- a/img/header-title.png
+++ b/img/header-title.png
--- a/img/icon-center.png
+++ b/img/icon-center.png
--- a/img/line.png
+++ b/img/line.png
--- a/img/manage-center.png
+++ b/img/manage-center.png
--- a/index.html
+++ b/index.html
@ -0,0 +1,199 @@
+<!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">
+    <link rel="icon" href="http://manage.gkyun.net/iconlogo.ico">
+    <title>数字燃气综合管理系统</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+        }
+
+        .container {
+            width: 100vw;
+            height: 100vh;
+            background: #171a3e;
+        }
+
+        .box {
+            position: fixed;
+            width: 1920px;
+            height: 1080px;
+            /*background: red;*/
+            background: url(./img/BG.jpg) no-repeat;
+            background-size: cover;
+            transform-origin: left top;
+            left: 50%;
+            top: 50%;
+        }
+        .header-box{
+            height: 100px;
+            text-align: center;
+            line-height: 70px;
+            font-family: Source Han Sans CN;
+            font-weight: bold;
+            font-size: 40px;
+            color: #FFFFFF;
+            text-shadow: 0px 1px 0px rgba(0,22,37,0.72), 0px 5px 0px rgba(0,51,95,0.39);
+            background: url(./img/header-title.png) no-repeat;
+            -webkit-user-select: none; /* Chrome, Safari, Opera */
+            -moz-user-select: none; /* Firefox */
+            -ms-user-select: none; /* Internet Explorer/Edge */
+            user-select: none;
+        }
+        /*.header-box-title{*/
+        /*    background: linear-gradient(0deg, rgba(0,179,255,0.5) 0%, rgba(255,255,255,0.5) 50.2685546875%, rgba(255,255,255,0.5) 83.7890625%, rgba(0,179,255,0.5) 100%);*/
+        /*}*/
+        .main-box{
+            /*margin: 166px auto 0;*/
+            width: 1028px;
+            height: 547px;
+            background: url(./img/line.png) no-repeat;
+            position: relative;
+            left: 388px;
+            top: 166px;
+        }
+        .main-box .center{
+            width: 378px;
+            height: 470px;
+            position: absolute;
+            top: 10px;
+            left: 368px;
+            background: url(./img/icon-center.png) no-repeat;
+            background-size: 100% 100%;
+        }
+        .main-box .nav-item{
+            width: 200px;
+            height: 280px;
+            position: absolute;
+            display: flex;
+            justify-content: center;
+            align-items: end;
+            font-family: Source Han Sans CN;
+            font-weight: 500;
+            font-size: 24px;
+            color: #FFFFFF;
+            line-height: 80px;
+            -webkit-user-select: none; /* Chrome, Safari, Opera */
+            -moz-user-select: none; /* Firefox */
+            -ms-user-select: none; /* Internet Explorer/Edge */
+            user-select: none;
+            cursor: pointer;
+        }
+        .left-top{
+            background: url(./img/Inspection.png) no-repeat;
+            top: -84px;
+            left: 36px;
+        }
+        .left-center{
+            background: url(./img/GIS.png) no-repeat;
+            top: 121px;
+            left: -145px;
+        }
+        .left-bottom{
+            background: url(./img/SCADA.png) no-repeat;
+            bottom: -64px;
+            left: 58px;
+        }
+        .center-bottom{
+            background: url(./img/manage-center.png) no-repeat;
+            bottom: -127px;
+            left: 481px;
+        }
+        .right-bottom{
+            background: url(./img/gasBottle.png) no-repeat;
+            bottom: -13px;
+            right: -72px;
+        }
+        .right-center{
+            background: url(./img/exam.png) no-repeat;
+            top: 29px;
+            right: -147px;
+        }
+        .top {
+            width: 100px;
+            height: 100px;
+            background: hotpink;
+            margin-left: 50px;
+        }
+
+        .bottom {
+            width: 100px;
+            height: 100px;
+            background: skyblue;
+            margin-left: 50px;
+            margin-top: 100px;
+        }
+    </style>
+</head>
+
+<body>
+<div class="container">
+    <!-- 数据展示的区域 -->
+    <div class="box">
+        <div class="header-box">
+<!--            <span class="header-box-title">-->
+                数字燃气综合管理系统
+<!--            </span>-->
+        </div>
+        <div class="main-box">
+            <div class="center"></div>
+            <div class="nav-item left-top">智慧巡检</div>
+            <div class="nav-item left-center">GIS系统</div>
+            <div class="nav-item left-bottom">SCADA系统</div>
+            <div class="nav-item center-bottom">管理中心</div>
+            <div class="nav-item right-bottom">气瓶管理</div>
+            <div class="nav-item right-center">培训考试</div>
+        </div>
+    </div>
+</div>
+</body>
+
+</html>
+<script>
+    //控制数据大屏放大与缩小
+    let box = document.querySelector('.box');
+    box.style.transform = `scale(${getScale()}) translate(-50%,-50%)`
+    //计算缩放的比例啦
+    function getScale(w = 1920, h = 1080) {
+        const ww = window.innerWidth / w;
+        const wh = window.innerHeight / h;
+        return ww < wh ? ww : wh;
+        //ww<wh情况: 1920/1920(ww)   1080/1080(wh)
+        //ww>wh情况:1920/1920(ww)   1080/1080(wh)
+    }
+
+    window.onresize = () => {
+        box.style.transform = `scale(${getScale()}) translate(-50%,-50%)`
+    }
+    let navItem = document.querySelectorAll('.nav-item');
+    // 管理中心: http://manage.gkyun.net/
+    //     GIS系统: https://manage.fdanrangas.com/gis-system
+    //         智慧巡检: http://manage.gkyun.net/inspection
+    //             SCADA:http://iotui.gkyun.net
+    //                 气瓶管理:http://nxsz.ts-tac.cn/samr
+    //                     培训考试:http://pxks.histron.cn:18080/
+    navItem.forEach(item => {
+        item.onclick = () => {
+            if (item.innerHTML === '智慧巡检'){
+                window.open('http://manage.gkyun.net/inspection');
+            }else if (item.innerHTML === 'GIS系统'){
+                window.open('https://manage.fdanrangas.com/gis-system');
+            }else if (item.innerHTML === 'SCADA系统'){
+                window.open('http://iotui.gkyun.net');
+            }else if (item.innerHTML === '管理中心'){
+                window.open('http://manage.gkyun.net/');
+            }else if (item.innerHTML === '气瓶管理'){
+                window.open('https://fjsmv3.gas-tac.cn/#/bottledLiquefaction/enterpriseStation');
+            }else if (item.innerHTML === '培训考试'){
+                window.open('http://pxks.histron.cn:18080/');
+            }
+            console.log(item.innerHTML);
+        }
+    })
+
+</script>