4.26 代码上传

src/pages/swapping/index.vue

@@ -1,107 +1,106 @@
 <template>
-    <div class="main_content_hei">
-        <div class="header_info">
-            <div class="color_dark">
-                <top_one></top_one>
-            </div>
-            <div class="color_dark">
-                <top_two></top_two>
-            </div>
-            <div class="color_dark">
-                <top_three :today_data="today_data"></top_three>
-            </div>
-            <div class="color_dark">
-                <top_four :today_data="today_data"></top_four>
-            </div>
-            <div class="color_dark" style="margin: unset;">
-                <top_five></top_five>
-            </div>
-        </div>
-        <!--  -->
-        <div class="bot_info">
-            <div class="bot_dark" style="width: 25%;">
-                <bot_one></bot_one>
-            </div>
-            <div class="bot_dark" style="flex: 1; margin-left: 10px;">
-                <bot_two></bot_two>
-            </div>
-        </div>
+  <div class="main_content_hei">
+    <div class="header_info">
+      <div class="color_dark">
+        <top_one></top_one>
+      </div>
+      <div class="color_dark">
+        <top_two></top_two>
+      </div>
+      <div class="color_dark">
+        <top_three :today_data="today_data"></top_three>
+      </div>
+      <div class="color_dark">
+        <top_four :today_data="today_data"></top_four>
+      </div>
+      <div class="color_dark" style="margin: unset">
+        <top_five></top_five>
+      </div>
     </div>
+    <!--  -->
+    <div class="bot_info">
+      <div class="bot_dark" style="width: 25%">
+        <bot_one></bot_one>
+      </div>
+      <div class="bot_dark" style="flex: 1; margin-left: 10px">
+        <bot_two></bot_two>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
-import top_one from './components/top_one.vue'
-import top_two from './components/top_two.vue'
-import top_three from './components/top_three.vue'
-import top_four from './components/top_four.vue'
-import top_five from './components/top_five.vue'
-import bot_one from './components/bot_one.vue'
-import bot_two from './components/bot_two.vue'
+import top_one from "./components/top_one.vue";
+import top_two from "./components/top_two.vue";
+import top_three from "./components/top_three.vue";
+import top_four from "./components/top_four.vue";
+import top_five from "./components/top_five.vue";
+import bot_one from "./components/bot_one.vue";
+import bot_two from "./components/bot_two.vue";
 import {
-    handle_GetFault,
-    handle_GetSwapBatteryData
+  handle_GetFault,
+  handle_GetSwapBatteryData,
 } from "@/services/swapping";
 export default {
-    components: {
-        top_one,
-        top_two,
-        top_three,
-        top_four,
-        top_five,
-        bot_one,
-        bot_two
-    },
-    data() {
-        return {
-            today_data: null
-        }
-    },
-    methods: {
-        handle_GetSwapBatteryData() {
-            handle_GetSwapBatteryData().then(response => {
-                this.today_data = response.data
-            })
-        }
+  components: {
+    top_one,
+    top_two,
+    top_three,
+    top_four,
+    top_five,
+    bot_one,
+    bot_two,
+  },
+  data() {
+    return {
+      today_data: null,
+    };
+  },
+  methods: {
+    handle_GetSwapBatteryData() {
+      handle_GetSwapBatteryData().then((response) => {
+        this.today_data = response.data;
+      });
     },
-    mounted(){
-        this.handle_GetSwapBatteryData()
-    }
-}
+  },
+  mounted() {},
+  created() {
+    this.handle_GetSwapBatteryData();
+  },
+};
 </script>
 
 <style lang="less" scoped>
-
-
 .header_info {
-    display: flex;
-    align-items: center;
+  display: flex;
+  align-items: center;
 }
 
 .color_dark {
-    flex: 1;
-    margin-right: 10px;
-    // background: #ccc;
-    // border: 2px solid #ccc;
-    background: #fff;
-    box-shadow: 2px 2px 2px #ccc;
-    height: 180px;
-    border-radius: 8px;
-    padding: 8px;
-    box-sizing: border-box;
+  flex: 1;
+  margin-right: 10px;
+  // background: #ccc;
+  // border: 2px solid #ccc;
+  background: #fff;
+  box-shadow: 2px 2px 2px #ccc;
+  height: 180px;
+  border-radius: 8px;
+  padding: 8px;
+  box-sizing: border-box;
 }
 
 .bot_info {
-    margin-top: 10px;
-    height: calc(100% - 190px);
-    display: flex;
+  margin-top: 10px;
+  height: calc(100% - 190px);
+  display: flex;
 }
 
 .bot_dark {
-    height: 100%;
-    // background: #ccc;
-    // border: 2px solid #ccc;
-    background: #fff;
-    box-shadow: 2px 2px 2px #ccc;
-    border-radius: 8px;
+  height: 100%;
+  // background: #ccc;
+  // border: 2px solid #ccc;
+  background: #fff;
+  box-shadow: 2px 2px 2px #ccc;
+  border-radius: 8px;
 }
-</style>
+</style>