93 lines
3.1 KiB
Vue
93 lines
3.1 KiB
Vue
|
<script setup lang="ts">
|
|||
|
|
import { onMounted, 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('')
|
|||
|
|
|
|||
|
|
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 || {})
|
|||
|
|
} finally {
|
|||
|
|
loading.value = false
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
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}`)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
onMounted(load)
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<template>
|
|||
|
|
<div class="page">
|
|||
|
|
<el-page-header title="返回" @back="router.back()">
|
|||
|
|
<template #content>
|
|||
|
|
<span class="page-title">租户详情：{{ tenant?.name }}</span>
|
|||
|
|
</template>
|
|||
|
|
</el-page-header>
|
|||
|
|
<el-card class="section" v-loading="loading">
|
|||
|
|
<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="状态">{{ tenant?.status }}</el-descriptions-item>
|
|||
|
|
<el-descriptions-item label="创建时间">{{ tenant?.create_time }}</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>
|
|||
|
|
</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>
|
|||
|
|
|
|||
|
|
<style scoped lang="scss">
|
|||
|
|
.page { padding: 16px; }
|
|||
|
|
.section { margin-top: 16px; }
|
|||
|
|
.page-title { font-size: 16px; font-weight: 600; }
|
|||
|
|
.quota-edit { display: flex; flex-direction: column; gap: 12px; max-width: 480px; }
|
|||
|
|
.label { font-size: 13px; color: #606266; }
|
|||
|
|
</style>
|