xinyouhe/dashboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改数据显示

Browse Source
This commit is contained in:
浅念
2025-06-16 13:42:45 +08:00
parent 7cc53f7866
commit 0e1f0c47fa
8 changed files with 82 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/style.css
+54 -73
View File
@@ -18,7 +18,7 @@ body {
body { body {
color: #fff; color: #fff;
font-size: 16px; font-size: 1rem;
} }
#world { #world {
@@ -31,13 +31,12 @@ body {
padding: 0px; padding: 0px;
margin: 0px; margin: 0px;
} }
.cont { .cont {
color: white; color: white;
} }
.title { .title {
font-size: 32px; font-size: 2rem;
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
background-image: url(../img/headBg.png); background-image: url(../img/headBg.png);
@@ -58,6 +57,8 @@ body {
top: 97px; top: 97px;
left: 0px; left: 0px;
width: 370px; width: 370px;
/* min-width: 370px; */
/* width: 20%; */
} }
.right { .right {
@@ -68,6 +69,8 @@ body {
top: 97px; top: 97px;
right: 0px; right: 0px;
width: 370px; width: 370px;
/* min-width: 370px; */
/* width: 20%; */
} }
.toggle2 { .toggle2 {
@@ -139,7 +142,7 @@ body {
.times p:nth-child(1) span { .times p:nth-child(1) span {
display: block; display: block;
font-size: 14px; font-size: 0.875rem;
opacity: 0.5; opacity: 0.5;
line-height: 1; line-height: 1;
text-transform: uppercase; text-transform: uppercase;
@@ -151,7 +154,7 @@ body {
} }
.times p:nth-child(2) span { .times p:nth-child(2) span {
font-size: 25px; font-size: 1.5625rem;
letter-spacing: -2px; letter-spacing: -2px;
position: relative; position: relative;
color: rgba(255, 255, 255, .75); color: rgba(255, 255, 255, .75);
@@ -160,7 +163,7 @@ body {
} }
.times p i { .times p i {
font-size: 42px; font-size: 2.625rem;
font-weight: lighter; font-weight: lighter;
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
font-weight: bolder; font-weight: bolder;
@@ -168,7 +171,7 @@ body {
.times p:nth-child(3) span { .times p:nth-child(3) span {
display: block; display: block;
font-size: 13px; font-size: 0.8125rem;
opacity: .5; opacity: .5;
text-align: right text-align: right
} }
@@ -214,7 +217,7 @@ body {
} }
.tit { .tit {
font-size: 18px; font-size: 1.125rem;
font-weight: 500; font-weight: 500;
color: #fff; color: #fff;
font-weight: bolder; font-weight: bolder;
@@ -277,7 +280,7 @@ body {
} }
.all span { .all span {
font-size: 40px; font-size: 2.5rem;
border-radius: 4px; border-radius: 4px;
font-weight: bold; font-weight: bold;
color: #fff; color: #fff;
@@ -298,15 +301,15 @@ body {
} }
.citylist li p { .citylist li p {
font-size: 0.9375rem;
color: rgba(255, 255, 255, .8); color: rgba(255, 255, 255, .8);
font-size: 15px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin-bottom: 5px; margin-bottom: 5px;
} }
.citylist li span { .citylist li span {
font-size: 12px; font-size: 0.75rem;
opacity: .4; opacity: .4;
} }
@@ -393,7 +396,7 @@ body {
.select-selected:after { .select-selected:after {
content: "▼"; content: "▼";
font-size: 12px; font-size: 0.75rem;
color: #6c757d; color: #6c757d;
} }
@@ -473,17 +476,18 @@ body {
object-position: center; object-position: center;
} }
.carmsg p{ .carmsg p{
line-height: 35px; font-size: 0.875rem;
color: #666;
margin-bottom: 4px;
background: linear-gradient(to bottom, #fff, rgb(6 244 255)); background: linear-gradient(to bottom, #fff, rgb(6 244 255));
-webkit-background-clip: text; -webkit-background-clip: text;
background-clip: text; background-clip: text;
color: transparent;
} }
.cartitle{ .cartitle{
padding-top: 20px; padding-top: 20px;
height:85px; height:85px;
text-align: center; text-align: center;
font-size: 17px; font-size: 1rem;
font-weight: bold; font-weight: bold;
background: linear-gradient(to bottom, #fff, rgb(6 244 255)); background: linear-gradient(to bottom, #fff, rgb(6 244 255));
-webkit-background-clip: text; -webkit-background-clip: text;
@@ -494,12 +498,12 @@ body {
.toggle-btn { .toggle-btn {
font-size: 0.875rem;
display: inline-block; display: inline-block;
margin-top: 10px; margin-top: 10px;
padding: 8px 15px; padding: 8px 15px;
color: white; color: white;
cursor: pointer; cursor: pointer;
font-size: 14px;
transition: all 0.3s; transition: all 0.3s;
display: flex; display: flex;
justify-content: center; justify-content: center;
@@ -552,9 +556,8 @@ body {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
font-size: 12px; font-size: 0.75rem;
padding: 5px 5px; padding: 5px 5px;
background: linear-gradient(to bottom, #1487ea, #0a43bc);
color: #fff; color: #fff;
border: none; border: none;
border-radius: 4px; border-radius: 4px;
@@ -616,14 +619,10 @@ body {
} }
.modal-title { .modal-title {
flex: 1; font-size: 1.25rem;
text-align: center;
font-size: 20px;
font-weight: bold; font-weight: bold;
/* background: linear-gradient(to bottom, #fff, rgb(6 244 255)); */ color: #333;
/* -webkit-background-clip: text; */ margin: 0;
/* background-clip: text; */
/* color: transparent; */
} }
@@ -632,10 +631,11 @@ body {
gap: 10px; gap: 10px;
margin-bottom: 20px; margin-bottom: 20px;
margin-top: 65px; margin-top: 65px;
font-size: clamp(12px, 1vw, 30px); font-size: clamp(0.75rem, 1vw, 1.875rem);
} }
.modal-tab { .modal-tab {
font-size: 0.875rem;
padding: 8px 20px; padding: 8px 20px;
background: rgba(255, 255, 255, 0.1); background: rgba(255, 255, 255, 0.1);
border-radius: 4px; border-radius: 4px;
@@ -692,8 +692,8 @@ body {
.modal-table { .modal-table {
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
/* font-size: 14px; */ font-size: 0.875rem;
font-size: clamp(10px, 1vw, 26px); /* font-size: clamp(10px, 1vw, 26px); */
} }
.modal-table thead { .modal-table thead {
@@ -762,12 +762,10 @@ body {
} }
.ship-header h3 { .ship-header h3 {
font-size: 1.125rem;
font-weight: bold;
margin: 0; margin: 0;
font-size: 18px; color: #333;
background: linear-gradient(to bottom, #fff, rgb(6 244 255));
-webkit-background-clip: text;
background-clip: text;
color: transparent;
} }
.ship-status { .ship-status {
@@ -781,7 +779,7 @@ body {
.ship-details { .ship-details {
display: grid; display: grid;
gap: 10px; gap: 10px;
font-size: clamp(12px, 1vw, 30px); font-size: clamp(0.75rem, 1vw, 1.875rem);
} }
.detail-item { .detail-item {
@@ -792,13 +790,13 @@ body {
} }
.detail-item .label { .detail-item .label {
color: rgba(255, 255, 255, 0.7); font-size: 0.875rem;
/* font-size: 14px; */ color: #666;
} }
.detail-item .value { .detail-item .value {
color: #fff; font-size: 0.875rem;
/* font-size: 14px; */ color: #333;
font-weight: 500; font-weight: 500;
} }
@@ -867,14 +865,9 @@ body {
} }
.route-time { .route-time {
width: 120px; font-size: 0.75rem;
padding-right: 20px; color: #666;
text-align: right; margin-bottom: 4px;
color: #06f4ff;
font-size: 14px;
font-weight: 500;
text-shadow: 0 0 10px rgba(6, 244, 255, 0.3);
transition: all 0.3s ease;
} }
.route-item:hover .route-time { .route-item:hover .route-time {
@@ -921,33 +914,21 @@ body {
} }
.route-title { .route-title {
font-size: 18px; font-size: 0.875rem;
font-weight: bold; font-weight: 500;
margin-bottom: 10px; color: #333;
background: linear-gradient(to bottom, #fff, rgb(6 244 255)); margin-bottom: 4px;
-webkit-background-clip: text;
background-clip: text;
color: transparent;
transition: all 0.3s ease;
} }
.route-desc { .route-desc {
font-size: 14px; font-size: 0.75rem;
color: rgba(255, 255, 255, 0.7); color: #666;
margin-bottom: 12px; margin-bottom: 4px;
line-height: 1.5;
} }
.route-status { .route-status {
display: inline-block; font-size: 0.75rem;
padding: 6px 12px; color: #666;
background: linear-gradient(45deg, #06f4ff, #00c6ff);
color: #142c64;
border-radius: 20px;
font-size: 12px;
font-weight: 500;
box-shadow: 0 2px 8px rgba(6, 244, 255, 0.3);
transition: all 0.3s ease;
} }
.route-item:hover .route-status { .route-item:hover .route-status {
@@ -1018,7 +999,7 @@ body {
border-radius: 2px; border-radius: 2px;
cursor: pointer; cursor: pointer;
transition: all 0.3s ease; transition: all 0.3s ease;
font-size: 14px; font-size: 0.875rem;
color: #fff; color: #fff;
padding: 0 8px; padding: 0 8px;
} }
@@ -1055,7 +1036,7 @@ body {
padding: 20px 50px; padding: 20px 50px;
color: #fff; color: #fff;
height: 58%; height: 58%;
font-size: clamp(12px, 1vw, 30px); font-size: clamp(0.75rem, 1vw, 1.875rem);
min-height: 510px; min-height: 510px;
max-height: 510px; max-height: 510px;
} }
@@ -1072,7 +1053,7 @@ body {
} }
.modal-close div{ .modal-close div{
background-color: #00a6c9; background-color: #00a6c9;
font-size: clamp(12px, 1vw, 30px); font-size: clamp(0.75rem, 1vw, 1.875rem);
padding: 8px 30px; padding: 8px 30px;
border-radius: 4px; border-radius: 4px;
} }
@@ -1110,7 +1091,7 @@ body {
/* font-size: 14px; */ /* font-size: 14px; */
} }
.carinfos .cartitlet{ .carinfos .cartitlet{
font-size: 16px; font-size: 1rem;
font-weight: bold; font-weight: bold;
background: linear-gradient(to bottom, #fff, rgb(6 244 255)); background: linear-gradient(to bottom, #fff, rgb(6 244 255));
-webkit-background-clip: text; -webkit-background-clip: text;
@@ -1144,7 +1125,7 @@ body {
} }
.infotimes{ .infotimes{
display: flex; display: flex;
margin-top: 10px; margin-top: 25px;
} }
.infotimes div{ .infotimes div{
width: 49%; width: 49%;
@@ -1197,7 +1178,7 @@ body {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
font-size: 12px; font-size: 0.75rem;
padding: 5px 5px; padding: 5px 5px;
color: #fff; color: #fff;
border: none; border: none;
index.html
+8
View File
@@ -215,6 +215,14 @@
<span class="label" data-i18n="latitude"></span> <span class="label" data-i18n="latitude"></span>
<span class="value latitude"></span> <span class="value latitude"></span>
</div> </div>
<div class="detail-item">
<span class="label" data-i18n="Nextstation"></span>
<span class="value Nextstation"></span>
</div>
<div class="detail-item">
<span class="label" data-i18n="Nexttime"></span>
<span class="value Nexttime"></span>
</div>
<div class="detail-item"> <div class="detail-item">
<span class="label" data-i18n="destinationc"></span> <span class="label" data-i18n="destinationc"></span>
<span class="value destinationc"></span> <span class="value destinationc"></span>
js/i18n.js
+3
View File
@@ -281,6 +281,9 @@ const i18n = {
// 显示当前选择 // 显示当前选择
localStorage.setItem('langtext', selectedText); localStorage.setItem('langtext', selectedText);
that.toggleLanguage($(this).attr('data-id')) that.toggleLanguage($(this).attr('data-id'))
document.querySelectorAll('.statusbtn > div').forEach(b => b.classList.remove('active'));
// 为当前点击的按钮添加 active 类
$(".statusall").addClass('active');
currentPage =1 currentPage =1
Vehiclefn($(this).attr('data-id')) Vehiclefn($(this).attr('data-id'))
locationfn($(this).attr('data-id'),'') locationfn($(this).attr('data-id'),'')
js/lang/ar.json
+2
View File
@@ -28,6 +28,8 @@
"latitude":"العرض", "latitude":"العرض",
"destinationc":"المقصد", "destinationc":"المقصد",
"yujidaodashijian":"الوقت المتوقع للوصول", "yujidaodashijian":"الوقت المتوقع للوصول",
"Nextstation":"المحطة التالية",
"Nexttime":"٢ دقيقة",
"history":"التاريخ", "history":"التاريخ",
"detail":"التفاصيل", "detail":"التفاصيل",
"prevPage":"الصفحة السابقة", "prevPage":"الصفحة السابقة",
js/lang/en.json
+2
View File
@@ -28,6 +28,8 @@
"latitude":"Latitude", "latitude":"Latitude",
"destinationc":"Destination", "destinationc":"Destination",
"yujidaodashijian":"Estimated arrival time", "yujidaodashijian":"Estimated arrival time",
"Nextstation":"Next station",
"Nexttime":"Next Stop Arrival",
"history":"History", "history":"History",
"detail":"Detail", "detail":"Detail",
"prevPage":"Previous page", "prevPage":"Previous page",
js/lang/ru.json
+2
View File
@@ -27,6 +27,8 @@
"latitude":"Широта", "latitude":"Широта",
"destinationc":"Пункт назначения", "destinationc":"Пункт назначения",
"yujidaodashijian":"Ожидаемое время прибытия", "yujidaodashijian":"Ожидаемое время прибытия",
"Nextstation":"Следующая станция",
"Nexttime":"Прибытие",
"history":"История", "history":"История",
"detail":"Подробнее", "detail":"Подробнее",
"close":"Закрыть", "close":"Закрыть",
js/lang/zh.json
+2
View File
@@ -28,6 +28,8 @@
"latitude":"纬度", "latitude":"纬度",
"destinationc":"目的地", "destinationc":"目的地",
"yujidaodashijian":"预计到达时间", "yujidaodashijian":"预计到达时间",
"Nextstation":"下一站",
"Nexttime":"下站预计到达时间",
"history":"历史记录", "history":"历史记录",
"detail":"详细信息", "detail":"详细信息",
"prevPage":"上一页", "prevPage":"上一页",
js/public.js
+7 -4
View File
@@ -2913,8 +2913,8 @@ function Global(chinaGeoCoordMap, nameMap, isshow) {
var routePoints = shipListdatas.map(point => ({ var routePoints = shipListdatas.map(point => ({
name: point.ship_name, name: point.ship_name,
id: point.id, id: point.id,
dest: point.dest, dest: point.port,
eta: point.eta, eta: point.last_time,
value:[point.lng,point.lat], value:[point.lng,point.lat],
num:point.count, num:point.count,
symbol: 'image://img/luncx.png', symbol: 'image://img/luncx.png',
@@ -3730,8 +3730,11 @@ function Vehicleshipfn(id,lang){
$(".callsign").html(shipinfo.call_sign) $(".callsign").html(shipinfo.call_sign)
$(".longitude").html(shipinfo.lng) $(".longitude").html(shipinfo.lng)
$(".latitude").html(shipinfo.lat) $(".latitude").html(shipinfo.lat)
$(".destinationc").html(shipinfo.dest) $(".destinationc").html(shipinfo.port)
$(".yujidaodashijian").html(shipinfo.eta_utc) $(".yujidaodashijian").html(shipinfo.last_time)
$(".Nextstation").html(shipinfo.dest)
$(".Nexttime").html(shipinfo.eta)
var shiphis = result.data.ship_his; var shiphis = result.data.ship_his;
const routetimeline = document.getElementById('routetimeline'); const routetimeline = document.getElementById('routetimeline');
if(shiphis.length>0){ if(shiphis.length>0){