<template>
  <!-- 顶部 banner 区域 -->
  <view class="all">
    <Navbar title="中证参考" :hasBack="false"></Navbar>
    <Tabs @tabChange="tabChange"></Tabs>

    <RankListMini v-if="tabIndex == 0" :newsList="newsList"></RankListMini>
    <MineMini v-if="tabIndex == 1"></MineMini>
    <Tabbar @tabChange="tabChange"></Tabbar>
  </view>
</template>

<script setup>
import { ref, onMounted, defineAsyncComponent, reactive } from "vue";
import Tabbar from "@/components/mini/Tabbar.vue";
import Navbar from '@/components/mini/Navbar.vue'
import RankListMini from "@/components/RankListMini.vue";
// const Mine = defineAsyncComponent(() => import("@/components/mine.vue"));
import MineMini from "@/components/mineMini.vue";
import Tabs from "@/components/mini/Tabs.vue";


import {
  getTopNews,
} from "@/api/newsInfo";

const newsList = ref([]);
// 概念标签贴标
async function getNewsList() {
  newsList.value = await getTopNews({});
}

const tabIndex = ref(0);
function tabChange(index) {
  tabIndex.value = index;

  switch (index) {
    case 0:
      getNewsList()
      break;
  }
}

onMounted(async () => {
  getNewsList()
});
</script>

<style scoped lang="scss"></style>
