chaulmark/mad-lawsuit
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add Copy Link button to PDF viewer

Browse source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
chaulmark 2026-05-23 12:43:59 -06:00
parent 8bc2a45e39
commit 13e7d23e0a
1 changed files with 22 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
resources/js/Components/PDFViewer.vue
View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { watch } from 'vue';
import { watch, ref } from 'vue';
interface Props {
isOpen: boolean;
@ -12,7 +12,8 @@ const emit = defineEmits<{
close: [];
}>();
// Handle body scroll lock when modal is open
const copied = ref(false);
watch(() => props.isOpen, (isOpen) => {
if (isOpen) {
document.body.style.overflow = 'hidden';
@ -30,6 +31,13 @@ const handleBackdropClick = (e: MouseEvent) => {
const handleDownload = () => {
window.open(props.documentUrl, '_blank');
};
const handleCopyLink = async () => {
const url = new URL(props.documentUrl, window.location.origin).href;
await navigator.clipboard.writeText(url);
copied.value = true;
setTimeout(() => { copied.value = false; }, 2000);
};
</script>
<template>
@ -53,6 +61,18 @@ const handleDownload = () => {
</h2>
</div>
<div class="flex items-center gap-2">
<button
@click="handleCopyLink"
class="flex items-center gap-2 px-4 py-2 bg-[#7CAE7A] text-white rounded-md hover:bg-[#6b9c69] transition-colors text-sm font-medium"
>
<svg v-if="!copied" class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1" />
</svg>
<svg v-else class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
{{ copied ? '✓ Copied!' : 'Copy Link' }}
</button>
<button
@click="handleDownload"
class="flex items-center gap-2 px-4 py-2 bg-[#7CAE7A] text-white rounded-md hover:bg-[#6b9c69] transition-colors text-sm font-medium"