feat: managing sponsor images

Odyssey-Of-The-Mind-Poland · Oct 17, 2023 · 613c717 · 613c717
1 parent 7e5d802
commit 613c717
Show file tree

Hide file tree

Showing 10 changed files with 233 additions and 105 deletions.
diff --git a/odyseja-ui/src/lib/apiService.ts b/odyseja-ui/src/lib/apiService.ts
@@ -78,11 +78,11 @@ export async function del(path: string, succesText: string): Promise<any> {
     showHappyToast(succesText === undefined ? 'Usunięto pomyślnie' : succesText)
 }
 
-function showHappyToast(message: string) {
+export function showHappyToast(message: string) {
     showToast(message, 'variant-filled-tertiary')
 }
 
-function showSadToast(message: string) {
+export function showSadToast(message: string) {
     showToast(message, 'variant-filled-tertiary')
 }
 

diff --git a/odyseja-ui/src/lib/types.ts b/odyseja-ui/src/lib/types.ts
@@ -1,92 +1,91 @@
-
 export type Group = {
-  city: string;
-  problem: number;
-  age: number;
-  stage: number;
-  part: number;
-  league: string;
+    city: string;
+    problem: number;
+    age: number;
+    stage: number;
+    part: number;
+    league: string;
 }
 
 export function getGroupTitle(group: Group): string {
-  let name = `Scena: ${group.stage} • Problem ${group.problem} • Gr. wiekowa ${group.age}`;
-  if (group.part) {
-    name = `${name} • Część ${group.part}`;
-  }
+    let name = `Scena: ${group.stage} • Problem ${group.problem} • Gr. wiekowa ${group.age}`;
+    if (group.part) {
+        name = `${name} • Część ${group.part}`;
+    }
 
-  if (group.league) {
-    name = `${name} • Liga ${group.league}`;
-  }
-  return name;
+    if (group.league) {
+        name = `${name} • Liga ${group.league}`;
+    }
+    return name;
 }
 
 export function compareGroups(a: Group, b: Group): number {
-  if (a.problem < b.problem) return -1;
-  if (a.problem > b.problem) return 1;
+    if (a.problem < b.problem) return -1;
+    if (a.problem > b.problem) return 1;
 
-  if (a.age < b.age) return -1;
-  if (a.age > b.age) return 1;
+    if (a.age < b.age) return -1;
+    if (a.age > b.age) return 1;
 
-  if (a.stage < b.stage) return -1;
-  if (a.stage > b.stage) return 1;
+    if (a.stage < b.stage) return -1;
+    if (a.stage > b.stage) return 1;
 
-  if (a.part < b.part) return -1;
-  if (a.part > b.part) return 1;
+    if (a.part < b.part) return -1;
+    if (a.part > b.part) return 1;
 
-  if (a.league < b.league) return -1;
-  if (a.league > b.league) return 1;
+    if (a.league < b.league) return -1;
+    if (a.league > b.league) return 1;
 
-  return 0;
+    return 0;
 }
 
 export type Performance = {
-  id: number;
-  city: string;
-  team: string;
-  problem: number;
-  age: number;
-  stage: number;
-  performance: string;
-  spontan: string;
-  part: number;
-  performanceDay: string;
-  spontanDay: string;
-  league: string;
+    id: number;
+    city: string;
+    team: string;
+    problem: number;
+    age: number;
+    stage: number;
+    performance: string;
+    spontan: string;
+    part: number;
+    performanceDay: string;
+    spontanDay: string;
+    league: string;
 }
 
 export function comparePerformances(a: Performance, b: Performance): number {
-  if (a.id < b.id) return -1;
-  if (a.id > b.id) return 1;
+    if (a.id < b.id) return -1;
+    if (a.id > b.id) return 1;
 
-  return 0;
+    return 0;
 }
 
 
 export type PerformanceGroup = {
-  group: Group;
-  performances: Performance[];
+    group: Group;
+    performances: Performance[];
 }
 
 export type Timetable = {
-  timetable: PerformanceGroup[];
+    timetable: PerformanceGroup[];
 }
 
 export type Problems = {
-  problems: Problem[]
+    problems: Problem[]
 }
 
 export type Problem = {
-  id: number,
-  name: string
+    id: number,
+    name: string
 }
 
 export type Cities = {
     cities: City[]
 }
 
 export type City = {
-  id: number,
-  name: string
+    id: number,
+    name: string
 }
 
 export type Infos = {
@@ -95,27 +94,37 @@ export type Infos = {
 }
 
 export type Info = {
-  id: number,
-  infoName: string,
-  infoText: string,
-  city: number,
-  category: number,
-  sortNumber: number,
-  categoryName: string
+    id: number,
+    infoName: string,
+    infoText: string,
+    city: number,
+    category: number,
+    sortNumber: number,
+    categoryName: string
 }
 
 export type InfoCategory = {
-  id: number,
-  name: string,
+    id: number,
+    name: string,
 }
 
 export type Stages = {
-  stages: Stage[]
+    stages: Stage[]
 }
 
 export type Stage = {
-  id: number,
-  number: number,
-  city: number,
-  name: string
+    id: number,
+    number: number,
+    city: number,
+    name: string
+}
+
+export type Sponsors = {
+    sponsors: Sponsor[][]
 }
+
+export type Sponsor = {
+    id: number,
+    rowIndex: number,
+    columnIndex: number,
+}
diff --git a/odyseja-ui/src/routes/panel/+layout.svelte b/odyseja-ui/src/routes/panel/+layout.svelte
@@ -11,7 +11,8 @@
         {label: 'Problemy', route: '/panel/problem', icon: 'ic:round-format-list-bulleted'},
         {label: 'Informacje', route: '/panel/info', icon: 'ic:outline-info'},
         {label: 'Sceny', route: '/panel/stage', icon: 'ic:outline-curtains'},
-        {label: 'Miasta', route: '/panel/city', icon: 'ic:outline-curtains'}
+        {label: 'Miasta', route: '/panel/city', icon: 'ic:outline-curtains'},
+        {label: 'Sponsorzy', route: '/panel/sponsor', icon: 'ic:outline-curtains'}
     ];
 
     export let data: Cities

diff --git a/odyseja-ui/src/routes/panel/sponsor/+page.svelte b/odyseja-ui/src/routes/panel/sponsor/+page.svelte
@@ -0,0 +1,73 @@
+<script lang="ts">
+    import {BASE_URL, del, showSadToast} from "$lib/apiService";
+    import type {Sponsors} from "$lib/types";
+    import {fetchSponsors} from "./sponsorService";
+
+    export let data: Sponsors;
+
+    async function handleImageUpload(event: Event, index: number) {
+        const file = (event.target as HTMLInputElement).files[0];
+        if (file) {
+            const reader = new FileReader();
+            reader.onloadend = async () => {
+                if (typeof reader.result === "string") {
+                    await uploadImageToServer(file, index, 0);
+                }
+            };
+            reader.readAsDataURL(file);
+        }
+    }
+
+    async function uploadImageToServer(file, row, column) {
+        const formData = new FormData();
+        formData.append('image', file);
+        formData.append('row', row.toString());
+        formData.append('column', column.toString());
+
+        const response = await fetch(BASE_URL + '/sponsor', {
+            method: 'POST',
+            body: formData,
+        });
+
+        if (!response.ok) {
+            showSadToast('Coś poszło nie tak :c')
+            return;
+        }
+
+        data = await fetchSponsors();
+    }
+
+    async function deletePerformance(id: number) {
+        await del('/sponsor/' + id, 'Sponsor usunięty')
+        data = await fetchSponsors();
+    }
+
+</script>
+
+<h2 class="mb-6">Sponsorzy</h2>
+
+<main class="p-4">
+    <table class="w-full mt-4">
+        {#each data.sponsors as row, rowIndex}
+            <tr>
+                {#each row as sponsor}
+                    <td class="border p-2">
+                        <img src={BASE_URL + '/sponsor/' + sponsor.id} class="w-24"/>
+                        <button
+                                type="button"
+                                class="btn btn-md variant-filled-error ml-4"
+                                on:click={deletePerformance(sponsor.id)}>Usuń
+                        </button>
+                    </td>
+                {/each}
+                <td class="border p-2">
+                    <label class="bg-green-500 text-white px-4 py-2 rounded cursor-pointer">
+                        Add Image
+                        <input type="file" class="hidden" accept="image/*"
+                               on:change={(e) => handleImageUpload(e, rowIndex)}/>
+                    </label>
+                </td>
+            </tr>
+        {/each}
+    </table>
+</main>
diff --git a/odyseja-ui/src/routes/panel/sponsor/+page.ts b/odyseja-ui/src/routes/panel/sponsor/+page.ts
@@ -0,0 +1,8 @@
+import type {PageLoad} from './$types';
+import {fetchSponsors} from "./sponsorService";
+
+export const load = (({params}) => {
+    return fetchSponsors();
+}) satisfies PageLoad;
+
+
diff --git a/odyseja-ui/src/routes/panel/sponsor/sponsorService.ts b/odyseja-ui/src/routes/panel/sponsor/sponsorService.ts
@@ -0,0 +1,9 @@
+import {get} from "$lib/apiService";
+import type {Sponsor, Sponsors} from "$lib/types";
+
+export async function fetchSponsors(): Promise<Sponsors> {
+    const data = await get('/sponsor');
+    const sponsors = data as Sponsor[][];
+    sponsors.push([]);
+    return {sponsors: sponsors} as Sponsors;
+}
diff --git a/src/main/kotlin/odyseja/odysejapka/domain/Sponsor.kt b/src/main/kotlin/odyseja/odysejapka/domain/Sponsor.kt
@@ -2,5 +2,6 @@ package odyseja.odysejapka.domain
 
 data class Sponsor(
   val id: Int,
-  val name: String
+  val row: Int,
+  val column: Int
 )
diff --git a/src/main/kotlin/odyseja/odysejapka/domain/SponsorEntity.kt b/src/main/kotlin/odyseja/odysejapka/domain/SponsorEntity.kt
@@ -8,9 +8,17 @@ class SponsorEntity(
   @GeneratedValue(strategy = GenerationType.AUTO)
   @Column
   val id: Int,
-  @Column
-  val name: String,
   @Lob
   @Column(length = 10000)
-  val image: ByteArray
-)
+  val image: ByteArray,
+  @Column
+  val rowIndex: Int,
+  @Column
+  @GeneratedValue(strategy = GenerationType.AUTO)
+  val columnIndex: Int
+) {
+
+  fun toSponsor(): Sponsor {
+    return Sponsor(id, rowIndex, columnIndex)
+  }
+}