add payment route + additional starting blocks

This commit is contained in:
Alexander Bocken 2023-07-24 22:57:12 +02:00
parent 4bcde97eb7
commit e25c0f9121
Signed by: Alexander
GPG Key ID: 1D237BE83F9B05E8
11 changed files with 215 additions and 2 deletions

View File

@ -0,0 +1,7 @@
<script>
export let payment;
</script>
<div>
<p>{payment.amount}</p>
<p>{payment.payee}</p>
</div>

View File

@ -31,7 +31,8 @@ export async function authenticateUser(cookies){
}
return {
username: decoded.username,
access: res.access
access: res.access,
_id: res._id.toString(),
}
}
else{

View File

@ -0,0 +1,7 @@
import { get_username } from '$lib/js/get_username';;
import type { Actions, PageServerLoad } from "./$types"
import { error } from "@sveltejs/kit"
export const load = (async ({cookies}) => {
return { user: await get_username(cookies) }
});

View File

@ -0,0 +1,20 @@
<script>
import Header from '$lib/components/Header.svelte'
import UserHeader from '$lib/components/UserHeader.svelte';
export let data
let username = ""
if(data.user){
username = data.user.username
}
</script>
<Header>
<ul class=site_header slot=links>
<li><a href="/rezepte">Rezepte</a></li>
<li><a href="/bilder">Bilder</a></li>
<li><a href="/git">Git</a></li>
<li><a href="/transmission">Transmission</a></li>
</ul>
<UserHeader {username} slot=right_side></UserHeader>
<slot></slot>
</Header>

View File

@ -0,0 +1,14 @@
import type { PageServerLoad } from "./$types";
export async function load({ fetch }) {
const res = await fetch(`/api/payments/items/10`, {method: "POST",
body: JSON.stringify({
start: 0
}),
headers: {
credentials: "include"
}
});
const item = await res.json();
return { ...item};
};

View File

@ -0,0 +1,11 @@
<script>
export let data;
console.log("DATA:", data)
console.log("payments:", data.payments)
import PaymentCard from "$lib/components/PaymentCard.svelte";
</script>
{#if data.payments}
{#each data.payments as payment}
<PaymentCard {payment}></PaymentCard>
{/each}
{/if}

View File

@ -0,0 +1,11 @@
import type { PageServerLoad } from "./$types";
export async function load({ fetch }) {
const res = await fetch(`/api/payments/payees`, {method: "GET",
headers: {
credentials: "include"
}
});
const item = await res.json();
return { ...item};
};

View File

@ -0,0 +1,78 @@
<script>
export let data;
import "$lib/css/form.css"
function simplify(e){
const res = eval(e.path[0].value)
if(res){
e.path[0].value = res
}
}
async function handleSubmit(event) {
event.preventDefault();
const formData = new FormData();
const form = event.target;
// Iterate through all form elements and append them to the FormData
for (const element of form.elements) {
// Check if the element is a file input
if (element.type === 'file') {
const fileInput = element;
if (fileInput.files.length === 0) {
console.log('No file selected.');
continue; // Skip to the next element
}
const file = fileInput.files[0];
formData.append('file', file);
} else if (element.name && element.value) {
// Append all other input elements (except file input) with non-empty values
formData.append(element.name, element.value);
}
}
// Now you can submit the form data to your API endpoint using fetch or any other method
try {
const response = await fetch('/api/payments/add', {
method: 'POST',
body: formData,
headers: {credentials : 'include'}
});
if (response.ok) {
console.log('Added successfully.');
} else {
console.error('Failed to add the payment.');
// Handle upload failure, if needed
}
} catch (error) {
console.error('Failed to add the payment:', error);
}
}
</script>
<form method="POST" action="?/add" on:submit|preventDefault={handleSubmit}>
<label>
Zahler
<select name="payee" id="">
{#each data.users as user}
<option value="{user.username}">{user.username}</option>
{/each}
</select>
</label>
<label>
Menge:
<input type="text" name="amount" required on:blur={simplify}>
</label>
<label>
Für sich selbst:
<input type="text" name="for_self" on:blur={simplify}>
</label>
<label>
Für den Anderen:
<input type="text" name="for_other" on:blur={simplify}>
</label>
<label>
Bild:
<input type="file" name="fileInput">
</label>
<button type=submit>Hinzufügen</button>
</form>

View File

@ -1,4 +1,6 @@
import { get_username } from '$lib/js/get_username';;
import type { Actions, PageServerLoad } from "./$types"
import { error } from "@sveltejs/kit"
export const load = (async ({cookies}) => {
return { user: await get_username(cookies) }

View File

@ -1 +0,0 @@
<h1>WIP</h1>

View File

@ -0,0 +1,63 @@
import type { RequestHandler } from '@sveltejs/kit';
import { Payment } from '../../../../models/Payment';
import { dbConnect, dbDisconnect } from '../../../../utils/db';
import { error } from '@sveltejs/kit';
import { authenticateUser } from '$lib/js/authenticate';;
import sharp from 'sharp';
import path from 'path';
import {IMAGE_DIR} from '$env/static/private';
export const POST: RequestHandler = async ({request, cookies}) => {
const user = await authenticateUser(cookies)
console.log(user)
if(!user){
throw error(401, "Not logged in")
}
if(!user.access.includes("abrechnung")){
throw error(401, "This user does not have permissions to add payments")
}
else{
const formData = await request.formData();
const json = {
amount: formData.get("amount"),
for_self: formData.get("for_self"),
for_other: formData.get("for_other"),
payee: formData.get("payee"),
added_by: user._id
}
await dbConnect();
let id;
try{
id = (await Payment.create(json))._id.toString();
} catch(e){
await dbDisconnect();
throw error(400, e)
}
await dbDisconnect();
const img = formData.get("file")
if(img){
console.log("IMG:", img)
const full_res = Buffer.from(await img.arrayBuffer())
await sharp(full_res)
.toFormat('webp')
.toFile(path.join(IMAGE_DIR,
"abrechnung",
"full",
id + '.webp'))
await sharp(full_res)
.resize({width: 20})
.toFormat('webp')
.toFile(path.join(IMAGE_DIR,
"abrechnung",
"placeholder",
id + '.webp'))
}
return new Response(JSON.stringify({message: "Added payment successfully"}),{
status: 200,
});
}
};