lixuefeng/fengjie-datascreen
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

417

Browse Source
This commit is contained in:
duanliang
2025-04-17 20:18:38 +08:00
parent d7eeea3efe
commit 09dcabadda
23 changed files with 1302 additions and 269 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
src/views/vehicles/components/big-map.vue
View File

@@ -31,7 +31,19 @@
:key="index"
@click="handleItem(item, index)"
>
<p class="item__label">{{ item.licenseNumber }}</p>
<div class="child-box">
<p class="item__label">{{ item.licenseNumber }}</p>
<span v-if="item.type == 0" class="label_img">
车
</span>
<span v-if="item.type == 2" class="label_img">
直通车
</span>
<span class="label_img label_img_2" v-if="item.type == 1" >
船
</span>
</div>
<div class="item__value"
>{{ item.speed }}km/h
<img v-if="item.accStatus == 1" src="@/assets/images/engine.png" alt="" />
@@ -141,7 +153,6 @@ import PubSub from 'pubsub-js'
(val)=>{
list.value = val[0].map
if(val[0].map){
console.log(val[0],222222222)
tabs.value[0].leng = val[0].all.length
tabs.value[1].leng = val[0].moving.length
tabs.value[2].leng = val[0].offline.length
@@ -209,26 +220,29 @@ import PubSub from 'pubsub-js'
console.log(item,'item')
if (item.lng && item.lat) {
if (item.status == '行驶') {
if(item.type==0){
addMarker(carIcon, [item.lng, item.lat], [36, 50])
}else{
if(item.type==1){
addMarker(shipIcon, [item.lng, item.lat], [36, 50])
}else{
addMarker(carIcon, [item.lng, item.lat], [36, 50])
}
}
if (item.status == '离线') {
if(item.type==0){
addMarker(carOfflineIcon, [item.lng, item.lat], [36, 50])
}else{
if(item.type==1){
addMarker(shipOfflineIcon, [item.lng, item.lat], [36, 50])
}else{
addMarker(carOfflineIcon, [item.lng, item.lat], [36, 50])
}
}
if (item.status == '静止') {
if(item.type==0){
addMarker(carStopIcon, [item.lng, item.lat], [36, 50])
if(item.type==1){
addMarker(shipStopIcon, [item.lng, item.lat], [36, 50])
}else{
addMarker(shipStopIcon, [item.lng, item.lat], [36, 50])
addMarker(carStopIcon, [item.lng, item.lat], [36, 50])
}
}
marker.value.addEventListener('click', (e) => {
@@ -262,7 +276,7 @@ import PubSub from 'pubsub-js'
<p class='marker-title'> ${data?.licenseNumber} </p>
<div class='marker-header'>
<span class='marker-sim'> ${data?.imei} </span>
<div class='marker-tag'>
<div class='marker-tag' style="color:#fff;">
<div></div>
${data?.status} （${data?.statusTimeDesc}）
</div>
@@ -282,7 +296,7 @@ import PubSub from 'pubsub-js'
<p> ${timestampToYMD(data?.gpsTime)} </p> </div>
</div>
<div class='marker-row'>
<div class='marker-col'> <img src='${icon17}' /> <p> ${data?.speed}KM </p> </div>
<div class='marker-col'> <img src='${icon17}' /> <p> ${data?.speed}KM/H </p> </div>
</div>
<div class='marker-row'>
<div class='marker-col'>
@@ -378,6 +392,29 @@ import PubSub from 'pubsub-js'
</script>
<style lang="scss">
.child-box{
display:flex;
align-items: center;
flex:1;
height:100%;
}
.item__label{
display:flex;
align-items: center;
min-width:vw(110);
}
.label_img{
background: #0063ff;
padding:vh(5) vw(10);
border-radius:vh(2);
color:#fff;
width:vw(90);
text-align:center;
}
.label_img_2{
background: rgba(2, 249, 250, 0.5);
}
.infoBox {
> img {
width: vw(40) !important;
@@ -561,7 +598,7 @@ import PubSub from 'pubsub-js'
color: #0096ff;
display: flex;
align-items: center;
justify-content: space-between;
justify-content: flex-start;
&__value {
display: flex;
align-items: center;
@@ -585,7 +622,7 @@ import PubSub from 'pubsub-js'
}
&--active {
@extend .item__hot;
background-color: #ffffff !important;
// background-color: #ffffff !important;
}
}
&__active {