<template>
  <div class="w-100" style="position: absolute;">
    <!-- <el-progress class="batteryBar" :percentage="plane.planeState.batteryRemaining" :show-text="false"
      stroke-width="2"></el-progress> -->
    <el-progress class="batteryBar" :percentage="80" :show-text="false" stroke-width="4"></el-progress>
    <tooltip class="rtlMark" :horizontalPosition="'20%'" backgroundColor="#ff3333">
      H
    </tooltip>
  </div>
</template>

<script>
import Tooltip from '@/components/Tag/Tooltip'

export default {
  name: 'BatteryStatus',
  data () {
    return {
    }
  },
  props: {
    plane: {
      typeof: 'Object',
      deep: true
    }
  },
  components: {
    Tooltip
  }
}
</script>

<style lang="scss" scoped>
@import "@/styles/theme.scss";

.batteryBar {
  z-index: 90;
}

.rtlMark {
  z-index: 90;
}
</style>
