✨ feat(tokens-table): add selectable copy modes for bulk token copy action
This commit enhances the “Copy Selected Tokens to Clipboard” feature in `TokensTable.js` by introducing a user-friendly modal that lets users choose how they want to copy tokens. Changes made • Replaced direct copy logic with a `Modal.info` dialog. • Modal displays the prompt “Please choose your copy mode”. • Added two buttons in a custom footer: – **Name + Secret**: copies `tokenName sk-tokenKey`. – **Secret Only**: copies `sk-tokenKey`. • Each button triggers the copy operation and closes the dialog. • Maintains existing validations (e.g., selection check, clipboard feedback). Benefits • Gives users clear control over copy format, reducing manual editing. • Aligns UI with Semi UI’s best practices via custom modal footer. No backend/API changes are involved; all updates are limited to the front-end UI logic.
This commit is contained in:
@@ -639,20 +639,53 @@ const TokensTable = () => {
|
||||
type="warning"
|
||||
icon={<IconCopy />}
|
||||
className="!rounded-full flex-1 md:flex-initial"
|
||||
onClick={async () => {
|
||||
onClick={() => {
|
||||
if (selectedKeys.length === 0) {
|
||||
showError(t('请至少选择一个令牌!'));
|
||||
return;
|
||||
}
|
||||
let keys = '';
|
||||
for (let i = 0; i < selectedKeys.length; i++) {
|
||||
keys +=
|
||||
selectedKeys[i].name + ' sk-' + selectedKeys[i].key + '\n';
|
||||
}
|
||||
await copyText(keys);
|
||||
Modal.info({
|
||||
title: t('复制令牌'),
|
||||
icon: null,
|
||||
content: t('请选择你的复制方式'),
|
||||
footer: (
|
||||
<Space>
|
||||
<Button
|
||||
type="primary"
|
||||
theme="solid"
|
||||
icon={<IconCopy />}
|
||||
onClick={async () => {
|
||||
let content = '';
|
||||
for (let i = 0; i < selectedKeys.length; i++) {
|
||||
content +=
|
||||
selectedKeys[i].name + ' sk-' + selectedKeys[i].key + '\n';
|
||||
}
|
||||
await copyText(content);
|
||||
Modal.destroyAll();
|
||||
}}
|
||||
>
|
||||
{t('名称+密钥')}
|
||||
</Button>
|
||||
<Button
|
||||
theme="light"
|
||||
icon={<IconCopy />}
|
||||
onClick={async () => {
|
||||
let content = '';
|
||||
for (let i = 0; i < selectedKeys.length; i++) {
|
||||
content += 'sk-' + selectedKeys[i].key + '\n';
|
||||
}
|
||||
await copyText(content);
|
||||
Modal.destroyAll();
|
||||
}}
|
||||
>
|
||||
{t('仅密钥')}
|
||||
</Button>
|
||||
</Space>
|
||||
),
|
||||
});
|
||||
}}
|
||||
>
|
||||
{t('复制所选令牌到剪贴板')}
|
||||
{t('复制所选令牌')}
|
||||
</Button>
|
||||
<div className="w-full md:hidden"></div>
|
||||
<Button
|
||||
|
||||
@@ -813,13 +813,16 @@
|
||||
"复制所选令牌": "Copy selected token",
|
||||
"请至少选择一个令牌!": "Please select at least one token!",
|
||||
"管理员未设置查询页链接": "The administrator has not set the query page link",
|
||||
"复制所选令牌到剪贴板": "Copy selected token to clipboard",
|
||||
"批量删除令牌": "Batch delete token",
|
||||
"确定要删除所选的 {{count}} 个令牌吗?": "Are you sure you want to delete the selected {{count}} tokens?",
|
||||
"删除所选令牌": "Delete selected token",
|
||||
"请先选择要删除的令牌!": "Please select the token to be deleted!",
|
||||
"已删除 {{count}} 个令牌!": "Deleted {{count}} tokens!",
|
||||
"删除失败": "Delete failed",
|
||||
"复制令牌": "Copy token",
|
||||
"请选择你的复制方式": "Please select your copy method",
|
||||
"名称+密钥": "Name + key",
|
||||
"仅密钥": "Only key",
|
||||
"查看API地址": "View API address",
|
||||
"打开查询页": "Open query page",
|
||||
"时间(仅显示近3天)": "Time (only displays the last 3 days)",
|
||||
|
||||
Reference in New Issue
Block a user