direv/admin_new
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(F006-W18): 申请APIKey弹窗表格细节优化

Browse Source 
1. 列名 客户名 → 公司名称 (Step1 + Step3 两处)
2. selection 选择框居中 (cell text-align center + padding 0)
3. 列宽重分配: 公司名称 min-width 200 左对齐, 联系人/电话居中
4. 表格圆角修复: 加 rr-apply-table class, border-radius 8px + overflow hidden
This commit is contained in:
Sisyphus 2026-07-10 10:54:55 +08:00
parent 4e525cf6dd
commit 8af8ed143d
1 changed files with 26 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/modules/openapi/ApplyApiKeyDialog.vue
View File

@ -129,7 +129,6 @@ async function submit() {
const res = await httpPost<ApplyResult[]>('/sys/openapi/app/apply', payload) const res = await httpPost<ApplyResult[]>('/sys/openapi/app/apply', payload)
result.value = Array.isArray(res) ? res : [] result.value = Array.isArray(res) ? res : []
ElMessage.success(`已为 ${result.value.length} 个客户生成 APIKey`) ElMessage.success(`已为 ${result.value.length} 个客户生成 APIKey`)
emit('refresh')
} catch (e: any) { } catch (e: any) {
ElMessage.error(e?.msg || e?.message || '申请失败') ElMessage.error(e?.msg || e?.message || '申请失败')
} finally { } finally {
@ -137,7 +136,7 @@ async function submit() {
} }
} }
function onClose() { updateVisible(false) } function onClose() { updateVisible(false); if (result.value) emit("refresh") }
async function copySecret(text: string) { async function copySecret(text: string) {
try { try {
@ -232,12 +231,13 @@ function notifyContact() {
:row-style="{ height: '36px' }" :row-style="{ height: '36px' }"
:cell-style="{ padding: '4px 8px', fontSize: '12.5px' }" :cell-style="{ padding: '4px 8px', fontSize: '12.5px' }"
:header-cell-style="{ padding: '6px 8px', fontSize: '12px', height: '32px', background: 'var(--surface-2)' }" :header-cell-style="{ padding: '6px 8px', fontSize: '12px', height: '32px', background: 'var(--surface-2)' }"
class="rr-apply-table"
@selection-change="onSelectionChange" @selection-change="onSelectionChange"
> >
<el-table-column type="selection" header-align="center" align="center" width="40" /> <el-table-column type="selection" header-align="center" align="center" width="48" />
<el-table-column prop="customerName" label="客户名" min-width="180" header-align="center" align="center" show-overflow-tooltip /> <el-table-column prop="customerName" label="公司名称" min-width="200" header-align="left" align="left" show-overflow-tooltip />
<el-table-column prop="contactName" label="联系人" width="100" align="center" /> <el-table-column prop="contactName" label="联系人" width="100" header-align="center" align="center" />
<el-table-column prop="contactPhone" label="联系电话" width="130" align="center" /> <el-table-column prop="contactPhone" label="联系电话" width="140" header-align="center" align="center" />
</el-table> </el-table>
</div> </div>
@ -330,8 +330,8 @@ function notifyContact() {
请立即复制 connectCode 和 appSecret!关弹窗后无法再次查看 请立即复制 connectCode 和 appSecret!关弹窗后无法再次查看
</el-alert> </el-alert>
<p>已为 {{ result.length }} 个客户生成 APIKey:</p> <p>已为 {{ result.length }} 个客户生成 APIKey:</p>
<el-table :data="result" border> <el-table :data="result" border class="rr-apply-table">
<el-table-column prop="customerName" label="客户名" width="160" /> <el-table-column prop="customerName" label="公司名称" width="160" />
<el-table-column prop="appId" label="AppID" width="280"> <el-table-column prop="appId" label="AppID" width="280">
<template #default="{ row }"> <template #default="{ row }">
<code>{{ row.appId }}</code> <code>{{ row.appId }}</code>
@ -478,4 +478,22 @@ function notifyContact() {
} }
.rr-code-accent { color: var(--red); font-family: ui-monospace, monospace; } .rr-code-accent { color: var(--red); font-family: ui-monospace, monospace; }
/* 弹窗内表格圆角 + 边框颜色统一 (修复圆角缺失) */
:deep(.rr-apply-dialog .rr-apply-table) {
border-radius: 8px;
overflow: hidden;
border: 1px solid var(--border) !important;
}
:deep(.rr-apply-dialog .rr-apply-table .el-table__inner-wrapper) {
border-radius: 8px;
}
/* selection 列 checkbox 居中 */
:deep(.rr-apply-dialog .rr-apply-table .el-table-column--selection .cell) {
text-align: center;
padding: 0;
}
:deep(.rr-apply-dialog .rr-apply-table th.el-table-column--selection .cell) {
text-align: center;
}
</style> </style>