| | |
| | | <!-- 机巢状态 --> |
| | | <template> |
| | | <CommonTitle title="机巢状态" /> |
| | | <CommonTitle title="机巢状态" @details="detailsFun" /> |
| | | <div :style="{ marginLeft: pxToRem(14) }"> |
| | | <div class="machine-status"> |
| | | <div class="info"> |
| | |
| | | <img src="@/assets/images/signMachineNest/machineRight/distance.png" alt=""> |
| | | <span class="text">飞行距离</span> |
| | | </div> |
| | | <div class="text-data">98<span class="text">km</span></div> |
| | | <div class="text-data">{{ singleTotal.flight_mileage }}<span class="text">km</span></div> |
| | | </div> |
| | | <div class="card"> |
| | | <div> |
| | | <img src="@/assets/images/signMachineNest/machineRight/duration.png" alt=""> |
| | | <span class="text">飞行时长</span> |
| | | </div> |
| | | <div class="text-data">188<span class="text">min</span></div> |
| | | <div class="text-data">{{ singleTotal.hour_count }}<span class="text">h</span></div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <!-- <MachineTableDetails :dialogVisible="isShowDetails" /> --> |
| | | </template> |
| | | |
| | | <script setup> |
| | |
| | | import { useStore } from 'vuex'; |
| | | |
| | | const store = useStore(); |
| | | // 获取机巢信息 |
| | | let osdVisible = computed(() => store.state.home.osdVisible); |
| | | // 单个机巢统计数据 |
| | | const singleTotal = computed(() => store.state.home.singleTotal); |
| | | // 是否展示机机巢状态详情 |
| | | let isShowDetails = ref(false); |
| | | |
| | | let str = '--'; |
| | | let drone_charge_state = ref({ |
| | | capacity_percent: '--', |
| | |
| | | } |
| | | return theFinheight.toFixed(1); |
| | | }; |
| | | |
| | | // 详情 |
| | | const detailsFun = () => { |
| | | isShowDetails.value = true; |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |