feat: 添加 Cesium Viewer 组件及相关功能，优化项目结构和配置

src/pages/cesium-viewer.page.vue

@@ -0,0 +1,67 @@
+<route lang="yaml">
+meta:
+  layout: false
+</route>
+
+<script setup lang="ts">
+import type { GroundStationOptions } from '@/components/h-cesium-viewer/h-cesium-viewer-class';
+
+// 定义地面站列表的响应式引用
+const groundStations = ref<GroundStationOptions[]>([
+  { height: 50, id: 'gs-bj', latitude: 39.9042, longitude: 116.4074, name: '北京站' },
+  { height: 10, id: 'gs-sh', latitude: 31.2304, longitude: 121.4737, name: '上海站' },
+  { height: 20, id: 'gs-gz', latitude: 23.1291, longitude: 113.2644, name: '广州站' },
+]);
+
+// 添加一个随机站点
+const addRandomStation = () => {
+  const randomId = `gs-random-${Math.random().toString(36).slice(7)}`; // 使用 slice 替换 substring
+  const randomLon = Math.random() * 360 - 180; // -180 to 180
+  const randomLat = Math.random() * 180 - 90; // -90 to 90
+  const randomHeight = Math.random() * 1000; // 0 to 1000 meters
+  groundStations.value.push({
+    // 调整属性顺序
+    height: randomHeight,
+    id: randomId,
+    latitude: randomLat,
+    longitude: randomLon,
+    name: `随机站 ${randomId.slice(-4)}`,
+  });
+  consola.info('添加随机站点:', groundStations.value.at(-1)); // 使用 .at() 访问最后一个元素
+};
+
+// 移除最后一个站点
+const removeLastStation = () => {
+  if (groundStations.value.length > 0) {
+    const removed = groundStations.value.pop();
+    consola.info('移除站点:', removed);
+  } else {
+    consola.warn('没有站点可以移除');
+  }
+};
+
+// 清空所有站点
+const clearAllStations = () => {
+  groundStations.value = [];
+  consola.info('已清空所有站点');
+};
+</script>
+
+<template>
+  <div class="h-screen w-screen p-4 flex flex-col">
+    <div class="flex-shrink-0 mb-2 space-x-2">
+      <a-button type="primary" @click="addRandomStation">添加随机站点</a-button>
+      <a-button @click="removeLastStation" :disabled="groundStations.length === 0">移除最后一个</a-button>
+      <a-button danger @click="clearAllStations" :disabled="groundStations.length === 0">清空所有</a-button>
+      <span>当前站点数: {{ groundStations.length }}</span>
+    </div>
+    <div class="flex-grow w-full rounded-lg border overflow-hidden">
+      <!-- 将响应式列表绑定到 prop -->
+      <h-cesium-viewer :ground-station-list="groundStations">
+        <div class="absolute top-0 left-0 z-10 p-2 bg-black/30 rounded-br-lg">
+          <span class="text-white text-xs">叠加 UI 示例</span>
+        </div>
+      </h-cesium-viewer>
+    </div>
+  </div>
+</template>