ListUnpublishedView.vue 730 B

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. <template>
  2. <div>
  3. <QueryUnpublishedView />
  4. </div>
  5. </template>
  6. <script setup>
  7. import { ref } from 'vue'
  8. import QueryUnpublishedView from './QueryUnpublishedView.vue'
  9. const emit = defineEmits(['selectTab'])
  10. const selectedTab = ref('latest')
  11. const selectTab = (tab) => {
  12. if (selectedTab.value != tab) {
  13. selectedTab.value = tab
  14. emit('selectTab', tab)
  15. }
  16. }
  17. </script>
  18. <style scoped>
  19. .tab-switcher {
  20. display: flex;
  21. border-radius: 20px;
  22. border: 1px solid #1e90ff;
  23. overflow: hidden;
  24. }
  25. .tab-switcher div {
  26. padding: 2px 20px;
  27. background-color: #f5f5f5;
  28. cursor: pointer;
  29. }
  30. .tab-switcher div.active {
  31. background-color: #1e90ff;
  32. color: white;
  33. }
  34. .tab-switcher div:not(:last-child) {
  35. }
  36. </style>