|
|
@@ -0,0 +1,617 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="en">
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <title>车辆显示大屏</title>
|
|
|
+
|
|
|
+<style>
|
|
|
+ .hello{
|
|
|
+ width: 1920px;
|
|
|
+ height: 1080px;
|
|
|
+ position: absolute;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ background-color: #132949;
|
|
|
+}
|
|
|
+.title{
|
|
|
+ display: flex;
|
|
|
+ margin-left: 415px;
|
|
|
+ color: aliceblue;
|
|
|
+ font-size: 58px;
|
|
|
+ line-height: 59px;
|
|
|
+ /* font-style: italic; */
|
|
|
+ font-weight: 600;
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 76px;
|
|
|
+}
|
|
|
+.title_line{
|
|
|
+ margin-left: 82px;
|
|
|
+ width: 3px;
|
|
|
+ height: 56px;
|
|
|
+ background: #FFFFFF;
|
|
|
+ opacity: 0.5;
|
|
|
+ border-radius: 2px;
|
|
|
+}
|
|
|
+
|
|
|
+.scroll {
|
|
|
+ width: 1003px;
|
|
|
+ height: 59px;
|
|
|
+ white-space: nowrap; /*文字不折行*/
|
|
|
+ overflow: hidden; /*文字溢出隐藏*/
|
|
|
+}
|
|
|
+
|
|
|
+.scroll .scroll_span1 {
|
|
|
+ display: inline-block;
|
|
|
+ white-space: nowrap;
|
|
|
+ /*inline样式不能使用动画*/
|
|
|
+ animation: scroll 10s linear infinite; /*滚动动画*/
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes scroll {
|
|
|
+ from {
|
|
|
+ transform: translateX(1003px); /*div多宽就写多宽*/
|
|
|
+ }
|
|
|
+
|
|
|
+ to {
|
|
|
+ transform: translateX(-100%);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/* 天气 */
|
|
|
+.tianqi{
|
|
|
+ width: 1270px;
|
|
|
+ margin-top: 73px;
|
|
|
+ color: aliceblue;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: 200;
|
|
|
+}
|
|
|
+.tianqi_list{
|
|
|
+ margin-left: 0px;
|
|
|
+}
|
|
|
+/* 车辆列表信息 */
|
|
|
+.car_list{
|
|
|
+ width: 1520px;
|
|
|
+ height: 700px;
|
|
|
+ float: right;
|
|
|
+ margin-top: 31px;
|
|
|
+ text-align: left;
|
|
|
+}
|
|
|
+.car_item{
|
|
|
+ margin-top: 24px;
|
|
|
+ display: flex;
|
|
|
+ line-height: 71px;
|
|
|
+}
|
|
|
+.car_card_bg{
|
|
|
+ display: inline-block;
|
|
|
+ z-index: 0;
|
|
|
+ width: 60px;
|
|
|
+ height: 71px;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ border-radius: 8px;
|
|
|
+ background-color:rgba(254, 253, 253, 0.1);
|
|
|
+}
|
|
|
+.car_card_txt{
|
|
|
+ z-index: 2;
|
|
|
+ width: 50px;
|
|
|
+ height: 60px;
|
|
|
+ position: absolute;
|
|
|
+ text-align: center;
|
|
|
+ margin-left: -55px;
|
|
|
+ font-size: 51px;
|
|
|
+ font-family: Microsoft YaHei-3970(82674968);
|
|
|
+ font-weight: 400;
|
|
|
+ color: white;
|
|
|
+}
|
|
|
+.car_line{
|
|
|
+ margin-left: 30px;
|
|
|
+ margin-top: 34px;
|
|
|
+ width: 392px;
|
|
|
+ height: 2px;
|
|
|
+ border-bottom-style: dashed;
|
|
|
+ border-bottom-color:rgba(255, 255, 255, 0.2) ;
|
|
|
+}
|
|
|
+.car_type{
|
|
|
+ margin-left: 39px;
|
|
|
+ color: #f8751f;
|
|
|
+ font-size: 40px;
|
|
|
+ font-family: Microsoft YaHei;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+.green{
|
|
|
+ color: #29e122;
|
|
|
+}
|
|
|
+.blue{
|
|
|
+ color: #3388f9;
|
|
|
+}
|
|
|
+.yellow{
|
|
|
+ color: #f8ce35;
|
|
|
+}
|
|
|
+.white{
|
|
|
+ color: #FFFFFF;
|
|
|
+}
|
|
|
+.VIP{
|
|
|
+ color: #2BFFDF;
|
|
|
+}
|
|
|
+/* 结尾 */
|
|
|
+.last{
|
|
|
+ width: 1340px;
|
|
|
+ float: right;
|
|
|
+ margin-top: 51px;
|
|
|
+ color: aliceblue;
|
|
|
+ text-align: left;
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: 200;
|
|
|
+}
|
|
|
+</style>
|
|
|
+</head>
|
|
|
+
|
|
|
+
|
|
|
+<body>
|
|
|
+<div class="hello">
|
|
|
+ <div class="title">
|
|
|
+ <img src="./image/gonggao.svg" width="58px" height="58px" style="position: absolute;">
|
|
|
+ <div class="title_line"></div>
|
|
|
+ <div style="margin-left:36px;" class="scroll">
|
|
|
+ <span class="scroll_span1" id="scroll_span1"></span>
|
|
|
+ <span class="scroll_span2" id="scroll_span2"></span>
|
|
|
+ </div>
|
|
|
+ <!-- width: 1003px; -->
|
|
|
+ </div>
|
|
|
+ <!-- 天气 -->
|
|
|
+ <div class="tianqi">
|
|
|
+ <span id="tianqi_list"></span>
|
|
|
+ <span class="tianqi_list" id="weather"></span>
|
|
|
+ <span class="tianqi_list" id="tianqi_list3"></span>
|
|
|
+ <span class="tianqi_list" id="wendu">℃</span>
|
|
|
+ </div>
|
|
|
+ <!-- 车辆列表信息 -->
|
|
|
+ <div class="car_list" id="car_list">
|
|
|
+ <div class="car_item">
|
|
|
+ <span class="car_card">
|
|
|
+ <div class="car_card_bg"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt1"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt2"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt3"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt4"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt5"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt6"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt7"></span>
|
|
|
+ </span>
|
|
|
+ <span class="car_line">
|
|
|
+ <span class="xuxian"></span>
|
|
|
+ </span>
|
|
|
+ <!-- :class="{'green': car_list[0].car_type == '包月车', 'blue': car_list[0].car_type == '预约车', 'white': car_list[0].car_type == '免费车', 'VIP': car_list[0].car_type == 'VIP车'}" -->
|
|
|
+ <span class="car_type" id="car_type1" ></span>
|
|
|
+ </div>
|
|
|
+ <div class="car_item">
|
|
|
+ <span class="car_card">
|
|
|
+ <div class="car_card_bg"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt21"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt22"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt23"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt24"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt25"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt26"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt27"></span>
|
|
|
+ </span>
|
|
|
+ <span class="car_line">
|
|
|
+ <span class="xuxian"></span>
|
|
|
+ </span>
|
|
|
+ <span class="car_type" id="car_type2"></span>
|
|
|
+ </div>
|
|
|
+ <div class="car_item">
|
|
|
+ <span class="car_card">
|
|
|
+ <div class="car_card_bg"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt31"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt32"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt33"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt34"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt35"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt36"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt37"></span>
|
|
|
+ </span>
|
|
|
+ <span class="car_line">
|
|
|
+ <span class="xuxian"></span>
|
|
|
+ </span>
|
|
|
+ <span class="car_type" id="car_type3"></span>
|
|
|
+ </div>
|
|
|
+ <div class="car_item">
|
|
|
+ <span class="car_card">
|
|
|
+ <div class="car_card_bg"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt41"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt42"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt43"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt44"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt45"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt46"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt47"></span>
|
|
|
+ </span>
|
|
|
+ <span class="car_line">
|
|
|
+ <span class="xuxian"></span>
|
|
|
+ </span>
|
|
|
+ <span class="car_type" id="car_type4"></span>
|
|
|
+ </div>
|
|
|
+ <div class="car_item">
|
|
|
+ <span class="car_card">
|
|
|
+ <div class="car_card_bg"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt51"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt52"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt53"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt54"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt55"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt56"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt57"></span>
|
|
|
+ </span>
|
|
|
+ <span class="car_line">
|
|
|
+ <span class="xuxian"></span>
|
|
|
+ </span>
|
|
|
+ <span class="car_type" id="car_type5"></span>
|
|
|
+ </div>
|
|
|
+ <div class="car_item">
|
|
|
+ <span class="car_card">
|
|
|
+ <div class="car_card_bg"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt61"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt62"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt63"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt64"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt65"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt66"></span>
|
|
|
+ <div class="car_card_bg" style="margin-left: 15px;"></div>
|
|
|
+ <span class="car_card_txt" id="car_card_txt67"></span>
|
|
|
+ </span>
|
|
|
+ <span class="car_line">
|
|
|
+ <span class="xuxian"></span>
|
|
|
+ </span>
|
|
|
+ <span class="car_type" id="car_type6"></span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 页尾 -->
|
|
|
+ <div class="last">今日累计<span class="green" id="green"></span>辆车</div>
|
|
|
+</div>
|
|
|
+
|
|
|
+ <script src="./js/jquery.min.js"></script>
|
|
|
+ <script type="text/javascript">
|
|
|
+ // 当前时间
|
|
|
+ var checkTime = function (i) {
|
|
|
+ if (i < 10) {
|
|
|
+ i = "0" + i;
|
|
|
+ }
|
|
|
+ return i;
|
|
|
+ }
|
|
|
+ var nowdate = new Date();
|
|
|
+ var year = nowdate.getFullYear(),
|
|
|
+ month = nowdate.getMonth() + 1,
|
|
|
+ date = nowdate.getDate(),
|
|
|
+ day = nowdate.getDay(),
|
|
|
+ week = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"],
|
|
|
+ h = nowdate.getHours(),
|
|
|
+ m = nowdate.getMinutes(),
|
|
|
+ s = nowdate.getSeconds(),
|
|
|
+ h = checkTime(h),
|
|
|
+ m = checkTime(m),
|
|
|
+ s = checkTime(s);
|
|
|
+ var riqi=year + "-" + month + "-" + date +" "+week[day];
|
|
|
+ var time=h +":" + m + ":" + s;
|
|
|
+
|
|
|
+ var riqi1=document.getElementById("tianqi_list");
|
|
|
+ riqi1.innerText=riqi;
|
|
|
+ var weekDay1=document.getElementById("tianqi_list3");
|
|
|
+ weekDay1.innerText=time;
|
|
|
+
|
|
|
+ setInterval (function() {
|
|
|
+ console.log(riqi)
|
|
|
+ var riqi1=document.getElementById("tianqi_list");
|
|
|
+ riqi1.innerText=riqi;
|
|
|
+ }, 240000); //反复执行函数
|
|
|
+ setInterval (function() {
|
|
|
+ var weekDay1=document.getElementById("tianqi_list3");
|
|
|
+ weekDay1.innerText=time;
|
|
|
+ }, 3000); //反复执行函数
|
|
|
+
|
|
|
+ var url = "https://restapi.amap.com/v3/weather/weatherInfo?key=5411d59a86689ed2053d7e7a224ea1a6&city=360925&extensions=all";
|
|
|
+ $.ajax({
|
|
|
+ url: url,
|
|
|
+ type: 'GET',
|
|
|
+ dataType: 'JSON',
|
|
|
+ success: function (result) {
|
|
|
+ var City = result.forecasts[0]
|
|
|
+ if(result.forecasts[0].reporttime.slice(11,13)<19) {
|
|
|
+ document.getElementById("weather").innerHTML = City.casts[0].dayweather
|
|
|
+ document.getElementById("wendu").innerHTML = City.casts[0].daytemp+'℃'
|
|
|
+ }else{
|
|
|
+ document.getElementById("weather").innerHTML = City.casts[0].dayweather
|
|
|
+ document.getElementById("wendu").innerHTML = City.casts[0].daytemp+'℃'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error: function (msg) {
|
|
|
+ console.log('接口出错')
|
|
|
+ }
|
|
|
+ });
|
|
|
+ setInterval (function() {
|
|
|
+ var url = "https://restapi.amap.com/v3/weather/weatherInfo?key=5411d59a86689ed2053d7e7a224ea1a6&city=360925&extensions=all";
|
|
|
+ $.ajax({
|
|
|
+ url: url,
|
|
|
+ type: 'GET',
|
|
|
+ dataType: 'JSON',
|
|
|
+ success: function (result) {
|
|
|
+ var City = result.forecasts[0]
|
|
|
+ if(result.forecasts[0].reporttime.slice(11,13)<19) {
|
|
|
+ document.getElementById("weather").innerHTML = City.casts[0].dayweather
|
|
|
+ document.getElementById("wendu").innerHTML = City.casts[0].daytemp+'℃'
|
|
|
+ }else{
|
|
|
+ document.getElementById("weather").innerHTML = City.casts[0].dayweather
|
|
|
+ document.getElementById("wendu").innerHTML = City.casts[0].daytemp+'℃'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error: function (msg) {
|
|
|
+ console.log('接口出错')
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }, 43200000);
|
|
|
+ // $(function() {
|
|
|
+ // for(i=0; i<16; i++) {
|
|
|
+ // $('<div class="inner">blah</div>').appendTo('.outer');
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ var socket;
|
|
|
+ if(typeof(WebSocket) == "undefined") {
|
|
|
+ console.log("您的浏览器不支持WebSocket");
|
|
|
+ }else{
|
|
|
+ console.log("您的浏览器支持WebSocket");
|
|
|
+ //实现化WebSocket对象，指定要连接的服务器地址与端口 建立连接
|
|
|
+ //等同于socket = new WebSocket("ws://localhost:8083/checkcentersys/websocket/20");
|
|
|
+ socket = new WebSocket("http://172.16.20.76:8080/websocket/543edaa433ee4d94813fd0ec7527f3ea".replace("http","ws"));
|
|
|
+ //打开事件
|
|
|
+ socket.onopen = function() {
|
|
|
+ console.log("Socket 已打开");
|
|
|
+ //socket.send("这是来自客户端的消息" + location.href + new Date());
|
|
|
+ };
|
|
|
+ //获得消息事件
|
|
|
+ socket.onmessage = function(msg) {
|
|
|
+ console.log("服务端链接成功，返回信息"+msg.data)
|
|
|
+ var data=msg.data.replace(/=/g,':')
|
|
|
+ console.log(eval("("+data+")"))
|
|
|
+ var picNumber=''
|
|
|
+ picNumber=eval("("+data+")").picNumber
|
|
|
+ document.getElementById("green").innerHTML=picNumber;
|
|
|
+ var title=''
|
|
|
+ title=eval("("+data+")").direction
|
|
|
+ console.log(title)
|
|
|
+ console.log(title.length)
|
|
|
+ if(eval("("+data+")").direction.length>17){
|
|
|
+ document.getElementById("scroll_span1").innerHTML=eval("("+data+")").direction;
|
|
|
+ }else if(eval("("+data+")").direction.length<=17) {
|
|
|
+ document.getElementById("scroll_span2").innerHTML=eval("("+data+")").direction;
|
|
|
+ }
|
|
|
+
|
|
|
+ var car_list=[
|
|
|
+ {id:1,car_card:'',car_type:''},
|
|
|
+ {id:2,car_card:'',car_type:''},
|
|
|
+ {id:3,car_card:'',car_type:''},
|
|
|
+ {id:4,car_card:'',car_type:''},
|
|
|
+ {id:5,car_card:'',car_type:''},
|
|
|
+ {id:6,car_card:'',car_type:''},
|
|
|
+ ];
|
|
|
+ var arr =[]
|
|
|
+ var carNumber =[]
|
|
|
+ carNumber.push(eval("("+data+")").carPlate)
|
|
|
+ arr=carNumber
|
|
|
+
|
|
|
+ var arr_type =[]
|
|
|
+ var carType =[]
|
|
|
+ carType.push(eval("("+data+")").vehicleType)
|
|
|
+ arr_type=carType
|
|
|
+ // console.log('车类型数组：',arr_type)
|
|
|
+
|
|
|
+ if(arr.length>=6){
|
|
|
+ car_list[5].car_card=arr[arr.length - 1]
|
|
|
+ car_list[4].car_card=arr[arr.length - 2]
|
|
|
+ car_list[3].car_card=arr[arr.length - 3]
|
|
|
+ car_list[2].car_card=arr[arr.length - 4]
|
|
|
+ car_list[1].car_card=arr[arr.length - 5]
|
|
|
+ car_list[0].car_card=arr[arr.length - 6]
|
|
|
+ }else{
|
|
|
+ car_list[0].car_card=arr[0]
|
|
|
+ car_list[1].car_card=arr[1]
|
|
|
+ car_list[2].car_card=arr[2]
|
|
|
+ car_list[3].car_card=arr[3]
|
|
|
+ car_list[4].car_card=arr[4]
|
|
|
+ car_list[5].car_card=arr[5]
|
|
|
+ }
|
|
|
+ if(arr_type.length>=6){
|
|
|
+ car_list[5].car_type=arr_type[arr_type.length - 1]
|
|
|
+ car_list[4].car_type=arr_type[arr_type.length - 2]
|
|
|
+ car_list[3].car_type=arr_type[arr_type.length - 3]
|
|
|
+ car_list[2].car_type=arr_type[arr_type.length - 4]
|
|
|
+ car_list[1].car_type=arr_type[arr_type.length - 5]
|
|
|
+ car_list[0].car_type=arr_type[arr_type.length - 6]
|
|
|
+ }else{
|
|
|
+ car_list[0].car_type=arr_type[0]
|
|
|
+ car_list[1].car_type=arr_type[1]
|
|
|
+ car_list[2].car_type=arr_type[2]
|
|
|
+ car_list[3].car_type=arr_type[3]
|
|
|
+ car_list[4].car_type=arr_type[4]
|
|
|
+ car_list[5].car_type=arr_type[5]
|
|
|
+ }
|
|
|
+
|
|
|
+ document.getElementById("car_card_txt1").innerHTML = (car_list[0].car_card).slice(0,1);
|
|
|
+ document.getElementById("car_card_txt2").innerHTML = (car_list[0].car_card).slice(1,2);
|
|
|
+ document.getElementById("car_card_txt3").innerHTML = (car_list[0].car_card).slice(2,3);
|
|
|
+ document.getElementById("car_card_txt4").innerHTML = (car_list[0].car_card).slice(3,4);
|
|
|
+ document.getElementById("car_card_txt5").innerHTML = (car_list[0].car_card).slice(4,5);
|
|
|
+ document.getElementById("car_card_txt6").innerHTML = (car_list[0].car_card).slice(5,6);
|
|
|
+ document.getElementById("car_card_txt7").innerHTML = (car_list[0].car_card).slice(6,7);
|
|
|
+ document.getElementById("car_type1").innerHTML = car_list[0].car_type;
|
|
|
+ if(car_list[0].car_type=='包月车') {
|
|
|
+ document.getElementById("car_type1").style.color='#29e122'
|
|
|
+ } else if(car_list[0].car_type=='预约车') {
|
|
|
+ document.getElementById("car_type1").style.color='#3388f9'
|
|
|
+ }else if(car_list[0].car_type=='免费车') {
|
|
|
+ document.getElementById("car_type1").style.color='#FFFFFF'
|
|
|
+ }else if(car_list[0].car_type=='VIP车') {
|
|
|
+ document.getElementById("car_type1").style.color='#2BFFDF'
|
|
|
+ }
|
|
|
+
|
|
|
+ document.getElementById("car_card_txt21").innerHTML = (car_list[1].car_card).slice(0,1);
|
|
|
+ document.getElementById("car_card_txt22").innerHTML = (car_list[1].car_card).slice(1,2);
|
|
|
+ document.getElementById("car_card_txt23").innerHTML = (car_list[1].car_card).slice(2,3);
|
|
|
+ document.getElementById("car_card_txt24").innerHTML = (car_list[1].car_card).slice(3,4);
|
|
|
+ document.getElementById("car_card_txt25").innerHTML = (car_list[1].car_card).slice(4,5);
|
|
|
+ document.getElementById("car_card_txt26").innerHTML = (car_list[1].car_card).slice(5,6);
|
|
|
+ document.getElementById("car_card_txt27").innerHTML = (car_list[1].car_card).slice(6,7);
|
|
|
+ document.getElementById("car_type2").innerHTML = car_list[1].car_type;
|
|
|
+ if(car_list[1].car_type=='包月车') {
|
|
|
+ document.getElementById("car_type1").style.color='#29e122'
|
|
|
+ } else if(car_list[1].car_type=='预约车') {
|
|
|
+ document.getElementById("car_type1").style.color='#3388f9'
|
|
|
+ }else if(car_list[1].car_type=='免费车') {
|
|
|
+ document.getElementById("car_type1").style.color='#FFFFFF'
|
|
|
+ }else if(car_list[1].car_type=='VIP车') {
|
|
|
+ document.getElementById("car_type1").style.color='#2BFFDF'
|
|
|
+ }
|
|
|
+
|
|
|
+ document.getElementById("car_card_txt31").innerHTML = (car_list[2].car_card).slice(0,1);
|
|
|
+ document.getElementById("car_card_txt32").innerHTML = (car_list[2].car_card).slice(1,2);
|
|
|
+ document.getElementById("car_card_txt33").innerHTML = (car_list[2].car_card).slice(2,3);
|
|
|
+ document.getElementById("car_card_txt34").innerHTML = (car_list[2].car_card).slice(3,4);
|
|
|
+ document.getElementById("car_card_txt35").innerHTML = (car_list[2].car_card).slice(4,5);
|
|
|
+ document.getElementById("car_card_txt36").innerHTML = (car_list[2].car_card).slice(5,6);
|
|
|
+ document.getElementById("car_card_txt37").innerHTML = (car_list[2].car_card).slice(6,7);
|
|
|
+ document.getElementById("car_type3").innerHTML = car_list[2].car_type;
|
|
|
+ if(car_list[2].car_type=='包月车') {
|
|
|
+ document.getElementById("car_type1").style.color='#29e122'
|
|
|
+ } else if(car_list[2].car_type=='预约车') {
|
|
|
+ document.getElementById("car_type1").style.color='#3388f9'
|
|
|
+ }else if(car_list[2].car_type=='免费车') {
|
|
|
+ document.getElementById("car_type1").style.color='#FFFFFF'
|
|
|
+ }else if(car_list[2].car_type=='VIP车') {
|
|
|
+ document.getElementById("car_type1").style.color='#2BFFDF'
|
|
|
+ }
|
|
|
+
|
|
|
+ document.getElementById("car_card_txt41").innerHTML = (car_list[3].car_card).slice(0,1);
|
|
|
+ document.getElementById("car_card_txt42").innerHTML = (car_list[3].car_card).slice(1,2);
|
|
|
+ document.getElementById("car_card_txt43").innerHTML = (car_list[3].car_card).slice(2,3);
|
|
|
+ document.getElementById("car_card_txt44").innerHTML = (car_list[3].car_card).slice(3,4);
|
|
|
+ document.getElementById("car_card_txt45").innerHTML = (car_list[3].car_card).slice(4,5);
|
|
|
+ document.getElementById("car_card_txt46").innerHTML = (car_list[3].car_card).slice(5,6);
|
|
|
+ document.getElementById("car_card_txt47").innerHTML = (car_list[3].car_card).slice(6,7);
|
|
|
+ document.getElementById("car_type4").innerHTML = car_list[3].car_type;
|
|
|
+ if(car_list[3].car_type=='包月车') {
|
|
|
+ document.getElementById("car_type1").style.color='#29e122'
|
|
|
+ } else if(car_list[3].car_type=='预约车') {
|
|
|
+ document.getElementById("car_type1").style.color='#3388f9'
|
|
|
+ }else if(car_list[3].car_type=='免费车') {
|
|
|
+ document.getElementById("car_type1").style.color='#FFFFFF'
|
|
|
+ }else if(car_list[3].car_type=='VIP车') {
|
|
|
+ document.getElementById("car_type1").style.color='#2BFFDF'
|
|
|
+ }
|
|
|
+
|
|
|
+ document.getElementById("car_card_txt51").innerHTML = (car_list[4].car_card).slice(0,1);
|
|
|
+ document.getElementById("car_card_txt52").innerHTML = (car_list[4].car_card).slice(1,2);
|
|
|
+ document.getElementById("car_card_txt53").innerHTML = (car_list[4].car_card).slice(2,3);
|
|
|
+ document.getElementById("car_card_txt54").innerHTML = (car_list[4].car_card).slice(3,4);
|
|
|
+ document.getElementById("car_card_txt55").innerHTML = (car_list[4].car_card).slice(4,5);
|
|
|
+ document.getElementById("car_card_txt56").innerHTML = (car_list[4].car_card).slice(5,6);
|
|
|
+ document.getElementById("car_card_txt57").innerHTML = (car_list[4].car_card).slice(6,7);
|
|
|
+ document.getElementById("car_type5").innerHTML = car_list[4].car_type;
|
|
|
+ if(car_list[4].car_type=='包月车') {
|
|
|
+ document.getElementById("car_type1").style.color='#29e122'
|
|
|
+ } else if(car_list[4].car_type=='预约车') {
|
|
|
+ document.getElementById("car_type1").style.color='#3388f9'
|
|
|
+ }else if(car_list[4].car_type=='免费车') {
|
|
|
+ document.getElementById("car_type1").style.color='#FFFFFF'
|
|
|
+ }else if(car_list[4].car_type=='VIP车') {
|
|
|
+ document.getElementById("car_type1").style.color='#2BFFDF'
|
|
|
+ }
|
|
|
+
|
|
|
+ document.getElementById("car_card_txt61").innerHTML = (car_list[5].car_card).slice(0,1);
|
|
|
+ document.getElementById("car_card_txt62").innerHTML = (car_list[5].car_card).slice(1,2);
|
|
|
+ document.getElementById("car_card_txt63").innerHTML = (car_list[5].car_card).slice(2,3);
|
|
|
+ document.getElementById("car_card_txt64").innerHTML = (car_list[5].car_card).slice(3,4);
|
|
|
+ document.getElementById("car_card_txt65").innerHTML = (car_list[5].car_card).slice(4,5);
|
|
|
+ document.getElementById("car_card_txt66").innerHTML = (car_list[5].car_card).slice(5,6);
|
|
|
+ document.getElementById("car_card_txt67").innerHTML = (car_list[5].car_card).slice(6,7);
|
|
|
+ document.getElementById("car_type6").innerHTML = car_list[5].car_type;
|
|
|
+ if(car_list[5].car_type=='包月车') {
|
|
|
+ document.getElementById("car_type1").style.color='#29e122'
|
|
|
+ } else if(car_list[5].car_type=='预约车') {
|
|
|
+ document.getElementById("car_type1").style.color='#3388f9'
|
|
|
+ }else if(car_list[5].car_type=='免费车') {
|
|
|
+ document.getElementById("car_type1").style.color='#FFFFFF'
|
|
|
+ }else if(car_list[5].car_type=='VIP车') {
|
|
|
+ document.getElementById("car_type1").style.color='#2BFFDF'
|
|
|
+ }
|
|
|
+ };
|
|
|
+ //关闭事件
|
|
|
+ socket.onclose = function() {
|
|
|
+ console.log("Socket已关闭");
|
|
|
+ };
|
|
|
+ //发生了错误事件
|
|
|
+ socket.onerror = function() {
|
|
|
+ alert("Socket发生了错误");
|
|
|
+ //此时可以尝试刷新页面
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<script type="text/javascript">
|
|
|
+ function tianqi() {
|
|
|
+ var url = "https://restapi.amap.com/v3/weather/weatherInfo?key=5411d59a86689ed2053d7e7a224ea1a6&city=360925&extensions=all";
|
|
|
+ $.ajax({
|
|
|
+ url: url,
|
|
|
+ type: 'GET',
|
|
|
+ dataType: 'JSON',
|
|
|
+ success: function (result) {
|
|
|
+ var City = result.data.forecasts[0]
|
|
|
+ if(result.data.forecasts[0].reporttime.slice(11,13)<19) {
|
|
|
+ document.getElementById("weather").innerHTML = City.casts[0].dayweather
|
|
|
+ document.getElementById("wendu").innerHTML = City.casts[0].daytemp
|
|
|
+ }else{
|
|
|
+ document.getElementById("weather").innerHTML = City.casts[0].dayweather
|
|
|
+ document.getElementById("wendu").innerHTML = City.casts[0].daytemp
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error: function (msg) {
|
|
|
+ console.log('接口出错')
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+</script>
|
|
|
+</body>
|
|
|
+</html>
|
