index.vue 901 B

123456789101112131415161718192021222324252627282930313233343536373839
  1. <template>
  2. <HcTabsSimple :cur="tabsKey" :datas="tabsData" @tabClick="tabsClick">
  3. <template #tab-user>
  4. <TaskTable :tableKey="tabsKey"/>
  5. </template>
  6. <template #tab-links>
  7. <TaskTable :tableKey="tabsKey"/>
  8. </template>
  9. <template #tab-all>
  10. <TaskTable :tableKey="tabsKey"/>
  11. </template>
  12. </HcTabsSimple>
  13. </template>
  14. <script setup>
  15. import {ref, watch} from "vue";
  16. import TaskTable from "./components/TaskTable.vue";
  17. //选项卡
  18. const tabsKey = ref('user')
  19. const tabsData = ref([
  20. {icon: 'user', label: '我的计划任务', key: 'user'},
  21. {icon: 'links', label: '我关联的计划任务', key: 'links'},
  22. {icon: 'todo', label: '查看全部计划任务', key: 'all'},
  23. ])
  24. const tabsClick = (key) => {
  25. tabsKey.value = key
  26. }
  27. </script>
  28. <style lang="scss" scoped>
  29. </style>
  30. <style lang="scss">
  31. </style>