<script lang="ts" setup>
  import { ref, onMounted } from 'vue';
  import { regionalSpotManageGetStatusApi } from '/@/api/regionalSpotManage';
  import ManageList from './components/list.vue';
  const show = ref(false);
  const loading = ref(false);
  onMounted(async () => {
    loading.value = true;
    const res = await regionalSpotManageGetStatusApi().catch(() => (loading.value = false));
    if (res.success) {
      show.value = true;
    }
    loading.value = false;
  });
</script>

<template>
  <div>
    <!-- <ManageList /> -->
    <a-spin v-if="loading" style="height: 150px; width: 100%; line-height: 150px" />
    <ManageList v-if="show && !loading" />
    <div v-if="!show && !loading" class="status">
      <img src="../../assets/images/notOpened.png" alt="" srcset="" />
    </div>
  </div>
</template>

<style lang="less" scoped>
  .status {
    height: 100vh;
    img {
      width: 100%;
      height: 100vh;
      object-fit: contain;
    }
  }
</style>
