Home Explore Help
Register Sign In
veterans
/
veterans_demo
9
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

初始

空白格 3 years ago
commit
eb3acdbdcc
17 changed files with 875 additions and 0 deletions
Split View Show Diff Stats
  1. BIN
      images/bg.png
  2. BIN
      images/bg1.png
  3. BIN
      images/bg2.png
  4. BIN
      images/bg3.png
  5. BIN
      images/bg4.png
  6. BIN
      images/code-bg.png
  7. BIN
      images/enterprise-system.png
  8. BIN
      images/integrated-system.png
  9. BIN
      images/mobile-terminal.png
  10. BIN
      images/operation-center.png
  11. BIN
      images/title.png
  12. 82 0
      index.html
  13. 2 0
      js/jquery-3.6.0.min.js
  14. 614 0
      js/qrcode.js
  15. 1 0
      js/qrcode.min.js
  16. 6 0
      styles/bootstrap.min.css
  17. 170 0
      styles/styles.css

BIN
images/bg.png
View File


BIN
images/bg1.png
View File


BIN
images/bg2.png
View File


BIN
images/bg3.png
View File


BIN
images/bg4.png
View File


BIN
images/code-bg.png
View File


BIN
images/enterprise-system.png
View File


BIN
images/integrated-system.png
View File


BIN
images/mobile-terminal.png
View File


BIN
images/operation-center.png
View File


BIN
images/title.png
View File


+ 82 - 0
index.html
View File 

@@ -0,0 +1,82 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />
 
+    <title>退役军人</title>
 
+    <link rel="stylesheet" href="./styles/bootstrap.min.css">
 
+    <link rel="stylesheet" href="./styles/styles.css">
 
+</head>
 
+<body>
 
+<div class="box" id="container">
 
+    <div class="title">
 
+        <img src="./images/title.png" alt="">
 
+    </div>
 
+    <div class="menu">
 
+        <div class="menu-item bg1" onclick="codeClick()">
 
+            <div>
 
+                <div>
 
+                    <img src="./images/mobile-terminal.png" alt="">
 
+                </div>
 
+                <p>退役军人教育培训服务移动系统</p>
 
+            </div>
 
+        </div>
 
+        <div class="menu-item bg2" onclick="menuClick('http://veterreport.hw.hongweisoft.com/#/bigscreen/viewer?reportCode=12323')">
 
+            <div>
 
+                <div>
 
+                    <img src="./images/operation-center.png" alt="">
 
+                </div>
 
+                <p>退役军人职业教育基地运营中心</p>
 
+            </div>
 
+        </div>
 
+        <div class="menu-item bg3" onclick="menuClick('http://veterhcompany.hw.hongweisoft.com/')">
 
+            <div>
 
+                <div>
 
+                    <img src="./images/enterprise-system.png" alt="">
 
+                </div>
 
+                <p>退役军人企业招聘服务管理系统</p>
 
+            </div>
 
+        </div>
 
+        <div class="menu-item bg4" onclick="menuClick('https://veterweb.hw.hongweisoft.com/')">
 
+            <div>
 
+                <div>
 
+                    <img src="./images/integrated-system.png" alt="">
 
+                </div>
 
+                <p>退役军人教育培训服务综合管理系统</p>
 
+            </div>
 
+        </div>
 
+    </div>
 
+    <div class="dialog-box">
 
+        <div class="dialog">
 
+            <div class="dialog-code">
 
+                <span class="dialog-close">关闭</span>
 
+                <p class="dialog-title">退役军人教育培训服务移动端系统</p>
 
+                <div id="qrcode"></div>
 
+                <p class="dialog-tips">手机扫一扫</p>
 
+            </div>
 
+        </div>
 
+    </div>
 
+</div>
 
+<script type="text/javascript" src="js/jquery-3.6.0.min.js"></script>
 
+<script type="text/javascript" src="js/qrcode.min.js"></script>
 
+<script type="text/javascript">
 
+    const qrcode = new QRCode('qrcode', {
 
+        text: 'https://veterh5.hw.hongweisoft.com/#/',
 
+        width: 216,
 
+        height: 216,
 
+        colorDark: '#000000',
 
+        colorLight: '#ffffff',
 
+        correctLevel: QRCode.CorrectLevel.H
 
+    });
 
+    function menuClick(url) {
 
+        window.open(url)
 
+    }
 
+    $('.dialog-close').click(function () {
 
+        $('.dialog-box').hide();
 
+    })
 
+    function codeClick() {
 
+        $('.dialog-box').show();
 
+    }
 
+</script>
 
+</body>
 
+</html>

File diff suppressed because it is too large
+ 2 - 0
js/jquery-3.6.0.min.js


File diff suppressed because it is too large
+ 614 - 0
js/qrcode.js


File diff suppressed because it is too large
+ 1 - 0
js/qrcode.min.js


File diff suppressed because it is too large
+ 6 - 0
styles/bootstrap.min.css


+ 170 - 0
styles/styles.css
View File 

@@ -0,0 +1,170 @@
 
+html {
 
+    width: 100%;
 
+    height: 100%;
 
+    padding: 0;
 
+    margin: 0;
 
+}
 
+body {
 
+    width: 100%;
 
+    height: 100%;
 
+    padding: 0;
 
+    margin: 0;
 
+}
 
+p {
 
+    padding: 0;
 
+    margin: 0;
 
+}
 
+.box {
 
+    width: 100%;
 
+    height: 100%;
 
+    background-image: url("./../images/bg.png");
 
+    background-position: center center;
 
+    background-repeat: no-repeat;
 
+    background-size: cover;
 
+    background-attachment: fixed;
 
+    position: relative;
 
+}
 
+.title {
 
+    width: 100%;
 
+    text-align: center;
 
+    padding-top: 15vh;
 
+}
 
+.title img {
 
+    /*width: 55%;*/
 
+    /*height: 110px;*/
 
+    object-fit: contain;
 
+}
 
+.menu {
 
+    display: flex;
 
+    flex-wrap: wrap;
 
+    justify-content: space-between;
 
+    width: 42%;
 
+    margin: 7vh auto 0;
 
+}
 
+.menu-item {
 
+    width: calc(50% - 1vw);
 
+    min-width: 150px;
 
+    height: 20vh;
 
+    min-height: 150px;
 
+    padding: 0 2vw;
 
+    display: flex;
 
+    justify-content: center;
 
+    align-items: center;
 
+    border-radius: 20px;
 
+    text-align: center;
 
+    margin-bottom: 5vh;
 
+    color: #fff;
 
+    font-size: 18px;
 
+    cursor: pointer;
 
+    background-position: center center;
 
+}
 
+.menu-item p {
 
+    margin-top: 10px;
 
+}
 
+.menu-item:hover {
 
+    opacity: 0.95;
 
+}
 
+.bg1 {
 
+    /*background: linear-gradient(to bottom right, #da8ef3, #8b50dd);*/
 
+    background-image: url('./../images/bg1.png');
 
+    background-size: cover;
 
+}
 
+.bg2 {
 
+    /*background: linear-gradient(to bottom right, #fdc043, #f09030);*/
 
+    background-image: url('./../images/bg2.png');
 
+    background-size: cover;
 
+}
 
+.bg3 {
 
+    /*background: linear-gradient(to bottom right, #47e5bf, #1fadad);*/
 
+    background-image: url('./../images/bg3.png');
 
+    background-size: cover;
 
+}
 
+.bg4 {
 
+    /*background: linear-gradient(to bottom right, #65ccfe, #3095f3);*/
 
+    background-image: url('./../images/bg4.png');
 
+    background-size: cover;
 
+}
 
+.dialog-box {
 
+    display: none;
 
+}
 
+.dialog {
 
+    position: absolute;
 
+    top: 0;
 
+    left: 0;
 
+    width: 100%;
 
+    height: 100%;
 
+    display: flex;
 
+    align-items: center;
 
+    background-color: rgba(0, 0, 0, 0.9);
 
+}
 
+.dialog-code {
 
+    width: 300px;
 
+    border-radius: 5px;
 
+    margin: 0 auto;
 
+    text-align: center;
 
+    padding: 30px;
 
+    background-image: url('./../images/code-bg.png');
 
+    background-position: center center;
 
+    background-size: cover;
 
+    position: relative;
 
+}
 
+.dialog-close {
 
+    color: #fff;
 
+    position: absolute;
 
+    top: -23px;
 
+    right: 0;
 
+    z-index: 300;
 
+    cursor: pointer;
 
+    font-size: 15px;
 
+}
 
+.dialog-close:hover {
 
+    text-decoration: underline;
 
+}
 
+.dialog-title {
 
+    color: #fff;
 
+    font-size: 20px;
 
+    font-weight: 500;
 
+    margin-bottom: 10px;
 
+    padding: 0 11px;
 
+}
 
+.dialog-tips {
 
+    color: #fff;
 
+    font-size: 16px;
 
+    margin-top: 10px;
 
+}
 
+#qrcode {
 
+    display: flex;
 
+    justify-content: center;
 
+    padding: 15px 0;
 
+    background: #fff;
 
+}
 
+@media (max-width: 1500px) and (min-width: 1300px) {
 
+    .menu {
 
+        width: calc(60% - 2vw);
 
+    }
 
+}
 
+@media (max-width: 1300px) and (min-width: 1000px) {
 
+    .menu {
 
+        width: calc(70% - 2vw);
 
+    }
 
+}
 
+@media screen and (max-width: 1000px) {
 
+    html {
 
+        height: auto;
 
+        min-height: 100vh;
 
+    }
 
+    .title {
 
+        padding-top: 7vh;
 
+    }
 
+    .title img {
 
+        width: 90%;
 
+        object-fit: contain;
 
+    }
 
+    .menu {
 
+        width: 80%;
 
+        justify-content: center;
 
+    }
 
+    .menu-item {
 
+        width: 80%;
 
+    }
 
+}