@agentunion/kite 1.5.0 → 1.6.0

package/extensions/services/evol/web/src/views/TeamView.vue

@@ -0,0 +1,332 @@
+<template>
+  <div class="team-view">
+    <div class="page-header">
+      <h2 class="page-title">{{ t('team.title') }}</h2>
+      <button class="create-btn" @click="showCreateDialog = true">
+        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+          <line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/>
+        </svg>
+        {{ t('team.createTeam') }}
+      </button>
+    </div>
+
+    <div v-if="loading" class="loading">{{ t('common.loading') }}</div>
+
+    <div v-else class="team-grid">
+      <!-- 个人版卡片 -->
+      <div
+        class="team-card personal-card"
+        :class="{ active: !currentTeamId }"
+        @click="handleSwitchTeam(null)"
+      >
+        <div class="card-icon personal-icon">
+          <svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
+            <circle cx="12" cy="7" r="4"/>
+          </svg>
+        </div>
+        <div class="card-body">
+          <div class="card-name">{{ t('team.personalVersion') }}</div>
+          <div class="card-meta">{{ t('team.personalDesc') }}</div>
+        </div>
+        <div v-if="!currentTeamId" class="card-active-badge">{{ t('team.current') }}</div>
+      </div>
+
+      <!-- 团队卡片 -->
+      <div
+        v-for="team in teams"
+        :key="team.teamId"
+        class="team-card"
+        :class="{ active: team.teamId === currentTeamId }"
+        @click="goToTeamDetail(team)"
+      >
+        <div class="card-icon team-icon">
+          <svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/>
+            <circle cx="9" cy="7" r="4"/>
+            <path d="M23 21v-2a4 4 0 0 0-3-3.87"/>
+            <path d="M16 3.13a4 4 0 0 1 0 7.75"/>
+          </svg>
+        </div>
+        <div class="card-body">
+          <div class="card-name">{{ team.teamName }}</div>
+          <div class="card-meta">
+            <span>{{ getRoleText(team.memberRole) }}</span>
+            <span class="meta-dot">·</span>
+            <span>{{ team.memberCount || 0 }} {{ t('team.members') }}</span>
+          </div>
+        </div>
+        <div v-if="team.teamId === currentTeamId" class="card-active-badge">{{ t('team.current') }}</div>
+      </div>
+    </div>
+
+    <!-- 创建团队弹窗 -->
+    <el-dialog
+      v-model="showCreateDialog"
+      :title="t('team.createTeam')"
+      width="420px"
+      :close-on-click-modal="false"
+    >
+      <el-form :model="createForm" label-position="top">
+        <el-form-item :label="t('team.teamName')">
+          <el-input v-model="createForm.name" :placeholder="t('team.teamNamePlaceholder')" maxlength="30" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button @click="showCreateDialog = false">{{ t('common.cancel') }}</el-button>
+        <el-button type="primary" :loading="creating" @click="handleCreateTeam">{{ t('common.confirm') }}</el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, computed, onMounted, watch } from 'vue'
+import { useRouter } from 'vue-router'
+import { useAuthStore } from '@/stores/auth'
+import { useConnectionStore } from '@/stores/connection'
+import { useI18n } from '@/i18n'
+import { storeToRefs } from 'pinia'
+import { ElMessage } from 'element-plus'
+
+const router = useRouter()
+const authStore = useAuthStore()
+const connectionStore = useConnectionStore()
+const { userInfo } = storeToRefs(authStore)
+const { t } = useI18n()
+
+const loading = ref(false)
+const showCreateDialog = ref(false)
+const creating = ref(false)
+const createForm = ref({ name: '' })
+
+const teams = computed(() => userInfo.value?.teamInfo?.teams || [])
+const currentTeamId = computed(() => userInfo.value?.teamInfo?.currentTeamId)
+
+function getRoleText(role: string | null | undefined): string {
+  if (role === '0') return t('team.roleCreator')
+  if (role === '1') return t('team.roleAdmin')
+  if (role === '2') return t('team.roleMember')
+  return t('na')
+}
+
+function goToTeamDetail(team: any) {
+  router.push({ name: 'team-detail', params: { teamId: team.teamId } })
+}
+
+async function handleSwitchTeam(teamId: number | null) {
+  if (teamId === currentTeamId.value) return
+  if (teamId === null && !currentTeamId.value) return
+  try {
+    const client = connectionStore.getClient()
+    if (!client) return
+    const result = await client.call('evol.switch_team', { team_id: teamId, kiteToken: authStore.kiteToken })
+    if (result.status === 'success') {
+      ElMessage.success(t('team.switchSuccess'))
+      await authStore.loadUserInfo(client)
+    } else {
+      ElMessage.error(result.error || t('team.switchFailed'))
+    }
+  } catch (e: any) {
+    ElMessage.error(t('team.switchFailed'))
+  }
+}
+
+async function handleCreateTeam() {
+  if (!createForm.value.name.trim()) return
+  creating.value = true
+  try {
+    const result = await connectionStore.callRpc<any>('evol.team.create', {
+      kiteToken: authStore.kiteToken,
+      name: createForm.value.name.trim()
+    })
+    if (result.success) {
+      ElMessage.success(t('team.createSuccess'))
+      showCreateDialog.value = false
+      createForm.value.name = ''
+      // 刷新用户信息以获取新团队列表
+      const client = connectionStore.getClient()
+      if (client) await authStore.loadUserInfo(client)
+    } else {
+      ElMessage.error(result.msg || t('team.createFailed'))
+    }
+  } catch (e: any) {
+    ElMessage.error(t('team.createFailed'))
+  } finally {
+    creating.value = false
+  }
+}
+
+async function tryLoadUserInfo() {
+  loading.value = true
+  try {
+    const client = connectionStore.getClient()
+    if (client && client.authenticated) {
+      await authStore.loadUserInfo(client)
+    }
+  } catch (e: any) {
+    console.error('Failed to load user info:', e)
+  } finally {
+    loading.value = false
+  }
+}
+
+onMounted(() => {
+  if (!userInfo.value) tryLoadUserInfo()
+})
+
+watch(() => connectionStore.status, (s) => {
+  if (s === 'connected' && !userInfo.value) setTimeout(tryLoadUserInfo, 500)
+})
+</script>
+
+<style scoped>
+.team-view {
+  max-width: 1000px;
+  margin: 0 auto;
+}
+
+.page-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 24px;
+}
+
+.create-btn {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 10px 20px;
+  border-radius: var(--radius-pill);
+  background: var(--primary-gradient);
+  border: none;
+  cursor: pointer;
+  font-size: 14px;
+  font-weight: 600;
+  color: #fff;
+  transition: all 0.2s;
+  font-family: inherit;
+}
+
+.create-btn:hover {
+  transform: translateY(-1px);
+  box-shadow: 0 4px 16px rgba(14, 165, 233, 0.3);
+}
+
+.loading {
+  text-align: center;
+  padding: 60px;
+  color: var(--text-muted);
+}
+
+.team-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+  gap: 16px;
+}
+
+.team-card {
+  background: var(--panel-bg);
+  backdrop-filter: var(--panel-blur);
+  -webkit-backdrop-filter: var(--panel-blur);
+  border-radius: var(--radius-lg);
+  padding: 24px;
+  box-shadow: var(--shadow);
+  border: 1px solid var(--border-color);
+  cursor: pointer;
+  transition: all 0.25s;
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  position: relative;
+  overflow: hidden;
+}
+
+.team-card:hover {
+  transform: translateY(-2px);
+  box-shadow: var(--shadow-md);
+  border-color: var(--primary);
+}
+
+.team-card.active {
+  border-color: var(--primary);
+  background: var(--primary-light);
+}
+
+.card-icon {
+  width: 52px;
+  height: 52px;
+  border-radius: 14px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+
+.personal-icon {
+  background: var(--success-light);
+  color: var(--success);
+}
+
+.team-icon {
+  background: var(--primary-light);
+  color: var(--primary);
+}
+
+.card-body {
+  flex: 1;
+  min-width: 0;
+}
+
+.card-name {
+  font-size: 17px;
+  font-weight: 700;
+  color: var(--text-primary);
+  margin-bottom: 4px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.card-meta {
+  font-size: 13px;
+  color: var(--text-muted);
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.meta-dot {
+  font-size: 10px;
+}
+
+.card-active-badge {
+  position: absolute;
+  top: 12px;
+  right: 12px;
+  padding: 3px 10px;
+  border-radius: var(--radius-pill);
+  background: var(--primary-gradient);
+  color: #fff;
+  font-size: 11px;
+  font-weight: 700;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+}
+
+@media (max-width: 768px) {
+  .team-grid {
+    grid-template-columns: 1fr;
+  }
+  .page-header {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 12px;
+  }
+  .create-btn {
+    width: 100%;
+    justify-content: center;
+  }
+}
+</style>

package/extensions/services/evol/web/tsconfig.json

@@ -0,0 +1,31 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "module": "ESNext",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "preserve",
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+
+    /* Path mapping */
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["src/*"]
+    }
+  },
+  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
+  "references": [{ "path": "./tsconfig.node.json" }]
+}

package/extensions/services/evol/web/tsconfig.node.json

@@ -0,0 +1,10 @@
+{
+  "compilerOptions": {
+    "composite": true,
+    "skipLibCheck": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "allowSyntheticDefaultImports": true
+  },
+  "include": ["vite.config.ts"]
+}

package/extensions/services/evol/web/vite.config.ts

@@ -0,0 +1,49 @@
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+import { resolve } from 'path'
+
+// Evol 模块默认端口 18766
+const backendPort = process.env.VITE_BACKEND_PORT || '18766'
+
+export default defineConfig({
+  plugins: [vue()],
+  resolve: {
+    alias: {
+      '@': resolve(__dirname, 'src')
+    }
+  },
+  server: {
+    port: 5173,
+    proxy: {
+      '/api': {
+        target: `http://localhost:${backendPort}`,
+        changeOrigin: true
+      },
+      '/ws': {
+        target: `ws://localhost:${backendPort}`,
+        ws: true
+      },
+      '/health': {
+        target: `http://localhost:${backendPort}`,
+        changeOrigin: true
+      },
+      '/status': {
+        target: `http://localhost:${backendPort}`,
+        changeOrigin: true
+      }
+    }
+  },
+  build: {
+    outDir: '../static',
+    emptyOutDir: true,
+    assetsDir: 'assets',
+    rollupOptions: {
+      output: {
+        manualChunks: {
+          'element-plus': ['element-plus'],
+          'vue-vendor': ['vue', 'vue-router', 'pinia']
+        }
+      }
+    }
+  }
+})