fix: 整理代码

src/components/h-cesium-viewer/index.vue

@@ -1,14 +1,11 @@
 <script setup lang="ts">
 import 'cesium/Build/Cesium/Widgets/widgets.css';
 
-// GroundStationOptions 不再直接使用，已在 types.ts 中被 GroundStationState 引用
+import type { GroundStationState } from './types';
-import type { GroundStationState } from './types'; // 从 types.ts 导入
 
 import { useHCesiumViewerCls } from './useHCesiumViewerCls';
 import { useHCesiumViewerClsGroundStation } from './useHCesiumViewerClsGroundStation';
 
-// GroundStationState 接口已移至 types.ts
-
 const props = defineProps<{
   groundStationState?: GroundStationState;
 }>();

src/pages/cesium-viewer.page.vue

@@ -4,22 +4,21 @@ meta:
 </route>
 
 <script setup lang="ts">
-// GroundStationOptions 不再直接使用，已在 types.ts 中被 GroundStationState 引用
+import type { GroundStationState } from '@/components/h-cesium-viewer/types';
-import type { GroundStationState } from '@/components/h-cesium-viewer/types'; // 导入共享的接口
 
-// 使用 reactive 管理地面站和选中状态
+// 地面站和选中状态
 const groundStationState = reactive<GroundStationState>({
-  // 使用导入的接口
+  groundStations: [],
-  groundStations: [
+  selectedIds: [],
+});
+groundStationState.groundStations = [
   { 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: '广州站' },
-  ],
+];
-  selectedIds: [],
-});
 
 // 计算 Checkbox Group 的 options
-const stationOptions = computed(() =>
+const stationCheckboxOptions = computed(() =>
   groundStationState.groundStations.map((station) => ({ label: station.name, value: station.id })),
 );
 
@@ -74,15 +73,15 @@ const clearAllStations = () => {
         <span>当前站点数: {{ groundStationState.groundStations.length }}</span>
         <span> | 选中站点数: {{ groundStationState.selectedIds.length }}</span>
       </div>
-      <!-- 新增：站点选择区域 -->
+      <!-- 站点选择 -->
       <div v-if="groundStationState.groundStations.length > 0">
         <span class="mr-2">选择要高亮的站点:</span>
-        <a-checkbox-group v-model:value="groundStationState.selectedIds" :options="stationOptions" />
+        <a-checkbox-group v-model:value="groundStationState.selectedIds" :options="stationCheckboxOptions" />
       </div>
     </div>
     <div class="flex-grow w-full rounded-lg border overflow-hidden">
       <!-- 将响应式列表和选中 ID 列表绑定到 prop -->
-      <h-cesium-viewer :ground-station-state="groundStationState">
+      <h-cesium-viewer :ground-station-state>
         <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>