Sprava eventu a organizaci

src/components/organizations/OrganizationDetailSkeleton.vue

@@ -0,0 +1,9 @@
+<script setup>
+import BasicListSkeleton from "components/basicSkeletons/BasicListSkeleton.vue";
+</script>
+
+<template>
+  <q-card class="flight-detail-card">
+    <BasicListSkeleton :items-count-min="1" :items-count-max="5"/>
+  </q-card>
+</template>

src/components/organizations/OrganizationEditSkeleton.vue

@@ -0,0 +1,5 @@
+<script setup></script>
+
+<template>
+  <em>Copilot skeleton</em>
+</template>

src/components/organizations/OrganizationForm.vue

@@ -0,0 +1,43 @@
+<script setup>
+
+import {onMounted, reactive} from "vue";
+import {setDefaultData} from "src/composables/form/formHandling";
+import FormWrapper from "components/FormWrapper.vue";
+import {commonProps} from "src/composables/inputs";
+import {isRequestPending} from "src/composables/form/props";
+import {isRequired} from "src/composables/form/rules";
+import RichTextEditor from "components/inputs/RichTextEditor.vue";
+
+const props = defineProps({
+  event: {
+    type: Object
+  },
+  isRequestPending
+})
+
+const formData = reactive({
+  name: null,
+});
+
+const rules = {
+  name: [isRequired]
+}
+
+onMounted(() => {
+  if (props.event) {
+    setDefaultData(formData, props.event);
+  }
+})
+
+</script>
+
+<template>
+  <FormWrapper v-model="formData" :is-request-pending="props.isRequestPending">
+    <q-input
+      v-bind="commonProps"
+      label="Jméno"
+      :rules="rules.name"
+      v-model="formData.name"
+    />
+  </FormWrapper>
+</template>

src/components/organizations/OrganizationsList.vue

@@ -0,0 +1,36 @@
+<script setup>
+
+const props = defineProps({
+  items: {
+    type: Array,
+    required: true
+  },
+  myOrganizationsIds: {
+    type: Array,
+    required: false
+  }
+})
+
+</script>
+
+<template>
+  <q-list bordered separator>
+    <q-item
+      clickable
+      :to="{name: 'organizationDetail', params: {id: organization.id }}"
+      v-ripple
+      v-for="organization of items"
+      :key="organization"
+    >
+      <q-item-section avatar>
+        <q-avatar icon="groups" color="primary" text-color="white"/>
+      </q-item-section>
+      <q-item-section>
+        <q-item-label>
+          {{ organization.name }}
+          <q-icon name="star" color="gold" v-if="myOrganizationsIds.includes(organization.id)"/>
+        </q-item-label>
+      </q-item-section>
+    </q-item>
+  </q-list>
+</template>