From 726e8a208aa858d2ff07f575154be0856a543973 Mon Sep 17 00:00:00 2001 From: gourav Date: Sat, 15 Jun 2024 23:41:54 +0530 Subject: [PATCH] added copy OTP feature --- frontend/src/assets/copy-icon.png | Bin 0 -> 13929 bytes frontend/src/components/SecretCard.vue | 50 +++++++++++++------------ 2 files changed, 26 insertions(+), 24 deletions(-) create mode 100644 frontend/src/assets/copy-icon.png diff --git a/frontend/src/assets/copy-icon.png b/frontend/src/assets/copy-icon.png new file mode 100644 index 0000000000000000000000000000000000000000..1379b8b03c5391a2e9a57f729e247cc0ea2ce67e GIT binary patch literal 13929 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 RS_pw3$JMS51$KVF{0G4CNE-kE literal 0 HcmV?d00001 diff --git a/frontend/src/components/SecretCard.vue b/frontend/src/components/SecretCard.vue index da86cc9..9f2a43b 100644 --- a/frontend/src/components/SecretCard.vue +++ b/frontend/src/components/SecretCard.vue @@ -3,13 +3,23 @@
{{ issuer }}
{{ username }}
- {{ generateTotp(secret) }} -
+ + ****** + {{ generateTotp(secret) }} + + @@ -26,9 +36,7 @@ export default { return { otp: 123456, notes: "", - remainingTime: 0, - timerWidth: 0, - totalTime: 30, + otpHidden: true, }; }, @@ -39,17 +47,19 @@ export default { this.remainingTime = remaining / 1000; this.timerWidth = remaining * 100; // console.log("hello"); + this.otp = otp; return otp; }, - startTimer() { - this.interval = setInterval(() => { - if (this.remainingTime > 0) { - this.timerWidth = (this.remainingTime / this.totalTime) * 10; - } else { - clearInterval(this.interval); - } - }, 100); + async copyOtp() { + await navigator.clipboard + .writeText(this.otp) + .then(() => { + console.log("copying successful"); + }) + .catch((err) => { + console.log("copy failed", err); + }); }, editSecret() { @@ -57,9 +67,7 @@ export default { }, }, - mounted() { - // this.startTimer(); - }, + mounted() {}, }; @@ -87,12 +95,6 @@ export default { font-size: 2rem; } -.timer { - /* width: 100%; */ - height: 3px; - background-color: green; -} - .card-top { display: flex; justify-content: space-between; @@ -104,7 +106,7 @@ export default { border: none; } -.edit-icon { +.button-icon { width: 16px; height: 16px; }