ff-admin/src/views/admin/club/protocol/ProtocolProtocol.vue

52 lines
1.7 KiB
Vue
Raw Normal View History

2024-10-04 12:47:04 +02:00
<template>
<div class="flex flex-col gap-2 h-full w-full overflow-y-auto">
<Spinner v-if="loadingActive == 'loading'" class="mx-auto" />
<p v-else-if="loadingActive == 'failed'" @click="" class="cursor-pointer">&#8634; laden fehlgeschlagen</p>
2024-10-08 10:43:16 +02:00
<details class="flex flex-col gap-2 rounded-lg w-full justify-between border border-primary overflow-hidden">
<summary class="flex flex-row gap-2 bg-primary p-2 w-full justify-between items-center cursor-pointer">
<input type="text" name="title" id="title" placeholder="TOP" autocomplete="off" />
<svg
class="fill-white stroke-white opacity-75 w-4 h-4 -mr-1"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
>
<path d="M12.95 10.707l.707-.707L8 4.343 6.586 5.757 10.828 10l-4.242 4.243L8 15.657l4.95-4.95z" />
</svg>
</summary>
<QuillEditor
id="top"
theme="snow"
placeholder="TOP Inhalt..."
style="height: 250px; max-height: 250px; min-height: 250px"
contentType="html"
:toolbar="toolbarOptions"
/>
</details>
2024-10-04 12:47:04 +02:00
</div>
</template>
<script setup lang="ts">
import { defineComponent } from "vue";
import { mapActions, mapState } from "pinia";
import Spinner from "@/components/Spinner.vue";
import { useProtocolStore } from "@/stores/admin/protocol";
import { QuillEditor } from "@vueup/vue-quill";
import "@vueup/vue-quill/dist/vue-quill.snow.css";
import { toolbarOptions } from "@/helpers/quillConfig";
</script>
<script lang="ts">
export default defineComponent({
props: {
protocolId: String,
},
computed: {
...mapState(useProtocolStore, ["loadingActive"]),
},
mounted() {},
methods: {},
});
</script>