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

类型：开发

Browse Source 
描述：
This commit is contained in:
lixuefeng
2025-04-29 09:55:46 +08:00
parent 67ebc1cb97
commit 3c512c9c34
3 changed files with 77 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/views/home/components/box-3.vue
View File

@@ -116,7 +116,7 @@
</el-carousel-item>
</el-carousel>
</blcok>
</div>
</div>
</div>
@@ -375,12 +375,12 @@
}
.success {
color: #02F9FA;
// color:#E21B1B;
}
.type3{
color: #02F9FA;
color: #F75000;
}
}
}

63
src/views/scenic/components/big-map.vue
View File

@@ -34,18 +34,18 @@
<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 v-if="item.type == 2" class="label_img label_img_0">
直通车
</span>
<span class="label_img label_img_2" v-if="item.type == 1" >
船
</span>
</div>
<div class="item__value"
>{{ item.speed }}km/h
>{{ item.speed }}km/h
<img v-if="item.accStatus == 1" src="@/assets/images/engine.png" alt="" />
<img v-else src="@/assets/images/unengine.png" alt="" />
<div
@@ -183,7 +183,7 @@ let tabsIndex = ref(0)
listTabs.value = val[0].offline
}
return false
},
{ immediate: true }
)
@@ -192,23 +192,23 @@ let tabsIndex = ref(0)
(val) => {
if (val[0]&&val[1]) {
if(carOverlays.value.length){
for(let i=0;i<carOverlays.value.length;i++){
for(let j=0;j<list.value.length;j++){
let carOverlay = carOverlays.value[i]
let car = list.value[j]
if (carOverlay && car && carOverlays.value[i].sim == car.sim) {
carOverlays.value[i].setPosition({
lng: car.lng,
lat: car.lat
})
continue
}
}
}
// 更新车辆infobox位置和内容
for (let i = 0; i < list.value.length; i++) {
@@ -226,8 +226,8 @@ let tabsIndex = ref(0)
break
}
}
}else{
list.value.map((item, i) => {
console.log(item,'item')
@@ -235,16 +235,16 @@ let tabsIndex = ref(0)
// if (item.status == '行驶') {
// if(item.type==1){
// addMarker(shipIcon, [item.lng, item.lat], [36, 50])
// }else{
// addMarker(carIcon, [item.lng, item.lat], [36, 50])
// }
// }
if (item.accStatus == 1) {
if(item.type==1){
addMarker(shipIcon, [item.lng, item.lat], [36, 50])
}else{
addMarker(carIcon, [item.lng, item.lat], [36, 50])
}
@@ -253,15 +253,15 @@ let tabsIndex = ref(0)
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==1){
addMarker(shipOfflineIcon, [item.lng, item.lat], [36, 50])
}else{
addMarker(carOfflineIcon, [item.lng, item.lat], [36, 50])
}
@@ -272,8 +272,8 @@ let tabsIndex = ref(0)
// }
}
}
marker.value.addEventListener('click', (e) => {
e.sim = e.target.sim
currentMarker.value = carOverlays.value.find(
@@ -285,9 +285,9 @@ let tabsIndex = ref(0)
marker.value.sim = item.sim
carOverlays.value[i] = marker.value
}
})
})
}
}
},
{ immediate: true }
@@ -306,8 +306,8 @@ let tabsIndex = ref(0)
<p class='marker-title'> ${data?.licenseNumber} </p>
<div class='marker-header'>
<span class='marker-sim'> ${data?.imei} </span>
<div class='marker-tag' style="color:#fff;">
<div></div>
<div class='marker-tag' style="color:#fff;">
<div></div>
${data?.status} （${data?.statusTimeDesc}）
</div>
</div>
@@ -316,20 +316,20 @@ let tabsIndex = ref(0)
<div class='marker-col'>
<img src='${icon13}' />
<p> ${data?.contactUser} </p> </div>
<div class='marker-col'>
<img src='${icon14}' /> <p> ${data?.contactTel} </p>
<div class='marker-col'>
<img src='${icon14}' /> <p> ${data?.contactTel} </p>
</div>
</div>
<div class='marker-row'>
<div class='marker-col'>
<img src='${icon15}' />
<div class='marker-col'>
<img src='${icon15}' />
<p> ${timestampToYMD(data?.gpsTime)} </p> </div>
</div>
<div class='marker-row'>
<div class='marker-col'> <img src='${icon17}' /> <p> ${data?.speed}KM/H </p> </div>
</div>
<div class='marker-row'>
<div class='marker-col'>
<div class='marker-col'>
<img src='${icon19}' /> <p> ${data?.lng},${data?.lat} </p> </div>
</div>
<div class='marker-row'>
@@ -431,8 +431,11 @@ let tabsIndex = ref(0)
color:#fff;
width:vw(90);
text-align:center;
}
.label_img_0{
background: #FF9D6F;
}
.label_img_2{
background: rgba(2, 249, 250, 0.5);
}

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

@@ -7,15 +7,15 @@
<div class="tabs-box">
<title2 title="车船" />
<div class="tabs-list">
<div class="t-item"
<div class="t-item"
style="cursor: pointer;"
v-for="(item,index) in tabsList"
v-for="(item,index) in tabsList"
:class="tabsListIndex==index?'tabs-active':''"
@click="handleTabsList(item)"
:key="item.id">{{item.text}}</div>
</div>
</div>
<el-input
v-model="keyword"
clearable
@@ -44,22 +44,22 @@
>
<div class="child-box new-item">
<p class="item__label">{{ item.licenseNumber }}</p>
</div>
<div class="new-item">
<span v-if="item.type == 0" class="label_img">
车
观光车
</span>
<span v-if="item.type == 2" class="label_img">
<span v-if="item.type == 2" class="label_img label_img_0">
直通车
</span>
<span class="label_img label_img_2" v-if="item.type == 1" >
船
</span>
</div>
<div class="item__value new-item"
>{{ item.speed }}km/h
>{{ item.speed }}km/h
<img v-if="item.accStatus == 1" src="@/assets/images/engine.png" alt="" />
<img v-else src="@/assets/images/unengine.png" alt="" />
<div
@@ -101,7 +101,7 @@
import icon18 from '@/assets/images/icon-18.png'
import icon19 from '@/assets/images/icon-19.png'
import icon20 from '@/assets/images/icon-20.png'
import { useMap } from '@/hooks/map'
import PubSub from 'pubsub-js'
import { debounce } from 'lodash'
@@ -111,7 +111,7 @@ import PubSub from 'pubsub-js'
let tabsList = ref([
{id:0,text:'所有',scenicSpotId:''},
{id:1,text:'白帝城·瞿塘峡',scenicSpotId:'root000000'},
{id:2,text:'三峡之巅',scenicSpotId:'三峡之巅'},
{id:2,text:'三峡之巅',scenicSpotId:'root00000000'},
{id:3,text:'直通车',scenicSpotId:'奉节县'}
])
let tabsListIndex = ref(0)
@@ -198,28 +198,28 @@ import PubSub from 'pubsub-js'
},
{ immediate: true }
)
watch(
() => [list.value,map.value],
(val) => {
if (val[0]&&val[1]) {
if(carOverlays.value.length){
for(let i=0;i<carOverlays.value.length;i++){
for(let j=0;j<list.value.length;j++){
let carOverlay = carOverlays.value[i]
let car = list.value[j]
if (carOverlay && car && carOverlays.value[i].sim == car.sim) {
carOverlays.value[i].setPosition({
lng: car.lng,
lat: car.lat
})
continue
}
}
}
// 更新车辆infobox位置和内容
@@ -238,18 +238,18 @@ import PubSub from 'pubsub-js'
break
}
}
}else{
list.value.map((item, i) => {
// console.log(item,'item')
if (item.lng && item.lat) {
// if (item.status == '行驶') {
// console.log(item,'8888888888888888')
// if(item.type==1){
// addMarker(shipIcon, [item.lng, item.lat], [36, 50])
// }else{
// addMarker(carIcon, [item.lng, item.lat], [36, 50])
// }
@@ -257,7 +257,7 @@ import PubSub from 'pubsub-js'
if (item.accStatus == 1) {
if(item.type==1){
addMarker(shipIcon, [item.lng, item.lat], [36, 50])
}else{
addMarker(carIcon, [item.lng, item.lat], [36, 50])
}
@@ -265,22 +265,22 @@ import PubSub from 'pubsub-js'
if (item.status == '离线') {
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==1){
addMarker(shipOfflineIcon, [item.lng, item.lat], [36, 50])
}else{
addMarker(carOfflineIcon, [item.lng, item.lat], [36, 50])
}
// if(item.type==1){
// addMarker(shipStopIcon, [item.lng, item.lat], [36, 50])
// }else{
// addMarker(carStopIcon, [item.lng, item.lat], [36, 50])
// }
@@ -297,9 +297,9 @@ import PubSub from 'pubsub-js'
marker.value.sim = item.sim
carOverlays.value[i] = marker.value
}
})
})
}
}
},
{ immediate: true }
@@ -317,8 +317,8 @@ 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' style="color:#fff;">
<div></div>
<div class='marker-tag' style="color:#fff;">
<div></div>
${data?.status} （${data?.statusTimeDesc}）
</div>
</div>
@@ -327,20 +327,20 @@ import PubSub from 'pubsub-js'
<div class='marker-col'>
<img src='${icon13}' />
<p> ${data?.contactUser} </p> </div>
<div class='marker-col'>
<img src='${icon14}' /> <p> ${data?.contactTel} </p>
<div class='marker-col'>
<img src='${icon14}' /> <p> ${data?.contactTel} </p>
</div>
</div>
<div class='marker-row'>
<div class='marker-col'>
<img src='${icon15}' />
<div class='marker-col'>
<img src='${icon15}' />
<p> ${timestampToYMD(data?.gpsTime)} </p> </div>
</div>
<div class='marker-row'>
<div class='marker-col'> <img src='${icon17}' /> <p> ${data?.speed}KM/H </p> </div>
</div>
<div class='marker-row'>
<div class='marker-col'>
<div class='marker-col'>
<img src='${icon19}' /> <p> ${data?.lng},${data?.lat} </p> </div>
</div>
<div class='marker-row'>
@@ -423,8 +423,8 @@ import PubSub from 'pubsub-js'
onMounted(() => {
initMap('big-car-ship', 109.581763,31.047573, 15)
})
onUnmounted(() => {
PubSub.unsubscribe(scenicChange)
@@ -448,7 +448,7 @@ import PubSub from 'pubsub-js'
.tabs-active{
color:#409eff;
border-bottom:1px solid #409eff;
}
}
}
@@ -471,10 +471,13 @@ import PubSub from 'pubsub-js'
width:vw(90);
text-align:center;
}
.label_img_0{
background: #FF9D6F;
}
.label_img_2{
background: rgba(2, 249, 250, 0.5);
}
.infoBox {
> img {
width: vw(40) !important;