From 747a2cf34e8b7f5ac5b45bff67e0cb3beb12bf9c Mon Sep 17 00:00:00 2001
From: tk <szdot@live.com>
Date: Tue, 23 Jul 2024 21:11:36 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90=E7=B1=BB=20=20=E5=9E=8B=E3=80=91?=
 =?UTF-8?q?=EF=BC=9Afeat=20=E7=94=B5=E9=87=8F=E6=98=BE=E7=A4=BA=E6=8E=A7?=
 =?UTF-8?q?=E4=BB=B6=20=E3=80=90=E5=8E=9F=20=20=E5=9B=A0=E3=80=91=EF=BC=9A?=
 =?UTF-8?q?=E6=98=BE=E7=A4=BA=E7=94=B5=E9=87=8F=E6=80=BB=E9=87=8F=20?=
 =?UTF-8?q?=E5=89=A9=E4=BD=99=E9=87=8F=20=20=E8=BF=94=E8=88=AA=E7=82=B9=20?=
 =?UTF-8?q?=E3=80=90=E8=BF=87=20=20=E7=A8=8B=E3=80=91=EF=BC=9A=20=E3=80=90?=
 =?UTF-8?q?=E5=BD=B1=20=20=E5=93=8D=E3=80=91=EF=BC=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/BatteryStatus.vue              | 43 +++++++++++++++++++
 .../layout/components/main/planes/index.vue   |  5 ++-
 2 files changed, 47 insertions(+), 1 deletion(-)
 create mode 100644 src/components/BatteryStatus.vue

diff --git a/src/components/BatteryStatus.vue b/src/components/BatteryStatus.vue
new file mode 100644
index 0000000..2a84ed3
--- /dev/null
+++ b/src/components/BatteryStatus.vue
@@ -0,0 +1,43 @@
+<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>
diff --git a/src/views/layout/components/main/planes/index.vue b/src/views/layout/components/main/planes/index.vue
index 9779d57..bf36d88 100644
--- a/src/views/layout/components/main/planes/index.vue
+++ b/src/views/layout/components/main/planes/index.vue
@@ -2,6 +2,7 @@
   <div class="h-100">
     <map-box ref="mapbox" :key="mapBoxKey" class="ofh">
       <template #content>
+        <BatteryStatus :plane="plane" />
         <!-- <PlaneStatus :plane="plane" /> -->
         <ControllerTabs :plane="plane" @mapXOffset="mapXOffset" @makeRoute="makeRoute" @clearRoute="clearRoute" />
       </template>
@@ -13,6 +14,7 @@
 import mqtt from '@/utils/mqtt'
 import MapBox from '@/components/MapBox'
 import ControllerTabs from '@/components/ControllerTabs'
+import BatteryStatus from '@/components/BatteryStatus'
 // import PlaneStatus from '@/components/PlaneStatus'
 
 export default {
@@ -26,7 +28,8 @@ export default {
   },
   components: {
     MapBox,
-    ControllerTabs
+    ControllerTabs,
+    BatteryStatus
     // PlaneStatus
   },
   computed: {