useTabs.ts 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. import type { RouteLocationNormalized, Router } from 'vue-router';
  2. import { useRouter } from 'vue-router';
  3. import { unref } from 'vue';
  4. import { useMultipleTabStore } from '/@/store/modules/multipleTab';
  5. import { useAppStore } from '/@/store/modules/app';
  6. enum TableActionEnum {
  7. REFRESH,
  8. CLOSE_ALL,
  9. CLOSE_LEFT,
  10. CLOSE_RIGHT,
  11. CLOSE_OTHER,
  12. CLOSE_CURRENT,
  13. CLOSE,
  14. }
  15. export function useTabs(_router?: Router) {
  16. const appStore = useAppStore();
  17. function canIUseTabs(): boolean {
  18. const { show } = appStore.getMultiTabsSetting;
  19. if (!show) {
  20. throw new Error('The multi-tab page is currently not open, please open it in the settings!');
  21. }
  22. return !!show;
  23. }
  24. const tabStore = useMultipleTabStore();
  25. const router = _router || useRouter();
  26. const { currentRoute } = router;
  27. function getCurrentTab() {
  28. const route = unref(currentRoute);
  29. return tabStore.getTabList.find((item) => item.path === route.path)!;
  30. }
  31. async function updateTabTitle(title: string, tab?: RouteLocationNormalized) {
  32. const canIUse = canIUseTabs;
  33. if (!canIUse) {
  34. return;
  35. }
  36. const targetTab = tab || getCurrentTab();
  37. await tabStore.setTabTitle(title, targetTab);
  38. }
  39. async function updateTabPath(path: string, tab?: RouteLocationNormalized) {
  40. const canIUse = canIUseTabs;
  41. if (!canIUse) {
  42. return;
  43. }
  44. const targetTab = tab || getCurrentTab();
  45. await tabStore.updateTabPath(path, targetTab);
  46. }
  47. async function handleTabAction(action: TableActionEnum, tab?: RouteLocationNormalized) {
  48. const canIUse = canIUseTabs;
  49. if (!canIUse) {
  50. return;
  51. }
  52. const currentTab = getCurrentTab();
  53. switch (action) {
  54. case TableActionEnum.REFRESH:
  55. await tabStore.refreshPage(router);
  56. break;
  57. case TableActionEnum.CLOSE_ALL:
  58. await tabStore.closeAllTab(router);
  59. break;
  60. case TableActionEnum.CLOSE_LEFT:
  61. await tabStore.closeLeftTabs(currentTab, router);
  62. break;
  63. case TableActionEnum.CLOSE_RIGHT:
  64. await tabStore.closeRightTabs(currentTab, router);
  65. break;
  66. case TableActionEnum.CLOSE_OTHER:
  67. await tabStore.closeOtherTabs(currentTab, router);
  68. break;
  69. case TableActionEnum.CLOSE_CURRENT:
  70. case TableActionEnum.CLOSE:
  71. await tabStore.closeTab(tab || currentTab, router);
  72. break;
  73. }
  74. }
  75. return {
  76. refreshPage: () => handleTabAction(TableActionEnum.REFRESH),
  77. closeAll: () => handleTabAction(TableActionEnum.CLOSE_ALL),
  78. closeLeft: () => handleTabAction(TableActionEnum.CLOSE_LEFT),
  79. closeRight: () => handleTabAction(TableActionEnum.CLOSE_RIGHT),
  80. closeOther: () => handleTabAction(TableActionEnum.CLOSE_OTHER),
  81. closeCurrent: () => handleTabAction(TableActionEnum.CLOSE_CURRENT),
  82. close: (tab?: RouteLocationNormalized) => handleTabAction(TableActionEnum.CLOSE, tab),
  83. setTitle: (title: string, tab?: RouteLocationNormalized) => updateTabTitle(title, tab),
  84. updatePath: (fullPath: string, tab?: RouteLocationNormalized) => updateTabPath(fullPath, tab),
  85. };
  86. }