chuan/Cli-Proxy-API-Management-Center
1
0
Fork 0
mirror of https://github.com/router-for-me/Cli-Proxy-API-Management-Center.git synced 2026-02-03 03:10:50 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(api-keys): enhance API key display with new layout and styling

Browse Source
This commit is contained in:
Supra4E8C
2025-11-23 12:31:17 +08:00
parent 55c1cd84b3
commit ceddf7925f
2 changed files with 133 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
src/modules/api-keys.js
View File

@@ -26,27 +26,34 @@ export const apiKeysModule = {
return;
}
container.innerHTML = keys.map((key, index) => {
const rows = keys.map((key, index) => {
const normalizedKey = typeof key === 'string' ? key : String(key ?? '');
const maskedDisplay = this.escapeHtml(this.maskApiKey(normalizedKey));
const keyArgument = encodeURIComponent(normalizedKey);
return `
<div class="key-item">
<div class="item-content">
<div class="item-title">${i18n.t('api_keys.item_title')} #${index + 1}</div>
<div class="item-value">${maskedDisplay}</div>
</div>
<div class="item-actions">
<button class="btn btn-secondary" data-action="edit-api-key" data-index="${index}" data-key="${keyArgument}">
<i class="fas fa-edit"></i>
</button>
<button class="btn btn-danger" data-action="delete-api-key" data-index="${index}">
<i class="fas fa-trash"></i>
</button>
<div class="key-table-row">
<div class="key-badge">#${index + 1}</div>
<div class="key-table-value">
<div class="item-title">${i18n.t('api_keys.item_title')}</div>
<div class="key-value">${maskedDisplay}</div>
</div>
<div class="item-actions compact">
<button class="btn btn-secondary" data-action="edit-api-key" data-index="${index}" data-key="${keyArgument}">
<i class="fas fa-edit"></i>
</button>
<button class="btn btn-danger" data-action="delete-api-key" data-index="${index}">
<i class="fas fa-trash"></i>
</button>
</div>
</div>
`;
}).join('');
container.innerHTML = `
<div class="key-table">
${rows}
</div>
`;
}).join('');
this.bindApiKeyListEvents(container);
},