ming 4 år sedan
incheckning
225482ce54
11 ändrade filer med 1121 tillägg och 0 borttagningar
  1. 84 0
      add.html
  2. 444 0
      css/common.css
  3. 293 0
      device-manage.html
  4. BIN
      image/device-icon.png
  5. BIN
      image/nav.png
  6. BIN
      image/plus-icon.png
  7. BIN
      image/right-icon.png
  8. BIN
      image/site-icon.png
  9. 1 0
      js/jquery-2.2.2.min.js
  10. 140 0
      js/layout.js
  11. 159 0
      site-manage.html

+ 84 - 0
add.html

@@ -0,0 +1,84 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=750, initial-scale=1, maximum-scale=1, user-scalable=0" />
+    <meta name="keywords" content="" />
+    <meta name="description" content="" />
+    <title>新增</title>
+    <!-- FAVICON AND APPLE TOUCH -->
+    <link href="favicon.ico" rel="shortcut icon" />
+    <link rel="apple-touch-icon-precomposed" sizes="180x180" />
+    <meta name="msapplication-TileImage" content="mstile.png" />
+    <link rel="stylesheet" href="css/common.css" />
+    <meta name="viewport" content="width=375, user-scalable=no" />
+</head>
+
+<body>
+    <div class="page-wrapper">
+        <form action="">
+            <div>
+                <span><i>*</i>站点名称:</span>
+                <input type="text" name="siteName">
+            </div>
+            <div>
+                <span><i>*</i>站点位置:</span>
+                <input type="text" name="siteplace">
+            </div>
+            <div>
+                <span><i>*</i>站点地址:</span>
+                <input type="text" name="siteAddress">
+            </div>
+            <div>
+                <span><i>*</i>联系人:</span>
+                <input type="text" name="contactMan">
+            </div>
+            <div>
+                <span><i>*</i>手机号码:</span>
+                <input type="text" name="mobile">
+            </div>
+            <a class="submit-btn">提交</a>
+
+        </form>
+    </div>
+    <script src="js/layout.js"></script>
+    <script src="js/jquery-2.2.2.min.js"></script>
+    <script>
+        $('.submit-btn').click(function() {
+            if ($('input[name=siteName]').val().length == 0) {
+                alert('请输入站点名称')
+                return false;
+            }
+            if ($('input[name=siteplace]').val().length == 0) {
+                alert('请输入站点位置')
+                return false;
+            }
+            if ($('input[name=siteAddress]').val().length == 0) {
+                alert('请输入站点地址')
+                return false;
+            }
+            if ($('input[name=contactMan]').val().length == 0) {
+                alert('请输入联系人')
+                return false;
+            }
+
+            var mobile = $('input[name=mobile]').val();
+            if (mobile.length == 0) {
+
+                alert('请填写手机号码');
+                return false;
+            } else {
+                var telre = /^(13[0-9]|14[0-9]|15[0-9]|17[0-9]|18[0-9])\d{8}$/;
+                if (!telre.test(mobile)) {
+                    alert('请输入有效的手机号码');
+                    return false;
+                }
+
+            }
+        })
+    </script>
+</body>
+
+</html>

+ 444 - 0
css/common.css

@@ -0,0 +1,444 @@
+@charset "utf-8";
+* {
+    margin: 0;
+    padding: 0;
+    /* max-height: 999999px; */
+}
+
+html {
+    -webkit-overflow-scrolling: touch;
+    /*//允许独立的滚动区域和触摸回弹*/
+}
+
+body,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+p,
+blockquote,
+dl,
+dt,
+dd,
+ul,
+ol,
+li,
+pre,
+form,
+fieldset,
+legend,
+button,
+input,
+textarea,
+th,
+td {
+    margin: 0;
+    padding: 0;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    font-weight: normal;
+}
+
+body,
+button,
+input,
+select,
+textarea {
+    font: 28px Source Han Sans CN, PingFang SC, Helvetica, Arial, Microsoft YaHei, FreeSans, Arimo, Droid Sans, wenquanyi micro hei, Hiragino Sans GB, Hiragino Sans GB W3, sans-serif
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    font-size: 100%;
+}
+
+address,
+cite,
+dfn,
+em,
+var {
+    font-style: normal;
+}
+
+code,
+kbd,
+pre,
+samp {
+    font-family: courier new, courier, monospace;
+}
+
+small {
+    font-size: 12px;
+}
+
+ul,
+ol {
+    list-style: none;
+}
+
+i,
+em {
+    font-style: normal;
+}
+
+a {
+    text-decoration: none;
+    /* color: #fff; */
+}
+
+sup {
+    vertical-align: text-top;
+}
+
+sub {
+    vertical-align: text-bottom;
+}
+
+legend {
+    color: #000;
+}
+
+fieldset,
+img {
+    border: 0;
+    max-width: 100%;
+}
+
+button,
+input,
+select,
+textarea {
+    font-size: 100%;
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+}
+
+.clear {
+    clear: both;
+    float: none;
+    height: 0;
+    overflow: hidden;
+}
+
+html .hide {
+    display: none;
+}
+
+
+/* 去除苹果默认input样式 */
+
+input[type="button"],
+input[type="submit"],
+input[type="reset"],
+textarea {
+    -webkit-appearance: none;
+    border: none;
+    /*-moz-appearance: none;
+outline:none;*/
+    background: rgba(0, 0, 0, 0);
+}
+
+
+/*input[type="submit"]{
+      -webkit-appearance: button;
+}*/
+
+
+/* 去除谷歌焦点样式 */
+
+input:focus,
+textarea:focus {
+    outline: none;
+}
+
+
+/* 去除IE10+浏览器文本框后面的小叉叉 */
+
+input::-ms-clear {
+    display: none;
+}
+
+
+/* 禁止多行文本框textarea拖拽 */
+
+textarea {
+    resize: none;
+}
+
+
+/* 去除android用户点击链接,出现边框或者半透明灰色遮罩 */
+
+a,
+button,
+input,
+textarea {
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+    -webkit-user-modify: read-only;
+    /* 只能读 */
+    -moz-user-modify: read-only;
+    user-modify: read-only;
+}
+
+*:not(input) {
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+
+.onlineColor {
+    color: #08BE04
+}
+
+.offlineColor {
+    color: #666666
+}
+
+.hitchColor {
+    color: #FF6523
+}
+
+input::-webkit-input-placeholder {
+    color: #999;
+}
+
+input::-moz-placeholder {
+    /* Mozilla Firefox 19+ */
+    color: #999;
+}
+
+input:-moz-placeholder {
+    /* Mozilla Firefox 4 to 18 */
+    color: #999;
+}
+
+input:-ms-input-placeholder {
+    /* Internet Explorer 10-11 */
+    color: #999;
+}
+
+
+/*add*/
+
+body {
+    font-size: 16px;
+}
+
+.device-list {
+    margin-top: 66px;
+    margin-bottom: 100px;
+}
+
+.device-item {
+    padding: 10px 10px 10px 0;
+    display: flex;
+    align-items: center;
+    margin-left: 10px;
+    border-bottom: 1px solid #EDEDED;
+    position: relative
+}
+
+.checkBox {
+    width: 8%;
+    text-align: center
+}
+
+.iconBox {
+    width: 15%;
+    text-align: center
+}
+
+.iconBox img {
+    width: 45px
+}
+
+.desBox {
+    width: 60%;
+    padding: 0 10px;
+    font-size: 14px;
+    color: #666;
+}
+
+.desBox p:nth-child(2) {
+    margin: 3px 0;
+}
+
+.device-tit {
+    font-size: 16px;
+    color: #333;
+}
+
+.statusBox {
+    width: 15%;
+    text-align: center
+}
+
+.arrowRight {
+    width: 5%;
+    text-align: center
+}
+
+.arrowRight img {
+    width: 6px
+}
+
+
+/* 长摁弹框 */
+
+.operate-box {
+    display: none;
+    position: absolute;
+    bottom: -10px;
+    left: 70px;
+    background: #fff;
+    box-shadow: 0 1px 6px 0 rgb(32 33 36 / 28%);
+}
+
+.operate-box li {
+    padding: 5px 10px;
+    color: #333
+}
+
+.operate-box li:first-child {
+    border-bottom: 1px solid #EDEDED
+}
+
+
+/* 筛选 */
+
+.filterSection {
+    padding: 15px 12px;
+    background: #f1f1f1;
+    position: fixed;
+    top: 0;
+    width: 100%;
+    z-index: 9
+}
+
+input {
+    -webkit-appearance: none;
+}
+
+.filterSection input {
+    line-height: 35px;
+    width: 70%;
+    border-radius: 18px;
+    text-indent: 15px;
+    border: 0px solid #aaa;
+    background: #fff;
+    font-size: 14px;
+    color: #999
+}
+
+.search {
+    border-radius: 18px;
+    line-height: 35px;
+    width: 23%;
+    background: #4074E7;
+    color: #fff;
+    display: inline-block;
+    text-align: center;
+    margin-left: 5px;
+}
+
+
+/* plus */
+
+.plus {
+    width: 60px;
+    position: fixed;
+    bottom: 7px;
+    right: 7px;
+}
+
+.plus :hover {
+    opacity: .7
+}
+
+
+/* 无查询结果 */
+
+.noResult {
+    height: 100px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #999;
+    display: none;
+}
+
+
+/* 站点列表 */
+
+.navRight {
+    width: 18%;
+    text-align: right
+}
+
+.navRight img {
+    width: 14px
+}
+
+
+/* 新增页面 */
+
+form {
+    padding: 15px 12px;
+}
+
+form>div {
+    margin-bottom: 12px;
+}
+
+form span {
+    font-size: 16px;
+    color: #333;
+    width: 24%;
+    display: inline-block;
+    text-align: left;
+    position: relative;
+    padding-left: 5px
+}
+
+form span i {
+    color: #FF0303;
+    position: relative;
+    left: -5px;
+}
+
+form input {
+    width: 66%;
+    line-height: 35px;
+    border: 1px solid #EDEDED;
+    padding: 0 10px;
+    color: #999;
+}
+
+a.submit-btn {
+    background: #4074e7;
+    border-radius: 40px;
+    width: 100%;
+    color: #fff;
+    display: inline-block;
+    line-height: 40px;
+    text-align: center;
+    margin: 20px 0
+}

+ 293 - 0
device-manage.html

@@ -0,0 +1,293 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=750, initial-scale=1, maximum-scale=1, user-scalable=0" />
+    <meta name="keywords" content="" />
+    <meta name="description" content="" />
+    <title>设备管理</title>
+    <!-- FAVICON AND APPLE TOUCH -->
+    <link href="favicon.ico" rel="shortcut icon" />
+    <link rel="apple-touch-icon-precomposed" sizes="180x180" />
+    <meta name="msapplication-TileImage" content="mstile.png" />
+    <link rel="stylesheet" href="css/common.css" />
+    <meta name="viewport" content="width=375, user-scalable=no" />
+</head>
+
+<body>
+    <div class="page-wrapper">
+
+        <div class="filterSection">
+            <input type="text" placeholder="请选择传输方式">
+            <span class="search">查询</span>
+
+        </div>
+
+        <div class="device-list parent">
+            <div class="noResult">
+                <p>暂无查询结果...</p>
+            </div>
+            <p class="refreshText"></p>
+            <ul id="content-box">
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/device-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试用传装置</p>
+                        <p>三楼茶水间</p>
+                        <p>2020-01-08 15:15:08</p>
+                    </div>
+                    <div class="statusBox onlineColor">在线</div>
+                    <div class="arrowRight"><img src="image/right-icon.png" alt="" w></div>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/device-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试用传装置</p>
+                        <p>三楼茶水间</p>
+                        <p>2020-01-08 15:15:08</p>
+                    </div>
+                    <div class="statusBox offlineColor">离线</div>
+                    <div class="arrowRight"><img src="image/right-icon.png" alt=""></div>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+
+
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/device-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试用传装置</p>
+                        <p>三楼茶水间</p>
+                        <p>2020-01-08 15:15:08</p>
+                    </div>
+                    <div class="statusBox hitchColor">故障</div>
+                    <div class="arrowRight"><img src="image/right-icon.png" alt=""></div>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/device-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试用传装置</p>
+                        <p>三楼茶水间</p>
+                        <p>2020-01-08 15:15:08</p>
+                    </div>
+                    <div class="statusBox hitchColor">故障</div>
+                    <div class="arrowRight"><img src="image/right-icon.png" alt=""></div>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/device-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试用传装置</p>
+                        <p>三楼茶水间</p>
+                        <p>2020-01-08 15:15:08</p>
+                    </div>
+                    <div class="statusBox hitchColor">故障</div>
+                    <div class="arrowRight"><img src="image/right-icon.png" alt=""></div>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/device-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试用传装置</p>
+                        <p>三楼茶水间</p>
+                        <p>2020-01-08 15:15:08</p>
+                    </div>
+                    <div class="statusBox hitchColor">故障</div>
+                    <div class="arrowRight"><img src="image/right-icon.png" alt=""></div>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/device-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试用传装置</p>
+                        <p>三楼茶水间</p>
+                        <p>2020-01-08 15:15:08</p>
+                    </div>
+                    <div class="statusBox hitchColor">故障</div>
+                    <div class="arrowRight"><img src="image/right-icon.png" alt=""></div>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/device-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试用传装置</p>
+                        <p>三楼茶水间</p>
+                        <p>2020-01-08 15:15:08</p>
+                    </div>
+                    <div class="statusBox hitchColor">故障</div>
+                    <div class="arrowRight"><img src="image/right-icon.png" alt=""></div>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/device-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试用传装置</p>
+                        <p>三楼茶水间</p>
+                        <p>2020-01-08 15:15:08</p>
+                    </div>
+                    <div class="statusBox hitchColor">故障</div>
+                    <div class="arrowRight"><img src="image/right-icon.png" alt=""></div>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/device-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试用传装置</p>
+                        <p>三楼茶水间</p>
+                        <p>2020-01-08 15:15:08</p>
+                    </div>
+                    <div class="statusBox hitchColor">故障</div>
+                    <div class="arrowRight"><img src="image/right-icon.png" alt=""></div>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/device-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试用传装置</p>
+                        <p>三楼茶水间</p>
+                        <p>2020-01-08 15:15:08</p>
+                    </div>
+                    <div class="statusBox hitchColor">故障</div>
+                    <div class="arrowRight"><img src="image/right-icon.png" alt=""></div>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+
+            </ul>
+            <a href="add.html"><img class="plus" src="image/plus-icon.png" alt=""></a>
+        </div>
+
+    </div>
+
+    <script src="js/layout.js"></script>
+    <script src="js/jquery-2.2.2.min.js"></script>
+    <script>
+        // 手机长按事件
+        var timeOutEvent = 0;
+        var _this;
+        $(function() {
+            $(".desBox").on({
+                touchstart: function(e) {
+                    _this = $(this)
+                    timeOutEvent = setTimeout("longPress()", 500);
+                    //e.preventDefault();
+
+
+                },
+                touchmove: function() {
+                    clearTimeout(timeOutEvent);
+                    timeOutEvent = 0;
+                    //document.removeEventListener('touchstart', this.preventDefault, false);
+                },
+                touchend: function() {
+                    clearTimeout(timeOutEvent);
+                    if (timeOutEvent != 0) {
+                        // alert("你这是点击,不是长按");
+                    }
+                    return false;
+                }
+            })
+        });
+
+        function longPress() {
+            timeOutEvent = 0;
+            // alert("长按事件触发发");
+            _this.parent().find('.operate-box').show().parent().siblings().find('.operate-box').hide();
+
+
+        }
+
+        //点击修改页面跳转
+        $(".device-item").on("touchend", ".opera-edit", function() {
+            // alert("子元素点击");
+            window.location.href = "add.html";
+        })
+        $(".device-item").on("touchend", ".opera-delete", function() {
+            // alert("子元素点击");
+            $(this).parent().parent().parent().remove();
+        })
+
+        // 点击除按钮和弹框之外任意地方隐藏表情
+        $("body").click(function(e) {
+            if ($('.operate-box').is(':visible')) {
+                if (!$(e.target).closest(".operate-box").length) {
+                    // alert(1);
+                    $(".operate-box").hide();
+                }
+            }
+
+
+
+        });
+    </script>
+
+
+</body>
+
+</html>

BIN
image/device-icon.png


BIN
image/nav.png


BIN
image/plus-icon.png


BIN
image/right-icon.png


BIN
image/site-icon.png


Filskillnaden har hållts tillbaka eftersom den är för stor
+ 1 - 0
js/jquery-2.2.2.min.js


+ 140 - 0
js/layout.js

@@ -0,0 +1,140 @@
+var adaptUILayout = (function() {
+    //根据校正appVersion或userAgent校正屏幕分辨率宽度值
+    var regulateScreen = (function() {
+        var cache = {};
+        //默认尺寸
+        var defSize = {
+            width: window.screen.width,
+            height: window.screen.height
+        };
+        var ver = window.navigator.appVersion;
+        var _ = null;
+        var check = function(key) {
+            return key.constructor == String ? ver.indexOf(key) > -1 : ver.test(key);
+        };
+
+        var add = function(name, key, size) {
+            if (name && key)
+                cache[name] = {
+                    key: key,
+                    size: size
+                };
+        };
+
+        var del = function(name) {
+            if (cache[name])
+                delete cache[name];
+        };
+
+        var cal = function() {
+            if (_ != null)
+                return _;
+            for (var name in cache) {
+                if (check(cache[name].key)) {
+                    _ = cache[name].size;
+                    break;
+                }
+            }
+            if (_ == null)
+                _ = defSize;
+            return _;
+        };
+
+        return {
+            add: add,
+            del: del,
+            cal: cal
+        };
+    })();
+
+    //实现缩放
+    var adapt = function(uiWidth) {
+        var
+            deviceWidth,
+            devicePixelRatio,
+            targetDensitydpi,
+            //meta,
+            initialContent,
+            head,
+            viewport,
+            ua;
+
+        ua = navigator.userAgent.toLowerCase();
+        //whether it is the iPhone or iPad
+        isiOS = ua.indexOf('ipad') > -1 || ua.indexOf('iphone') > -1;
+
+        //获取设备信息,并矫正参数值
+        devicePixelRatio = window.devicePixelRatio;
+        deviceWidth = regulateScreen.cal().width;
+
+        //获取最终dpi
+        targetDensitydpi = uiWidth / deviceWidth * devicePixelRatio * 160;
+
+        //use viewport width attribute on the iPhone or iPad device
+        //use viewport target-densitydpi attribute on the Android device
+        initialContent = isiOS ?
+            'width=' + uiWidth + ', user-scalable=no' :
+            'target-densitydpi=' + targetDensitydpi + ', width=' + uiWidth + ', user-scalable=no';
+
+        //add a new meta node of viewport in head node
+        head = document.getElementsByTagName('head');
+        viewport = document.createElement('meta');
+        viewport.name = 'viewport';
+        viewport.content = initialContent;
+        head.length > 0 && head[head.length - 1].appendChild(viewport);
+    };
+    return {
+        regulateScreen: regulateScreen,
+        adapt: adapt
+    };
+})();
+/*
+ *375为当期页面指定的统一分辨率,其他分辨率下均为此分辨率的放缩变化
+ */
+adaptUILayout.adapt(375);
+
+
+//rem初始化代码
+
+/*function adapt(designWidth, rem2px){
+  var d = window.document.createElement('div');
+  d.style.width = '1rem';
+  d.style.display = "none";
+  var head = window.document.getElementsByTagName('head')[0];
+  head.appendChild(d);
+  var defaultFontSize = parseFloat(window.getComputedStyle(d, null).getPropertyValue('width'));
+  d.remove();
+  document.documentElement.style.fontSize = window.innerWidth / designWidth * rem2px / defaultFontSize * 100 + '%';
+  var st = document.createElement('style');
+  var portrait = "@media screen and (min-width: "+window.innerWidth+"px) {html{font-size:"+ ((window.innerWidth/(designWidth/rem2px)/defaultFontSize)*100) +"%;}}";
+  var landscape = "@media screen and (min-width: "+window.innerHeight+"px) {html{font-size:"+ ((window.innerHeight/(designWidth/rem2px)/defaultFontSize)*100) +"%;}}"
+  st.innerHTML = portrait + landscape;
+  head.appendChild(st);
+  return defaultFontSize
+};
+var defaultFontSize = adapt(640, 100);
+*/
+
+//H5翻转屏幕事件
+/*function orientationChange() {
+    switch(window.orientation) {
+      case 0:
+            alert("肖像模式 0,screen-width: " + screen.width + "; screen-height:" + screen.height);
+            break;
+      case -90:
+            alert("左旋 -90,screen-width: " + screen.width + "; screen-height:" + screen.height);
+            break;
+      case 90:   
+            alert("右旋 90,screen-width: " + screen.width + "; screen-height:" + screen.height);
+            break;
+      case 180:
+          alert("风景模式 180,screen-width: " + screen.width + "; screen-height:" + screen.height);
+          break;
+    };
+};
+// 添加事件监听
+addEventListener('load', function(){
+    orientationChange();
+    window.onorientationchange = orientationChange;
+});
+*/

+ 159 - 0
site-manage.html

@@ -0,0 +1,159 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=750, initial-scale=1, maximum-scale=1, user-scalable=0" />
+    <meta name="keywords" content="" />
+    <meta name="description" content="" />
+    <title>站点管理</title>
+    <!-- FAVICON AND APPLE TOUCH -->
+    <link href="favicon.ico" rel="shortcut icon" />
+    <link rel="apple-touch-icon-precomposed" sizes="180x180" />
+    <meta name="msapplication-TileImage" content="mstile.png" />
+    <link rel="stylesheet" href="css/common.css" />
+    <meta name="viewport" content="width=375, user-scalable=no" />
+</head>
+
+<body>
+    <div class="page-wrapper">
+
+        <div class="filterSection">
+            <input type="text" placeholder="请选择传输方式">
+            <span class="search">查询</span>
+
+        </div>
+        <div class="device-list">
+            <div class="noResult">
+                <p>暂无查询结果...</p>
+            </div>
+            <ul>
+
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/site-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试站点一</p>
+                    </div>
+                    <a href="detail.html" class="navRight"><img src="image/nav.png" alt="" width="14px"></a>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/site-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试站点二</p>
+                    </div>
+                    <a href="detail.html" class="navRight"><img src="image/nav.png" alt="" width="14px"></a>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/site-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试站点三</p>
+                    </div>
+                    <a href="detail.html" class="navRight"><img src="image/nav.png" alt="" width="14px"></a>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/site-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试站点四</p>
+                    </div>
+                    <a href="detail.html" class="navRight"><img src="image/nav.png" alt="" width="14px"></a>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+                <li class="device-item">
+                    <div class="iconBox"><img src="image/site-icon.png" alt=""></div>
+                    <div class="desBox">
+                        <p class="device-tit">测试站点五</p>
+                    </div>
+                    <a href="detail.html" class="navRight"><img src="image/nav.png" alt="" width="14px"></a>
+                    <div class="operate-box">
+                        <ul>
+                            <li class="opera-edit" οnclick="javascrtpt:window.location.href='add.html'">修改设备 </li>
+                            <li class="opera-delete">删除设备</li>
+                        </ul>
+                    </div>
+                </li>
+
+
+            </ul>
+            <a href="add.html"><img class="plus" src="image/plus-icon.png" alt=""></a>
+        </div>
+
+    </div>
+
+    <script src="js/layout.js"></script>
+    <script src="js/jquery-2.2.2.min.js"></script>
+    <script>
+        // 手机长按事件
+        var timeOutEvent = 0;
+        var _this;
+        $(function() {
+            $(".desBox").on({
+                touchstart: function(e) {
+                    _this = $(this)
+                    timeOutEvent = setTimeout("longPress()", 500);
+                    // e.preventDefault();
+                },
+                touchmove: function() {
+                    clearTimeout(timeOutEvent);
+                    timeOutEvent = 0;
+                },
+                touchend: function() {
+                    clearTimeout(timeOutEvent);
+                    if (timeOutEvent != 0) {
+                        // alert("你这是点击,不是长按");
+                    }
+                    return false;
+                }
+            })
+        });
+
+        function longPress() {
+            timeOutEvent = 0;
+            // alert("长按事件触发发");
+            _this.parent().find('.operate-box').show().parent().siblings().find('.operate-box').hide()
+
+        }
+
+        //点击修改页面跳转
+        $(".device-item").on("touchend", ".opera-edit", function() {
+            // alert("子元素点击");
+            window.location.href = "add.html";
+        })
+        $(".device-item").on("touchend", ".opera-delete", function() {
+            // alert("子元素点击");
+            $(this).parent().parent().parent().remove();
+        })
+
+        // 点击除按钮和弹框之外任意地方隐藏表情
+        $("body").click(function(e) {
+            if (!$(e.target).closest(".operate-box").length) {
+                $(".operate-box").hide();
+            }
+        });
+    </script>
+</body>
+
+</html>

Vissa filer visades inte eftersom för många filer har ändrats