feat(web): WorkspaceHomeView with worktrees/main/settings tabs and CommitDialog

2026-05-02 23:24:16 +08:00
parent d962ba2f16
commit 0423f0566c
6 changed files with 747 additions and 0 deletions
@@ -0,0 +1,86 @@
+<template>
+  <AppShell>
+    <div class="space-y-4">
+      <NPageHeader :title="store.current?.name ?? wsSlug">
+        <template #subtitle>
+          {{ store.current?.slug }}
+        </template>
+      </NPageHeader>
+
+      <SyncBar
+        v-if="store.current"
+        :ws="store.current"
+      />
+
+      <NTabs
+        v-model:value="tab"
+        type="line"
+      >
+        <NTabPane
+          name="worktrees"
+          tab="Worktrees"
+        >
+          <WorktreesTab
+            v-if="store.current"
+            :ws="store.current"
+          />
+        </NTabPane>
+        <NTabPane
+          name="main"
+          tab="Main"
+        >
+          <MainTab
+            v-if="store.current"
+            :ws="store.current"
+          />
+        </NTabPane>
+        <NTabPane
+          name="settings"
+          tab="Settings"
+        >
+          <SettingsTab
+            v-if="store.current"
+            :ws="store.current"
+          />
+        </NTabPane>
+      </NTabs>
+    </div>
+  </AppShell>
+</template>
+
+<script setup lang="ts">
+import { onMounted, ref, computed } from 'vue'
+import { useRoute } from 'vue-router'
+import { NTabs, NTabPane, NPageHeader, useMessage } from 'naive-ui'
+import AppShell from '@/layouts/AppShell.vue'
+import { useWorkspacesStore } from '@/stores/workspaces'
+import SyncBar from './components/SyncBar.vue'
+import WorktreesTab from './components/WorktreesTab.vue'
+import MainTab from './components/MainTab.vue'
+import SettingsTab from './components/SettingsTab.vue'
+
+const route = useRoute()
+const store = useWorkspacesStore()
+const msg = useMessage()
+const tab = ref<'worktrees' | 'main' | 'settings'>('worktrees')
+
+const projectSlug = computed(() => route.params.slug as string)
+const wsSlug = computed(() => route.params.wsSlug as string)
+
+onMounted(async () => {
+  try {
+    // 通过 fetchByProject 拿列表后定位 wsID
+    await store.fetchByProject(projectSlug.value)
+    const ws = store.list.find((w) => w.slug === wsSlug.value)
+    if (!ws) {
+      msg.error('找不到工作区')
+      return
+    }
+    await store.fetchOne(ws.id)
+    await store.fetchWorktrees(ws.id)
+    await store.fetchCredential(ws.id)
+  } catch (e: unknown) {
+    msg.error('加载失败：' + (e instanceof Error ? e.message : String(e)))
+  }
+})
+</script>