重命名

src/render/page/DataMonitorPage.vue

@@ -0,0 +1,42 @@
+<template>
+  <full-screen-container>
+    <TheHeader title="卫星数据监控平台" />
+
+    <div class="main-content flex flex-1 flex-col">
+      <DigitalFlopContainer />
+
+      <div class="block-left-right-content flex flex-1 mt-5">
+        <div class="block-left-content w-1/5 flex flex-col">
+          <div class="clock-content mb-2 flex-1">
+            <Clock />
+          </div>
+          <div class="compass-content mb-2 flex-1">
+            <Compass />
+          </div>
+          <div class="water-level-content flex-1">
+            <WaterLevel />
+          </div>
+        </div>
+        <div class="block-right-content ml-2 flex flex-1">
+          <Map />
+        </div>
+      </div>
+    </div>
+  </full-screen-container>
+</template>
+
+<script lang="ts" setup>
+import FullScreenContainer from '../components/Layout/FullScreenContainer.vue'
+import TheHeader from '../components/Layout/TheHeader.vue'
+import DigitalFlopContainer from '../components/DigitalFlopContainer.vue'
+import Clock from '../components/Clock.vue'
+import Compass from '../components/Compass.vue'
+import WaterLevel from '../components/WaterLevel.vue'
+import Map from '../components/Map.vue'
+</script>
+
+<style scoped>
+.clock-content, .compass-content, .water-level-content, .block-right-content {
+  background-color: rgba(6,30,93,.5);
+}
+</style>