From c86200e3916637bbbce0e5e840793feb78caa606 Mon Sep 17 00:00:00 2001
From: philipp lang <philipp@aweos.de>
Date: Tue, 16 Apr 2024 22:30:25 +0200
Subject: [PATCH] Lint

---
 src/EventForm.ce.vue | 128 +++++++++++++++++++++----------------------
 1 file changed, 61 insertions(+), 67 deletions(-)

diff --git a/src/EventForm.ce.vue b/src/EventForm.ce.vue
index 094f762..376aecb 100644
--- a/src/EventForm.ce.vue
+++ b/src/EventForm.ce.vue
@@ -4,77 +4,81 @@
             <div v-if="finished === false" class="bg-white @container rounded-lg shadow-lg">
                 <div class="sticky top-0 z-10 hidden @sm:flex overflow-hidden rounded-t-lg h-12 @md:h-16">
                     <template v-for="(section, index) in v.sections">
-                        <a href="#"
+                        <a
+                            href="#"
                             class="flex flex-col @md:flex-row items-center justify-center @md:justify-start px-2 flex-auto @md:pl-6 h-full transition duration-300 relative"
                             :class="{
                                 'bg-primary': index <= active,
                                 'bg-secondary': index > active,
-                            }" @click.prevent="active = index">
-                            <svg preserveAspectRatio="none"
+                            }"
+                            @click.prevent="active = index"
+                        >
+                            <svg
+                                preserveAspectRatio="none"
                                 class="h-full w-3 absolute left-0 text-primary transition duration-300"
-                                viewBox="0 0 100 100" :class="{
+                                viewBox="0 0 100 100"
+                                :class="{
                                     'opacity-100': index !== 0 && index - 1 <= active,
                                     'opacity-0': !(index !== 0 && index - 1 <= active),
-                                }">
+                                }"
+                            >
                                 <path d="M0,0 100,50 0,100" fill="currentColor"></path>
                             </svg>
-                            <span
-                                class="flex items-center justify-center w-4 @md:w-6 h-4 @md:h-6 rounded-full bg-circle text-font font-goudy transition duration-300"
-                                v-html="index + 1"></span>
+                            <span class="flex items-center justify-center w-4 @md:w-6 h-4 @md:h-6 rounded-full bg-circle text-font font-goudy transition duration-300" v-html="index + 1"></span>
                             <span class="text-sm text-font ml-2" v-html="section.name"></span>
                             <div v-if="editable" class="hidden @md:flex items-center h-full">
-                                <a href="#"
-                                    class="bg-edit rounded-full flex w-5 h-5 items-center justify-center text-font ml-2"
-                                    @click.prevent.stop="$emit('editSection', index)">
+                                <a href="#" class="bg-edit rounded-full flex w-5 h-5 items-center justify-center text-font ml-2" @click.prevent.stop="$emit('editSection', index)">
                                     <edit-icon class="w-3 h-3 fill-current"></edit-icon>
                                 </a>
-                                <a href="#"
-                                    class="bg-edit rounded-full flex w-5 h-5 items-center justify-center text-font ml-2"
-                                    @click.prevent.stop="$emit('deleteSection', index)">
+                                <a href="#" class="bg-edit rounded-full flex w-5 h-5 items-center justify-center text-font ml-2" @click.prevent.stop="$emit('deleteSection', index)">
                                     <delete-icon class="w-3 h-3 fill-current"></delete-icon>
                                 </a>
                             </div>
                         </a>
                     </template>
                     <div v-if="editable" class="hidden @md:flex items-center h-full absolute right-0 mr-6">
-                        <a href="#" class="bg-edit rounded-full flex w-5 h-5 items-center justify-center text-font"
-                            @click.prevent.stop="$emit('addSection')">
-                            <svg height="426.66667pt" viewBox="0 0 426.66667 426.66667" width="426.66667pt"
-                                xmlns="http://www.w3.org/2000/svg" class="w-3 h-3 fill-current">
+                        <a href="#" class="bg-edit rounded-full flex w-5 h-5 items-center justify-center text-font" @click.prevent.stop="$emit('addSection')">
+                            <svg height="426.66667pt" viewBox="0 0 426.66667 426.66667" width="426.66667pt" xmlns="http://www.w3.org/2000/svg" class="w-3 h-3 fill-current">
                                 <path
-                                    d="m405.332031 192h-170.664062v-170.667969c0-11.773437-9.558594-21.332031-21.335938-21.332031-11.773437 0-21.332031 9.558594-21.332031 21.332031v170.667969h-170.667969c-11.773437 0-21.332031 9.558594-21.332031 21.332031 0 11.777344 9.558594 21.335938 21.332031 21.335938h170.667969v170.664062c0 11.777344 9.558594 21.335938 21.332031 21.335938 11.777344 0 21.335938-9.558594 21.335938-21.335938v-170.664062h170.664062c11.777344 0 21.335938-9.558594 21.335938-21.335938 0-11.773437-9.558594-21.332031-21.335938-21.332031zm0 0" />
+                                    d="m405.332031 192h-170.664062v-170.667969c0-11.773437-9.558594-21.332031-21.335938-21.332031-11.773437 0-21.332031 9.558594-21.332031 21.332031v170.667969h-170.667969c-11.773437 0-21.332031 9.558594-21.332031 21.332031 0 11.777344 9.558594 21.335938 21.332031 21.335938h170.667969v170.664062c0 11.777344 9.558594 21.335938 21.332031 21.335938 11.777344 0 21.335938-9.558594 21.335938-21.335938v-170.664062h170.664062c11.777344 0 21.335938-9.558594 21.335938-21.335938 0-11.773437-9.558594-21.332031-21.335938-21.332031zm0 0"
+                                />
                             </svg>
                         </a>
                     </div>
                 </div>
                 <div class="flex items-center justify-between px-4 overflow-hidden rounded-t-lg @sm:hidden bg-secondary">
-                    <a href="#"
+                    <a
+                        href="#"
                         class="flex items-center justify-center w-7 h-7 flex-none rounded-full bg-circle text-font transition duration-300 flex-none"
-                        :class="{ 'opacity-40': !backable }" @click.prevent="back">
+                        :class="{'opacity-40': !backable}"
+                        @click.prevent="back"
+                    >
                         <svg class="text-sm text-font fill-current rotate-90 w-3 h-3" viewBox="0 0 11.314 7.0710001">
                             <path d="M 4.95,6.364 5.657,7.071 11.314,1.414 9.9,0 5.657,4.242 1.414,0 0,1.414 Z" />
                         </svg>
                     </a>
                     <div class="overflow-hidden">
                         <carousel v-model="active">
-                            <slide v-for="(section, index) in v.sections" :key="index"
-                                class="relative flex flex-no-wrap overflow-hidden">
+                            <slide v-for="(section, index) in v.sections" :key="index" class="relative flex flex-no-wrap overflow-hidden">
                                 <div class="flex-none w-full">
-                                    <div href="#"
+                                    <div
+                                        href="#"
                                         class="flex flex-col @md:flex-row items-center justify-center @md:justify-start px-2 flex-auto @md:pl-6 h-12 @md:h-16 transition duration-300 relative"
-                                        @click="active = index">
-                                        <span
-                                            class="flex items-center justify-center w-4 @md:w-6 h-4 @md:h-6 rounded-full bg-circle text-font transition duration-300"
-                                            v-html="index + 1"></span>
+                                        @click="active = index"
+                                    >
+                                        <span class="flex items-center justify-center w-4 @md:w-6 h-4 @md:h-6 rounded-full bg-circle text-font transition duration-300" v-html="index + 1"></span>
                                         <span class="text-sm text-font" v-html="section.name"></span>
                                     </div>
                                 </div>
                             </slide>
                         </carousel>
                     </div>
-                    <a href="#"
+                    <a
+                        href="#"
                         class="flex items-center justify-center w-7 h-7 flex-none rounded-full bg-circle text-font transition duration-300 flex-none"
-                        :class="{ 'opacity-40': !nextable }" @click.prevent="next">
+                        :class="{'opacity-40': !nextable}"
+                        @click.prevent="next"
+                    >
                         <svg class="text-sm text-font fill-current -rotate-90 w-3 h-3" viewBox="0 0 11.314 7.0710001">
                             <path d="M 4.95,6.364 5.657,7.071 11.314,1.414 9.9,0 5.657,4.242 1.414,0 0,1.414 Z" />
                         </svg>
@@ -85,28 +89,25 @@
                     <carousel v-model="active">
                         <slide v-for="(section, index) in v.sections" :key="index">
                             <div class="w-full flex-none px-3 @xs:px-6">
-                                <div class="text-sm sm_text-base text-gray-800 leading-tight mb-5" v-text="section.intro">
-                                </div>
+                                <div class="text-sm sm_text-base text-gray-800 leading-tight mb-5" v-text="section.intro"></div>
                                 <div class="grid grid-cols-2 @sm:grid-cols-4 @lg:grid-cols-6 gap-6 mt-6 items-start">
-                                    <div v-for="(field, findex) in section.fields" :key="findex"
-                                        class="flex justify-stretch relative group" :class="{
+                                    <div
+                                        v-for="(field, findex) in section.fields"
+                                        :key="findex"
+                                        class="flex justify-stretch relative group"
+                                        :class="{
                                             'hover:ring-edit hover:ring-4': editable,
                                             [colClasses.mobile[field.columns.mobile]]: true,
                                             [colClasses.tablet[field.columns.tablet]]: true,
                                             [colClasses.desktop[field.columns.desktop]]: true,
-                                        }">
-                                        <component :is="resolveComponentName(field)" v-model="payload[field.key]"
-                                            :fields="allFields" :payload="payload" :field="field" class="grow"></component>
-                                        <div v-if="editable"
-                                            class="right-0 top-0 -mr-2 -mt-2 absolute hidden space-x-2 group-hover:flex">
-                                            <a href="#"
-                                                class="bg-edit rounded-full flex w-5 h-5 items-center justify-center text-font ml-2"
-                                                @click.prevent.stop="$emit('editField', index, findex)">
+                                        }"
+                                    >
+                                        <component :is="resolveComponentName(field)" v-model="payload[field.key]" :fields="allFields" :payload="payload" :field="field" class="grow"></component>
+                                        <div v-if="editable" class="right-0 top-0 -mr-2 -mt-2 absolute hidden space-x-2 group-hover:flex">
+                                            <a href="#" class="bg-edit rounded-full flex w-5 h-5 items-center justify-center text-font ml-2" @click.prevent.stop="$emit('editField', index, findex)">
                                                 <edit-icon class="w-3 h-3 fill-current"></edit-icon>
                                             </a>
-                                            <a href="#"
-                                                class="bg-edit rounded-full flex w-5 h-5 items-center justify-center text-font ml-2"
-                                                @click.prevent.stop="$emit('deleteField', index, findex)">
+                                            <a href="#" class="bg-edit rounded-full flex w-5 h-5 items-center justify-center text-font ml-2" @click.prevent.stop="$emit('deleteField', index, findex)">
                                                 <delete-icon class="w-3 h-3 fill-current"></delete-icon>
                                             </a>
                                         </div>
@@ -114,13 +115,11 @@
                                 </div>
 
                                 <div v-if="editable" class="flex justify-center mt-6 relative">
-                                    <a href="#"
-                                        class="bg-edit rounded-full flex w-8 h-8 items-center justify-center text-font"
-                                        @click.prevent="$emit('addField', index)">
-                                        <svg height="426.66667pt" viewBox="0 0 426.66667 426.66667" width="426.66667pt"
-                                            xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 fill-current">
+                                    <a href="#" class="bg-edit rounded-full flex w-8 h-8 items-center justify-center text-font" @click.prevent="$emit('addField', index)">
+                                        <svg height="426.66667pt" viewBox="0 0 426.66667 426.66667" width="426.66667pt" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 fill-current">
                                             <path
-                                                d="m405.332031 192h-170.664062v-170.667969c0-11.773437-9.558594-21.332031-21.335938-21.332031-11.773437 0-21.332031 9.558594-21.332031 21.332031v170.667969h-170.667969c-11.773437 0-21.332031 9.558594-21.332031 21.332031 0 11.777344 9.558594 21.335938 21.332031 21.335938h170.667969v170.664062c0 11.777344 9.558594 21.335938 21.332031 21.335938 11.777344 0 21.335938-9.558594 21.335938-21.335938v-170.664062h170.664062c11.777344 0 21.335938-9.558594 21.335938-21.335938 0-11.773437-9.558594-21.332031-21.335938-21.332031zm0 0" />
+                                                d="m405.332031 192h-170.664062v-170.667969c0-11.773437-9.558594-21.332031-21.335938-21.332031-11.773437 0-21.332031 9.558594-21.332031 21.332031v170.667969h-170.667969c-11.773437 0-21.332031 9.558594-21.332031 21.332031 0 11.777344 9.558594 21.335938 21.332031 21.335938h170.667969v170.664062c0 11.777344 9.558594 21.335938 21.332031 21.335938 11.777344 0 21.335938-9.558594 21.335938-21.335938v-170.664062h170.664062c11.777344 0 21.335938-9.558594 21.335938-21.335938 0-11.773437-9.558594-21.332031-21.335938-21.332031zm0 0"
+                                            />
                                         </svg>
                                     </a>
                                 </div>
@@ -133,21 +132,16 @@
             </div>
             <div v-if="finished === true" class="mx-auto">
                 <div
-                    class="bg-white shadow-2xl ring-1 ring-gray-900/5 rounded-xl grid grid-cols-1 sm:grid-cols-[1fr_250px] grid-rows-[5rem_1fr] sm:grid-rows-[12rem_1fr] gap-6 overflow-hidden bg-gradient-to-bl from-white via-white to-black/10">
-                    <div
-                        class="bg-primary w-32 h-32 md:w-40 md:h-40 flex justify-center items-center [clip-path:circle(70%_at_30%_30%)]">
-                        <svg class="w-20 h-20 md:w-24 md:h-24 text-emerald-300 relative -left-3 -top-3"
-                            xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
-                            <path fill-rule="evenodd"
-                                d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z"
-                                clip-rule="evenodd" />
+                    class="bg-white shadow-2xl ring-1 ring-gray-900/5 rounded-xl grid grid-cols-1 sm:grid-cols-[1fr_250px] grid-rows-[5rem_1fr] sm:grid-rows-[12rem_1fr] gap-6 overflow-hidden bg-gradient-to-bl from-white via-white to-black/10"
+                >
+                    <div class="bg-primary w-32 h-32 md:w-40 md:h-40 flex justify-center items-center [clip-path:circle(70%_at_30%_30%)]">
+                        <svg class="w-20 h-20 md:w-24 md:h-24 text-emerald-300 relative -left-3 -top-3" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
+                            <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
                         </svg>
                     </div>
                     <div class="isolate self-center justify-self-end row-span-2 sm:pt-8 sm:pb-8 relative -right-3">
                         <div class="absolute right-0 top-0 h-full flex items-center justify-end">
-                            <div
-                                class="bg-primary w-96 h-96 flex [clip-path:circle(50%_at_110%_50%)] sm:[clip-path:circle(50%_at_80%_50%)]">
-                            </div>
+                            <div class="bg-primary w-96 h-96 flex [clip-path:circle(50%_at_110%_50%)] sm:[clip-path:circle(50%_at_80%_50%)]"></div>
                         </div>
                         <div class="overflow-hidden rounded-l-lg rotate-2 shadow relative z-10 -left-2">
                             <img class="w-64 h-32 object-cover" src="" />
@@ -166,8 +160,8 @@
 </template>
 
 <script setup>
-import { computed, ref, watch } from 'vue';
-import { Carousel, Slide } from 'vue3-carousel';
+import {computed, ref, watch} from 'vue';
+import {Carousel, Slide} from 'vue3-carousel';
 import Navigation from './components/Navigation.vue';
 import useNav from './composables/useNav.js';
 import EditIcon from './components/icons/EditIcon.vue';
@@ -175,7 +169,7 @@ import DeleteIcon from './components/icons/DeleteIcon.vue';
 import useToastify from './composables/useToastify.js';
 import useFields from './composables/useFields.js';
 
-const { success, errorFromResponse } = useToastify();
+const {success, errorFromResponse} = useToastify();
 const finished = ref(false);
 
 const emits = defineEmits(['addSection', 'editSection', 'deleteSection', 'addField', 'editField', 'deleteField', 'active']);
@@ -265,8 +259,8 @@ watch(
     (value) => reload(),
 );
 
-const { back, next, backable, nextable } = useNav(active, v.value.sections.length);
-const { resolveComponentName } = useFields();
+const {back, next, backable, nextable} = useNav(active, v.value.sections.length);
+const {resolveComponentName} = useFields();
 
 async function submit() {
     try {