|
|
|
@ -36,10 +36,10 @@
|
|
|
|
|
</div>
|
|
|
|
|
<div v-for="(item,index) in TireRow" key="index" style="margin-bottom: 18px">
|
|
|
|
|
<div
|
|
|
|
|
style="vertical-align:top;width: 12.5%;margin: 0 12px; height: 100px;display: inline-block;border: 1px solid #666;border-radius: 10%"
|
|
|
|
|
:style="'vertical-align:top;width: 12.5%;margin: 0 12px; height: 100px;display: inline-block;border: 1px solid #666;border-radius: 10%'"
|
|
|
|
|
@click="getTyreInfo(`${index+1}-1-1`)">
|
|
|
|
|
<div v-if="tyreDataList.includes(`${index+1}-1-1`)"
|
|
|
|
|
style="border-radius: 10%;width:100%;height:100%;background-color:green;vertical-align:top">
|
|
|
|
|
:style="'border-radius: 10%;width:100%;height:100%;background-color:green;vertical-align:top;background-color:'+setBg(index + 1,tyreList.find(e => e.tyrePositionS === (`${index + 1}-1-1`)))">
|
|
|
|
|
<div style="white-space:nowrap;width: 100%;color:#fff;font-size: 0.7vw;line-height: 50px">
|
|
|
|
|
<div class="icon1"/>
|
|
|
|
|
{{
|
|
|
|
@ -61,7 +61,7 @@
|
|
|
|
|
:style="'vertical-align: top;width: 12.5%;margin: 0 12px; height: 100px;display: inline-block;border: 1px solid'+ (TireRow[index] === 2 ? '#666;' :'rgba(0,0,0,0);') + 'border-radius: 10%'"
|
|
|
|
|
@click="getTyreInfo(`${index+1}-1-2`)">
|
|
|
|
|
<div v-if="tyreDataList.includes(`${index+1}-1-2`)"
|
|
|
|
|
style="border-radius: 10%;width:100%;height:100%;background-color:green;vertical-align: top">
|
|
|
|
|
:style="'border-radius: 10%;width:100%;height:100%;background-color:green;vertical-align: top;background-color:'+setBg(index + 1,tyreList.find(e => e.tyrePositionS === (`${index + 1}-1-2`)))">
|
|
|
|
|
<div style="white-space:nowrap;width: 100%;color:#fff;font-size: 0.7vw;line-height: 50px">
|
|
|
|
|
<div class="icon1"/>
|
|
|
|
|
{{
|
|
|
|
@ -83,7 +83,7 @@
|
|
|
|
|
:style="'vertical-align: top;width: 12.5%;margin: 0 12px; height: 100px;display: inline-block;border: 1px solid '+ (TireRow[index] === 2 ? '#666' :'rgba(0,0,0,0)') +';border-radius: 10%'"
|
|
|
|
|
@click="getTyreInfo(`${index+1}-2-2`)">
|
|
|
|
|
<div v-if="tyreDataList.includes(`${index+1}-2-2`)"
|
|
|
|
|
style="border-radius: 10%;width:100%;height:100%;background-color:green;vertical-align:top">
|
|
|
|
|
:style="'border-radius: 10%;width:100%;height:100%;background-color:green;vertical-align:top;background-color:'+setBg(index + 1,tyreList.find(e => e.tyrePositionS === (`${index + 1}-2-2`)))">
|
|
|
|
|
<div style="white-space:nowrap;width: 100%;color:#fff;font-size: 0.7vw;line-height: 50px">
|
|
|
|
|
<div class="icon1"/>
|
|
|
|
|
{{
|
|
|
|
@ -103,7 +103,7 @@
|
|
|
|
|
style="vertical-align: top;width: 12.5%;margin: 0 12px; height: 100px;display: inline-block;border: 1px solid #666;border-radius: 10%"
|
|
|
|
|
@click="getTyreInfo(`${index+1}-2-1`)">
|
|
|
|
|
<div v-if="tyreDataList.includes(`${index+1}-2-1`)"
|
|
|
|
|
style="border-radius: 10%;width:100%;height:100%;background-color:green;vertical-align:top">
|
|
|
|
|
:style="'border-radius: 10%;width:100%;height:100%;background-color:green;vertical-align:top;background-color:'+setBg(index + 1,tyreList.find(e => e.tyrePositionS === (`${index + 1}-2-1`)))">
|
|
|
|
|
<div style="white-space:nowrap;width: 100%;color:#fff;font-size: 0.7vw;line-height: 50px">
|
|
|
|
|
<div class="icon1"/>
|
|
|
|
|
{{
|
|
|
|
@ -284,6 +284,28 @@ const markers = ref(null)
|
|
|
|
|
const tyreInfo = ref({})
|
|
|
|
|
const childrenList = ref([])
|
|
|
|
|
|
|
|
|
|
const setBg = (index, e) => {
|
|
|
|
|
if (!e) return
|
|
|
|
|
if(parseFloat(e.temperature)>e.temperature_high){
|
|
|
|
|
return 'rgb(248,213,104)'
|
|
|
|
|
}
|
|
|
|
|
if (index === 1) {
|
|
|
|
|
if(parseFloat(e.pressure)>e.z1_pressure_high){
|
|
|
|
|
return 'rgb(136, 8, 8)'
|
|
|
|
|
}
|
|
|
|
|
if(parseFloat(e.pressure)<e.z1_pressure_low){
|
|
|
|
|
return 'rgb(170, 255, 0)'
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
if(parseFloat(e.pressure)>e.z_pressure_high){
|
|
|
|
|
return 'rgb(136, 8, 8)'
|
|
|
|
|
}
|
|
|
|
|
if(parseFloat(e.pressure)<e.z_pressure_low){
|
|
|
|
|
return 'rgb(170, 255, 0)'
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const getTyreInfo = (e) => {
|
|
|
|
|
console.log(e)
|
|
|
|
|
console.log(tyreList.value)
|
|
|
|
@ -427,6 +449,7 @@ function handleQuery() {
|
|
|
|
|
|
|
|
|
|
getList();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const toGPS = () => {
|
|
|
|
|
proxy.$tab.openPage("/GPS/tyre" + "?id=" + tyreInfo.value.id, "/GPS")
|
|
|
|
|
}
|
|
|
|
|