357 lines
10 KiB
Vue
357 lines
10 KiB
Vue
<template>
|
|
<div>
|
|
<v-card-title class="text-h6 d-flex align-center pb-4">
|
|
<v-icon class="mr-2" color="primary">mdi-file-document-edit</v-icon>
|
|
EOI Management
|
|
</v-card-title>
|
|
<v-card-text class="pt-0">
|
|
|
|
<!-- EOI Documents Section -->
|
|
<div v-if="hasEOIDocuments" class="mb-4">
|
|
<div class="text-subtitle-1 mb-2">EOI Documents</div>
|
|
<div class="d-flex flex-wrap ga-2">
|
|
<v-chip
|
|
v-for="(doc, index) in eoiDocuments"
|
|
:key="index"
|
|
color="primary"
|
|
variant="tonal"
|
|
prepend-icon="mdi-file-pdf-box"
|
|
:href="doc.url"
|
|
target="_blank"
|
|
component="a"
|
|
clickable
|
|
closable
|
|
@click:close="removeDocument(index)"
|
|
>
|
|
{{ doc.title || `EOI Document ${index + 1}` }}
|
|
</v-chip>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Generate EOI Button - Only show if no documents uploaded -->
|
|
<div v-if="!hasEOI && !hasEOIDocuments" class="mb-4">
|
|
<v-btn
|
|
@click="generateEOI"
|
|
:loading="isGenerating"
|
|
color="primary"
|
|
variant="flat"
|
|
prepend-icon="mdi-file-document-plus"
|
|
>
|
|
Generate EOI
|
|
</v-btn>
|
|
</div>
|
|
|
|
<!-- Upload EOI Button -->
|
|
<div class="mb-4">
|
|
<v-btn
|
|
@click="showUploadDialog = true"
|
|
variant="outlined"
|
|
prepend-icon="mdi-upload"
|
|
:disabled="isUploading"
|
|
>
|
|
{{ hasEOI ? 'Upload Signed EOI' : 'Upload EOI Document' }}
|
|
</v-btn>
|
|
</div>
|
|
|
|
<!-- EOI Status Badge -->
|
|
<div v-if="hasEOI" class="mb-4 d-flex align-center">
|
|
<v-chip
|
|
:color="getStatusColor(interest['EOI Status'])"
|
|
variant="tonal"
|
|
prepend-icon="mdi-file-document-check"
|
|
>
|
|
{{ interest['EOI Status'] }}
|
|
</v-chip>
|
|
<span v-if="interest['EOI Time Sent']" class="text-caption text-grey-darken-1 ml-3">
|
|
Sent: {{ formatDate(interest['EOI Time Sent']) }}
|
|
</span>
|
|
</div>
|
|
|
|
<!-- Signature Links -->
|
|
<v-list v-if="hasEOI" density="comfortable">
|
|
<v-list-item class="mb-2">
|
|
<template v-slot:prepend>
|
|
<v-avatar color="primary" size="40">
|
|
<v-icon>mdi-account</v-icon>
|
|
</v-avatar>
|
|
</template>
|
|
<v-list-item-title>Client Signature Link</v-list-item-title>
|
|
<v-list-item-subtitle>{{ interest['Full Name'] }}</v-list-item-subtitle>
|
|
<template v-slot:append>
|
|
<v-btn
|
|
icon="mdi-content-copy"
|
|
variant="text"
|
|
@click="copyLink(interest['Signature Link Client'])"
|
|
></v-btn>
|
|
</template>
|
|
</v-list-item>
|
|
|
|
<v-list-item class="mb-2">
|
|
<template v-slot:prepend>
|
|
<v-avatar color="success" size="40">
|
|
<v-icon>mdi-account-check</v-icon>
|
|
</v-avatar>
|
|
</template>
|
|
<v-list-item-title>CC Signature Link</v-list-item-title>
|
|
<v-list-item-subtitle>Oscar Faragher</v-list-item-subtitle>
|
|
<template v-slot:append>
|
|
<v-btn
|
|
icon="mdi-content-copy"
|
|
variant="text"
|
|
@click="copyLink(interest['Signature Link CC'])"
|
|
></v-btn>
|
|
</template>
|
|
</v-list-item>
|
|
|
|
<v-list-item class="mb-2">
|
|
<template v-slot:prepend>
|
|
<v-avatar color="secondary" size="40">
|
|
<v-icon>mdi-account-tie</v-icon>
|
|
</v-avatar>
|
|
</template>
|
|
<v-list-item-title>Developer Signature Link</v-list-item-title>
|
|
<v-list-item-subtitle>David Mizrahi</v-list-item-subtitle>
|
|
<template v-slot:append>
|
|
<v-btn
|
|
icon="mdi-content-copy"
|
|
variant="text"
|
|
@click="copyLink(interest['Signature Link Developer'])"
|
|
></v-btn>
|
|
</template>
|
|
</v-list-item>
|
|
</v-list>
|
|
|
|
<!-- Regenerate Button -->
|
|
<div v-if="hasEOI && interest['EOI Status'] !== 'Signed'" class="mt-4">
|
|
<v-btn
|
|
@click="generateEOI"
|
|
:loading="isGenerating"
|
|
variant="text"
|
|
size="small"
|
|
prepend-icon="mdi-refresh"
|
|
>
|
|
Regenerate EOI
|
|
</v-btn>
|
|
</div>
|
|
</v-card-text>
|
|
|
|
<!-- Upload Dialog -->
|
|
<v-dialog v-model="showUploadDialog" max-width="500">
|
|
<v-card>
|
|
<v-card-title>Upload EOI Document</v-card-title>
|
|
<v-card-text>
|
|
<v-file-input
|
|
v-model="selectedFile"
|
|
label="Select EOI document (PDF)"
|
|
accept=".pdf"
|
|
prepend-icon="mdi-file-pdf-box"
|
|
variant="outlined"
|
|
density="comfortable"
|
|
:rules="[v => !!v || 'Please select a file']"
|
|
/>
|
|
</v-card-text>
|
|
<v-card-actions>
|
|
<v-spacer />
|
|
<v-btn @click="showUploadDialog = false">Cancel</v-btn>
|
|
<v-btn
|
|
color="primary"
|
|
variant="flat"
|
|
@click="handleUpload"
|
|
:loading="isUploading"
|
|
:disabled="!selectedFile"
|
|
>
|
|
Upload
|
|
</v-btn>
|
|
</v-card-actions>
|
|
</v-card>
|
|
</v-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import type { Interest } from '~/utils/types';
|
|
|
|
const props = defineProps<{
|
|
interest: Interest;
|
|
}>();
|
|
|
|
const emit = defineEmits<{
|
|
'eoi-generated': [data: { signingLinks: Record<string, string> }];
|
|
'update': [];
|
|
}>();
|
|
|
|
const toast = useToast();
|
|
const isGenerating = ref(false);
|
|
const showUploadDialog = ref(false);
|
|
const isUploading = ref(false);
|
|
const selectedFile = ref<File | null>(null);
|
|
|
|
const hasEOI = computed(() => {
|
|
return !!(props.interest['Signature Link Client'] ||
|
|
props.interest['Signature Link CC'] ||
|
|
props.interest['Signature Link Developer']);
|
|
});
|
|
|
|
const eoiDocuments = computed(() => {
|
|
return props.interest['EOI Document'] || [];
|
|
});
|
|
|
|
const hasEOIDocuments = computed(() => {
|
|
return eoiDocuments.value.length > 0;
|
|
});
|
|
|
|
const generateEOI = async (retryCount = 0) => {
|
|
isGenerating.value = true;
|
|
|
|
try {
|
|
const response = await $fetch<{
|
|
success: boolean;
|
|
documentId: string | number;
|
|
clientSigningUrl: string;
|
|
signingLinks: Record<string, string>;
|
|
}>('/api/email/generate-eoi-document', {
|
|
method: 'POST',
|
|
headers: {
|
|
'x-tag': '094ut234'
|
|
},
|
|
body: {
|
|
interestId: props.interest.Id.toString()
|
|
}
|
|
});
|
|
|
|
if (response.success) {
|
|
toast.success(response.documentId === 'existing'
|
|
? 'EOI already exists - signature links retrieved'
|
|
: 'EOI generated successfully');
|
|
|
|
emit('eoi-generated', { signingLinks: response.signingLinks });
|
|
emit('update'); // Trigger parent to refresh data
|
|
} else {
|
|
throw new Error('EOI generation failed');
|
|
}
|
|
} catch (error: any) {
|
|
console.error('Failed to generate EOI:', error);
|
|
|
|
// Retry logic
|
|
if (retryCount < 3) {
|
|
console.log(`Retrying EOI generation... Attempt ${retryCount + 2}/4`);
|
|
await new Promise(resolve => setTimeout(resolve, (retryCount + 1) * 1000));
|
|
return generateEOI(retryCount + 1);
|
|
}
|
|
|
|
// Show error message after all retries failed
|
|
toast.error(error.data?.statusMessage || error.message || 'Failed to generate EOI after multiple attempts');
|
|
} finally {
|
|
isGenerating.value = false;
|
|
}
|
|
};
|
|
|
|
const copyLink = async (link: string | undefined) => {
|
|
if (!link) return;
|
|
|
|
try {
|
|
await navigator.clipboard.writeText(link);
|
|
toast.success('Signature link copied to clipboard');
|
|
|
|
// Update EOI Time Sent if not already set
|
|
if (!props.interest['EOI Time Sent']) {
|
|
try {
|
|
await $fetch('/api/update-interest', {
|
|
method: 'POST',
|
|
headers: {
|
|
'x-tag': '094ut234'
|
|
},
|
|
body: {
|
|
id: props.interest.Id.toString(),
|
|
data: {
|
|
'EOI Time Sent': new Date().toISOString()
|
|
}
|
|
}
|
|
});
|
|
emit('update'); // Refresh parent data
|
|
} catch (error) {
|
|
console.error('Failed to update EOI Time Sent:', error);
|
|
}
|
|
}
|
|
} catch (error) {
|
|
toast.error('Failed to copy link');
|
|
}
|
|
};
|
|
|
|
const formatDate = (dateString: string) => {
|
|
if (!dateString) return '';
|
|
|
|
try {
|
|
const date = new Date(dateString);
|
|
// Check if date is valid
|
|
if (isNaN(date.getTime())) {
|
|
return dateString; // Return original if parsing fails
|
|
}
|
|
|
|
return date.toLocaleString('en-GB', {
|
|
day: '2-digit',
|
|
month: '2-digit',
|
|
year: 'numeric',
|
|
hour: '2-digit',
|
|
minute: '2-digit',
|
|
hour12: false
|
|
});
|
|
} catch (error) {
|
|
console.error('Date formatting error:', error);
|
|
return dateString;
|
|
}
|
|
};
|
|
|
|
const getStatusColor = (status: string) => {
|
|
switch (status) {
|
|
case 'Waiting for Signatures':
|
|
return 'warning';
|
|
case 'Signed':
|
|
return 'success';
|
|
default:
|
|
return 'grey';
|
|
}
|
|
};
|
|
|
|
const removeDocument = async (index: number) => {
|
|
// For now, we'll just show a message since removing documents
|
|
// would require updating the database
|
|
toast.warning('Document removal is not yet implemented');
|
|
};
|
|
|
|
const uploadEOI = async (file: File) => {
|
|
isUploading.value = true;
|
|
|
|
try {
|
|
const formData = new FormData();
|
|
formData.append('file', file);
|
|
|
|
const response = await $fetch<{ success: boolean; document: any; message: string }>('/api/eoi/upload-document', {
|
|
method: 'POST',
|
|
query: {
|
|
interestId: props.interest.Id.toString()
|
|
},
|
|
body: formData
|
|
});
|
|
|
|
if (response.success) {
|
|
toast.success('EOI document uploaded successfully');
|
|
showUploadDialog.value = false;
|
|
selectedFile.value = null; // Reset file selection
|
|
emit('update'); // Refresh parent data
|
|
}
|
|
} catch (error: any) {
|
|
console.error('Failed to upload EOI:', error);
|
|
toast.error(error.data?.statusMessage || 'Failed to upload EOI document');
|
|
} finally {
|
|
isUploading.value = false;
|
|
}
|
|
};
|
|
|
|
const handleUpload = () => {
|
|
if (selectedFile.value) {
|
|
uploadEOI(selectedFile.value);
|
|
}
|
|
};
|
|
</script>
|