103 lines
2.6 KiB
Vue
103 lines
2.6 KiB
Vue
|
<template>
|
|||
|
|
<section>
|
|||
|
|
<nav-bar></nav-bar>
|
|||
|
|
<div class="clear site_container">
|
|||
|
|
<div class="fl left_side">
|
|||
|
|
<site-nav default_active="2" active="2-1"></site-nav>
|
|||
|
|
</div>
|
|||
|
|
<div class="fl right_side">
|
|||
|
|
<div class="right_side_box_1">
|
|||
|
|
<ul class="site_btn_box">
|
|||
|
|
<li class="site_btn">{{result.working_status}}</li>
|
|||
|
|
</ul>
|
|||
|
|
<ul class="site_btn_box">
|
|||
|
|
<li class="site_btn">{{result.vehicle_status}}</li>
|
|||
|
|
</ul>
|
|||
|
|
<ul class="site_btn_box site_btn_box_1">
|
|||
|
|
<li class="site_btn site_btn_1">X坐标：{{result.x}}</li>
|
|||
|
|
<li class="site_btn site_btn_1">Y坐标：{{result.y}}</li>
|
|||
|
|
<li class="site_btn site_btn_1">航向角：{{result.z}}</li>
|
|||
|
|
<li class="site_btn site_btn_1">下发速度：{{result.send_speed}}</li>
|
|||
|
|
<li class="site_btn site_btn_1">实际速度：{{result.real_speed}}</li>
|
|||
|
|
<li class="site_btn site_btn_1">舵轮角度：{{result.carrier}}</li>
|
|||
|
|
<li class="site_btn site_btn_1">横向偏差：{{result.landscape_deviation}}</li>
|
|||
|
|
<li class="site_btn site_btn_1">航向偏差：{{result.course_deviation}}</li>
|
|||
|
|
</ul>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</section>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import NavBar from '@components/NavBar.vue'
|
|||
|
|
import SiteNav from '@components/SiteNav.vue'
|
|||
|
|
import {queryVehicleStatus} from '@/config/getData2.js'
|
|||
|
|
export default {
|
|||
|
|
name: 'CarrySite',
|
|||
|
|
components: {
|
|||
|
|
NavBar,
|
|||
|
|
SiteNav
|
|||
|
|
},
|
|||
|
|
data () {
|
|||
|
|
return {
|
|||
|
|
interTime: this.$store.getters.setTime,
|
|||
|
|
timer: null,
|
|||
|
|
result: {}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
created () {
|
|||
|
|
this.initData()
|
|||
|
|
this.refresh()
|
|||
|
|
},
|
|||
|
|
beforeDestroy () {
|
|||
|
|
clearInterval(this.timer)
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
refresh () {
|
|||
|
|
this.timer = setInterval(() => {
|
|||
|
|
this.initData()
|
|||
|
|
}, this.interTime)
|
|||
|
|
},
|
|||
|
|
async initData () {
|
|||
|
|
let res = await queryVehicleStatus()
|
|||
|
|
if (res.code === '1') {
|
|||
|
|
this.result = res.result
|
|||
|
|
} else {
|
|||
|
|
this.toast(res.desc)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="stylus" scoped>
|
|||
|
|
@import '~@style/mixin'
|
|||
|
|
.right_side_box_1
|
|||
|
|
_wh(100%,100%)
|
|||
|
|
padding .26rem .34rem 0 .48rem
|
|||
|
|
.site_btn_box
|
|||
|
|
_wh(100%,auto)
|
|||
|
|
overflow hidden
|
|||
|
|
.site_btn_box_1
|
|||
|
|
margin-top .2rem
|
|||
|
|
_fj(flex-start)
|
|||
|
|
flex-wrap wrap
|
|||
|
|
.site_btn
|
|||
|
|
float left
|
|||
|
|
_wh(2.6rem,1rem)
|
|||
|
|
background #FFFFFF
|
|||
|
|
border 1.6px solid #54C0B3
|
|||
|
|
box-shadow 2px 0px 5px 0px rgba(222,222,222,1)
|
|||
|
|
border-radius .16rem
|
|||
|
|
_font(.32rem,1rem,#54C0B3,,center)
|
|||
|
|
margin-right .3rem
|
|||
|
|
margin-bottom .2rem
|
|||
|
|
.site_btn_1
|
|||
|
|
width 30%
|
|||
|
|
border 1.6px solid #8B90A6
|
|||
|
|
color: #696969
|
|||
|
|
margin-right 3%
|
|||
|
|
margin-bottom .24rem
|
|||
|
|
</style>
|