89 lines
2.9 KiB
Vue
89 lines
2.9 KiB
Vue
<template>
|
|
<BaseSetting title="Vereins Einstellungen" :submit-function="submit" v-slot="{ enableEdit }">
|
|
<div class="w-full">
|
|
<label for="clubname">Vereins-Name (optional)</label>
|
|
<input id="clubname" type="text" :readonly="!enableEdit" :value="clubSettings['club.name']" />
|
|
</div>
|
|
<div class="w-full">
|
|
<label for="imprint">Vereins-Impressum Link (optional)</label>
|
|
<input id="imprint" type="url" :readonly="!enableEdit" :value="clubSettings['club.imprint']" />
|
|
</div>
|
|
<div class="w-full">
|
|
<label for="privacy">Vereins-Datenschutz Link (optional)</label>
|
|
<input id="privacy" type="url" :readonly="!enableEdit" :value="clubSettings['club.privacy']" />
|
|
</div>
|
|
<div class="w-full">
|
|
<label for="website">Vereins-Webseite Link (optional)</label>
|
|
<input id="website" type="url" :readonly="!enableEdit" :value="clubSettings['club.website']" /></div
|
|
></BaseSetting>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { defineComponent } from "vue";
|
|
import { mapActions, mapState } from "pinia";
|
|
import { useSettingStore } from "@/stores/admin/management/setting";
|
|
import AppIcon from "@/components/AppIcon.vue";
|
|
import AppLogo from "@/components/AppLogo.vue";
|
|
import { useAbilityStore } from "@/stores/ability";
|
|
import type { SettingString } from "@/types/settingTypes";
|
|
import BaseSetting from "./BaseSetting.vue";
|
|
</script>
|
|
|
|
<script lang="ts">
|
|
export default defineComponent({
|
|
data() {
|
|
return {
|
|
overwriteIcon: false as boolean,
|
|
overwriteLogo: false as boolean,
|
|
};
|
|
},
|
|
computed: {
|
|
...mapState(useSettingStore, ["readByTopic"]),
|
|
...mapState(useAbilityStore, ["can"]),
|
|
clubSettings() {
|
|
return this.readByTopic("club");
|
|
},
|
|
},
|
|
methods: {
|
|
...mapActions(useSettingStore, ["updateSettings", "uploadImage"]),
|
|
previewImage(inputname: "icon" | "logo") {
|
|
let input = this.$refs[inputname] as HTMLInputElement;
|
|
let previewElement = this.$refs[inputname + "_img"] as HTMLImageElement;
|
|
if (input.files && input.files[0]) {
|
|
const reader = new FileReader();
|
|
|
|
reader.onload = function (e) {
|
|
previewElement.src = e.target?.result as string;
|
|
previewElement.style.display = "block";
|
|
};
|
|
|
|
reader.readAsDataURL(input.files[0]);
|
|
} else {
|
|
previewElement.src = "";
|
|
previewElement.style.display = "none";
|
|
}
|
|
},
|
|
submit(e: any) {
|
|
const formData = e.target.elements;
|
|
return this.updateSettings([
|
|
{
|
|
key: "club.name",
|
|
value: formData.clubname.value || null,
|
|
},
|
|
{
|
|
key: "club.imprint",
|
|
value: formData.imprint.value || null,
|
|
},
|
|
{
|
|
key: "club.privacy",
|
|
value: formData.privacy.value || null,
|
|
},
|
|
{
|
|
key: "club.website",
|
|
value: formData.website.value || null,
|
|
},
|
|
]);
|
|
},
|
|
},
|
|
});
|
|
</script>
|