From bbf8992414df6cd3e4ad64a9dfb2fdb6c5a0e2c8 Mon Sep 17 00:00:00 2001
From: star0527 <5506631@qq.com>
Date: 星期四, 20 七月 2023 09:35:48 +0800
Subject: [PATCH] 修改移动端样式

---
 mobile/road_show.html         |    2 
 mobile/img/cars_active.png    |    0 
 mobile/index.html             |   97 ----
 mobile/data.html              |   82 ++++
 mobile/img/data.png           |    0 
 mobile/road.html              |  135 +-----
 mobile/img/login_bg_old.png   |    0 
 mobile/img/data_active.png    |    0 
 mobile/css/style.css          |  768 ++++++++++++++++++++++++++++++++++++++
 mobile/img/monitor.png        |    0 
 mobile/img/login_bg.png       |    0 
 mobile/img/cars.png           |    0 
 mobile/road_search.html       |    4 
 mobile/img/monitor_active.png |    0 
 mobile/cars.html              |   56 ++
 15 files changed, 942 insertions(+), 202 deletions(-)

diff --git a/mobile/cars.html b/mobile/cars.html
new file mode 100644
index 0000000..d89bdc5
--- /dev/null
+++ b/mobile/cars.html
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html class="no-js css-menubar" lang="zh-cn">
+
+<head>
+    <title>涓婃捣甯傞亾璺氦閫氱幆澧冪洃娴嬪钩鍙�</title>
+    <meta charset="utf-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+    <!-- 绉诲姩璁惧 viewport -->
+    <meta name="viewport"
+        content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui" />
+    <meta name="author" content="涓婃捣甯傞亾璺氦閫氱幆澧冪洃娴嬪钩鍙�" />
+    <!-- 360娴忚鍣ㄩ粯璁や娇鐢╓ebkit鍐呮牳 -->
+    <meta name="renderer" content="webkit" />
+    <!-- Chrome娴忚鍣ㄦ坊鍔犳闈㈠揩鎹锋柟寮忥紙瀹夊崜锛� -->
+    <link rel="icon" type="image/png" href="img/favicon/favicon.png" />
+    <meta name="mobile-web-app-capable" content="yes" />
+    <!-- Safari娴忚鍣ㄦ坊鍔犲埌涓诲睆骞曪紙IOS锛� -->
+    <link rel="icon" sizes="192x192" href="img/favicon/apple-touch-icon.png" />
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
+    <meta name="apple-mobile-web-app-title" content="MarsGIS" />
+
+    <!--绗笁鏂筶ib-->
+    <script type="text/javascript" src="../lib/include-lib.js?time=20210803" libpath="../lib/"
+        include="jquery"></script>
+    <link href="css/style.css" rel="stylesheet" />
+
+</head>
+
+<body>
+    <div class="page">
+        <div class="header">
+            <div class="title">杞﹁締鏄剧ず</div>
+        </div>
+
+        <div class="main">
+            aa
+        </div>
+
+        <div class="footbar">
+            <ul>
+                <li>
+                    <a href="cars.html" class="active"><img src="img/cars_active.png"><span>杞﹁締鏄剧ず</span></a>
+                </li>
+                <li>
+                    <a href="road.html"><img src="img/monitor.png"><span>鐩戞帶鎬昏</span></a>
+                </li>
+                <li>
+                    <a href="data.html"><img src="img/data.png"><span>鏁版嵁鎬昏</span></a>
+                </li>
+            </ul>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/mobile/css/style.css b/mobile/css/style.css
new file mode 100644
index 0000000..0edc29f
--- /dev/null
+++ b/mobile/css/style.css
@@ -0,0 +1,768 @@
+/*
+* index椤甸潰css
+*/
+* {
+  margin: 0;
+  padding: 0;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+*:before,
+*:after {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+html,
+body {
+  height: 100%;
+  width: 100%;
+  margin: 0;
+  padding: 0;
+  border: none;
+  overflow: hidden;
+  font-family: "Helvetica Neue", Helvetica, Tahoma, Arial, "Microsoft Yahei", "Hiragino Sans GB", "WenQuanYi Micro Hei", sans-serif;
+  font-size: 14px;
+  background: #000;
+  -webkit-overflow-scrolling: touch;
+}
+
+body {
+  position: relative;
+  overflow-x: hidden;
+  overflow-y: hidden;
+}
+
+input,
+button,
+select,
+textarea {
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+}
+
+a {
+  color: #62a8ea;
+  text-decoration: none;
+}
+
+a:hover,
+a:focus {
+  color: #89bceb;
+  text-decoration: underline;
+}
+
+a:focus {
+  outline: thin dotted;
+  outline: 5px auto -webkit-focus-ring-color;
+  outline: none;
+  outline-offset: -2px;
+}
+
+ul,
+li {
+  list-style: none;
+}
+
+#centerDiv {
+  height: 100%;
+  width: 100%;
+  margin: 0;
+  padding: 0;
+  left: 0;
+  top: 0;
+  border: none;
+  overflow: hidden;
+  position: relative;
+}
+
+.signmask {
+  height: 100%;
+  width: 100%;
+  background: rgba(0, 0, 0, 0.5);
+  filter: alpha(opacity=50);
+  position: fixed;
+  display: block;
+  z-index: 20180910;
+  top: 0;
+  left: 0;
+  background: rgba(0, 0, 0, 0.5) url("../img/icon-operate.png") center no-repeat;
+}
+
+/*dark鏍峰紡*/
+.dark {
+  color: #ffffff;
+}
+
+.dark a {
+  color: #ffffff;
+  text-decoration: none;
+  margin-top: 1px;
+  margin-right: 2px;
+}
+
+.dark a:hover {
+  color: #cc3300;
+  text-decoration: underline;
+}
+
+.dark .content {
+  overflow: auto;
+  position: relative;
+  background: transparent;
+  height: 400px;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+.dark .form-control,
+.dark .input-group-addon,
+.dark .btn-default,
+.dark .dropdown-menu {
+  color: #ffffff;
+  background-color: rgba(63, 72, 84, 0.7);
+  border: none;
+}
+
+.dark input {
+  color: #ffffff;
+  background-color: rgba(63, 72, 84, 0.7);
+  border-width: 1px;
+}
+
+.dark .btn-info {
+  background-color: rgba(119, 214, 225, 0.2);
+}
+
+.dark .btn-primary {
+  background-color: rgba(32, 160, 255, 0.2);
+}
+
+.dark .btn-danger {
+  background-color: rgba(255, 109, 109, 0.2);
+}
+
+.dark .btn-warning {
+  background-color: rgba(244, 176, 102, 0.2);
+}
+
+.dark .table-hover > tbody > tr:hover {
+  background-color: rgba(63, 72, 84, 1);
+}
+
+.dark .dropdown-menu > li > a {
+  color: #ffffff;
+}
+
+.dark .dropdown-menu > li > a:hover,
+.dark .dropdown-menu > li > a:focus {
+  background-color: #4db3ff;
+}
+
+.dark .mars3d-popup-color {
+  color: #ffffff;
+}
+
+.dark .mars3d-popup-background {
+  background: rgba(63, 72, 84, 0.9);
+}
+
+/*榛戣壊瀛椾綋 + 鐧借壊鑳屾櫙*/
+/* .mars3d-popup-color,
+.mars-popup-titile {
+  color: #2b2929;
+}
+
+.mars3d-popup-background {
+  background: rgba(255, 255, 255, 0.85);
+} */
+
+/**cesium鎸夐挳鑳屾櫙鑹�*/
+.cesium-button {
+  background-color: #3f4854;
+  color: #e6e6e6;
+  fill: #e6e6e6;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
+  line-height: 32px;
+}
+
+.cesium-viewer-geocoderContainer .cesium-geocoder-input {
+  background-color: rgba(63, 72, 84, 0.7);
+}
+
+.cesium-viewer-geocoderContainer .cesium-geocoder-input:focus {
+  background-color: rgba(63, 72, 84, 0.9);
+}
+
+.cesium-viewer-geocoderContainer .search-results {
+  background-color: #3f4854;
+}
+
+.cesium-geocoder-searchButton {
+  background-color: #3f4854;
+}
+
+.cesium-infoBox-title {
+  background-color: #3f4854;
+}
+
+.cesium-infoBox {
+  background: rgba(63, 72, 84, 0.9);
+}
+.cesium-toolbar-button img {
+  height: 100%;
+}
+
+.cesium-performanceDisplay-defaultContainer {
+  top: auto;
+  bottom: 35px;
+  right: 50px;
+}
+.cesium-performanceDisplay-ms,
+.cesium-performanceDisplay-fps {
+  color: #fff;
+}
+
+/**cesium宸ュ叿鏍忎綅缃�*/
+.cesium-viewer-toolbar {
+  top: auto;
+  left: auto;
+  right: 12px;
+  bottom: 35px;
+}
+
+.cesium-viewer-toolbar > .cesium-toolbar-button,
+.cesium-navigationHelpButton-wrapper,
+.cesium-viewer-geocoderContainer {
+  margin-bottom: 5px;
+  float: right;
+  clear: both;
+  text-align: center;
+}
+
+.cesium-baseLayerPicker-dropDown {
+  bottom: 0;
+  right: 40px;
+  max-height: 700px;
+  margin-bottom: 5px;
+}
+
+.cesium-navigation-help {
+  top: auto;
+  bottom: 0;
+  right: 40px;
+  transform-origin: right bottom;
+}
+
+.cesium-sceneModePicker-wrapper {
+  width: auto;
+}
+
+.cesium-sceneModePicker-wrapper .cesium-sceneModePicker-dropDown-icon {
+  float: left;
+  margin: 0 3px;
+}
+
+.cesium-viewer-geocoderContainer .search-results {
+  left: 0;
+  right: 40px;
+  width: auto;
+  z-index: 9999;
+}
+
+.cesium-infoBox-title {
+  background-color: #3f4854;
+}
+
+.cesium-infoBox {
+  top: 50px;
+  background: rgba(63, 72, 84, 0.9);
+}
+
+/**宸︿笅宸ュ叿鏍忚彍鍗�*/
+.toolbar-dropdown-menu-div {
+  background: rgba(43, 44, 47, 0.8);
+  border: 1px solid #2b2c2f;
+
+  z-index: 991;
+  position: absolute;
+  right: 60px;
+  bottom: 40px;
+  display: none;
+}
+
+.toolbar-dropdown-menu {
+  min-width: 110px;
+  padding: 0;
+}
+.toolbar-dropdown-menu > li {
+  padding: 0 3px;
+  margin: 2px 0;
+}
+.toolbar-dropdown-menu > li > a {
+  color: #edffff;
+  display: block;
+  padding: 4px 10px;
+  clear: both;
+  font-weight: normal;
+  line-height: 1.6;
+  white-space: nowrap;
+  text-decoration: none;
+}
+
+.toolbar-dropdown-menu > li > a:hover,
+.dropdown-menu > li > a:focus {
+  color: #fff;
+  background-color: #444d59;
+}
+
+.toolbar-dropdown-menu > .active > a,
+.dropdown-menu > .active > a:hover,
+.dropdown-menu > .active > a:focus {
+  color: #fff;
+  background-color: #444d59;
+}
+
+.toolbar-dropdown-menu i {
+  padding-right: 5px;
+}
+
+/*infoview_title绐楀彛  */
+.infoview_title {
+  position: absolute;
+  top: 10px;
+  /* left: 10px; */
+  padding: 10px 0px;
+  border-radius: 4px;
+  border: 1px solid rgba(128, 128, 128, 0.5);
+  color: #ffffff;
+  background: rgba(0, 0, 0, 0.4);
+  box-shadow: 0 3px 14px rgba(128, 128, 128, 0.5);
+  z-index: 19870101;
+}
+.infoview_title > div {
+  margin-top: 5px;
+}
+
+/**infoview娴姩闈㈡澘*/
+.infoview {
+  position: absolute;
+  top: 60px;
+  left: 10px;
+  padding: 10px 15px;
+  border-radius: 4px;
+  border: 1px solid rgba(128, 128, 128, 0.5);
+  color: #ffffff;
+  background: rgba(0, 0, 0, 0.4);
+  box-shadow: 0 3px 14px rgba(128, 128, 128, 0.5);
+  z-index: 19870101;
+}
+.infoview-right {
+  left: auto;
+  right: 10px;
+}
+
+.infoview input,
+.infoview select,
+.infoview textarea {
+  color: #ffffff;
+  background-color: rgba(32, 160, 255, 0.2);
+  border: 1px solid #e4eaec;
+  font-size: 14px;
+}
+
+.infoview > div {
+  margin-top: 5px;
+}
+/**infoview2娴姩闈㈡澘*/
+.infoview2 {
+  position: absolute;
+  bottom: 10px;
+  left: 10px;
+  padding: 10px 15px;
+  border-radius: 4px;
+  border: 1px solid rgba(128, 128, 128, 0.5);
+  color: #ffffff;
+  background: rgba(0, 0, 0, 0.4);
+  box-shadow: 0 3px 14px rgba(128, 128, 128, 0.5);
+  z-index: 19870101;
+}
+.infoview2-right {
+  left: auto;
+  right: 10px;
+}
+
+.infoview2 input,
+.infoview2 select,
+.infoview2 textarea {
+  color: #ffffff;
+  background-color: rgba(32, 160, 255, 0.2);
+  border: 1px solid #e4eaec;
+  font-size: 14px;
+}
+
+.infoview2 > div {
+  margin-top: 5px;
+}
+
+.info-tips {
+  margin: 5px 10px 20px 10px;
+}
+
+.rightbottom {
+  top: auto;
+  bottom: 60px;
+  left: auto;
+  right: 50px;
+}
+
+.loadingIndicator {
+  display: block;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  margin-top: -33px;
+  margin-left: -33px;
+  width: 66px;
+  height: 66px;
+  background-position: center;
+  background-repeat: no-repeat;
+  background-image: url(../img/loader.gif);
+}
+
+.mars-table {
+  width: 100%;
+  border-collapse: collapse;
+  border-spacing: 0;
+  margin-top: 5px;
+  margin-bottom: 5px;
+}
+
+.mars-table tr td {
+  padding: 5px 10px;
+  text-align: left;
+  white-space: nowrap;
+}
+
+.mars-table tr td:first-child {
+  border-left: none;
+}
+
+.mars-table .nametd {
+  padding: 5px 20px 5px 10px;
+}
+
+.tb-border {
+  border: #cde1de 1px solid;
+}
+
+.tb-border tr td {
+  border: #cde1de 1px solid;
+}
+
+/*婊氬姩鏉�*/
+body,
+html {
+  scrollbar-base-color: #f4f7fc;
+  scrollbar-track-color: #f4f7fc;
+  scrollbar-face-color: #797979;
+  scrollbar-arrow-color: #f4f7fc;
+  scrollbar-shadow-color: #f4f7fc;
+  scrollbar-3dlight-color: #f4f7fc;
+  scrollbar-highlight-color: #f4f7fc;
+  scrollbar-darkshadow-color: #f4f7fc;
+}
+
+::-webkit-scrollbar-button {
+  height: 0;
+  width: 0;
+  display: none;
+}
+
+::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+::-webkit-scrollbar-track,
+::-webkit-scrollbar-thumb {
+  border: 0;
+}
+
+::-webkit-scrollbar {
+  height: 10px;
+  width: 10px;
+  background: transparent;
+  border-radius: 5px;
+}
+
+::-webkit-scrollbar-thumb {
+  padding-top: 100px;
+  -webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.1), inset -1px -1px 0 rgba(0, 0, 0, 0.07);
+  background-color: #797979;
+  min-height: 28px;
+  border-radius: 4px;
+  background-clip: padding-box;
+}
+
+::-webkit-scrollbar-track,
+::-webkit-scrollbar-thumb {
+  border: 0;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  -webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.25);
+  background-color: rgba(0, 0, 0, 0.4);
+}
+
+::-webkit-scrollbar-thumb:active {
+  -webkit-box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.35);
+  background-color: rgba(0, 0, 0, 0.5);
+}
+
+
+@keyframes circle{
+  from{
+    transform: rotate(0deg)
+  }
+  to{transform: rotate(360deg)
+  }
+}
+@keyframes circle2{
+  from{
+    transform: rotate(0deg)
+  }
+  to{transform: rotate(360deg)
+  }
+}
+
+
+/*login*/
+.login {
+  height: 100%;
+  width: 100%;
+  background: url("../img/login_bg.png") no-repeat;
+  background-size: cover;
+  position: fixed;
+}
+
+.login-head {
+  margin: 0 auto;
+  text-align: center;
+  color: #fff;
+  font-size: 24px;
+  font-weight: 500;
+  line-height: 1.5;
+}
+
+.login-head>.login-logo {
+  display: block;
+  margin: 64px auto 24px;
+  width: 60px;
+  height: 60px;
+  padding: 4px;
+  background: #fff;
+  border-radius: 4px;
+  box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
+}
+
+.login-head>p {
+  font-size: 16px;
+  font-weight: 300;
+  color: rgba(255, 255, 255, 0.7);
+}
+
+.login-form {
+  margin: 56px 30px 0;
+}
+
+.login-item {
+  margin-bottom: 20px;
+}
+
+.login-item label {
+  color: #fff;
+  font-size: 18px;
+  line-height: 1;
+  font-weight: 400;
+}
+
+.login-item input {
+  display: block;
+  width: 100%;
+  font-size: 16px;
+  line-height: 48px;
+  padding: 0;
+  color: #fff;
+  background-color: transparent;
+  border: none;
+  border-bottom: 0.5px solid #fff;
+  outline: none;
+  border-radius: 0;
+}
+
+.login-item>input::-webkit-input-placeholder,
+.login-item>input::placeholder {
+  color: rgba(255, 255, 255, 0.3);
+}
+
+.login-btn {
+  width: 100%;
+  text-align: center;
+  line-height: 48px;
+  padding: 0 10px;
+  color: #fff;
+  background: #0C2357;
+  font-size: 16px;
+  letter-spacing: 1px;
+  border-radius: 4px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, .15);
+  border: none;
+  outline: none;
+}
+
+/*box*/
+.page{
+  width: 100vw;
+  height: 100%;
+  display:flex;
+  flex-direction:column;
+}
+
+.header{
+  display: flex;
+  width: 100vw;
+  background: #0C2357;
+  color: #fff;
+  box-shadow: 0 2px 4px rgba(83, 116, 167, 0.2);
+  text-align: center;
+}
+.header .title{
+  flex: 1;
+  height: 44px;
+  line-height: 44px;
+  font-size: 16px;
+}
+
+.main{
+  flex: 1;
+  background: #304B80;
+}
+
+.footbar {
+  width: 100vw;
+  height: 50px;
+  background: #0C2357;
+  box-shadow: 0 -1px 6px rgba(13, 71, 161, 0.25);
+}
+
+.footbar ul {
+  display: flex;
+}
+
+.footbar ul li {
+  flex: 1;
+}
+
+.footbar ul li a{
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  font-size: 12px;
+  color:rgba(255, 255, 255, 0.45);
+  text-align: center;
+  height: 50px;
+  text-decoration: none;
+}
+.footbar ul li a img{
+  display: inline-block;
+  width: 22px;
+  height: 22px;
+}
+.footbar ul li a span{
+  display: block;
+  text-align: center;
+}
+
+.footbar ul li a.active {
+  font-weight: 500;
+  color: #0FCE8C;
+}
+
+.hidden {
+  display: none;
+}
+
+.data{
+  height: 100%;
+  display:flex;
+  flex-direction:column;
+}
+.data .data-title{
+  font-size: 18px;
+  margin-bottom: 12px;
+  color: #fff;
+}
+.data .data-number{
+  font-family:Arial, Helvetica, sans-serif;
+  font-size: 40px;
+  margin-bottom: 4px;
+  color: #fff;
+}
+.data .data-name{
+  font-size: 13px;
+  color: rgba(255, 255, 255, 0.7);
+}
+.data-top{
+  padding: 32px 0;
+  text-align: center;
+}
+.data-main{
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+}
+.data-main ul{
+  height: 100%;
+  display: flex;
+  flex-wrap: wrap;
+}
+.data-main ul li{
+  width: 50%;
+  text-align: center;
+  color: #Fff;
+  border-top: 1px solid #476399;
+  border-right: 1px solid #476399;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+.data-main ul li:nth-child(even){
+  border-right: none;
+}
+.data-main ul li .data-number{
+  font-size: 28px;
+  color: #fff;
+}
+
+.map-panel {
+  height: calc(100% - 100px);
+  background: #fff;
+  overflow: hidden;
+}
+
+.map-panel-item {
+  width: 100%;
+  height: 100%;
+}
+iframe{
+  width: 100%;
+  height: 100%;
+  border: 0;
+}
\ No newline at end of file
diff --git a/mobile/data.html b/mobile/data.html
new file mode 100644
index 0000000..f698b7f
--- /dev/null
+++ b/mobile/data.html
@@ -0,0 +1,82 @@
+<!DOCTYPE html>
+<html class="no-js css-menubar" lang="zh-cn">
+
+<head>
+    <title>涓婃捣甯傞亾璺氦閫氱幆澧冪洃娴嬪钩鍙�</title>
+    <meta charset="utf-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+    <!-- 绉诲姩璁惧 viewport -->
+    <meta name="viewport"
+        content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui" />
+    <meta name="author" content="涓婃捣甯傞亾璺氦閫氱幆澧冪洃娴嬪钩鍙�" />
+    <!-- 360娴忚鍣ㄩ粯璁や娇鐢╓ebkit鍐呮牳 -->
+    <meta name="renderer" content="webkit" />
+    <!-- Chrome娴忚鍣ㄦ坊鍔犳闈㈠揩鎹锋柟寮忥紙瀹夊崜锛� -->
+    <link rel="icon" type="image/png" href="img/favicon/favicon.png" />
+    <meta name="mobile-web-app-capable" content="yes" />
+    <!-- Safari娴忚鍣ㄦ坊鍔犲埌涓诲睆骞曪紙IOS锛� -->
+    <link rel="icon" sizes="192x192" href="img/favicon/apple-touch-icon.png" />
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
+    <meta name="apple-mobile-web-app-title" content="MarsGIS" />
+
+    <!--绗笁鏂筶ib-->
+    <script type="text/javascript" src="../lib/include-lib.js?time=20210803" libpath="../lib/"
+        include="jquery"></script>
+    <link href="css/style.css" rel="stylesheet" />
+
+</head>
+
+<body>
+    <div class="page">
+        <div class="header">
+            <div class="title">鏁版嵁鎬昏</div>
+        </div>
+
+        <div class="main">
+            <div class="data">
+                <div class="data-top">
+                    <p class="data-title">2023骞�7鏈� 鏁版嵁鎬昏</p>
+                    <p class="data-number">1,700,820.34</p>
+                    <p class="data-name">琛岄┒鎬婚噷绋�(鍏噷)</p>
+                </div>
+                <div class="data-main">
+                    <ul>
+                        <li>
+                            <p class="data-number">1,700,820.34</p>
+                            <p class="data-name">琛岄┒鎬婚噷绋�(鍏噷)</p>
+                        </li>
+                        <li>
+                            <p class="data-number">1,700,820.34</p>
+                            <p class="data-name">琛岄┒鎬婚噷绋�(鍏噷)</p>
+                        </li>
+                        <li>
+                            <p class="data-number">1,700,820.34</p>
+                            <p class="data-name">琛岄┒鎬婚噷绋�(鍏噷)</p>
+                        </li>
+                        <li>
+                            <p class="data-number">1,700,820.34</p>
+                            <p class="data-name">琛岄┒鎬婚噷绋�(鍏噷)</p>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </div>
+
+        <div class="footbar">
+            <ul>
+                <li>
+                    <a href="cars.html"><img src="img/cars.png"><span>杞﹁締鏄剧ず</span></a>
+                </li>
+                <li>
+                    <a href="road.html"><img src="img/monitor.png"><span>鐩戞帶鎬昏</span></a>
+                </li>
+                <li>
+                    <a href="data.html" class="active"><img src="img/data_active.png"><span>鏁版嵁鎬昏</span></a>
+                </li>
+            </ul>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/mobile/img/cars.png b/mobile/img/cars.png
new file mode 100644
index 0000000..375ea9d
--- /dev/null
+++ b/mobile/img/cars.png
Binary files differ
diff --git a/mobile/img/cars_active.png b/mobile/img/cars_active.png
new file mode 100644
index 0000000..c90482c
--- /dev/null
+++ b/mobile/img/cars_active.png
Binary files differ
diff --git a/mobile/img/data.png b/mobile/img/data.png
new file mode 100644
index 0000000..86f92d9
--- /dev/null
+++ b/mobile/img/data.png
Binary files differ
diff --git a/mobile/img/data_active.png b/mobile/img/data_active.png
new file mode 100644
index 0000000..940f3c1
--- /dev/null
+++ b/mobile/img/data_active.png
Binary files differ
diff --git a/mobile/img/login_bg.png b/mobile/img/login_bg.png
index f4fcdc5..e5630a8 100644
--- a/mobile/img/login_bg.png
+++ b/mobile/img/login_bg.png
Binary files differ
diff --git a/mobile/img/login_bg_old.png b/mobile/img/login_bg_old.png
new file mode 100644
index 0000000..f4fcdc5
--- /dev/null
+++ b/mobile/img/login_bg_old.png
Binary files differ
diff --git a/mobile/img/monitor.png b/mobile/img/monitor.png
new file mode 100644
index 0000000..6db4c17
--- /dev/null
+++ b/mobile/img/monitor.png
Binary files differ
diff --git a/mobile/img/monitor_active.png b/mobile/img/monitor_active.png
new file mode 100644
index 0000000..670befa
--- /dev/null
+++ b/mobile/img/monitor_active.png
Binary files differ
diff --git a/mobile/index.html b/mobile/index.html
index d464a7b..51cda1f 100644
--- a/mobile/index.html
+++ b/mobile/index.html
@@ -6,8 +6,8 @@
   <meta charset="utf-8" />
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
   <!-- 绉诲姩璁惧 viewport -->
-  <meta name="viewport"
-    content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui" />
+  <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui" />
+  <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
   <meta name="author" content="涓婃捣甯傞亾璺氦閫氱幆澧冪洃娴嬪钩鍙� http://mars3d.cn" />
   <!-- 360娴忚鍣ㄩ粯璁や娇鐢╓ebkit鍐呮牳 -->
   <meta name="renderer" content="webkit" />
@@ -22,96 +22,7 @@
   <script type="text/javascript" src="../lib/jquery/jquery-1.11.3.min.js"></script>
   <script type="text/javascript" src="../js/changable_params.js"></script>
   <!--绗笁鏂筶ib-->
-  <link href="../css/style.css" rel="stylesheet" />
-  <style>
-    * {
-      margin: 0;
-      padding: 0;
-      box-sizing: border-box;
-    }
-
-    .login {
-      height: 100%;
-      width: 100%;
-      background: url("../mobile/img/login_bg.png") no-repeat;
-      background-size: cover;
-      position: fixed;
-    }
-
-    .login-head {
-      margin: 0 auto;
-      text-align: center;
-      color: #fff;
-      font-size: 24px;
-      font-weight: 500;
-      line-height: 1.5;
-    }
-
-    .login-head>.login-logo {
-      display: block;
-      margin: 64px auto 20px;
-      width: 48px;
-      height: 48px;
-      padding: 4px;
-      background: #fff;
-      border-radius: 4px;
-      box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
-    }
-
-    .login-head>p {
-      font-size: 16px;
-      font-weight: 300;
-      color: rgba(255, 255, 255, 0.7);
-    }
-
-    .login-form {
-      margin: 30px;
-    }
-
-    .login-item {
-      margin-bottom: 20px;
-    }
-
-    .login-item label {
-      color: #fff;
-      font-size: 18px;
-      line-height: 1;
-      font-weight: 400;
-    }
-
-    .login-item input {
-      display: block;
-      width: 100%;
-      font-size: 16px;
-      line-height: 48px;
-      padding: 0;
-      color: #fff;
-      background-color: transparent;
-      border: none;
-      border-bottom: 0.5px solid #fff;
-      outline: none;
-      border-radius: 0;
-    }
-
-    .login-item>input::-webkit-input-placeholder,
-    .login-item>input::placeholder {
-      color: rgba(255, 255, 255, 0.3);
-    }
-
-    .login-btn {
-      width: 100%;
-      text-align: center;
-      line-height: 48px;
-      color: #fff;
-      background: #FEA41D;
-      font-size: 16px;
-      letter-spacing: 1px;
-      border-radius: 4px;
-      box-shadow: 0 2px 4px rgba(0, 0, 0, .15);
-      border: none;
-      outline: none;
-    }
-  </style>
+  <link href="css/style.css" rel="stylesheet" />
 </head>
 
 <body>
@@ -152,7 +63,7 @@
               let record = data.result[0];
               if(record.status == 0 && record.is_deleted ==0) {
                 localStorage.setItem("name",record.name);
-                window.location = "../mobile/road.html";                
+                window.location = "../mobile/cars.html";                
               } else {
                 alert("璐﹀彿寮傚父锛�");
                 return ;
diff --git a/mobile/road.html b/mobile/road.html
index b7ee2b5..e7b2151 100644
--- a/mobile/road.html
+++ b/mobile/road.html
@@ -22,114 +22,17 @@
 
     <!--绗笁鏂筶ib-->
     <script type="text/javascript" src="../lib/include-lib.js?time=20210803" libpath="../lib/" include="jquery"></script>
-    <link href="../css/style.css?time=20210803" rel="stylesheet" />
-
-    <style>
-        * {
-            padding: 0;
-            margin: 0;
-            box-sizing: border-box;
-        }
-
-        ul,
-        li {
-            list-style: none;
-        }
-        .header{
-            position: fixed;
-            display: flex;
-            height: 50px;
-            width: 100%;
-            padding: 10px;
-            background: #0d47a1;
-            color: #fff;
-            font-size: 16px;
-            box-shadow: 0 2px 4px rgba(83, 116, 167, 0.2);
-            vertical-align: middle;
-        }
-        .header > img{
-            width: 30px;
-            height: 30px;
-            padding: 2px;
-            margin-right: 6px;
-            background: #fff;
-            border-radius: 2px;
-        }
-        .header > .title{
-            flex: 1;
-            line-height: 30px;
-        }
-        .header > .user{
-            font-size: 12px;
-            line-height: 30px;
-            text-align: right;
-        }
-
-        .footbar {
-            height: 50px;
-            background: #fff;
-            box-shadow: 0 -1px 6px rgba(13, 71, 161, 0.25);
-            z-index: 9999999999999;
-            position: fixed;
-            left: 0;
-            right: 0;
-            bottom: 0;
-        }
-
-        .footbar ul {
-            display: flex;
-            overflow: hidden;
-            margin: 7px 12px;
-            border-radius: 3px;
-        }
-
-        .footbar ul li {
-            flex: 1;
-            font-size: 14px;
-            line-height: 34px;
-            color: #333;
-            text-align: center;
-            border: 1px solid rgba(83, 116, 167, 0.2);
-        }
-
-        .footbar ul li.active {
-            font-weight: 500;
-            color: #e0f7fa;
-            background: #0d47a1;
-            border: 1px solid 0d47a1;
-        }
-
-        .hidden {
-            display: none;
-        }
-
-        .map-panel {
-            margin-top: 50px;
-            height: calc(100vh - 100px);
-            background: #fff;
-            overflow: hidden;
-        }
-
-        .map-panel-item {
-            width: 100%;
-            height: 100%;
-        }
-        iframe{
-            width: 100%;
-            height: 100%;
-            border: 0;
-        }
-    </style>
+    <link href="css/style.css" rel="stylesheet" />
 
 </head>
 
 <body>
-    <div class="header">
-        <img src="../img/logo.png">
-        <div class="title">涓婃捣甯傞亾璺氦閫氱幆澧冪洃娴嬪钩鍙�</div>
-        <div class="user"><span id="name_"></span></div>
-    </div>
-    <div class="map-panel" id="a1">
+    <div class="page">
+        <div class="header">
+            <div class="title">鐩戞帶鎬昏</div>
+        </div>
+
+    <div class="main map-panel" id="a1">
         <!--閬撹矾鏌ヨ 寮�濮�-->
         <div class="map-panel-item">
             <iframe src="road_search.html"></iframe>
@@ -144,14 +47,34 @@
     </div>
 
     <!--footbar 寮�濮�-->
-    <div class="footbar">
+    <!-- <div class="footbar">
         <ul btn='btn' data-target="#a1">
             <li class="active"><i class="fa fa-search"></i> 閬撹矾鏌ヨ</li>
             <li><i class="fa fa-road"></i> 閬撹矾灞曠ず</li>
         </ul>
-    </div>
+    </div> -->
     <!--footbar 缁撴潫-->
 
+    <!--tabbar 寮�濮�-->
+    <!-- <ul class="tabbar">
+        <li class="active"><i class="fa fa-search"></i> 閬撹矾鏌ヨ</li>
+        <li><i class="fa fa-road"></i> 閬撹矾灞曠ず</li>
+    </ul> -->
+    <div class="footbar">
+        <ul>
+            <li>
+                <a href="cars.html"><img src="img/cars.png"><span>杞﹁締鏄剧ず</span></a>
+            </li>
+            <li>
+                <a href="road.html" class="active"><img src="img/monitor_active.png"><span>鐩戞帶鎬昏</span></a>
+            </li>
+            <li>
+                <a href="data.html"><img src="img/data.png"><span>鏁版嵁鎬昏</span></a>
+            </li>
+        </ul>
+    </div>
+    <!--tabtbar 缁撴潫-->
+</div>
     <script>
         $.fn.$btnId = function () {
             $(this).children().click(function () {
diff --git a/mobile/road_search.html b/mobile/road_search.html
index 1990c2b..252cd11 100644
--- a/mobile/road_search.html
+++ b/mobile/road_search.html
@@ -52,7 +52,7 @@
     </style>
 </head>
 
-<body style="background: #0d47a1;">
+<body style="background: #0C2357;">
     <!--閫夋嫨鏃堕棿 寮�濮�-->
     <div class="input-group input-group-lg append_test">
         <div style="width:78px; height:44px; line-height: 1; border-radius: 0; font-size: 14px;"
@@ -100,7 +100,7 @@
                 <thead>
                     <tr style="background-color: rgba(0, 0, 0, 0); color: #FF5722;">
                         <th>搴�</th>
-                        <th>缂栧彿</th>
+                        <th>鍖哄幙</th>
                         <th>鍚嶇О</th>
                         <th><select style="width: 100%;" id="qindex_selection"></select></th>
                     </tr>
diff --git a/mobile/road_show.html b/mobile/road_show.html
index 9d1967b..f34be67 100644
--- a/mobile/road_show.html
+++ b/mobile/road_show.html
@@ -74,7 +74,7 @@
         .footbar ul li.active {
             font-weight: 500;
             color: #e0f7fa;
-            background: #0d47a1;
+            background: #0C2357;
             border: 1px solid 0d47a1;
         }
 

--
Gitblit v1.9.1