地图和操作

src/pages/shells/index.vue

@@ -9,9 +9,9 @@
           <div class="state-item">自动模式</div>
           <div v-if="JSON.stringify(topInfo) !== '{}'" class="state-item">{{ topInfo.state }}</div>
           <div v-if="JSON.stringify(topInfo) !== '{}'" class="relative elec-qty-wrap" :class="{'elec-wraning': topInfo.batteryPower <= 40}">
-            <div class="absolute elec-qty" :style="{ width: topInfo.batteryPower !== -1 ? `calc(100% - ${topInfo.batteryPower}%)` : '100%' }"></div>
+            <div class="absolute elec-qty" :style="{ width: Number(topInfo.batteryPower) !== -1 ? `calc(100% - ${topInfo.batteryPower}%)` : '100%' }"></div>
             <div class="absolute elec-qty-border"></div>
-            <div class="elec-txt">{{topInfo.batteryPower !== -1 ? `${topInfo.batteryPower}%` : '0'}}</div>
+            <div class="elec-txt">{{Number(topInfo.batteryPower) !== -1 ? `${topInfo.batteryPower}%` : '0'}}</div>
           </div>
           <div v-else class="relative elec-qty-wrap elec-wraning">
             <div class="absolute elec-qty" style="width: 100%"></div>
@@ -54,7 +54,24 @@ export default {
   data () {
     return {
       timer: null,
-      topInfo: {},
+      topInfo: {
+        batteryPower: -1.0,
+        exceptionInfo: {
+          exception: ['重定位失败,检查环境或标记是否有变化.', '定位超时，尝试移动小车位置后重试.'],
+          exceptionCodes: [1, 17179869185, 1335734829057]
+        },
+        id: '1', // 车号ID
+        ip: '192.168.100.82', // 车辆IP
+        isManual: false, // 是否是手动，true是手动,false是自动
+        mapId: 39, // 地图ID
+        mapName: 'apt_map_1753078481180', // 地图名称
+        name: 'V1', // 车辆名称
+        state: '未知状态', // 车辆状态
+        stateId: 7, // 车辆状态ID
+        theta: 0.9073792099952698, // 车辆航向角
+        x: -4.030919075012207, // 车辆x坐标
+        y: -1.6574244499206543 // 车辆y坐标
+      },
       loginVisible: false,
       configVisible: false
     }