SiteAnalysis.vue 775 B

1234567891011121314151617181920212223242526272829303132333435363738
  1. <template>
  2. <Card
  3. :tab-list="tabListTitle"
  4. v-bind="$attrs"
  5. :active-tab-key="activeKey"
  6. @tabChange="onTabChange"
  7. >
  8. <p v-if="activeKey === 'tab1'">
  9. <VisitAnalysis />
  10. </p>
  11. <p v-if="activeKey === 'tab2'">
  12. <VisitAnalysisBar />
  13. </p>
  14. </Card>
  15. </template>
  16. <script lang="ts" setup>
  17. import { ref } from 'vue';
  18. import { Card } from 'ant-design-vue';
  19. import VisitAnalysis from './VisitAnalysis.vue';
  20. import VisitAnalysisBar from './VisitAnalysisBar.vue';
  21. const activeKey = ref('tab1');
  22. const tabListTitle = [
  23. {
  24. key: 'tab1',
  25. tab: '流量趋势',
  26. },
  27. {
  28. key: 'tab2',
  29. tab: '访问量',
  30. },
  31. ];
  32. function onTabChange(key) {
  33. activeKey.value = key;
  34. }
  35. </script>