<script setup lang="ts">
import Tree from '@/components/Tree/index.vue'
import { getSatellite } from '@/api/Satellite'
import { useSatellite } from './hooks/satellite'

const { satelliteList, addSatellites } = useSatellite()

onMounted(async () => {
  getSatelliteList()
})

async function getSatelliteList() {
  const sateRes = await getSatellite()
  const { data, code } = sateRes
  if (code === '200') {
    satelliteList.value = data
  }
  console.log('data,code', data, code)
}

const checkedKeys = ref<Array<string | number>>([])

watch(checkedKeys, val => {
  addSatellites(val)
})
</script>

<template>
  <!-- <n-checkbox-group
    v-model:value="checked"
    @update:value="handleSatelliteChange"
    :max="5"
  >
    <template v-for="(item, index) in allSatellite" :key="index">
      <n-checkbox
        v-if="!item.type"
        :value="item.value"
        :label="item.label"
      ></n-checkbox>
    </template>
  </n-checkbox-group> -->

  <div class="w-h-full">
    <tree
      :data="satelliteList"
      :key-field="'id'"
      :label-field="'name'"
      v-model:checked="checkedKeys"
      showSearch
    />
  </div>
</template>
