feat: file upload

This commit is contained in:
Sebastian Pravda 2022-12-02 17:32:30 +01:00 committed by EETagent
parent 926a201f83
commit acda16ad1e
7 changed files with 113 additions and 25 deletions

View file

@ -1,5 +1,6 @@
import axios, { type AxiosProgressEvent } from 'axios';
import type { CandidateData, CandidateLogin } from 'src/stores/candidate';
import type { SubmissionProgress } from 'src/stores/portfolio';
import { API_URL, errorHandler } from '.';
export async function apiWhoami(): Promise<string> {
@ -48,17 +49,29 @@ export async function apiFetchDetails(): Promise<CandidateData> {
}
}
export async function apiFetchSubmissionProgress(): Promise<SubmissionProgress> {
try {
const res = await axios.get(API_URL + '/candidate/portfolio/submission_progress', { withCredentials: true });
return res.data;
} catch (e: any) {
throw errorHandler(e, 'Failed to fetch submission progress');
}
}
export async function apiUploadCoverLetter(
letter: File,
progressReporter: (progress: AxiosProgressEvent) => void
): Promise<boolean> {
try {
const res = await axios.post(
API_URL + '/candidate/cover_letter',
{ letter: letter },
{ withCredentials: true, onUploadProgress: progressReporter }
);
return res.data === 'true';
const res = await axios.post(API_URL + '/candidate/add/cover_letter', letter, {
withCredentials: true,
data: letter,
headers: {
'Content-Type': 'application/pdf',
},
onUploadProgress: progressReporter,
});
return true;
} catch (e: any) {
throw errorHandler(e, 'Failed to upload cover letter');
}
@ -69,14 +82,17 @@ export async function apiUploadPortfolioLetter(
progressReporter: (progress: AxiosProgressEvent) => void
): Promise<boolean> {
try {
const res = await axios.post(
API_URL + '/candidate/portfolio_letter',
{ letter: letter },
{ withCredentials: true, onUploadProgress: progressReporter }
);
return res.data === 'true';
const res = await axios.post(API_URL + '/candidate/add/portfolio_letter', letter, {
withCredentials: true,
data: letter,
headers: {
'Content-Type': 'application/pdf',
},
onUploadProgress: progressReporter,
});
return true;
} catch (e: any) {
throw errorHandler(e, 'Failed to upload portfolio letter');
throw errorHandler(e, 'Failed to upload cover letter');
}
}
@ -85,13 +101,16 @@ export async function apiUploadPortfolioZip(
progressReporter: (progress: AxiosProgressEvent) => void
): Promise<boolean> {
try {
const res = await axios.post(
API_URL + '/candidate/portfolio_zip',
{ portfolio: portfolio },
{ withCredentials: true, onUploadProgress: progressReporter }
);
return res.data === 'true';
const res = await axios.post(API_URL + '/candidate/add/portfolio_zip', portfolio, {
withCredentials: true,
data: portfolio,
headers: {
'Content-Type': 'application/zip',
},
onUploadProgress: progressReporter,
});
return true;
} catch (e: any) {
throw errorHandler(e, 'Failed to upload portfolio zip');
throw errorHandler(e, 'Failed to upload cover letter');
}
}

View file

@ -0,0 +1,20 @@
<script lang="ts">
import type { AxiosProgressEvent } from "axios";
import { apiUploadCoverLetter } from "../../../@api/candidate";
import DashboardUploadCard from "./DashboardUploadCard.svelte";
const onFileDrop = async (file: File) => {
await apiUploadCoverLetter(file, (progressEvent: AxiosProgressEvent) => {
console.log(progressEvent.progress)
});
}
</script>
<DashboardUploadCard
on:filedrop={e => onFileDrop(e.detail)}
title="Motivační dopis"
filetype="PDF"
filesize="10 MB">
</DashboardUploadCard>

View file

@ -1,5 +1,8 @@
<script lang="ts">
import FileType from './FileType.svelte';
import { createEventDispatcher } from 'svelte';
const dispatch = createEventDispatcher();
export let title: string;
export let filetype: 'PDF' | 'ZIP';
@ -30,6 +33,9 @@
const onFileDrop = (dropped: Dropped) => {
console.log(dropped);
if (dropped.accepted.length > 0) {
dispatch('filedrop', dropped.accepted[0]);
}
};
</script>
@ -44,7 +50,7 @@
<FileDrop
multiple={false}
maxSize={filetype == 'PDF' ? 100_000_000 : 10_000_000}
accept={filetype == 'PDF' ? 'application/pdf' : 'application/octet-stream'}
accept={filetype == 'PDF' ? 'application/pdf' : 'application/zip'}
on:filedrop={(e) => onFileDrop(e.detail.files)}
on:filedragenter={dashAnimationStart}
on:filedragleave={dashAnimationStop}

View file

@ -0,0 +1,20 @@
<script lang="ts">
import type { AxiosProgressEvent } from "axios";
import { apiUploadPortfolioLetter } from "../../../@api/candidate";
import DashboardUploadCard from "./DashboardUploadCard.svelte";
const onFileDrop = async (file: File) => {
await apiUploadPortfolioLetter(file, (progressEvent: AxiosProgressEvent) => {
console.log(progressEvent.loaded)
});
}
</script>
<DashboardUploadCard
on:filedrop={e => onFileDrop(e.detail)}
title="Portfolio"
filetype="PDF"
filesize="10 MB">
</DashboardUploadCard>

View file

@ -0,0 +1,20 @@
<script lang="ts">
import type { AxiosProgressEvent } from "axios";
import { apiUploadPortfolioZip } from "../../../@api/candidate";
import DashboardUploadCard from "./DashboardUploadCard.svelte";
const onFileDrop = async (file: File) => {
await apiUploadPortfolioZip(file, (progressEvent: AxiosProgressEvent) => {
console.log(progressEvent.loaded)
});
}
</script>
<DashboardUploadCard
on:filedrop={e => onFileDrop(e.detail)}
title="Další data"
filetype="ZIP"
filesize="100 MB">
</DashboardUploadCard>

View file

@ -7,6 +7,9 @@
import DashboardUploadCard from '$lib/components/dashboard/DashboardUploadCard.svelte';
import DashboardInfoCard from '$lib/components/dashboard/DashboardInfoCard.svelte';
import { candidateData, fetchDetails } from '../../stores/candidate';
import CoverLetterUploadCard from '$lib/components/dashboard/CoverLetterUploadCard.svelte';
import PortfolioLetterUploadCard from '$lib/components/dashboard/PortfolioLetterUploadCard.svelte';
import PortfolioZipUploadCard from '$lib/components/dashboard/PortfolioZipUploadCard.svelte';
let fullName = "";
@ -39,13 +42,13 @@
</DashboardInfoCard>
</div>
<div class="coverletter col-span-5">
<DashboardUploadCard title="Motivační dopis" filetype="PDF" filesize="10 MB" />
<CoverLetterUploadCard />
</div>
<div class="portfolio col-span-4">
<DashboardUploadCard title="Portfolio" filetype="PDF" filesize="10 MB" />
<PortfolioLetterUploadCard />
</div>
<div class="moreData col-span-4">
<DashboardUploadCard title="Další data" filetype="ZIP" filesize="100 MB" />
<PortfolioZipUploadCard />
</div>
</div>
<div class="dashboard dashboardMobile">

View file

@ -1,4 +1,4 @@
import { apiFetchSubmissionProgress } from "../api/candidate";
import { apiFetchSubmissionProgress } from "../@api/candidate";
import { writable } from "svelte/store";
export interface SubmissionProgress {