更新前端看板

frontend/src/views/tenants/TenantDetailView.vue

@@ -1,25 +1,42 @@
 <script setup lang="ts">
-import { onMounted, ref } from 'vue'
+import { onMounted, reactive, ref } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { ElMessage } from 'element-plus'
-import DataTablePage from '@/components/DataTablePage.vue'
 import { getTenant, setTenantQuota, type Tenant } from '@/api/modules/tenant'
-import { getProjects, type Project } from '@/api/modules/project'
 
 const route = useRoute()
 const router = useRouter()
 const tenant = ref<Tenant | null>(null)
-const projects = ref<Project[]>([])
 const loading = ref(false)
-const quotaText = ref('')
+const quotaForm = reactive({ gpu: 0, storage: 0, maxProjects: 0 })
+
+function parseQuota(quota: Record<string, unknown> | undefined | null) {
+  const q = quota || {}
+  return {
+    gpu: Number(q.gpu || q.gpu_quota || 0),
+    storage: Number(q.storage || q.storage_quota || 0),
+    maxProjects: Number(q.max_projects || 0),
+  }
+}
+
+function formatQuota(quota: Record<string, unknown> | undefined | null) {
+  const q = parseQuota(quota)
+  const parts: string[] = []
+  if (q.gpu > 0) parts.push(`GPU ${q.gpu}`)
+  if (q.storage > 0) parts.push(`存储 ${q.storage}GB`)
+  if (q.maxProjects > 0) parts.push(`项目 ${q.maxProjects}`)
+  return parts.length ? parts.join(' | ') : '—'
+}
 
 async function load() {
   const id = route.params.id as string
   loading.value = true
   try {
     tenant.value = await getTenant(id)
-    projects.value = await getProjects(id)
-    quotaText.value = JSON.stringify(tenant.value?.quota || {})
+    const q = parseQuota(tenant.value?.quota)
+    quotaForm.gpu = q.gpu
+    quotaForm.storage = q.storage
+    quotaForm.maxProjects = q.maxProjects
   } finally {
     loading.value = false
   }
@@ -27,18 +44,13 @@ async function load() {
 
 async function saveQuota() {
   if (!tenant.value) return
-  try {
-    const q = JSON.parse(quotaText.value || '{}')
-    await setTenantQuota(tenant.value.id, q)
-    ElMessage.success('配额已保存')
-    load()
-  } catch {
-    ElMessage.error('配额需为合法 JSON')
-  }
-}
-
-function openProject(id: string) {
-  router.push(`/projects/${id}`)
+  const quota: Record<string, unknown> = {}
+  if (quotaForm.gpu > 0) quota.gpu = quotaForm.gpu
+  if (quotaForm.storage > 0) quota.storage = quotaForm.storage
+  if (quotaForm.maxProjects > 0) quota.max_projects = quotaForm.maxProjects
+  await setTenantQuota(tenant.value.id, quota)
+  ElMessage.success('配额已保存')
+  load()
 }
 
 onMounted(load)
@@ -55,31 +67,30 @@ onMounted(load)
       <template #header>基本信息</template>
       <el-descriptions :column="2" border>
         <el-descriptions-item label="名称">{{ tenant?.name }}</el-descriptions-item>
-        <el-descriptions-item label="编码">{{ tenant?.code }}</el-descriptions-item>
+        <el-descriptions-item label="用户ID">{{ tenant?.code }}</el-descriptions-item>
         <el-descriptions-item label="状态">{{ tenant?.status }}</el-descriptions-item>
         <el-descriptions-item label="创建时间">{{ tenant?.create_time }}</el-descriptions-item>
+        <el-descriptions-item label="配额">{{ formatQuota(tenant?.quota) }}</el-descriptions-item>
       </el-descriptions>
       <el-divider />
       <div class="quota-edit">
-        <span class="label">配额 JSON</span>
-        <el-input v-model="quotaText" type="textarea" :rows="3" />
-        <el-button type="primary" @click="saveQuota">保存配额</el-button>
+        <span class="label">配额设置（0 表示不限制）</span>
+        <el-form label-width="100px">
+          <el-form-item label="GPU 数量">
+            <el-input-number v-model="quotaForm.gpu" :min="0" :step="1" />
+          </el-form-item>
+          <el-form-item label="存储配额(GB)">
+            <el-input-number v-model="quotaForm.storage" :min="0" :step="10" />
+          </el-form-item>
+          <el-form-item label="最大项目数">
+            <el-input-number v-model="quotaForm.maxProjects" :min="0" :step="1" />
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="saveQuota">保存配额</el-button>
+          </el-form-item>
+        </el-form>
       </div>
     </el-card>
-    <el-card class="section">
-      <template #header>项目空间</template>
-      <DataTablePage title="项目空间" :data="projects">
-        <template #columns>
-          <el-table-column prop="name" label="项目名" min-width="140" />
-          <el-table-column prop="code" label="编码" min-width="100" />
-          <el-table-column prop="status" label="状态" min-width="100" />
-          <el-table-column prop="create_time" label="创建时间" min-width="180" />
-        </template>
-        <template #actions="{ row }">
-          <el-button link type="primary" @click="openProject(row.id)">打开</el-button>
-        </template>
-      </DataTablePage>
-    </el-card>
   </div>
 </template>