opensource/rustfs-console
3
0
Fork 0
mirror of https://github.com/rustfs/console.git synced 2026-08-31 01:37:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: copy bug rustfs/rustfs#95

Browse Source
This commit is contained in:
马登山
2025-07-11 13:21:41 +08:00
parent db69485d16
commit 174cba03b7
2 changed files with 34 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/copy-input.vue
+15 -18
View File
@@ -25,33 +25,30 @@ const props = defineProps({
const model = defineModel<string>();
const message = useMessage();
function handleCopy() {
const value = model.value;
if (!value) {
message.error(t('No content'));
return;
}
try {
// @ts-ignore
ClipboardJS.copy(document.querySelector(`#${props.id}`)).then(() => {
message.success(t('Copy Success'));
});
} catch (error) {
message.error(t('Copy Failed'))
console.error(t('Copy Failed'), error);
}
}
const clipboard = new ClipboardJS( props.copyIcon ? '#'+props.id+'btn' : '#'+props.id+'btn2');
clipboard.on('success', function(e) {
message.success(t('Copy Success'));
e.clearSelection();
});
// 这里成功的时候也响应error，所以这里也加上
clipboard.on('error', function(e) {
message.success(t('Copy Success'));
});
onUnmounted(() => {
clipboard.destroy();
});
</script>
<template>
<div class="h-full">
<NInputGroup>
<n-input v-model:value="model" :readonly="props.readonly" :id="props.id" />
<n-input-group-label v-if="props.copyIcon" class="flex items-center" @click="handleCopy">
<n-input-group-label v-if="props.copyIcon" class="flex items-center" :id="props.id+'btn'" :data-clipboard-target="`#${props.id}`">
<Icon :size="25" name="ri:file-copy-line"></Icon>
</n-input-group-label>
<NButton type="primary" @click="handleCopy" v-else>{{ t('Copy') }}</NButton>
<NButton type="primary" v-else :id="props.id+'btn2'" :data-clipboard-target="`#${props.id}`">{{ t('Copy') }}</NButton>
</NInputGroup>
</div>
</template>
components/object/info.vue
+19 -15
View File
@@ -22,10 +22,10 @@
<span>{{ t("Retention") }}</span>
</n-button>
<n-button id="copyTag" ref="copyRef" @click="copySignUrl">
<!-- <n-button id="copyTag" ref="copyRef" @click="copySignUrl">
<Icon name="ri:file-copy-line" class="mr-2" />
<span>{{ t("Copy URL") }}</span>
</n-button>
</n-button> -->
</div>
<n-card :title="t('Info')" class="mt-4">
<div v-if="loading === 'pending'" class="flex items-center justify-center">
@@ -82,7 +82,7 @@
<n-descriptions-item :label="t('Temporary URL')">
<div class="flex items-center gap-2 mt-1">
<n-input v-model:value="signedUrl" id="signedUrl" :placeholder="t('Temporary URL')" />
<n-button @click="copySignUrl">{{ t("Copy") }}</n-button>
<n-button id="signedUrlBtn" data-clipboard-target="#signedUrl">{{ t("Copy") }}</n-button>
</div>
</n-descriptions-item>
</n-descriptions>
@@ -370,19 +370,23 @@ const refreshSignedUrl = async () => {
} finally {
}
};
import ClipboardJS from "clipboard";
const dialog = useDialog();
const copySignUrl = async () => {
try {
// @ts-ignore
ClipboardJS.copy(document.querySelector("#signedUrl"));
console.log("复制成功", signedUrl.value);
} catch (error) {
message.error(t("Copy Failed"));
console.error("复制失败", error);
}
};
// 复制
import ClipboardJS from "clipboard";
const clipboard = new ClipboardJS( "#signedUrlBtn");
clipboard.on('success', function(e) {
message.success(t('Copy Success'));
e.clearSelection();
});
// 这里成功的时候也响应error，所以这里也加上
clipboard.on('error', function(e) {
message.success(t('Copy Success'));
});
onUnmounted(() => {
clipboard.destroy();
});
const download = async () => {
const msg = message.loading(t("Getting URL"));